From b26933c801fbf69df56fd81df3e127e39a14b31d Mon Sep 17 00:00:00 2001
From: yangfeng <wanwan926_4@163.com>
Date: 星期一, 05 二月 2024 19:18:18 +0800
Subject: [PATCH] 存token的问题

---
 src/views/login/loginView.vue |   54 ++++++++++++++++++++++++++++++++++++++++++++++++------
 1 files changed, 48 insertions(+), 6 deletions(-)

diff --git a/src/views/login/loginView.vue b/src/views/login/loginView.vue
index c6d28f7..c736822 100644
--- a/src/views/login/loginView.vue
+++ b/src/views/login/loginView.vue
@@ -19,9 +19,10 @@
               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%"> </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 +33,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 } from '@/common/utils/index'
+import { ElMessage } from 'element-plus'
+import { useRouter } from 'vue-router'
 
 const ruleFormRef = ref<FormInstance>()
 
@@ -65,7 +70,24 @@
 const ruleForm = reactive({
   pass: '',
   // checkPass: '',
-  accountNumber: ''
+  accountNumber: '',
+  code: ''
+})
+
+const captcha = ref('')
+const captchaId = ref('')
+
+const getCaptchaData = () => {
+  getCaptcha().then((rsp) => {
+    if (rsp.code == 200) {
+      captcha.value = rsp.data.picPath
+      captchaId.value = rsp.data.captchaId
+    }
+  })
+}
+onMounted(() => {
+  // 鑾峰彇楠岃瘉鐮�
+  getCaptchaData()
 })
 
 const rules = reactive<FormRules<typeof ruleForm>>({
@@ -74,11 +96,31 @@
   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) => {
+        if (rsp.code == 200) {
+          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

--
Gitblit v1.8.0