1、巡检计划

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

@@ -1,14 +1,8 @@
 <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,
@@ -18,13 +12,16 @@ import {
 import {
   inspectionPlanExport,
   inspectionPlanList,
-  inspectionPlanRemove,
+  inspectionPlanRemove, inspectionPlanUpdate,
 } from '#/api/property/inspectionManagement/inspectionPlan';
 import type { InspectionPlanForm } from '#/api/property/inspectionManagement/inspectionPlan/model';
 import { commonDownloadExcel } from '#/utils/file/download';
 
 import inspectionPlanModal from './inspectionPlan-modal.vue';
+import inspectionPlanDetail from './plan-detail.vue';
 import { columns, querySchema } from './data';
+import {TableSwitch} from "#/components/table";
+import {useAccess} from "@vben/access";
 
 const formOptions: VbenFormProps = {
   commonConfig: {
@@ -35,15 +32,6 @@ const formOptions: VbenFormProps = {
   },
   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 = {
@@ -55,8 +43,6 @@ const gridOptions: VxeGridProps = {
     // 点击行选中
     // trigger: 'row',
   },
-  // 需要使用i18n注意这里要改成getter形式 否则切换语言不会刷新
-  // columns: columns(),
   columns,
   height: 'auto',
   keepSource: true,
@@ -87,11 +73,18 @@ const [BasicTable, tableApi] = useVbenVxeGrid({
 const [InspectionPlanModal, modalApi] = useVbenModal({
   connectedComponent: inspectionPlanModal,
 });
+const [InspectionPlanDetail, detailApi] = useVbenModal({
+  connectedComponent: inspectionPlanDetail,
+});
 
 function handleAdd() {
   modalApi.setData({});
   modalApi.open();
 }
+function handleInfo(row: Required<InspectionPlanForm>) {
+  detailApi.setData({ id: row.id });
+  detailApi.open();
+}
 
 async function handleEdit(row: Required<InspectionPlanForm>) {
   modalApi.setData({ id: row.id });
@@ -122,6 +115,7 @@ function handleDownloadExcel() {
     fieldMappingTime: formOptions.fieldMappingTime,
   });
 }
+const { hasAccessByCodes } = useAccess();
 </script>
 
 <template>
@@ -154,6 +148,12 @@ function handleDownloadExcel() {
       </template>
       <template #action="{ row }">
         <Space>
+          <ghost-button
+            v-access:code="['property:inspectionPlan:info']"
+            @click.stop="handleInfo(row)"
+          >
+            {{ $t('pages.common.info') }}
+          </ghost-button>
           <ghost-button
             v-access:code="['property:inspectionPlan:edit']"
             @click.stop="handleEdit(row)"
@@ -176,7 +176,20 @@ function handleDownloadExcel() {
           </Popconfirm>
         </Space>
       </template>
+      <template #state="{row}">
+        <TableSwitch
+          checkedValue="0"
+          unCheckedValue="1"
+          checkedText="启用"
+          unCheckedText="停用"
+          v-model:value="row.state"
+          :api="() => inspectionPlanUpdate(row)"
+          :disabled="!hasAccessByCodes(['property:inspectionPlan:edit'])"
+          @reload="() => tableApi.query()"
+        />
+      </template>
     </BasicTable>
     <InspectionPlanModal @reload="tableApi.query()" />
+    <InspectionPlanDetail/>
   </Page>
 </template>