Selaa lähdekoodia

巡检路线调整选中项

lipenghui 3 kuukautta sitten
vanhempi
commit
33fd52d82b

+ 29 - 30
src/views/pms/device/index.vue

@@ -44,8 +44,7 @@
             />
           </el-form-item>
 
-
-          <el-form-item v-show="ifShow" label="设备状态" label-width="85px"  prop="deviceStatus">
+          <el-form-item v-show="ifShow" label="设备状态" label-width="85px" prop="deviceStatus">
             <el-select
               v-model="queryParams.deviceStatus"
               placeholder="设备状态"
@@ -77,16 +76,23 @@
             </el-select>
           </el-form-item>
 
-
           <el-form-item>
-            <el-button v-if="!ifShow" @click="moreQuery(true)" type="warning"><Icon icon="ep:search" class="mr-5px"/> 更多查询</el-button>
-            <el-button v-if="ifShow" @click="moreQuery(false)" type="danger"><Icon icon="ep:search" class="mr-5px"/> 收起查询</el-button>
-            <el-button @click="handleQuery"><Icon icon="ep:search" class="mr-5px" /> 搜索</el-button>
-            <el-button @click="resetQuery"><Icon icon="ep:refresh" class="mr-5px" /> 重置</el-button>
+            <el-button v-if="!ifShow" @click="moreQuery(true)" type="warning"
+              ><Icon icon="ep:search" class="mr-5px" /> 更多查询</el-button
+            >
+            <el-button v-if="ifShow" @click="moreQuery(false)" type="danger"
+              ><Icon icon="ep:search" class="mr-5px" /> 收起查询</el-button
+            >
+            <el-button @click="handleQuery"
+              ><Icon icon="ep:search" class="mr-5px" /> 搜索</el-button
+            >
+            <el-button @click="resetQuery"
+              ><Icon icon="ep:refresh" class="mr-5px" /> 重置</el-button
+            >
             <el-button
               type="primary"
               plain
-              @click="openForm('create',undefined,queryParams.deptId)"
+              @click="openForm('create', undefined, queryParams.deptId)"
               v-hasPermi="['rq:iot-device:create']"
             >
               <Icon icon="ep:plus" class="mr-5px" /> 新增
@@ -108,15 +114,15 @@
       <ContentWrap>
         <el-table v-loading="loading" :data="list" :stripe="true" :show-overflow-tooltip="true">
           <el-table-column label="资产编码" align="center" prop="deviceCode" />
-          <el-table-column label="设备名称" align="center" prop="deviceName" >
+          <el-table-column label="设备名称" align="center" prop="deviceName">
             <template #default="scope">
               <el-link :underline="false" type="primary" @click="handleDetail(scope.row.id)">
                 {{ scope.row.deviceName }}
               </el-link>
             </template>
-    <!--        <template #default="{ row }">-->
-    <!--          <div class="custom-cell">{{ row.deviceName }}</div>-->
-    <!--        </template>-->
+            <!--        <template #default="{ row }">-->
+            <!--          <div class="custom-cell">{{ row.deviceName }}</div>-->
+            <!--        </template>-->
           </el-table-column>
           <el-table-column label="所在部门" align="center" prop="deptName" />
           <el-table-column label="设备状态" align="center" prop="deviceStatus">
@@ -165,11 +171,7 @@
               >
                 删除
               </el-button>
-              <el-button
-                link
-                type="warning"
-                @click="handleUpload(scope.row.id)"
-              >
+              <el-button link type="warning" @click="handleUpload(scope.row.id)">
                 资料上传
               </el-button>
             </template>
@@ -186,18 +188,16 @@
     </el-col>
   </el-row>
   <!-- 表单弹窗:添加/修改 -->
-<!--  <IotDeviceForm ref="formRef" @success="getList" />-->
+  <!--  <IotDeviceForm ref="formRef" @success="getList" />-->
 </template>
 
 <script setup lang="ts">
 import download from '@/utils/download'
 import { IotDeviceApi, IotDeviceVO } from '@/api/pms/device'
-import IotDeviceForm from './IotDeviceForm.vue'
-import {DICT_TYPE, getIntDictOptions, getStrDictOptions} from "@/utils/dict";
-import {dateFormatter} from "@/utils/formatTime";
-import PmsTree from "@/views/system/tree/PmsTree.vue";
-import DeptTree from "@/views/system/user/DeptTree.vue";
-import {CACHE_KEY, useCache} from "@/hooks/web/useCache";
+import { DICT_TYPE, getStrDictOptions } from '@/utils/dict'
+import { dateFormatter } from '@/utils/formatTime'
+import DeptTree from '@/views/system/user/DeptTree.vue'
+import { CACHE_KEY, useCache } from '@/hooks/web/useCache'
 
 /** 设备台账 列表 */
 defineOptions({ name: 'IotDevicePms' })
@@ -283,11 +283,11 @@ const formRef = ref()
 const openForm = (type: string, id?: number) => {
   //修改
   if (typeof id === 'number') {
-    push({ name: 'DeviceDetailEdit', params: {id } })
+    push({ name: 'DeviceDetailEdit', params: { id } })
     return
   }
   // 新增
-  push({ name: 'DeviceDetailAdd', params:{} })
+  push({ name: 'DeviceDetailAdd', params: {} })
 }
 
 /** 删除按钮操作 */
@@ -304,11 +304,11 @@ const handleDelete = async (id: number) => {
 }
 
 const handleDetail = (id: number) => {
-  push({ name: 'DeviceDetailInfo', params:{id} })
+  push({ name: 'DeviceDetailInfo', params: { id } })
 }
 
 const handleUpload = (id: number) => {
-  push({ name: 'DeviceUpload', params:{id} })
+  push({ name: 'DeviceUpload', params: { id } })
 }
 
 /** 导出按钮操作 */
@@ -333,5 +333,4 @@ onMounted(() => {
   getList()
 })
 </script>
-<style scoped>
-</style>
+<style scoped></style>

+ 40 - 22
src/views/pms/inspect/route/InspectItemList.vue

@@ -21,6 +21,8 @@
           <el-button @click="handleQuery"><Icon icon="ep:search" class="mr-5px" /> 搜索</el-button>
           <el-button @click="resetQuery"><Icon icon="ep:refresh" class="mr-5px" /> 重置</el-button>
           <el-button @click="handleConfirm" type="danger"><Icon icon="ep:check" class="mr-5px" /> 确认选择</el-button>
+          <el-button @click="toggleAll" type="primary"><Icon icon="ep:refresh" class="mr-5px" />全选</el-button>
+          <el-button @click="invertSelection" type="info"><Icon icon="ep:refresh" class="mr-5px" />取消全选</el-button>
         </el-form-item>
       </el-form>
     </ContentWrap>
@@ -32,16 +34,23 @@
         :stripe="true"
         :show-overflow-tooltip="true"
         @row-click="handleRowClick"
+        row-key="id"
+        @selection-change="handleSelectionChange"
       >
-        <el-table-column width="60" label="选择">
-          <template #default="{ row }">
-            <el-checkbox
-              :model-value="selectedRows.some(item => item.id === row.id)"
-              @click.stop="toggleRow(row)"
-              class="no-label-radio"
-            />
-          </template>
-        </el-table-column>
+<!--        <el-table-column width="60" label="选择" type="selection" :reserve-selection="true">-->
+<!--          <template #default="{ row }">-->
+<!--            <el-checkbox-->
+<!--              :model-value="selectedRows.some(item => item.id === row.id)"-->
+<!--              @click.stop="toggleRow(row)"-->
+<!--              class="no-label-radio"-->
+<!--            />-->
+<!--          </template>-->
+<!--        </el-table-column>-->
+        <el-table-column
+          type="selection"
+          :reserve-selection="false"
+          :selectable="row => !row.disabled"
+        />
         <el-table-column label="巡检项" align="center" prop="item" />
         <el-table-column label="巡检标准" align="center" prop="standard" />
         <el-table-column
@@ -84,32 +93,40 @@ const queryParams = reactive({
   deviceClassify: undefined,
   deviceId: undefined,
 })
+const toggleAll = () => {
+  list.value.forEach(row => {
+    tableRef.value.toggleRowSelection(row, true);
+  });
+
+};
+const handleSelectionChange = (val) => {
 
+  selectedRows.value = val;
+};
+const invertSelection = () => {
+  selectedRows.value.forEach(row => {
+    tableRef.value.toggleRowSelection(row, false);
+    selectedRows.value.splice(row);
+  });
+};
 const selectedRows = ref<IotInspectItemVO[]>([]); // 多选数据(存储所有选中行的数组)
 const tableRef = ref();
-// 处理单选逻辑
-const selectRow = (row) => {
-  selectedRow.value = selectedRow.value?.id === row.id ? null : row
-  emit('choose', row)
-  dialogVisible.value = false
-}
 
 // 多选 切换行选中状态
 const toggleRow = (row) => {
-  const index = selectedRows.value.findIndex(item => item.id === row.id);
-  if (index > -1) {
-    selectedRows.value.splice(index, 1); // 取消选中
-  } else {
-    selectedRows.value.push(row); // 选中
-  }
+  debugger
+  selectedRows.value.push(row); // 选中
+  tableRef.value.toggleRowSelection(row, true);
 };
 
 // 点击整行选中
 const handleRowClick = (row) => {
+
   toggleRow(row)
 }
 const open = async (classify, id) => {
   dialogVisible.value = true
+  selectedRows.value = []
   if (id) {
     queryParams.deviceId = id;
   } else {
@@ -125,7 +142,7 @@ const getList = async () => {
     const user = wsCache.get(CACHE_KEY.USER)
     queryParams.deptId = user.user.deptId
     console.log(JSON.stringify(queryParams))
-    debugger
+
     const data = await IotInspectItemApi.getIotInspectItemPage(queryParams)
     list.value = data.list
     total.value = data.total
@@ -139,6 +156,7 @@ const handleConfirm = () => {
     ElMessage.warning('请至少选择一个巡检项')
     return
   }
+
   // emit('choose', selectedRows.value);
   emit('choose', selectedRows.value.map(row => ({
     ...row,

+ 1 - 0
src/views/pms/inspect/route/IotInspectRoute.vue

@@ -176,6 +176,7 @@ const formRules = reactive({
 
 const formRef = ref() // 表单 Ref
 const inspectItemChoose = (rows) => {
+  items.value = []
   items.value = rows
 }
 const inspectItemFormRef = ref()