|
@@ -4,6 +4,16 @@
|
|
<div class="p-l-large change-pwd-modal-header">请修改密码</div>
|
|
<div class="p-l-large change-pwd-modal-header">请修改密码</div>
|
|
<div class="change-pwd-modal-content">
|
|
<div class="change-pwd-modal-content">
|
|
<base-form ref="formRef" :model="userModel" :rules="rules" :items="items" :label-width="'90px'" size="large">
|
|
<base-form ref="formRef" :model="userModel" :rules="rules" :items="items" :label-width="'90px'" size="large">
|
|
|
|
+ <template #form-item-repassword>
|
|
|
|
+ <el-input
|
|
|
|
+ ref="rePwdRef"
|
|
|
|
+ v-model="userModel.rePassword"
|
|
|
|
+ type="password"
|
|
|
|
+ clearable
|
|
|
|
+ show-password
|
|
|
|
+ @keydown="rePwdKeyDown"
|
|
|
|
+ ></el-input>
|
|
|
|
+ </template>
|
|
<template #form-item-confirm>
|
|
<template #form-item-confirm>
|
|
<confirm-button class="m-t-large" size="large" @confirm="onSubmit" @cancel="onCancel"></confirm-button>
|
|
<confirm-button class="m-t-large" size="large" @confirm="onSubmit" @cancel="onCancel"></confirm-button>
|
|
</template>
|
|
</template>
|
|
@@ -14,8 +24,8 @@
|
|
</template>
|
|
</template>
|
|
|
|
|
|
<script setup lang="ts" name="ChangePassword">
|
|
<script setup lang="ts" name="ChangePassword">
|
|
-import { reactive, watch } from 'vue'
|
|
|
|
-import { ElMessage } from 'element-plus'
|
|
|
|
|
|
+import { reactive, watch, ref } from 'vue'
|
|
|
|
+import { ElMessage, ElInput } from 'element-plus'
|
|
import useFetch from '@/hooks/useFetch'
|
|
import useFetch from '@/hooks/useFetch'
|
|
import useVModel from '@/hooks/useVModel'
|
|
import useVModel from '@/hooks/useVModel'
|
|
import useVW from '@/hooks/useVW'
|
|
import useVW from '@/hooks/useVW'
|
|
@@ -30,7 +40,8 @@ const { push, replace } = useRouter()
|
|
const route = useRoute()
|
|
const route = useRoute()
|
|
const { formRef, elFormRef } = useForm()
|
|
const { formRef, elFormRef } = useForm()
|
|
const mainStore = useMainStore()
|
|
const mainStore = useMainStore()
|
|
-const userModel = reactive<{ password: string; rePassword?: string }>({
|
|
|
|
|
|
+const rePwdRef = ref(null)
|
|
|
|
+const userModel = reactive<{ password: string; rePassword: string }>({
|
|
password: '',
|
|
password: '',
|
|
rePassword: '',
|
|
rePassword: '',
|
|
})
|
|
})
|
|
@@ -56,10 +67,31 @@ const rules: EpFormRules = {
|
|
},
|
|
},
|
|
],
|
|
],
|
|
}
|
|
}
|
|
-
|
|
|
|
|
|
+const rePwdKeyDown = (e: any) => {
|
|
|
|
+ if (e.key === 'Enter') {
|
|
|
|
+ onSubmit()
|
|
|
|
+ }
|
|
|
|
+}
|
|
const items: EpFormItem[] = [
|
|
const items: EpFormItem[] = [
|
|
- { label: '新密码', prop: 'password', slotType: 'input', slot: { type: 'password' } },
|
|
|
|
- { label: '确认密码', prop: 'rePassword', slotType: 'input', slot: { type: 'password' } },
|
|
|
|
|
|
+ {
|
|
|
|
+ label: '新密码',
|
|
|
|
+ prop: 'password',
|
|
|
|
+ slotType: 'input',
|
|
|
|
+ slot: {
|
|
|
|
+ type: 'password',
|
|
|
|
+ onKeydown(event: any) {
|
|
|
|
+ if (event.keyCode == 13) {
|
|
|
|
+ if (userModel.rePassword.length > 0) {
|
|
|
|
+ onSubmit()
|
|
|
|
+ } else {
|
|
|
|
+ ;(rePwdRef.value as any).ref.focus()
|
|
|
|
+ }
|
|
|
|
+ }
|
|
|
|
+ },
|
|
|
|
+ },
|
|
|
|
+ },
|
|
|
|
+ // { label: '确认密码', prop: 'rePassword', slotType: 'input', slot: { type: 'password' } },
|
|
|
|
+ { label: '确认密码', prop: 'rePassword', slotName: 'repassword' },
|
|
{ slotName: 'confirm' },
|
|
{ slotName: 'confirm' },
|
|
]
|
|
]
|
|
const onCancel = () => {
|
|
const onCancel = () => {
|