diff --git a/apps/web-antd/src/api/property/building/model.d.ts b/apps/web-antd/src/api/property/building/model.d.ts index 79085031..b4dfa4a8 100644 --- a/apps/web-antd/src/api/property/building/model.d.ts +++ b/apps/web-antd/src/api/property/building/model.d.ts @@ -1,4 +1,4 @@ -import type { PageQuery, BaseEntity } from '#/api/common'; +import type { BaseEntity, PageQuery } from '#/api/common'; export interface BuildingVO { /** @@ -16,21 +16,6 @@ export interface BuildingVO { */ buildingName: string; - /** - * 省 - */ - province: string; - - /** - * 市 - */ - city: string; - - /** - * 区 - */ - district: string; - /** * 总层数 */ @@ -70,67 +55,6 @@ export interface BuildingVO { * 维度 */ lat: string; - - /** - * 产权性质(1:自持，2：承租，3：自持+承租,4：政府免费使用) - */ - cqxz: number; - - /** - * 不动产编号 - */ - bdcbh: string; - - /** - * 产权编号 - */ - cqbh: string; - - /** - * 图地编号 - */ - tdbh: string; - - /** - * 建筑面积 - */ - jzmj: number; - - /** - * 产权面积 - */ - cqmj: number; - - /** - * 可租面积 - */ - kzmj: number; - - /** - * 自用面积 - */ - zymj: number; - - /** - * 配套面积 - */ - ptmj: number; - - /** - * 车位面积 - */ - cwmj: number; - - /** - * 标准层高 - */ - bzcg: number; - - /** - * 排序字段 - */ - sort: number; - } export interface BuildingForm extends BaseEntity { @@ -149,21 +73,6 @@ export interface BuildingForm extends BaseEntity { */ buildingName?: string; - /** - * 省 - */ - province?: string; - - /** - * 市 - */ - city?: string; - - /** - * 区 - */ - district?: string; - /** * 总层数 */ @@ -203,68 +112,6 @@ export interface BuildingForm extends BaseEntity { * 维度 */ lat?: string; - - /** - * 产权性质(1:自持，2：承租，3：自持+承租,4：政府免费使用) - */ - cqxz?: number; - - /** - * 不动产编号 - */ - bdcbh?: string; - - /** - * 产权编号 - */ - cqbh?: string; - - /** - * 图地编号 - */ - tdbh?: string; - - /** - * 建筑面积 - */ - jzmj?: number; - - /** - * 产权面积 - */ - cqmj?: number; - - /** - * 可租面积 - */ - kzmj?: number; - - /** - * 自用面积 - */ - zymj?: number; - - /** - * 配套面积 - */ - ptmj?: number; - - /** - * 车位面积 - */ - cwmj?: number; - - /** - * 标准层高 - */ - bzcg?: number; - - /** - * 排序字段 - */ - sort?: number; - - } export interface BuildingQuery extends PageQuery { @@ -278,21 +125,6 @@ export interface BuildingQuery extends PageQuery { */ buildingName?: string; - /** - * 省 - */ - province?: string; - - /** - * 市 - */ - city?: string; - - /** - * 区 - */ - district?: string; - /** * 总层数 */ @@ -333,68 +165,13 @@ export interface BuildingQuery extends PageQuery { */ lat?: string; - /** - * 产权性质(1:自持，2：承租，3：自持+承租,4：政府免费使用) - */ - cqxz?: number; - - /** - * 不动产编号 - */ - bdcbh?: string; - - /** - * 产权编号 - */ - cqbh?: string; - - /** - * 图地编号 - */ - tdbh?: string; - - /** - * 建筑面积 - */ - jzmj?: number; - - /** - * 产权面积 - */ - cqmj?: number; - - /** - * 可租面积 - */ - kzmj?: number; - - /** - * 自用面积 - */ - zymj?: number; - - /** - * 配套面积 - */ - ptmj?: number; - - /** - * 车位面积 - */ - cwmj?: number; - - /** - * 标准层高 - */ - bzcg?: number; - /** * 排序字段 */ sort?: number; /** - * 日期范围参数 - */ + * 日期范围参数 + */ params?: any; } diff --git a/apps/web-antd/src/api/property/cityArea/index.ts b/apps/web-antd/src/api/property/cityArea/index.ts index 6965d0fa..b90dc8ab 100644 --- a/apps/web-antd/src/api/property/cityArea/index.ts +++ b/apps/web-antd/src/api/property/cityArea/index.ts @@ -1,28 +1,37 @@ -import type { CityAreaVO, CityAreaForm, CityAreaQuery } from './model'; +import type { CityAreaForm, CityAreaQuery, CityAreaVO } from './model'; -import type { ID, IDS } from '#/api/common'; -import type { PageResult } from '#/api/common'; +import type { ID, IDS, PageResult } from '#/api/common'; import { commonExport } from '#/api/helper'; import { requestClient } from '#/api/request'; /** -* 查询行政区划 -列表 -* @param params -* @returns 行政区划 -列表 -*/ + * 查询行政区划 + 列表 + * @param params + * @returns 行政区划 + 列表 + */ export function cityAreaList(params?: CityAreaQuery) { - return requestClient.get>('/property/cityArea/list', { params }); + return requestClient.get>('/property/cityArea/list', { + params, + }); +} + +/** + * 查询城市结构数 + * @param params + */ +export function getCityAreaTreeList() { + return requestClient.get('/property/cityArea/treeList'); } /** * 导出行政区划 -列表 + 列表 * @param params * @returns 行政区划 -列表 + 列表 */ export function cityAreaExport(params?: CityAreaQuery) { return commonExport('/property/cityArea/export', params ?? {}); @@ -30,10 +39,10 @@ export function cityAreaExport(params?: CityAreaQuery) { /** * 查询行政区划 -详情 + 详情 * @param areaCode id * @returns 行政区划 -详情 + 详情 */ export function cityAreaInfo(areaCode: ID) { return requestClient.get(`/property/cityArea/${areaCode}`); diff --git a/apps/web-antd/src/api/property/community/index.ts b/apps/web-antd/src/api/property/community/index.ts index 33749cdb..58b99819 100644 --- a/apps/web-antd/src/api/property/community/index.ts +++ b/apps/web-antd/src/api/property/community/index.ts @@ -1,18 +1,29 @@ -import type { CommunityVO, CommunityForm, CommunityQuery } from './model'; +import type { CommunityForm, CommunityQuery, CommunityVO } from './model'; -import type { ID, IDS } from '#/api/common'; -import type { PageResult } from '#/api/common'; +import type { ID, IDS, PageResult } from '#/api/common'; import { commonExport } from '#/api/helper'; import { requestClient } from '#/api/request'; /** -* 查询小区列表 -* @param params -* @returns 小区列表 -*/ + * 查询小区列表 + * @param params + * @returns 小区列表 + */ export function communityList(params?: CommunityQuery) { - return requestClient.get>('/property/community/list', { params }); + return requestClient.get>( + '/property/community/list', + { params }, + ); +} + +/** + * 查询小区树结构 + * @param params + * @returns 小区列表 + */ +export function communityTree(level: number) { + return requestClient.get(`/property/community/tree/${level}`); } /** diff --git a/apps/web-antd/src/api/property/community/model.d.ts b/apps/web-antd/src/api/property/community/model.d.ts index bcef3e5f..7d068bc9 100644 --- a/apps/web-antd/src/api/property/community/model.d.ts +++ b/apps/web-antd/src/api/property/community/model.d.ts @@ -1,8 +1,8 @@ -import type { PageQuery, BaseEntity } from '#/api/common'; +import type { BaseEntity, PageQuery } from '#/api/common'; export interface CommunityVO { /** - * + * */ id: string | number; @@ -16,6 +16,9 @@ export interface CommunityVO { */ communityType: number; + cityFullCode: string; + cityFullName: string; + /** * 省 */ @@ -52,7 +55,7 @@ export interface CommunityVO { area: number; /** - * + * */ builtYear: string; @@ -75,12 +78,11 @@ export interface CommunityVO { * 小图图片 */ img: string; - } export interface CommunityForm extends BaseEntity { /** - * + * */ id?: string | number; @@ -94,6 +96,9 @@ export interface CommunityForm extends BaseEntity { */ communityType?: number; + cityFullName: string; + cityFullCode: string; + /** * 省 */ @@ -130,7 +135,7 @@ export interface CommunityForm extends BaseEntity { area?: number; /** - * + * */ builtYear?: string; @@ -153,7 +158,6 @@ export interface CommunityForm extends BaseEntity { * 小图图片 */ img?: string; - } export interface CommunityQuery extends PageQuery { @@ -203,7 +207,7 @@ export interface CommunityQuery extends PageQuery { area?: number; /** - * + * */ builtYear?: string; @@ -228,7 +232,7 @@ export interface CommunityQuery extends PageQuery { img?: string; /** - * 日期范围参数 - */ + * 日期范围参数 + */ params?: any; } diff --git a/apps/web-antd/src/views/property/building/building-modal.vue b/apps/web-antd/src/views/property/building/building-modal.vue index 0bd00a6e..dc15cef0 100644 --- a/apps/web-antd/src/views/property/building/building-modal.vue +++ b/apps/web-antd/src/views/property/building/building-modal.vue @@ -21,7 +21,7 @@ const title = computed(() => { const [BasicForm, formApi] = useVbenForm({ commonConfig: { // 默认占满两列 - formItemClass: 'col-span-2', + formItemClass: 'col-span-1', // 默认label宽度 px labelWidth: 80, // 通用配置项 会影响到所有表单项 @@ -43,7 +43,7 @@ const { onBeforeClose, markInitialized, resetInitialized } = useBeforeCloseDiff( const [BasicModal, modalApi] = useVbenModal({ // 在这里更改宽度 - class: 'w-[550px]', + class: 'w-[60%]', fullscreenButton: false, onBeforeClose, onClosed: handleClosed, diff --git a/apps/web-antd/src/views/property/building/data.ts b/apps/web-antd/src/views/property/building/data.tsx similarity index 65% rename from apps/web-antd/src/views/property/building/data.ts rename to apps/web-antd/src/views/property/building/data.tsx index b2f86088..af23c43f 100644 --- a/apps/web-antd/src/views/property/building/data.ts +++ b/apps/web-antd/src/views/property/building/data.tsx @@ -1,22 +1,44 @@ -import type { FormSchemaGetter } from '#/adapter/form'; +import type { FormSchemaGetter, VbenFormSchema } from '#/adapter/form'; import type { VxeGridProps } from '#/adapter/vxe-table'; +import { communityList } from '#/api/property/community'; +import type { + CommunityQuery, + CommunityVO, +} from '#/api/property/community/model'; +import { getPopupContainer } from '@vben/utils'; +import { getDictOptions } from '#/utils/dict'; +import { DictEnum } from '@vben/constants'; + +let arr: CommunityVO[] = []; +const communitySelect: VbenFormSchema = { + component: 'ApiSelect', + fieldName: 'communityId', + label: '社区', + componentProps: { + resultField: 'list', // 根据API返回结构调整 + labelField: 'communityName', + valueField: 'id', + api: async () => { + if (!arr || arr.length == 0) { + const params: CommunityQuery = { + pageNum: 1, + pageSize: 500, + }; + const res = await communityList(params); + arr = res.rows; + } + return arr; + }, + }, +}; export const querySchema: FormSchemaGetter = () => [ - { - component: 'Input', - fieldName: 'communityName', - label: '社区', - }, + communitySelect, { component: 'Input', fieldName: 'buildingName', label: '建筑名称', }, - { - component: 'Input', - fieldName: 'unitCount', - label: '单元数', - }, ]; // 需要使用i18n注意这里要改成getter形式 否则切换语言不会刷新 @@ -27,18 +49,6 @@ export const columns: VxeGridProps['columns'] = [ title: '建筑名称', field: 'buildingName', }, - { - title: '省', - field: 'province', - }, - { - title: '市', - field: 'city', - }, - { - title: '区', - field: 'district', - }, { title: '总层数', field: 'floorCount', @@ -49,7 +59,7 @@ export const columns: VxeGridProps['columns'] = [ }, { title: '建筑类型', - field: 'buildType', + field: 'buildTypeName', }, { title: '电梯数量', @@ -91,9 +101,7 @@ export const modalSchema: FormSchemaGetter = () => [ }, }, { - label: '园区编码', - fieldName: 'communityId', - component: 'Input', + ...communitySelect, rules: 'required', }, { @@ -102,24 +110,6 @@ export const modalSchema: FormSchemaGetter = () => [ component: 'Input', rules: 'required', }, - { - label: '省', - fieldName: 'province', - component: 'Input', - rules: 'required', - }, - { - label: '市', - fieldName: 'city', - component: 'Input', - rules: 'required', - }, - { - label: '区', - fieldName: 'district', - component: 'Input', - rules: 'required', - }, { label: '总层数', fieldName: 'floorCount', @@ -134,7 +124,10 @@ export const modalSchema: FormSchemaGetter = () => [ label: '建筑类型', fieldName: 'buildType', component: 'Select', - componentProps: {}, + componentProps: { + getPopupContainer, + options: getDictOptions(DictEnum.sys_build_use_type), + }, }, { label: '电梯数量', @@ -147,8 +140,8 @@ export const modalSchema: FormSchemaGetter = () => [ component: 'DatePicker', componentProps: { showTime: true, - format: 'YYYY-MM-DD HH:mm:ss', - valueFormat: 'YYYY-MM-DD HH:mm:ss', + format: 'YYYY-MM-DD', + valueFormat: 'YYYY-MM-DD', }, }, { @@ -161,17 +154,10 @@ export const modalSchema: FormSchemaGetter = () => [ label: '经度', fieldName: 'lon', component: 'Input', - rules: 'required', }, { label: '维度', fieldName: 'lat', component: 'Input', - rules: 'required', - }, - { - label: '排序字段', - fieldName: 'sort', - component: 'Input', }, ]; diff --git a/apps/web-antd/src/views/property/building/index.vue b/apps/web-antd/src/views/property/building/index.vue index 16d60e83..d7d18011 100644 --- a/apps/web-antd/src/views/property/building/index.vue +++ b/apps/web-antd/src/views/property/building/index.vue @@ -1,18 +1,13 @@ @@ -138,9 +138,10 @@ function handleDownloadExcel() { + type="primary" + v-access:code="['property:building:remove']" + @click="handleMultiDelete" + > {{ $t('pages.common.delete') }} -import type {Community} from '#/api/property/community/model'; -import {shallowRef} from 'vue'; -import {useVbenModal} from '@vben/common-ui'; -import {Descriptions, DescriptionsItem} from 'ant-design-vue'; -import {communityInfo} from '#/api/property/community'; -import {renderDict} from "#/utils/render"; +import type { CommunityVO } from '#/api/property/community/model'; +import { shallowRef } from 'vue'; +import { useVbenModal } from '@vben/common-ui'; +import { Descriptions, DescriptionsItem } from 'ant-design-vue'; +import { communityInfo } from '#/api/property/community'; +import { renderDict } from '#/utils/render'; const [BasicModal, modalApi] = useVbenModal({ onOpenChange: handleOpenChange, @@ -13,14 +13,14 @@ const [BasicModal, modalApi] = useVbenModal({ }, }); -const communityDetail = shallowRef(null); +const communityDetail = shallowRef(null); async function handleOpenChange(open: boolean) { if (!open) { return null; } modalApi.modalLoading(true); - const {id} = modalApi.getData() as { id: number | string }; + const { id } = modalApi.getData() as { id: number | string }; const response = await communityInfo(id); communityDetail.value = response; modalApi.modalLoading(false); @@ -28,18 +28,27 @@ async function handleOpenChange(open: boolean) { diff --git a/apps/web-antd/src/views/property/community/community-modal.vue b/apps/web-antd/src/views/property/community/community-modal.vue index 0ed73996..606687f5 100644 --- a/apps/web-antd/src/views/property/community/community-modal.vue +++ b/apps/web-antd/src/views/property/community/community-modal.vue @@ -3,13 +3,20 @@ import { computed, ref } from 'vue'; import { useVbenModal } from '@vben/common-ui'; import { $t } from '@vben/locales'; -import { cloneDeep } from '@vben/utils'; +import { cloneDeep, getPopupContainer, handleNode } from '@vben/utils'; import { useVbenForm } from '#/adapter/form'; -import { communityAdd, communityInfo, communityUpdate } from '#/api/property/community'; +import { + communityAdd, + communityInfo, + communityUpdate, +} from '#/api/property/community'; import { defaultFormValueGetter, useBeforeCloseDiff } from '#/utils/popup'; import { modalSchema } from './data'; +import { getCityAreaTreeList } from '#/api/property/cityArea'; +import type { CityAreaVO } from '#/api/property/cityArea/model'; +import type { CommunityForm } from '#/api/property/community/model'; const emit = defineEmits<{ reload: [] }>(); @@ -21,13 +28,13 @@ const title = computed(() => { const [BasicForm, formApi] = useVbenForm({ commonConfig: { // 默认占满两列 - formItemClass: 'col-span-2', + formItemClass: 'col-span-1', // 默认label宽度 px labelWidth: 80, // 通用配置项 会影响到所有表单项 componentProps: { class: 'w-full', - } + }, }, schema: modalSchema(), showDefaultActions: false, @@ -43,7 +50,7 @@ const { onBeforeClose, markInitialized, resetInitialized } = useBeforeCloseDiff( const [BasicModal, modalApi] = useVbenModal({ // 在这里更改宽度 - class: 'w-[550px]', + class: 'w-[60%]', fullscreenButton: false, onBeforeClose, onClosed: handleClosed, @@ -53,20 +60,20 @@ const [BasicModal, modalApi] = useVbenModal({ return null; } modalApi.modalLoading(true); - const { id } = modalApi.getData() as { id?: number | string }; isUpdate.value = !!id; - if (isUpdate.value && id) { const record = await communityInfo(id); await formApi.setValues(record); } + setupDeptSelect(); await markInitialized(); - modalApi.modalLoading(false); }, }); +let currentSelectNode: any = null; + async function handleConfirm() { try { modalApi.lock(true); @@ -75,7 +82,8 @@ async function handleConfirm() { return; } // getValues获取为一个readonly的对象 需要修改必须先深拷贝一次 - const data = cloneDeep(await formApi.getValues()); + const data: CommunityForm = cloneDeep(await formApi.getValues()); + data.cityFullName = currentSelectNode.fullName; await (isUpdate.value ? communityUpdate(data) : communityAdd(data)); resetInitialized(); emit('reload'); @@ -87,6 +95,57 @@ async function handleConfirm() { } } +/** + * 初始化城市 + */ +async function setupDeptSelect() { + const areaList = await getCityAreaTreeList(); + // 选中后显示在输入框的值 即父节点 / 子节点 + // addFullName(areaList, 'areaName', ' / '); + const splitStr = '/'; + handleNode( + areaList, + 'areaName', + splitStr, + function (node: any, parentNode: any) { + node.fullCode = parentNode + ? parentNode.fullCode + splitStr + node.areaCode + : node.areaCode; + + if (node.areaLevel != '303') { + node.disabled = true; + } + }, + ); + formApi.updateSchema([ + { + componentProps: () => ({ + class: 'w-full', + fieldNames: { + key: 'id', + label: 'areaName', + value: 'fullCode', + children: 'children', + }, + getPopupContainer, + async onSelect(fullCode: any, node: CityAreaVO) { + currentSelectNode = node; + }, + placeholder: '请选择城市', + showSearch: true, + treeData: areaList, + treeDefaultExpandAll: true, + treeLine: { showLeafIcon: false }, + // 筛选的字段 + treeNodeFilterProp: 'areaName', + // 选中后显示在输入框的值 + treeNodeLabelProp: 'fullName', + }), + fieldName: 'cityFullCode', + }, + ]); +} + async function handleClosed() { await formApi.resetForm(); resetInitialized(); @@ -98,4 +157,3 @@ async function handleClosed() { - diff --git a/apps/web-antd/src/views/property/community/data.ts b/apps/web-antd/src/views/property/community/data.ts index d8d93264..4a869a8b 100644 --- a/apps/web-antd/src/views/property/community/data.ts +++ b/apps/web-antd/src/views/property/community/data.ts @@ -1,15 +1,16 @@ 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 = () => [ - { - component: 'Input', - fieldName: 'communityName', - label: '社区', - }, { component: 'Select', - componentProps: {}, + componentProps: { + getPopupContainer, + options: getDictOptions(DictEnum.wy_sqlx), + }, fieldName: 'communityType', label: '社区类型', }, @@ -18,11 +19,6 @@ export const querySchema: FormSchemaGetter = () => [ fieldName: 'propertyCompany', label: '物业公司', }, - { - component: 'Input', - fieldName: 'contactPhone', - label: '联系电话', - }, ]; // 需要使用i18n注意这里要改成getter形式 否则切换语言不会刷新 @@ -36,18 +32,11 @@ export const columns: VxeGridProps['columns'] = [ { title: '社区类型', field: 'communityType', + slots: { default: 'communityType' }, }, { - title: '省', - field: 'province', - }, - { - title: '市', - field: 'city', - }, - { - title: '区', - field: 'district', + title: '城市', + field: 'cityFullName', }, { title: '地址', @@ -62,11 +51,11 @@ export const columns: VxeGridProps['columns'] = [ field: 'lat', }, { - title: '占地面积(平方米)', + title: '占地面积', field: 'area', }, { - title: '', + title: '建成时间', field: 'builtYear', }, { @@ -81,10 +70,6 @@ export const columns: VxeGridProps['columns'] = [ title: '社区描述', field: 'description', }, - { - title: '小图图片', - field: 'img', - }, { field: 'action', fixed: 'right', @@ -114,10 +99,20 @@ export const modalSchema: FormSchemaGetter = () => [ label: '社区类型', fieldName: 'communityType', component: 'Select', - componentProps: {}, + componentProps: { + getPopupContainer, + options: getDictOptions(DictEnum.wy_sqlx), + }, rules: 'selectRequired', }, { + component: 'TreeSelect', + fieldName: 'cityFullCode', + defaultValue: undefined, + label: '城市', + rules: 'selectRequired', + }, + /*{ label: '省', fieldName: 'province', component: 'Input', @@ -134,7 +129,7 @@ export const modalSchema: FormSchemaGetter = () => [ fieldName: 'district', component: 'Input', rules: 'required', - }, + },*/ { label: '地址', fieldName: 'addr', @@ -145,27 +140,25 @@ export const modalSchema: FormSchemaGetter = () => [ label: '经度', fieldName: 'lon', component: 'Input', - rules: 'required', }, { label: '维度', fieldName: 'lat', component: 'Input', - rules: 'required', }, { - label: '占地面积(平方米)', + label: '占地面积', fieldName: 'area', component: 'Input', }, { - label: '', + label: '建成时间', fieldName: 'builtYear', component: 'DatePicker', componentProps: { showTime: true, - format: 'YYYY-MM-DD HH:mm:ss', - valueFormat: 'YYYY-MM-DD HH:mm:ss', + format: 'YYYY-MM-DD', + valueFormat: 'YYYY-MM-DD', }, }, { @@ -184,8 +177,12 @@ export const modalSchema: FormSchemaGetter = () => [ component: 'Textarea', }, { - label: '小图图片', + label: '人像图片', fieldName: 'img', - component: 'Input', + component: 'ImageUpload', + componentProps: { + maxCount: 1, // 最大上传文件数 默认为1 为1会绑定为string而非string[]类型 + }, + formItemClass: 'col-span-2', }, ]; diff --git a/apps/web-antd/src/views/property/community/index.vue b/apps/web-antd/src/views/property/community/index.vue index dbbd5917..1d0d8807 100644 --- a/apps/web-antd/src/views/property/community/index.vue +++ b/apps/web-antd/src/views/property/community/index.vue @@ -6,13 +6,13 @@ import { ref } from 'vue'; import { Page, useVbenModal, type VbenFormProps } from '@vben/common-ui'; import { getVxePopupContainer } from '@vben/utils'; -import { Modal, Popconfirm, Space } from 'ant-design-vue'; +import { Modal, Popconfirm, Space, Tag } from 'ant-design-vue'; import dayjs from 'dayjs'; -import { +import { useVbenVxeGrid, vxeCheckboxChecked, - type VxeGridProps + type VxeGridProps } from '#/adapter/vxe-table'; import { @@ -138,8 +138,8 @@ function handleDownloadExcel() { {{ $t('pages.common.delete') }} @@ -176,6 +176,12 @@ function handleDownloadExcel() { + + + diff --git a/apps/web-antd/src/views/property/floor/data.ts b/apps/web-antd/src/views/property/floor/data.ts index 07d4b230..9e0129e3 100644 --- a/apps/web-antd/src/views/property/floor/data.ts +++ b/apps/web-antd/src/views/property/floor/data.ts @@ -1,12 +1,11 @@ import type { FormSchemaGetter } from '#/adapter/form'; import type { VxeGridProps } from '#/adapter/vxe-table'; - export const querySchema: FormSchemaGetter = () => [ { component: 'Input', - fieldName: 'communityName', - label: '社区', + fieldName: 'floorName', + label: '楼层名称', }, ]; @@ -15,21 +14,17 @@ export const querySchema: FormSchemaGetter = () => [ export const columns: VxeGridProps['columns'] = [ { type: 'checkbox', width: 60 }, { - title: '单元编码', - field: 'unitId', - }, - { - title: '楼层数名称', + title: '楼层名称', field: 'floorName', }, { title: '楼层号', field: 'floorNumber', }, - { + /* { title: '楼层类型', field: 'floorType', - }, + },*/ { title: '房间数量', field: 'roomCount', @@ -58,10 +53,11 @@ export const modalSchema: FormSchemaGetter = () => [ }, }, { - label: '单元编码', + component: 'TreeSelect', fieldName: 'unitId', - component: 'Input', - rules: 'required', + defaultValue: undefined, + label: '社区建筑', + rules: 'selectRequired', }, { label: '楼层数名称', @@ -75,13 +71,12 @@ export const modalSchema: FormSchemaGetter = () => [ component: 'Input', rules: 'required', }, - { + /*{ label: '楼层类型', fieldName: 'floorType', component: 'Select', - componentProps: { - }, - }, + componentProps: {}, + },*/ { label: '房间数量', fieldName: 'roomCount', diff --git a/apps/web-antd/src/views/property/floor/floor-modal.vue b/apps/web-antd/src/views/property/floor/floor-modal.vue index 3ae3501e..76b8270d 100644 --- a/apps/web-antd/src/views/property/floor/floor-modal.vue +++ b/apps/web-antd/src/views/property/floor/floor-modal.vue @@ -3,13 +3,14 @@ import { computed, ref } from 'vue'; import { useVbenModal } from '@vben/common-ui'; import { $t } from '@vben/locales'; -import { cloneDeep } from '@vben/utils'; +import { cloneDeep, getPopupContainer, handleNode } from '@vben/utils'; import { useVbenForm } from '#/adapter/form'; import { floorAdd, floorInfo, floorUpdate } from '#/api/property/floor'; import { defaultFormValueGetter, useBeforeCloseDiff } from '#/utils/popup'; import { modalSchema } from './data'; +import { communityTree } from '#/api/property/community'; const emit = defineEmits<{ reload: [] }>(); @@ -53,16 +54,14 @@ const [BasicModal, modalApi] = useVbenModal({ return null; } modalApi.modalLoading(true); - + setupCommunitySelect() const { id } = modalApi.getData() as { id?: number | string }; isUpdate.value = !!id; - if (isUpdate.value && id) { const record = await floorInfo(id); await formApi.setValues(record); } await markInitialized(); - modalApi.modalLoading(false); }, }); @@ -87,6 +86,45 @@ async function handleConfirm() { } } +/** + * 初始化城市 + */ +async function setupCommunitySelect() { + const areaList = await communityTree(3); + // 选中后显示在输入框的值 即父节点 / 子节点 + // addFullName(areaList, 'areaName', ' / '); + const splitStr = '/'; + handleNode(areaList, 'label', splitStr, function (node: any) { + if (node.level != 3) { + 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: 'unitId', + }, + ]); +} + async function handleClosed() { await formApi.resetForm(); resetInitialized(); diff --git a/apps/web-antd/src/views/property/room/data.ts b/apps/web-antd/src/views/property/room/data.ts index 95dcef3d..fbb3c19b 100644 --- a/apps/web-antd/src/views/property/room/data.ts +++ b/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), + }, }, ]; diff --git a/apps/web-antd/src/views/property/room/room-modal.vue b/apps/web-antd/src/views/property/room/room-modal.vue index 91ce0262..b79f673d 100644 --- a/apps/web-antd/src/views/property/room/room-modal.vue +++ b/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(); diff --git a/apps/web-antd/src/views/property/unit/data.ts b/apps/web-antd/src/views/property/unit/data.ts index f54bedc0..dffbc5c8 100644 --- a/apps/web-antd/src/views/property/unit/data.ts +++ b/apps/web-antd/src/views/property/unit/data.ts @@ -1,12 +1,11 @@ import type { FormSchemaGetter } from '#/adapter/form'; import type { VxeGridProps } from '#/adapter/vxe-table'; - export const querySchema: FormSchemaGetter = () => [ { - component: 'Input', - fieldName: 'communityName', - label: '社区', + component: 'TreeSelect', + fieldName: 'unitName', + label: '单元名称', }, ]; @@ -14,10 +13,6 @@ export const querySchema: FormSchemaGetter = () => [ // export const columns: () => VxeGridProps['columns'] = () => [ export const columns: VxeGridProps['columns'] = [ { type: 'checkbox', width: 60 }, - { - title: '建筑名称', - field: 'buildingId', - }, { title: '单元名称', field: 'unitName', @@ -54,10 +49,11 @@ export const modalSchema: FormSchemaGetter = () => [ }, }, { - label: '建筑名称', + component: 'TreeSelect', fieldName: 'buildingId', - component: 'Input', - rules: 'required', + defaultValue: undefined, + label: '社区建筑', + rules: 'selectRequired', }, { label: '单元名称', diff --git a/apps/web-antd/src/views/property/unit/index.vue b/apps/web-antd/src/views/property/unit/index.vue index d116c9b9..2c368485 100644 --- a/apps/web-antd/src/views/property/unit/index.vue +++ b/apps/web-antd/src/views/property/unit/index.vue @@ -1,25 +1,16 @@