feat(dms): 添加设备巡检状态查看功能

- 在工单列表操作列添加查看设备巡检状态按钮
- 实现设备巡检状态弹窗展示已完成、待巡检、巡检中、异常等统计信息
- 集成设备明细表格展示设备名称、巡检步骤、巡检状态等详细信息
- 添加巡检状态筛选功能支持按状态过滤设备列表
- 新增 API 接口获取巡检实例详情列表数据
- 优化表格样式和标签颜色显示提升用户体验

src/api/dms/dmsInspectInstanceDetail/types.ts

@@ -59,6 +59,8 @@ export interface DmsInspectInstanceDetailVO {
    */
   remark: string;
 
+  machineName?: string;
+
 }
 
 export interface DmsInspectInstanceDetailForm extends BaseEntity {
@@ -122,6 +124,8 @@ export interface DmsInspectInstanceDetailForm extends BaseEntity {
    */
   remark?: string;
 
+  machineName?: string;
+
 }
 
 export interface DmsInspectInstanceDetailQuery extends PageQuery {
@@ -185,6 +189,8 @@ export interface DmsInspectInstanceDetailQuery extends PageQuery {
      * 日期范围参数
      */
     params?: any;
+
+  machineName?: string;
 }
 
 

src/views/dms/dmsBillsInspectInstance/index.vue

@@ -127,7 +127,7 @@
           </template>
         </el-table-column>
         <el-table-column label="备注" align="center" prop="remark" v-if="columns[12].visible"/>
-        <el-table-column label="操作" align="center" class-name="small-padding fixed-width">
+        <el-table-column label="操作" align="center" class-name="small-padding fixed-width" width="180">
           <template #default="scope">
             <!--            <el-tooltip content="修改" placement="top">-->
             <!--              <el-button link type="primary" icon="Edit" @click="handleUpdate(scope.row)" v-hasPermi="['dms:dmsBillsInspectInstance:edit']"></el-button>-->
@@ -135,10 +135,13 @@
             <!--            <el-tooltip content="删除" placement="top">-->
             <!--              <el-button link type="primary" icon="Delete" @click="handleDelete(scope.row)" v-hasPermi="['dms:dmsBillsInspectInstance:remove']"></el-button>-->
             <!--            </el-tooltip>-->
+            <!-- 查看设备按钮 -->
+            <el-tooltip content="查看设备巡检状态" placement="top">
+              <el-button link type="primary" icon="List" @click="handleViewDevices(scope.row)"></el-button>
+            </el-tooltip>
             <!-- 启动工单按钮 -->
             <el-tooltip content="启动工单" placement="top" v-if="!scope.row.wfDefinitionId">
-              <el-button link type="success" icon="View" @click="handleStartWorkflow(scope.row)">
+              <el-button link type="success" icon="View" @click="handleStartWorkflow(scope.row)"></el-button>
-              </el-button>
             </el-tooltip>
           </template>
         </el-table-column>
@@ -153,6 +156,98 @@
       :task-variables="taskVariables"
       @submit-callback="submitCallback" />
 
+    <!-- 设备巡检状态弹窗 -->
+    <el-dialog
+      v-model="detailDialogVisible"
+      :title="`设备巡检状态 - ${currentInspectInstance?.billsInspectCode || ''}`"
+      width="90%"
+      append-to-body
+    >
+      <el-card shadow="never" class="detail-summary-card">
+        <div class="detail-summary">
+          <el-tag type="success" size="large" effect="dark">
+            已完成: {{ completedCount }}台
+          </el-tag>
+          <el-tag type="warning" size="large" effect="dark" class="ml-2">
+            待巡检: {{ pendingCount }}台
+          </el-tag>
+          <el-tag type="primary" size="large" effect="dark" class="ml-2">
+            巡检中: {{ inspectingCount }}台
+          </el-tag>
+          <el-tag size="large" effect="dark" class="ml-2">
+            总计: {{ totalCount }}台
+          </el-tag>
+          <el-tag type="danger" size="large" effect="dark" class="ml-2" v-if="abnormalCount > 0">
+            异常: {{ abnormalCount }}台
+          </el-tag>
+        </div>
+      </el-card>
+
+      <el-card shadow="never" class="mt-3">
+        <el-form :inline="true">
+          <el-form-item label="巡检状态">
+            <el-select v-model="detailStatusFilter" placeholder="全部" clearable style="width: 150px">
+              <el-option label="全部" value="" />
+              <el-option
+                v-for="dict in dms_inspect_status"
+                :key="dict.value"
+                :label="dict.label"
+                :value="dict.value"
+              />
+            </el-select>
+          </el-form-item>
+        </el-form>
+        <el-table
+          v-loading="detailLoading"
+          :data="filteredDetailList"
+          border
+          stripe
+          height="400"
+          style="width: 100%"
+        >
+          <el-table-column type="index" label="序号" width="60" align="center" fixed />
+<!--          <el-table-column label="设备编号" prop="machineCode" width="140" align="center" fixed />-->
+          <el-table-column label="设备名称" prop="machineName" min-width="180" align="center" />
+          <el-table-column label="巡检步骤" prop="lineStep" width="90" align="center" />
+          <el-table-column label="巡检状态" width="100" align="center">
+            <template #default="{ row }">
+              <dict-tag :options="dms_inspect_status" :value="row.instanceDetailStatus" />
+            </template>
+          </el-table-column>
+<!--          <el-table-column label="设备状态" width="90" align="center">
+            <template #default="{ row }">
+              <dict-tag :options="inspect_status" :value="row.inspectStatus" v-if="row.instanceDetailStatus === '3'" />
+              <span v-else class="text-gray-400">-</span>
+            </template>
+          </el-table-column>-->
+          <el-table-column label="巡检标准" prop="inspectStandard" min-width="200" align="center" show-overflow-tooltip />
+          <el-table-column label="巡检描述" prop="inspectDesc" min-width="200" align="center" show-overflow-tooltip />
+<!--          <el-table-column label="巡检开始时间" prop="beginTime" width="160" align="center">
+            <template #default="{ row }">
+              <span v-if="row.beginTime">
+                {{ parseTime(row.beginTime, '{y}-{m}-{d} {h}:{i}:{s}') }}
+              </span>
+              <span v-else class="text-gray-400">-</span>
+            </template>
+          </el-table-column>
+          <el-table-column label="巡检结束时间" prop="endTime" width="160" align="center">
+            <template #default="{ row }">
+              <span v-if="row.endTime">
+                {{ parseTime(row.endTime, '{y}-{m}-{d} {h}:{i}:{s}') }}
+              </span>
+              <span v-else class="text-gray-400">-</span>
+            </template>
+          </el-table-column>-->
+          <el-table-column label="备注" prop="remark" min-width="150" align="center" show-overflow-tooltip />
+        </el-table>
+      </el-card>
+      <template #footer>
+        <div class="dialog-footer">
+          <el-button @click="detailDialogVisible = false">关 闭</el-button>
+        </div>
+      </template>
+    </el-dialog>
+
     <!-- 添加或修改点巡检工单对话框 -->
     <el-dialog :title="dialog.title" v-model="dialog.visible" width="500px" append-to-body>
       <el-form ref="dmsBillsInspectInstanceFormRef" :model="form" :rules="rules" label-width="120px">
@@ -240,12 +335,14 @@
 <script setup name="DmsBillsInspectInstance" lang="ts">
 import { listDmsBillsInspectInstance, getDmsBillsInspectInstance, delDmsBillsInspectInstance, addDmsBillsInspectInstance, updateDmsBillsInspectInstance, updateWfDefinitionIdById } from '@/api/dms/dmsBillsInspectInstance';
 import { DmsBillsInspectInstanceVO, DmsBillsInspectInstanceQuery, DmsBillsInspectInstanceForm } from '@/api/dms/dmsBillsInspectInstance/types';
+import { getDmsInspectInstanceDetailList } from '@/api/dms/dmsInspectInstanceDetail';
+import type { DmsInspectInstanceDetailVO } from '@/api/dms/dmsInspectInstanceDetail/types';
 import { useRouter } from 'vue-router';
 import { startWorkFlow } from '@/api/workflow/task'
 import SubmitVerify from '@/components/Process/submitVerify.vue'
 
 const { proxy } = getCurrentInstance() as ComponentInternalInstance;
-const { inspect_type, dms_inspect_status } = toRefs<any>(proxy?.useDict('inspect_type', 'dms_inspect_status'));
+const { inspect_type, dms_inspect_status, inspect_status } = toRefs<any>(proxy?.useDict('inspect_type', 'dms_inspect_status', 'inspect_status'));
 
 const dmsBillsInspectInstanceList = ref<DmsBillsInspectInstanceVO[]>([]);
 const buttonLoading = ref(false);
@@ -256,6 +353,12 @@ const single = ref(true);
 const multiple = ref(true);
 const total = ref(0);
 
+const detailLoading = ref(false);
+const detailList = ref<DmsInspectInstanceDetailVO[]>([]);
+const detailDialogVisible = ref(false);
+const currentInspectInstance = ref<DmsBillsInspectInstanceVO | null>(null);
+const detailStatusFilter = ref('');
+
 const queryFormRef = ref<ElFormInstance>();
 const dmsBillsInspectInstanceFormRef = ref<ElFormInstance>();
 
@@ -336,6 +439,27 @@ const getList = async () => {
   loading.value = false;
 }
 
+/**
+ * 查看设备巡检状态
+ */
+const handleViewDevices = async (row: DmsBillsInspectInstanceVO) => {
+  currentInspectInstance.value = row;
+  detailDialogVisible.value = true;
+  detailStatusFilter.value = '';
+
+  try {
+    detailLoading.value = true;
+    const res = await getDmsInspectInstanceDetailList({ inspectInstanceId: row.inspectInstanceId });
+    detailList.value = res.data || [];
+  } catch (error) {
+    console.error('加载设备明细失败:', error);
+    proxy?.$modal.msgError('加载设备明细失败');
+    detailList.value = [];
+  } finally {
+    detailLoading.value = false;
+  }
+};
+
 /** 取消按钮 */
 const cancel = () => {
   reset();
@@ -486,6 +610,33 @@ const handleWorkflowProgress = (row: DmsBillsInspectInstanceVO) => {
 const submitVerifyRef = ref<InstanceType<typeof SubmitVerify>>();
 const taskVariables = ref<any>({});
 
+const filteredDetailList = computed(() => {
+  if (!detailStatusFilter.value) {
+    return detailList.value;
+  }
+  return detailList.value.filter(item => item.instanceDetailStatus === detailStatusFilter.value);
+});
+
+const completedCount = computed(() => {
+  return detailList.value.filter(d => d.instanceDetailStatus === '3').length;
+});
+
+const pendingCount = computed(() => {
+  return detailList.value.filter(d => d.instanceDetailStatus === '1').length;
+});
+
+const inspectingCount = computed(() => {
+  return detailList.value.filter(d => d.instanceDetailStatus === '2').length;
+});
+
+const abnormalCount = computed(() => {
+  return detailList.value.filter(d => d.instanceDetailStatus === '3' && d.inspectStatus === '0').length;
+});
+
+const totalCount = computed(() => {
+  return detailList.value.length;
+});
+
 // 提交回调 - 处理工作流节点完成后的逻辑
 const submitCallback = async () => {
   try {
@@ -502,3 +653,58 @@ onMounted(() => {
   getList();
 });
 </script>
+
+<style scoped>
+.detail-summary-card {
+  margin-bottom: 16px;
+}
+
+.detail-summary {
+  display: flex;
+  align-items: center;
+  padding: 12px 16px;
+  background: linear-gradient(135deg, #667eea 0%, #764ba2 100%);
+  border-radius: 8px;
+  color: white;
+}
+
+.detail-summary .el-tag {
+  background: rgba(255, 255, 255, 0.2);
+  border: 1px solid rgba(255, 255, 255, 0.3);
+  color: white;
+  font-weight: 600;
+  padding: 8px 16px;
+}
+
+.detail-summary .el-tag--success {
+  background: rgba(103, 194, 58, 0.3);
+  border-color: rgba(103, 194, 58, 0.5);
+}
+
+.detail-summary .el-tag--warning {
+  background: rgba(230, 162, 60, 0.3);
+  border-color: rgba(230, 162, 60, 0.5);
+}
+
+.detail-summary .el-tag--primary {
+  background: rgba(64, 158, 255, 0.3);
+  border-color: rgba(64, 158, 255, 0.5);
+}
+
+.detail-summary .el-tag--danger {
+  background: rgba(245, 108, 108, 0.3);
+  border-color: rgba(245, 108, 108, 0.5);
+}
+
+.ml-2 {
+  margin-left: 12px;
+}
+
+.mt-3 {
+  margin-top: 16px;
+}
+
+.text-gray-400 {
+  color: #9CA3AF;
+}
+</style>