Explorar o código

巡检项、巡检路线添加组织树

lipenghui hai 1 mes
pai
achega
95508f5389

+ 2 - 0
src/views/pms/inspect/item/IotInspectItemForm.vue

@@ -154,6 +154,8 @@ const submitForm = async () => {
   // 提交请求
   formLoading.value = true
   try {
+    const user = wsCache.get(CACHE_KEY.USER)
+    formData.value.deptId = user.user.deptId
     const data = formData.value as unknown as IotInspectItemVO
     if (formType.value === 'create') {
       await IotInspectItemApi.createIotInspectItem(data)

+ 14 - 1
src/views/pms/inspect/item/index.vue

@@ -1,4 +1,11 @@
 <template>
+  <el-row :gutter="20">
+    <el-col :span="4" :xs="24">
+      <ContentWrap class="h-1/1">
+        <DeptTree @node-click="handleDeptNodeClick" />
+      </ContentWrap>
+    </el-col>
+  <el-col :span="20" :xs="24">
   <ContentWrap>
     <!-- 搜索工作栏 -->
     <el-form
@@ -119,6 +126,8 @@
       @pagination="getList"
     />
   </ContentWrap>
+  </el-col>
+    </el-row>
 
   <!-- 表单弹窗:添加/修改 -->
   <IotInspectItemForm ref="formRef" @success="getList" />
@@ -131,6 +140,7 @@ import { IotInspectItemApi, IotInspectItemVO } from '@/api/pms/inspect/item'
 import IotInspectItemForm from './IotInspectItemForm.vue'
 import {defaultProps, handleTree} from "@/utils/tree";
 import * as ProductClassifyApi from "@/api/pms/productclassify";
+import DeptTree from "@/views/system/user/DeptTree.vue";
 
 /** 巡检项 列表 */
 defineOptions({ name: 'IotInspectItem' })
@@ -155,7 +165,10 @@ const queryParams = reactive({
 const productClassifyList = ref<Tree[]>([]) // 树形结构
 const queryFormRef = ref() // 搜索的表单
 const exportLoading = ref(false) // 导出的加载中
-
+const handleDeptNodeClick = async (row) => {
+  queryParams.deptId = row.id
+  await getList()
+}
 /** 查询列表 */
 const getList = async () => {
   loading.value = true

+ 44 - 5
src/views/pms/inspect/plan/InspectRouteList.vue

@@ -50,6 +50,25 @@
         </el-form-item>
       </el-form>
     </ContentWrap>
+    <!-- 新增:已选物料标签区域 -->
+    <ContentWrap v-if="selectedRows.length > 0"
+                 style="margin: -10px 0px 10px; padding: 10px 15px; background: #f8fafc; border-radius: 4px; border: 1px solid #ebeef5;">
+      <div style="display: flex; align-items: center; flex-wrap: wrap; gap: 8px;">
+        <div style="font-weight: bold; color: #606266; margin-right: 10px;">已选物料:</div>
+        <el-tag
+          v-for="item in selectedRows"
+          :key="item.id"
+          @close="removeTag(item)"
+          style="margin-bottom: 5px; position: relative; padding-right: 25px;"
+        >
+          {{ item.deviceCode }}-{{ item.routeName }}
+          <!-- 自定义关闭按钮 -->
+          <span class="close-icon" @click.stop="removeTag(item)">
+            <Icon icon="ep:close" style="font-size: 12px; position: absolute; right: 8px; top: 50%; transform: translateY(-50%);"/>
+          </span>
+        </el-tag>
+      </div>
+    </ContentWrap>
     <ContentWrap>
       <el-table
         ref="tableRef"
@@ -61,11 +80,15 @@
         row-key="id"
         @selection-change="handleSelectionChange"
       >
-        <el-table-column
-          type="selection"
-          :reserve-selection="true"
-          :selectable="(row) => !row.disabled"
-        />
+        <el-table-column width="80" :label="t('workOrderMaterial.select')">
+          <template #default="{ row }">
+            <el-checkbox
+              :model-value="selectedRows.some(item => item.id === row.id&&item.deviceCode===row.deviceCode)"
+              @click.stop="selectRow(row)"
+              class="no-label-radio"
+            />
+          </template>
+        </el-table-column>
         <el-table-column :label="t('iotDevice.code')" align="center" prop="deviceCode" />
         <el-table-column :label="t('iotDevice.name')" align="center" prop="deviceName" />
         <el-table-column :label="t('route.RouteName')" align="center" prop="routeName" />
@@ -130,6 +153,22 @@ const queryParams = reactive({
   routeName: undefined,
 })
 
+// 新增:移除标签方法
+const removeTag = (route) => {
+  // 从已选列表中移除
+  const index = selectedRows.value.findIndex(item => item.id === route.id&&item.deviceCode === route.deviceCode);
+  debugger
+  if (index !== -1) {
+    selectedRows.value.splice(index, 1);
+  }
+
+  // 如果当前行在当前页,取消其选中状态
+  const rowInTable = list.value.find(item => item.id === route.id&&item.deviceCode === route.deviceCode);
+  if (rowInTable) {
+    const rowIndex = list.value.indexOf(rowInTable);
+    // 这里可以添加逻辑强制更新行状态(如果需要)
+  }
+};
 const handleConfirm = () => {
   if (selectedRows.value.length === 0) {
     ElMessage.warning('请至少选择一个')

+ 48 - 5
src/views/pms/inspect/route/InspectItemList.vue

@@ -43,6 +43,25 @@
         </el-form-item>
       </el-form>
     </ContentWrap>
+    <!-- 新增:已选物料标签区域 -->
+    <ContentWrap v-if="selectedRows.length > 0"
+                 style="margin: -10px 0px 10px; padding: 10px 15px; background: #f8fafc; border-radius: 4px; border: 1px solid #ebeef5;">
+      <div style="display: flex; align-items: center; flex-wrap: wrap; gap: 8px;">
+        <div style="font-weight: bold; color: #606266; margin-right: 10px;">已选物料:</div>
+        <el-tag
+          v-for="item in selectedRows"
+          :key="item.id"
+          @close="removeTag(item)"
+          style="margin-bottom: 5px; position: relative; padding-right: 25px;"
+        >
+          {{ item.item }}
+          <!-- 自定义关闭按钮 -->
+          <span class="close-icon" @click.stop="removeTag(item)">
+            <Icon icon="ep:close" style="font-size: 12px; position: absolute; right: 8px; top: 50%; transform: translateY(-50%);"/>
+          </span>
+        </el-tag>
+      </div>
+    </ContentWrap>
     <ContentWrap>
       <el-table
         ref="tableRef"
@@ -54,11 +73,20 @@
         row-key="id"
         @selection-change="handleSelectionChange"
       >
-        <el-table-column
-          type="selection"
-          :reserve-selection="true"
-          :selectable="(row) => !row.disabled"
-        />
+<!--        <el-table-column-->
+<!--          type="selection"-->
+<!--          :reserve-selection="true"-->
+<!--          :selectable="(row) => !row.disabled"-->
+<!--        />-->
+        <el-table-column width="80" :label="t('workOrderMaterial.select')">
+          <template #default="{ row }">
+            <el-checkbox
+              :model-value="selectedRows.some(item => item.id === row.id&&item.deviceCode===row.deviceCode)"
+              @click.stop="selectRow(row)"
+              class="no-label-radio"
+            />
+          </template>
+        </el-table-column>
         <el-table-column :label="t('inspect.InspectionItems')" align="center" prop="item" />
         <el-table-column :label="t('inspect.InspectionStandards')" align="center" prop="standard" />
         <el-table-column :label="t('fileInfo.appendix')" align="center" prop="urls">
@@ -113,6 +141,21 @@ const openWeb = (url) => {
     'http://1.94.244.160:8012/onlinePreview?url=' + encodeURIComponent(Base64.encode(url))
   )
 }
+const removeTag = (route) => {
+  // 从已选列表中移除
+  const index = selectedRows.value.findIndex(item => item.id === route.id);
+  debugger
+  if (index !== -1) {
+    selectedRows.value.splice(index, 1);
+  }
+
+  // 如果当前行在当前页,取消其选中状态
+  const rowInTable = list.value.find(item => item.id === route.id);
+  if (rowInTable) {
+    const rowIndex = list.value.indexOf(rowInTable);
+    // 这里可以添加逻辑强制更新行状态(如果需要)
+  }
+};
 const toggleAll = () => {
   list.value.forEach((row) => {
     tableRef.value.toggleRowSelection(row, true)

+ 2 - 2
src/views/pms/inspect/route/IotInspectRoute.vue

@@ -252,8 +252,8 @@ const submitForm = async () => {
   // 提交请求
   formLoading.value = true
   try {
-    // const user = wsCache.get(CACHE_KEY.USER)
-    // formData.value.deptId = user.user.deptId
+    const user = wsCache.get(CACHE_KEY.USER)
+    formData.value.deptId = user.user.deptId
     const data = formData.value as unknown as IotInspectRouteVO
     if (formType.value === 'create') {
       const newitems = itemsWithIndex

+ 32 - 5
src/views/pms/inspect/route/index.vue

@@ -1,4 +1,11 @@
 <template>
+  <el-row :gutter="20">
+    <el-col :span="4" :xs="24">
+      <ContentWrap class="h-1/1">
+        <DeptTree @node-click="handleDeptNodeClick" />
+      </ContentWrap>
+    </el-col>
+    <el-col :span="20" :xs="24">
   <ContentWrap>
     <!-- 搜索工作栏 -->
     <el-form
@@ -17,13 +24,24 @@
           class="!w-240px"
         />
       </el-form-item>
-      <el-form-item :label="t('monitor.category')" prop="deviceClassify">
-        <el-input
+<!--      <el-form-item :label="t('monitor.category')" prop="deviceClassify">-->
+<!--        <el-input-->
+<!--          v-model="queryParams.deviceClassify"-->
+<!--          :placeholder="t('deviceForm.categoryHolder')"-->
+<!--          clearable-->
+<!--          @keyup.enter="handleQuery"-->
+<!--          class="!w-240px"-->
+<!--        />-->
+<!--      </el-form-item>-->
+      <el-form-item :label="t('monitor.category')" prop="deviceClassify" style="width: 15vw" >
+        <el-tree-select
           v-model="queryParams.deviceClassify"
+          :data="productClassifyList"
+          :props="defaultProps"
+          check-strictly
+          node-key="id"
           :placeholder="t('deviceForm.categoryHolder')"
-          clearable
-          @keyup.enter="handleQuery"
-          class="!w-240px"
+          filterable
         />
       </el-form-item>
       <el-form-item :label="t('monitor.deviceName')"  prop="deviceName">
@@ -110,6 +128,8 @@
       @pagination="getList"
     />
   </ContentWrap>
+    </el-col>
+  </el-row>
 
   <!-- 表单弹窗:添加/修改 -->
   <IotInspectRouteForm ref="formRef" @success="getList" />
@@ -120,6 +140,8 @@ import { dateFormatter } from '@/utils/formatTime'
 import download from '@/utils/download'
 import { IotInspectRouteApi, IotInspectRouteVO } from '@/api/pms/inspect/route'
 import IotInspectRouteForm from './IotInspectRouteForm.vue'
+import DeptTree from "@/views/system/user/DeptTree.vue";
+import {defaultProps} from "@/utils/tree";
 const { push } = useRouter() // 路由跳转
 /** 巡检路线 列表 */
 defineOptions({ name: 'IotInspectRoute' })
@@ -130,6 +152,7 @@ const { t } = useI18n() // 国际化
 const loading = ref(true) // 列表的加载中
 const list = ref<IotInspectRouteVO[]>([]) // 列表的数据
 const total = ref(0) // 列表的总页数
+const productClassifyList = ref<Tree[]>([]) // 树形结构
 const queryParams = reactive({
   pageNo: 1,
   pageSize: 10,
@@ -146,6 +169,10 @@ const queryParams = reactive({
 const queryFormRef = ref() // 搜索的表单
 const exportLoading = ref(false) // 导出的加载中
 
+const handleDeptNodeClick = async (row) => {
+  queryParams.deptId = row.id
+  await getList()
+}
 /** 查询列表 */
 const getList = async () => {
   loading.value = true