xiangyuan-app/src/pages/dig/forms/data/overview.ts

import VillageInfoApi, { CommonInfoModel, VillageEnvInfo } from "@/api/inhert/VillageInfoApi";
import { useAliOssUploadCo } from "@/common/components/upload/AliOssUploadCo";
import type { IDynamicFormItem } from "@/components/dynamic";
import type { CheckBoxListProps } from "@/components/dynamic/wrappers/CheckBoxList.vue";
import type { PickerIdFieldProps } from "@/components/dynamic/wrappers/PickerIdField";
import type { RadioIdFieldProps } from "@/components/dynamic/wrappers/RadioIdField";
import type { FieldProps } from "@/components/form/Field.vue";
import type { UploaderFieldProps } from "@/components/form/UploaderField.vue";
import type { RowProps } from "@/components/layout/grid/Row.vue";
import type { GroupForm } from "../forms";

export const villageInfoOverviewForm : GroupForm = {
  [1]: [CommonInfoModel, (form) => ({
    formItems: [
      { 
        label: '名称', 
        name: 'name', 
        type: 'text', 
        defaultValue: '',
        additionalProps: {
          placeholder: '请输入名称，例如：后埔',
        },
        rules:  [{
          required: true,
          message: '请输入名称',
        }] 
      }, 
      /* { 
        label: '编码', 
        name: 'code', 
        type: 'text', 
        defaultValue: '',
        additionalProps: {
          placeholder: '请输入编码，例如330106',
        },
        rules:  [{
          required: true,
          message: '请输入编码',
        }] 
      },  */
      { 
        label: '地址', 
        name: 'cityAddress', 
        type: 'select-city', 
        defaultValue: () => [],
        additionalProps: {
          placeholder: '请点击这里选择地址或右侧者从地图选择',
          onSelectedTownship: (v: string, code: string) => {
            form.value.setValueByPath('township', v);
            form.value.setValueByPath('code', code);
          }
        },
      },
      { 
        label: '所在乡镇(街道)', 
        name: 'township', 
        type: 'text', 
        defaultValue: '',
        additionalProps: {
          placeholder: '请输入所在乡镇(街道)',
        },
      }, 
      { 
        label: '类型', 
        name: 'villageType',
        type: 'radio-id', 
        additionalProps: {
          loadData: async () => 
          (await VillageInfoApi.getCategoryChildList(94))
            .map((p) => ({
              value: p.id,
              text: p.title,
          })),
        } as RadioIdFieldProps,
      },
    ]
  }), { title: '行政区划', typeName: '', order: 1 }],
  [5]: [CommonInfoModel, () => ({
    formItems: [
      {
        name: '',
        type: 'flat-group',
        childrenColProps: { span: 24 },
        children: [
          {
            label: '概括',
            name: 'overview',
            type: 'richtext',
            defaultValue: '',
            additionalProps: {
              placeholder: '请输入整体概括信息',
              maxLength: 300,
              showWordLimit: true, 
            } as FieldProps,
          },
          {
            label: '突出价值',
            name: 'prominent',
            type: 'richtext',
            defaultValue: '',
            additionalProps: {
              placeholder: '请输入突出价值信息',
              maxLength: 300,
              showWordLimit: true, 
            } as FieldProps,
          }
        ]
      },
      {
        name: '',
        type: 'flat-group',
        childrenColProps: { span: 24 },
        children: [
          {
            label: '相关视频（可选）',
            name: 'video',
            type: 'uploader',
            defaultValue: '',
            additionalProps: {
              upload: useAliOssUploadCo('xiangyuan/cultural/video'),
              chooseType: 'video',
              maxFileSize: 1024 * 1024 * 20,
              single: true,
            } as UploaderFieldProps,
          },
        ]
      },
    ] 
  }), { title: '综述', typeName: '', order: 2 }],
  [2]: [VillageEnvInfo, () => ({
    formItems: [
      { 
        label: '经纬度', 
        name: 'lonlat', 
        type: 'select-lonlat', 
        defaultValue: '',
        additionalProps: {},
        formProps: { showRightArrow: true } as FieldProps,
      }, 
      { 
        label: '海拔', 
        name: 'altitude', 
        type: 'number', 
        defaultValue: 0,
        additionalProps: {
          placeholder: '请输入海拔',
          min: -1000,
          max: 10000,
          step: 10,
          addonAfter: 'M',
        },
      }, 
      { 
        label: '地形地貌特征（多选）', 
        name: 'landforms',
        type: 'check-box-list', 
        additionalProps: {
          multiple: true,
          loadData: async () => 
          (await VillageInfoApi.getCategoryChildList(97))
            .map((p) => ({
              value: p.id,
              text: p.title,
            }))
          ,
        } as CheckBoxListProps,
        defaultValue: [],
      },
      { 
        label: '地域面积', 
        name: 'area', 
        type: 'number', 
        defaultValue: 0,
        additionalProps: {
          placeholder: '请输入地域面积',
          min: 0,
          max: 10000,
          step: 1,
          addonAfter: '平方公里',
        },
      }, 
      { 
        label: '建筑占地面积', 
        name: 'villageArea', 
        type: 'number', 
        defaultValue: 0,
        additionalProps: {
          placeholder: '请输入占地面积',
          min: 0,
          max: 10000,
          step: 1,
          addonAfter: '亩',
        },
      }, 
      { 
        label: '形成年代', 
        name: 'age',
        type: 'select-id', 
        additionalProps: {
          loadData: async () => 
          (await VillageInfoApi.getCategoryChildList(103))
            .map((p) => ({
              value: p.id,
              text: p.title,
            }))
          ,
        } as PickerIdFieldProps,
        formProps: { showRightArrow: true } as FieldProps,
      },
    ]
  }), { title: '地理信息', typeName: '', order: 3 }],
  [3]: [CommonInfoModel, () => ({
    formItems: [
      { 
        label: '非遗最高级别', 
        name: 'ichLevel', 
        type: 'select-id', 
        defaultValue: null,
        additionalProps: {
          loadData: async () => 
          (await VillageInfoApi.getCategoryChildList(111))
            .map((p) => ({
              value: p.id,
              text: p.title,
            }))
          ,
        } as PickerIdFieldProps,
        formProps: { showRightArrow: true } as FieldProps,
      }, 
      { 
        label: '传统建筑数量', 
        name: 'traditionalBuildings', 
        type: 'number', 
        defaultValue: 0,
        additionalProps: {
          min: 0,
          max: 10000,
          step: 1,
        },
      }, 
      { 
        label: '列入历史文化名村(社)级别', 
        name: 'historyLevel',
        type: 'select-id', 
        additionalProps: {
          loadData: async () => 
          (await VillageInfoApi.getCategoryChildList(151))
            .map((p) => ({
              value: p.id,
              text: p.title,
            }))
          ,
        } as PickerIdFieldProps,
        formProps: { showRightArrow: true } as FieldProps,
      },
      { 
        label: '列入特色景观旅游名村(社)级别', 
        name: 'touristLevel',
        type: 'select-id', 
        additionalProps: {
          loadData: async () => 
          (await VillageInfoApi.getCategoryChildList(151))
            .map((p) => ({
              value: p.id,
              text: p.title,
            }))
          ,
        } as PickerIdFieldProps,
        formProps: { showRightArrow: true } as FieldProps,
      },
      { 
        label: '列入少数民族特色村寨(社)试点示范', 
        name: 'isFeaturedVillage', 
        type: 'check-box-int', 
        defaultValue: '',
        additionalProps: {},
      }, 
      { 
        label: '其他认定级别', 
        name: 'other', 
        type: 'text', 
        defaultValue: '',
        additionalProps: {
          placeholder: '（可选）输入其他认定级别',
        },
        rules:  [] 
      }, 
    ]
  }), { title: '建设与保护', typeName: '', order: 4 }],
  [4]: [CommonInfoModel, () => ({ 
    formItems: [
      {
        name: 'a',
        label: '人口与收入',
        type: 'flat-group',
        childrenColProps: { span: 24 },
        children: [
          { 
            label: '主要民族', 
            name: 'nationlity', 
            type: 'text', 
            defaultValue: '',
            additionalProps: {
              placeholder: '请输入主要民族',
            },
          }, 
          ...[
            {
              label: '户籍人口',
              name: 'registeredPopulation',
            },
            {
              label: '常住人口',
              name: 'permanentPopulation',
            },
            {
              label: '人均年收入',
              name: 'personalAnnualIncome',
            },
            {
              label: '集体年收入',
              name: 'villageAnnualIncome',
            },
          ].map((it) => ({
            name: '',
            label: it.label,
            type: 'flat-group',
            rowProps: { 
              align: 'center',
            }  as RowProps,
            children: [
              { 
                label: '', 
                name: it.name + 'Year', 
                type: 'number', 
                defaultValue: () => new Date().getFullYear(),
                additionalProps: {
                  min: 1900,
                  max: 2100,
                  step: 10,
                },
                formProps: {
                  labelWidth: '0rpx',
                  labelPosition: 'left',
                  showBottomBorder: false,
                },
                rules:  [{
                  required: true,
                  message: '请输入',
                }] 
              },
              { 
                label: '', 
                name: 'aa', 
                type: 'static-text', 
                additionalProps: { text: '年' },
                formProps: {
                  labelWidth: '0rpx',
                  showBottomBorder: false,
                },
              },
              { 
                label: '', 
                name: it.name, 
                type: 'number', 
                defaultValue: 0,
                additionalProps: {
                  min: 0,
                  step: 10,
                },
                formProps: {
                  labelWidth: '0rpx',
                  labelPosition: 'left',
                  showBottomBorder: false,
                },
                rules:  [{
                  required: true,
                  message: '请输入人口',
                }] 
              },
            ]
          } as IDynamicFormItem)),
        ]
      },
      {
        name: '',
        label: '主要产业',
        type: 'flat-group',
        childrenColProps: { span: 24 },
        children: [
          ...[
            {
              label: '农业',
              name: 'agriculture',
              pid: 128,
            },
            {
              label: '林业',
              name: 'forestry',
              pid: 194,
            },
            {
              label: '畜牧业',
              name: 'animal',
              pid: 200,
            },
            {
              label: '渔业',
              name: 'fishing',
              pid: 205,
            },
            {
              label: '制造业（含手工）',
              name: 'manufacturing',
              pid: 208,
            },
            {
              label: '建筑业',
              name: 'construction',
              pid: 227,
            },
            {
              label: '批发和零售业',
              name: 'retail',
              pid: 230,
            },
            {
              label: '服务业',
              name: 'service',
              pid: 233,
            },
            {
              label: '其他',
              name: 'otherIndustries',
              pid: 238,
            },
          ].map((it) => ({
            label: it.label, 
            name: it.name,
            type: 'select-id', 
            additionalProps: {
              loadData: async () => 
              (await VillageInfoApi.getCategoryChildList(it.pid))
                .map((p) => ({
                  value: p.id,
                  text: p.title,
                }))
              ,
            } as PickerIdFieldProps,
            formProps: { showRightArrow: true } as FieldProps,
            rules: [],
          })),
          { 
            label: '其他服务业', 
            name: 'otherService', 
            type: 'text', 
            defaultValue: '',
            additionalProps: {
              placeholder: '（可选）输入其他服务业',
            },
            rules:  [],
            show: { callback: (_, m) => m.otherIndustries === 238 }
          }, 
          { 
            label: '其他农业', 
            name: 'otherAgriculture', 
            type: 'text', 
            defaultValue: '',
            additionalProps: {
              placeholder: '（可选）输入其他农业',
            },
            rules:  [] ,
            show: { callback: (_, m) => m.otherIndustries === 128 }
          }, 
        ]
      },
    ] 
  }), { title: '人口与经济', typeName: '', order: 5 }],
}