From a74f864c61668c8a6e6c53988441a7f97b268335 Mon Sep 17 00:00:00 2001
From: =?UTF-8?q?=E6=9D=8E=E5=B0=8F=E6=9E=97?= <320730042@qq.com>
Date: Tue, 20 Aug 2024 17:44:21 +0800
Subject: [PATCH] =?UTF-8?q?feat:=20=E6=95=85=E9=9A=9C=E7=AE=A1=E7=90=86-?=
 =?UTF-8?q?=E5=9F=BA=E6=9C=AC=E4=BF=A1=E6=81=AF-=E8=AF=8A=E6=96=AD?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 src/api/fault/index.ts                        | 15 ++-
 src/api/fault/types.ts                        | 17 +++-
 .../fault-management/components/Diagnosis.vue | 93 +++++++++++++++++++
 .../components/basicInfoQuery.vue             | 39 ++++----
 .../family/operate/fault-management/index.vue |  7 +-
 5 files changed, 142 insertions(+), 29 deletions(-)
 create mode 100644 src/views/family/operate/fault-management/components/Diagnosis.vue

diff --git a/src/api/fault/index.ts b/src/api/fault/index.ts
index 2a8a112..4d6bce4 100644
--- a/src/api/fault/index.ts
+++ b/src/api/fault/index.ts
@@ -1,5 +1,5 @@
 import request from "@/utils/request";
-import { FaultBasicInfoVO, FaultQuery, FaultQueryVO } from "@/api/fault/types";
+import { FaultBasicInfoVO, FaultDiagnosisResult, FaultQuery, FaultQueryVO } from "@/api/fault/types";
 import { AxiosPromise } from "axios";
 
 export function faultQueryList(data: FaultQuery): AxiosPromise<FaultQueryVO[]> {
@@ -18,3 +18,16 @@ export function faultBasicInfoQuery(
     data,
   });
 }
+export function basicInfoDiagnosis(
+  devId?: number,
+  remote?: string
+): AxiosPromise<FaultDiagnosisResult> {
+  return request({
+    url: "/api/fault/v1/basic_info/diagnosis",
+    method: "GET",
+    params: {
+      devId,
+      remote,
+    },
+  });
+}
diff --git a/src/api/fault/types.ts b/src/api/fault/types.ts
index a1a690a..c22aee7 100644
--- a/src/api/fault/types.ts
+++ b/src/api/fault/types.ts
@@ -1,13 +1,13 @@
 export interface FaultQueryVO {
-  devId?: number;
+  devId: number;
 
-  devSno?: string;
+  devSno: string;
 
-  devPppoe?: string;
+  devPppoe: string;
 
-  devVendorOui?: string;
+  devVendorOui: string;
 
-  devAdNo?: string;
+  devAdNo: string;
 }
 export interface FaultQuery {
   label: string;
@@ -39,3 +39,10 @@ export interface FaultBasicInfoVO {
 
   softVer?: string;
 }
+export interface FaultDiagnosisResult {
+  errorDesc?: string;
+
+  testResult?: string;
+
+  endTime?: string;
+}
diff --git a/src/views/family/operate/fault-management/components/Diagnosis.vue b/src/views/family/operate/fault-management/components/Diagnosis.vue
new file mode 100644
index 0000000..ef58fd5
--- /dev/null
+++ b/src/views/family/operate/fault-management/components/Diagnosis.vue
@@ -0,0 +1,93 @@
+<template>
+  <el-card shadow="never" v-loading="loading">
+    <template #header>
+      <div class="flex justify-between">
+        <div style="display: flex; align-items: center">
+          <el-icon size="15"> <Grid /> </el-icon>&nbsp;<span
+            style="font-weight: 700; font-size: 14px; line-height: 16px"
+            >{{ prop.name }}</span
+          >
+        </div>
+        <div>
+          <el-button
+            type="primary"
+            :disabled="devId === undefined"
+            @click="openDiagnosis(prop.remote)"
+            >开始诊断</el-button
+          >
+        </div>
+      </div>
+    </template>
+    <div>
+      <el-descriptions :column="1" border>
+        <el-descriptions-item
+          label-align="left"
+          align="left"
+          label-class-name="my-label2"
+          class-name="my-content"
+          width="150px"
+        >
+          <div class="my-content">
+            进行{{ name }} 综合诊断{{ result.endTime }}
+          </div>
+        </el-descriptions-item>
+        <el-descriptions-item
+          label-align="left"
+          align="left"
+          label-class-name="my-label2"
+          class-name="my-content"
+          width="150px"
+        >
+          <div class="my-content">测试结果 : {{ result.testResult }}</div>
+        </el-descriptions-item>
+        <el-descriptions-item
+          label-align="left"
+          align="left"
+          label-class-name="my-label2"
+          class-name="my-content"
+          width="150px"
+        >
+          <div class="my-content">修复建议 : {{ result.errorDesc }}</div>
+        </el-descriptions-item>
+      </el-descriptions>
+    </div>
+  </el-card>
+</template>
+
+<script setup lang="ts">
+import { Grid } from "@element-plus/icons-vue";
+import { confirm } from "@/utils/confirm";
+import { basicInfoDiagnosis } from "@/api/fault";
+import { FaultDiagnosisResult } from "@/api/fault/types";
+const prop = defineProps<{
+  devId?: number;
+  remote: string;
+  name: string;
+}>();
+const loading = ref<boolean>(false);
+const result = ref<FaultDiagnosisResult>({});
+const openDiagnosis = (remote: string) => {
+  confirm("确定开启诊断吗", () => {
+    loading.value = true;
+    basicInfoDiagnosis(prop.devId, remote)
+      .then(({ data }) => {
+        result.value = data;
+      })
+      .finally(() => {
+        loading.value = false;
+      });
+  });
+};
+</script>
+
+<style scoped>
+:deep(.my-label2) {
+  width: 0 !important;
+  display: none !important;
+  background: var(--el-color-white) !important;
+}
+.my-content {
+  font-size: 14px;
+  color: var(--el-text-color-regular);
+}
+</style>
diff --git a/src/views/family/operate/fault-management/components/basicInfoQuery.vue b/src/views/family/operate/fault-management/components/basicInfoQuery.vue
index b18d70f..ccaee77 100644
--- a/src/views/family/operate/fault-management/components/basicInfoQuery.vue
+++ b/src/views/family/operate/fault-management/components/basicInfoQuery.vue
@@ -154,33 +154,29 @@
     </div>
     <div>
       <div v-show="currentTab === 1">
-        <el-card shadow="never">
-          <template #header>
-            <div class="flex justify-between">
-              <div style="display: flex; align-items: center">
-                <el-icon size="15"> <Grid /> </el-icon>&nbsp;<span
-                  style="font-weight: 700; font-size: 14px; line-height: 16px"
-                  >有线无法上网</span
-                >
-              </div>
-              <div>
-                <el-button type="primary">开始诊断</el-button>
-              </div>
-            </div>
-          </template>
-          <el-empty description="暂无任何信息" />
-        </el-card>
+        <diagnosis name="有线无法上网" :dev-id="vo.devId" remote="1-1" />
+      </div>
+      <div v-show="currentTab === 2">
+        <diagnosis name="上网速度慢" :dev-id="vo.devId" remote="1-3" />
+      </div>
+      <div v-show="currentTab === 3">
+        <diagnosis name="用户异常掉线" :dev-id="vo.devId" remote="1-2" />
       </div>
-      <div v-show="currentTab === 2">上网速度慢</div>
-      <div v-show="currentTab === 3">用户异常掉线</div>
     </div>
   </el-scrollbar>
 </template>
 
 <script setup lang="ts">
-import { Grid } from "@element-plus/icons-vue";
-import { faultBasicInfoQuery } from "@/api/fault";
-import { FaultBasicInfoVO, FaultQuery, FaultQueryVO } from "@/api/fault/types";
+import { Grid, StarFilled } from "@element-plus/icons-vue";
+import { basicInfoDiagnosis, faultBasicInfoQuery } from "@/api/fault";
+import {
+  FaultBasicInfoVO,
+  FaultDiagnosisResult,
+  FaultQuery,
+  FaultQueryVO,
+} from "@/api/fault/types";
+import { confirm } from "@/utils/confirm";
+import Diagnosis from "@/views/family/operate/fault-management/components/Diagnosis.vue";
 
 const loading = ref<boolean>(false);
 const currentTab = ref<number>(1);
@@ -198,6 +194,7 @@ const getBasicInfo = (queryVO: FaultQueryVO) => {
   let searchForm: FaultQuery = {
     label: "devSno",
     value: queryVO.devSno,
+    ping: [],
   };
   faultBasicInfoQuery(searchForm)
     .then(({ data }) => {
diff --git a/src/views/family/operate/fault-management/index.vue b/src/views/family/operate/fault-management/index.vue
index 47794c0..9375eea 100644
--- a/src/views/family/operate/fault-management/index.vue
+++ b/src/views/family/operate/fault-management/index.vue
@@ -127,7 +127,7 @@ defineOptions({
   name: "FaultManagement",
   inheritAttrs: false,
 });
-const loading = ref<string>();
+const loading = ref<boolean>(false);
 const searchForm = ref<FaultQuery>({
   label: "devSno",
   value: "",
@@ -224,7 +224,10 @@ const loadBasicInfo = (vo: FaultQueryVO) => {
   cursor: pointer;
   right: 0;
 }
-
+.dropdown .close:hover {
+  background-color: var(--el-color-primary);
+  color: var(--el-color-white);
+}
 .dropdown ul {
   list-style: none;
   padding: 0;