Browse Source

[Feature][UI Next][V1.0.0-Beta] Add hints to the password repeat. (#9888)

3.0.0/version-upgrade
Amy0104 3 years ago committed by GitHub
parent
commit
72e6a6d06f
No known key found for this signature in database
GPG Key ID: 4AEE18F83AFDEB23
  1. 17
      dolphinscheduler-ui-next/src/views/password/index.tsx
  2. 40
      dolphinscheduler-ui-next/src/views/password/use-form.ts

17
dolphinscheduler-ui-next/src/views/password/index.tsx

@ -24,10 +24,10 @@ import Card from '@/components/card'
const password = defineComponent({
name: 'password',
setup() {
const { state, t } = useForm()
const { state, rules, t } = useForm()
const { handleUpdate } = useUpdate(state)
return { ...toRefs(state), t, handleUpdate }
return { ...toRefs(state), t, handleUpdate, rules }
},
render() {
const { t } = this
@ -37,17 +37,28 @@ const password = defineComponent({
{{
default: () => (
<div>
<NForm rules={this.rules} ref='passwordFormRef'>
<NForm
rules={this.rules}
ref='passwordFormRef'
model={this.passwordForm}
>
<NFormItem label={t('password.password')} path='password'>
<NInput
type='password'
placeholder={t('password.password_tips')}
v-model={[this.passwordForm.password, 'value']}
onInput={() => {
this.rPasswordFormItemRef.validate({
trigger: 'password-input'
})
}}
/>
</NFormItem>
<NFormItem
ref='rPasswordFormItemRef'
label={t('password.confirm_password')}
path='confirmPassword'
first
>
<NInput
type='password'

40
dolphinscheduler-ui-next/src/views/password/use-form.ts

@ -24,30 +24,38 @@ export function useForm() {
const state = reactive({
passwordFormRef: ref(),
rPasswordFormItemRef: ref(),
passwordForm: {
password: '',
confirmPassword: ''
},
saving: false,
rules: {
password: {
saving: false
})
const rules = {
password: {
trigger: ['input', 'blur'],
required: true,
message: t('password.password_tips')
},
confirmPassword: [
{
trigger: ['input', 'blur'],
validator() {
if (state.passwordForm.password === '') {
return new Error(t('password.password_tips'))
}
}
required: true,
message: t('password.confirm_password_tips')
},
confirmPassword: {
trigger: ['input', 'blur'],
validator() {
if (state.passwordForm.confirmPassword === '') {
return new Error(t('password.confirm_password_tips'))
{
trigger: ['password-input', 'blur', 'input'],
message: t('password.two_password_entries_are_inconsistent'),
validator: (unuse: any, value: string) => {
if (value) {
return state.passwordForm.password === value
}
return true
}
}
} as FormRules
})
]
} as FormRules
return { state, t }
return { state, rules, t }
}

Loading…
Cancel
Save