快速登录优化：改为可以和登录页个人登录一致，可以账号密码和手机短息登录

src/components/Enterprise/components/positions.vue

@@ -73,7 +73,7 @@
     <Empty v-else :elevation="false"></Empty>
 
     <!-- 快速登录 -->
-    <login-page v-if="showLogin" @loginSuccess="loginSuccess" @close="loginClose"></login-page>
+    <loginPage v-if="showLogin" @loginSuccess="loginSuccess" @close="loginClose"></loginPage>
   </div>
 </template>
 

src/components/Position/longStrip.vue

@@ -48,7 +48,7 @@
     </div>
 
     <!-- 快速登录 -->
-    <login-page v-if="showLogin" @loginSuccess="loginSuccess" @close="loginClose"></login-page>
+    <loginPage v-if="showLogin" @loginSuccess="loginSuccess" @close="loginClose"></loginPage>
   </div>
 </template>
 

src/views/common/loginDialog.vue

@@ -1,30 +1,66 @@
 <!-- 快速登录/注册 -->
 <template>
-  <CtDialog
-    :visible="openDialog"
-    :widthType="2"
-    :footer="false"
-    titleClass="text-h6"
-    title="快速登录"
-    @close="openDialog = false"
-  >
-    <div class="my-5">
-      <phoneFrom ref="phoneRef" @handleEnter="handleLogin"></phoneFrom>
-      <v-btn :loading="loginLoading" color="primary" class="white--text mt-5" min-width="350" @click="handleLogin">
-        {{ $t('login.loginOrRegister') }}
-      </v-btn>
-      <div class="text-center color-666 font-size-14 mt-3">未注册的手机号，验证后自动注册账号</div>
-    </div>
-  </CtDialog>
+  <div>
+    <CtDialog
+      :visible="openDialog"
+      :widthType="2"
+      :footer="false"
+      titleClass="text-h6"
+      title="快速登录"
+      @close="loginClose"
+    >
+      <div class="mb-5">
+        <!-- <phoneFrom ref="phoneRef" @handleEnter="handleLogin"></phoneFrom> -->
+        <!-- 个人登录 -->
+        <div class="login-tab">
+          <v-tabs v-model="tab" align-tabs="center" color="primary" class="mb-10">
+            <v-tab :value="2">账号</v-tab>
+            <v-tab :value="1">验证码</v-tab>
+          </v-tabs>
+          <v-window v-model="tab">
+              <!-- 验证码登录 -->
+            <v-window-item :value="1">
+              <phoneFrom ref="phoneRef" class="phoneClass" openVerify @handleEnter="handleLogin"></phoneFrom>
+            </v-window-item>
+              <!-- 账号密码登录 -->
+            <v-window-item :value="2">
+              <passwordFrom ref="passRef" @handleEnter="handleLogin"></passwordFrom>
+            </v-window-item>
+          </v-window>
+        </div>
+        <v-btn :loading="loginLoading" color="primary" class="white--text mt-5" min-width="350" @click="handleLogin">
+          {{ $t('login.loginOrRegister') }}
+        </v-btn>
+        <div class="login-tips mt-3 font-size-14">
+            <v-icon v-if="isAgree" size="18" color="primary" class="mr-2" @click="isAgree = !isAgree">mdi-check-circle</v-icon>
+            <v-icon v-else size="18" color="grey" class="mr-2" @click="isAgree = !isAgree">mdi-circle-outline</v-icon>
+            {{ $t('login.agreeLogin') }}
+            <span class="color" style="cursor: pointer;" @click="windowOpen('/userAgreement')"> [{{ $t('login.userAgreement') }}] </span>和
+            <span class="color" style="cursor: pointer;" @click="windowOpen('/privacyPolicy')">[{{ $t('login.privacyPolicy') }}]</span>
+        </div>
+        <div v-if="tab === 1" class="text-center color-666 font-size-12 mt-1">未注册的手机号，验证后自动注册账号</div>
+      </div>
+      <Verify
+        ref="verify"
+        captchaType="blockPuzzle"
+        :imgSize="{ width: '400px', height: '200px' }"
+        mode="pop"
+        @success="verifySuccess"
+      />
+    </CtDialog>
+  </div>
 </template>
 
 <script setup>
 defineOptions({name: 'dialog-login-common-page'})
 import phoneFrom from '@/components/VerificationCode'
+import passwordFrom from '@/views/login/components/passwordPage.vue'
 import { useUserStore } from '@/store/user'; const userStore = useUserStore()
 import { nextTick, ref } from 'vue'
+import Verify from '@/components/Verifition'
+import Snackbar from '@/plugins/snackbar'
 
-const emit = defineEmits(['loginSuccess'])
+const emit = defineEmits(['loginSuccess', 'close'])
 
 const props = defineProps({
   // 是否需要退出后再登录，切换账号时使用
@@ -39,26 +75,81 @@ nextTick(() => {
   openDialog.value = true
 })
 
+const tab = ref(2) // 密码登录
+const isAgree = ref(false)
+const passRef = ref()
 // 验证码登录
 const phoneRef = ref()
 const loginLoading = ref(false)
 
 const handleLogin = async () => {
-  const { valid } = await phoneRef.value.phoneForm.validate()
+  // const { valid } = await phoneRef.value.phoneForm.validate()
+  const { valid } = tab.value === 1 ? await phoneRef.value.phoneForm.validate() : await passRef.value.passwordForm.validate()
   if (!valid) return
+  if (!isAgree.value) return Snackbar.warning('请阅读并勾选底部协议')
+  // 
+  let params, api = ''
+  params = tab.value === 1 ? { ...phoneRef.value.loginData } : { ...passRef.value.loginData }
+  api = tab.value === 1 ? 'handleSmsLogin' : 'handlePasswordLogin'
+  if (!params.captchaVerification && captchaStr.value) params.captchaVerification = captchaStr.value
+  if (!params.captchaVerification) {
+    getCode() // 验证码组件
+    return
+  }
+  loginLoading.value = true
   if (props.hasLogout) {
     await userStore.userLogout(1)
   }
-  loginLoading.value = true
   try {
-    const params = { ...phoneRef.value.loginData, autoRegister: true } // autoRegister: 是否自动注册
-    await userStore.handleSmsLogin(params)
+    // const params = { ...phoneRef.value.loginData, autoRegister: true } // autoRegister: 是否自动注册
+    // await userStore.handleSmsLogin(params)
+    await userStore[api](params)
     emit('loginSuccess')
   } catch (error) {
+    captchaStr.value = '' // 清空人机验证
+    phoneRef.value && phoneRef.value.clearCaptcha() // 清空人机验证
     console.error('error', error)
   }
 }
+
+// 获取验证码
+const verify = ref()
+const getCode = async () => {
+  // 弹出验证码 // 已开启：则展示验证码；只有完成验证码的情况，才进行登录
+  verify.value.show()
+}
+
+const captchaStr = ref('')
+const verifySuccess = (params) => {
+  captchaStr.value = params.captchaVerification
+  handleLogin()
+}
+const loginClose = () => {
+  openDialog.value = false
+  emit('close')
+}
 </script>
 
 <style lang="scss" scoped>
+.login-tips {
+  width: 100%;
+  font-size: 12px;
+  display: flex;
+  justify-content: center;
+  align-items: center;
+}
+.tips {
+  span:hover {
+    text-decoration: underline;
+  }
+}
+// :deep(.v-window-item) {}
+:deep(.mask) {
+  width: 100vw;
+  transform: translate(calc(-50% + 200px), calc(-50% + 223px));
+}
+.mask {
+  width: 100vw;
+  transform: translate(calc(-50% + 200px), calc(-50% + 223px));
+}
 </style>

src/views/mall/index.vue

@@ -68,7 +68,8 @@ userStore.$subscribe((mutation, state) => {
 
 const showLogin = ref(false)
 const handleLogin = () => {
-  showLogin.value = true
+  showLogin.value = true // 打开快速登录弹窗
+  // Snackbar.warning('您还未登录，请先登录后再试')
 }
 
 // 快速登录

src/views/recruit/personal/position/components/details.vue

@@ -152,7 +152,7 @@
     </div>
 
     <!-- 快速登录 -->
-    <login-page v-if="showLogin" @loginSuccess="loginSuccess" @close="loginClose"></login-page>
+    <loginPage v-if="showLogin" @loginSuccess="loginSuccess" @close="loginClose"></loginPage>
   </div>                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                             
 </template>
 

src/views/recruit/personal/shareJob/index.vue

@@ -72,23 +72,23 @@
     </v-card>
 
     <!-- 快速登录/注册 -->
-    <login-page
+    <loginPage
       v-if="sendResume.showLogin"
       :jobId="jobId"
       :hasLogout="hasLogout"
       @loginSuccess="loginSuccess"
       @close="handleClose('showLogin')"
-    ></login-page>
+    ></loginPage>
 
     <!-- 快速填写简易人才信息 -->
-    <simple-page
+    <simplePage
       v-if="sendResume.showSimpleInfo"
       @simpleInfoReady="simpleInfoReadyFun"
       @close="handleClose('showSimpleInfo')"
-    ></simple-page>
+    ></simplePage>
 
     <!-- 选择简历 -->
-    <select-page
+    <selectPage
       v-if="sendResume.showSelect"
       :hire="info?.hire"
       :jobId="jobId"
@@ -96,7 +96,7 @@
       @refresh="handleCheckJobDelivery"
       @close="handleClose('showSelect')"
       ref="selectRef"
-    ></select-page>
+    ></selectPage>
   </div>
 </template>