更改首页

src/api/index.ts

@@ -78,6 +78,11 @@ export function fileAdd(data:any) {
 export function fileDel(id:number) {
   return del('/file/delFile/'+id);
 }
+// 文件管理删除查询是否有预测过文件接口
+export function fileDelBefore(id:number) {
+  return get('/file/checkFile/'+id);
+}
+
 // 文件管理修改接口
 export function fileUpdate(data:any) {
   return put('/file/editFile',data);
@@ -171,6 +176,23 @@ export function warnSetList(data:any) {
 export function healthySetList(data:any) {
   return post('/settings/healthMetricsList',data);
 }
+/**
+ * @name 警告信息与维修建议设置修改数据
+ * @param params 包含
+ * @returns 
+ */
+export function warnSetUpdate(params:any) {
+  return put('/settings/updatExceptionWarningRepairStrategy',params);
+}
+/**
+ * @name  健康指标设置修改数据
+ * @param params 包含
+ * @returns 
+ */
+export function healthySetUpdate(params:any) {
+  return put('/settings/updateHealthMetric',params);
+}
+
 // // 使用 http 方法获取特定的 HTTP 方法并调用
 // const deleteMethod = http("DELETE");
 // deleteMethod("/api/data")

src/style.css

@@ -159,6 +159,12 @@ body {
   border: 1px solid rgba(131, 187, 255, 0.4);
   box-shadow: none
 }
+.custom-time-input.is-disabled .el-input__wrapper {
+  background-color: rgba(0, 122, 255, 0.1) !important;
+  box-shadow:none !important;
+  /* box-shadow: 0 0 0 1px var(--el-disabled-border-color) inset; */
+}
+
 .custom-time-input .el-input {
   --el-input-text-color: rgba(255, 255, 255, 0.75);
 }

src/views/FileManagement/index.vue

@@ -136,7 +136,7 @@
   >
     <!-- 模态框内容插槽 -->
     <div class="custom-box custom-time-input">
-      <div class="confirmText">确认删除该数据吗?</div>
+      <div class="confirmText">{{delDesc}}确认删除该数据吗?</div>
       <div class="footer">
         <div class="btnFooter cancel" @click="delVisible = false">取消</div>
         <div class="btnFooter btnFooter-big" @click="deleteRecord(form)">
@@ -200,6 +200,7 @@ import {
   fileUpdate,
   fileDel,
   fileAdd,
+  fileDelBefore,
   evaluateHealthStatus,
   recordAssessmentResult,
   readDict
@@ -424,8 +425,15 @@ const toRpc=async (row:any)=>{
 }
 // 删除逻辑
 let delVisible = ref(false);
+let delDesc = ref(null);
 let delId = ref("");
-const delBefore = (id: number) => {
+const delBefore = async (id: number) => {
+  let res = await fileDelBefore(id);
+  if (res == true || !!res.data) {
+    delDesc.value="该文件已被预测过,"
+  }else{
+    delDesc.value=''
+  }
   delVisible.value = true;
   delId.value = id;
 };

src/views/HealthSettings/index.vue

@@ -2,112 +2,88 @@
   <div class="maintenance-strategy-assistance">
     <div class="header">
       <div class="title">
-        <s-title titleText="设备维修策略"></s-title>
+        <s-title titleText="健康指标设置"></s-title>
       </div>
     </div>
-    <div class="ace-sear">
-      <div class="back" @click="back">
-        <svg
-          width="22.000000"
-          height="16.000000"
-          viewBox="0 0 22 16"
-          fill="none"
-          xmlns="http://www.w3.org/2000/svg"
-          xmlns:xlink="http://www.w3.org/1999/xlink"
-        >
-          <desc>Created with Pixso.</desc>
-          <defs />
-          <path
-            id="path"
-            d="M15 2.2L5 2.2L5 0L0 3L5 6L5 3.79L15 3.79C18 3.79 20.2 5.79 20.2 9C20.2 12.2 18 14.2 15 14.2L9 14.2C8.59 14.2 8.2 14.6 8.2 15C8.2 15.4 8.59 15.8 9 15.8L15 15.8C18.79 15.8 21.8 13.1 21.8 9C21.8 4.9 18.79 2.2 15 2.2Z"
-            fill="#008BFA"
-            fill-opacity="1.000000"
-            fill-rule="nonzero"
-          />
-        </svg>
 
-        返回
-      </div>
-      <div class="search">
-        <div class="custom-time-select">
-          <el-select
-            class="ace-sel"
-        v-model="queryParams.status"
-            placeholder="健康状态"
-          >
-            <template v-slot:prefix>
-              <el-icon color="rgba(255, 255, 255, 0.75)">
-                <Filter />
-              </el-icon>
-            </template>
-            <!-- // 当前健康状态：1-良好；2-一般；3-较差；4-危险 -->
+    <div class="records">
+      <el-table
+        :data="tableData"
+        style="width: 100%"
+        align="center"
+        class="custom-table"
+        table-layout="fixed"
+      >
+        <!-- <el-table-column
+          prop="name"
+          label="设备名称"
+          align="center"
+        ></el-table-column> -->
 
-          <el-option label="全部" value=""></el-option>
-          <el-option label="良好" value="1"></el-option>
-          <el-option label="一般" value="2"></el-option>
-          <el-option label="较差" value="3"></el-option>
-          <el-option label="危险" value="4"></el-option>
-          </el-select>
-        </div>
-        <div class="custom-time-input custom-search-input search-input">
-          <el-input
-            placeholder="请输入设备名称"
-            v-model="queryParams.name"
-          >
-             <template #suffix>
-              <el-icon class="el-input__icon" @click="fetchData"
-                ><Search
-              /></el-icon>
-            </template>
-          </el-input>
-        </div>
-      </div>
-    </div>
-      <div class="records">
-        <el-table border  :data="tableData" style="width: 100%" align="center" class="custom-table">
-          <el-table-column
-            prop="name"
-            label="设备名称"
-            align="center"
-          ></el-table-column>
-          <el-table-column prop="sts" label="当前健康状态" width="140" align="center">
-            <template v-slot="scope">
-              <span :class="getHealthStatusClass(scope.row.sts)">
-                {{ getHealthStatusText(scope.row.sts) }}
-              </span>
-            </template>
-          </el-table-column>
-          <el-table-column
-            prop="lifetime"
-            label="剩余可用时间"
-            width="260"
-            align="center"
-          >
-              <template v-slot="scope">
-              <span>{{ scope.row.lifetime }}天</span>
-            </template>
-          </el-table-column>
-          <el-table-column label="维修策略及更换建议" align="center">
-            <template v-slot="scope">
-              <span>{{ scope.row.strategy }}</span>
-            </template>
-          </el-table-column>
-          <el-table-column label="操作" width="280"  align="center">
-            <template v-slot="scope">
-              <el-button class="btns"  link @click="viewDetails(scope.row.id,scope.row.name)"
-                >设备历史建议</el-button
-              >
-              <el-button class="btns"  link @click="exportRecord(scope.row.name)"
-                >导出记录</el-button
-              >
-              <el-button class="btns-warn"  link @click="delBefore(scope.row.id)"
-                >删除</el-button
+        <el-table-column label="警告内容" align="center">
+          <template v-slot="scope">
+            <div class="healthyWarn">
+              <div>
+                <el-input
+                    class="custom-time-input"
+                  v-model="scope.row.deviation_value[0]"
+                  :disabled="scope.$index == 0"
+                  @blur="() => saveEdit(scope.row, `deviation_value-${0}`)"
+                  @keyup.enter="
+                    () => saveEdit(scope.row, `deviation_value-${0}`)
+                  "
+                  @input="validateInput(scope.row,0)"
+                />
+              </div>
+              <div class="warnLine"></div>
+              <div>
+                <el-input
+                  v-model="scope.row.deviation_value[1]"
+                  :disabled="scope.$index == tableData.length - 1"
+                  @blur="() => saveEdit(scope.row, `deviation_value-${1}`)"
+                  @keyup.enter="
+                    () => saveEdit(scope.row, `deviation_value-${1}`)
+                  "
+                  class="custom-time-input"
+                                    @input="validateInput(scope.row,1)"
+
+                />
+              </div>
+            </div>
+          </template>
+        </el-table-column>
+        <el-table-column
+          prop="name"
+          label="健康程度"
+          width="660"
+          align="center"
+        >
+          <template v-slot="scope">
+            <div>
+              <!-- <el-input
+                v-if="
+                  editingCell.row == scope.$index &&
+                  editingCell.column == `health_status-${tagIndex}`
+                "
+                v-model="scope.row.health_status[tagIndex]"
+                @blur="() => saveEdit(scope.row, `health_status-${tagIndex}`)"
+                @keyup.enter="
+                  () => saveEdit(scope.row, `health_status-${tagIndex}`)
+                "
+                class="custom-time-input"
+              /> -->
+              <div
+                class="tag-col-no-border"
+                :style="{ color: scope.row.color }"
               >
-            </template>
-          </el-table-column>
-        </el-table>
-      </div>
-    <div class="pagination custom-page">
+                {{ scope.row.health_status }}
+              </div>
+            </div>
+          </template>
+        </el-table-column>
+      </el-table>
+    </div>
+    <!-- <div class="pagination custom-page">
       <el-pagination
         background
         layout="prev, pager, next"
@@ -115,9 +91,9 @@
         :page-size="recordsPerPage"
         v-model:current-page="currentPage"
       ></el-pagination>
-    </div>
+    </div> -->
   </div>
-   <!-- 删除 -->
+  <!-- 删除 -->
   <ModalComponent
     v-model:visible="delVisible"
     customClass="custom-modal"
@@ -138,7 +114,7 @@
 </template>
 
 <script lang="ts" setup>
-import { ref, computed,getCurrentInstance,onMounted } from "vue";
+import { ref, computed, getCurrentInstance, onMounted, createApp } from "vue";
 import { ElMessage } from "element-plus";
 import sTitle from "@/components/StructTitle/index.vue";
 import { Filter } from "@element-plus/icons-vue";
@@ -151,47 +127,7 @@ import { downloadFile } from "@/utils/utils";
 // 基础路由
 const router = useRouter();
 const route = useRoute(); // 获取当前路由对象
-
-
-const getHealthStatusClass = (sts: number) => {
-    switch (sts) {
-    case 1:
-      return "success";
-    case 2:
-      return "info";
-    case 3:
-      return "warn";
-    case 4:
-      return "dange";
-    default:
-      return "info"; // 处理未知或未定义的状态
-  }
-};
-const exportRecord=(value:string)=>{
-
-     downloadFile(downloadDeviceRepair(), "设备历史维修策略.xlsx", {name:value });
-}
-// 当前健康状态：1-良好；2-一般；3-较差；4-危险
-const getHealthStatusText = (status: number) => {
-  switch (status) {
-    case 1:
-      return "良好";
-    case 2:
-      return "一般";
-    case 3:
-      return "较差";
-    case 4:
-      return "危险";
-    default:
-      return "未知状态"; // 处理未知或未定义的状态
-  }
-  }
-
-
-import {
-  repairDetailList,
-  repairDetailDel,
-} from "@/api/index";
+import { healthySetList, healthySetUpdate } from "@/api/index";
 const { proxy } = getCurrentInstance()!;
 // pages
 import {
@@ -204,20 +140,69 @@ interface DataItem {
   name: string;
   remark: string;
 }
-
+const healthColor = (status: string) => {
+  switch (status) {
+    case "健康":
+      return "#39B54A";
+    case "轻微异常":
+      return "#E3C246";
+    case "故障":
+      return "#FF6100";
+    case "严重故障":
+      return "#FC3F3F";
+    default:
+      return "#000000"; // 默认颜色为黑色
+  }
+};
 const fetchDataFunction = async (
   page: number,
   pageSize: number
 ): Promise<PaginationResponse<DataItem>> => {
-    proxy.$loading.start()
-  const response = await repairDetailList({
+  proxy.$loading.start();
+  const response = await healthySetList({
     current: page,
     size: 9,
-    ...queryParams.value,
+    // ...queryParams.value,
+  });
+  proxy.$loading.stop();
+  let resultData=response.data
+
+//   let resultData = [
+//     {
+//       id: 1,
+//       deviation_value: "0-0.10",
+//       deviation_percentage: 10,
+//       health_status: "健康",
+//     },
+//     {
+//       id: 2,
+//       deviation_value: "0.10-0.25",
+//       deviation_percentage: 20,
+//       health_status: "轻微异常",
+//     },
+//     {
+//       id: 3,
+//       deviation_value: "0.25-0.75",
+//       deviation_percentage: 80,
+//       health_status: "故障",
+//     },
+//     {
+//       id: 4,
+//       deviation_value: "0.75-1",
+//       deviation_percentage: 80,
+//       health_status: "严重故障",
+//     },
+//   ];
+  let resultSend = resultData.map((item) => {
+    return {
+      ...item,
+      deviation_value: item.deviation_value.split("-"),
+      color: healthColor(item.health_status),
+    };
   });
-   proxy.$loading.stop();
   return {
-    data: response.data.records,
+    // data: response.data.records,
+    data: resultSend,
     total: response.data.total,
   };
 };
@@ -228,64 +213,104 @@ const searchClick = fetchData();
 const queryParams = ref({
   name: "",
 });
-// 初始化逻辑
-onMounted(() => {
-  const pageId = route.query.id;
-  // const pageId = route.query.id;
-  if (pageId) {
-    queryParams.value.id = Number(pageId);
-    // queryParams.value.id = Number(pageId);
-  }
-});
-// 删除逻辑
-let delVisible = ref(false);
-let delId = ref("");
-const delBefore = (id: number) => {
-  delVisible.value = true;
-  delId.value = id;
+const editingCell = ref({ row: null, column: null });
+
+const editCell = (rowIndex: number, column: string) => {
+  editingCell.value = { row: rowIndex, column: column };
 };
-const deleteRecord = async () => {
-  let res = await repairDetailDel(delId.value);
-  if (res == true || !!res.data) {
-    ElMessage({
-      message: `操作成功`,
-      type: "success",
-    });
-    delVisible.value = false;
-    fetchData();
-  } else {
-    ElMessage({
-      message: res.msg,
-      type: "error",
-    });
-  }
+
+const saveEdit = (row, column) => {
+  console.log("Saving data:", row, column);
+  // 在这里处理保存逻辑，例如发送请求到服务器
+  editingCell.value = { row: null, column: null };
+  healthySetUpdate({
+    deviation_value: row.deviation_value.join("-"),
+    id: row.id,
+  }).then((its) => {
+    ElMessage.success("操作成功！");
+  });
 };
+const validateInput = (row, index) => {
+  let value = row.deviation_value[index];
+  value = value.replace(/[^0-9.]/g, ""); // 只允许输入数字和小数点
 
-const back=()=>{
-    router.back(-1)
-}
-const viewDetails = (id: number,name:string) => {
-  router.push({ path: "/repair/MaintenanceStrategyAssistanceViewHis", query: { id,name } });
-  // ElMessage({
-  //   message: `查看详情: ${id}`,
-  //   type: "info",
-  // });
+  // 确保只有一个小数点
+  const parts = value.split('.');
+  if (parts.length > 2) {
+    value = parts[0] + '.' + parts.slice(1).join('');
+  }
+
+  // 如果输入的值是小数点开头，前面补0
+  if (value.startsWith('.')) {
+    value = '0' + value;
+  }
+
+  // 转换为浮点数并限制在 0 到 1 之间
+  if (value) {
+    const floatValue = parseFloat(value);
+    if (!isNaN(floatValue)) {
+      if (floatValue < 0) value = '0';
+      if (floatValue > 1) value = '1';
+    }
+  }
+
+  row.deviation_value[index] = value;
 };
 </script>
 
 <style scoped>
+.warnLine {
+  width: 40px;
+  margin: 5px 20px;
+  height: 1px;
+  background: #4faffc;
+  box-sizing: content-box;
+}
+.healthyWarn {
+  display: flex;
+  justify-content: space-around;
+  align-items: center;
+  width: 380px;
+  margin: 0 auto;
+}
+.tag-col {
+  box-sizing: border-box;
+  border: 1px solid rgba(131, 187, 255, 0.4);
+  background: rgba(0, 122, 255, 0.1);
+  /* line-height: 30px; */
+  height: 30px;
+  padding: 10px;
+  margin: 10px;
+  display: flex;
+  align-items: center;
+  cursor: pointer;
+  justify-content: center;
+  text-align: center;
+}
+.tag-col-no-border {
+  height: 30px;
+  padding: 10px;
+  margin: 10px;
+  display: flex;
+  align-items: center;
+  cursor: pointer;
+  justify-content: center;
+  text-align: center;
+}
 .maintenance-strategy-assistance {
   color: #fff;
 }
-
+::v-deep .customTitle .right-line {
+  width: 586px;
+}
 .header {
   display: flex;
   justify-content: space-between;
   align-items: center;
   margin-bottom: 20px;
 }
-.records{
-    margin-top: 20px;
+.records {
+  margin-top: 20px;
 }
 .title {
   font-size: 24px;
@@ -328,11 +353,11 @@ const viewDetails = (id: number,name:string) => {
   height: 2px;
   background: rgba(131, 187, 255, 0.65);
 }
-.btns{
-    color:#4FAFFC
+.btns {
+  color: #4faffc;
 }
-.btns-warn{
-    color: #F80102;
+.btns-warn {
+  color: #f80102;
 }
 .pagination {
   margin-top: 20px;

src/views/HealthStatusAnalysis/index.vue

@@ -216,10 +216,10 @@
                   style="width: 600px"
                   class="custom-table blackTable"
                 >
-                  <el-table-column width="200" property="date" label="偏离值" />
+                  <el-table-column width="200" property="deviation_value" label="偏离值" />
                   <el-table-column
                     width="200"
-                    property="name"
+                    property="deviation_percentage"
                     label="偏离百分比"
                   />
                   <el-table-column
@@ -232,10 +232,9 @@
                         link
                         type="primary"
                         size="small"
-                        @click.prevent="deleteRow(scope.$index)"
                       >
-                        <div :style="{ color: healthColor(scope.row.address) }">
-                          {{ scope.row.address }}
+                        <div :style="{ color: healthColor(scope.row.health_status) }">
+                          {{ scope.row.health_status }}
                         </div>
                       </el-button>
                     </template>
@@ -364,12 +363,17 @@ import ModalComponent from "@/components/ModalComponent/index.vue";
 import WebSocketClient from "@/utils/webSocketClient";
 import { Interface } from "readline";
 import { time } from "console";
-import {recordAssessmentResult,healthStatusTip} from '@/api/index'
+import {recordAssessmentResult,healthStatusTip,healthySetList} from '@/api/index'
 const wsUrl = import.meta.env.VITE_WS_URL as string;
 const wsClient = new WebSocketClient(wsUrl);
 const { proxy } = getCurrentInstance()!;
-
+let gridData=ref(null)
+const getHStatus=async ()=>{
+  let result=await healthySetList({})
+gridData.value=result.data
+}
 onMounted(() => {
+  getHStatus()
   nextTick(() => {});
 
   wsClient.connect();
@@ -756,7 +760,7 @@ const seriesData = ref([
 const showLegend = ref(false);
 const legendData = ref(["趋势"]);
 const healthyStatusText = ref({
-  name:'正常',
+  name:'',
   color:''
 });
 let flag = false
@@ -782,53 +786,44 @@ const healthyMessage = (data: Object) => {
     data:arr
   }]
 };
-
-const gridData = [
-  {
-    date: "<0.10",
-    name: "10%",
-    address: "健康",
-  },
-  {
-    date: "0.10-0.25",
-    name: "25%",
-    address: "轻微异常",
-  },
-  {
-    date: "0.25-0.75",
-    name: "75%",
-    address: "故障",
-  },
-  {
-    date: ">0.75",
-    name: "75%",
-    address: "严重故障",
-  },
-];
-const determineHealthStatus = (avgNum:any) => {
-  let value=avgNum/100
-  if (value < 1-0.10) {
-    return  {
-      name:`健康(${avgNum}%)`,
-      color:''
-    };
-  } else if (value >= 1-0.10 && value <= 1-0.25) {
-    return {
-      name:`轻微异常(${avgNum}%)`,
-      color:'warn'
-    };
-  } else if (value > 1-0.25 && value <= 1-0.75) {
-       return {
-      name:`故障(${avgNum}%)`,
-      color:'danger'
-    };
-  } else if (value > 1-0.75) {
-       return {
-      name:`严重故障(${avgNum}%)`,
-      color:'error'
-    };
+interface HealthData {
+  id: number;
+  deviation_value: string;
+  deviation_percentage: number;
+  health_status: string;
+}
+const determineHealthStatus = (value: number): string => {
+  // let value=avgNum/100
+  // if (value < 1-0.10) {
+  //   return  {
+  //     name:`健康(${avgNum}%)`,
+  //     color:''
+  //   };
+  // } else if (value >= 1-0.10 && value <= 1-0.25) {
+  //   return {
+  //     name:`轻微异常(${avgNum}%)`,
+  //     color:'warn'
+  //   };
+  // } else if (value > 1-0.25 && value <= 1-0.75) {
+  //      return {
+  //     name:`故障(${avgNum}%)`,
+  //     color:'danger'
+  //   };
+  // } else if (value > 1-0.75) {
+  //      return {
+  //     name:`严重故障(${avgNum}%)`,
+  //     color:'error'
+  //   };
+  // }
+  // return "未知状态"; // 如果数据不在任何已定义的范围内
+  value=1-value
+  for (const item of gridData) {
+    const [min, max] = item.deviation_value.split('-').map(parseFloat);
+    if (value >= min && value <= max) {
+      return `${item.health_status} (${item.deviation_percentage}%)`;
+    }
   }
-  return "未知状态"; // 如果数据不在任何已定义的范围内
+  return "未知状态";
 };
 const healthColor = (status: string) => {
   switch (status) {
@@ -838,7 +833,7 @@ const healthColor = (status: string) => {
       return "#E3C246";
     case "故障":
       return "#FF6100";
-    case "严重异常":
+    case "严重故障":
       return "#FC3F3F";
     default:
       return "#000000"; // 默认颜色为黑色

src/views/OperationalReliabilityPrediction/index.vue

@@ -175,8 +175,9 @@ const goAdvice = (name: string) => {
 };
 const statusText = ref({
   健康: "status-value-normal",
-  故障: "status-value-normal status-value-danger",
-  轻微异常: "status-value-normal status-value-danger",
+  故障: "status-value-normal status-value-gu",
+  轻微异常: "status-value-normal status-value-qing",
+  严重故障: "status-value-normal status-value-danger",
 });
 // 健康趋势示例数据
 const xAxisData = ref([]);
@@ -187,7 +188,7 @@ const seriesData = ref([
   },
 ]);
 const devicesArr = ref([]);
-const gridLeft = ref(28);
+const gridLeft = ref(32);
 const gridRight = ref(65);
 const forecast_result = ref("");
 const currentBtn = ref("");
@@ -320,6 +321,20 @@ onMounted(() => {
   background-clip: text;
   text-fill-color: transparent;
 }
+.status-value-gu {
+  background: linear-gradient(180deg, rgb(255, 97, 0), rgb(255, 255, 255));
+  -webkit-background-clip: text;
+  -webkit-text-fill-color: transparent;
+  background-clip: text;
+  text-fill-color: transparent;
+}
+.status-value-qing {
+  background: linear-gradient(180deg, rgb(227, 194, 70), rgb(255, 255, 255));
+  -webkit-background-clip: text;
+  -webkit-text-fill-color: transparent;
+  background-clip: text;
+  text-fill-color: transparent;
+}
 .status-bac {
   background: url("../../assets/img/2.png");
   background-size: 100% 100%;

src/views/WarningSettings/index.vue

@@ -28,54 +28,159 @@
             <div
               v-for="(tag, tagIndex) in scope.row.health_status"
               :key="tagIndex"
+            >
+              <!-- <el-input
+                v-if="
+                  editingCell.row == scope.$index &&
+                  editingCell.column == `health_status-${tagIndex}`
+                "
+                v-model="scope.row.health_status[tagIndex]"
+                @blur="() => saveEdit(scope.row, `health_status-${tagIndex}`)"
+                @keyup.enter="
+                  () => saveEdit(scope.row, `health_status-${tagIndex}`)
+                "
+                class="custom-time-input"
+              /> -->
+              <div class="tag-col-no-border">
+                {{ tag }}
+              </div>
+            </div>
+          </template>
+        </el-table-column>
+        <el-table-column label="警告内容" align="center">
+          <template v-slot="scope">
+            <div
+              v-for="(tag, tagIndex) in scope.row.warning_message"
+              :key="tagIndex"
             >
               <el-input
                 v-if="
-                  editingCell.row === scope.$index &&
-                  editingCell.column === `repairResource-${tagIndex}`
+                  editingCell.row == scope.$index &&
+                  editingCell.column == `warning_message-${tagIndex}`
                 "
-                v-model="scope.row.repairResource[tagIndex]"
-                @blur="() => saveEdit(scope.row, `repairResource-${tagIndex}`)"
+                v-model="scope.row.warning_message[tagIndex]"
+                @blur="() => saveEdit(scope.row, `warning_message-${tagIndex}`)"
                 @keyup.enter="
-                  () => saveEdit(scope.row, `repairResource-${tagIndex}`)
+                  () => saveEdit(scope.row, `warning_message-${tagIndex}`)
                 "
-                class="tag-col-input"
+                class="custom-time-input"
               />
               <div
                 v-else
                 class="tag-col"
-                @dblclick="editCell(scope.$index, `repairResource-${tagIndex}`)"
+                @dblclick="
+                  editCell(scope.$index, `warning_message-${tagIndex}`)
+                "
               >
                 {{ tag }}
               </div>
             </div>
           </template>
         </el-table-column>
-        <el-table-column label="警告内容" align="center">
-          <template v-slot="scope">
-            <div>
-              <div class="tag-col">{{ scope.row.strategy }}</div>
-            </div>
-          </template>
-        </el-table-column>
         <el-table-column label="维修时间" align="center">
           <template v-slot="scope">
-            <div>
-              <div class="tag-col">{{ scope.row.strategy }}</div>
+            <div
+              v-for="(tag, tagIndex) in scope.row.suggested_maintenance_time"
+              :key="tagIndex"
+            >
+              <el-input
+                v-if="
+                  editingCell.row == scope.$index &&
+                  editingCell.column == `suggested_maintenance_time-${tagIndex}`
+                "
+                v-model="scope.row.suggested_maintenance_time[tagIndex]"
+                @blur="
+                  () =>
+                    saveEdit(
+                      scope.row,
+                      `suggested_maintenance_time-${tagIndex}`
+                    )
+                "
+                @keyup.enter="
+                  () =>
+                    saveEdit(
+                      scope.row,
+                      `suggested_maintenance_time-${tagIndex}`
+                    )
+                "
+                class="custom-time-input"
+              />
+              <div
+                v-else
+                class="tag-col"
+                @dblclick="
+                  editCell(
+                    scope.$index,
+                    `suggested_maintenance_time-${tagIndex}`
+                  )
+                "
+              >
+                {{ tag }}
+              </div>
             </div>
           </template>
         </el-table-column>
         <el-table-column label="维修方法" align="center">
           <template v-slot="scope">
-            <div>
-              <div class="tag-col">{{ scope.row.strategy }}</div>
+            <div
+              v-for="(tag, tagIndex) in scope.row.maintenance_method"
+              :key="tagIndex"
+            >
+              <el-input
+                v-if="
+                  editingCell.row == scope.$index &&
+                  editingCell.column == `maintenance_method-${tagIndex}`
+                "
+                v-model="scope.row.maintenance_method[tagIndex]"
+                @blur="
+                  () => saveEdit(scope.row, `maintenance_method-${tagIndex}`)
+                "
+                @keyup.enter="
+                  () => saveEdit(scope.row, `maintenance_method-${tagIndex}`)
+                "
+                class="custom-time-input"
+              />
+              <div
+                v-else
+                class="tag-col"
+                @dblclick="
+                  editCell(scope.$index, `maintenance_method-${tagIndex}`)
+                "
+              >
+                {{ tag }}
+              </div>
             </div>
           </template>
         </el-table-column>
         <el-table-column label="维修资源" align="center">
           <template v-slot="scope">
-            <div>
-              <div class="tag-col">{{ scope.row.strategy }}</div>
+            <div
+              v-for="(tag, tagIndex) in scope.row.required_resources"
+              :key="tagIndex"
+            >
+              <el-input
+                v-if="
+                  editingCell.row == scope.$index &&
+                  editingCell.column == `required_resources-${tagIndex}`
+                "
+                v-model="scope.row.required_resources[tagIndex]"
+                @blur="
+                  () => saveEdit(scope.row, `required_resources-${tagIndex}`)
+                "
+                @keyup.enter="
+                  () => saveEdit(scope.row, `required_resources-${tagIndex}`)
+                "
+                class="custom-time-input"
+              />
+              <div
+                v-else
+                class="tag-col"
+                @dblclick="
+                  editCell(scope.$index, `required_resources-${tagIndex}`)
+                "
+              >
+                {{ tag }}
+              </div>
             </div>
           </template>
         </el-table-column>
@@ -125,7 +230,7 @@ import { downloadFile } from "@/utils/utils";
 // 基础路由
 const router = useRouter();
 const route = useRoute(); // 获取当前路由对象
-import { fileList, repairDetailDel } from "@/api/index";
+import { fileList, warnSetUpdate } from "@/api/index";
 const { proxy } = getCurrentInstance()!;
 // pages
 import {
@@ -150,94 +255,95 @@ const fetchDataFunction = async (
     // ...queryParams.value,
   });
   proxy.$loading.stop();
-  let resultData= [
-        {
-            "name": "右DE",
-            "association_ids": "2|3|4",
-            "health_status": "轻微异常|故障|严重故障",
-            "warning_message": "燃油系统压力低|冷却水温度过高|船舶导航系统故障",
-            "suggested_maintenance_time": "每季度|每月|每周",
-            "maintenance_method": "更换磨损零件|深度清洁和校准|全面检查",
-            "required_resources": "新零件|清洁剂和校准工具|检查工具"
-        },
-        {
-            "name": "右GT燃气轮机",
-            "association_ids": "6|7|8",
-            "health_status": "轻微异常|故障|严重故障",
-            "warning_message": "推进系统异常振动|通信系统失效|舱室水浸传感器报警",
-            "suggested_maintenance_time": "每季度|每月|每周",
-            "maintenance_method": "更换磨损零件|深度清洁和校准|全面检查",
-            "required_resources": "新零件|清洁剂和校准工具|检查工具"
-        },
-        {
-            "name": "右齿轮箱",
-            "association_ids": "10|11|12",
-            "health_status": "轻微异常|故障|严重故障",
-            "warning_message": "液压系统压力异常|自动舵系统失灵|主发动机润滑油压力低",
-            "suggested_maintenance_time": "每季度|每月|每周",
-            "maintenance_method": "更换磨损零件|深度清洁和校准|全面检查",
-            "required_resources": "新零件|清洁剂和校准工具|检查工具"
-        },
-        {
-            "name": "右调距桨",
-            "association_ids": "14|15|16",
-            "health_status": "轻微异常|故障|严重故障",
-            "warning_message": "发电机组冷却水温度高|排气温度过高|火灾报警系统激活",
-            "suggested_maintenance_time": "每季度|每月|每周",
-            "maintenance_method": "更换磨损零件|深度清洁和校准|全面检查",
-            "required_resources": "新零件|清洁剂和校准工具|检查工具"
-        },
-        {
-            "name": "左DE",
-            "association_ids": "18|19|20",
-            "health_status": "轻微异常|故障|严重故障",
-            "warning_message": "燃油系统压力低|冷却水温度过高|船舶导航系统故障",
-            "suggested_maintenance_time": "每季度|每月|每周",
-            "maintenance_method": "更换磨损零件|深度清洁和校准|全面检查",
-            "required_resources": "新零件|清洁剂和校准工具|检查工具"
-        },
-        {
-            "name": "左GT燃气轮机",
-            "association_ids": "22|23|24",
-            "health_status": "轻微异常|故障|严重故障",
-            "warning_message": "推进系统异常振动|通信系统失效|舱室水浸传感器报警",
-            "suggested_maintenance_time": "每季度|每月|每周",
-            "maintenance_method": "更换磨损零件|深度清洁和校准|全面检查",
-            "required_resources": "新零件|清洁剂和校准工具|检查工具"
-        },
-        {
-            "name": "左齿轮箱",
-            "association_ids": "26|27|28",
-            "health_status": "轻微异常|故障|严重故障",
-            "warning_message": "液压系统压力异常|自动舵系统失灵|主发动机润滑油压力低",
-            "suggested_maintenance_time": "每季度|每月|每周",
-            "maintenance_method": "更换磨损零件|深度清洁和校准|全面检查",
-            "required_resources": "新零件|清洁剂和校准工具|检查工具"
-        },
-        {
-            "name": "左调距桨",
-            "association_ids": "30|31|32",
-            "health_status": "轻微异常|故障|严重故障",
-            "warning_message": "发电机组冷却水温度高|排气温度过高|火灾报警系统激活1",
-            "suggested_maintenance_time": "每季度|每月|每周",
-            "maintenance_method": "更换磨损零件|深度清洁和校准|全面检查",
-            "required_resources": "新零件|清洁剂和校准工具|检查工具"
-        }
-    ]
-   let  resultSend=resultData.map(item=>{
-        return {
-            "name": item.name,
-            "association_ids": item.association_ids.split('|'),
-            "health_status":item.health_status.split('|'),
-            "warning_message": item.warning_message.split('|'),
-            "suggested_maintenance_time":item.suggested_maintenance_time.split('|'),
-            "maintenance_method": item.maintenance_method.split('|'),
-            "required_resources": item.required_resources.split('|')
-        }
-    })
+  let resultData=response.data
+//   let resultData = [
+//     {
+//       name: "右DE",
+//       association_ids: "2|3|4",
+//       health_status: "轻微异常|故障|严重故障",
+//       warning_message: "燃油系统压力低|冷却水温度过高|船舶导航系统故障",
+//       suggested_maintenance_time: "每季度|每月|每周",
+//       maintenance_method: "更换磨损零件|深度清洁和校准|全面检查",
+//       required_resources: "新零件|清洁剂和校准工具|检查工具",
+//     },
+//     {
+//       name: "右GT燃气轮机",
+//       association_ids: "6|7|8",
+//       health_status: "轻微异常|故障|严重故障",
+//       warning_message: "推进系统异常振动|通信系统失效|舱室水浸传感器报警",
+//       suggested_maintenance_time: "每季度|每月|每周",
+//       maintenance_method: "更换磨损零件|深度清洁和校准|全面检查",
+//       required_resources: "新零件|清洁剂和校准工具|检查工具",
+//     },
+//     {
+//       name: "右齿轮箱",
+//       association_ids: "10|11|12",
+//       health_status: "轻微异常|故障|严重故障",
+//       warning_message: "液压系统压力异常|自动舵系统失灵|主发动机润滑油压力低",
+//       suggested_maintenance_time: "每季度|每月|每周",
+//       maintenance_method: "更换磨损零件|深度清洁和校准|全面检查",
+//       required_resources: "新零件|清洁剂和校准工具|检查工具",
+//     },
+//     {
+//       name: "右调距桨",
+//       association_ids: "14|15|16",
+//       health_status: "轻微异常|故障|严重故障",
+//       warning_message: "发电机组冷却水温度高|排气温度过高|火灾报警系统激活",
+//       suggested_maintenance_time: "每季度|每月|每周",
+//       maintenance_method: "更换磨损零件|深度清洁和校准|全面检查",
+//       required_resources: "新零件|清洁剂和校准工具|检查工具",
+//     },
+//     {
+//       name: "左DE",
+//       association_ids: "18|19|20",
+//       health_status: "轻微异常|故障|严重故障",
+//       warning_message: "燃油系统压力低|冷却水温度过高|船舶导航系统故障",
+//       suggested_maintenance_time: "每季度|每月|每周",
+//       maintenance_method: "更换磨损零件|深度清洁和校准|全面检查",
+//       required_resources: "新零件|清洁剂和校准工具|检查工具",
+//     },
+//     {
+//       name: "左GT燃气轮机",
+//       association_ids: "22|23|24",
+//       health_status: "轻微异常|故障|严重故障",
+//       warning_message: "推进系统异常振动|通信系统失效|舱室水浸传感器报警",
+//       suggested_maintenance_time: "每季度|每月|每周",
+//       maintenance_method: "更换磨损零件|深度清洁和校准|全面检查",
+//       required_resources: "新零件|清洁剂和校准工具|检查工具",
+//     },
+//     {
+//       name: "左齿轮箱",
+//       association_ids: "26|27|28",
+//       health_status: "轻微异常|故障|严重故障",
+//       warning_message: "液压系统压力异常|自动舵系统失灵|主发动机润滑油压力低",
+//       suggested_maintenance_time: "每季度|每月|每周",
+//       maintenance_method: "更换磨损零件|深度清洁和校准|全面检查",
+//       required_resources: "新零件|清洁剂和校准工具|检查工具",
+//     },
+//     {
+//       name: "左调距桨",
+//       association_ids: "30|31|32",
+//       health_status: "轻微异常|故障|严重故障",
+//       warning_message: "发电机组冷却水温度高|排气温度过高|火灾报警系统激活1",
+//       suggested_maintenance_time: "每季度|每月|每周",
+//       maintenance_method: "更换磨损零件|深度清洁和校准|全面检查",
+//       required_resources: "新零件|清洁剂和校准工具|检查工具",
+//     },
+//   ];
+  let resultSend = resultData.map((item) => {
+    return {
+      name: item.name,
+      association_ids: item.association_ids.split("|"),
+      health_status: item.health_status.split("|"),
+      warning_message: item.warning_message.split("|"),
+      suggested_maintenance_time: item.suggested_maintenance_time.split("|"),
+      maintenance_method: item.maintenance_method.split("|"),
+      required_resources: item.required_resources.split("|"),
+    };
+  });
   return {
     // data: response.data.records,
-    data:resultSend,
+    data: resultSend,
     total: response.data.total,
   };
 };
@@ -252,13 +358,20 @@ const editingCell = ref({ row: null, column: null });
 
 const editCell = (rowIndex: number, column: string) => {
   editingCell.value = { row: rowIndex, column: column };
-  debugger
 };
 
 const saveEdit = (row, column) => {
   console.log("Saving data:", row, column);
   // 在这里处理保存逻辑，例如发送请求到服务器
   editingCell.value = { row: null, column: null };
+  const name = column.split("-")[0];
+  const index = column.split("-")[1];
+  warnSetUpdate({
+    [name]: row[name][index],
+    association_id: row.association_ids[index],
+  }).then((its) => {
+    ElMessage.success("操作成功！");
+  });
 };
 </script>
 
@@ -277,6 +390,16 @@ const saveEdit = (row, column) => {
   justify-content: center;
   text-align: center;
 }
+.tag-col-no-border {
+  height: 30px;
+  padding: 10px;
+  margin: 10px;
+  display: flex;
+  align-items: center;
+  cursor: pointer;
+  justify-content: center;
+  text-align: center;
+}
 .maintenance-strategy-assistance {
   color: #fff;
 }

vite.config.ts

@@ -22,7 +22,7 @@ export default defineConfig({
     proxy: {
       // 代理配置
       '/api': {
-        // target: 'http://192.168.1.103:8083',  // 目标服务器
+        // target: 'http://192.168.1.104:8083',  // 目标服务器
         target: 'http://192.168.99.49:8083',  // 目标服务器
         changeOrigin: true,            // 需要虚拟主机站点
         rewrite: (path) => path.replace(/^\/api/, '/api/')  // 重写 API 请求