login.vue 2.41 KB
<template>
  <div class="login_container">
    <div class="login_title">短信验证码登录</div>
    <div class="title_dsc">未注册手机验证后将自动注册</div>
    <el-form ref="ruleFormRef" :model="ruleForm" :rules="rules" class="login_from">
      <el-form-item prop="phoneNumber">
        <el-input v-model="ruleForm.phoneNumber" :maxlength="11" placeholder="请输入手机号"></el-input>
      </el-form-item>
      <!--<el-form-item prop="msgCode" class="code_wrap">
          <el-input v-model="ruleForm.msgCode" :maxlength="11" placeholder="请输入验证码"></el-input>
          <el-button type="primary" :loading="loading" class="send_code" @click="sendPhoneMsg" link>发送验证码</el-button>
      </el-form-item>-->
      <el-form-item prop="isAgree">
        登录即代表您已同意
        <el-link href="https://www.smerzxyfw.com/static/img/homebanner.34a20ab9.png" target="_blank">《用户服务协议》
        </el-link>
        <el-link href="https://www.smerzxyfw.com/static/img/homebanner.34a20ab9.png" target="_blank">《隐私协议》
        </el-link>
      </el-form-item>
    </el-form>

    <el-button type="primary" round :loading="loading" @click="login" style="width: 100%" class="primary-btn">下一步
    </el-button>
  </div>
</template>

<script setup lang='ts'>
import * as api from "./../interface/login"
import {formValidationForm} from "./../utils/vaildation"
import router from "../router/index";
import '../assets/css/login.scss'
import {Encrypt, Decrypt} from './../utils/sm4Untils'
import {setTokenKey} from '../utils/auth'

let ruleForm = reactive({
  phoneNumber: undefined,
  msgCode: undefined,
})
let loading = ref(false)
let rules = reactive<FormRules>({
  phoneNumber: [
    {required: true, message: "请输入手机号", trigger: ["blur", "change"]},
    {validator: formValidationForm.Form().checkCellPhone_N, trigger: ["blur"]}
  ],
  msgCode: [
    {required: true, message: "请输入验证码", trigger: ["blur", "change"]}
  ],
})
const ruleFormRef = ref<FormInstance>()

// ruleForm.phoneNumber = '18801291704'

let login = () => {
  ruleFormRef.value.validate((vaild, fileds) => {
    if (vaild) {
      // let phoneNumber = Encrypt(JSON.stringify({'p':ruleForm.phoneNumber}), '5492123658175926')
      setTokenKey("p", ruleForm.phoneNumber)
      router.push('/sendCode')
    }
  })
}

const arrowPath = ref("/")
defineExpose({arrowPath})

</script>

<style scoped>
</style>