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

apps/web-antd/src/api/property/inspectionManagement/inspectionDetail/index.ts

@@ -0,0 +1,61 @@
+import type { TaskDetailVO, TaskDetailForm, TaskDetailQuery } from './model';
+
+import type { ID, IDS } from '#/api/common';
+import type { PageResult } from '#/api/common';
+
+import { commonExport } from '#/api/helper';
+import { requestClient } from '#/api/request';
+
+/**
+* 查询巡检明细列表
+* @param params
+* @returns 巡检明细列表
+*/
+export function taskDetailList(params?: TaskDetailQuery) {
+  return requestClient.get<PageResult<TaskDetailVO>>('/property/taskDetail/list', { params });
+}
+
+/**
+ * 导出巡检明细列表
+ * @param params
+ * @returns 巡检明细列表
+ */
+export function taskDetailExport(params?: TaskDetailQuery) {
+  return commonExport('/property/taskDetail/export', params ?? {});
+}
+
+/**
+ * 查询巡检明细详情
+ * @param id id
+ * @returns 巡检明细详情
+ */
+export function taskDetailInfo(id: ID) {
+  return requestClient.get<TaskDetailVO>(`/property/taskDetail/${id}`);
+}
+
+/**
+ * 新增巡检明细
+ * @param data
+ * @returns void
+ */
+export function taskDetailAdd(data: TaskDetailForm) {
+  return requestClient.postWithMsg<void>('/property/taskDetail', data);
+}
+
+/**
+ * 更新巡检明细
+ * @param data
+ * @returns void
+ */
+export function taskDetailUpdate(data: TaskDetailForm) {
+  return requestClient.putWithMsg<void>('/property/taskDetail', data);
+}
+
+/**
+ * 删除巡检明细
+ * @param id id
+ * @returns void
+ */
+export function taskDetailRemove(id: ID | IDS) {
+  return requestClient.deleteWithMsg<void>(`/property/taskDetail/${id}`);
+}

apps/web-antd/src/api/property/inspectionManagement/inspectionDetail/model.d.ts

@@ -0,0 +1,201 @@
+import type { PageQuery, BaseEntity } from '#/api/common';
+
+export interface TaskDetailVO {
+  /**
+   * 主键id
+   */
+  id: string | number;
+
+  /**
+   * 任务id
+   */
+  taskId: string | number;
+
+  /**
+   * 路线id
+   */
+  routeId: string | number;
+
+  /**
+   * 巡检计划id
+   */
+  planId: string | number;
+
+  /**
+   * 巡检点id
+   */
+  pointId: string | number;
+
+  /**
+   * 巡检方式
+   */
+  patrolType: string;
+
+  /**
+   * 签到类型
+   */
+  signType: string;
+
+  /**
+   * 巡检状态(0未完成,1已完成)
+   */
+  inspectionState: string;
+
+  /**
+   * 巡检照片
+   */
+  inspectionImag
+e: string;
+
+  /**
+   * 实际巡检时间
+   */
+  inspectionTime: string;
+
+  /**
+   * 备注
+   */
+  remark: string;
+
+  /**
+   * 点开始时间
+   */
+  pointStartTime: string;
+
+  /**
+   * 点结束时间
+   */
+  pointEndTime: string;
+
+}
+
+export interface TaskDetailForm extends BaseEntity {
+  /**
+   * 主键id
+   */
+  id?: string | number;
+
+  /**
+   * 任务id
+   */
+  taskId?: string | number;
+
+  /**
+   * 路线id
+   */
+  routeId?: string | number;
+
+  /**
+   * 巡检计划id
+   */
+  planId?: string | number;
+
+  /**
+   * 巡检点id
+   */
+  pointId?: string | number;
+
+  /**
+   * 巡检方式
+   */
+  patrolType?: string;
+
+  /**
+   * 签到类型
+   */
+  signType?: string;
+
+  /**
+   * 巡检状态(0未完成,1已完成)
+   */
+  inspectionState?: string;
+
+  /**
+   * 巡检照片
+   */
+  inspectionImage?: string;
+
+  /**
+   * 实际巡检时间
+   */
+  inspectionTime?: string;
+
+  /**
+   * 备注
+   */
+  remark?: string;
+
+  /**
+   * 点开始时间
+   */
+  pointStartTime?: string;
+
+  /**
+   * 点结束时间
+   */
+  pointEndTime?: string;
+
+}
+
+export interface TaskDetailQuery extends PageQuery {
+  /**
+   * 任务id
+   */
+  taskId?: string | number;
+
+  /**
+   * 路线id
+   */
+  routeId?: string | number;
+
+  /**
+   * 巡检计划id
+   */
+  planId?: string | number;
+
+  /**
+   * 巡检点id
+   */
+  pointId?: string | number;
+
+  /**
+   * 巡检方式
+   */
+  patrolType?: string;
+
+  /**
+   * 签到类型
+   */
+  signType?: string;
+
+  /**
+   * 巡检状态(0未完成,1已完成)
+   */
+  inspectionState?: string;
+
+  /**
+   * 巡检照片
+   */
+  inspectionImag
+e?: string;
+
+  /**
+   * 实际巡检时间
+   */
+  inspectionTime?: string;
+
+  /**
+   * 点开始时间
+   */
+  pointStartTime?: string;
+
+  /**
+   * 点结束时间
+   */
+  pointEndTime?: string;
+
+  /**
+    * 日期范围参数
+    */
+  params?: any;
+}

apps/web-antd/src/api/property/resident/person/model.d.ts

@@ -71,6 +71,10 @@ export interface PersonVO {
    */
   authGroupId?: string | number
 
+  authBegDate?: string
+
+  authEndDate?: string
+
 }
 
 export interface PersonForm extends BaseEntity {

apps/web-antd/src/views/property/attendanceManagement/attendanceGroupSettings/attendance-group-detail.vue

@@ -45,7 +45,28 @@ async function handleOpenChange(open: boolean) {
   }
   modalApi.modalLoading(true);
   const {id,attendanceType} = modalApi.getData() as { id?: number | string,attendanceType?:string };
-  groupDetail.value = await groupInfo(id,attendanceType);
+  const res = await groupInfo(id,attendanceType);
+  groupDetail.value=res;
+  if(res.attendanceType==0){
+    unCheckInData.value=res.clockDateList.filter(item=>item.mustNoCheck==0)
+    checkInData.value=res.clockDateList.filter(item=>item.mustNoCheck==1)
+    weekdayData.value=res.weekList
+    weekdayData.value.forEach(item => {
+      if(item.shiftId){
+        const shift = res.attendanceList.find(i => item.shiftId == i.id);
+        let str = ''
+        if (shift.isRest) {
+          str = `${shift.name}：${shift.startTime}~${shift.restStartTime} ${shift.restEndTime}~${shift.endTime}`;
+        } else {
+          str = `${shift.name}：${shift.startTime}~${shift.endTime}`;
+        }
+        item.shiftValue=str
+      }
+    })
+    groupDetail.value.isAutomatic=true
+  }else {
+    cycleData.value=res;
+  }
   modalApi.modalLoading(false);
 }
 
@@ -94,6 +115,15 @@ async function showHoliday() {
               size="small"
               :pagination="false"
             >
+              <template #bodyCell="{ column, record, index }">
+                <template v-if="column.dataIndex === 'dayOfWeek'">
+                 <component :is="renderDict(record.dayOfWeek,'wy_kqgzr')"></component>
+                </template>
+                <template v-if="column.dataIndex === 'shiftId'">
+                  <span v-if="record.shiftId">{{record.shiftValue }}</span>
+                  <span v-else>休息</span>
+                </template>
+              </template>
             </Table>
             <Checkbox
               class="item-padding-top"
@@ -112,13 +142,14 @@ async function showHoliday() {
               size="small"
               :pagination="false"
             >
-              <template #bodyCell="{ column, record, index }">
+              <template #bodyCell="{ column, record }">
                 <template v-if="column.dataIndex === 'dateTime'">
                   <span v-if="record.dateType == 0">{{
-                    record.startDate
+                      dayjs(record.startDate).format('YYYY-MM-DD')
                     }}</span>
                   <span v-else>{{
-                    record.startDate + '~' + record.endDate
+                      dayjs(record.startDate).format('YYYY-MM-DD')
+                      + '~' + dayjs(record.endDate).format('YYYY-MM-DD')
                     }}</span>
                 </template>
               </template>
@@ -132,13 +163,14 @@ async function showHoliday() {
               size="small"
               :pagination="false"
             >
-              <template #bodyCell="{ column, record, index }">
+              <template #bodyCell="{ column, record }">
                 <template v-if="column.dataIndex === 'dateTime'">
                   <span v-if="record.dateType == 0">{{
-                    record.startDate
+                    dayjs(record.startDate).format('YYYY-MM-DD')
                   }}</span>
                   <span v-else>{{
-                    record.startDate + '~' + record.endDate
+                      dayjs(record.startDate).format('YYYY-MM-DD')
+                       + '~' + dayjs(record.endDate).format('YYYY-MM-DD')
                   }}</span>
                 </template>
               </template>
@@ -169,9 +201,7 @@ async function showHoliday() {
                 <span>{{ '第' + (index + 1) + '天' }}</span>
               </template>
               <template v-if="column.dataIndex === 'shiftId'">
-                <!--                    {{item.name+'\xa0'}}-->
+                {{record.shiftId}}
-                <!--                    <span v-if="item.isRest">{{item.startTime+'~'+item.restStartTime+'\xa0'+item.restEndTime+'~'+item.endTime}}</span>-->
-                <!--                    <span v-else>{{item.startTime+'~'+item.endTime}}</span>-->
               </template>
             </template>
           </Table>

apps/web-antd/src/views/property/attendanceManagement/attendanceGroupSettings/data.ts

@@ -82,6 +82,10 @@ export const modalSchema: FormSchemaGetter = () => [
       buttonStyle: 'solid',
       options: getDictOptions('wy_kqlx'),
     },
+    dependencies:{
+      disabled: (formValue) => formValue.id,
+      triggerFields: ['id'],
+    },
     rules: 'selectRequired',
     defaultValue: '0',
   },
@@ -168,17 +172,17 @@ export const modalSchema: FormSchemaGetter = () => [
 export const weekdayColumns: TableColumnsType = [
   {
     title: '工作日',
-    key: 'label',
+    key: 'dayOfWeek',
     width: 120,
     align: 'center',
-    dataIndex: 'label'
+    dataIndex: 'dayOfWeek'
   },
   {
     title: '班次',
-    key: 'shiftValue',
+    key: 'shiftId',
     minWidth: 180,
     align: 'center',
-    dataIndex: 'shiftValue'
+    dataIndex: 'shiftId'
   },
   {
     title: '操作',
@@ -320,17 +324,17 @@ export const clockInModalSchema: FormSchemaGetter = () => [
 export const infoWeekdayColumns: TableColumnsType = [
   {
     title: '工作日',
-    key: 'label',
+    key: 'dayOfWeek',
     width: 120,
     align: 'center',
-    dataIndex: 'label'
+    dataIndex: 'dayOfWeek'
   },
   {
     title: '班次',
-    key: 'shiftValue',
+    key: 'shiftId',
     minWidth: 180,
     align: 'center',
-    dataIndex: 'shiftValue'
+    dataIndex: 'shiftId'
   },
 ]
 

apps/web-antd/src/views/property/attendanceManagement/attendanceGroupSettings/group-modal.vue

@@ -28,6 +28,8 @@ import checkInDate from './check-in-date.vue'
 import {h} from 'vue';
 import {PlusOutlined, MinusOutlined} from '@ant-design/icons-vue';
 import type {ShiftVO} from "#/api/property/attendanceManagement/shiftSetting/model";
+import {renderDict} from "#/utils/render";
+import dayjs from "dayjs";
 
 const emit = defineEmits<{ reload: [] }>();
 const isUpdate = ref(false);
@@ -88,6 +90,26 @@ const [BasicModal, modalApi] = useVbenModal({
     isUpdate.value = !!id;
     if (isUpdate.value && id) {
       const record = await groupInfo(id, attendanceType);
+      record.attendanceType = record.attendanceType.toString()
+      if (record.attendanceType == '0') {
+        settingData.unCheckInData = record.clockDateList.filter(item => item.mustNoCheck == 0)
+        settingData.checkInData = record.clockDateList.filter(item => item.mustNoCheck == 1)
+        settingData.weekdayData = record.weekList
+        settingData.weekdayData.forEach(item => {
+          if(item.shiftId){
+            const shift = record.attendanceList.find(i => item.shiftId == i.id);
+            let str = ''
+            if (shift.isRest) {
+              str = `${shift.name}：${shift.startTime}~${shift.restStartTime} ${shift.restEndTime}~${shift.endTime}`;
+            } else {
+              str = `${shift.name}：${shift.startTime}~${shift.endTime}`;
+            }
+            item.shiftValue=str
+          }
+        })
+      } else {
+
+      }
       await formApi.setValues(record);
     } else {
       getDictOptions('wy_kqgzr').forEach(item => {
@@ -331,6 +353,13 @@ function getUnCheckInData(val: any) {
                  :data-source="settingData.weekdayData"
                  size="small" :pagination="false">
             <template #bodyCell="{ column, record,index }">
+              <template v-if="column.dataIndex==='dayOfWeek'">
+                <component :is="renderDict(record.dayOfWeek,'wy_kqgzr')"></component>
+              </template>
+              <template v-if="column.dataIndex==='shiftId'">
+                <span v-if="record.shiftId">{{ record.shiftValue }}</span>
+                <span v-else>休息</span>
+              </template>
               <template v-if="column.dataIndex==='action'">
                 <Button type="link" size="small" @click="changeShiftHandle(3,index)">更改班次
                 </Button>
@@ -364,8 +393,13 @@ function getUnCheckInData(val: any) {
                 </Button>
               </template>
               <template v-if="column.dataIndex==='dateTime'">
-                <span v-if="record.dateType==0">{{ record.startDate }}</span>
+               <span v-if="record.dateType == 0">{{
-                <span v-else>{{ record.startDate + '~' + record.endDate }}</span>
+                   dayjs(record.startDate).format('YYYY-MM-DD')
+                 }}</span>
+                <span v-else>{{
+                    dayjs(record.startDate).format('YYYY-MM-DD')
+                    + '~' + dayjs(record.endDate).format('YYYY-MM-DD')
+                  }}</span>
               </template>
             </template>
           </Table>
@@ -383,8 +417,13 @@ function getUnCheckInData(val: any) {
             </template>
             <template #bodyCell="{ column,record,index }">
               <template v-if="column.dataIndex==='dateTime'">
-                <span v-if="record.dateType==0">{{ record.startDate }}</span>
+                 <span v-if="record.dateType == 0">{{
-                <span v-else>{{ record.startDate + '~' + record.endDate }}</span>
+                     dayjs(record.startDate).format('YYYY-MM-DD')
+                   }}</span>
+                <span v-else>{{
+                    dayjs(record.startDate).format('YYYY-MM-DD')
+                    + '~' + dayjs(record.endDate).format('YYYY-MM-DD')
+                  }}</span>
               </template>
               <template v-if="column.dataIndex==='action'">
                 <Button size="small" type="primary" shape="circle"

apps/web-antd/src/views/property/building/data.tsx

@@ -73,14 +73,6 @@ export const columns: VxeGridProps['columns'] = [
     title: '地址',
     field: 'addr',
   },
-  {
-    title: '经度',
-    field: 'lon',
-  },
-  {
-    title: '维度',
-    field: 'lat',
-  },
   {
     field: 'action',
     fixed: 'right',
@@ -150,14 +142,4 @@ export const modalSchema: FormSchemaGetter = () => [
     component: 'Input',
     rules: 'required',
   },
-  {
-    label: '经度',
-    fieldName: 'lon',
-    component: 'Input',
-  },
-  {
-    label: '维度',
-    fieldName: 'lat',
-    component: 'Input',
-  },
 ];

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

@@ -3,6 +3,7 @@ import type { VxeGridProps } from '#/adapter/vxe-table';
 import {getPopupContainer} from '@vben/utils';
 import {getDictOptions} from '#/utils/dict';
 import {DictEnum} from '@vben/constants';
+import {renderDict} from "#/utils/render";
 
 export const querySchema: FormSchemaGetter = () => [
   {
@@ -32,7 +33,11 @@ export const columns: VxeGridProps['columns'] = [
   {
     title: '社区类型',
     field: 'communityType',
-    slots: { default: 'communityType' },
+    slots: {
+      default: ({row}) => {
+        return renderDict(row.communityType, DictEnum.wy_sqlx)
+      }
+    },
   },
   {
     title: '城市',

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

@@ -177,11 +177,6 @@ function handleDownloadExcel() {
         </Space>
       </template>
 
-      <template #communityType="{ row }">
-        <Tag v-if="row.community_type == 1" color="#108ee9">园区</Tag>
-        <Tag v-else color="#2db7f5">小区</Tag>
-      </template>
-
     </BasicTable>
     <CommunityModal @reload="tableApi.query()" />
   </Page>

apps/web-antd/src/views/property/electricEnergy/elctricityCost/index.vue

@@ -68,7 +68,6 @@ const [BasicTable, tableApi] = useVbenVxeGrid({
 .box{
   display: grid;
   grid-template-columns: 1fr 3fr;
-  gap: 30px;
 
   .right {
     width: 100%;

apps/web-antd/src/views/property/electricEnergy/electricTrend/index.vue

@@ -300,7 +300,7 @@ onMounted(()=>{
       </div>
       <div id="day" style="height: 250px;width: 100%;"></div>
     </div>
-    <div style="background: #fff;border-radius: 8px;padding: 10px;margin-top: 10px;">
+    <div style="background: #fff;border-radius: 8px;padding: 10px;margin-top: 16px;">
       <div>
         <div style="display: flex;justify-content: space-between;">
           <DatePicker
@@ -311,7 +311,7 @@ onMounted(()=>{
       </div>
       <div id="month" style="height: 250px;width: 100%;"></div>
     </div>
-    <div style="background: #fff;border-radius: 8px;padding: 10px;margin-top: 10px;">
+    <div style="background: #fff;border-radius: 8px;padding: 10px;margin-top: 16px;">
       <div>
         <div style="display: flex;justify-content: space-between;">
           <DatePicker
@@ -330,7 +330,7 @@ onMounted(()=>{
 .box{
   display: grid;
   grid-template-columns: 1fr 3fr;
-  gap: 30px;
+  gap: 16px;
-  padding: 10px;
+  padding: 16px;
 }
 </style>

apps/web-antd/src/views/property/electricEnergy/electricityQOQ/index.vue

@@ -68,6 +68,5 @@ const [BasicTable, tableApi] = useVbenVxeGrid({
 .box{
   display: grid;
   grid-template-columns: 1fr 3fr;
-  gap: 30px;
 }
 </style>

apps/web-antd/src/views/property/electricEnergy/electricityYOY/index.vue

@@ -134,7 +134,7 @@ const data = [...Array(32)].map((_, i) => ({
   <div class="box">
     <div class="left"><FloorTree></FloorTree></div>
     <div class="right">
-      <div style="background: #fff;border-radius: 8px;padding: 10px;margin-bottom: 10px;">
+      <div style="background: #fff;border-radius: 8px;padding: 10px;margin-bottom: 16px;">
         <div>
           年份
           <DatePicker
@@ -156,7 +156,7 @@ const data = [...Array(32)].map((_, i) => ({
           :columns="columns"
           :data-source="data"
           :pagination="false"
-          :scroll="{ y: 270 }"
+          :scroll="{ y: '50vh' }"
         />
       </div>
     </div>
@@ -167,7 +167,7 @@ const data = [...Array(32)].map((_, i) => ({
 .box{
   display: grid;
   grid-template-columns: 1fr 3fr;
-  gap: 30px;
+  gap: 16px;
-  padding: 10px;
+  padding: 16px;
 }
 </style>

apps/web-antd/src/views/property/inspectionManagement/inspectionDetails/data.ts

@@ -7,10 +7,18 @@ import {getDictOptions} from "#/utils/dict";
 
 
 export const querySchema: FormSchemaGetter = () => [
+  // {
+  //   component: 'Input',
+  //   fieldName: 'actUserId',
+  //   label: '当前巡检人',
+  // },
   {
-    component: 'Input',
+    label: '签到类型',
-    fieldName: 'actUserId',
+    fieldName: 'signType',
-    label: '当前巡检人',
+    component: 'Select',
+    componentProps: {
+      options:getDictOptions('wy_xjqdfs')
+    },
   },
   {
     component: 'Select',
@@ -24,64 +32,94 @@ export const querySchema: FormSchemaGetter = () => [
 
 export const columns: VxeGridProps['columns'] = [
   { type: 'checkbox', width: 60 },
-  {
-    title: '任务编号',
-    field: 'id',
-    width:'auto'
-  },
-    {
-    title: '巡检计划',
-    field: 'planName',
-    minWidth:200
-  },
-    {
-    title: '巡检时间范围',
-    field: 'planInsTime',
-    width:'auto'
-
-  },
   // {
-  //   title: '实际巡检时间',
+  //   title: '任务编号',
-  //   field: 'endDate',
+  //   field: 'id',
-  //   width:180
+  //   width:'auto'
+  // },
+  //   {
+  //   title: '巡检计划',
+  //   field: 'planName',
+  //   minWidth:200
+  // },
+  //   {
+  //   title: '巡检时间范围',
+  //   field: 'planInsTime',
+  //   width:'auto'
   //
   // },
+  // //   {
+  // //   title: '实际巡检时间',
+  // //   field: 'endDate',
+  // //   width:180
+  // //
+  // // },
+  // {
+  //   title: '签到状态',
+  //   field: 'actInsTime',
+  //   width:150,
+  // },
+  // {
+  //   title: '巡检人',
+  //   field: 'planUserName',
+  //   width:'auto'
+  //
+  // },
+  // {
+  //   title: '巡检方式',
+  //   field: 'taskType',
+  //   width:'auto',
+  //   slots: {
+  //     default: ({ row }) => {
+  //       return renderDict(row.taskType, 'wy_xjqdfs');
+  //     },
+  //   },
+  // },
   {
-    title: '签到状态',
+    title: '签到类型',
-    field: 'actInsTime',
+    field: 'signType',
     width:150,
-  },
-  {
-    title: '巡检人',
-    field: 'planUserName',
-    width:'auto'
-
-  },
-  {
-    title: '巡检方式',
-    field: 'taskType',
-    width:'auto',
     slots: {
       default: ({ row }) => {
-        return renderDict(row.taskType, 'wy_xjqdfs');
+        return renderDict(row.signType, 'wy_xjqdfs');
       },
     },
   },
   {
     title: '巡检状态',
     field: 'status',
-    width:100,
+    width:150,
     slots: {
       default: ({ row }) => {
-        return renderDict(row.taskType, 'wy_xjzt');
+        return renderDict(row.inspectionState, 'wy_xjzt');
       },
     },
   },
   {
     title: '巡检照片',
-    field: 'remark',
+    field: 'inspectionImage',
     width:120
   },
+  {
+    title: '开始时间',
+    field: 'pointStartTime',
+    width:150
+  },
+  {
+    title: '结束时间',
+    field: 'pointEndTime',
+    width:150
+  },
+  {
+    title: '实际巡检时间',
+    field: 'inspectionTime',
+    width:150
+  },
+  {
+    title: '备注',
+    field: 'remark',
+    minWidth:120
+  },
   // {
   //   field: 'action',
   //   fixed: 'right',

apps/web-antd/src/views/property/inspectionManagement/inspectionDetails/index.vue

@@ -8,15 +8,15 @@ import {
   type VxeGridProps
 } from '#/adapter/vxe-table';
 
-import {
-  inspectionTaskExport,
-  inspectionTaskList,
-} from '#/api/property/inspectionManagement/inspectionTask';
 import type {InspectionTaskForm} from '#/api/property/inspectionManagement/inspectionTask/model';
 import {commonDownloadExcel} from '#/utils/file/download';
 
 import inspectionDetailsModal from './inspectionDetails-modal.vue';
 import {columns, querySchema} from './data';
+import {
+  taskDetailExport,
+  taskDetailList
+} from "#/api/property/inspectionManagement/inspectionDetail";
 
 const formOptions: VbenFormProps = {
   commonConfig: {
@@ -46,7 +46,7 @@ const gridOptions: VxeGridProps = {
   proxyConfig: {
     ajax: {
       query: async ({page}, formValues = {}) => {
-        return await inspectionTaskList({
+        return await taskDetailList({
           pageNum: page.currentPage,
           pageSize: page.pageSize,
           ...formValues,
@@ -77,7 +77,7 @@ async function handInfo(row: Required<InspectionTaskForm>) {
 }
 
 function handleDownloadExcel() {
-  commonDownloadExcel(inspectionTaskExport, '巡检任务数据', tableApi.formApi.form.values, {
+  commonDownloadExcel(taskDetailExport, '巡检明细数据', tableApi.formApi.form.values, {
     fieldMappingTime: formOptions.fieldMappingTime,
   });
 }
@@ -97,7 +97,7 @@ function handleDownloadExcel() {
 
         </Space>
       </template>
-      <template #action="{ row }">
+<!--      <template #action="{ row }">-->
 <!--        <Space>-->
 <!--          <ghost-button-->
 <!--            v-access:code="['property:inspectionTask:info']"-->
@@ -106,7 +106,7 @@ function handleDownloadExcel() {
 <!--            {{ $t('pages.common.info') }}-->
 <!--          </ghost-button>-->
 <!--        </Space>-->
-      </template>
+<!--      </template>-->
     </BasicTable>
     <InspectionDetailsModal @reload="tableApi.query()"/>
   </Page>

apps/web-antd/src/views/property/inspectionManagement/inspectionItem/index.vue

@@ -133,6 +133,7 @@ function handleDownloadExcel() {
             type="primary"
             v-access:code="['property:inspectionItem:export']"
             @click="handleDownloadExcel"
+            disabled="disabled"
           >
             {{ '文档' }}
           </a-button>

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

@@ -1,11 +1,10 @@
-import type { FormSchemaGetter } from '#/adapter/form';
+import type { FormSchemaGetter } from '#/adapter/form'
-import type { VxeGridProps } from '#/adapter/vxe-table';
+import type { VxeGridProps } from '#/adapter/vxe-table'
-import { getDictOptions } from '#/utils/dict';
+import { getDictOptions } from '#/utils/dict'
-import { renderDict } from '#/utils/render';
+import { renderDict } from '#/utils/render'
-import { resident_unitList } from '#/api/property/resident/unit';
+import { resident_unitList } from '#/api/property/resident/unit'
-import { authGroupList } from '#/api/sis/authGroup';
+import { authGroupList } from '#/api/sis/authGroup'
-import type { AuthGroupVO, AuthGroupQuery } from '#/api/sis/authGroup/model';
+import type { AuthGroupVO, AuthGroupQuery } from '#/api/sis/authGroup/model'
-import { toRaw } from 'vue';
 
 export const querySchema: FormSchemaGetter = () => [
   {
@@ -37,7 +36,7 @@ export const querySchema: FormSchemaGetter = () => [
     fieldName: 'state',
     label: '状态',
   },
-];
+]
 
 export const columns: VxeGridProps['columns'] = [
   { type: 'checkbox', width: 60 },
@@ -52,7 +51,7 @@ export const columns: VxeGridProps['columns'] = [
   // },
   {
     title: '员工编号',
-    field: 'userId',
+    field: 'id',
     width: 100,
   },
   {
@@ -70,7 +69,7 @@ export const columns: VxeGridProps['columns'] = [
     field: 'gender',
     slots: {
       default: ({ row }) => {
-        return renderDict(row.gender, 'sys_user_sex');
+        return renderDict(row.gender, 'sys_user_sex')
       },
     },
     width: 100,
@@ -105,7 +104,7 @@ export const columns: VxeGridProps['columns'] = [
     field: 'state',
     slots: {
       default: ({ row }) => {
-        return renderDict(row.state, 'wy_rzryzt');
+        return renderDict(row.state, 'wy_rzryzt')
       },
     },
     width: 100,
@@ -122,9 +121,9 @@ export const columns: VxeGridProps['columns'] = [
     title: '操作',
     minWidth: 180,
   },
-];
+]
 
-let authGroupArr: AuthGroupVO[] = [];
+let authGroupArr: AuthGroupVO[] = []
 export const modalSchema: FormSchemaGetter = () => [
   {
     label: '主键id',
@@ -140,17 +139,20 @@ export const modalSchema: FormSchemaGetter = () => [
     fieldName: 'userName',
     component: 'Input',
     rules: 'required',
+    formItemClass: 'col-span-1',
   },
   {
     label: '联系电话',
     fieldName: 'phone',
     component: 'Input',
     rules: 'required',
+    formItemClass: 'col-span-1',
   },
   {
     label: '性别',
     fieldName: 'gender',
     component: 'Select',
+    formItemClass: 'col-span-2',
     componentProps: {
       options: getDictOptions('sys_user_sex'),
     },
@@ -161,20 +163,23 @@ export const modalSchema: FormSchemaGetter = () => [
     fieldName: 'idCard',
     component: 'Input',
     rules: 'required',
+    formItemClass: 'col-span-1',
   },
   {
     label: '邮箱',
     fieldName: 'email',
     component: 'Input',
+    formItemClass: 'col-span-1',
   },
   {
     label: '人员状态',
     fieldName: 'state',
     component: 'Select',
     componentProps: {
-      options: getDictOptions('wy_rzryzt'),
+      options: getDictOptions('wy_rzryzt')
     },
     rules: 'selectRequired',
+    formItemClass: 'col-span-2',
   },
   // {
   //   label: '入住员工',
@@ -187,7 +192,7 @@ export const modalSchema: FormSchemaGetter = () => [
     label: '所属单位',
     fieldName: 'unitId',
     component: 'Select',
-    formItemClass: 'col-span-2',
+    formItemClass: 'col-span-4',
     rules: 'selectRequired',
   },
   // {
@@ -207,37 +212,66 @@ export const modalSchema: FormSchemaGetter = () => [
       valueFormat: 'YYYY-MM-DD HH:mm:ss',
     },
     rules: 'required',
+    formItemClass: 'col-span-1',
   },
   {
     label: '车牌号码',
     fieldName: 'carNumber',
     component: 'Input',
+    formItemClass: 'col-span-3',
+  },
+  {
+    label: '修改权限',
+    fieldName: 'authSwitch',
+    component: 'Switch',
+    formItemClass: 'col-span-1',
+    componentProps: {
+      class: 'w-auto',
+
+    },
+    defaultValue: false,
+    dependencies: {
+      show: (values) => {
+        return typeof values.id !== 'undefined'
+      },
+      triggerFields: ['id'],
+    },
+
   },
   {
     label: '授权期限',
     fieldName: 'authTime',
     component: 'RangePicker',
+    formItemClass: 'col-span-1',
     componentProps: {
+      class: 'w-auto',
       showTime: true,
       format: 'YYYY-MM-DD HH:mm:ss',
       valueFormat: 'YYYY-MM-DD HH:mm:ss',
     },
     dependencies: {
       show: (values) => {
-        return typeof values.id !== 'undefined';
+        return typeof values.id !== 'undefined'
       },
-      triggerFields: ['id'],
+      disabled:(values) => {
+        return !values.authSwitch
+      },
+      triggerFields: ['id', 'authSwitch'],
     },
   },
   {
     label: '通行权限组',
     fieldName: 'authGroupId',
     component: 'ApiSelect',
+    formItemClass: 'col-span-2',
     dependencies: {
       show: (values) => {
-        return typeof values.id !== 'undefined';
+        return typeof values.id !== 'undefined'
       },
-      triggerFields: ['id'],
+       disabled:(values) => {
+        return !values.authSwitch
+      },
+      triggerFields: ['id', 'authSwitch'],
     },
     componentProps: {
       allowClear: true,
@@ -248,14 +282,13 @@ export const modalSchema: FormSchemaGetter = () => [
       api: async () => {
         if (!authGroupArr || authGroupArr.length == 0) {
           const params: AuthGroupQuery = {
-            groupType: 2,
             pageNum: 1,
             pageSize: 500,
-          };
-          const res = await authGroupList(params);
-          authGroupArr = res.rows;
           }
-        return authGroupArr;
+          const res = await authGroupList(params)
+          authGroupArr = res.rows
+        }
+        return authGroupArr
       },
     },
   },
@@ -267,15 +300,15 @@ export const modalSchema: FormSchemaGetter = () => [
       // accept: 'image/*', // 可选拓展名或者mime类型 ,拼接
       maxCount: 1, // 最大上传文件数 默认为1 为1会绑定为string而非string[]类型
     },
-    formItemClass: 'col-span-2',
+    formItemClass: 'col-span-3',
   },
   {
     label: '备注',
     fieldName: 'remark',
     component: 'Textarea',
-    formItemClass: 'col-span-2',
+    formItemClass: 'col-span-3',
   },
-];
+]
 
 //门禁记录
 export const accessControlColumns: VxeGridProps['columns'] = [
@@ -311,7 +344,7 @@ export const accessControlColumns: VxeGridProps['columns'] = [
     title: '状态',
     field: 'locathon',
   },
-];
+]
 
 //车辆记录
 export const carColumns: VxeGridProps['columns'] = [
@@ -355,22 +388,22 @@ export const carColumns: VxeGridProps['columns'] = [
     title: '备注',
     field: 'remark',
   },
-];
+]
 export async function getUnitList(): Promise<
   { value: number; label: string }[]
 > {
   const queryParam = {
     pageNum: 1000,
     pageSize: 1,
-  };
+  }
-  const res = await resident_unitList(queryParam);
+  const res = await resident_unitList(queryParam)
-  const data: { value: number; label: string }[] = [];
+  const data: { value: number; label: string }[] = []
 
   res.rows.forEach((r: any) => {
     data.push({
       value: r.id,
       label: r.name,
-    });
+    })
-  });
+  })
-  return data;
+  return data
 }

apps/web-antd/src/views/property/resident/person/person-modal.vue

@@ -1,38 +1,38 @@
 <script setup lang="ts">
-import { computed, reactive, ref } from "vue";
+import { computed, reactive, ref } from "vue"
-import { useVbenModal } from "@vben/common-ui";
+import { useVbenModal } from "@vben/common-ui"
-import { $t } from "@vben/locales";
+import { $t } from "@vben/locales"
-import { cloneDeep } from "@vben/utils";
+import { cloneDeep } from "@vben/utils"
-import { useVbenForm } from "#/adapter/form";
+import { useVbenForm } from "#/adapter/form"
 import {
   personAdd,
   personInfo,
   personUpdate,
-} from "#/api/property/resident/person";
+} from "#/api/property/resident/person"
-import { defaultFormValueGetter, useBeforeCloseDiff } from "#/utils/popup";
+import { defaultFormValueGetter, useBeforeCloseDiff } from "#/utils/popup"
-import { modalSchema } from "./data";
+import { modalSchema } from "./data"
-import QueryUserList from "./query-user-list.vue";
+import QueryUserList from "./query-user-list.vue"
-import QueryUnitList from "./query-unit-list.vue";
+import QueryUnitList from "./query-unit-list.vue"
 
-const emit = defineEmits<{ reload: [] }>();
+const emit = defineEmits<{ reload: [] }>()
 
-const isUpdate = ref(false);
+const isUpdate = ref(false)
 const title = computed(() => {
-  return isUpdate.value ? $t("pages.common.edit") : $t("pages.common.add");
+  return isUpdate.value ? $t("pages.common.edit") : $t("pages.common.add")
-});
+})
 let userInfo = reactive({
   userId: "",
   userName: "",
   phone: "",
   gender: "",
-});
+})
-let unitName = ref("");
+let unitName = ref("")
-const userId = ref<number | string>(0);
+const userId = ref<number | string>(0)
-const unitId = ref<string>("");
+const unitId = ref<string>("")
 const [BasicForm, formApi] = useVbenForm({
   commonConfig: {
     // 默认占满两列
-    formItemClass: "col-span-1",
+    formItemClass: "col-span-4",
     // 默认label宽度 px
     labelWidth: 100,
     // 通用配置项 会影响到所有表单项
@@ -43,88 +43,89 @@ const [BasicForm, formApi] = useVbenForm({
   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-[70%]",
+  class: "w-[75%]",
   fullscreenButton: false,
   onBeforeClose,
   onClosed: handleClosed,
   onConfirm: handleConfirm,
   onOpenChange: async (isOpen) => {
     if (!isOpen) {
-      return null;
+      return null
     }
-    modalApi.modalLoading(true);
+    modalApi.modalLoading(true)
 
-    const { id } = modalApi.getData() as { id?: number | string };
+    const { id } = modalApi.getData() as { id?: number | string }
-    isUpdate.value = !!id;
+    isUpdate.value = !!id
 
     if (isUpdate.value && id) {
-      const record = await personInfo(id);
+      const record = await personInfo(id)
-      userId.value = record.userId;
+      userId.value = record.userId
-      unitId.value = record.unitId.toString();
+      unitId.value = record.unitId.toString()
-      record.state = record.state?.toString();
+      record.state = record.state?.toString()
-      await formApi.setValues(record);
+      record.authTime = [record.authBegDate, record.authEndDate]
+      await formApi.setValues(record)
     }
-    await markInitialized();
+    await markInitialized()
 
-    modalApi.modalLoading(false);
+    modalApi.modalLoading(false)
   },
-});
+})
 
 async function handleConfirm() {
   try {
-    modalApi.lock(true);
+    modalApi.lock(true)
-    const { valid } = await formApi.validate();
+    const { valid } = await formApi.validate()
     if (!valid) {
-      return;
+      return
     }
     // getValues获取为一个readonly的对象 需要修改必须先深拷贝一次
-    let data = cloneDeep(await formApi.getValues());
+    let data = cloneDeep(await formApi.getValues())
     // if (userInfo) {
     //   data.userName = userInfo.userName
     //   data.phone = userInfo.phone
     //   data.gender = userInfo.gender
     // }
     if (unitName.value) {
-      data.unitName = unitName.value;
+      data.unitName = unitName.value
     }
 
-    if (isUpdate.value && data.authTime !== 0) {
+    if (isUpdate.value && data.authSwitch) {
-      data.authBegDate = data.authTime[0];
+      data.authBegDate = data.authTime[0]
-      data.authEndDate = data.authTime[1];
+      data.authEndDate = data.authTime[1]
     }
-    await (isUpdate.value ? personUpdate(data) : personAdd(data));
+    await (isUpdate.value ? personUpdate(data) : personAdd(data))
-    resetInitialized();
+    resetInitialized()
-    emit("reload");
+    emit("reload")
-    modalApi.close();
+    modalApi.close()
   } catch (error) {
-    console.error(error);
+    console.error(error)
   } finally {
-    modalApi.lock(false);
+    modalApi.lock(false)
   }
 }
 
 async function handleClosed() {
-  await formApi.resetForm();
+  await formApi.resetForm()
-  resetInitialized();
+  resetInitialized()
 }
 
 function getUserInfo(user: any) {
-  userInfo = user;
+  userInfo = user
 }
 
 function getUnitInfo(unit: { name: string }) {
-  unitName.value = unit.name;
+  unitName.value = unit.name
 }
 </script>
 
@@ -132,16 +133,10 @@ function getUnitInfo(unit: { name: string }) {
   <BasicModal :title="title">
     <BasicForm>
       <template #userId="slotProps">
-        <QueryUserList @update:userInfo="getUserInfo"
+        <QueryUserList @update:userInfo="getUserInfo" v-bind="slotProps" :isUpdate="isUpdate" :userId="userId" />
-                       v-bind="slotProps"
-                       :isUpdate="isUpdate"
-                       :userId="userId" />
       </template>
       <template #unitId="slotProps">
-        <QueryUnitList @update:unitInfo="getUnitInfo"
+        <QueryUnitList @update:unitInfo="getUnitInfo" v-bind="slotProps" :isUpdate="isUpdate" :unitId="unitId" />
-                       v-bind="slotProps"
-                       :isUpdate="isUpdate"
-                       :unitId="unitId" />
       </template>
     </BasicForm>
   </BasicModal>

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

@@ -176,7 +176,7 @@ export const modalSchema: FormSchemaGetter = () => [
   },
   {
     label: '',
-    fieldName: 'time',
+    fieldName: 'Placeholder',
     component: ''
   },
   {

apps/web-antd/src/views/property/resident/unit/unit-modal.vue

@@ -1,23 +1,23 @@
 <script setup lang="ts">
-import { computed, ref } from 'vue';
+import { computed, ref } from 'vue'
 
-import { useVbenModal } from '@vben/common-ui';
+import { useVbenModal } from '@vben/common-ui'
-import { $t } from '@vben/locales';
+import { $t } from '@vben/locales'
-import {cloneDeep, handleNode} from '@vben/utils';
+import { cloneDeep, handleNode } from '@vben/utils'
 
-import { useVbenForm } from '#/adapter/form';
+import { useVbenForm } from '#/adapter/form'
-import { resident_unitAdd, resident_unitInfo, resident_unitUpdate } from '#/api/property/resident/unit';
+import { resident_unitAdd, resident_unitInfo, resident_unitUpdate } from '#/api/property/resident/unit'
-import { defaultFormValueGetter, useBeforeCloseDiff } from '#/utils/popup';
+import { defaultFormValueGetter, useBeforeCloseDiff } from '#/utils/popup'
 
-import { modalSchema } from './data';
+import { modalSchema } from './data'
-import {communityTree} from "#/api/property/community";
+import { communityTree } from "#/api/property/community"
 
-const emit = defineEmits<{ reload: [] }>();
+const emit = defineEmits<{ reload: [] }>()
 
-const isUpdate = ref(false);
+const isUpdate = ref(false)
 const title = computed(() => {
-  return isUpdate.value ? $t('pages.common.edit') : $t('pages.common.add');
+  return isUpdate.value ? $t('pages.common.edit') : $t('pages.common.add')
-});
+})
 
 const [BasicForm, formApi] = useVbenForm({
   commonConfig: {
@@ -33,14 +33,14 @@ const [BasicForm, formApi] = useVbenForm({
   schema: modalSchema(),
   showDefaultActions: false,
   wrapperClass: 'grid-cols-2',
-});
+})
 
 const { onBeforeClose, markInitialized, resetInitialized } = useBeforeCloseDiff(
   {
     initializedGetter: defaultFormValueGetter(formApi),
     currentGetter: defaultFormValueGetter(formApi),
   },
-);
+)
 
 const [BasicModal, modalApi] = useVbenModal({
   // 在这里更改宽度
@@ -51,53 +51,57 @@ const [BasicModal, modalApi] = useVbenModal({
   onConfirm: handleConfirm,
   onOpenChange: async (isOpen) => {
     if (!isOpen) {
-      return null;
+      return null
     }
-    modalApi.modalLoading(true);
+    modalApi.modalLoading(true)
 
-    const { id } = modalApi.getData() as { id?: number | string };
+    const { id } = modalApi.getData() as { id?: number | string }
-    isUpdate.value = !!id;
+    isUpdate.value = !!id
     await initLocationOptions()
     if (isUpdate.value && id) {
-      const record = await resident_unitInfo(id);
+      const record = await resident_unitInfo(id)
-      await formApi.setValues(record);
+      await formApi.setValues(record)
     }
-    await markInitialized();
+    await markInitialized()
 
-    modalApi.modalLoading(false);
+    modalApi.modalLoading(false)
   },
-});
+})
 
 async function handleConfirm() {
   try {
-    modalApi.lock(true);
+    modalApi.lock(true)
-    const { valid } = await formApi.validate();
+    const { valid } = await formApi.validate()
     if (!valid) {
-      return;
+      return
     }
     // getValues获取为一个readonly的对象 需要修改必须先深拷贝一次
-    const data = cloneDeep(await formApi.getValues());
+    const data = cloneDeep(await formApi.getValues())
-    await (isUpdate.value ? resident_unitUpdate(data) : resident_unitAdd(data));
+
-    resetInitialized();
+    data.authBegDate = data.authTime[0]
-    emit('reload');
+    data.authEndDate = data.authTime[1]
-    modalApi.close();
+
+    await (isUpdate.value ? resident_unitUpdate(data) : resident_unitAdd(data))
+    resetInitialized()
+    emit('reload')
+    modalApi.close()
   } catch (error) {
-    console.error(error);
+    console.error(error)
   } finally {
-    modalApi.lock(false);
+    modalApi.lock(false)
   }
 }
 /**
  * 入驻位置数据
  */
 async function initLocationOptions() {
-  const locationList = await communityTree(5);
+  const locationList = await communityTree(5)
-  const splitStr = '/';
+  const splitStr = '/'
   handleNode(locationList, 'label', splitStr, function (node: any) {
     if (node.level != 5) {
-      node.disabled = true;
+      node.disabled = true
     }
-  });
+  })
   formApi.updateSchema([
     {
       componentProps: () => ({
@@ -120,12 +124,12 @@ async function initLocationOptions() {
       }),
       fieldName: 'location',
     },
-  ]);
+  ])
 }
 
 async function handleClosed() {
-  await formApi.resetForm();
+  await formApi.resetForm()
-  resetInitialized();
+  resetInitialized()
 }
 </script>
 

apps/web-antd/src/views/property/visitorManagement/visitorInvitation/data.ts

@@ -185,6 +185,12 @@ export const modalSchema: FormSchemaGetter = () => [
     label: '车牌号',
     fieldName: 'licensePlate',
     component: 'Input',
+    rules: 'required',
+    dependencies: {
+      // 类型不为按钮时显示
+      show: (values) => values.bookingParkingSpace === '0',
+      triggerFields: ['bookingParkingSpace'],
+    },
   },
   // {
   //   label: '人脸图片',

apps/web-antd/src/views/property/visitorManagement/visitorTodo/index.vue

@@ -91,6 +91,7 @@ async function handleDelete(row: Required<VisitorManagementForm>) {
             placement="left"
             title="确认审核状态？"
             @confirm="handleDelete(row)"
+            v-if="row.serveStatus === '0'"
           >
             <ghost-button
               @click.stop=""

apps/web-antd/src/views/property/waterPower/waterCost/index.vue

@@ -68,7 +68,6 @@ const [BasicTable, tableApi] = useVbenVxeGrid({
 .box{
   display: grid;
   grid-template-columns: 1fr 3fr;
-  gap: 30px;
 
   .right {
     width: 100%;

apps/web-antd/src/views/property/waterPower/waterQOQ/index.vue

@@ -68,6 +68,5 @@ const [BasicTable, tableApi] = useVbenVxeGrid({
 .box{
   display: grid;
   grid-template-columns: 1fr 3fr;
-  gap: 30px;
 }
 </style>

apps/web-antd/src/views/property/waterPower/waterTrend/index.vue

@@ -198,7 +198,7 @@ onMounted(()=>{
 <div class="box">
   <div class="left"><FloorTree></FloorTree></div>
   <div class="right">
-    <div style="background: #fff;border-radius: 8px;padding: 10px;margin-top: 10px;">
+    <div style="background: #fff;border-radius: 8px;padding: 10px;">
       <div>
         <div style="display: flex;justify-content: space-between;">
           <DatePicker
@@ -207,9 +207,9 @@ onMounted(()=>{
             picker="month"
           />当月能耗总值：30.00t</div>
       </div>
-      <div id="month" style="height: 250px;width: 100%;"></div>
+      <div id="month" style="height: 350px;width: 100%;"></div>
     </div>
-    <div style="background: #fff;border-radius: 8px;padding: 10px;margin-top: 10px;">
+    <div style="background: #fff;border-radius: 8px;padding: 10px;margin-top: 16px;">
       <div>
         <div style="display: flex;justify-content: space-between;">
           <DatePicker
@@ -218,7 +218,7 @@ onMounted(()=>{
             picker="year"
           />当年能耗总值：59.00t</div>
       </div>
-      <div id="year" style="height: 250px;width: 100%;"></div>
+      <div id="year" style="height: 350px;width: 100%;"></div>
     </div>
   </div>
 </div>
@@ -228,7 +228,7 @@ onMounted(()=>{
 .box{
   display: grid;
   grid-template-columns: 1fr 3fr;
-  gap: 30px;
+  gap: 16px;
-  padding: 10px;
+  padding: 16px;
 }
 </style>

apps/web-antd/src/views/property/waterPower/waterYOY/index.vue

@@ -134,7 +134,7 @@ const data = [...Array(32)].map((_, i) => ({
   <div class="box">
     <div class="left"><FloorTree></FloorTree></div>
     <div class="right">
-      <div style="background: #fff;border-radius: 8px;padding: 10px;margin-bottom: 10px;">
+      <div style="background: #fff;border-radius: 8px;padding: 10px;margin-bottom: 16px;">
         <div>
           年份
           <DatePicker
@@ -156,7 +156,7 @@ const data = [...Array(32)].map((_, i) => ({
           :columns="columns"
           :data-source="data"
           :pagination="false"
-          :scroll="{ y: 270 }"
+          :scroll="{ y: '50vh' }"
         />
       </div>
     </div>
@@ -167,7 +167,7 @@ const data = [...Array(32)].map((_, i) => ({
 .box{
   display: grid;
   grid-template-columns: 1fr 3fr;
-  gap: 30px;
+  gap: 16px;
-  padding: 10px;
+  padding: 16px;
 }
 </style>