xiangyuan-app/src/pages/home/light/form/claim.ts

import type { IDynamicFormOptions, IDynamicFormRef } from '@/components/dynamic';
import type { CheckBoxListProps } from '@/components/dynamic/wrappers/CheckBoxList.vue';
import type { RadioValueProps } from '@/components/dynamic/wrappers/RadioValue';
import type { FieldProps } from '@/components/form/Field.vue';
import type { FormProps } from '@/components/form/Form.vue';
import type { RuleItem } from 'async-validator';
import type { Ref } from 'vue';
import type { VolunteerInfo } from '@/api/inhert/VillageApi';
import { VillageClaimInfo } from '@/api/inhert/VillageApi';

function hasClaimType(formRef: Ref<IDynamicFormRef | undefined>, value: string) {
  const type = formRef.value?.getValueByPath('type');
  if (Array.isArray(type))
    return type.includes(value);
  return type === value;
}

export function fillClaimFromVolunteer(model: VillageClaimInfo, volunteer: VolunteerInfo) {
  model.name = volunteer.name || '';
  model.mobile = volunteer.mobile || '';
  model.address = volunteer.address || '';
  model.sex = volunteer.sex || 3;
  model.job = (volunteer as VolunteerInfo & { job?: string }).job || '';
  model.unit = (volunteer as VolunteerInfo & { unit?: string }).unit || '';
  model.claimReason = (volunteer as VolunteerInfo & { claimReason?: string }).claimReason || '';
  model.type = volunteer.type;
}

export function getClaimVillageForm(options: {
  formRef: Ref<IDynamicFormRef | undefined>,
}): IDynamicFormOptions {
  return {
    formItems: [
      {
        name: 'groupClaim',
        type: 'flat-simple',
        childrenColProps: { span: 24 },
        children: [
          {
            label: '真实姓名',
            name: 'name',
            type: 'text',
            additionalProps: { placeholder: '请输入真实姓名' },
            rules: [{ required: true, message: '请输入真实姓名' }],
          },
          {
            label: '认领类型',
            name: 'type',
            type: 'radio-value',
            defaultValue: 'villager',
            additionalProps: {
              options: [
                { text: '村民', value: 'villager' },
                { text: '志愿者', value: 'volunteer' },
                { text: '管理人员', value: 'staff' },
              ],
            } as RadioValueProps,
            rules: [{ required: true, message: '请选择认领类型' }],
          },
          {
            label: '性别',
            name: 'sex',
            type: 'radio-value',
            defaultValue: 3,
            additionalProps: {
              options: [
                { text: '男', value: 1 },
                { text: '女', value: 2 },
                { text: '未知', value: 3 },
              ],
            } as RadioValueProps,
          },
          {
            label: '联系方式',
            name: 'mobile',
            type: 'text',
            additionalProps: { placeholder: '请输入手机号' },
            rules: [{ required: true, message: '请输入联系方式' }],
          },
          {
            label: '居住地址',
            name: 'address',
            type: 'text',
            additionalProps: { placeholder: '请输入居住地址' },
          },
          {
            label: '工作单位',
            name: 'unit',
            type: 'text',
            additionalProps: { placeholder: '请输入工作单位' },
            show: { callback: () => hasClaimType(options.formRef, 'staff') },
            rules: [{
              required: true,
              message: '请输入工作单位',
            }] as RuleItem[],
          },
          {
            label: '职位',
            name: 'job',
            type: 'text',
            additionalProps: { placeholder: '请输入职位' },
            show: { callback: () => hasClaimType(options.formRef, 'staff') },
            rules: [{
              required: true,
              message: '请输入职位',
            }] as RuleItem[],
          },
          {
            label: '申请理由',
            name: 'claimReason',
            type: 'textarea',
            additionalProps: {
              placeholder: '请说明认领该村社的原因',
              showWordLimit: true,
              maxLength: 200,
            } as FieldProps,
          },
        ],
      },
    ],
    formAdditionaProps: {
      labelPosition: 'top',
    } as Omit<FormProps, 'model'>,
  };
}