UDI
/
udi-spms-vue
1
0
Fork 0
Code Issues Pull Requests Packages Projects Releases Wiki Activity

解决登录输入框样式覆盖问题

Browse Source
ywj_dev
CTP 2 years ago
parent b7db354fee
commit 33904345ac
3 changed files with 99 additions and 71 deletions
Show Stats Download Patch File Download Diff File

162
src/views/myLogin.vue
Unescape Escape View File

@ -17,31 +17,59 @@
label-position="left" label-position="left"
> >
<el-card class="box-card"> <el-card class="box-card">
<div style="text-align: center; margin-top: 10px;margin-bottom: 15px"> <div style="text-align: center; margin-top: 10px; margin-bottom: 15px">
<img alt="element-logo" src="@/assets/logo/logo.png"/> <img alt="element-logo" src="@/assets/logo/logo.png" />
</div> </div>
<h3 class="title">用户登录</h3> <h3 class="title">用户登录</h3>
<el-form-item prop="username" class="item" style="margin-top: -20px"> <el-form-item prop="username" class="item" style="margin-top: -20px">
<el-input prefix-icon="el-icon-user" placeholder="账号" name="username" autocomplete="on" v-model="loginForm.username"> <el-input
prefix-icon="el-icon-user"
placeholder="账号"
name="username"
autocomplete="on"
v-model="loginForm.username"
>
<i slot="prefix" class="el-input__icon"> <i slot="prefix" class="el-input__icon">
<icon-svg icon-class="user"/> <icon-svg icon-class="user" />
</i> </i>
</el-input> </el-input>
</el-form-item> </el-form-item>
<el-form-item prop="password" class="item"> <el-form-item prop="password" class="item">
<el-input prefix-icon="el-icon-s-goods" placeholder="密码" name="password" :type="isShowPwd ? 'text' : 'password'" @keyup.enter.native="handleLogin" <el-input
v-model="loginForm.password" autocomplete="on"> prefix-icon="el-icon-s-goods"
placeholder="密码"
name="password"
:type="isShowPwd ? 'text' : 'password'"
@keyup.enter.native="handleLogin"
v-model="loginForm.password"
autocomplete="on"
>
<i slot="prefix" class="el-input__icon"> <i slot="prefix" class="el-input__icon">
<icon-svg icon-class="pwd"/> <icon-svg icon-class="pwd" />
</i> </i>
<i slot="suffix" class="el-input__icon" @click="isShowPwd = !isShowPwd"> <i
<icon-svg icon-class="eye"/> slot="suffix"
class="el-input__icon"
@click="isShowPwd = !isShowPwd"
>
<icon-svg icon-class="eye" />
</i> </i>
</el-input> </el-input>
</el-form-item> </el-form-item>
<el-form-item prop="verificationCode" class="item" style="background-color: white"> <el-form-item
<Verify ref="checkV" :showButton="false" :barSize="{width:'305px',height:'37px'}" :vOffset="5" prop="verificationCode"
@success="verifyAlert('success')" @error="verifyAlert('error')" :type="3"></Verify> class="item"
style="background-color: white"
>
<Verify
ref="checkV"
:showButton="false"
:barSize="{ width: '305px', height: '37px' }"
:vOffset="5"
@success="verifyAlert('success')"
@error="verifyAlert('error')"
:type="3"
></Verify>
</el-form-item> </el-form-item>
<div style="text-align: center; margin-top: 15px"> <div style="text-align: center; margin-top: 15px">
<el-button <el-button
@ -49,49 +77,48 @@
style="width: 60%; margin-bottom: 30px" style="width: 60%; margin-bottom: 30px"
:loading="loading" :loading="loading"
@click.native="handleLogin()" @click.native="handleLogin()"
>登录 >登录
</el-button> </el-button>
</div> </div>
<div style="margin-top: -15px"> <div style="margin-top: -15px">
<a style="margin-left: 50%; font-size: 12px" :href="'#/register'" <a style="margin-left: 50%; font-size: 12px" :href="'#/register'"
>新用户注册</a >新用户注册</a
> >
<a style="margin-left: 5%; font-size: 12px" :href="'#/forgetPasswd'" <a style="margin-left: 5%; font-size: 12px" :href="'#/forgetPasswd'"
>忘记密码</a >忘记密码</a
> >
</div> </div>
</el-card> </el-card>
</el-form> </el-form>
<div style=" <div
position: absolute; style="
bottom: 0; position: absolute;
margin-left: 36%; bottom: 0;
font-size: 18px; margin-left: 36%;
color: white; font-size: 18px;
"> color: white;
"
>
<a href="http://www.xmglxp.com/" target="_blank"> <a href="http://www.xmglxp.com/" target="_blank">
软件名称: 医院UDI管理系统 软件名称: 医院UDI管理系统
</a> </a>
<a href="http://www.xmglxp.com/" target="_blank" style="margin-left: 20px; font-size: 12px"> <a
开发单位：厦门高立新鹏软件科技有限公司 技术支持：400-990-9112 href="http://www.xmglxp.com/"
target="_blank"
style="margin-left: 20px; font-size: 12px"
>
开发单位：厦门高立新鹏软件科技有限公司 技术支持：400-990-9112
</a> </a>
</div> </div>
</div> </div>
</template> </template>
<script> <script>
import Verify from 'vue2-verify' import Verify from "vue2-verify";
import axios from "axios"; import axios from "axios";
import Cookies from "js-cookie"; import Cookies from "js-cookie";
import {decrypt, encrypt} from "@/utils/jsencrypt"; import { decrypt, encrypt } from "@/utils/jsencrypt";
export default { export default {
data() { data() {
@ -107,7 +134,7 @@ export default {
userName: "", userName: "",
pwd: "", pwd: "",
checked: true, checked: true,
verificationCode: false verificationCode: false,
}, },
loginForm: { loginForm: {
username: "", username: "",
@ -115,13 +142,13 @@ export default {
rememberMe: false, rememberMe: false,
verificationCode: false, verificationCode: false,
code: "", code: "",
uuid: "" uuid: "",
}, },
rules: { rules: {
userName: [ userName: [
{required: true, message: "请输入登录名", trigger: "blur"}, { required: true, message: "请输入登录名", trigger: "blur" },
], ],
pwd: [{validator: validatePwd, trigger: "blur"}], pwd: [{ validator: validatePwd, trigger: "blur" }],
}, },
isShowPwd: false, // 是否显示密码 isShowPwd: false, // 是否显示密码
loading: false, // 登录loading loading: false, // 登录loading
@ -132,9 +159,9 @@ export default {
}, },
methods: { methods: {
verifyAlert(text) { verifyAlert(text) {
if (text === 'success') { if (text === "success") {
this.loginForm.verificationCode = true; this.loginForm.verificationCode = true;
}else{ } else {
this.loginForm.verificationCode = false; this.loginForm.verificationCode = false;
} }
}, },
@ -183,47 +210,53 @@ export default {
// }); // });
// }, // },
getCookie() { getCookie() {
const username = Cookies.get("username"); const username = Cookies.get("username");
const password = Cookies.get("password"); const password = Cookies.get("password");
// const rememberMe = Cookies.get('rememberMe') // const rememberMe = Cookies.get('rememberMe')
this.loginForm = { this.loginForm = {
username: username === undefined ? this.loginForm.username : username, username: username === undefined ? this.loginForm.username : username,
password: password === undefined ? this.loginForm.password : decrypt(password), password:
password === undefined ? this.loginForm.password : decrypt(password),
// rememberMe: rememberMe === undefined ? false : Boolean(rememberMe) // rememberMe: rememberMe === undefined ? false : Boolean(rememberMe)
}; };
}, },
handleLogin() { handleLogin() {
this.$refs.ruleForm.validate(valid => { this.$refs.ruleForm.validate((valid) => {
if (valid) { if (valid) {
this.loading = true; this.loading = true;
if (this.loginForm.rememberMe) { if (this.loginForm.rememberMe) {
Cookies.set("username", this.loginForm.username, {expires: 30}); Cookies.set("username", this.loginForm.username, { expires: 30 });
Cookies.set("password", encrypt(this.loginForm.password), {expires: 30}); Cookies.set("password", encrypt(this.loginForm.password), {
expires: 30,
});
// Cookies.set('rememberMe', this.loginForm.rememberMe, {expires: 30}); // Cookies.set('rememberMe', this.loginForm.rememberMe, {expires: 30});
} else { } else {
Cookies.remove("username"); Cookies.remove("username");
Cookies.remove("password"); Cookies.remove("password");
// Cookies.remove('rememberMe'); // Cookies.remove('rememberMe');
} }
this.$store.dispatch("Login", this.loginForm).then((res) => { this.$store
this.$router.push({path: this.redirect || "/"}).catch((res) => { .dispatch("Login", this.loginForm)
.then((res) => {
this.$router
.push({ path: this.redirect || "/" })
.catch((res) => {});
})
.catch((res) => {
this.loading = false;
this.$refs.checkV.refresh();
this.$message.error(res);
if (this.captchaEnabled) {
this.getCode();
}
}); });
}).catch((res) => {
this.loading = false;
this.$refs.checkV.refresh();
this.$message.error(res);
if (this.captchaEnabled) {
this.getCode();
}
});
} }
}); });
} },
}, },
components: { components: {
Verify Verify,
}, },
created() { created() {
// 将参数拷贝进查询对象 // 将参数拷贝进查询对象
@ -233,12 +266,12 @@ export default {
this.redirect = decodeURIComponent(query.redirect); this.redirect = decodeURIComponent(query.redirect);
} }
axios.get("./config.json").then(res => { axios.get("./config.json").then((res) => {
this.hospName = res.data.hosp_name; this.hospName = res.data.hosp_name;
}); });
this.getCookie(); this.getCookie();
} },
}; };
</script> </script>
@ -249,16 +282,18 @@ $bg: #2d3a4b;
$dark_gray: #889aa4; $dark_gray: #889aa4;
$light_gray: #eee; $light_gray: #eee;
.login-container { .login-container {
@include relative; @include relative;
background-color: white; background-color: white;
background-image: url("../assets/login.jpg"); background-image: url("../assets/login.jpg");
background-size: 100vw 100vh; background-size: 100vw 100vh;
height: 100%; height: 100%;
input:-webkit-autofill { input:-webkit-autofill,
-webkit-box-shadow: 0 0 0 1000px #293444 inset !important; input:-webkit-autofill:hover,
-webkit-text-fill-color: #fff !important; input:-webkit-autofill:focus,
input:-webkit-autofill:active {
-webkit-transition-delay: 99999s;
-webkit-transition: color 99999s ease-out, background-color 99999s ease-out;
} }
.item { .item {
@ -311,11 +346,10 @@ $light_gray: #eee;
margin-bottom: 50px; margin-bottom: 50px;
} }
.toptitle { .toptitle {
position: absolute; position: absolute;
font-size: 45px; font-size: 45px;
color: #FFFFFF; color: #ffffff;
margin: 120px auto 0.5333rem 180px; margin: 120px auto 0.5333rem 180px;
text-align: center; text-align: center;
font-weight: bold; font-weight: bold;

1
src/views/register.vue
Unescape Escape View File

@ -632,7 +632,6 @@ export default {
nickName: [ nickName: [
{ required: true, message: "请输入用户名称", trigger: "blur" }, { required: true, message: "请输入用户名称", trigger: "blur" },
{ min: 2, max: 8, message: "用户名称在2-8个字符", trigger: "blur" }, { min: 2, max: 8, message: "用户名称在2-8个字符", trigger: "blur" },
{ validator: validateName, trigger: "blur" },
], ],
password: [ password: [
{ required: true, message: "请输入密码", trigger: "blur" }, { required: true, message: "请输入密码", trigger: "blur" },

7
src/views/system/dept/authDept.vue
Unescape Escape View File

@ -40,12 +40,7 @@
<el-button-group> <el-button-group>
<el-button type="primary" icon="el-icon-refresh" @click="onReset" <el-button type="primary" icon="el-icon-refresh" @click="onReset"
>重置 >重置
<el-button type="primary" icon="el-icon-refresh" @click="onReset"
>重置
</el-button>
<el-button type="primary" @click="onSubmit" icon="el-icon-search"
>查询
</el-button>
<el-button type="primary" @click="onSubmit" icon="el-icon-search" <el-button type="primary" @click="onSubmit" icon="el-icon-search"
>查询 >查询
</el-button> </el-button>

Write Preview
Loading…
Cancel
Save