Merge branch 'master' of http://47.109.37.87:3000/by2025/admin-vben5

# Conflicts: # apps/web-antd/vite.config.mts
2025-07-10 16:21:36 +08:00
parent 804e51ac7e 051e7df6c7
commit 2cd8d752eb
41 changed files with 2266 additions and 217 deletions
--- a/apps/web-antd/src/views/property/businessManagement/workOrders/data.ts
+++ b/apps/web-antd/src/views/property/businessManagement/workOrders/data.ts
@@ -2,6 +2,10 @@ import type {FormSchemaGetter} from '#/adapter/form';
 import type {VxeGridProps} from '#/adapter/vxe-table';
 import {renderDict} from "#/utils/render";
 import {getDictOptions} from "#/utils/dict";
+import {h} from "vue";
+import {Rate} from "ant-design-vue";
+import type {Dayjs} from "dayjs";
+import dayjs from "dayjs";


 export const querySchema: FormSchemaGetter = () => [
@@ -15,12 +19,6 @@ export const querySchema: FormSchemaGetter = () => [
    fieldName: 'orderName',
    label: '工单名称',
  },
-  {
-    component: 'Select',
-    componentProps: {},
-    fieldName: 'type',
-    label: '工单类型',
-  },
  {
    component: 'Select',
    componentProps: {
@@ -45,12 +43,12 @@ export const columns: VxeGridProps['columns'] = [
  },
  {
    title: '工单类型',
-    field: 'type',
-    slots: {
-      default: ({row}) => {
-        return renderDict(row.type, 'wy_gdlx');
-      },
-    },
+    field: 'typeName',
+    minWidth: 150,
+  },
+  {
+    title: '派单时间',
+    field: 'dispatchTime',
    width: 100,
  },
  {
@@ -63,26 +61,6 @@ export const columns: VxeGridProps['columns'] = [
    },
    width: 100,
  },
-  {
-    title: '派单时间',
-    field: 'dispatchTime',
-    width: 100,
-  },
-  {
-    title: '发起人姓名',
-    field: 'initiatorName',
-    width: 100,
-  },
-  {
-    title: '发起人手机号',
-    field: 'initiatorPhone',
-    width: 100,
-  },
-  {
-    title: '处理人姓名',
-    field: 'handler',
-    width: 100,
-  },
  {
    title: '地址',
    field: 'location',
@@ -101,12 +79,26 @@ export const columns: VxeGridProps['columns'] = [
  {
    title: '评价',
    field: 'serviceEvalua',
-    width: 100,
+    width: 180,
+    slots: {
+      default: ({row}) => {
+        return h(Rate, {
+          value: row.serviceEvalua || 0,
+          disabled: true,
+        });
+      },
+    },
+
  },
  {
    title: '是否超时',
    field: 'isTimeOut',
    width: 100,
+    slots: {
+      default: ({row}) => {
+        return renderDict(row.status, 'wy_sf');
+      },
+    },
  },
  {
    field: 'action',
@@ -136,7 +128,7 @@ export const modalSchema: FormSchemaGetter = () => [
  {
    label: '工单类型',
    fieldName: 'type',
-    component: 'Select',
+    component: 'ApiSelect',
    componentProps: {},
    rules: 'selectRequired',
  },
@@ -158,6 +150,7 @@ export const modalSchema: FormSchemaGetter = () => [
      showTime: true,
      format: 'YYYY-MM-DD HH:mm:ss',
      valueFormat: 'YYYY-MM-DD HH:mm:ss',
+      disabledDate: disabledDate
    },
    rules: 'selectRequired',
  },
@@ -169,11 +162,6 @@ export const modalSchema: FormSchemaGetter = () => [
    rules: 'selectRequired',

  },
-  // {
-  //   label: '发起人手机号',
-  //   fieldName: 'initiatorPhone',
-  //   component: 'Input',
-  // },
  {
    label: '处理人',
    fieldName: 'handler',
@@ -228,3 +216,6 @@ export const modalSchema: FormSchemaGetter = () => [
    rules: 'selectRequired',
  },
 ];
+const disabledDate = (current: Dayjs) => {
+  return current && current < dayjs().endOf('day');
+};
--- a/apps/web-antd/src/views/property/businessManagement/workOrders/index.vue
+++ b/apps/web-antd/src/views/property/businessManagement/workOrders/index.vue
@@ -1,8 +1,8 @@
 <script setup lang="ts">
-import { Page, useVbenModal, type VbenFormProps } from '@vben/common-ui';
-import { getVxePopupContainer } from '@vben/utils';
+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, RadioGroup, RadioButton} from 'ant-design-vue';

 import {
  useVbenVxeGrid,
@@ -15,12 +15,17 @@ import {
  workOrdersList,
  workOrdersRemove,
 } from '#/api/property/businessManagement/workOrders';
-import type { WorkOrdersForm } from '#/api/property/businessManagement/workOrders/model';
-import { commonDownloadExcel } from '#/utils/file/download';
+import type {WorkOrdersForm} from '#/api/property/businessManagement/workOrders/model';
+import {commonDownloadExcel} from '#/utils/file/download';

 import workOrdersModal from './workOrders-modal.vue';
-import { columns, querySchema } from './data';
+import workOrdersDetail from './work-orders-detail.vue';
+import {columns, querySchema} from './data';
+import {onMounted, ref} from "vue";
+import {workOrdersTypeList} from "#/api/property/businessManagement/workOrdersType";

+const ordersTypeList = ref<any[]>([]);
+const ordersType = ref<string>('0');
 const formOptions: VbenFormProps = {
  commonConfig: {
    labelWidth: 80,
@@ -30,6 +35,14 @@ const formOptions: VbenFormProps = {
  },
  schema: querySchema(),
  wrapperClass: 'grid-cols-1 md:grid-cols-2 lg:grid-cols-3 xl:grid-cols-4',
+  handleReset: async () => {
+    ordersType.value = '0';
+    const { formApi, reload } = tableApi;
+    await formApi.resetForm();
+    const formValues = formApi.form.values;
+    formApi.setLatestSubmissionValues(formValues);
+    await reload(formValues);
+  },
 };

 const gridOptions: VxeGridProps = {
@@ -41,15 +54,14 @@ const gridOptions: VxeGridProps = {
    // 点击行选中
    // trigger: 'row',
  },
-  // 需要使用i18n注意这里要改成getter形式 否则切换语言不会刷新
-  // columns: columns(),
  columns,
  height: 'auto',
  keepSource: true,
  pagerConfig: {},
  proxyConfig: {
    ajax: {
-      query: async ({ page }, formValues = {}) => {
+      query: async ({page}, formValues = {}) => {
+        formValues.type = ordersType.value=='0'?undefined:ordersType.value;
        return await workOrdersList({
          pageNum: page.currentPage,
          pageSize: page.pageSize,
@@ -74,13 +86,21 @@ const [WorkOrdersModal, modalApi] = useVbenModal({
  connectedComponent: workOrdersModal,
 });

+const [WorkOrdersDetail, detailApi] = useVbenModal({
+  connectedComponent: workOrdersDetail,
+});
+
 function handleAdd() {
  modalApi.setData({});
  modalApi.open();
 }
+function handleInfo(row:any) {
+  detailApi.setData({id:row.id});
+  detailApi.open();
+}

 async function handleEdit(row: Required<WorkOrdersForm>) {
-  modalApi.setData({ id: row.id });
+  modalApi.setData({id: row.id});
  modalApi.open();
 }

@@ -108,11 +128,39 @@ function handleDownloadExcel() {
    fieldMappingTime: formOptions.fieldMappingTime,
  });
 }
+
+async function queryOrderType() {
+  let params = {
+    pageSize: 1000,
+    pageNum: 1
+  }
+  const res = await workOrdersTypeList(params)
+  ordersTypeList.value = res.rows.map((item) => ({
+    label: item.orderTypeName,
+    value: item.id,
+  }));
+  ordersTypeList.value.unshift({
+    label: '全部工单',
+    value: '0',
+  })
+}
+
+onMounted(async () => {
+  await queryOrderType()
+});
 </script>

 <template>
  <Page :auto-content-height="true">
-    <BasicTable table-title="工单处理列表">
+    <BasicTable table-title="工单处理列表" class="order-work-left-radio">
+      <template #table-title>
+        <RadioGroup v-model:value="ordersType" button-style="solid"
+                    @change="() => tableApi.reload()">
+          <RadioButton v-for="item in ordersTypeList"
+                       :value="item.value">{{ item.label }}
+          </RadioButton>
+        </RadioGroup>
+      </template>
      <template #toolbar-tools>
        <Space>
          <a-button
@@ -140,6 +188,12 @@ function handleDownloadExcel() {
      </template>
      <template #action="{ row }">
        <Space>
+          <ghost-button
+            v-access:code="['property:workOrders:info']"
+            @click.stop="handleInfo(row)"
+          >
+            {{ $t('pages.common.info') }}
+          </ghost-button>
          <ghost-button
            v-access:code="['property:workOrders:edit']"
            @click.stop="handleEdit(row)"
@@ -163,6 +217,22 @@ function handleDownloadExcel() {
        </Space>
      </template>
    </BasicTable>
-    <WorkOrdersModal @reload="tableApi.query()" />
+    <WorkOrdersModal @reload="tableApi.query()"/>
+    <WorkOrdersDetail/>
  </Page>
 </template>
+<style lang="scss" scoped>
+:where(.css-dev-only-do-not-override-aza1th).ant-radio-group {
+  white-space: nowrap;
+  overflow-y: hidden;
+  margin-right: 10px;
+}
+
+</style>
+<style lang="scss">
+.order-work-left-radio{
+  .vxe-toolbar .vxe-buttons--wrapper, .vxe-toolbar .vxe-tools--wrapper {
+    max-width: 70% !important;
+  }
+}
+</style>
--- a/apps/web-antd/src/views/property/businessManagement/workOrders/work-orders-detail.vue
+++ b/apps/web-antd/src/views/property/businessManagement/workOrders/work-orders-detail.vue
@@ -0,0 +1,103 @@
+<script setup lang="ts">
+
+import {ref, shallowRef} from 'vue';
+
+import {useVbenModal} from '@vben/common-ui';
+
+import {Descriptions, DescriptionsItem, Timeline, TimelineItem, Rate,Divider} from 'ant-design-vue';
+import dayjs from 'dayjs';
+import duration from 'dayjs/plugin/duration';
+import relativeTime from 'dayjs/plugin/relativeTime';
+
+import {renderDict} from "#/utils/render";
+import {workOrdersInfo} from "#/api/property/businessManagement/workOrders";
+import type {WorkOrdersVO} from "#/api/property/businessManagement/workOrders/model";
+
+dayjs.extend(duration);
+dayjs.extend(relativeTime);
+
+const [BasicModal, modalApi] = useVbenModal({
+  onOpenChange: handleOpenChange,
+  onClosed() {
+    orderDetail.value = null;
+  },
+});
+
+const orderDetail = shallowRef<null | WorkOrdersVO>(null);
+const handleRecords=ref<any[]>([])
+async function handleOpenChange(open: boolean) {
+  if (!open) {
+    return null;
+  }
+  modalApi.modalLoading(true);
+
+  const {id} = modalApi.getData() as { id: number | string };
+  // 赋值
+  orderDetail.value = await workOrdersInfo(id);
+  if(orderDetail.value){
+    handleRecords.value=[
+      {type:orderDetail.value.typeName,time:orderDetail.value.compleTime,personName:orderDetail.value.handlerText},
+      {type:'跟进',time:orderDetail.value.dispatchTime,personName:orderDetail.value.initiatorNameText},
+      {type:'创建工单',time:orderDetail.value.createTime,personName:orderDetail.value.initiatorNameText},
+    ]
+  }
+
+  modalApi.modalLoading(false);
+}
+
+
+</script>
+
+<template>
+  <BasicModal :footer="false" :fullscreen-button="false" title="工单详情信息" class="w-[70%]">
+    <div v-if="orderDetail">
+      <Descriptions size="small" :column="2" :labelStyle="{width:'100px'}">
+        <DescriptionsItem label="订单号">
+          {{ orderDetail.orderNo }}
+        </DescriptionsItem>
+        <DescriptionsItem label="工单名称">
+          {{ orderDetail.orderName }}
+        </DescriptionsItem>
+        <DescriptionsItem label="工单类型">
+         {{orderDetail.typeName}}
+        </DescriptionsItem>
+        <DescriptionsItem label="发起人">
+          {{ orderDetail.initiatorNameText+'-'+orderDetail.initiatorPhone}}
+        </DescriptionsItem>
+        <DescriptionsItem label="派单时间">
+          {{ orderDetail.dispatchTime }}
+        </DescriptionsItem>
+        <DescriptionsItem label="处理人">
+          {{ orderDetail.handlerText }}
+        </DescriptionsItem>
+        <DescriptionsItem label="具体位置" :span="2">
+          {{ orderDetail.location }}
+        </DescriptionsItem>
+        <DescriptionsItem label="计划完成时间">
+          {{ orderDetail.planCompleTime }}
+        </DescriptionsItem>
+        <DescriptionsItem label="完成时间">
+          {{ orderDetail.compleTime }}
+        </DescriptionsItem>
+        <DescriptionsItem label="服务评价">
+          <Rate :value="orderDetail.serviceEvalua" disabled/>
+        </DescriptionsItem>
+        <DescriptionsItem label="是否超时">
+          <component
+            :is="renderDict(orderDetail.isTimeOut,'wy_sf')"
+          />
+        </DescriptionsItem>
+      </Descriptions>
+      <Divider orientation="left" orientation-margin="0px">
+        处理记录
+      </Divider>
+      <Timeline v-if="handleRecords.length">
+        <TimelineItem v-for="item in handleRecords">
+          <p>类型：{{item.type}}</p>
+          <p>时间：{{item.time}}</p>
+          <p>处理人：{{item.personName}}</p>
+        </TimelineItem>
+      </Timeline>
+    </div>
+  </BasicModal>
+</template>
--- a/apps/web-antd/src/views/property/businessManagement/workOrders/workOrders-modal.vue
+++ b/apps/web-antd/src/views/property/businessManagement/workOrders/workOrders-modal.vue
@@ -16,6 +16,7 @@ import {defaultFormValueGetter, useBeforeCloseDiff} from '#/utils/popup';
 import {modalSchema} from './data';
 import {personList} from "#/api/property/resident/person";
 import {renderDictValue} from "#/utils/render";
+import {workOrdersTypeList} from "#/api/property/businessManagement/workOrdersType";

 const emit = defineEmits<{ reload: [] }>();

@@ -60,11 +61,13 @@ const [BasicModal, modalApi] = useVbenModal({
    }
    modalApi.modalLoading(true);
    await queryPersonData()
+    await queryWorkOrdersType()
    const {id} = modalApi.getData() as { id?: number | string };
    isUpdate.value = !!id;

    if (isUpdate.value && id) {
      const record = await workOrdersInfo(id);
+      record.isTimeOut=record.isTimeOut.toString()
      await formApi.setValues(record);
    }
    await markInitialized();
@@ -111,6 +114,7 @@ async function queryPersonData() {
  formApi.updateSchema([{
    componentProps: () => ({
      options: options,
+      showSearch:true,
      filterOption: filterOption
    }),
    fieldName: 'initiatorName',
@@ -118,14 +122,35 @@ async function queryPersonData() {
    {
      componentProps: () => ({
        options: options,
+        showSearch:true,
        filterOption: filterOption
      }),
      fieldName: 'handler',
    }])
 }

+async function queryWorkOrdersType() {
+  let params = {
+    pageSize: 1000,
+    pageNum: 1
+  }
+  const res = await workOrdersTypeList(params)
+  const options = res.rows.map((item) => ({
+    label: item.orderTypeName,
+    value: item.id,
+  }));
+  formApi.updateSchema([{
+    componentProps: () => ({
+      options: options,
+      filterOption: filterOption,
+      showSearch:true,
+    }),
+    fieldName: 'type',
+  }])
+}
+
 const filterOption = (input: string, option: any) => {
-  return option.value.toLowerCase().indexOf(input.toLowerCase()) >= 0;
+  return option.label.toLowerCase().indexOf(input.toLowerCase()) >= 0;
 };

 </script>
--- a/apps/web-antd/src/views/property/clean/cleanOrders/clean-modal.vue
+++ b/apps/web-antd/src/views/property/clean/cleanOrders/clean-modal.vue
@@ -39,6 +39,8 @@ const totalSumPeices = computed(() => {

 const isUpdate = ref(false);
 const isReadonly = ref(false);
+const isAudit = ref(false);
+const isRefund = ref(false);
 const title = computed(() => {
  return isUpdate.value ? $t('pages.common.edit') : isReadonly.value ? '详情' : $t('pages.common.add');
 });
@@ -121,12 +123,16 @@ const [BasicModal, modalApi] = useVbenModal({
    // 查询服务地址树形结构
    setupCommunitySelect()
    modalApi.modalLoading(true);
-    const { id, readonly } = modalApi.getData() as {
+    const { id, readonly,audit,refund } = modalApi.getData() as {
      id?: string;
      readonly?: boolean;
+      audit?: boolean;
+      refund?: boolean;
    };
    editCleanOrderId.value = id || '';
    isReadonly.value = !!readonly;
+    isAudit.value = !!audit;
+    isRefund.value = !!refund;
    //判断是否是编辑状态需要先判断是否是只读状态
    if(isReadonly.value){
      isUpdate.value = false;
@@ -139,6 +145,14 @@ const [BasicModal, modalApi] = useVbenModal({
      if (record.endTime) record.endTime = dayjs(record.endTime);
      editUnitId.value = record.unitId || '';
      detailTable.value = record.cleanList || [];
+      for(const item of record.relationList){
+        for(let i = 0; i < detailTable.value.length; i++){
+          if(item.cleanId === detailTable.value[i].id){
+            detailTable.value[i].area = item.areas;
+            detailTable.value[i].sumPeices = item.sumPrice;
+          }
+        }
+      }
      await formApi.setValues(record);
    }
    await markInitialized();
@@ -275,14 +289,10 @@ function handleAddDetail() {
 }
 // 添加订单服务详情
 function handleDetailReload(data: any) {
-  console.log(data,'afawed');
-  
  detailTable.value.push(data);
 }
 // 编辑订单服务详情
 function handleEditDetailReload(data: any) {
-  console.log(data,'1203342423');
-  
  detailTable.value[data.index] = data;

 }
@@ -326,7 +336,8 @@ async function handleConfirm() {
    data.unit = unitObj ? unitObj.name : data.unit || '';
    data.name = cleanObj ? cleanObj.name : data.name || '';
    data.unitId = unitObj ? unitObj.id : isUpdate.value ? editUnitId.value : '';
-    data.sumPeices = parseInt(totalSumPeices.value, 10);
+    data.sumPeices = Number(totalSumPeices.value)
+    // data.sumPeices = parseInt(totalSumPeices.value, 10);
    // 组装 cleanIds
    // data.cleanIds = detailTable.value.map((item: any) => item.id);
    data.cleanList = detailTable.value;
@@ -382,6 +393,46 @@ async function setupCommunitySelect() {
    },
  ]);
 }
+async function handleAudit(params: any) {
+    modalApi.lock(true);
+    const { valid } = await formApi.validate();
+    if (!valid) {
+      return;
+    }
+    const data = cloneDeep(await formApi.getValues());
+    // 单位数据缓存
+    if (unitListData.length === 0) {
+      const res = await resident_unitList();
+      unitListData = res.rows || [];
+    }
+    // 劳务数据缓存 cleanListData 已有
+    // 查找label
+    const unitObj = unitListData.find((item) => item.id === data.unitId);
+    const cleanObj = cleanListData.find((item) => item.id === data.name);
+    data.unit = unitObj ? unitObj.name : data.unit || '';
+    data.name = cleanObj ? cleanObj.name : data.name || '';
+    data.unitId = unitObj ? unitObj.id : isUpdate.value ? editUnitId.value : '';
+    data.sumPeices = Number(totalSumPeices.value)
+    data.starTime = dayjs(data.starTime).format('YYYY-MM-DD HH:mm:ss');
+    data.endTime = dayjs(data.endTime).format('YYYY-MM-DD HH:mm:ss');
+    // data.sumPeices = parseInt(totalSumPeices.value, 10);
+    // 组装 cleanIds
+    // data.cleanIds = detailTable.value.map((item: any) => item.id);
+    data.cleanList = detailTable.value;
+    if(params.isRefund){
+      data.isUnbooking = 1;
+    } else if(params.isAudit){
+      data.state = 1;
+    }else{
+      data.state = 2;
+    }
+    console.log(data,'data');
+    // 0：未审核 1：审核通过 2：审核不通过
+    await clean_orderUpdate({...data,id:editCleanOrderId.value})
+    resetInitialized();
+    emit('reload');
+    modalApi.close();
+}
 </script>

 <template>
@@ -422,7 +473,16 @@ async function setupCommunitySelect() {
      <div>费用合计：{{ totalSumPeices }}元</div>
    </div>
    <CleanDetailModal @reload="handleDetailReload" @editReload="handleEditDetailReload"/>
-  </BasicModal>
+    <template #footer v-if="isAudit">
+      <a-button @click="modalApi.close()">取消</a-button>
+      <a-button type="primary" @click="handleAudit({isAudit:true})">审核通过</a-button>
+      <a-button danger @click="handleAudit({isAudit:false})">审核不通过</a-button>
+    </template>
+    <template #footer v-if="isRefund">
+      <a-button @click="modalApi.close()">取消</a-button>
+      <a-button type="primary" @click="handleAudit({isRefund:true})">退定</a-button>
+    </template>
+ </BasicModal>
 </template>

 <style scoped>
--- a/apps/web-antd/src/views/property/clean/cleanOrders/index.vue
+++ b/apps/web-antd/src/views/property/clean/cleanOrders/index.vue
@@ -127,10 +127,26 @@ function handleDownloadExcel() {
  );
 }

-async function handleView(row: Required<CleanForm>) {
+ function handleView(row: Required<CleanForm>) {
  modalApi.setData({ id: row.id, readonly: true });
  modalApi.open();
 }
+
+function handleAudit(row:any) {
+  // 审核逻辑
+  // TODO: 实现审核功能
+  console.log('审核', row);
+  modalApi.setData({ id: row.id, readonly: true,audit:true });
+  modalApi.open();
+}
+
+function handleRefund(row:any) {
+  // 退定逻辑
+  // TODO: 实现退定功能
+  console.log('退定', row);
+  modalApi.setData({ id: row.id, readonly: true,refund:true });
+  modalApi.open();
+}
 </script>

 <template>
@@ -170,26 +186,13 @@ async function handleView(row: Required<CleanForm>) {
      <template #action="{ row }">
        <Space>
          <ghost-button @click.stop="handleView(row)"> 查看 </ghost-button>
-          <ghost-button
-            v-access:code="['property:clean:edit']"
-            @click.stop="handleEdit(row)"
-          >
-            {{ $t('pages.common.edit') }}
-          </ghost-button>
-          <Popconfirm
-            :get-popup-container="getVxePopupContainer"
-            placement="left"
-            title="确认删除？"
-            @confirm="handleDelete(row)"
-          >
-            <ghost-button
-              danger
-              v-access:code="['property:clean:remove']"
-              @click.stop=""
-            >
-              {{ $t('pages.common.delete') }}
-            </ghost-button>
-          </Popconfirm>
+          <template v-if="row.state === 0">
+            <ghost-button type="primary" @click.stop="handleAudit(row)">审核</ghost-button>
+          </template>
+          <template v-else>
+            <ghost-button danger @click.stop="handleRefund(row)" v-if="row.isUnbooking === 0">退定</ghost-button>
+            <ghost-button disabled v-else>已退定</ghost-button>
+          </template>
        </Space>
      </template>
    </BasicTable>
--- a/apps/web-antd/src/views/property/clean_order/clean_order-modal.vue
+++ b/apps/web-antd/src/views/property/clean_order/clean_order-modal.vue
@@ -53,7 +53,6 @@ const [BasicModal, modalApi] = useVbenModal({
      return null;
    }
    modalApi.modalLoading(true);
-
    const { id } = modalApi.getData() as { id?: number | string };
    isUpdate.value = !!id;

--- a/apps/web-antd/src/views/property/greenPlantRentalManagement/reportStatistics/index.vue
+++ b/apps/web-antd/src/views/property/greenPlantRentalManagement/reportStatistics/index.vue
@@ -5,7 +5,8 @@ import { onMounted, ref } from 'vue';

 import { EchartsUI, useEcharts } from '@vben/plugins/echarts';

-import { Button } from 'ant-design-vue';
+import { Button,Radio } from 'ant-design-vue';
+import type { RadioChangeEvent } from 'ant-design-vue';

 import { statisticsByTime,
  countByRentalType,
@@ -13,6 +14,7 @@ import { statisticsByTime,
  countRenewRate,
  countByCusScore,
  countOrderAndAmount,
+  countCustomers,
  countAchievedRate,
  countAchieved
 } from '#/api/property/reportStatistics';
@@ -42,17 +44,23 @@ const timeUnit = ref<number>(1)
 const countOrderAndAmountDataAmount = ref<number>(0);
 const countOrderAndAmountDataOrder = ref<number>(0);
 const countAchievedRateData = ref<any>(null);
+const countCustomersData = ref<any>(null);
+const xAxisData = ref<any[]>([]);
+const seriesData = ref<any[]>([]);
 onMounted(async () => {
    // 任务数
  const countOrderAndAmountData= await countOrderAndAmount();
  countOrderAndAmountDataAmount.value = countOrderAndAmountData.amount;
  countOrderAndAmountDataOrder.value = countOrderAndAmountData.num;
+  //活跃用户
+  const countCustomersDataRes: any = await countCustomers();
+  countCustomersData.value = countCustomersDataRes.count;
  const countAchievedRateDataRes: any = await countAchievedRate();
  countAchievedRateData.value = countAchievedRateDataRes.rate;
  // 查询订单数量趋势
  const res = await statisticsByTime({ timeUnit: timeUnit.value });
-  const xAxisData = res?.time ?? [];
-  const seriesData = res?.counts ?? [];
+  xAxisData.value = res?.time ?? [];
+  seriesData.value = res?.counts ?? [];
  // 租赁金额分布
  const data = await countByRentalType();//返回的内容是amount: 1, type: "单点"
  // 转换字段名为value和name
@@ -76,7 +84,7 @@ onMounted(async () => {
    tooltip: { trigger: 'axis' },
    xAxis: {
      type: 'category',
-      data: xAxisData,
+      data: xAxisData.value,
      boundaryGap: false,
    },
    yAxis: { type: 'value' },
@@ -84,7 +92,7 @@ onMounted(async () => {
      {
        name: '订单数',
        type: 'line',
-        data: seriesData ||[],
+        data: seriesData.value ||[],
        smooth: true,
      },
    ],
@@ -229,13 +237,29 @@ onMounted(async () => {
    ],
  });
 });
-const nodeOptions = [
-  { label: '日', value: 1 },
-  { label: '周', value: 2 },
-  { label: '月', value: 3 },
-];
-function handleAssociationChange(e: any) {
+// 切换视图模式
+async function handleViewModeChange(e: RadioChangeEvent): Promise<void> {
  timeUnit.value = e.target.value;
+  const res = await statisticsByTime({ timeUnit: timeUnit.value });
+  xAxisData.value = res?.time ?? [];
+  seriesData.value = res?.counts ?? [];
+  renderEcharts({
+    tooltip: { trigger: 'axis' },
+    xAxis: {
+      type: 'category',
+      data: xAxisData.value,
+      boundaryGap: false,
+    },
+    yAxis: { type: 'value' },
+    series: [
+      {
+        name: '订单数',
+        type: 'line',
+        data: seriesData.value ||[],
+        smooth: true,
+      },
+    ],
+  });
 }
 function formatNumber(num: number | string) {
  if (!num && num !== 0) {
@@ -277,6 +301,10 @@ function formatNumber(num: number | string) {
             <div class="title">累计租赁金额</div>
            <div class="number">{{ formatNumber(countOrderAndAmountDataOrder) }}</div>
          </div>
+          <div class="box">
+             <div class="title">当前活跃客户数</div>
+            <div class="number">{{ formatNumber(countCustomersData) }}</div>
+          </div>
          <div class="box">
             <div class="title">绿植养护完成率</div>
            <div class="number">{{ countAchievedRateData }}</div>
@@ -287,13 +315,11 @@ function formatNumber(num: number | string) {
            <div style="display: flex; align-items: center; justify-content: space-between; margin-bottom: 8px;">
              <span style="font-size: 18px; font-weight: bold;">订单数量趋势</span>
              <div>
-                <RadioGroup
-                  v-model:value="timeUnit"
-                  :options="nodeOptions"
-                  button-style="solid"
-                  option-type="button"
-                  @change="handleAssociationChange"
-                />
+                <Radio.Group v-model:value="timeUnit" @change="handleViewModeChange">
+                  <Radio.Button value=1>日</Radio.Button>
+                  <Radio.Button value=2>周</Radio.Button>
+                  <Radio.Button value=3>月</Radio.Button>
+                </Radio.Group>
              </div>
            </div>
            <EchartsUI
@@ -357,7 +383,6 @@ function formatNumber(num: number | string) {
  .box {
    height: 100%;
    margin: 40px;
-
    .title {
      display: flex;
      justify-content: space-between;
@@ -384,7 +409,8 @@ function formatNumber(num: number | string) {
        display: flex;
        justify-content: space-between;
        .box{
-          width: 300px;
+          width: 250px;
+          max-width: 300px;
          height: 120px;
          background-color: #fff;
          border-radius: 8px;
--- a/apps/web-antd/src/views/property/inspectionManagement/inspectionItem/data.ts
+++ b/apps/web-antd/src/views/property/inspectionManagement/inspectionItem/data.ts
@@ -0,0 +1,59 @@
+import type { FormSchemaGetter } from '#/adapter/form';
+import type { VxeGridProps } from '#/adapter/vxe-table';
+
+
+export const querySchema: FormSchemaGetter = () => [
+  {
+    component: 'Input',
+    fieldName: 'itemName',
+    label: '项目名称',
+  },
+];
+
+// 需要使用i18n注意这里要改成getter形式 否则切换语言不会刷新
+// export const columns: () => VxeGridProps['columns'] = () => [
+export const columns: VxeGridProps['columns'] = [
+  { type: 'checkbox', width: 60 },
+  {
+    title: '主键id',
+    field: 'id',
+  },
+  {
+    title: '项目名称',
+    field: 'itemName',
+  },
+  {
+    title: '备注',
+    field: 'remark',
+  },
+  {
+    field: 'action',
+    fixed: 'right',
+    slots: { default: 'action' },
+    title: '操作',
+    width: 180,
+  },
+];
+
+export const modalSchema: FormSchemaGetter = () => [
+  {
+    label: '主键id',
+    fieldName: 'id',
+    component: 'Input',
+    dependencies: {
+      show: () => false,
+      triggerFields: [''],
+    },
+  },
+  {
+    label: '项目名称',
+    fieldName: 'itemName',
+    component: 'Input',
+    rules: 'required',
+  },
+  {
+    label: '备注',
+    fieldName: 'remark',
+    component: 'Input',
+  },
+];
--- a/apps/web-antd/src/views/property/inspectionManagement/inspectionItem/index.vue
+++ b/apps/web-antd/src/views/property/inspectionManagement/inspectionItem/index.vue
@@ -0,0 +1,182 @@
+<script setup lang="ts">
+import type { Recordable } from '@vben/types';
+
+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 dayjs from 'dayjs';
+
+import {
+  useVbenVxeGrid,
+  vxeCheckboxChecked,
+  type VxeGridProps
+} from '#/adapter/vxe-table';
+
+import {
+  inspectionItemExport,
+  inspectionItemList,
+  inspectionItemRemove,
+} from '#/api/property/inspectionManagement/inspectionItem';
+import type { InspectionItemForm } from '#/api/property/inspectionManagement/inspectionItem/model';
+import { commonDownloadExcel } from '#/utils/file/download';
+
+import inspectionItemModal from './inspectionItem-modal.vue';
+import { columns, querySchema } from './data';
+
+const formOptions: VbenFormProps = {
+  commonConfig: {
+    labelWidth: 80,
+    componentProps: {
+      allowClear: true,
+    },
+  },
+  schema: querySchema(),
+  wrapperClass: 'grid-cols-1 md:grid-cols-2 lg:grid-cols-3 xl:grid-cols-4',
+  // 处理区间选择器RangePicker时间格式 将一个字段映射为两个字段 搜索/导出会用到
+  // 不需要直接删除
+  // fieldMappingTime: [
+  //  [
+  //    'createTime',
+  //    ['params[beginTime]', 'params[endTime]'],
+  //    ['YYYY-MM-DD 00:00:00', 'YYYY-MM-DD 23:59:59'],
+  //  ],
+  // ],
+};
+
+const gridOptions: VxeGridProps = {
+  checkboxConfig: {
+    // 高亮
+    highlight: true,
+    // 翻页时保留选中状态
+    reserve: true,
+    // 点击行选中
+    // trigger: 'row',
+  },
+  // 需要使用i18n注意这里要改成getter形式 否则切换语言不会刷新
+  // columns: columns(),
+  columns,
+  height: 'auto',
+  keepSource: true,
+  pagerConfig: {},
+  proxyConfig: {
+    ajax: {
+      query: async ({ page }, formValues = {}) => {
+        return await inspectionItemList({
+          pageNum: page.currentPage,
+          pageSize: page.pageSize,
+          ...formValues,
+        });
+      },
+    },
+  },
+  rowConfig: {
+    keyField: 'id',
+  },
+  // 表格全局唯一表示 保存列配置需要用到
+  id: 'property-inspectionItem-index'
+};
+
+const [BasicTable, tableApi] = useVbenVxeGrid({
+  formOptions,
+  gridOptions,
+});
+
+const [InspectionItemModal, modalApi] = useVbenModal({
+  connectedComponent: inspectionItemModal,
+});
+
+function handleAdd() {
+  modalApi.setData({});
+  modalApi.open();
+}
+
+async function handleEdit(row: Required<InspectionItemForm>) {
+  modalApi.setData({ id: row.id });
+  modalApi.open();
+}
+
+async function handleDelete(row: Required<InspectionItemForm>) {
+  await inspectionItemRemove(row.id);
+  await tableApi.query();
+}
+
+function handleMultiDelete() {
+  const rows = tableApi.grid.getCheckboxRecords();
+  const ids = rows.map((row: Required<InspectionItemForm>) => row.id);
+  Modal.confirm({
+    title: '提示',
+    okType: 'danger',
+    content: `确认删除选中的${ids.length}条记录吗？`,
+    onOk: async () => {
+      await inspectionItemRemove(ids);
+      await tableApi.query();
+    },
+  });
+}
+
+function handleDownloadExcel() {
+  commonDownloadExcel(inspectionItemExport, '巡检项目数据', tableApi.formApi.form.values, {
+    fieldMappingTime: formOptions.fieldMappingTime,
+  });
+}
+</script>
+
+<template>
+  <Page :auto-content-height="true">
+    <BasicTable table-title="巡检项目列表">
+      <template #toolbar-tools>
+        <Space>
+          <a-button
+            v-access:code="['property:inspectionItem:export']"
+            @click="handleDownloadExcel"
+          >
+            {{ $t('pages.common.export') }}
+          </a-button>
+          <a-button
+            :disabled="!vxeCheckboxChecked(tableApi)"
+            danger
+            type="primary"
+            v-access:code="['property:inspectionItem:remove']"
+            @click="handleMultiDelete">
+            {{ $t('pages.common.delete') }}
+          </a-button>
+          <a-button
+            type="primary"
+            v-access:code="['property:inspectionItem:add']"
+            @click="handleAdd"
+          >
+            {{ $t('pages.common.add') }}
+          </a-button>
+        </Space>
+      </template>
+      <template #action="{ row }">
+        <Space>
+          <ghost-button
+            v-access:code="['property:inspectionItem:edit']"
+            @click.stop="handleEdit(row)"
+          >
+            {{ $t('pages.common.edit') }}
+          </ghost-button>
+          <Popconfirm
+            :get-popup-container="getVxePopupContainer"
+            placement="left"
+            title="确认删除？"
+            @confirm="handleDelete(row)"
+          >
+            <ghost-button
+              danger
+              v-access:code="['property:inspectionItem:remove']"
+              @click.stop=""
+            >
+              {{ $t('pages.common.delete') }}
+            </ghost-button>
+          </Popconfirm>
+        </Space>
+      </template>
+    </BasicTable>
+    <InspectionItemModal @reload="tableApi.query()" />
+  </Page>
+</template>
--- a/apps/web-antd/src/views/property/inspectionManagement/inspectionItem/inspectionItem-modal.vue
+++ b/apps/web-antd/src/views/property/inspectionManagement/inspectionItem/inspectionItem-modal.vue
@@ -0,0 +1,101 @@
+<script setup lang="ts">
+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 { inspectionItemAdd, inspectionItemInfo, inspectionItemUpdate } from '#/api/property/inspectionManagement/inspectionItem';
+import { defaultFormValueGetter, useBeforeCloseDiff } from '#/utils/popup';
+
+import { modalSchema } from './data';
+
+const emit = defineEmits<{ reload: [] }>();
+
+const isUpdate = ref(false);
+const title = computed(() => {
+  return isUpdate.value ? $t('pages.common.edit') : $t('pages.common.add');
+});
+
+const [BasicForm, formApi] = useVbenForm({
+  commonConfig: {
+    // 默认占满两列
+    formItemClass: 'col-span-2',
+    // 默认label宽度 px
+    labelWidth: 80,
+    // 通用配置项 会影响到所有表单项
+    componentProps: {
+      class: 'w-full',
+    }
+  },
+  schema: modalSchema(),
+  showDefaultActions: false,
+  wrapperClass: 'grid-cols-2',
+});
+
+const { onBeforeClose, markInitialized, resetInitialized } = useBeforeCloseDiff(
+  {
+    initializedGetter: defaultFormValueGetter(formApi),
+    currentGetter: defaultFormValueGetter(formApi),
+  },
+);
+
+const [BasicModal, modalApi] = useVbenModal({
+  // 在这里更改宽度
+  class: 'w-[550px]',
+  fullscreenButton: false,
+  onBeforeClose,
+  onClosed: handleClosed,
+  onConfirm: handleConfirm,
+  onOpenChange: async (isOpen) => {
+    if (!isOpen) {
+      return null;
+    }
+    modalApi.modalLoading(true);
+
+    const { id } = modalApi.getData() as { id?: number | string };
+    isUpdate.value = !!id;
+
+    if (isUpdate.value && id) {
+      const record = await inspectionItemInfo(id);
+      await formApi.setValues(record);
+    }
+    await markInitialized();
+
+    modalApi.modalLoading(false);
+  },
+});
+
+async function handleConfirm() {
+  try {
+    modalApi.lock(true);
+    const { valid } = await formApi.validate();
+    if (!valid) {
+      return;
+    }
+    // getValues获取为一个readonly的对象 需要修改必须先深拷贝一次
+    const data = cloneDeep(await formApi.getValues());
+    await (isUpdate.value ? inspectionItemUpdate(data) : inspectionItemAdd(data));
+    resetInitialized();
+    emit('reload');
+    modalApi.close();
+  } catch (error) {
+    console.error(error);
+  } finally {
+    modalApi.lock(false);
+  }
+}
+
+async function handleClosed() {
+  await formApi.resetForm();
+  resetInitialized();
+}
+</script>
+
+<template>
+  <BasicModal :title="title">
+    <BasicForm />
+  </BasicModal>
+</template>
+
--- a/apps/web-antd/src/views/property/roomBooking/conferenceReservations/conferenceReservations-modal.vue
+++ b/apps/web-antd/src/views/property/roomBooking/conferenceReservations/conferenceReservations-modal.vue
@@ -153,14 +153,15 @@ async function queryUnitData() {
  formApi.updateSchema([{
    componentProps: () => ({
      options: options,
-      filterOption: filterOption
+      filterOption: filterOption,
+      showSearch:true,
    }),
    fieldName: 'unit',
  }])
 }

 const filterOption = (input: string, option: any) => {
-  return option.value.toLowerCase().indexOf(input.toLowerCase()) >= 0;
+  return option.label.toLowerCase().indexOf(input.toLowerCase()) >= 0;
 };

 async function changeProjectNum() {
--- a/apps/web-antd/src/views/property/roomBooking/conferenceSettings/conferenceSettings-modal.vue
+++ b/apps/web-antd/src/views/property/roomBooking/conferenceSettings/conferenceSettings-modal.vue
@@ -122,14 +122,15 @@ async function queryPerson() {
  formApi.updateSchema([{
    componentProps: () => ({
      options: options,
-      filterOption: filterOption
+      filterOption: filterOption,
+      showSearch:true,
    }),
    fieldName: 'principals',
  }])
 }

 const filterOption = (input: string, option: any) => {
-  return option.value.toLowerCase().indexOf(input.toLowerCase()) >= 0;
+  return option.label.toLowerCase().indexOf(input.toLowerCase()) >= 0;
 };

 /**
--- a/apps/web-antd/src/views/property/roomBooking/conferenceView/index.vue
+++ b/apps/web-antd/src/views/property/roomBooking/conferenceView/index.vue
@@ -4,17 +4,16 @@ import { Page } from '@vben/common-ui';
 import dayjs from 'dayjs';
 import type { TableColumnType } from 'ant-design-vue';
 import { Radio, Select, Button, Table } from 'ant-design-vue';
-import { conferenceList } from '#/api/property/conference';
-import { roomBookingList } from '#/api/property/roomBooking';
+import { getMeetName } from '#/api/property/roomBooking';
+import { getAppointmentListByDate,getAppointmentListBymeetId } from '#/api/property/roomBooking/conferenceView';
 import type { RadioChangeEvent } from 'ant-design-vue';
 import type { SelectValue } from 'ant-design-vue/es/select';

-// 首先定义会议室和预约信息的接口类型
+// 会议室和预约信息的接口类型
 interface ConferenceRoom {
  id: string;
  name: string;
 }
-
 interface ConferenceBooking {
  id: string | number;
  tbConferenceId: string | number; // 会议室ID
@@ -43,21 +42,22 @@ const selectedDate = ref<string>('');
 const weekDates = ref<string[]>([]);

 // 预约数据
-const bookings = ref<ConferenceBooking[]>([]);
+const bookings = ref<any[]>([]);
+// 新增：表格渲染用的结构
+const bookingTable = ref<Record<string, Record<string, any>>>({});
+// 新增：加载状态
+const loading = ref(false);

-// 时间段
-const timeSlots = [
-  '8:00', '8:30', '9:00', '9:30', '10:00', '10:30',
-  '11:00', '11:30', '12:00', '12:30', '13:00', '13:30',
-  '14:00', '14:30', '15:00', '15:30', '16:00', '16:30',
-  '17:00', '17:30'
-];
+// 时间段只显示"上午" "下午"
+const timeSlots = ['上午', '下午'];

 // 生成一周日期
 function generateWeekDates(): void {
  const today = dayjs();
+  // 获取本周的周一
+  const startOfWeek = today.startOf('week');
  const dates = Array.from({ length: 7 }, (_, i) => {
-    return today.add(i, 'day').format('YYYY-MM-DD');
+    return startOfWeek.add(i, 'day').format('YYYY-MM-DD');
  });
  weekDates.value = dates;
  selectedDate.value = dates[0] ?? '';
@@ -65,39 +65,84 @@ function generateWeekDates(): void {

 // 获取预约数据
 async function fetchBookings(): Promise<void> {
+  loading.value = true;
  try {
    if (viewMode.value === 'date') {
-      // 先获取会议室列表
-      const roomRes = await conferenceList();
-      console.log(roomRes);
-      
-      // roomList.value = roomRes.rows || [];
-      
-      // // 然后获取每个会议室的预约信息
-      // const bookingPromises = roomList.value.map(room => 
-      //   roomBookingList({
-      //     appointmentDate: selectedDate.value,
-      //     bookingStatus: 2,
-      //     reviewStatus: 1,
-      //     tbConferenceId: room.id
-      //   })
-      // );
-      
-      // const bookingResults = await Promise.all(bookingPromises);
-      // // 合并所有预约数据
-      // bookings.value = bookingResults.flatMap(res => res.rows || []);
-    } else {
-      // 按会议室视图时直接查询该会议室的预约
-      const res = await roomBookingList({
-        appointmentDate: selectedDate.value,
-        bookingStatus: 2,
-        reviewStatus: 1,
-        tbConferenceId: selectedRoom.value
+      const roomRes = await getMeetName();
+      roomList.value = ([roomRes]).map((item: any) => ({
+        id: item.value,
+        name: item.name
+      }));
+      const appointmentRes = await getAppointmentListByDate({
+        appointmentDate: selectedDate.value
      });
-      bookings.value = res.rows || [];
+      bookings.value = (appointmentRes || []).map((item: any) => ({
+        id: item.id,
+        meetId: item.meetId,
+        name: item.name,
+        person: item.person,
+        scheduledEndtime: item.scheduledEndtime,
+        scheduledStarttime: item.scheduledStarttime,
+        unit: item.unit,
+        personName: item.personName,
+        slots: item.slots,
+        unitName: item.unitName,
+        subject: item.subject,
+        deptName: item.unitName,
+        bookingName: item.personName,
+        startTime: item.scheduledStarttime,
+        endTime: item.scheduledEndtime,
+        bookingDate: item.scheduledStarttime,
+        tbConferenceId: item.meetId,
+        // 兼容后续渲染
+      }));
+      // 处理为表格结构
+      const table: Record<string, Record<string, any>> = { '上午': {}, '下午': {} };
+      roomList.value.forEach(room => {
+        ['上午', '下午'].forEach(slot => {
+          const booking = bookings.value.find(b => b.name === room.name && b.slots === slot);
+          table[slot][room.name] = booking || null;
+        });
+      });
+      bookingTable.value = table;
+    } else {
+      const res = await getAppointmentListBymeetId({
+        meetId: selectedRoom.value
+      });
+      bookings.value = (res || []).map((item: any) => ({
+        id: item.id,
+        meetId: item.meetId,
+        name: item.name,
+        person: item.person,
+        scheduledEndtime: item.scheduledEndtime,
+        scheduledStarttime: item.scheduledStarttime,
+        unit: item.unit,
+        personName: item.personName,
+        slots: item.slots,
+        unitName: item.unitName,
+        subject: item.subject,
+        deptName: item.unitName,
+        bookingName: item.personName,
+        startTime: item.scheduledStarttime,
+        endTime: item.scheduledEndtime,
+        bookingDate: item.scheduledStarttime,
+        tbConferenceId: item.meetId,
+      }));
+      const table: Record<string, Record<string, any>> = { '上午': {}, '下午': {} };
+      weekDates.value.forEach(date => {
+        ['上午', '下午'].forEach(slot => {
+          const booking = bookings.value.find(b => dayjs(b.scheduledStarttime).format('YYYY-MM-DD') === date && b.slots === slot);
+          table[slot][date] = booking || null;
+        });
+      });
+      bookingTable.value = table;
    }
+    console.log(bookingTable.value,'bookingTable.value');
+    
  } catch (error) {
    console.error('获取预约数据失败:', error);
+  } finally {
+    loading.value = false;
  }
 }

@@ -124,45 +169,63 @@ function handleRoomChange(value: SelectValue): void {
  fetchBookings();
 }

-// 获取单元格预约信息
+// 获取单元格预约信息（上午/下午）
 function getCellBooking(col: string, time: string): ConferenceBooking | undefined {
+  // 判断时间属于上午还是下午
+  function isMorning(startTime: string) {
+    const hour = dayjs(startTime).hour();
+    return hour < 12;
+  }
  if (viewMode.value === 'date') {
    const room = roomList.value.find(r => r.name === col);
-    return bookings.value.find(b => 
-      b.tbConferenceId === room?.id && 
-      dayjs(b.startTime).format('HH:mm') === time
+    return bookings.value.find(b =>
+      b.tbConferenceId === room?.id &&
+      ((time === '上午' && isMorning(b.startTime)) || (time === '下午' && !isMorning(b.startTime)))
    );
  } else {
-    return bookings.value.find(b => 
-      dayjs(b.bookingDate).format('YYYY-MM-DD') === col && 
-      dayjs(b.startTime).format('HH:mm') === time
+    return bookings.value.find(b =>
+      dayjs(b.bookingDate).format('YYYY-MM-DD') === col &&
+      ((time === '上午' && isMorning(b.startTime)) || (time === '下午' && !isMorning(b.startTime)))
    );
  }
 }

 // 修改渲染预约单元格的函数
 function renderBookingCell(booking: ConferenceBooking) {
-  return h('div', 
-    { 
-      class: 'booking-cell' 
-    }, 
+  return h('div',
+    {
+      class: 'booking-cell'
+    },
    [
-      h('span', 
-        { class: 'booking-user' }, 
+      h('span',
+        { class: 'booking-user' },
        `预约人：${booking.bookingName}`
      ),
-      h('span', 
-        { class: 'booking-dept' }, 
+      h('span',
+        { class: 'booking-dept' },
        `单位：${booking.deptName}`
      ),
-      h('span', 
-        { class: 'booking-subject' }, 
+      h('span',
+        { class: 'booking-subject' },
        `主题：${booking.subject}`
      )
    ]
  );
 }

+// 随机浅色背景色生成函数
+function getRandomBgColor() {
+  const r = Math.floor(200 + Math.random() * 55);
+  const g = Math.floor(200 + Math.random() * 55);
+  const b = Math.floor(200 + Math.random() * 55);
+  return {
+    background: `rgba(${r},${g},${b},0.5)`,
+    borderRadius: '6px',
+    padding: '60px 10px',
+    transition: 'background 0.3s'
+  };
+}
+
 // 表格列配置
 interface TableRecord {
  time: string;
@@ -170,43 +233,54 @@ interface TableRecord {
  [key: string]: any;
 }

+// 会议室列补全到7个
+function getFullRoomList() {
+  const rooms = roomList.value.slice();
+  const count = rooms.length;
+  if (viewMode.value === 'date' && count < 7) {
+    for (let i = count; i < 7; i++) {
+      rooms.push({ id: `empty_${i}`, name: '' });
+    }
+  }
+  return rooms;
+}
+
 const columns = computed<TableColumnType<TableRecord>[]>(() => {
  const baseColumns: TableColumnType<TableRecord>[] = [{
    title: '时间',
-    dataIndex: 'time',
+    dataIndex: 'slot',
+    key: 'slot',
    width: 100,
    fixed: 'left' as const
  }];
-
  const dynamicColumns: TableColumnType<TableRecord>[] = viewMode.value === 'date'
-    ? roomList.value.map(room => ({
-        title: room.name,
-        dataIndex: room.id,
+    ? getFullRoomList().map(room => ({
+        title: room.name || ' ',
+        dataIndex: room.name,
+        key: room.name,
        width: 200,
-        customRender: ({ record }) => {
-          const booking = getCellBooking(room.name, record.time);
-          return booking ? renderBookingCell(booking) : null;
-        }
      }))
    : weekDates.value.map(date => ({
-        title: dayjs(date).format('MM-DD'),
+        title: dayjs(date).format('YYYY-MM-DD'),
        dataIndex: date,
+        key: date,
        width: 200,
-        customRender: ({ record }) => {
-          const booking = getCellBooking(date, record.time);
-          return booking ? renderBookingCell(booking) : null;
-        }
      }));
-
  return [...baseColumns, ...dynamicColumns];
 });

-// 表格数据
 const tableData = computed<TableRecord[]>(() => {
-  return timeSlots.map(time => ({
-    time,
-    key: time,
-  }));
+  const slots = ['上午', '下午'];
+  return slots.map(slot => {
+    const row: any = { slot };
+    const cols = viewMode.value === 'date'
+      ? getFullRoomList().map(room => room.name)
+      : weekDates.value;
+    cols.forEach(col => {
+      row[col] = bookingTable.value[slot]?.[col] || null;
+    });
+    return row;
+  });
 });

 onMounted(() => {
@@ -224,8 +298,6 @@ onMounted(() => {
          <Radio.Button value="date">按日期</Radio.Button>
          <Radio.Button value="room">按会议室</Radio.Button>
        </Radio.Group>
-
-        <!-- 按会议室视图的下拉选择 -->
        <Select
          v-if="viewMode === 'room'"
          v-model:value="selectedRoom"
@@ -233,7 +305,7 @@ onMounted(() => {
          placeholder="请选择会议室"
          @change="handleRoomChange"
        >
-          <Select.Option 
+          <Select.Option
            v-for="room in roomList"
            :key="room.id"
            :value="room.id"
@@ -241,59 +313,68 @@ onMounted(() => {
            {{ room.name }}
          </Select.Option>
        </Select>
-
-        <!-- 按日期视图的日期选择 -->
-        <div v-if="viewMode === 'date'" class="date-buttons">
-          <Button
-            v-for="date in weekDates"
-            :key="date"
-            :type="date === selectedDate ? 'primary' : 'default'"
-            @click="handleDateChange(date)"
-          >
-            {{ dayjs(date).format('MM-DD') }}
-          </Button>
-        </div>
      </div>
-
-      <!-- 日程表格 -->
+      <div v-if="viewMode === 'date'" class="date-buttons">
+        <Button
+          v-for="date in weekDates"
+          :key="date"
+          :type="date === selectedDate ? 'primary' : 'default'"
+          @click="handleDateChange(date)"
+        >
+          {{ dayjs(date).format('YYYY-MM-DD') }}
+        </Button>
+      </div>
      <Table
        :columns="columns"
        :data-source="tableData"
        :pagination="false"
        bordered
        :scroll="{ x: 'max-content' }"
-      />
+        :loading="loading"
+        tableLayout="fixed"
+      >
+        <template #bodyCell="{ column, record }">
+          <template v-if="column.dataIndex !== 'slot'">
+            <div
+              v-if="record[column.dataIndex]"
+              :style="getRandomBgColor()"
+            >
+              <div>预约人：{{ record[column.dataIndex].personName }}</div>
+              <div>单位：{{ record[column.dataIndex].unitName }}</div>
+            </div>
+            <div v-else></div>
+          </template>
+        </template>
+      </Table>
    </div>
  </Page>
 </template>

 <style lang="scss" scoped>
 .conference-view {
-  padding: 16px;
-  
  .control-panel {
    margin-bottom: 16px;
    display: flex;
    align-items: center;
-    
    .room-select {
      width: 200px;
      margin-left: 16px;
    }
  }
-  
+
  .date-buttons {
    margin-top: 16px;
-    
+    display: flex;
+    justify-content: center;
    :deep(.ant-btn) {
      margin-right: 8px;
-      
+
      &:last-child {
        margin-right: 0;
      }
    }
  }
-  
+
  .booking-cell {
    background: #e6f7ff;
    padding: 8px;
@@ -302,29 +383,33 @@ onMounted(() => {
    display: flex;
    flex-direction: column;
    gap: 4px;
-    
    span {
      display: block;
      font-size: 12px;
      line-height: 1.5;
-      
+
      &.booking-user {
        color: #1890ff;
        font-weight: 500;
      }
-      
+
      &.booking-dept {
        color: #666;
      }
-      
+
      &.booking-subject {
        color: #333;
      }
    }
-    
+
    &:hover {
      background: #bae7ff;
    }
  }
+
+  :deep(.ant-table-tbody > tr > td:first-child) {
+  padding: 10px;
+  height: 200px;
+}
 }
 </style>