wwf
15 小时以前 a32100e31b93bc378b11ab93617a9c40b081ad70
src/views/login/index.vue
@@ -32,11 +32,17 @@
            </template>
          </el-input>
        </el-form-item>
        <el-form-item prop="agreement" style="height: 30px;">
        <!-- <el-form-item prop="agreement" style="height: 30px;">
          <el-checkbox v-model="form.agreement" label="同意xxx服务协议" size="large" />
        </el-form-item>
        </el-form-item> -->
        <el-button class="mt-1" @click="submitLogin()" :loading="loginLoading" type="primary" size="large" style="width: 100%;">
        <el-button
          class="mt-3"
          @click="submitLogin()"
          :loading="loginLoading"
          type="primary" size="large"
          style="width: 100%;"
        >
          <el-text class="text-lg text-white">登录</el-text>
        </el-button>
      </el-form>
@@ -55,8 +61,18 @@
            <el-radio :value="0">女</el-radio>
          </el-radio-group>
        </el-form-item>
        <el-form-item prop="idCard">
          <el-input v-model="form.idCard" placeholder="请输入身份证号" />
        <el-form-item prop="idCardType">
          <el-select v-model="form.idCardType" placeholder="证件类型">
            <el-option
              v-for="item in idCardTypeItems"
              :key="item.value"
              :label="item.label"
              :value="item.value"
            />
          </el-select>
        </el-form-item>
        <el-form-item prop="idCard" :rules="[$rules.required('请输入证件号码'), form.idCardType == 1 ? $rules.idCard('请输入正确的身份证号'): '' ]">
          <el-input v-model="form.idCard" placeholder="请输入证件号码" />
        </el-form-item>
        <el-form-item prop="mobile">
          <el-input v-model="form.mobile" placeholder="请输入手机号" />
@@ -79,11 +95,17 @@
            </template>
          </el-input>
        </el-form-item>
        <el-form-item prop="agreement" style="height: 30px;">
        <!-- <el-form-item prop="agreement" style="height: 30px;">
          <el-checkbox v-model="form.agreement" label="同意xxx服务协议" size="large" />
        </el-form-item>
        </el-form-item> -->
        <el-button class="mt-1" @click="submitRegister()" type="primary" size="large" style="width: 100%;">
        <el-button
          class="mt-5"
          :loading="registerLoading"
          @click="submitRegister()"
          type="primary" size="large"
          style="width: 100%;"
        >
          <el-text class="text-lg text-white">注册</el-text>
        </el-button>
      </el-form>
@@ -91,7 +113,7 @@
      <el-row class="mt-7" justify="center">
        <el-button v-if="loginType!='register'" text type="primary" @click="changeLoginType('register')">注册账号</el-button>
        <el-divider v-if="loginType!='register'" direction="vertical" class="m-0 mt-1 mx-4" style="height: 24px !important" />
        <el-button v-if="loginType!='qrCode'" text type="primary" @click="changeLoginType('qrCode')">二维码登录</el-button>
        <el-button v-if="loginType!='qrCode'" text type="primary" @click="changeLoginType('qrCode')">微信扫码登录</el-button>
        <el-divider v-if="loginType=='register'" direction="vertical" class="m-0 mt-1 mx-4" style="height: 24px !important" />
        <el-button v-if="loginType!='mobile'" text type="primary" @click="changeLoginType('mobile')">手机号登录</el-button>
      </el-row>
@@ -103,6 +125,8 @@
import { useLoginStore } from '@/stores/login.js'
import { useSessionStore } from '@/stores/session.js'
import { storeToRefs } from 'pinia';
import idCardTypeItems from '@/assets/json/idCardTypeItems.json'
import { tokenUtils } from '@/utils/axios.js';
export default {
  components: {},
  setup() {
@@ -116,14 +140,15 @@
      form: {
        name: '',
        sex: 1,
        idCardType: 1,
        idCard: '',
        mobile: '13537719675',
        mobile: '',
        code: '',
        agreement: false
      },
      idCardTypeItems: idCardTypeItems,
      rules: {
        name: [ this.$rules.required('请输入姓名') ],
        idCard: [ this.$rules.required('请输入身份证号') ],
        mobile: [ this.$rules.required('请输入手机号'), this.$rules.phone() ],
        code: [ this.$rules.required('请填写验证码'), this.$rules.code() ],
        agreement: [ this.$rules.checkbox('请阅读并勾选同意协议') ]
@@ -131,7 +156,8 @@
      countdown: 180,
      countdownInterval: null,
      sendCodeLoading: false,
      loginLoading: false
      loginLoading: false,
      registerLoading: false
    }
  },
  computed: {
@@ -151,15 +177,45 @@
    this.clearCountdownInterval()
  },
  watch: {
    loginDialogVisible: function(val) {
      if (!val) {
        this.clearCountdownInterval()
      }
    }
  },
  methods: {
    async sendCode() {
      try {
        await this.$refs.accountForm.validateField('mobile')
        this.startCountdownInterval()
        this.$message.success('已发送验证码,请注意查收')
        let ref = null
        let scene = 0
        if (this.loginType == 'mobile') {
          ref = this.$refs.accountForm
          scene = 33
        } else if (this.loginType == 'register') {
          ref = this.$refs.registerForm
          scene = 32
        }
        const validate = await ref.validateField('mobile')
        if (validate) {
          const data = {
            captchaVerification: '',
            mobile: this.form.mobile,
            scene: scene,
          }
          this.sendCodeLoading = true
          this.$axios.post('/system/auth/send-sms-code', data).then(res => {
            if (res.data.code == 0) {
              this.startCountdownInterval()
              this.$message.success('已发送验证码,请注意查收')
            } else {
              this.$message.error(res.data.msg || '获取验证码失败')
            }
          }).finally(() => {
            this.sendCodeLoading = false
          })
        }
      } catch (error) {
        console.log(error)
        this.$message.error('请输入手机号码')
      }
    },
@@ -183,29 +239,57 @@
      try {
        await this.$refs.accountForm.validate()
        this.loginLoading = true
        setTimeout(() => {
          localStorage.setItem('accessToken', '123456')
          this.getUserInfo()
          this.$message.success('登录成功')
          this.loginDialogVisible = false
        const data = {
          mobile: this.form.mobile,
          code: this.form.code
        }
        this.$axios.post('/system/kw/examinee/login', data).then(res => {
          if (res.data.code == 0) {
            const resData = res.data.data || {}
              tokenUtils.setTokens(resData.accessToken, resData.refreshToken)
              this.getUserInfo()
              this.$message.success('登录成功')
              this.loginDialogVisible = false
          } else {
            this.$message.error(res.data.msg)
          }
        }).finally(() => {
          this.loginLoading = false
        }, 1000)
        })
      } catch (error) {
        console.log()
      }
    },
    getUserInfo() {
      this.setUserInfo({
        id: '123456',
        username: '黄婷婷',
      this.$axios.get('/system/kw/examinee/profile').then(res => {
        if (res.data.code == 0) {
          const resData = res.data.data || {}
          this.setUserInfo(resData)
        } else {
          this.$message.error(res.data.msg)
        }
      })
    },
    async submitRegister() {
      try {
        await this.$refs.registerForm.validate()
        const validate = await this.$refs.registerForm.validate()
        if (validate) {
          const data = { ...this.form }
          this.$axios.post('/system/kw/examinee/register', data).then(res => {
            if (res.data.code == 0) {
              const resData = res.data.data || {}
              tokenUtils.setTokens(resData.accessToken, resData.refreshToken)
              this.getUserInfo()
              this.$message.success('注册成功')
              this.loginDialogVisible = false
            } else {
              this.$message.error(res.data.msg)
            }
          })
        }
      } catch (error) {
        console.log()
        console.log(error)
        this.$message.error('请检查必填字段')
      }
    },
    changeLoginType(type) {