|
|
@@ -1,137 +1,142 @@
|
|
|
<template>
|
|
|
- <view class>
|
|
|
+ <view>
|
|
|
<view class="logo">
|
|
|
<view class="logo_top">
|
|
|
<image style="width: 100%;height: 100%" src="@/static/login/logo.png" mode=""></image>
|
|
|
</view>
|
|
|
<view class="logo_bottom">
|
|
|
- 家盛茂-智能学习平台
|
|
|
+ 家盛茂-回收平台
|
|
|
</view>
|
|
|
</view>
|
|
|
<view class="loginForm">
|
|
|
<u--form labelPosition="left" :model="model" :rules="rules" ref='model'>
|
|
|
- <u-form-item label="" prop="accountCode" ref>
|
|
|
- <u--input clearable shape='circle' placeholder="请输入账号" border="surround" v-model="model.accountCode">
|
|
|
+ <u-form-item label="" prop="mobile">
|
|
|
+ <u--input clearable shape='circle' placeholder="请输入手机号" v-model="model.mobile">
|
|
|
<view class="" style="" slot='prefix'>
|
|
|
<image class="icon" src="@/static/login/icon_login_account.png" mode=""></image>
|
|
|
</view>
|
|
|
</u--input>
|
|
|
- <!-- <u--input v-model="model.accountCode" border="none"></u--input> -->
|
|
|
</u-form-item>
|
|
|
- <u-form-item label="" prop="password" ref>
|
|
|
- <u--input clearable :type='!eyeIcon ? "password":""' shape='circle' placeholder="请输入密码" border="surround"
|
|
|
- v-model="model.password">
|
|
|
- <view class="" style="" slot='prefix'>
|
|
|
- <image class="icon" src="@/static/login/icon_login_password.png" mode=""></image>
|
|
|
- </view>
|
|
|
- <view class="" slot='suffix' @click="eyeFn">
|
|
|
- <image v-show='eyeIcon === false' class="icon" src="@/static/login/icon_eyes_close.png" mode=""></image>
|
|
|
- <image v-show='eyeIcon === true' class="icon" src="@/static/login/icon_eyes_open.png" mode=""></image>
|
|
|
- </view>
|
|
|
- </u--input>
|
|
|
- <!-- <u--input v-model="model.password" border="none"></u--input> -->
|
|
|
- </u-form-item>
|
|
|
- <u-form-item label="" prop="codeValue" ref>
|
|
|
- <u--input clearable shape='circle' placeholder="请输入验证码" border="surround" v-model="model.codeValue">
|
|
|
+ <u-form-item label="" prop="code">
|
|
|
+ <u--input clearable shape='circle' placeholder="请输入验证码" v-model="model.code">
|
|
|
<view class="" style="" slot='prefix'>
|
|
|
<image class="icon" src="@/static/login/icon_003.png" mode=""></image>
|
|
|
</view>
|
|
|
- <view class="" slot='suffix'>
|
|
|
- <image @click="refreshFn" style="width: 240rpx;height: 60rpx;"
|
|
|
- :src="'data:image/jpeg;base64,' + model.codeImage" mode=""></image>
|
|
|
+ <view class="" slot='suffix' @click="getImgV">
|
|
|
+ {{countDown?countDown+'S':'获取验证码'}}
|
|
|
</view>
|
|
|
</u--input>
|
|
|
-
|
|
|
- <!-- <u--input v-model="model.codeValue" border="none"></u--input>
|
|
|
- <image @click="refreshFn" style="width: 240rpx;height: 60rpx;"
|
|
|
- :src="'data:image/jpeg;base64,' +model.codeImage" mode=""></image> -->
|
|
|
</u-form-item>
|
|
|
</u--form>
|
|
|
- <view style="margin-top: 20rpx;">
|
|
|
- <u-checkbox-group v-model="remember">
|
|
|
- <u-checkbox shape='circle' label='记住密码' name='""'>
|
|
|
- </u-checkbox>
|
|
|
- </u-checkbox-group>
|
|
|
- </view>
|
|
|
<u-button @click='loginFn' class='loginBtn' type="primary" shape="circle" size="" text="登录"></u-button>
|
|
|
</view>
|
|
|
-
|
|
|
- <!-- <u-button @click='loginFn' type="primary" shape="circle" size="mini" text="重新学习"></u-button> -->
|
|
|
+ <zjDialogVerification
|
|
|
+ ref="verification"
|
|
|
+ :isShow="isShowCodeDialog"
|
|
|
+ :top="codeObj.yHeight"
|
|
|
+ :bgImg="codeObj.bigImage"
|
|
|
+ :maskImg="codeObj.smallImage"
|
|
|
+ :isSuccess="codeObj.isSuccess"
|
|
|
+ :isFail="codeObj.isFail"
|
|
|
+ @close="isShowCodeDialog = false"
|
|
|
+ @refresh="refresh"
|
|
|
+ @finish="finish">
|
|
|
+ </zjDialogVerification>
|
|
|
</view>
|
|
|
</template>
|
|
|
|
|
|
<script>
|
|
|
+ import zjDialogVerification from "@/components/zj-dialog-verification.vue";
|
|
|
+ import api from '@/common/http/'
|
|
|
export default {
|
|
|
+ components:{
|
|
|
+ zjDialogVerification
|
|
|
+ },
|
|
|
data() {
|
|
|
return {
|
|
|
+ isShowCodeDialog:false,
|
|
|
+ codeObj: {
|
|
|
+ bigImage: '',
|
|
|
+ smallImage: '',
|
|
|
+ key: '',
|
|
|
+ yHeight: '',
|
|
|
+ isSuccess: false,
|
|
|
+ isFail: false,
|
|
|
+ },
|
|
|
model: {
|
|
|
- accountCode: '',
|
|
|
- password: '',
|
|
|
+ mobile: '',
|
|
|
code: '',
|
|
|
- codeValue: '',
|
|
|
- codeImage: ''
|
|
|
},
|
|
|
rules: {
|
|
|
- accountCode: {
|
|
|
+ mobile: {
|
|
|
type: 'string',
|
|
|
required: true,
|
|
|
- message: '账号不能为空',
|
|
|
+ message: '手机号不能为空',
|
|
|
trigger: ['blur', 'change']
|
|
|
},
|
|
|
- password: {
|
|
|
- type: 'string',
|
|
|
- required: true,
|
|
|
- message: '密码不能为空',
|
|
|
- trigger: ['blur', 'change']
|
|
|
- },
|
|
|
- codeValue: {
|
|
|
+ code: {
|
|
|
type: 'string',
|
|
|
required: true,
|
|
|
message: '验证码不能为空',
|
|
|
trigger: ['blur', 'change']
|
|
|
},
|
|
|
-
|
|
|
},
|
|
|
- eyeIcon: false,
|
|
|
- remember: [],
|
|
|
-
|
|
|
+ countDown: 0,
|
|
|
}
|
|
|
},
|
|
|
- onShow() {
|
|
|
- const value = uni.getStorageSync('recycle_mobile_login');
|
|
|
- if (value) {
|
|
|
- this.model.accountCode = value.usercode
|
|
|
- this.model.password = value.password
|
|
|
+ watch:{
|
|
|
+ countDown(){
|
|
|
+ if(this.countDown>0){
|
|
|
+ setTimeout(()=>{
|
|
|
+ this.countDown--
|
|
|
+ },1000)
|
|
|
+ }
|
|
|
}
|
|
|
- // this.getCode()
|
|
|
},
|
|
|
methods: {
|
|
|
- //存储账号密码
|
|
|
- saveData() {
|
|
|
- let data = {
|
|
|
- usercode: this.model.accountCode,
|
|
|
- password: this.model.password
|
|
|
- }
|
|
|
- uni.setStorageSync('recycle_mobile_login', data);
|
|
|
+ async getImgV(){
|
|
|
+ try {
|
|
|
+ if(this.countDown==0){
|
|
|
+ this.$refs.model.validateField("mobile",(res)=>{
|
|
|
+ if(!res.length){
|
|
|
+ api.get('/admin/user/getVerifi').then(res=>{
|
|
|
+ this.codeObj = res.data;
|
|
|
+ this.isShowCodeDialog = true
|
|
|
+ })
|
|
|
+ }
|
|
|
+ })
|
|
|
+ }
|
|
|
+ } catch (e) {}
|
|
|
},
|
|
|
- //密码显示隐藏
|
|
|
- eyeFn() {
|
|
|
- this.eyeIcon = !this.eyeIcon
|
|
|
+ refresh(){
|
|
|
+ this.getImgV()
|
|
|
+ },
|
|
|
+ finish(val){
|
|
|
+ api.postJson('/admin/user/smsCode',{
|
|
|
+ mobile:this.model.mobile,
|
|
|
+ code:this.codeObj.key,
|
|
|
+ codeValue:parseInt(val),
|
|
|
+ }).then(res=>{
|
|
|
+ this.isShowCodeDialog = false
|
|
|
+ this.codeObj = {
|
|
|
+ bigImage: '',
|
|
|
+ smallImage: '',
|
|
|
+ key: '',
|
|
|
+ yHeight: '',
|
|
|
+ isSuccess: false,
|
|
|
+ isFail: false,
|
|
|
+ }
|
|
|
+ this.countDown = 60
|
|
|
+ })
|
|
|
},
|
|
|
//登录
|
|
|
async loginFn() {
|
|
|
-
|
|
|
- await this.$refs.model.validate()
|
|
|
- let newpassword = this.$passwordFn(this.model.password, this.model.password)
|
|
|
- let params = {
|
|
|
- "accountCode": this.model.accountCode,
|
|
|
- "code": this.model.code,
|
|
|
- "codeValue": this.model.codeValue,
|
|
|
- "loginType": "account",
|
|
|
- "passWord": newpassword,
|
|
|
- "source": 1
|
|
|
- }
|
|
|
try {
|
|
|
+ await this.$refs.model.validate()
|
|
|
+ let params = {
|
|
|
+ "mobile": this.model.mobile,
|
|
|
+ "code": this.model.code,
|
|
|
+ }
|
|
|
await this.$store.dispatch('user/login', params)
|
|
|
await this.$store.dispatch('user/getInfo')
|
|
|
await this.$Prompt.toast({
|
|
|
@@ -141,32 +146,8 @@
|
|
|
this.$Router.push({
|
|
|
name: 'learn'
|
|
|
})
|
|
|
-
|
|
|
- if (this.remember.length > 0) {
|
|
|
- this.saveData()
|
|
|
- }
|
|
|
-
|
|
|
- } catch (e) {
|
|
|
- this.$Prompt.toast({
|
|
|
- title: '登陆失败',
|
|
|
- icon: 'error'
|
|
|
- })
|
|
|
- }
|
|
|
-
|
|
|
+ } catch (e) {}
|
|
|
},
|
|
|
- //刷新验证码
|
|
|
- refreshFn() {
|
|
|
- this.getCode()
|
|
|
- },
|
|
|
- // 获取验证码
|
|
|
- getCode() {
|
|
|
- this.$api.get('/base/imageVerification').then(res => {
|
|
|
- // console.log(res);
|
|
|
- this.model.code = res.data.code
|
|
|
- this.model.codeImage = res.data.pic
|
|
|
- })
|
|
|
- },
|
|
|
-
|
|
|
}
|
|
|
}
|
|
|
</script>
|
|
|
@@ -208,8 +189,6 @@
|
|
|
}
|
|
|
|
|
|
.loginBtn {
|
|
|
- // width: 630rpx;
|
|
|
- // height: 100rpx;
|
|
|
margin-top: 44rpx;
|
|
|
background: linear-gradient(135deg, #7fdaff 0%, #6da7ff 100%);
|
|
|
border-radius: 50rpx;
|
linwenxin