From d922b18d12b9d37f9279c4732daf6451e79ff601 Mon Sep 17 00:00:00 2001 From: yangfeng <wanwan926_4@163.com> Date: 星期一, 18 三月 2024 14:52:47 +0800 Subject: [PATCH] 注掉alert(JWT失效,即将跳转至登录页)弹窗 --- src/views/login/loginView.vue | 62 +++++++++++++++++++++++++++--- 1 files changed, 55 insertions(+), 7 deletions(-) diff --git a/src/views/login/loginView.vue b/src/views/login/loginView.vue index c6d28f7..3059412 100644 --- a/src/views/login/loginView.vue +++ b/src/views/login/loginView.vue @@ -19,9 +19,14 @@ autocomplete="off" /> </el-form-item> - <!-- <el-form-item label="纭瀵嗙爜" prop="checkPass"> - <el-input v-model="ruleForm.checkPass" type="password" autocomplete="off" /> - </el-form-item> --> + <el-form-item label="" prop="code"> + <el-input v-model="ruleForm.code" placeholder="楠岃瘉鐮�" autocomplete="off" style="width: 70%"> + <template #append> + <img class="login-code" :src="captcha" @click="getCaptchaData" /> + </template> + </el-input> + <!-- <img class="login-code" :src="captcha" @click="getCaptchaData" /> --> + </el-form-item> <el-form-item> <el-button type="primary" @click="submitForm(ruleFormRef)">鐧诲綍</el-button> </el-form-item> @@ -32,8 +37,12 @@ </template> <script setup lang="ts"> -import { ref, reactive } from 'vue' +import { ref, reactive, onMounted } from 'vue' import type { FormInstance, FormRules } from 'element-plus' +import { getCaptcha, login } from '@/api' +import { setToken, getToken } from '@/common/utils/index' +import { ElMessage } from 'element-plus' +import { useRouter } from 'vue-router' const ruleFormRef = ref<FormInstance>() @@ -65,7 +74,22 @@ const ruleForm = reactive({ pass: '', // checkPass: '', - accountNumber: '' + accountNumber: '', + code: '' +}) + +const captcha = ref('') +const captchaId = ref('') + +const getCaptchaData = () => { + getCaptcha().then((rsp: any) => { + captcha.value = rsp?.data?.picPath + captchaId.value = rsp?.data?.captchaId + }) +} +onMounted(() => { + // 鑾峰彇楠岃瘉鐮� + getCaptchaData() }) const rules = reactive<FormRules<typeof ruleForm>>({ @@ -74,11 +98,29 @@ accountNumber: [{ validator: checkAge, trigger: 'blur' }] }) +const router = useRouter() + const submitForm = (formEl: FormInstance | undefined) => { if (!formEl) return formEl.validate((valid) => { if (valid) { - console.log('submit!') + login({ + username: ruleForm.accountNumber, + password: ruleForm.pass, + captcha: ruleForm.code, + captchaId: captchaId.value + }).then((rsp: any) => { + console.log(rsp) + setToken(rsp?.data?.token) + ElMessage({ + message: '鐧诲綍鎴愬姛锛�', + type: 'success' + }) + ruleForm.accountNumber = '' + ruleForm.pass = '' + ruleForm.code = '' + router.push('/') + }) } else { console.log('error submit!') return false @@ -143,7 +185,13 @@ } } } - +.login-code { + height: 40px - 2px; + display: block; + margin: 0px -20px; + border-top-right-radius: 2px; + border-bottom-right-radius: 2px; +} ::v-deep .el-form-item__content { display: flex; align-items: center; -- Gitblit v1.8.0