暂存

src/views/login/components/Forget.vue

@@ -35,13 +35,29 @@ const formInline: FormState = reactive({
   password: '123456',
   captcha: '',
 })
-const tab = ref(0)
+const tab = ref(1)
 const countTime = ref('获取验证码')
 const rules = {
   enterprisecode: { required: true, message: '请输入企业编码', trigger: 'blur' },
   username: { required: true, message: '请输入用户名', trigger: 'blur' },
   password: { required: true, message: '请输入密码', trigger: 'blur' },
   captcha: { required: true, message: '请输入验证码', trigger: 'blur' },
+  reenteredPassword: [
+    {
+      required: true,
+      message: '请再次输入密码',
+      trigger: ['input', 'blur'],
+    },
+    {
+      validator: validatePasswordSame,
+      message: '两次密码输入不一致',
+      trigger: ['blur', 'password-input'],
+    },
+  ],
+}
+
+function validatePasswordSame(rule: any, value: string): boolean {
+  return value === formInline.password
 }
 
 function handleSubmit(e) {
@@ -185,7 +201,14 @@ function forget() {
     <div v-if="tab === 1" class="form-1">
       <n-form ref="formRef" label-placement="left" size="large" :model="formInline" :rules="rules">
         <n-form-item class="form-item" path="password">
-          <n-input v-model:value="formInline.password" class="item-input" type="password" show-password-on="click" placeholder="请输入密码">
+          <n-input v-model:value="formInline.password" class="item-input" type="password" show-password-on="click" placeholder="请输入8-16位密码，必须包含英文及数字">
+            <template #prefix>
+              <svg-icon size="20" name="password" />
+            </template>
+          </n-input>
+        </n-form-item>
+        <n-form-item class="form-item" path="password">
+          <n-input v-model:value="formInline.password" class="item-input" type="password" show-password-on="click" placeholder="请再次确认输入新密码">
             <template #prefix>
               <svg-icon size="20" name="password" />
             </template>

src/views/login/index.vue

@@ -29,7 +29,7 @@ const router = useRouter()
 const route = useRoute()
 const show = ref(true)
 const showForget = ref(true)
-const ifLogin = ref(true)
+const ifLogin = ref(false)
 
 const formInline: FormState = reactive({
   enterprisecode: '三方系统标识8',
@@ -108,6 +108,11 @@ function forget() {
   show.value = false
   showForget.value = true
 }
+
+function close() {
+  show.value = false
+  ifLogin.value = true
+}
 </script>
 
 <template>
@@ -197,8 +202,8 @@ function forget() {
       <img class="item-footer" src="../../assets/images/login/footer.png" alt="">
     </div>
     <n-modal v-model:show="show" :mask-closable="false">
-      <Login v-if="ifLogin" @close="show = false" @forget="ifLogin = !ifLogin" />
-      <Forget v-else @close="show = false" @forget="ifLogin = !ifLogin" />
+      <Login v-if="ifLogin" @close="close" @forget="ifLogin = !ifLogin" />
+      <Forget v-else @close="close" @forget="ifLogin = !ifLogin" />
     </n-modal>
   </div>
 </template>