From 2b5363be8ea935d1bd67e717c9e14fe5659b8500 Mon Sep 17 00:00:00 2001
From: zhaoyz <w@23432>
Date: Thu, 1 Feb 2024 18:37:21 +0800
Subject: [PATCH] =?UTF-8?q?=E9=AA=8C=E8=AF=81=E7=A0=81demo?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 package.json              |  2 +
 src/views/login/login.vue | 90 ++++++++++++++++++++++-----------------
 2 files changed, 52 insertions(+), 40 deletions(-)

diff --git a/package.json b/package.json
index efb01f6..3d820c2 100644
--- a/package.json
+++ b/package.json
@@ -16,12 +16,14 @@
     "pinia": "^2.1.7",
     "sass": "^1.58.3",
     "slider-verify-v3": "^1.1.11",
+    "uuid": "^9.0.1",
     "vue": "^3.2.45",
     "vue-router": "^4.1.6",
     "xlsx": "^0.18.5"
   },
   "devDependencies": {
     "@types/node": "^18.11.12",
+    "@types/uuid": "^9.0.8",
     "@vitejs/plugin-vue": "^4.0.0",
     "@vue/tsconfig": "^0.1.3",
     "npm-run-all": "^4.1.5",
diff --git a/src/views/login/login.vue b/src/views/login/login.vue
index 603d80b..953906b 100644
--- a/src/views/login/login.vue
+++ b/src/views/login/login.vue
@@ -8,41 +8,41 @@
                 </el-select>
             </div>
 
-            <img v-show="!isShowRegister" class="logo move_2" src="@/assets/imgs/logo.png">
-            <div v-if="!isShowRegister" class="login-block move_2">
-                <div class="login-way">
-                    <span :class="passwordLogin && 'active'" @click="passwordLogin = true">密码登录</span>
-                    <span :class="!passwordLogin && 'active'" @click="passwordLogin = false">验证码登录</span>
-                </div>
-                <el-form ref="loginFormRef" :model="loginParams" :rules="loginRules" label-width="0" size="small">
-                    <div class="login-form password-login" v-if="passwordLogin">
-                        <el-form-item prop="account">
-                            <el-input v-model="loginParams.account" placeholder="请输入用户名">
-                                <template #prepend>
-                                    <el-icon>
-                                        <User />
-                                    </el-icon>
-                                </template>
-                            </el-input>
-                        </el-form-item>
-                        <el-form-item prop="password">
-                            <el-input v-model="loginParams.password" type="password" show-password placeholder="请输入密码">
-                                <template #prepend>
-                                    <el-icon>
-                                        <Lock />
-                                    </el-icon>
-                                </template>
-                            </el-input>
-                        </el-form-item>
-                        <el-button class="login-btn" type="primary" @click="login('password')">登录</el-button>
-                        <span class="register-btn" @click="isShowRegister = true">注册账号</span>
-                    </div>
-                    <div class="login-form code-login" v-else>
-                        <el-form-item prop="phone">
-                            <el-input v-model="loginParams.phone" placeholder="请输入手机号">
-                                <template #prepend>
-                                    <div @click.stop style="display: flex;align-items: center;">
-                                        <el-dropdown @command="selectPhoneArea">
+      <img v-show="!isShowRegister" class="logo move_2" src="@/assets/imgs/logo.png">
+      <div v-if="!isShowRegister" class="login-block move_2">
+        <div class="login-way">
+          <span :class="passwordLogin && 'active'" @click="passwordLogin = true">密码登录</span>
+          <span :class="!passwordLogin && 'active'" @click="passwordLogin = false">验证码登录</span>
+        </div>
+        <el-form ref="loginFormRef" :model="loginParams" :rules="loginRules" label-width="0" size="small">
+          <div class="login-form password-login" v-if="passwordLogin">
+            <el-form-item prop="account">
+              <el-input v-model="loginParams.account" placeholder="请输入用户名">
+                <template #prepend>
+                  <el-icon>
+                    <User/>
+                  </el-icon>
+                </template>
+              </el-input>
+            </el-form-item>
+            <el-form-item prop="password">
+              <el-input v-model="loginParams.password" type="password" show-password placeholder="请输入密码">
+                <template #prepend>
+                  <el-icon>
+                    <Lock/>
+                  </el-icon>
+                </template>
+              </el-input>
+            </el-form-item>
+            <el-button class="login-btn" type="primary" @click="login('password')">登录</el-button>
+            <span class="register-btn" @click="getCaptchaCode()">注册账号</span>
+          </div>
+          <div class="login-form code-login" v-else>
+            <el-form-item prop="phone">
+              <el-input v-model="loginParams.phone" placeholder="请输入手机号">
+                <template #prepend>
+                  <div @click.stop style="display: flex;align-items: center;">
+                    <el-dropdown @command="selectPhoneArea">
                                             <span style="color: #909399;">{{ loginParams.phoneArea }}<el-icon>
                                                     <DCaret />
                                                 </el-icon></span>
@@ -118,11 +118,12 @@
 </template>
 
 <script lang='ts' setup>
-import { onMounted, reactive, ref, toRefs, watch } from 'vue'
-import { useRouter } from 'vue-router'
-import { ElMessage, ElMessageBox } from 'element-plus'
-import { useLoginStore } from '@/stores/user-info-store'
-import { getHospitalsData, getPhoneAreasData } from '@/static-data/core'
+import {onMounted, reactive, ref, toRefs, watch} from 'vue'
+import {useRouter} from 'vue-router'
+import {ElMessage, ElMessageBox} from 'element-plus'
+import {useLoginStore} from '@/stores/user-info-store'
+import {getHospitalsData, getPhoneAreasData} from '@/static-data/core'
+import {v4} from "uuid";
 
 const router = useRouter()
 
@@ -199,6 +200,8 @@ const sliderVConf = ref({
     height: 200
 })
 
+const captchaImgUrl = ref('')
+
 const selectHospital = (e: string) => {
     // console.log(e)
 }
@@ -260,6 +263,13 @@ const login = async (type: string) => {
         }
     })
 }
+
+function getCaptchaCode() {
+  isShowRegister.value = true
+  const randomStr = v4()
+  captchaImgUrl.value = 'http://localhost:9999/admin/code/textImage?randomStr=' + randomStr
+}
+
 const toHome = () => {
     const getPermissions = () => {
         let permissions = '普通用户'