useTaskFormFields.ts 3.5 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130
  1. import type { Ref } from 'vue'
  2. import type {
  3. DynamicFormFieldValue,
  4. DynamicFormState,
  5. TaskFieldConfigViewItem,
  6. TaskFieldOption,
  7. } from './useTaskForm'
  8. interface UseTaskFormFieldsOptions {
  9. form: Ref<DynamicFormState>
  10. taskFieldConfigList: Ref<TaskFieldConfigViewItem[]>
  11. }
  12. export type TaskFieldValuePatch = Partial<DynamicFormFieldValue>
  13. const normalizeFieldText = (value: unknown): string => {
  14. return value === undefined || value === null ? '' : String(value)
  15. }
  16. /**
  17. * 集中管理动态表单字段的查找和更新,避免联动逻辑只修改展示文本,
  18. * 却遗留旧提交值。
  19. */
  20. export const useTaskFormFields = ({ form, taskFieldConfigList }: UseTaskFormFieldsOptions) => {
  21. const findFieldByAlias = (alias: string): TaskFieldConfigViewItem | undefined => {
  22. return taskFieldConfigList.value.find((field) => field.alias === alias)
  23. }
  24. const getFieldFormValue = (field: TaskFieldConfigViewItem): DynamicFormFieldValue | undefined => {
  25. return form.value.value[field.id]
  26. }
  27. const getFieldFormValueByAlias = (alias: string): DynamicFormFieldValue | undefined => {
  28. const field = findFieldByAlias(alias)
  29. return field ? getFieldFormValue(field) : undefined
  30. }
  31. const getFieldValueByAlias = (alias: string): string | undefined => {
  32. return getFieldFormValueByAlias(alias)?.value
  33. }
  34. const setFieldFormValue = (
  35. field: TaskFieldConfigViewItem,
  36. fieldValue: TaskFieldValuePatch
  37. ): void => {
  38. const currentValue = getFieldFormValue(field)
  39. if (!currentValue) return
  40. if (fieldValue.label !== undefined) {
  41. currentValue.label = fieldValue.label
  42. }
  43. if (fieldValue.value !== undefined) {
  44. currentValue.value = fieldValue.value
  45. }
  46. }
  47. const setFieldFormValueByAlias = (alias: string, fieldValue: TaskFieldValuePatch): void => {
  48. const field = findFieldByAlias(alias)
  49. if (field) {
  50. setFieldFormValue(field, fieldValue)
  51. }
  52. }
  53. /**
  54. * 同步写入展示文本和提交值;若文本命中字典选项,则提交对应的 option value。
  55. */
  56. const setFieldTextByAlias = (alias: string, value: unknown): void => {
  57. const field = findFieldByAlias(alias)
  58. if (!field) return
  59. const normalizedValue = normalizeFieldText(value)
  60. const matchedOption = field.options?.find((option) => option.label === normalizedValue)
  61. setFieldFormValue(field, {
  62. label: matchedOption?.label ?? normalizedValue,
  63. value: matchedOption?.value ?? normalizedValue,
  64. })
  65. }
  66. const clearFieldValue = (field: TaskFieldConfigViewItem): void => {
  67. setFieldFormValue(field, { label: '', value: '' })
  68. }
  69. const clearFieldValueByAlias = (alias: string): void => {
  70. const field = findFieldByAlias(alias)
  71. if (field) {
  72. clearFieldValue(field)
  73. }
  74. }
  75. const clearFieldValuesByAlias = (aliases: Iterable<string>): void => {
  76. for (const alias of aliases) {
  77. clearFieldValueByAlias(alias)
  78. }
  79. }
  80. const setFieldOptions = (field: TaskFieldConfigViewItem, options: TaskFieldOption[]): void => {
  81. field.options = options.length ? options : null
  82. }
  83. const setFieldOptionsByAlias = (alias: string, options: TaskFieldOption[]): void => {
  84. const field = findFieldByAlias(alias)
  85. if (field) {
  86. setFieldOptions(field, options)
  87. }
  88. }
  89. return {
  90. findFieldByAlias,
  91. getFieldFormValue,
  92. getFieldFormValueByAlias,
  93. getFieldValueByAlias,
  94. setFieldFormValue,
  95. setFieldFormValueByAlias,
  96. setFieldTextByAlias,
  97. clearFieldValue,
  98. clearFieldValueByAlias,
  99. clearFieldValuesByAlias,
  100. setFieldOptions,
  101. setFieldOptionsByAlias,
  102. }
  103. }