综合模块完成

apps/web-antd/src/views/property/room/data.ts

@@ -1,5 +1,8 @@
 import type { FormSchemaGetter } from '#/adapter/form';
 import type { VxeGridProps } from '#/adapter/vxe-table';
+import { getPopupContainer } from '@vben/utils';
+import { getDictOptions } from '#/utils/dict';
+import { DictEnum } from '@vben/constants';
 
 export const querySchema: FormSchemaGetter = () => [
   {
@@ -11,15 +14,17 @@ export const querySchema: FormSchemaGetter = () => [
     component: 'Input',
     fieldName: 'orientation',
     label: '朝向',
-  },
-  {
-    component: 'Input',
-    fieldName: 'isForSale',
-    label: '是否可售',
+    componentProps: {
+      getPopupContainer,
+      options: getDictOptions(DictEnum.wy_direction_towards),
+    },
   },
   {
     component: 'Select',
-    componentProps: {},
+    componentProps: {
+      getPopupContainer,
+      options: getDictOptions(DictEnum.wy_fjzt),
+    },
     fieldName: 'status',
     label: '状态',
   },
@@ -29,20 +34,16 @@ export const querySchema: FormSchemaGetter = () => [
 // export const columns: () => VxeGridProps['columns'] = () => [
 export const columns: VxeGridProps['columns'] = [
   { type: 'checkbox', width: 60 },
-  {
-    title: '所属楼层ID',
-    field: 'floorId',
-  },
   {
     title: '房间号',
     field: 'roomNumber',
   },
   {
     title: '房间类型',
-    field: 'roomType',
+    field: 'roomTypeName',
   },
   {
-    title: '面积(平方米)',
+    title: '面积',
     field: 'area',
   },
   {
@@ -51,7 +52,7 @@ export const columns: VxeGridProps['columns'] = [
   },
   {
     title: '朝向',
-    field: 'orientation',
+    field: 'orientationName',
   },
   {
     title: '是否可售',
@@ -59,7 +60,7 @@ export const columns: VxeGridProps['columns'] = [
   },
   {
     title: '状态',
-    field: 'status',
+    field: 'statusName',
   },
   {
     field: 'action',
@@ -81,13 +82,14 @@ export const modalSchema: FormSchemaGetter = () => [
     },
   },
   {
-    label: '所属楼层ID',
+    component: 'TreeSelect',
     fieldName: 'floorId',
-    component: 'Input',
-    rules: 'required',
+    defaultValue: undefined,
+    label: '社区建筑',
+    rules: 'selectRequired',
   },
   {
-    label: '房间号(如101,202)',
+    label: '房间号',
     fieldName: 'roomNumber',
     component: 'Input',
     rules: 'required',
@@ -96,10 +98,13 @@ export const modalSchema: FormSchemaGetter = () => [
     label: '房间类型',
     fieldName: 'roomType',
     component: 'Select',
-    componentProps: {},
+    componentProps: {
+      getPopupContainer,
+      options: getDictOptions(DictEnum.wy_room_type),
+    },
   },
   {
-    label: '面积(平方米)',
+    label: '面积',
     fieldName: 'area',
     component: 'Input',
   },
@@ -111,7 +116,11 @@ export const modalSchema: FormSchemaGetter = () => [
   {
     label: '朝向',
     fieldName: 'orientation',
-    component: 'Input',
+    component: 'Select',
+    componentProps: {
+      getPopupContainer,
+      options: getDictOptions(DictEnum.wy_direction_towards),
+    },
   },
   {
     label: '是否可售',
@@ -122,6 +131,9 @@ export const modalSchema: FormSchemaGetter = () => [
     label: '状态',
     fieldName: 'status',
     component: 'Select',
-    componentProps: {},
+    componentProps: {
+      getPopupContainer,
+      options: getDictOptions(DictEnum.wy_fjzt),
+    },
   },
 ];

apps/web-antd/src/views/property/room/room-modal.vue

@@ -3,16 +3,13 @@ import { computed, ref } from 'vue';
 
 import { useVbenModal } from '@vben/common-ui';
 import { $t } from '@vben/locales';
-import { cloneDeep } from '@vben/utils';
-
 import { useVbenForm } from '#/adapter/form';
 import { roomAdd, roomInfo, roomUpdate } from '#/api/property/room';
 import { defaultFormValueGetter, useBeforeCloseDiff } from '#/utils/popup';
-
 import { modalSchema } from './data';
-
+import { communityTree } from '#/api/property/community';
+import { cloneDeep, getPopupContainer, handleNode } from '@vben/utils';
 const emit = defineEmits<{ reload: [] }>();
-
 const isUpdate = ref(false);
 const title = computed(() => {
   return isUpdate.value ? $t('pages.common.edit') : $t('pages.common.add');
@@ -21,7 +18,7 @@ const title = computed(() => {
 const [BasicForm, formApi] = useVbenForm({
   commonConfig: {
     // 默认占满两列
-    formItemClass: 'col-span-2',
+    formItemClass: 'col-span-1',
     // 默认label宽度 px
     labelWidth: 80,
     // 通用配置项 会影响到所有表单项
@@ -43,7 +40,7 @@ const { onBeforeClose, markInitialized, resetInitialized } = useBeforeCloseDiff(
 
 const [BasicModal, modalApi] = useVbenModal({
   // 在这里更改宽度
-  class: 'w-[550px]',
+  class: 'w-[60%]',
   fullscreenButton: false,
   onBeforeClose,
   onClosed: handleClosed,
@@ -56,7 +53,7 @@ const [BasicModal, modalApi] = useVbenModal({
 
     const { id } = modalApi.getData() as { id?: number | string };
     isUpdate.value = !!id;
-
+    setupCommunitySelect()
     if (isUpdate.value && id) {
       const record = await roomInfo(id);
       await formApi.setValues(record);
@@ -87,6 +84,45 @@ async function handleConfirm() {
   }
 }
 
+
+/**
+ * 初始化城市
+ */
+async function setupCommunitySelect() {
+  const areaList = await communityTree(4);
+  // 选中后显示在输入框的值 即父节点 / 子节点
+  // addFullName(areaList, 'areaName', ' / ');
+  const splitStr = '/';
+  handleNode(areaList, 'label', splitStr, function (node: any) {
+    if (node.level != 4) {
+      node.disabled = true;
+    }
+  });
+  formApi.updateSchema([
+    {
+      componentProps: () => ({
+        class: 'w-full',
+        fieldNames: {
+          key: 'id',
+          label: 'label',
+          value: 'code',
+          children: 'children',
+        },
+        getPopupContainer,
+        placeholder: '请选择建筑',
+        showSearch: true,
+        treeData: areaList,
+        treeDefaultExpandAll: true,
+        treeLine: { showLeafIcon: false },
+        // 筛选的字段
+        treeNodeFilterProp: 'label',
+        // 选中后显示在输入框的值
+        treeNodeLabelProp: 'fullName',
+      }),
+      fieldName: 'floorId',
+    },
+  ]);
+}
 async function handleClosed() {
   await formApi.resetForm();
   resetInitialized();