设计商标的网站,和田网站制作,实名网站空间哪里买,个人网站备案地址选择1.写一个锁屏页面#xff0c;这里比较简单#xff0c;自己定义一下,需要放到底层HTML中哦#xff0c;比如index.html
div idappIndexel-dialog title请输入密码解锁屏幕 :visible.synclockScreenFlag :close-on-click-mod…1.写一个锁屏页面这里比较简单自己定义一下,需要放到底层HTML中哦比如index.html
div idappIndexel-dialog title请输入密码解锁屏幕 :visible.synclockScreenFlag :close-on-click-modalfalse :close-on-press-escapefalse :show-closefalse :append-to-bodytruewidth500px centerel-form :modelform :rulesrules refformel-form-item label用户名 proploginNameel-input v-modelform.loginName autocompleteoff :disabledtrue prefix-iconel-icon-user-solid/el-input/el-form-itemel-form-item label密码 proppassword
!-- el-input typepassword v-modelform.password autocompleteoff prefix-iconel-icon-lock/el-input--el-input prefix-iconel-icon-lock placeholder请输入密码 :typeinputType?text:password v-modelform.passwordi slotsuffix :classinputType?el-icon-minus:el-icon-view stylemargin-top:8px;font-size:18px; autocompleteauto clickinputType!inputType/i/el-input/el-form-item/el-formdiv slotfooter classdialog-footer styletext-align: right; padding-right: 5px;el-button typeprimary clicksubmitPassword sizesmall确 定/el-button/div/el-dialog
/div
2.里面需要结合Vue双向绑定的成分
//用户信息
let user [[${user}]]
//过期事件let lockScreenTime 30let app new Vue({el: #appIndex,data: function () {var passwordSuccess (rule, value, callback) {request.post(ctxsystem/user/checkLoginNameAndPassword,Qs.stringify(this.form)).then(res{if (res.data 0){callback();}else if (res.data 1){callback(new Error(输入的密码错误或输入了非法用户名));}else {callback(new Error(res.data.msg));}})}return {lockScreenFlag: false,timer: undefined,time: parseFloat(lockScreenTime)*1000*60,form:{loginName:user.loginName,password: ,},inputType: false,rules: {password: [{required: true, message: 请输入用户名密码, trigger: blur},{validator: passwordSuccess, trigger: blur},],},}},created: function () {if (window.localStorage.getItem(lockScreenFlag)!undefined){let lockScreenFlag window.localStorage.getItem(lockScreenFlag);if (lockScreenFlag 0){this.lockScreenFlag false;$(#wrapper).css(pointer-events,auto)}else {$(#wrapper).css(pointer-events,none)this.lockScreenFlag true;}}this.move();},mounted(){let _this this;window.document.onmousemove function () {_this.move();}window.move this.move;window.openScreen this.openScreen;},methods: {submitPassword(){this.$refs[form].validate((valid) {if (valid) {this.lockScreenFlag false;$(#wrapper).css(pointer-events,auto)window.localStorage.setItem(lockScreenFlag,0)}})},lockScreen(){window.clearTimeout(this.timer)this.timer window.setTimeout(this.openScreen,this.time)},openScreen(){if (!this.lockScreenFlag){this.lockScreenFlag true;$(#wrapper).css(pointer-events,none)window.localStorage.setItem(lockScreenFlag,1)}},move(){if (!this.lockScreenFlag){this.lockScreen()}}}})
