feat: 优化大屏

apps/web-antd/src/api/property/attendanceManagement/arrangement/index.ts

@@ -7,21 +7,20 @@ import { commonExport } from '#/api/helper';
 import { requestClient } from '#/api/request';
 
 /**
-* 查询排班列表
+* 分页查询排班列表
 * @param params
 * @returns 排班列表
 */
 export function arrangementList(params?: ArrangementQuery) {
   return requestClient.get<PageResult<ArrangementVO>>('/property/arrangement/list', { params });
 }
-
 /**
- * 导出排班列表
+ * 根据月份查询排班列表
  * @param params
  * @returns 排班列表
  */
-export function arrangementExport(params?: ArrangementQuery) {
-  return commonExport('/property/arrangement/export', params ?? {});
+export function arrangementCalender(params?: ArrangementQuery) {
+  return requestClient.get<any>('/property/arrangement/explore', { params });
 }
 
 /**

apps/web-antd/src/api/property/attendanceManagement/arrangement/model.d.ts

@@ -40,7 +40,6 @@ export interface ArrangementVO {
    * 状态：0-未生效，1-已生效
    */
   status: number;
-
 }
 
 export interface ArrangementForm extends BaseEntity {
@@ -83,7 +82,10 @@ export interface ArrangementForm extends BaseEntity {
    * 状态：0-未生效，1-已生效
    */
   status?: number;
-
+  /**
+   * 排班人员详情
+   */
+  userGroupList: any[];
 }
 
 export interface ArrangementQuery extends PageQuery {
@@ -123,7 +125,12 @@ export interface ArrangementQuery extends PageQuery {
   status?: number;
 
   /**
-    * 日期范围参数
-    */
+   * 日期范围参数
+   */
   params?: any;
+
+  /**
+   * 月份
+   */
+  month?: string;
 }

apps/web-antd/src/views/property/attendanceManagement/workforceManagement/arrangement-modal.vue

@@ -34,12 +34,47 @@ const isUpdate = ref(false);
 const title = computed(() => {
   return isUpdate.value ? $t('pages.common.edit') : $t('pages.common.add');
 });
+//表单项
+let formModel = reactive<{
+  id: string;
+  groupId: string;
+  attendanceType: string;
+  dateType: number | undefined;
+  startDate: string;
+  endDate: string;
+  userGroupList: any[];
+}>({
+  id: '',
+  groupId: '',
+  attendanceType: '', //考勤组类型
+  dateType: undefined, //日期类型：1-单个日期，2-长期有效，3-期间有效
+  // dateSingle: null,
+  // dateLong: null,
+  // dateRange: [null, null],
+  startDate: '', //开始日期
+  endDate: '', //结束日期
+  userGroupList: [
+    // scheduleId:undefined,//排班ID
+    // employeeId:undefined,//员工ID
+    // employeeName:undefined,//员工姓名
+    // deptId:undefined,//部门ID
+    // deptName:undefined,//部门名称
+  ], //考勤组人员列表
+});
+const formRef = ref();
+let singleDate = ref(''); //排班日期单个日期
+let longDate = ref(''); //排班日期从此日起长期有效
+let rangeDate = ref(['', '']); //排班日期在此期间有效
+const rules = {
+  groupId: [{ required: true, message: '请选择考勤组' }],
+  attendanceType: [{ required: true }],
+  dateType: [{ required: true, message: '请选择排班日期' }],
+};
 const groupOptions = ref<any[]>([]);
 const groupMap = ref<Record<string, any>>({}); // 用于快速查找
-const tableData = reactive<
+let tableData = reactive<
   { dept: { unitId: string | number; unitName: string }; users: PersonVO[] }[]
->([]);
-
+>([]); //存放考勤组人员列表数据
 const columns = [
   {
     title: '序号',
@@ -108,44 +143,44 @@ function handleRemoveRow(index: number) {
 }
 
 function handleTableData(newTableData: any) {
-  tableData.splice(0, tableData.length, ...newTableData);
+  // 如果现有数据为空，直接替换
+  if (tableData.length === 0) {
+    tableData.splice(0, 0, ...newTableData);
+    return;
+  }
+
+  // 如果新数据为空，不做处理
+  if (newTableData.length === 0) {
+    return;
+  }
+
+  // 处理有数据的情况
+  for (const newItem of newTableData) {
+    // 查找是否已存在相同部门
+    const existingDeptIndex = tableData.findIndex(
+      (item) => item.dept.unitId === newItem.dept.unitId,
+    );
+
+    if (existingDeptIndex !== -1) {
+      // 找到相同部门，检查人员是否有重复
+      const existingDept = tableData[existingDeptIndex];
+      for (const newUser of newItem.users) {
+        // 检查该用户是否已存在
+        const userExists = existingDept?.users.some(
+          (existingUser) => existingUser.id === newUser.id,
+        );
+        if (!userExists) {
+          // 用户不存在，添加到现有部门
+          existingDept?.users.push(newUser);
+        }
+      }
+    } else {
+      // 部门不存在，直接添加新部门
+      tableData.push(newItem);
+    }
+  }
 }
-//表单项
-const formModel = reactive<{
-  id: string;
-  groupId: string;
-  attendanceType: string;
-  dateType: number | undefined;
-  startDate: string;
-  endDate: string;
-  userGroupList: any[];
-}>({
-  id: '',
-  groupId: '',
-  attendanceType: '', //考勤组类型
-  dateType: undefined, //日期类型：1-单个日期，2-长期有效，3-期间有效
-  // dateSingle: null,
-  // dateLong: null,
-  // dateRange: [null, null],
-  startDate: '', //开始日期
-  endDate: '', //结束日期
-  userGroupList: [
-    // scheduleId:undefined,//排班ID
-    // employeeId:undefined,//员工ID
-    // employeeName:undefined,//员工姓名
-    // deptId:undefined,//部门ID
-    // deptName:undefined,//部门名称
-  ], //考勤组人员列表
-});
-const singleDate = ref('');
-const longDate = ref('');
-const rangeDate = ref(['', '']);
-const formRef = ref();
-const rules = {
-  groupId: [{ required: true, message: '请选择考勤组' }],
-  attendanceType: [{ required: true }],
-  dateType: [{ required: true, message: '请选择排班日期' }],
-};
+
 const [BasicForm, formApi] = useVbenForm({
   commonConfig: {
     // 默认占满两列
@@ -173,7 +208,7 @@ const [UnitPersonModal, unitPersonmodalApi] = useVbenModal({
 });
 const [BasicModal, modalApi] = useVbenModal({
   // 在这里更改宽度
-  class: 'w-[70%]',
+  class: 'w-[85%]',
   fullscreenButton: false,
   onBeforeClose,
   onClosed: handleClosed,
@@ -183,7 +218,6 @@ const [BasicModal, modalApi] = useVbenModal({
       return null;
     }
     await getGroupList();
-    console.log(getDictOptions('wy_kqlx'));
     modalApi.modalLoading(true);
     const { id } = modalApi.getData() as { id?: number | string };
     isUpdate.value = !!id;
@@ -220,7 +254,6 @@ async function getGroupList() {
   });
 }
 function chooseGroup(value: any) {
-  console.log(value);
   const group = groupMap.value[value];
   if (group) {
     formModel.attendanceType = String(group.attendanceType);
@@ -232,12 +265,10 @@ async function handleDateTypeChange(value: any) {
 async function handleConfirm() {
   try {
     modalApi.lock(true);
-    // await formRef.value.validate(); // 先校验
+    await formRef.value.validate(); // 先校验
     const data = formModel;
     const { id } = modalApi.getData() as { id?: string };
     data.id = id ? id : '';
-    console.log(data);
-
     if (data.dateType == 1) {
       if (singleDate.value) {
         data.startDate = dayjs(singleDate.value).format('YYYY-MM-DD');
@@ -264,10 +295,36 @@ async function handleConfirm() {
         data.endDate = dayjs(rangeDate.value[1]).format('YYYY-MM-DD');
       }
     }
-    // await (isUpdate.value ? arrangementUpdate(data) : arrangementAdd(data));
+    for (const item of tableData) {
+      for (const user of item.users) {
+        data.userGroupList.push({
+          deptId: item.dept.unitId, //部门ID
+          deptName: item.dept.unitName, //部门名称
+          employeeId: user.id, //员工ID
+          employeeName: user.userName, //员工姓名
+        });
+      }
+    }
+    await (isUpdate.value ? arrangementUpdate(data) : arrangementAdd(data));
     resetInitialized();
     emit('reload');
+    // 重置表单数据
+    Object.assign(formModel, {
+      id: '',
+      groupId: '',
+      attendanceType: '',
+      dateType: undefined,
+      startDate: '',
+      endDate: '',
+      userGroupList: [],
+    });
+    // 重置其他数据
+    tableData.length = 0;
+    singleDate.value = '';
+    longDate.value = '';
+    rangeDate.value = ['', ''];
     modalApi.close();
+    await formApi.resetForm();
   } catch (error) {
     console.error(error);
   } finally {
@@ -276,8 +333,27 @@ async function handleConfirm() {
 }
 
 async function handleClosed() {
+  // 重置表单数据
+  Object.assign(formModel, {
+    id: '',
+    groupId: '',
+    attendanceType: '',
+    dateType: undefined,
+    startDate: '',
+    endDate: '',
+    userGroupList: [],
+  });
+
+  // 重置其他数据
+  tableData.length = 0;
+  singleDate.value = '';
+  longDate.value = '';
+  rangeDate.value = ['', ''];
+
+  // 重置表单状态
   await formApi.resetForm();
   resetInitialized();
+  modalApi.close();
 }
 onMounted(() => {});
 </script>

apps/web-antd/src/views/property/attendanceManagement/workforceManagement/calendarView.vue

@@ -1,11 +1,13 @@
 <script lang="ts" setup>
-import { Radio, Button, Calendar, DatePicker } from 'ant-design-vue';
+import { Radio, Button, Calendar, DatePicker, message } from 'ant-design-vue';
 import type { RadioChangeEvent, BadgeProps } from 'ant-design-vue';
-import { ref } from 'vue';
+import { ref, onMounted, reactive } from 'vue';
 import { Dayjs } from 'dayjs';
+import dayjs from 'dayjs';
 import arrangementModal from './arrangement-modal.vue';
 import { useVbenModal } from '@vben/common-ui';
-import type { PersonVO } from './type';
+import { arrangementCalender } from '#/api/property/attendanceManagement/arrangement'; // 导入接口
+
 const emit = defineEmits<{
   (e: 'changeView', value: boolean): void;
 }>();
@@ -13,6 +15,57 @@ const props = defineProps<{
   viewMode: 'calender' | 'schedule';
 }>();
 const selectedDate = ref();
+const calendarData = reactive<any[]>([]);
+const loading = ref(false);
+// 查询日历数据
+const fetchCalendarData = async (month?: string) => {
+  try {
+    loading.value = true;
+    const params = {
+      month:
+        month ||
+        selectedDate.value?.format('YYYY-MM') ||
+        dayjs().format('YYYY-MM'),
+    };
+    const res = await arrangementCalender(params);
+    const currentMonth =
+      month ||
+      selectedDate.value?.format('YYYY-MM') ||
+      dayjs().format('YYYY-MM'); //当前月份的开始日期
+    // 生成日历渲染数据结构
+    for (const row of res.rows) {
+      if (row.endDate) {
+        //当开始时间小于当前月份的开始日期
+        if (row.startDate <= currentMonth) {
+          console.log(row, '小');
+
+          //如果结束时间小于当前月份的结束时间，则生成当前月份开始时间到row.endDate结束时间的n条数据
+          //如果结束时间大于等于当前月份的结束时间，则生成当前月份开始时间到当前月份结束时间（即当前月份天数）的n条数据
+        } else {
+          //当开始时间大于当前月份的开始日期
+          //如果结束时间小于当前月份的结束时间，则生成开始时间到结束时间的n条数据
+          console.log(row, '大');
+        }
+      } else {
+        calendarData.push({
+          data: row.startDate,
+          item: {
+            id: row.id,
+            groupName: row.attendanceGroup.groupName,
+            groupId: row.attendanceGroup.id,
+          },
+        });
+      }
+    }
+    // if (response) {
+    //   calendarData.value = response.data || [];
+    //   console.log('日历数据:', calendarData.value);
+    // }
+  } finally {
+    loading.value = false;
+  }
+};
+
 // 切换视图模式
 function handleViewModeChange(e: RadioChangeEvent): void {
   // 将父组件的isCalenderView变为true
@@ -28,13 +81,22 @@ const scheduleData: {
   { date: '2025-07-06', list: [{ type: 'success', content: '8月8日事件' }] },
   // ...
 ];
+
 const getListData2 = (
   current: Dayjs,
 ): { type: BadgeProps['status']; content: string }[] => {
   const dateStr = current.format('YYYY-MM-DD');
-  const found = scheduleData.find((item) => item.date === dateStr);
-  return found ? found.list : [];
+  // 优先使用接口数据
+  if (calendarData.length > 0) {
+    const found = calendarData.find((item) => item.date === dateStr);
+    if (found) {
+      return found.list || [];
+    }
+  }
+  // 如果没有找到数据，返回空数组
+  return [];
 };
+
 const getListData = (
   value: Dayjs,
 ): { type: BadgeProps['status']; content: string }[] => {
@@ -84,6 +146,11 @@ function handleAdd() {
   modalApi.setData({});
   modalApi.open();
 }
+
+// 页面初始化时加载数据
+onMounted(() => {
+  fetchCalendarData();
+});
 </script>
 <template>
   <div class="flex h-full flex-col">
@@ -98,7 +165,11 @@ function handleAdd() {
         </Radio.Group>
         <div class="my-auto flex gap-1">
           <div class="my-auto">排班日历</div>
-          <DatePicker picker="month" v-model:value="selectedDate" />
+          <DatePicker
+            picker="month"
+            v-model:value="selectedDate"
+            @change="fetchCalendarData()"
+          />
         </div>
       </div>
       <div>
@@ -110,6 +181,7 @@ function handleAdd() {
         v-model:value="selectedDate"
         :mode="'month'"
         :headerRender="customHeader"
+        :loading="loading"
       >
         <template #dateCellRender="{ current }">
           <ul class="events">
@@ -140,7 +212,7 @@ function handleAdd() {
         </template>
       </Calendar>
     </div>
-    <ArrangementModal @reload="" />
+    <ArrangementModal @reload="fetchCalendarData()" />
   </div>
 </template>
 <style scoped>

apps/web-antd/src/views/property/attendanceManagement/workforceManagement/unit-person-modal.vue

@@ -62,10 +62,10 @@ const deptTree = reactive<
 ]);
 
 //勾选内容
-const selectedUsers = ref<PersonVO[]>([]);
+let selectedUsers = ref<PersonVO[]>([]);
 //已选内容，需要展示到父组件
 
-const tableData = reactive<
+let tableData = reactive<
   {
     dept: { unitId: string | number; unitName: string };
     users: PersonVO[];
@@ -236,6 +236,8 @@ async function handleConfirm() {
     console.log(tableData);
     resetInitialized();
     emit('reload', tableData);
+    tableData = [];
+    selectedUsers.value =[];
     modalApi.close();
   } catch (error) {
     console.error(error);

apps/web-antd/src/views/property/clean/cleanOrders/clean-modal.vue

@@ -23,8 +23,10 @@ import { resident_unitList } from '#/api/property/resident/unit';
 import { defaultFormValueGetter, useBeforeCloseDiff } from '#/utils/popup';
 
 import cleanDetailModal from './clean-detail-modal.vue';
-import { modalSchema } from './data';
+// import { modalSchema } from './data';
 import { communityTree } from '#/api/property/community';
+import { getDictOptions } from '#/utils/dict';
+
 const emit = defineEmits<{ reload: [] }>();
 
 // 计算合计费用
@@ -59,7 +61,142 @@ let unitListData: { id: any; name: string }[] = [];
 const editUnitId = ref('');
 const editCleanOrderId = ref('');
 const detailModal = ref(null);
-
+const modalSchema = [
+  {
+    label: '主键id',
+    fieldName: 'id',
+    component: 'Input',
+    dependencies: {
+      show: () => false,
+      triggerFields: [''],
+    },
+  },
+  {
+    label: '服务地址（房间号）',
+    component: 'TreeSelect',
+    defaultValue: undefined,
+    fieldName: 'location',
+    rules: 'required',
+  },
+  {
+    label: '开始时间',
+    fieldName: 'starTime',
+    component: 'DatePicker',
+    componentProps: {
+      showTime: true,
+      format: 'YYYY-MM-DD HH:mm:ss',
+      placeholder: '请选择开始时间',
+    },
+    rules: 'required',
+  },
+  {
+    label: '结束时间',
+    fieldName: 'endTime',
+    component: 'DatePicker',
+    componentProps: (values: any) => ({
+      showTime: true,
+      format: 'YYYY-MM-DD HH:mm:ss',
+      placeholder: !values.starTime
+        ? '请先选择开始时间'
+        : `请选择结束时间（结束时间不能早于开始时间）`,
+      disabled: isReadonly.value || !values.starTime, // 没选开始时间时禁用
+      disabledDate: (current: any) => {
+        if (!values.starTime) return false;
+        // 只允许选择大于等于开始时间的日期
+        return current && current < dayjs(values.starTime).startOf('second');
+      },
+    }),
+    rules: 'required',
+    dependencies: {
+      triggerFields: ['starTime'],
+    },
+  },
+  {
+    label: '申请人',
+    fieldName: 'persion',
+    component: 'Input',
+    rules: 'required',
+  },
+  {
+    label: '联系电话',
+    fieldName: 'phone',
+    component: 'Input',
+    rules: 'required',
+  },
+  {
+    label: '申请单位',
+    fieldName: 'unitId',
+    component: 'ApiSelect',
+    componentProps: {
+      api: resident_unitList,
+      resultField: 'rows',
+      labelField: 'name',
+      valueField: 'id',
+      placeholder: '请选择单位',
+    },
+    rules: 'required',
+  },
+  {
+    label: '支付状态',
+    fieldName: 'payState',
+    component: 'Select',
+    componentProps: {
+      options: [
+        {
+          label: '待支付',
+          value: 0,
+        },
+        {
+          label: '已支付',
+          value: 1,
+        },
+      ],
+    },
+    rules: 'required',
+  },
+  {
+    label: '保洁类型',
+    fieldName: 'type',
+    component: 'Select',
+    componentProps: {
+      options: getDictOptions('pro_cleaning_type'),
+    },
+    rules: 'selectRequired',
+  },
+  {
+    label: '评价',
+    fieldName: 'serviceEvalua',
+    component: 'Rate',
+    componentProps: {
+      allowHalf: false,
+      count: 5,
+      tooltips: ['1星', '2星', '3星', '4星', '5星'],
+      defaultValue: 0,
+    },
+    dependencies: {
+      show: () => (isReadonly.value ? true : false),
+      triggerFields: [''],
+    },
+  },
+  {
+    label: '评价文本',
+    fieldName: 'serviceEvaluaText',
+    component: 'Input',
+    dependencies: {
+      show: () => (isReadonly.value ? true : false),
+      triggerFields: [''],
+    },
+  },
+  {
+    label: '联系电话',
+    fieldName: 'imgUrl',
+    component: 'Input',
+    dependencies: {
+      show: () => (isReadonly.value ? true : false),
+      triggerFields: [''],
+    },
+  },
+];
 const [BasicForm, formApi] = useVbenForm({
   commonConfig: {
     // 默认占满两列
@@ -71,7 +208,6 @@ const [BasicForm, formApi] = useVbenForm({
       class: 'w-full',
       disabled: isReadonly.value,
     })),
-    schema: modalSchema(isReadonly.value),
   },
   // 1. 使用正确的属性名 handleValuesChange
   handleValuesChange: async (values, fieldsChanged) => {
@@ -103,7 +239,10 @@ const [BasicForm, formApi] = useVbenForm({
       }
     }
   },
-  schema: modalSchema(),
+  // schema: computed(() => {
+  //   modalSchema(isReadonly.value);
+  // }),
+  schema: modalSchema,
   showDefaultActions: false,
   wrapperClass: 'grid-cols-2',
 });
@@ -126,6 +265,8 @@ const [BasicModal, modalApi] = useVbenModal({
     if (!isOpen) {
       return null;
     }
+    console.log(isReadonly.value);
+
     // 查询服务地址树形结构
     setupCommunitySelect();
     modalApi.modalLoading(true);
@@ -372,6 +513,8 @@ async function handleClosed() {
 // 获取服务地址
 async function setupCommunitySelect() {
   const areaList = await communityTree(4);
+  console.log(areaList);
+
   // 选中后显示在输入框的值 即父节点 / 子节点
   // addFullName(areaList, 'areaName', ' / ');
   const splitStr = '/';

apps/web-antd/src/views/property/clean/cleanOrders/data.ts

@@ -5,10 +5,10 @@ import { resident_unitList } from '#/api/property/resident/unit';
 import { useCleanStore } from '#/store';
 import type { FormSchema } from '../../../../../../../packages/@core/ui-kit/form-ui/src/types';
 import dayjs from 'dayjs';
-import {h} from "vue";
-import {Rate} from "ant-design-vue";
-import {getDictOptions} from "#/utils/dict";
-import {renderDict} from "#/utils/render";
+import { h } from 'vue';
+import { Rate } from 'ant-design-vue';
+import { getDictOptions } from '#/utils/dict';
+import { renderDict } from '#/utils/render';
 const cleanStore = useCleanStore();
 
 export const querySchema: (areaList: any[]) => FormSchema[] = (areaList) => [
@@ -120,7 +120,7 @@ export const columns: VxeGridProps['columns'] = [
     field: 'type',
     width: 180,
     slots: {
-      default: ({row}) => {
+      default: ({ row }) => {
         return renderDict(row.type, 'pro_cleaning_type');
       },
     },
@@ -130,7 +130,7 @@ export const columns: VxeGridProps['columns'] = [
     field: 'serviceEvalua',
     width: 180,
     slots: {
-      default: ({row}) => {
+      default: ({ row }) => {
         return h(Rate, {
           value: row.serviceEvalua || 0,
           disabled: true,
@@ -153,12 +153,13 @@ export const columns: VxeGridProps['columns'] = [
     fixed: 'right',
     slots: { default: 'action' },
     title: '操作',
-    width:'200'
+    width: '200',
   },
-
 ];
 
-export const modalSchema: (isReadonly: boolean) => FormSchema[] = (isReadonly) => [
+export const modalSchema: (isReadonly: boolean) => FormSchema[] = (
+  isReadonly,
+) => [
   {
     label: '主键id',
     fieldName: 'id',
@@ -193,9 +194,11 @@ export const modalSchema: (isReadonly: boolean) => FormSchema[] = (isReadonly) =
     componentProps: (values) => ({
       showTime: true,
       format: 'YYYY-MM-DD HH:mm:ss',
-      placeholder: !values.starTime?'请先选择开始时间':`请选择结束时间（结束时间不能早于开始时间）`,
+      placeholder: !values.starTime
+        ? '请先选择开始时间'
+        : `请选择结束时间（结束时间不能早于开始时间）`,
       disabled: isReadonly || !values.starTime, // 没选开始时间时禁用
-      disabledDate: (current:any) => {
+      disabledDate: (current: any) => {
         if (!values.starTime) return false;
         // 只允许选择大于等于开始时间的日期
         return current && current < dayjs(values.starTime).startOf('second');
@@ -266,8 +269,29 @@ export const modalSchema: (isReadonly: boolean) => FormSchema[] = (isReadonly) =
       allowHalf: false,
       count: 5,
       tooltips: ['1星', '2星', '3星', '4星', '5星'],
-      defaultValue: 0
+      defaultValue: 0,
+    },
+    dependencies: {
+      show: () => (isReadonly ? true : false),
+      triggerFields: [''],
+    },
+  },
+  {
+    label: '评价文本',
+    fieldName: 'serviceEvaluaText',
+    component: 'Input',
+    dependencies: {
+      show: () => (isReadonly ? true : false),
+      triggerFields: [''],
+    },
+  },
+  {
+    label: '联系电话',
+    fieldName: 'imgUrl',
+    component: 'Input',
+    dependencies: {
+      show: () => (isReadonly ? true : false),
+      triggerFields: [''],
     },
-    rules: 'required',
   },
 ];

apps/web-antd/src/views/property/clean/cleanOrders/index.vue

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

apps/web-antd/src/views/property/costManagement/carCharge/carCharge-add.vue

@@ -7,7 +7,7 @@ import { carChargeAdd } from '#/api/property/carCharge';
 import { defaultFormValueGetter, useBeforeCloseDiff } from '#/utils/popup';
 import { addModalSchema } from './data';
 import { communityTree } from '#/api/property/community';
-import { cloneDeep,handleNode,getPopupContainer } from '@vben/utils';
+import { cloneDeep, handleNode, getPopupContainer } from '@vben/utils';
 
 const emit = defineEmits<{ reload: [] }>();
 
@@ -41,11 +41,11 @@ const [BasicModal, modalApi] = useVbenModal({
   onConfirm: handleConfirm,
   onOpenChange: async (isOpen) => {
     if (!isOpen) return null;
-    setupCommunitySelect()
+    setupCommunitySelect();
     modalApi.modalLoading(true);
     await formApi.resetForm();
     await markInitialized();
-    await formApi.setValues({costType:'2'});
+    await formApi.setValues({ costType: '2' });
     modalApi.modalLoading(false);
   },
 });
@@ -72,12 +72,12 @@ async function handleClosed() {
   resetInitialized();
 }
 async function setupCommunitySelect() {
-  const areaList = await communityTree(4);
+  const areaList = await communityTree(3);
   // 选中后显示在输入框的值 即父节点 / 子节点
   // addFullName(areaList, 'areaName', ' / ');
   const splitStr = '/';
   handleNode(areaList, 'label', splitStr, function (node: any) {
-    if (node.level != 4) {
+    if (node.level != 3) {
       node.disabled = true;
     }
   });
@@ -112,7 +112,7 @@ async function setupCommunitySelect() {
   <BasicModal :title="title">
     <BasicForm />
   </BasicModal>
-</template> 
+</template>
 
 <style scoped>
 /* 使用 :deep() 穿透 scoped 样式，影响子组件 */
@@ -126,4 +126,4 @@ async function setupCommunitySelect() {
   /* 有些浏览器需要这个来覆盖默认颜色 */
   -webkit-text-fill-color: rgb(0 0 0 / 65%) !important;
 }
-</style>
+</style>

apps/web-antd/src/views/property/costManagement/costMeterWater/costMeterWater-modal.vue

@@ -111,7 +111,6 @@ const schema = [
           itemId: '',
           meterTypeId: '',
         });
-        console.log(await formApi.getValues());
       },
     },
   },
@@ -216,8 +215,6 @@ const [BasicModal, modalApi] = useVbenModal({
     isUpdate.value = !!id;
     if (isUpdate.value && id) {
       const record = await costMeterWaterInfo(id);
-      console.log(1, record);
-
       const costItemsRes = await costItemSettingList({
         pageSize: 1000000000,
         pageNum: 1,
@@ -253,7 +250,6 @@ const [BasicModal, modalApi] = useVbenModal({
         },
       ]);
       await formApi.setValues(record);
-      console.log(2, await formApi.getValues());
     }
     await markInitialized();
 
@@ -270,8 +266,6 @@ async function handleConfirm() {
     }
     // getValues获取为一个readonly的对象 需要修改必须先深拷贝一次
     const data = cloneDeep(await formApi.getValues());
-    console.log(data);
-
     await (isUpdate.value
       ? costMeterWaterUpdate(data)
       : costMeterWaterAdd(data));

apps/web-antd/src/views/property/personalCenter/leaveApplication/data.ts

@@ -4,146 +4,6 @@ import type { VxeGridProps } from '#/adapter/vxe-table';
 import { getDictOptions } from '#/utils/dict';
 import { renderDict } from '#/utils/render';
 
-export const querySchema: FormSchemaGetter = () => [
-  {
-    component: 'Input',
-    fieldName: 'userId',
-    label: '用户ID，关联用户表',
-  },
-  {
-    component: 'Input',
-    fieldName: 'username',
-    label: '申请人姓名',
-  },
-  {
-    component: 'Input',
-    fieldName: 'departmentId',
-    label: '部门ID，关联部门表',
-  },
-  {
-    component: 'Input',
-    fieldName: 'departmentName',
-    label: '部门名称',
-  },
-  {
-    component: 'Select',
-    componentProps: {
-    },
-    fieldName: 'leaveType',
-    label: '请假类型',
-  },
-  {
-    component: 'DatePicker',
-    componentProps: {
-      showTime: true,
-      format: 'YYYY-MM-DD HH:mm:ss',
-      valueFormat: 'YYYY-MM-DD HH:mm:ss',
-    },
-    fieldName: 'startTime',
-    label: '开始时间',
-  },
-  {
-    component: 'DatePicker',
-    componentProps: {
-      showTime: true,
-      format: 'YYYY-MM-DD HH:mm:ss',
-      valueFormat: 'YYYY-MM-DD HH:mm:ss',
-    },
-    fieldName: 'endTime',
-    label: '结束时间',
-  },
-  {
-    component: 'Input',
-    fieldName: 'totalDuration',
-    label: '合计时间，如3天5个小时',
-  },
-  {
-    component: 'Textarea',
-    fieldName: 'reason',
-    label: '请假事由',
-  },
-  {
-    component: 'Select',
-    componentProps: {
-      // 可选从DictEnum中获取 DictEnum.WY_SQZT 便于维护
-      options: getDictOptions('wy_sqzt'),
-    },
-    fieldName: 'status',
-    label: '申请状态',
-  },
-  {
-    component: 'Input',
-    fieldName: 'searchValue',
-    label: '搜索值',
-  },
-];
-
-// 需要使用i18n注意这里要改成getter形式 否则切换语言不会刷新
-// export const columns: () => VxeGridProps['columns'] = () => [
-export const columns: VxeGridProps['columns'] = [
-  { type: 'checkbox', width: 60 },
-  {
-    title: '',
-    field: 'id',
-  },
-  {
-    title: '用户ID，关联用户表',
-    field: 'userId',
-  },
-  {
-    title: '申请人姓名',
-    field: 'username',
-  },
-  {
-    title: '部门ID，关联部门表',
-    field: 'departmentId',
-  },
-  {
-    title: '部门名称',
-    field: 'departmentName',
-  },
-  {
-    title: '请假类型',
-    field: 'leaveType',
-  },
-  {
-    title: '开始时间',
-    field: 'startTime',
-  },
-  {
-    title: '结束时间',
-    field: 'endTime',
-  },
-  {
-    title: '合计时间，如3天5个小时',
-    field: 'totalDuration',
-  },
-  {
-    title: '请假事由',
-    field: 'reason',
-  },
-  {
-    title: '申请状态',
-    field: 'status',
-    slots: {
-      default: ({ row }) => {
-        // 可选从DictEnum中获取 DictEnum.WY_SQZT 便于维护
-        return renderDict(row.status, 'wy_sqzt');
-      },
-    },
-  },
-  {
-    title: '搜索值',
-    field: 'searchValue',
-  },
-  {
-    field: 'action',
-    fixed: 'right',
-    slots: { default: 'action' },
-    title: '操作',
-    width: 180,
-  },
-];
 
 export const modalSchema: FormSchemaGetter = () => [
   {
@@ -156,24 +16,16 @@ export const modalSchema: FormSchemaGetter = () => [
     },
   },
   {
-    label: '用户ID，关联用户表',
-    fieldName: 'userId',
-    component: 'Input',
-  },
-  {
-    label: '申请人姓名',
+    label: '姓名',
     fieldName: 'username',
     component: 'Input',
+    rules:'required'
   },
   {
-    label: '部门ID，关联部门表',
+    label: '部门',
     fieldName: 'departmentId',
-    component: 'Input',
-  },
-  {
-    label: '部门名称',
-    fieldName: 'departmentName',
-    component: 'Input',
+    component: 'ApiSelect',
+    rules:'required'
   },
   {
     label: '请假类型',
@@ -181,6 +33,7 @@ export const modalSchema: FormSchemaGetter = () => [
     component: 'Select',
     componentProps: {
     },
+    rules:'required'
   },
   {
     label: '开始时间',
@@ -191,6 +44,8 @@ export const modalSchema: FormSchemaGetter = () => [
       format: 'YYYY-MM-DD HH:mm:ss',
       valueFormat: 'YYYY-MM-DD HH:mm:ss',
     },
+    rules:'required'
+
   },
   {
     label: '结束时间',
@@ -201,29 +56,19 @@ export const modalSchema: FormSchemaGetter = () => [
       format: 'YYYY-MM-DD HH:mm:ss',
       valueFormat: 'YYYY-MM-DD HH:mm:ss',
     },
+    rules:'required'
   },
   {
-    label: '合计时间，如3天5个小时',
+    label: '合计时间',
     fieldName: 'totalDuration',
     component: 'Input',
+    disabled:true,
+    rules:'required'
   },
   {
     label: '请假事由',
     fieldName: 'reason',
     component: 'Textarea',
-  },
-  {
-    label: '申请状态',
-    fieldName: 'status',
-    component: 'Select',
-    componentProps: {
-      // 可选从DictEnum中获取 DictEnum.WY_SQZT 便于维护
-      options: getDictOptions('wy_sqzt'),
-    },
-  },
-  {
-    label: '搜索值',
-    fieldName: 'searchValue',
-    component: 'Input',
-  },
+    rules:'required'
+  }
 ];

apps/web-antd/src/views/property/personalCenter/leaveApplication/index.vue

@@ -1,188 +1,39 @@
 <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 {
   leaveApplicationExport,
   leaveApplicationList,
   leaveApplicationRemove,
 } from '#/api/property/personalCenter/leaveApplication';
 import type { LeaveApplicationForm } from '#/api/property/personalCenter/leaveApplication/model';
-import { commonDownloadExcel } from '#/utils/file/download';
 
-import leaveApplicationModal from './leaveApplication-modal.vue';
-import { columns, querySchema } from './data';
+import { useVbenForm } from '#/adapter/form';
+import {  useVbenModal} from '@vben/common-ui';
+import {modalSchema} from "./data";
+import { useVModel } from '@vueuse/core';
 
-const formOptions: VbenFormProps = {
+const [BasicForm, formApi] = useVbenForm({
   commonConfig: {
-    labelWidth: 80,
+    formItemClass: 'col-span-1',
+    // 默认label宽度 px
+    labelWidth: 160,
+    // 通用配置项 会影响到所有表单项
     componentProps: {
-      allowClear: true,
+      class: 'w-full',
     },
   },
-  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 leaveApplicationList({
-          pageNum: page.currentPage,
-          pageSize: page.pageSize,
-          ...formValues,
-        });
-      },
-    },
-  },
-  rowConfig: {
-    keyField: 'id',
-  },
-  // 表格全局唯一表示 保存列配置需要用到
-  id: 'property-leaveApplication-index',
-};
-
-const [BasicTable, tableApi] = useVbenVxeGrid({
-  formOptions,
-  gridOptions,
+  schema: modalSchema(),
+  showDefaultActions: false,
+  wrapperClass: 'grid-cols-2 gap-x-10 gap-y-2',
 });
-
-const [LeaveApplicationModal, modalApi] = useVbenModal({
-  connectedComponent: leaveApplicationModal,
-});
-
-function handleAdd() {
-  modalApi.setData({});
-  modalApi.open();
-}
-
-async function handleEdit(row: Required<LeaveApplicationForm>) {
-  modalApi.setData({ id: row.id });
-  modalApi.open();
-}
-
-async function handleDelete(row: Required<LeaveApplicationForm>) {
-  await leaveApplicationRemove(row.id);
-  await tableApi.query();
-}
-
-function handleMultiDelete() {
-  const rows = tableApi.grid.getCheckboxRecords();
-  const ids = rows.map((row: Required<LeaveApplicationForm>) => row.id);
-  Modal.confirm({
-    title: '提示',
-    okType: 'danger',
-    content: `确认删除选中的${ids.length}条记录吗？`,
-    onOk: async () => {
-      await leaveApplicationRemove(ids);
-      await tableApi.query();
-    },
-  });
-}
-
-function handleDownloadExcel() {
-  commonDownloadExcel(
-    leaveApplicationExport,
-    '请假申请数据',
-    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:leaveApplication:export']"
-            @click="handleDownloadExcel"
-          >
-            {{ $t('pages.common.export') }}
-          </a-button>
-          <a-button
-            :disabled="!vxeCheckboxChecked(tableApi)"
-            danger
-            type="primary"
-            v-access:code="['property:leaveApplication:remove']"
-            @click="handleMultiDelete"
-          >
-            {{ $t('pages.common.delete') }}
-          </a-button>
-          <a-button
-            type="primary"
-            v-access:code="['property:leaveApplication:add']"
-            @click="handleAdd"
-          >
-            {{ $t('pages.common.add') }}
-          </a-button>
-        </Space>
-      </template>
-      <template #action="{ row }">
-        <Space>
-          <ghost-button
-            v-access:code="['property:leaveApplication: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:leaveApplication:remove']"
-              @click.stop=""
-            >
-              {{ $t('pages.common.delete') }}
-            </ghost-button>
-          </Popconfirm>
-        </Space>
-      </template>
-    </BasicTable>
-    <LeaveApplicationModal @reload="tableApi.query()" />
-  </Page>
+  <div class="p-8">
+    <div class="text-2xl font-bold">请假申请</div>
+    <div class="m-6 bg-white p-4">
+        <BasicForm/>
+    </div>
+  </div>
 </template>

apps/web-antd/src/views/property/personalCenter/leaveApplication/leaveApplication-modal.vue

@@ -1,106 +0,0 @@
-<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 {
-  leaveApplicationAdd,
-  leaveApplicationInfo,
-  leaveApplicationUpdate,
-} from '#/api/property/personalCenter/leaveApplication';
-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 leaveApplicationInfo(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
-      ? leaveApplicationUpdate(data)
-      : leaveApplicationAdd(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>

apps/web-antd/src/views/property/resident/unit/data.ts

@@ -130,7 +130,6 @@ export const modalSchema: FormSchemaGetter = () => [
     fieldName: 'name',
     component: 'Input',
     rules: 'required',
-
   },
   {
     label: '单位类型',

apps/web-antd/src/views/screen/energyConsumptionAnalysis/index.vue

@@ -549,7 +549,6 @@ onBeforeUnmount(() => {
   if (timer) {
     clearInterval(timer);
   }
-
   // 从管理器中移除图表
   if (barChartInstance) {
     removeChartFromResizeManager(barChartInstance);
@@ -600,11 +599,11 @@ onBeforeUnmount(() => {
   justify-content: space-between;
   .left {
     display: flex;
-    width: 14.3125rem;
+    width: 18.3125rem;
     .left-first {
       padding-left: 2.3125rem;
-      padding-right: 3.5rem;
       font-size: 1.875rem;
+      width: 10.5rem;
       color: #ffffff;
     }
     .left-second {

apps/web-antd/src/views/screen/monitor/index.vue

@@ -862,24 +862,23 @@ onBeforeUnmount(() => {
     align-items: center;
     display: flex;
     justify-content: space-between;
-    .left{
-        display: flex;
-        width: 20.3125rem;
-        .left-first{
-            padding-left: 2.3125rem;
-            padding-right: 3.5rem;
-            font-size: 1.875rem;
-            color: #FFFFFF;
-        }
-        .left-second{
-            width: 6.5rem;
-            font-family: ShiShangZhongHeiJianTi;
-            font-weight: 400;
-            font-size: 1.25rem;
-            color: #FFFFFF;
-            display: flex;
-        }
+    .left {
+    display: flex;
+    width: 18.3125rem;
+    .left-first {
+      padding-left: 2.3125rem;
+      font-size: 1.875rem;
+      width: 10.5rem;
+      color: #ffffff;
     }
+    .left-second {
+      width: 6.5rem;
+      font-family: ShiShangZhongHeiJianTi;
+      font-weight: 400;
+      font-size: 1.25rem;
+      color: #ffffff;
+    }
+  }
     .center{
     font-size: 1.9rem;
     color: #fff;

apps/web-antd/src/views/screen/navigation/Navigation.vue

@@ -35,7 +35,7 @@
       </div>
       <div class="navigation-body-right">
         <div @click="goToMonitor()">监控大屏</div>
-        <div @click="goToDigitalIntelligence()">商务中心</div>
+        <div @click="goToDigitalIntelligence()">综合服务中心</div>
         <div @click="goToHome()">后台管理</div>
         <!-- <div>能源管理</div>
         <div>能耗分析</div> -->

apps/web-antd/src/views/screen/property/index.vue

@@ -70,12 +70,30 @@
             </div>
           </div>
           <div class="content-center-second">
-            <div class="second-item">
-              <div class="second-item-box1">645</div>
-              <div class="second-item-box2">729</div>
-              <div class="second-item-box3">648</div>
-              <div class="second-item-box4">786</div>
-              <div class="second-item-box5">645</div>
+            <div class="second-item" @click="changeToPersonnelDuty">
+              <div>
+                <div class="second-item-box1">
+                645
+              </div>
+              <div class="second-item-box-label">采购部</div>
+              </div>
+<div>
+  <div class="second-item-box2">729
+              </div>
+                <div class="second-item-box-label">研发部</div>
+              </div>
+              <div>
+                <div class="second-item-box3">648</div>
+                <div class="second-item-box-label">安保部</div>
+              </div>
+              <div>
+                <div class="second-item-box4">786</div>
+                <div class="second-item-box-label">人事部</div>
+              </div>
+              <div>
+                <div class="second-item-box5">645</div>
+                <div class="second-item-box-label">财务部</div>
+              </div>
             </div>
           </div>
         </div>
@@ -87,15 +105,19 @@
           <div class="second">
             <div class="second-box">
               <div class="box-content">
-                <div class="box-content-label">服务数量</div>
+                <div class="box-content-label">维修</div>
                 <div class="box-content-num">132</div>
               </div>
               <div class="box-content">
-                <div class="box-content-label">服务数量</div>
+                <div class="box-content-label">保洁</div>
                 <div class="box-content-num">862</div>
               </div>
               <div class="box-content">
-                <div class="box-content-label">服务数量</div>
+                <div class="box-content-label">客服服务</div>
+                <div class="box-content-num">272</div>
+              </div>
+              <div class="box-content">
+                <div class="box-content-label">安保</div>
                 <div class="box-content-num">272</div>
               </div>
             </div>
@@ -187,31 +209,47 @@ const initBarChart = () => {
     yAxis: {},
     series: [
       {
-        name: '销量',
+        name: '数量',
         type: 'bar',
         data: [5, 20, 36, 10, 10, 20],
       },
+      {
+        name: '已处理',
+        type: 'bar',
+        data: [2, 10, 16, 3, 6, 8],
+      },
+      {
+        name: '待处理',
+        type: 'bar',
+        data: [3, 10, 20, 7, 4, 12],
+      },
     ],
   });
 };
 
-// 初始化电力图表
+// 初始化预约情况图表
 const initPowerChart = () => {
   if (!powerChart.value) return;
-
   const chart = echarts.init(powerChart.value);
   const option = {
     tooltip: { trigger: 'axis' },
-    grid: { left: 40, right: 20, top: 32, bottom: 20 },
+    grid: { left: 40, right: 50, top: 62, bottom: 20 },
     xAxis: {
       type: 'category',
       data: Array.from({ length: 19 }, (_, i) => i + 6),
       axisLine: { lineStyle: { color: '#3ec6ff' } },
       axisLabel: { color: '#fff' },
+      name: '小时',
+      nameTextStyle: { color: '#fff' },
+      nameLocation: 'end',
+      nameGap: 5,
     },
     yAxis: {
       type: 'value',
-      name: '',
+      name: '次',
+      nameTextStyle: { color: '#fff' },
+      nameLocation: 'end',
+      nameGap: 10,
       axisLine: { lineStyle: { color: '#3ec6ff' } },
       axisLabel: { color: '#fff' },
       splitLine: { lineStyle: { color: '#1e90ff22' } },
@@ -462,6 +500,10 @@ const initPie3DChart = () => {
   }
 };
 
+const changeToPersonnelDuty=()=>{
+  router.push('/property/attendanceManagement/workforceManagement')
+}
+
 // 组件挂载时初始化
 onMounted(() => {
   updateTime();
@@ -530,11 +572,11 @@ onBeforeUnmount(() => {
   justify-content: space-between;
   .left {
     display: flex;
-    width: 14.3125rem;
+    width: 18.3125rem;
     .left-first {
       padding-left: 2.3125rem;
-      padding-right: 3.5rem;
       font-size: 1.875rem;
+      width: 10.5rem;
       color: #ffffff;
     }
     .left-second {
@@ -709,6 +751,7 @@ onBeforeUnmount(() => {
           display: flex;
           justify-content: space-around;
           align-items: center;
+          cursor: pointer;
           .second-item-box1 {
             width: 7rem;
             height: 7rem;
@@ -722,6 +765,14 @@ onBeforeUnmount(() => {
             background: url('../../../assets/property/personnel-duty-circle1.png');
             background-size: 100% 100%;
           }
+          .second-item-box-label{
+            display: flex;
+            justify-content: center;
+            align-items: center;
+            font-weight: 400;
+            font-size: 1rem;
+            color: #ffffff;
+          }
           .second-item-box2 {
             width: 7rem;
             height: 7rem;

apps/web-antd/src/views/screen/security/index.vue

@@ -750,23 +750,23 @@ onBeforeUnmount(() => {
     align-items: center;
     display: flex;
     justify-content: space-between;
-    .left{
-        display: flex;
-        width: 14.3125rem;
-        .left-first{
-            padding-left: 2.3125rem;
-            padding-right: 3.5rem;
-            font-size: 1.875rem;
-            color: #FFFFFF;
-        }
-        .left-second{
-            width: 6.5rem;
-            font-family: ShiShangZhongHeiJianTi;
-            font-weight: 400;
-            font-size: 1.25rem;
-            color: #FFFFFF;
-        }
+    .left {
+    display: flex;
+    width: 18.3125rem;
+    .left-first {
+      padding-left: 2.3125rem;
+      font-size: 1.875rem;
+      width: 10.5rem;
+      color: #ffffff;
     }
+    .left-second {
+      width: 6.5rem;
+      font-family: ShiShangZhongHeiJianTi;
+      font-weight: 400;
+      font-size: 1.25rem;
+      color: #ffffff;
+    }
+  }
     .center{
     font-size: 1.9rem;
     color: #fff;

apps/web-antd/src/views/videoSystem/videoWarning/algorithmManagement/index.vue

@@ -98,7 +98,7 @@
           <SelectOption value="50">50条/页</SelectOption>
         </Select>
       </div>
-    </div>
+  </div>
 
     <!-- 算法详情弹窗 -->
     <AlgorithmDetailModal />