use-form.ts 2.3 KB

12345678910111213141516171819202122232425262728293031323334353637383940414243444546474849505152535455565758596061626364656667686970717273
  1. /*
  2. * Licensed to the Apache Software Foundation (ASF) under one or more
  3. * contributor license agreements. See the NOTICE file distributed with
  4. * this work for additional information regarding copyright ownership.
  5. * The ASF licenses this file to You under the Apache License, Version 2.0
  6. * (the "License"); you may not use this file except in compliance with
  7. * the License. You may obtain a copy of the License at
  8. *
  9. * http://www.apache.org/licenses/LICENSE-2.0
  10. *
  11. * Unless required by applicable law or agreed to in writing, software
  12. * distributed under the License is distributed on an "AS IS" BASIS,
  13. * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
  14. * See the License for the specific language governing permissions and
  15. * limitations under the License.
  16. */
  17. import { reactive, ref } from 'vue'
  18. import { useI18n } from 'vue-i18n'
  19. import type { FormRules } from 'naive-ui'
  20. export function useForm() {
  21. const { t } = useI18n()
  22. const state = reactive({
  23. passwordFormRef: ref(),
  24. confirmPasswordItemFormRef: ref(),
  25. passwordForm: {
  26. password: '',
  27. confirmPassword: '',
  28. },
  29. rules: {
  30. password: {
  31. required: true,
  32. message: t('password.password_tips'),
  33. },
  34. confirmPassword: [
  35. {
  36. required: true,
  37. message: t('password.confirm_password_tips'),
  38. },
  39. {
  40. trigger: ['input'],
  41. message: t('password.two_password_entries_are_inconsistent'),
  42. validator: (rule: any, value: string): any => {
  43. return (
  44. state.passwordForm.password &&
  45. state.passwordForm.password.startsWith(value) &&
  46. state.passwordForm.password.length >= value.length
  47. )
  48. },
  49. },
  50. {
  51. trigger: ['blur', 'password-input'],
  52. message: t('password.two_password_entries_are_inconsistent'),
  53. validator: (rule: any, value: string): any => {
  54. return state.passwordForm.password === value
  55. },
  56. },
  57. ],
  58. } as FormRules,
  59. handlePasswordInput: () => {
  60. if (state.passwordForm.confirmPassword) {
  61. state.confirmPasswordItemFormRef.value.validate({
  62. trigger: 'password-input',
  63. })
  64. }
  65. },
  66. })
  67. return { state, t }
  68. }