|  |  | @@ -0,0 +1,773 @@ | 
		
	
		
			
			|  |  |  | <template> | 
		
	
		
			
			|  |  |  | <!-- 手机号13797188591 --> | 
		
	
		
			
			|  |  |  | <div :class="inPage ? 'page active' : 'page'"> | 
		
	
		
			
			|  |  |  | <div id="top"></div> | 
		
	
		
			
			|  |  |  | <div class="logoBox" @click="go('/')"> | 
		
	
		
			
			|  |  |  | <img src="../../assets/img/logoh.png" alt class="logo" /> | 
		
	
		
			
			|  |  |  | <!-- <div class="logoTitle">metavatar</div> --> | 
		
	
		
			
			|  |  |  | </div> | 
		
	
		
			
			|  |  |  | 
 | 
		
	
		
			
			|  |  |  | <!-- 首页登录 loginType=1 --> | 
		
	
		
			
			|  |  |  | <div class="loginBox" v-if="loginType == 1"> | 
		
	
		
			
			|  |  |  | <el-form ref="form" :rules="rules" :model="form"> | 
		
	
		
			
			|  |  |  | <!-- 手机号 --> | 
		
	
		
			
			|  |  |  | <el-form-item class="phone" prop="phone"> | 
		
	
		
			
			|  |  |  | <el-input | 
		
	
		
			
			|  |  |  | v-model="form.phone" | 
		
	
		
			
			|  |  |  | placeholder="请输入您的手机号" | 
		
	
		
			
			|  |  |  | ></el-input> | 
		
	
		
			
			|  |  |  | </el-form-item> | 
		
	
		
			
			|  |  |  | <!-- 密码 --> | 
		
	
		
			
			|  |  |  | <el-form-item class="code" prop="password"> | 
		
	
		
			
			|  |  |  | <el-input | 
		
	
		
			
			|  |  |  | type="password" | 
		
	
		
			
			|  |  |  | maxlength="10" | 
		
	
		
			
			|  |  |  | clearable | 
		
	
		
			
			|  |  |  | v-model="form.password" | 
		
	
		
			
			|  |  |  | placeholder="请输入密码" | 
		
	
		
			
			|  |  |  | ></el-input> | 
		
	
		
			
			|  |  |  | </el-form-item> | 
		
	
		
			
			|  |  |  | <!-- 随机验证码 --> | 
		
	
		
			
			|  |  |  | <el-form-item class="yzCode" prop="yzCode"> | 
		
	
		
			
			|  |  |  | <el-col :span="12"> | 
		
	
		
			
			|  |  |  | <el-input | 
		
	
		
			
			|  |  |  | v-model="form.yzCode" | 
		
	
		
			
			|  |  |  | placeholder="请输入验证码" | 
		
	
		
			
			|  |  |  | ></el-input> | 
		
	
		
			
			|  |  |  | </el-col> | 
		
	
		
			
			|  |  |  | <el-col :span="9"> | 
		
	
		
			
			|  |  |  | <!-- <div class="yzmImg" v-html="codeImg"></div> --> | 
		
	
		
			
			|  |  |  | <img v-if="showCodeImg" class="yzmImg" :src="codeImg" alt="" /> | 
		
	
		
			
			|  |  |  | </el-col> | 
		
	
		
			
			|  |  |  | <el-col :span="2"> | 
		
	
		
			
			|  |  |  | <i @click="getCodeImg" class="el-icon-refresh-right shuaxin"></i> | 
		
	
		
			
			|  |  |  | </el-col> | 
		
	
		
			
			|  |  |  | </el-form-item> | 
		
	
		
			
			|  |  |  | <!-- 短信登录和忘记密码 --> | 
		
	
		
			
			|  |  |  | <div class="morePage greenColor"> | 
		
	
		
			
			|  |  |  | <span @click="loginType = 2">短信登录</span> | 
		
	
		
			
			|  |  |  | <span @click="loginType = 3">忘记密码?</span> | 
		
	
		
			
			|  |  |  | </div> | 
		
	
		
			
			|  |  |  | <!-- 登录 --> | 
		
	
		
			
			|  |  |  | <el-form-item> | 
		
	
		
			
			|  |  |  | <el-button class="submitBtn" @click="loginByPhoneCode" | 
		
	
		
			
			|  |  |  | >登录/注册</el-button | 
		
	
		
			
			|  |  |  | > | 
		
	
		
			
			|  |  |  | </el-form-item> | 
		
	
		
			
			|  |  |  | <!-- 没有账号 --> | 
		
	
		
			
			|  |  |  | <div> | 
		
	
		
			
			|  |  |  | <span>没有账号?</span> | 
		
	
		
			
			|  |  |  | <span class="greenColor" @click="loginType = 5">立即注册</span> | 
		
	
		
			
			|  |  |  | </div> | 
		
	
		
			
			|  |  |  | </el-form> | 
		
	
		
			
			|  |  |  | </div> | 
		
	
		
			
			|  |  |  | 
 | 
		
	
		
			
			|  |  |  | <!-- 短信登录 loginType=2 --> | 
		
	
		
			
			|  |  |  | <div class="loginBox" v-if="loginType == 2"> | 
		
	
		
			
			|  |  |  | <el-form ref="form" :rules="rules" :model="form"> | 
		
	
		
			
			|  |  |  | <!-- 手机号 --> | 
		
	
		
			
			|  |  |  | <el-form-item class="phone" prop="phone"> | 
		
	
		
			
			|  |  |  | <el-input | 
		
	
		
			
			|  |  |  | v-model="form.phone" | 
		
	
		
			
			|  |  |  | placeholder="请输入您的手机号" | 
		
	
		
			
			|  |  |  | ></el-input> | 
		
	
		
			
			|  |  |  | </el-form-item> | 
		
	
		
			
			|  |  |  | <!-- 短信验证码 --> | 
		
	
		
			
			|  |  |  | <el-form-item class="code" prop="code"> | 
		
	
		
			
			|  |  |  | <el-input | 
		
	
		
			
			|  |  |  | maxlength="10" | 
		
	
		
			
			|  |  |  | clearable | 
		
	
		
			
			|  |  |  | v-model="form.code" | 
		
	
		
			
			|  |  |  | placeholder="请输入短信验证码" | 
		
	
		
			
			|  |  |  | > | 
		
	
		
			
			|  |  |  | <div | 
		
	
		
			
			|  |  |  | v-if="!countdownState" | 
		
	
		
			
			|  |  |  | @click="triggerCountdown" | 
		
	
		
			
			|  |  |  | class="greenColor" | 
		
	
		
			
			|  |  |  | slot="suffix" | 
		
	
		
			
			|  |  |  | type="primary" | 
		
	
		
			
			|  |  |  | > | 
		
	
		
			
			|  |  |  | 获取验证码 | 
		
	
		
			
			|  |  |  | </div> | 
		
	
		
			
			|  |  |  | <div v-else slot="suffix" type="primary"> | 
		
	
		
			
			|  |  |  | 验证码已发送{{ countNum }}s | 
		
	
		
			
			|  |  |  | </div> | 
		
	
		
			
			|  |  |  | </el-input> | 
		
	
		
			
			|  |  |  | </el-form-item> | 
		
	
		
			
			|  |  |  | <!-- 短信登录和忘记密码 --> | 
		
	
		
			
			|  |  |  | <div class="morePage greenColor inBoxEnd"> | 
		
	
		
			
			|  |  |  | <span @click="loginType = 1">账号登录</span> | 
		
	
		
			
			|  |  |  | </div> | 
		
	
		
			
			|  |  |  | <!-- 登录 --> | 
		
	
		
			
			|  |  |  | <el-form-item> | 
		
	
		
			
			|  |  |  | <el-button class="submitBtn" @click="loginByPhoneCode" | 
		
	
		
			
			|  |  |  | >登录</el-button | 
		
	
		
			
			|  |  |  | > | 
		
	
		
			
			|  |  |  | </el-form-item> | 
		
	
		
			
			|  |  |  | <!-- 没有账号 --> | 
		
	
		
			
			|  |  |  | <div> | 
		
	
		
			
			|  |  |  | <span>没有账号?</span> | 
		
	
		
			
			|  |  |  | <span class="greenColor" @click="loginType = 5">立即注册</span> | 
		
	
		
			
			|  |  |  | </div> | 
		
	
		
			
			|  |  |  | </el-form> | 
		
	
		
			
			|  |  |  | </div> | 
		
	
		
			
			|  |  |  | 
 | 
		
	
		
			
			|  |  |  | <!-- 忘记密码 loginType=3--> | 
		
	
		
			
			|  |  |  | <div class="loginBox" v-if="loginType == 3"> | 
		
	
		
			
			|  |  |  | <el-form ref="form" :rules="rules" :model="form"> | 
		
	
		
			
			|  |  |  | <!-- 手机号 --> | 
		
	
		
			
			|  |  |  | <el-form-item class="phone" prop="phone"> | 
		
	
		
			
			|  |  |  | <el-input | 
		
	
		
			
			|  |  |  | v-model="form.phone" | 
		
	
		
			
			|  |  |  | placeholder="请输入您的手机号" | 
		
	
		
			
			|  |  |  | ></el-input> | 
		
	
		
			
			|  |  |  | </el-form-item> | 
		
	
		
			
			|  |  |  | <!-- 随机验证码 --> | 
		
	
		
			
			|  |  |  | <el-form-item class="code" prop="yzCode"> | 
		
	
		
			
			|  |  |  | <el-col :span="12"> | 
		
	
		
			
			|  |  |  | <el-input | 
		
	
		
			
			|  |  |  | maxlength="10" | 
		
	
		
			
			|  |  |  | clearable | 
		
	
		
			
			|  |  |  | v-model="form.yzCode" | 
		
	
		
			
			|  |  |  | placeholder="请输入验证码" | 
		
	
		
			
			|  |  |  | ></el-input> | 
		
	
		
			
			|  |  |  | </el-col> | 
		
	
		
			
			|  |  |  | <el-col :span="9"> | 
		
	
		
			
			|  |  |  | <!-- <div class="yzmImg" v-html="codeImg"></div> --> | 
		
	
		
			
			|  |  |  | <img class="yzmImg" :src="codeImg" alt="" /> | 
		
	
		
			
			|  |  |  | </el-col> | 
		
	
		
			
			|  |  |  | <el-col :span="2"> | 
		
	
		
			
			|  |  |  | <i @click="getCodeImg" class="el-icon-refresh-right shuaxin"></i> | 
		
	
		
			
			|  |  |  | </el-col> | 
		
	
		
			
			|  |  |  | </el-form-item> | 
		
	
		
			
			|  |  |  | <div class="morePage greenColor"> | 
		
	
		
			
			|  |  |  | <span @click="loginType = 1">账户登录</span> | 
		
	
		
			
			|  |  |  | </div> | 
		
	
		
			
			|  |  |  | <!-- 登录 --> | 
		
	
		
			
			|  |  |  | <el-form-item> | 
		
	
		
			
			|  |  |  | <el-button class="submitBtn" @click="loginByPhoneCode" | 
		
	
		
			
			|  |  |  | >获取短信验证码</el-button | 
		
	
		
			
			|  |  |  | > | 
		
	
		
			
			|  |  |  | </el-form-item> | 
		
	
		
			
			|  |  |  | </el-form> | 
		
	
		
			
			|  |  |  | </div> | 
		
	
		
			
			|  |  |  | 
 | 
		
	
		
			
			|  |  |  | <!-- 重设密码 loginType=4 --> | 
		
	
		
			
			|  |  |  | <div class="loginBox" v-if="loginType == 4"> | 
		
	
		
			
			|  |  |  | <el-form ref="form" :rules="rules" :model="form"> | 
		
	
		
			
			|  |  |  | <!-- 短信验证码 --> | 
		
	
		
			
			|  |  |  | <el-form-item class="phone" prop="code1"> | 
		
	
		
			
			|  |  |  | <el-input | 
		
	
		
			
			|  |  |  | v-model="form.code1" | 
		
	
		
			
			|  |  |  | placeholder="请输入短信验证码" | 
		
	
		
			
			|  |  |  | ></el-input> | 
		
	
		
			
			|  |  |  | </el-form-item> | 
		
	
		
			
			|  |  |  | <!-- 新密码1 --> | 
		
	
		
			
			|  |  |  | <el-form-item class="code" prop="newPassword1"> | 
		
	
		
			
			|  |  |  | <el-input | 
		
	
		
			
			|  |  |  | type="password" | 
		
	
		
			
			|  |  |  | maxlength="10" | 
		
	
		
			
			|  |  |  | clearable | 
		
	
		
			
			|  |  |  | v-model="form.newPassword1" | 
		
	
		
			
			|  |  |  | placeholder="请输入您的新密码" | 
		
	
		
			
			|  |  |  | > | 
		
	
		
			
			|  |  |  | </el-input> | 
		
	
		
			
			|  |  |  | </el-form-item> | 
		
	
		
			
			|  |  |  | <!-- 新密码2 --> | 
		
	
		
			
			|  |  |  | <el-form-item class="code" prop="newPassword2"> | 
		
	
		
			
			|  |  |  | <el-input | 
		
	
		
			
			|  |  |  | type="password" | 
		
	
		
			
			|  |  |  | maxlength="10" | 
		
	
		
			
			|  |  |  | clearable | 
		
	
		
			
			|  |  |  | v-model="form.newPassword2" | 
		
	
		
			
			|  |  |  | placeholder="请再次确认您的新密码" | 
		
	
		
			
			|  |  |  | > | 
		
	
		
			
			|  |  |  | </el-input> | 
		
	
		
			
			|  |  |  | </el-form-item> | 
		
	
		
			
			|  |  |  | <div class="morePage greenColor"> | 
		
	
		
			
			|  |  |  | <span @click="loginType = 1">账户登录</span> | 
		
	
		
			
			|  |  |  | </div> | 
		
	
		
			
			|  |  |  | <!-- 登录 --> | 
		
	
		
			
			|  |  |  | <el-form-item> | 
		
	
		
			
			|  |  |  | <el-button class="submitBtn" @click="loginByPhoneCode" | 
		
	
		
			
			|  |  |  | >保存密码</el-button | 
		
	
		
			
			|  |  |  | > | 
		
	
		
			
			|  |  |  | </el-form-item> | 
		
	
		
			
			|  |  |  | </el-form> | 
		
	
		
			
			|  |  |  | </div> | 
		
	
		
			
			|  |  |  | 
 | 
		
	
		
			
			|  |  |  | <!-- 注册 loginType=5 --> | 
		
	
		
			
			|  |  |  | <div class="loginBox" v-if="loginType == 5"> | 
		
	
		
			
			|  |  |  | <el-form ref="form" :rules="rules" :model="form"> | 
		
	
		
			
			|  |  |  | <!-- 短信验证码 --> | 
		
	
		
			
			|  |  |  | <el-form-item class="phone" prop="phone"> | 
		
	
		
			
			|  |  |  | <el-input | 
		
	
		
			
			|  |  |  | v-model="form.phone" | 
		
	
		
			
			|  |  |  | placeholder="请输入您的手机号" | 
		
	
		
			
			|  |  |  | ></el-input> | 
		
	
		
			
			|  |  |  | </el-form-item> | 
		
	
		
			
			|  |  |  | <!-- 新密码1 --> | 
		
	
		
			
			|  |  |  | <el-form-item class="code" prop="newPassword1"> | 
		
	
		
			
			|  |  |  | <el-input | 
		
	
		
			
			|  |  |  | type="password" | 
		
	
		
			
			|  |  |  | maxlength="10" | 
		
	
		
			
			|  |  |  | clearable | 
		
	
		
			
			|  |  |  | v-model="form.newPassword1" | 
		
	
		
			
			|  |  |  | placeholder="请输入您的密码" | 
		
	
		
			
			|  |  |  | > | 
		
	
		
			
			|  |  |  | </el-input> | 
		
	
		
			
			|  |  |  | </el-form-item> | 
		
	
		
			
			|  |  |  | <!-- 新密码2 --> | 
		
	
		
			
			|  |  |  | <el-form-item class="code" prop="newPassword2"> | 
		
	
		
			
			|  |  |  | <el-input | 
		
	
		
			
			|  |  |  | type="password" | 
		
	
		
			
			|  |  |  | maxlength="10" | 
		
	
		
			
			|  |  |  | clearable | 
		
	
		
			
			|  |  |  | v-model="form.newPassword2" | 
		
	
		
			
			|  |  |  | placeholder="请再次确认您的密码" | 
		
	
		
			
			|  |  |  | > | 
		
	
		
			
			|  |  |  | </el-input> | 
		
	
		
			
			|  |  |  | </el-form-item> | 
		
	
		
			
			|  |  |  | <div class="morePage greenColor"> | 
		
	
		
			
			|  |  |  | <span @click="loginType = 1">账户登录</span> | 
		
	
		
			
			|  |  |  | </div> | 
		
	
		
			
			|  |  |  | <!-- 注册 --> | 
		
	
		
			
			|  |  |  | <el-form-item> | 
		
	
		
			
			|  |  |  | <el-button class="submitBtn" @click="loginByPhoneCode" | 
		
	
		
			
			|  |  |  | >注册</el-button | 
		
	
		
			
			|  |  |  | > | 
		
	
		
			
			|  |  |  | </el-form-item> | 
		
	
		
			
			|  |  |  | </el-form> | 
		
	
		
			
			|  |  |  | </div> | 
		
	
		
			
			|  |  |  | <!-- 弹出层 --> | 
		
	
		
			
			|  |  |  | <van-popup v-model="showDialog">内容</van-popup> | 
		
	
		
			
			|  |  |  | </div> | 
		
	
		
			
			|  |  |  | </template> | 
		
	
		
			
			|  |  |  | 
 | 
		
	
		
			
			|  |  |  | <script> | 
		
	
		
			
			|  |  |  | // 组件 | 
		
	
		
			
			|  |  |  | import Vue from 'vue' | 
		
	
		
			
			|  |  |  | import { Toast } from 'vant' | 
		
	
		
			
			|  |  |  | import { mapState, mapActions } from 'vuex' | 
		
	
		
			
			|  |  |  | // 工具 | 
		
	
		
			
			|  |  |  | import { scrollToID } from '../../utils' | 
		
	
		
			
			|  |  |  | // 接口 | 
		
	
		
			
			|  |  |  | import { | 
		
	
		
			
			|  |  |  | doLogin, | 
		
	
		
			
			|  |  |  | getCodeByPhone, | 
		
	
		
			
			|  |  |  | doRegisterByPhone, | 
		
	
		
			
			|  |  |  | doLoginByPhone, | 
		
	
		
			
			|  |  |  | doSendPhoneCode, | 
		
	
		
			
			|  |  |  | doUpdPass, | 
		
	
		
			
			|  |  |  | getCaptcha, | 
		
	
		
			
			|  |  |  | doFindInviteCode, | 
		
	
		
			
			|  |  |  | doUpdateInviteCode, | 
		
	
		
			
			|  |  |  | doCodeImg | 
		
	
		
			
			|  |  |  | } from '../../api/login' | 
		
	
		
			
			|  |  |  | 
 | 
		
	
		
			
			|  |  |  | Vue.use(Toast) | 
		
	
		
			
			|  |  |  | export default { | 
		
	
		
			
			|  |  |  | data() { | 
		
	
		
			
			|  |  |  | return { | 
		
	
		
			
			|  |  |  | showDialog: false, //弹出层状态 | 
		
	
		
			
			|  |  |  | countNum: 60, // 倒计时 | 
		
	
		
			
			|  |  |  | countdownState: false, //倒计时状态 | 
		
	
		
			
			|  |  |  | codeInfo: '获取验证码', | 
		
	
		
			
			|  |  |  | inPage: false, | 
		
	
		
			
			|  |  |  | codeImg: '', //随机验证码图片 | 
		
	
		
			
			|  |  |  | loginType: 1, //显示页面字符 | 
		
	
		
			
			|  |  |  | showCodeImg: true, // 控制验证码的刷新 | 
		
	
		
			
			|  |  |  | // 短信验证码登录 | 
		
	
		
			
			|  |  |  | form: { | 
		
	
		
			
			|  |  |  | phone: '', // 手机号 | 
		
	
		
			
			|  |  |  | password: '', // 密码 | 
		
	
		
			
			|  |  |  | newPassword1: '', // 新密码1 | 
		
	
		
			
			|  |  |  | newPassword2: '', // 新密码2 | 
		
	
		
			
			|  |  |  | phoneCode: '', // | 
		
	
		
			
			|  |  |  | code: '', // 短信验证码 | 
		
	
		
			
			|  |  |  | code1: '', // 忘记密码的短信验证码 | 
		
	
		
			
			|  |  |  | yzCode: '' // 随机图片验证码 | 
		
	
		
			
			|  |  |  | }, | 
		
	
		
			
			|  |  |  | rules: { | 
		
	
		
			
			|  |  |  | phone: [ | 
		
	
		
			
			|  |  |  | { | 
		
	
		
			
			|  |  |  | required: true, | 
		
	
		
			
			|  |  |  | trigger: 'blur', | 
		
	
		
			
			|  |  |  | message: '请先输手机号' | 
		
	
		
			
			|  |  |  | }, | 
		
	
		
			
			|  |  |  | { | 
		
	
		
			
			|  |  |  | validator(rule, value, callback, source, options) { | 
		
	
		
			
			|  |  |  | var errors = [] | 
		
	
		
			
			|  |  |  | // var mobile = /^1[0|1|2|3|4|5|6|7|8|9]\d{9}$/, | 
		
	
		
			
			|  |  |  | let phone = /^1[35789]\d{9}$/ | 
		
	
		
			
			|  |  |  | if (value && !phone.test(value)) { | 
		
	
		
			
			|  |  |  | callback('抱歉,请输入正确的手机号') | 
		
	
		
			
			|  |  |  | } | 
		
	
		
			
			|  |  |  | callback(errors) | 
		
	
		
			
			|  |  |  | } | 
		
	
		
			
			|  |  |  | } | 
		
	
		
			
			|  |  |  | ] | 
		
	
		
			
			|  |  |  | }, | 
		
	
		
			
			|  |  |  | // 账号密码登录 | 
		
	
		
			
			|  |  |  | formII: { | 
		
	
		
			
			|  |  |  | phone: '', | 
		
	
		
			
			|  |  |  | pwd: '', | 
		
	
		
			
			|  |  |  | code: '' | 
		
	
		
			
			|  |  |  | }, | 
		
	
		
			
			|  |  |  | rulesII: { | 
		
	
		
			
			|  |  |  | phone: [ | 
		
	
		
			
			|  |  |  | { | 
		
	
		
			
			|  |  |  | required: true, | 
		
	
		
			
			|  |  |  | trigger: 'blur', | 
		
	
		
			
			|  |  |  | message: '请先输手机号' | 
		
	
		
			
			|  |  |  | }, | 
		
	
		
			
			|  |  |  | { | 
		
	
		
			
			|  |  |  | validator(rule, value, callback, source, options) { | 
		
	
		
			
			|  |  |  | var errors = [] | 
		
	
		
			
			|  |  |  | // var mobile = /^1[0|1|2|3|4|5|6|7|8|9]\d{9}$/, | 
		
	
		
			
			|  |  |  | let phone = /^1[35789]\d{9}$/ | 
		
	
		
			
			|  |  |  | if (value && !phone.test(value)) { | 
		
	
		
			
			|  |  |  | callback('抱歉,请输入正确的手机号') | 
		
	
		
			
			|  |  |  | } | 
		
	
		
			
			|  |  |  | callback(errors) | 
		
	
		
			
			|  |  |  | } | 
		
	
		
			
			|  |  |  | } | 
		
	
		
			
			|  |  |  | ] | 
		
	
		
			
			|  |  |  | }, | 
		
	
		
			
			|  |  |  | // 短信登录 | 
		
	
		
			
			|  |  |  | 
 | 
		
	
		
			
			|  |  |  | // 忘记密码 | 
		
	
		
			
			|  |  |  | // 重设密码 | 
		
	
		
			
			|  |  |  | // 注册 | 
		
	
		
			
			|  |  |  | // 邀请码 | 
		
	
		
			
			|  |  |  | formIII: { | 
		
	
		
			
			|  |  |  | inviteCode: '' | 
		
	
		
			
			|  |  |  | } | 
		
	
		
			
			|  |  |  | } | 
		
	
		
			
			|  |  |  | }, | 
		
	
		
			
			|  |  |  | watch: { | 
		
	
		
			
			|  |  |  | // type值改变,清空除手机号的其他值 | 
		
	
		
			
			|  |  |  | loginType() { | 
		
	
		
			
			|  |  |  | this.form = { | 
		
	
		
			
			|  |  |  | phone: this.form.phone, // 手机号 | 
		
	
		
			
			|  |  |  | password: '', // 密码 | 
		
	
		
			
			|  |  |  | newPassword1: '', // 新密码1 | 
		
	
		
			
			|  |  |  | newPassword2: '', // 新密码2 | 
		
	
		
			
			|  |  |  | phoneCode: '', // | 
		
	
		
			
			|  |  |  | code: '', // 短信验证码 | 
		
	
		
			
			|  |  |  | code1: '', // 忘记密码的短信验证码 | 
		
	
		
			
			|  |  |  | yzCode: '' // 随机图片验证码 | 
		
	
		
			
			|  |  |  | } | 
		
	
		
			
			|  |  |  | } | 
		
	
		
			
			|  |  |  | }, | 
		
	
		
			
			|  |  |  | computed: { | 
		
	
		
			
			|  |  |  | ...mapState({ | 
		
	
		
			
			|  |  |  | characters: (state) => state.publicObj.characters | 
		
	
		
			
			|  |  |  | }) | 
		
	
		
			
			|  |  |  | }, | 
		
	
		
			
			|  |  |  | 
 | 
		
	
		
			
			|  |  |  | methods: { | 
		
	
		
			
			|  |  |  | ...mapActions(['setCharacters']), | 
		
	
		
			
			|  |  |  | // 发送短信验证码 | 
		
	
		
			
			|  |  |  | triggerCountdown() { | 
		
	
		
			
			|  |  |  | //调用接口 | 
		
	
		
			
			|  |  |  | this.getCode() | 
		
	
		
			
			|  |  |  | // 切换文字 | 
		
	
		
			
			|  |  |  | this.countdownState = !this.countdownState | 
		
	
		
			
			|  |  |  | // 定时器 | 
		
	
		
			
			|  |  |  | let intervalBtn = setInterval(() => { | 
		
	
		
			
			|  |  |  | // 倒数自减 | 
		
	
		
			
			|  |  |  | this.countNum-- | 
		
	
		
			
			|  |  |  | if (this.countNum < 0) { | 
		
	
		
			
			|  |  |  | // 清除定时器 | 
		
	
		
			
			|  |  |  | clearInterval(intervalBtn) | 
		
	
		
			
			|  |  |  | // 更改状态 | 
		
	
		
			
			|  |  |  | this.countdownState = !this.countdownState | 
		
	
		
			
			|  |  |  | // 重置倒计时状态 | 
		
	
		
			
			|  |  |  | this.countNum = 60 | 
		
	
		
			
			|  |  |  | } | 
		
	
		
			
			|  |  |  | // 倒计时 | 
		
	
		
			
			|  |  |  | }, 1000) | 
		
	
		
			
			|  |  |  | }, | 
		
	
		
			
			|  |  |  | go(url) { | 
		
	
		
			
			|  |  |  | this.$router.push(url) | 
		
	
		
			
			|  |  |  | }, | 
		
	
		
			
			|  |  |  | 
 | 
		
	
		
			
			|  |  |  | // 跳过填写邀请码 | 
		
	
		
			
			|  |  |  | skip() { | 
		
	
		
			
			|  |  |  | this.$router.push('/myPage') | 
		
	
		
			
			|  |  |  | }, | 
		
	
		
			
			|  |  |  | 
 | 
		
	
		
			
			|  |  |  | // 获取手机短信验证码 | 
		
	
		
			
			|  |  |  | getCode() { | 
		
	
		
			
			|  |  |  | if (this.codeInfo != '获取验证码') { | 
		
	
		
			
			|  |  |  | Toast.fail('请求过于频繁,请稍后再试') | 
		
	
		
			
			|  |  |  | return | 
		
	
		
			
			|  |  |  | } | 
		
	
		
			
			|  |  |  | const phoneValue = this.form.phone | 
		
	
		
			
			|  |  |  | // 将手机号置入本地存储 | 
		
	
		
			
			|  |  |  | localStorage.setItem('phoneValue', phoneValue) | 
		
	
		
			
			|  |  |  | let phoneReg = /^(?:(?:\+|00)86)?1[3-9]\d{9}$/ | 
		
	
		
			
			|  |  |  | let phoneValide = phoneReg.test(phoneValue) | 
		
	
		
			
			|  |  |  | 
 | 
		
	
		
			
			|  |  |  | if (!phoneValide) { | 
		
	
		
			
			|  |  |  | Toast.fail('请输入正确的手机号!') | 
		
	
		
			
			|  |  |  | } else { | 
		
	
		
			
			|  |  |  | this.getPhoneCode(phoneValue) | 
		
	
		
			
			|  |  |  | } | 
		
	
		
			
			|  |  |  | }, | 
		
	
		
			
			|  |  |  | // 获取随机验证码图片 | 
		
	
		
			
			|  |  |  | async getCodeImg() { | 
		
	
		
			
			|  |  |  | this.showCodeImg = false | 
		
	
		
			
			|  |  |  | await this.$axios({ | 
		
	
		
			
			|  |  |  | method: 'get', | 
		
	
		
			
			|  |  |  | url: doCodeImg | 
		
	
		
			
			|  |  |  | }).then((res) => { | 
		
	
		
			
			|  |  |  | this.codeImg = doCodeImg | 
		
	
		
			
			|  |  |  | }) | 
		
	
		
			
			|  |  |  | this.showCodeImg = true | 
		
	
		
			
			|  |  |  | }, | 
		
	
		
			
			|  |  |  | 
 | 
		
	
		
			
			|  |  |  | // 点击登录 | 
		
	
		
			
			|  |  |  | loginByPhoneCode() { | 
		
	
		
			
			|  |  |  | // 密码登录 | 
		
	
		
			
			|  |  |  | if (this.loginType == 1) { | 
		
	
		
			
			|  |  |  | const data = { | 
		
	
		
			
			|  |  |  | phone: this.form.phone, | 
		
	
		
			
			|  |  |  | password: this.form.password, | 
		
	
		
			
			|  |  |  | code: this.form.yzCode | 
		
	
		
			
			|  |  |  | } | 
		
	
		
			
			|  |  |  | this.LoginByPhone(data) | 
		
	
		
			
			|  |  |  | return | 
		
	
		
			
			|  |  |  | } | 
		
	
		
			
			|  |  |  | // 手机验证码登录 | 
		
	
		
			
			|  |  |  | if (this.loginType == 2) { | 
		
	
		
			
			|  |  |  | const data = { | 
		
	
		
			
			|  |  |  | phone: this.form.phone, | 
		
	
		
			
			|  |  |  | code: this.form.code | 
		
	
		
			
			|  |  |  | } | 
		
	
		
			
			|  |  |  | this.LoginByPhone(data) | 
		
	
		
			
			|  |  |  | return | 
		
	
		
			
			|  |  |  | } | 
		
	
		
			
			|  |  |  | // 忘记密码第一步 | 
		
	
		
			
			|  |  |  | if (this.loginType == 3) { | 
		
	
		
			
			|  |  |  | const data = { | 
		
	
		
			
			|  |  |  | phone: this.form.phone, | 
		
	
		
			
			|  |  |  | code: this.form.yzCode | 
		
	
		
			
			|  |  |  | } | 
		
	
		
			
			|  |  |  | this.sendPhoneCode(data) | 
		
	
		
			
			|  |  |  | return | 
		
	
		
			
			|  |  |  | } | 
		
	
		
			
			|  |  |  | // 忘记密码之新密码 | 
		
	
		
			
			|  |  |  | if (this.loginType == 4) { | 
		
	
		
			
			|  |  |  | const data = { | 
		
	
		
			
			|  |  |  | phone: this.form.phone, | 
		
	
		
			
			|  |  |  | code: this.form.code1, | 
		
	
		
			
			|  |  |  | pwd: this.form.newPassword1 | 
		
	
		
			
			|  |  |  | } | 
		
	
		
			
			|  |  |  | this.updPass(data) | 
		
	
		
			
			|  |  |  | return | 
		
	
		
			
			|  |  |  | } | 
		
	
		
			
			|  |  |  | // 注册 | 
		
	
		
			
			|  |  |  | if (this.loginType == 5) { | 
		
	
		
			
			|  |  |  | if (this.form.newPassword1 != this.form.newPassword2) { | 
		
	
		
			
			|  |  |  | Toast('两次输入密码不一致') | 
		
	
		
			
			|  |  |  | return | 
		
	
		
			
			|  |  |  | } | 
		
	
		
			
			|  |  |  | const data = { | 
		
	
		
			
			|  |  |  | phone: this.form.phone, | 
		
	
		
			
			|  |  |  | password: this.form.newPassword1 | 
		
	
		
			
			|  |  |  | } | 
		
	
		
			
			|  |  |  | this.registerByPhone(data) | 
		
	
		
			
			|  |  |  | return | 
		
	
		
			
			|  |  |  | } | 
		
	
		
			
			|  |  |  | }, | 
		
	
		
			
			|  |  |  | // 注册 | 
		
	
		
			
			|  |  |  | async registerByPhone(data) { | 
		
	
		
			
			|  |  |  | try { | 
		
	
		
			
			|  |  |  | const res = await doRegisterByPhone(data) | 
		
	
		
			
			|  |  |  | console.log(res) | 
		
	
		
			
			|  |  |  | this.loginType = 1 | 
		
	
		
			
			|  |  |  | } catch (error) { | 
		
	
		
			
			|  |  |  | console.log(error, 'error') | 
		
	
		
			
			|  |  |  | Toast.fail(error.message) | 
		
	
		
			
			|  |  |  | } | 
		
	
		
			
			|  |  |  | }, | 
		
	
		
			
			|  |  |  | // 忘记密码第一步,根据图片验证码和手机号获取短信 | 
		
	
		
			
			|  |  |  | async sendPhoneCode(data) { | 
		
	
		
			
			|  |  |  | try { | 
		
	
		
			
			|  |  |  | const res = await doSendPhoneCode(data) | 
		
	
		
			
			|  |  |  | console.log(res) | 
		
	
		
			
			|  |  |  | this.loginType = 4 | 
		
	
		
			
			|  |  |  | } catch (error) { | 
		
	
		
			
			|  |  |  | console.log(error, 'error') | 
		
	
		
			
			|  |  |  | Toast.fail(error.message) | 
		
	
		
			
			|  |  |  | } | 
		
	
		
			
			|  |  |  | }, | 
		
	
		
			
			|  |  |  | // 忘记密码第二部,提交验证码和新密码 | 
		
	
		
			
			|  |  |  | async updPass(data) { | 
		
	
		
			
			|  |  |  | try { | 
		
	
		
			
			|  |  |  | const res = await doUpdPass(data) | 
		
	
		
			
			|  |  |  | console.log(res) | 
		
	
		
			
			|  |  |  | this.loginType = 1 | 
		
	
		
			
			|  |  |  | } catch (error) { | 
		
	
		
			
			|  |  |  | console.log(error, 'error') | 
		
	
		
			
			|  |  |  | Toast.fail(error.message) | 
		
	
		
			
			|  |  |  | } | 
		
	
		
			
			|  |  |  | }, | 
		
	
		
			
			|  |  |  | // 提交邀请码 | 
		
	
		
			
			|  |  |  | submitInviteCode() { | 
		
	
		
			
			|  |  |  | const data = { | 
		
	
		
			
			|  |  |  | inviteCode: this.formIII.inviteCode | 
		
	
		
			
			|  |  |  | } | 
		
	
		
			
			|  |  |  | this.updateInviteCode(data) | 
		
	
		
			
			|  |  |  | }, | 
		
	
		
			
			|  |  |  | 
 | 
		
	
		
			
			|  |  |  | /** | 
		
	
		
			
			|  |  |  | * @description:获取手机验证码 | 
		
	
		
			
			|  |  |  | */ | 
		
	
		
			
			|  |  |  | async getPhoneCode(phone) { | 
		
	
		
			
			|  |  |  | try { | 
		
	
		
			
			|  |  |  | const res = await getCodeByPhone(phone) | 
		
	
		
			
			|  |  |  | Toast.success('短信验证码发送成功!') | 
		
	
		
			
			|  |  |  | this.codeInfo = 60 | 
		
	
		
			
			|  |  |  | const timer = setInterval(() => { | 
		
	
		
			
			|  |  |  | if (this.codeInfo != 1) { | 
		
	
		
			
			|  |  |  | this.codeInfo-- | 
		
	
		
			
			|  |  |  | } else { | 
		
	
		
			
			|  |  |  | clearInterval(timer) | 
		
	
		
			
			|  |  |  | this.codeInfo = '获取验证码' | 
		
	
		
			
			|  |  |  | } | 
		
	
		
			
			|  |  |  | }, 1000) | 
		
	
		
			
			|  |  |  | } catch (error) { | 
		
	
		
			
			|  |  |  | console.log(error, 'error') | 
		
	
		
			
			|  |  |  | Toast.fail(error.message) | 
		
	
		
			
			|  |  |  | } | 
		
	
		
			
			|  |  |  | }, | 
		
	
		
			
			|  |  |  | 
 | 
		
	
		
			
			|  |  |  | /** | 
		
	
		
			
			|  |  |  | * @description:短信验证码登录 | 
		
	
		
			
			|  |  |  | */ | 
		
	
		
			
			|  |  |  | async LoginByPhone(loginParams) { | 
		
	
		
			
			|  |  |  | try { | 
		
	
		
			
			|  |  |  | //密码登录 | 
		
	
		
			
			|  |  |  | if (this.loginType == 1) { | 
		
	
		
			
			|  |  |  | const res = await doLogin(loginParams) | 
		
	
		
			
			|  |  |  | console.log(res) | 
		
	
		
			
			|  |  |  | } | 
		
	
		
			
			|  |  |  | // 短信登录 | 
		
	
		
			
			|  |  |  | if (this.loginType == 2) { | 
		
	
		
			
			|  |  |  | const res = await doLoginByPhone(loginParams) | 
		
	
		
			
			|  |  |  | } | 
		
	
		
			
			|  |  |  | console.log(res, '登录数据') | 
		
	
		
			
			|  |  |  | const token = res.data.token | 
		
	
		
			
			|  |  |  | // 将token置入本地存储 | 
		
	
		
			
			|  |  |  | localStorage.setItem('AccessToken', token) | 
		
	
		
			
			|  |  |  | // 查询有无邀请码 | 
		
	
		
			
			|  |  |  | this.checkInviteCode() | 
		
	
		
			
			|  |  |  | } catch (error) { | 
		
	
		
			
			|  |  |  | console.log(error, 'error') | 
		
	
		
			
			|  |  |  | Toast.fail(error.message) | 
		
	
		
			
			|  |  |  | } | 
		
	
		
			
			|  |  |  | }, | 
		
	
		
			
			|  |  |  | 
 | 
		
	
		
			
			|  |  |  | /** | 
		
	
		
			
			|  |  |  | * @description:查询用户邀请码状态 | 
		
	
		
			
			|  |  |  | */ | 
		
	
		
			
			|  |  |  | async checkInviteCode() { | 
		
	
		
			
			|  |  |  | try { | 
		
	
		
			
			|  |  |  | const res = await doFindInviteCode() | 
		
	
		
			
			|  |  |  | console.log(res, '查询用户邀请码数据') | 
		
	
		
			
			|  |  |  | const status = res.data.status | 
		
	
		
			
			|  |  |  | // 当没有邀请码时,切换输入验证码页面 | 
		
	
		
			
			|  |  |  | if (status == 0) { | 
		
	
		
			
			|  |  |  | this.loginType = 3 | 
		
	
		
			
			|  |  |  | // 有邀请码直接前往我的页面 | 
		
	
		
			
			|  |  |  | } else if (status == 1) { | 
		
	
		
			
			|  |  |  | Toast.success('登录成功!') | 
		
	
		
			
			|  |  |  | this.$router.push('/myPage') | 
		
	
		
			
			|  |  |  | } | 
		
	
		
			
			|  |  |  | } catch (error) { | 
		
	
		
			
			|  |  |  | console.log(error, 'error') | 
		
	
		
			
			|  |  |  | Toast.fail(error.message) | 
		
	
		
			
			|  |  |  | } | 
		
	
		
			
			|  |  |  | }, | 
		
	
		
			
			|  |  |  | /** | 
		
	
		
			
			|  |  |  | * @description:查询用户邀请码状态 | 
		
	
		
			
			|  |  |  | */ | 
		
	
		
			
			|  |  |  | async checkInviteCode() { | 
		
	
		
			
			|  |  |  | this.src = '/api/captcha.jpg?t=' + Date() | 
		
	
		
			
			|  |  |  | }, | 
		
	
		
			
			|  |  |  | /** | 
		
	
		
			
			|  |  |  | * @description:更新邀请码 | 
		
	
		
			
			|  |  |  | */ | 
		
	
		
			
			|  |  |  | async updateInviteCode(inviteCodeData) { | 
		
	
		
			
			|  |  |  | try { | 
		
	
		
			
			|  |  |  | const res = await doUpdateInviteCode(inviteCodeData) | 
		
	
		
			
			|  |  |  | console.log(res, '更新邀请码数据') | 
		
	
		
			
			|  |  |  | Toast.success('登录成功!') | 
		
	
		
			
			|  |  |  | this.$router.push('/myPage') | 
		
	
		
			
			|  |  |  | } catch (error) { | 
		
	
		
			
			|  |  |  | console.log(error, 'error') | 
		
	
		
			
			|  |  |  | Toast.fail(error.message) | 
		
	
		
			
			|  |  |  | } | 
		
	
		
			
			|  |  |  | } | 
		
	
		
			
			|  |  |  | }, | 
		
	
		
			
			|  |  |  | created() { | 
		
	
		
			
			|  |  |  | // 手机号记忆回填 | 
		
	
		
			
			|  |  |  | const phoneValue = localStorage.getItem('phoneValue') | 
		
	
		
			
			|  |  |  | this.form.phone = phoneValue ? phoneValue : '' | 
		
	
		
			
			|  |  |  | this.getCodeImg() | 
		
	
		
			
			|  |  |  | }, | 
		
	
		
			
			|  |  |  | mounted() { | 
		
	
		
			
			|  |  |  | this.inPage = true | 
		
	
		
			
			|  |  |  | scrollToID('top') | 
		
	
		
			
			|  |  |  | } | 
		
	
		
			
			|  |  |  | } | 
		
	
		
			
			|  |  |  | </script> | 
		
	
		
			
			|  |  |  | 
 | 
		
	
		
			
			|  |  |  | <style lang="scss" scoped> | 
		
	
		
			
			|  |  |  | .shuaxin { | 
		
	
		
			
			|  |  |  | margin-left: 10px; | 
		
	
		
			
			|  |  |  | font-size: 25px; | 
		
	
		
			
			|  |  |  | line-height: 40px; | 
		
	
		
			
			|  |  |  | color: rgb(96, 208, 201); | 
		
	
		
			
			|  |  |  | } | 
		
	
		
			
			|  |  |  | .yzmImg { | 
		
	
		
			
			|  |  |  | margin-left: 10px; | 
		
	
		
			
			|  |  |  | height: 40px; | 
		
	
		
			
			|  |  |  | width: 100%; | 
		
	
		
			
			|  |  |  | } | 
		
	
		
			
			|  |  |  | .greenColor { | 
		
	
		
			
			|  |  |  | color: #5ed5c8; | 
		
	
		
			
			|  |  |  | } | 
		
	
		
			
			|  |  |  | .page { | 
		
	
		
			
			|  |  |  | opacity: 0; | 
		
	
		
			
			|  |  |  | transition: all 0.5s; // global-transition | 
		
	
		
			
			|  |  |  | &.active { | 
		
	
		
			
			|  |  |  | opacity: 1; | 
		
	
		
			
			|  |  |  | } | 
		
	
		
			
			|  |  |  | .logoBox { | 
		
	
		
			
			|  |  |  | // margin-top: 10px; | 
		
	
		
			
			|  |  |  | margin-left: 5px; | 
		
	
		
			
			|  |  |  | margin-top: 25px; | 
		
	
		
			
			|  |  |  | margin-bottom: 25px; | 
		
	
		
			
			|  |  |  | overflow: hidden; | 
		
	
		
			
			|  |  |  | cursor: pointer; | 
		
	
		
			
			|  |  |  | text-align: center; | 
		
	
		
			
			|  |  |  | .logo { | 
		
	
		
			
			|  |  |  | width: 240px; | 
		
	
		
			
			|  |  |  | height: 70px; | 
		
	
		
			
			|  |  |  | } | 
		
	
		
			
			|  |  |  | } | 
		
	
		
			
			|  |  |  | 
 | 
		
	
		
			
			|  |  |  | .loginBox { | 
		
	
		
			
			|  |  |  | height: 500px; | 
		
	
		
			
			|  |  |  | // background: linear-gradient(140deg, #6e60e9, #2867d4, #1ec2ae); | 
		
	
		
			
			|  |  |  | margin: auto; | 
		
	
		
			
			|  |  |  | text-align: center; | 
		
	
		
			
			|  |  |  | padding-left: 30px; | 
		
	
		
			
			|  |  |  | padding-right: 30px; | 
		
	
		
			
			|  |  |  | .welcome { | 
		
	
		
			
			|  |  |  | font-size: 18px; | 
		
	
		
			
			|  |  |  | color: #000; | 
		
	
		
			
			|  |  |  | font-weight: 600; | 
		
	
		
			
			|  |  |  | margin-bottom: 40px; | 
		
	
		
			
			|  |  |  | } | 
		
	
		
			
			|  |  |  | .inBoxEnd { | 
		
	
		
			
			|  |  |  | display: flex; | 
		
	
		
			
			|  |  |  | justify-content: end !important; | 
		
	
		
			
			|  |  |  | } | 
		
	
		
			
			|  |  |  | .phone { | 
		
	
		
			
			|  |  |  | position: relative; | 
		
	
		
			
			|  |  |  | margin-bottom: 25px; | 
		
	
		
			
			|  |  |  | 
 | 
		
	
		
			
			|  |  |  | .getCode { | 
		
	
		
			
			|  |  |  | position: absolute; | 
		
	
		
			
			|  |  |  | top: 1px; | 
		
	
		
			
			|  |  |  | right: 10px; | 
		
	
		
			
			|  |  |  | color: #0068b7; | 
		
	
		
			
			|  |  |  | } | 
		
	
		
			
			|  |  |  | } | 
		
	
		
			
			|  |  |  | .code { | 
		
	
		
			
			|  |  |  | position: relative; | 
		
	
		
			
			|  |  |  | .inputCode { | 
		
	
		
			
			|  |  |  | position: absolute; | 
		
	
		
			
			|  |  |  | background-color: #fff; | 
		
	
		
			
			|  |  |  | top: -5px; | 
		
	
		
			
			|  |  |  | left: 12px; | 
		
	
		
			
			|  |  |  | font-size: 12px; | 
		
	
		
			
			|  |  |  | height: 10px; | 
		
	
		
			
			|  |  |  | line-height: 10px; | 
		
	
		
			
			|  |  |  | color: #0068b7; | 
		
	
		
			
			|  |  |  | } | 
		
	
		
			
			|  |  |  | } | 
		
	
		
			
			|  |  |  | .morePage { | 
		
	
		
			
			|  |  |  | display: flex; | 
		
	
		
			
			|  |  |  | justify-content: space-between; | 
		
	
		
			
			|  |  |  | margin-top: -9px; | 
		
	
		
			
			|  |  |  | } | 
		
	
		
			
			|  |  |  | .submitBtn { | 
		
	
		
			
			|  |  |  | position: relative; | 
		
	
		
			
			|  |  |  | // right: 10px; | 
		
	
		
			
			|  |  |  | // float: right; | 
		
	
		
			
			|  |  |  | color: #fff; | 
		
	
		
			
			|  |  |  | font-size: 15px; | 
		
	
		
			
			|  |  |  | line-height: 15px; | 
		
	
		
			
			|  |  |  | border: none; | 
		
	
		
			
			|  |  |  | margin-top: 25px; | 
		
	
		
			
			|  |  |  | // margin-bottom: 7.5px; | 
		
	
		
			
			|  |  |  | padding: 9px; | 
		
	
		
			
			|  |  |  | background-color: #0068b7; | 
		
	
		
			
			|  |  |  | border-radius: 5px; | 
		
	
		
			
			|  |  |  | background-image: linear-gradient( | 
		
	
		
			
			|  |  |  | 316deg, | 
		
	
		
			
			|  |  |  | rgba(110, 228, 215, 1) 0, | 
		
	
		
			
			|  |  |  | rgba(55, 196, 241, 1) 31.975823%, | 
		
	
		
			
			|  |  |  | rgba(164, 154, 252, 1) 100% | 
		
	
		
			
			|  |  |  | ); | 
		
	
		
			
			|  |  |  | border-radius: 25px; | 
		
	
		
			
			|  |  |  | width: 315px; | 
		
	
		
			
			|  |  |  | height: 50px; | 
		
	
		
			
			|  |  |  | // padding: 12px 138px 12px 138px; | 
		
	
		
			
			|  |  |  | &.inside { | 
		
	
		
			
			|  |  |  | top: 10px; | 
		
	
		
			
			|  |  |  | } | 
		
	
		
			
			|  |  |  | } | 
		
	
		
			
			|  |  |  | .skipBtn { | 
		
	
		
			
			|  |  |  | position: relative; | 
		
	
		
			
			|  |  |  | top: 10px; | 
		
	
		
			
			|  |  |  | left: 70px; | 
		
	
		
			
			|  |  |  | right: 10px; | 
		
	
		
			
			|  |  |  | width: 78px; | 
		
	
		
			
			|  |  |  | height: 30px; | 
		
	
		
			
			|  |  |  | color: #fff; | 
		
	
		
			
			|  |  |  | font-size: 15px; | 
		
	
		
			
			|  |  |  | line-height: 15px; | 
		
	
		
			
			|  |  |  | border: none; | 
		
	
		
			
			|  |  |  | padding: 9px; | 
		
	
		
			
			|  |  |  | background-color: #0068b7; | 
		
	
		
			
			|  |  |  | border-radius: 3px; | 
		
	
		
			
			|  |  |  | margin-top: 160px; | 
		
	
		
			
			|  |  |  | &.skip { | 
		
	
		
			
			|  |  |  | background-color: #a0a0a0; | 
		
	
		
			
			|  |  |  | } | 
		
	
		
			
			|  |  |  | } | 
		
	
		
			
			|  |  |  | .forgetPwd { | 
		
	
		
			
			|  |  |  | position: relative; | 
		
	
		
			
			|  |  |  | top: -10px; | 
		
	
		
			
			|  |  |  | float: left; | 
		
	
		
			
			|  |  |  | font-size: 12px; | 
		
	
		
			
			|  |  |  | color: #0068b7; | 
		
	
		
			
			|  |  |  | } | 
		
	
		
			
			|  |  |  | } | 
		
	
		
			
			|  |  |  | } | 
		
	
		
			
			|  |  |  | ::v-deep .el-input__inner { | 
		
	
		
			
			|  |  |  | height: 42px; | 
		
	
		
			
			|  |  |  | border: 0px; | 
		
	
		
			
			|  |  |  | background-color: #f6f6f6; | 
		
	
		
			
			|  |  |  | } | 
		
	
		
			
			|  |  |  | ::v-deep .el-form-item { | 
		
	
		
			
			|  |  |  | margin-bottom: 25px; | 
		
	
		
			
			|  |  |  | } | 
		
	
		
			
			|  |  |  | </style> |