修改锁屏加入密码

This commit is contained in:
smallwei 2018-03-09 16:55:18 +08:00
parent 715a47a183
commit f53a1eb045
2 changed files with 38 additions and 27 deletions

View File

@ -1,21 +1,20 @@
<template> <template>
<span> <span>
<i class="icon-bofangqi-suoping" @click="handleLock"></i> <i class="icon-bofangqi-suoping" @click="handleLock"></i>
<el-dialog title="设置锁屏密码" :visible.sync="box" width="30%"> <el-dialog title="设置锁屏密码" :visible.sync="box" width="30%">
<el-form :model="form" ref="form" label-width="80px"> <el-form :model="form" ref="form" label-width="80px">
<el-form-item label="锁屏密码" prop="passwd" :rules="[{ required: true, message: '锁屏密码不能为空'}]"> <el-form-item label="锁屏密码" prop="passwd" :rules="[{ required: true, message: '锁屏密码不能为空'}]">
<el-input v-model="form.passwd" placeholder="请输入锁屏密码"></el-input> <el-input v-model="form.passwd" placeholder="请输入锁屏密码"></el-input>
</el-form-item> </el-form-item>
</el-form> </el-form>
<span slot="footer" class="dialog-footer"> <span slot="footer" class="dialog-footer">
<el-button type="primary" @click="handleSetLock"> </el-button> <el-button type="primary" @click="handleSetLock"> </el-button>
</span> </span>
</el-dialog> </el-dialog>
</span> </span>
</template> </template>
<script> <script>
import { fullscreenToggel } from "@/util/util";
import { validatenull } from "@/util/validate"; import { validatenull } from "@/util/validate";
import { mapGetters } from "vuex"; import { mapGetters } from "vuex";
export default { export default {
@ -44,7 +43,7 @@ export default {
}); });
}, },
handleLock() { handleLock() {
if (validatenull(this.lockPasswd)) { if (validatenull(this.form.passwd)) {
this.box = true; this.box = true;
return; return;
} }

View File

@ -1,15 +1,16 @@
<template> <template>
<div class="lock-container pull-height"> <div class="lock-container pull-height">
<div class="lock-form animated bounceInDown"> <div class="lock-form animated bounceInDown">
<div class="animated" :class="{'shake':passwdError,'bounceOut':pass}"> <div class="animated" :class="{'shake':passwdError,'bounceOut':pass}">
<h3 class="text-white">{{userInfo.username}}<small>默认密码:avue</small></h3> <h3 class="text-white">{{userInfo.username}}</h3>
<el-input placeholder="请输入登录密码" type="password" class="input-with-select animated" v-model="passwd"> <el-input placeholder="请输入登录密码" type="password" class="input-with-select animated" v-model="passwd" @keyup.enter.native="handleLogin">
<el-button slot="append" icon="icon-bofangqi-suoping" @click="handleLogin" ></el-button> <el-button slot="append" icon="icon-bofangqi-suoping" @click="handleLogin"></el-button>
</el-input> <el-button slot="append" icon="icon-tuichu" @click="handleLogout"></el-button>
</div> </el-input>
</div> </div>
</div> </div>
</div>
</template> </template>
<script> <script>
import { mapGetters, mapState } from "vuex"; import { mapGetters, mapState } from "vuex";
@ -28,15 +29,26 @@ export default {
...mapState({ ...mapState({
userInfo: state => state.user.userInfo userInfo: state => state.user.userInfo
}), }),
...mapGetters(["tag"]) ...mapGetters(["tag", "lockPasswd"])
}, },
props: [], props: [],
methods: { methods: {
handleLogout() {
this.$confirm("是否退出系统, 是否继续?", "提示", {
confirmButtonText: "确定",
cancelButtonText: "取消",
type: "warning"
}).then(() => {
this.$store.dispatch("LogOut").then(() => {
this.$router.push({ path: "/login" });
});
});
},
handleLogin() { handleLogin() {
if (this.passwd != "avue") { if (this.passwd != this.lockPasswd) {
this.passwd = ""; this.passwd = "";
this.$message({ this.$message({
message: "解锁密码错误,默认为avue", message: "解锁密码错误,请重新输入",
type: "error" type: "error"
}); });
this.passwdError = true; this.passwdError = true;