| 1 |
- import{n as i,v as a}from"./index-a9d7bd25.js";import"./element-37f6a05c.js";const l={name:"SIdentify",props:{identifyCode:{type:String,default:"56h3"},fontSizeMin:{type:Number,default:35},fontSizeMax:{type:Number,default:35},backgroundColorMin:{type:Number,default:180},backgroundColorMax:{type:Number,default:240},colorMin:{type:Number,default:50},colorMax:{type:Number,default:160},lineColorMin:{type:Number,default:100},lineColorMax:{type:Number,default:200},dotColorMin:{type:Number,default:0},dotColorMax:{type:Number,default:255},contentWidth:{type:Number,default:120},contentHeight:{type:Number,default:50}},watch:{identifyCode(){this.drawPic()}},mounted(){this.drawPic()},methods:{randomNum(t,e){return Math.floor(Math.random()*(e-t)+t)},randomColor(t,e){const o=this.randomNum(t,e),n=this.randomNum(t,e),s=this.randomNum(t,e);return"rgb("+o+","+n+","+s+")"},transparent(){return"rgb(255,255,255)"},drawPic(){const e=document.getElementById("s-canvas").getContext("2d");e.textBaseline="bottom",e.fillStyle=this.transparent(),e.fillRect(0,0,this.contentWidth,this.contentHeight);for(let o=0;o<this.identifyCode.length;o++)this.drawText(e,this.identifyCode[o],o)},drawText(t,e,o){t.fillStyle=this.randomColor(this.colorMin,this.colorMax),t.font=this.randomNum(this.fontSizeMin,this.fontSizeMax)+"px SimHei";const n=(o+1)*(this.contentWidth/(this.identifyCode.length+1)),s=this.randomNum(this.fontSizeMax,this.contentHeight-5),r=this.randomNum(-10,10);t.translate(n,s),t.rotate(r*Math.PI/180),t.fillText(e,0,0),t.rotate(-r*Math.PI/180),t.translate(-n,-s)},drawLine(t){for(let e=0;e<8;e++)t.strokeStyle=this.randomColor(this.lineColorMin,this.lineColorMax),t.beginPath(),t.moveTo(this.randomNum(0,this.contentWidth),this.randomNum(0,this.contentHeight)),t.lineTo(this.randomNum(0,this.contentWidth),this.randomNum(0,this.contentHeight)),t.stroke()},drawDot(t){for(let e=0;e<100;e++)t.fillStyle=this.randomColor(0,255),t.beginPath(),t.arc(this.randomNum(0,this.contentWidth),this.randomNum(0,this.contentHeight),1,0,2*Math.PI),t.fill()}}};var d=function(){var e=this,o=e._self._c;return o("div",{staticClass:"s-canvas"},[o("canvas",{attrs:{id:"s-canvas",width:e.contentWidth,height:e.contentHeight}})])},u=[],h=i(l,d,u,!1,null,null,null,null);const c=h.exports;const m={name:"Login",components:{SIdentify:c},data(){return{loginForm:{username:"",password:""},loginRules:{username:[{required:!0,trigger:"blur",validator:(o,n,s)=>{a(n)?s():s(new Error("Please enter the correct user name"))}}],password:[{required:!0,trigger:"blur",validator:(o,n,s)=>{n.length<6?s(new Error("The password can not be less than 6 digits")):s()}}]},loading:!1,passwordType:"password",redirect:void 0,code:"",identifyCode:"",identifyCodes:"123456789abcdefghijkmnpqrstuvwxyzABCDEFGHJKLMNPQRSTUVWXYZ"}},watch:{$route:{handler(t){this.redirect=t.query&&t.query.redirect},immediate:!0}},created(){this.refreshCode()},methods:{showPwd(){this.passwordType==="password"?this.passwordType="":this.passwordType="password",this.$nextTick(()=>{this.$refs.password.focus()})},handleLogin(){if(this.code.toLowerCase()!=this.identifyCode.toLowerCase()){this.$message({message:"验证码错误",type:"error"});return}this.$refs.loginForm.validate(t=>{if(t)this.loading=!0,this.$store.dispatch("user/login",this.loginForm).then(()=>{this.$router.push({path:this.redirect||"/"}),this.loading=!1}).catch(()=>{this.loading=!1});else return!1})},refreshCode(){this.identifyCode="",this.makeCode(this.identifyCodes,4)},randomNum(t,e){return e=e+1,Math.floor(Math.random()*(e-t)+t)},makeCode(t,e){for(let o=0;o<e;o++)this.identifyCode+=t[this.randomNum(0,t.length-1)]}}};var p=function(){var e=this,o=e._self._c;return o("div",{staticClass:"login-container"},[o("el-form",{ref:"loginForm",staticClass:"login-form",attrs:{model:e.loginForm,"auto-complete":"on","label-position":"left"},nativeOn:{keyup:function(n){return!n.type.indexOf("key")&&e._k(n.keyCode,"enter",13,n.key,"Enter")?null:e.handleLogin.apply(null,arguments)}}},[o("div",{staticClass:"title-container"},[o("h3",{staticClass:"title"},[e._v("PromoCatalogue后台登录")])]),o("el-form-item",{attrs:{prop:"username"}},[o("span",{staticClass:"svg-container"},[o("svg-user")],1),o("el-input",{ref:"username",attrs:{clearable:"",placeholder:"账号",name:"username",type:"text",tabindex:"1","auto-complete":"on"},model:{value:e.loginForm.username,callback:function(n){e.$set(e.loginForm,"username",n)},expression:"loginForm.username"}})],1),o("el-form-item",{attrs:{prop:"password"}},[o("span",{staticClass:"svg-container"},[o("svg-password")],1),o("el-input",{key:e.passwordType,ref:"password",attrs:{clearable:"",type:e.passwordType,placeholder:"密码",name:"password",tabindex:"2","auto-complete":"on"},model:{value:e.loginForm.password,callback:function(n){e.$set(e.loginForm,"password",n)},expression:"loginForm.password"}}),o("span",{staticClass:"show-pwd",on:{click:e.showPwd}},[e.passwordType==="password"?o("svg-eye"):o("svg-eye-open")],1)],1),o("div",{staticClass:"code-wrap"},[o("el-form-item",{attrs:{prop:"identifyCode"}},[o("span",{staticClass:"svg-container"},[o("svg-user")],1),o("el-input",{ref:"code",attrs:{clearable:"",placeholder:"验证码",name:"code",type:"text",tabindex:"3"},model:{value:e.code,callback:function(n){e.code=n},expression:"code"}})],1),o("div",{staticClass:"get-code",on:{click:function(n){return e.refreshCode()}}},[o("s-identify",{attrs:{identifyCode:e.identifyCode}})],1)],1),o("el-button",{staticStyle:{width:"100%","margin-bottom":"30px"},attrs:{loading:e.loading,type:"primary"},nativeOn:{click:function(n){return n.preventDefault(),e.handleLogin.apply(null,arguments)}}},[e._v(" Login ")])],1)],1)},f=[],g=i(m,p,f,!1,null,null,null,null);const C=g.exports;export{C as default};
|
