From c4522e9cf70e32a0df710fd4a33781c2d28fb03a Mon Sep 17 00:00:00 2001
From: zhangyao <zhangyao@wodcloud.com>
Date: Fri, 7 Jul 2023 16:40:44 +0800
Subject: [PATCH] feat:
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

预警列表接口对接
---
 src/components/warn-detail/env.js             |   4 +-
 .../main/forewarning/list/detail/index.vue    |  55 ++--
 src/page/main/forewarning/list/index.vue      |  37 +--
 .../forewarning/list/user-input-table.vue     | 269 ------------------
 .../ticket/business-ticket-list/index.vue     |   1 +
 .../main/ticket/my-business-ticket/index.vue  |   1 +
 .../ticket/my-warn-ticket/detail/index.vue    | 165 +++++++++--
 src/page/main/ticket/my-warn-ticket/index.vue | 188 ++++++------
 8 files changed, 277 insertions(+), 443 deletions(-)
 delete mode 100644 src/page/main/forewarning/list/user-input-table.vue

diff --git a/src/components/warn-detail/env.js b/src/components/warn-detail/env.js
index 57d1c15..314f0b0 100644
--- a/src/components/warn-detail/env.js
+++ b/src/components/warn-detail/env.js
@@ -1,6 +1,6 @@
 export const STATUS_OBJ = {
-    success: "已恢复",
-    error: '未恢复'
+    1: "已恢复",
+    2: '未恢复'
 }
 export const PUSH_STATUS = {
     1: '成功',
diff --git a/src/page/main/forewarning/list/detail/index.vue b/src/page/main/forewarning/list/detail/index.vue
index c682cbd..3587f83 100644
--- a/src/page/main/forewarning/list/detail/index.vue
+++ b/src/page/main/forewarning/list/detail/index.vue
@@ -105,6 +105,10 @@ const tabs = ref([
     ],
   },
 ]);
+const pushType = {
+  1: "自动推送",
+  2: "手动推送",
+};
 const getInfo = () => {
   const params = {
     id,
@@ -124,6 +128,36 @@ const getInfo = () => {
         current_alarm_value: data.current_value + (ruleTypeOptions.value[data.alert_rule_type]?.unit || ""),
         warning_time: data.alert_time?.split("+")[0].replace("T", " ").replace("Z", " ") || "-",
       };
+      //
+      tabs.value = [
+        {
+          label: "推送记录",
+          prop: "push",
+          lists:
+            data.push_records?.map((e) => {
+              return {
+                method: e.notify_method,
+                person: e.system_account,
+                push_time: e.push_time?.split("+")[0].replace("T", " ").replace("Z", " ") || "-",
+                push_type: pushType[e.push_type],
+                status: e.status,
+              };
+            }) || [],
+        },
+        {
+          label: "处置记录",
+          prop: "dispose",
+          lists:
+            data.disposed_list?.map((e) => {
+              return {
+                status: e.is_disposed,
+                feedback: e.disposal_content,
+                feedback_time: e.disposal_time?.split("+")[0].replace("T", " ").replace("Z", " ") || "-",
+                feedback_person: e.disposal_user,
+              };
+            }) || [],
+        },
+      ];
     }
   });
 };
@@ -146,29 +180,8 @@ const GetRuleTypeOptions = () => {
     }
   });
 };
-const pushType = {
-  1: "自动推送",
-  2: "手动推送",
-};
-const getPushLog = () => {
-  axios.get("/v1/api/push_record/list", { params: { alert_list_id: id } }).then((res) => {
-    if (res.data.code == 200) {
-      tabs.value[0].lists =
-        res.data.data.list?.map((e) => {
-          return {
-            method: e.notify_method,
-            person: e.system_account,
-            push_time: e.push_time?.split("+")[0].replace("T", " ").replace("Z", " ") || "-",
-            push_type: pushType[e.push_type],
-            status: e.status,
-          };
-        }) || [];
-    }
-  });
-};
 onBeforeMount(() => {
   GetRuleTypeOptions();
-  getPushLog();
 });
 </script>
 
diff --git a/src/page/main/forewarning/list/index.vue b/src/page/main/forewarning/list/index.vue
index cfefad2..33eded6 100644
--- a/src/page/main/forewarning/list/index.vue
+++ b/src/page/main/forewarning/list/index.vue
@@ -2,7 +2,7 @@
   <div class="detail_container">
     <bg-breadcrumb></bg-breadcrumb>
     <div class="main_container">
-      <bg-filter-group @search="changeSearch" v-model="filter.search" placeholder="请输入预警点/分类/指标">
+      <bg-filter-group @search="changeSearch" v-model="filter.keyword" placeholder="请输入预警点/分类/指标">
         <template v-slot:left_action>
           <div class="apaas_button">
             <el-button type="primary" @click="batchPush">
@@ -43,10 +43,10 @@
             <div class="filter_item">
               <span class="filter_title">预警时间</span>
               <el-date-picker
-                style="width: 300px"
+                style="width: 400px"
                 v-model="filter.time"
-                type="daterange"
-                value-format="yyyy-MM-DD"
+                type="datetimerange"
+                value-format="YYYY-MM-DD HH:mm:ss"
                 range-separator="至"
                 start-placeholder="开始日期"
                 end-placeholder="结束日期" />
@@ -96,7 +96,7 @@
               {{ statusOptions[row.status] }}
             </template>
             <template v-slot:action="{ row }">
-              <bg-table-btns2 :limit="3" :tableData="tableRows">
+              <bg-table-btns2 :page_size="3" :tableData="tableRows">
                 <bg-table-btn :disabled="row.status != 2" @click="pushWarning(row)">推送提醒</bg-table-btn>
                 <bg-table-btn :disabled="row.status != 2" @click="closeWarning(row)">关闭预警</bg-table-btn>
               </bg-table-btns2>
@@ -146,7 +146,7 @@
             v-model="closeFormData.close_notes"
             type="textarea"
             :autosize="{ minRows: 2 }"
-            show-word-limit
+            show-word-page_size
             maxlength="30"
             resize="vertical"
             placeholder="请输入内容"></el-input>
@@ -174,7 +174,6 @@ import { ElMessage } from "element-plus";
 import axios from "@/request/http.js";
 import { Search } from "@element-plus/icons-vue";
 import bgBreadcrumb from "@/components/bg-breadcrumb.vue";
-import userInputTable from "./user-input-table.vue";
 import { useRouter } from "vue-router";
 import ManualDistributionForm from "@/components/manual-distribution/form.vue";
 import { GetRuleTypeOptions } from "@/components/env.js";
@@ -264,14 +263,12 @@ const state = reactive({
   selected: [], //选择数据
   tableTotal: 0, // 表格数据条数
   filter: {
-    warning_type: "", // 预警类型
-    warning_target: "", // 预警指标
     risk_level: "", // 风险等级
     status: "", // 状态
     time: [],
-    search: "",
+    keyword: "",
     page: 1,
-    limit: 10,
+    page_size: 10,
   }, // 表格筛选项
   actionRow: null, // 当前操作的数据
   closeWarningDialog: false, // 删除弹窗
@@ -314,7 +311,7 @@ const goDetail = (row) => {
 }; // 查看详情
 
 const changeSearch = (val) => {
-  state.filter.search = val;
+  state.filter.keyword = val;
   changePage(1);
 }; // 表格关键字筛选
 
@@ -328,10 +325,10 @@ const filterClear = () => {
     warning_target: "", // 预警指标
     risk_level: "", // 风险等级
     status: "", // 状态
-    time: "",
-    search: "",
+    time: [],
+    keyword: "",
     page: 1,
-    limit: 10,
+    page_size: 10,
   };
   changePage(1);
 }; // 重置筛选项
@@ -339,7 +336,13 @@ const selectable = (row, index) => {
   return row.status === 2;
 };
 const getTableRows = () => {
-  let params = { ...state.filter };
+  let [start_time = "", end_time = ""] = state.filter.time || [];
+  let params = {
+    ...state.filter,
+    start_time,
+    end_time,
+  };
+  Reflect.deleteProperty(params, "time");
   axios.get("/v1/api/alert_list/list", { params }).then((res) => {
     if (res.data.code == 200) {
       let { list, total_count } = res.data.data;
@@ -357,7 +360,7 @@ const changePage = (page) => {
 }; // 改变页码
 
 const changeSize = (size) => {
-  state.filter.limit = size;
+  state.filter.page_size = size;
   changePage(1);
 }; // 改变每页条数
 
diff --git a/src/page/main/forewarning/list/user-input-table.vue b/src/page/main/forewarning/list/user-input-table.vue
deleted file mode 100644
index 4353285..0000000
--- a/src/page/main/forewarning/list/user-input-table.vue
+++ /dev/null
@@ -1,269 +0,0 @@
-<template>
-  <el-form ref="ruleFormRef" class="ruleForm" :model="tableRows" :size="formSize" :rules="formRules">
-    <bg-table-pro showIndex :headers="headers" :data="tableRows" ref="input-table" :border="true" :stripe="false">
-      <template v-slot:account="{ row, index }">
-        <el-form-item :prop="`[${index}].account`" :rules="formRules.account" style="width: 100%">
-          <el-select
-            v-model="row.account"
-            placeholder="请选择帐号"
-            style="width: 100%"
-            @change="changeAccount(row)"
-            :disabled="disabled">
-            <el-option
-              v-for="(item, index) in userLists"
-              :key="'userItem' + index"
-              :disabled="item.disabled"
-              :label="item.account"
-              :value="item.id">
-            </el-option>
-          </el-select>
-        </el-form-item>
-      </template>
-      <template v-slot:name="{ row, index }">
-        <el-form-item :prop="`[${index}].name`" :rules="formRules.name" style="width: 100%">
-          <el-input @change="changeName" placeholder="请输入姓名" :disabled="disabled" v-model.trim="row.name" />
-        </el-form-item>
-      </template>
-      <template v-slot:mobile="{ row, index }">
-        <el-form-item :prop="`[${index}].mobile`" :rules="formRules.mobile" style="width: 100%">
-          <el-input
-            @change="changeMobile"
-            placeholder="请输入联系方式"
-            :disabled="disabled"
-            v-model.trim="row.mobile" />
-        </el-form-item>
-      </template>
-
-      <template v-slot:action="{ row, index }">
-        <bg-table-btn
-          :disabled="disabled"
-          :click="
-            () => {
-              addParam(index);
-            }
-          "
-          >增加</bg-table-btn
-        >
-        <bg-table-btn
-          :disabled="disabled"
-          :click="
-            () => {
-              removeParam(row, index);
-            }
-          ">
-          删除
-        </bg-table-btn>
-      </template>
-    </bg-table-pro>
-  </el-form>
-</template>
-
-<script setup>
-import { reactive, toRefs, onBeforeMount, onMounted, ref, getCurrentInstance, watch, computed } from "vue";
-import { v4 as uuidv4 } from "uuid";
-import { validatePhone } from "@/services/rules.js";
-const props = defineProps({
-  data: {
-    type: Array,
-    default: () => [],
-  },
-  disabled: {
-    type: Boolean,
-    default: false,
-  },
-});
-
-const emit = defineEmits(["change"]);
-const formSize = ref("default");
-const ruleFormRef = ref(null);
-
-const formRules = reactive({
-  name: [
-    {
-      required: true,
-      message: "请输入键",
-      trigger: "blur",
-    },
-    {
-      max: 50,
-      message: "最多50个字符",
-      trigger: "blur",
-    },
-  ],
-  account: [
-    {
-      required: true,
-      message: "请选择帐号",
-      trigger: "change",
-    },
-  ],
-  mobile: [
-    {
-      required: true,
-      message: "请输入联系方式",
-      trigger: "blur",
-    },
-    { validator: validatePhone, trigger: "blur" },
-  ],
-});
-
-const headers = reactive([
-  {
-    label: "帐号",
-    prop: "account",
-    required: true,
-  },
-  {
-    label: "姓名",
-    prop: "name",
-    required: true,
-  },
-  {
-    label: "联系方式",
-    prop: "mobile",
-    required: true,
-  },
-  {
-    label: "操作",
-    prop: "action",
-    width: 120,
-  },
-]);
-
-const state = reactive({
-  tableRows: [],
-  userLists: [
-    {
-      account: "admin",
-      id: 1,
-      name: "张一",
-      mobile: "13111111111",
-    },
-    {
-      account: "ys-admin",
-      id: 2,
-      name: "张二",
-      mobile: "13222222222",
-    },
-    {
-      account: "yf-user",
-      id: 3,
-      name: "张三",
-      mobile: "13333333333",
-    },
-    {
-      account: "putong",
-      id: 4,
-      name: "张四",
-      mobile: "13444444444",
-    },
-  ],
-});
-
-watch(
-  () => state.tableRows,
-  (n, o) => {
-    let list = state.tableRows.map((e) => {
-      return e.account;
-    });
-    state.userLists.forEach((e) => {
-      if (list.indexOf(e.id) > -1) {
-        e.disabled = true;
-      } else {
-        e.disabled = false;
-      }
-    });
-  },
-  {
-    deep: true,
-  }
-);
-
-// const canAdd = computed(() => {
-//   return state.tableRows.length >= 5 ? false : true;
-// }); // 最多五条数据，控制下新增按钮的禁用
-
-onBeforeMount(() => {
-  initTable();
-});
-
-var initTable = () => {
-  if (props.data && props.data.length >= 1) {
-    state.tableRows = props.data;
-  } else {
-    state.tableRows = [];
-    addParam(0);
-  }
-};
-
-var createRow = () => {
-  return {
-    id: uuidv4(),
-    account: "",
-    name: "",
-    mobile: "",
-  };
-};
-
-var addParam = (index) => {
-  state.tableRows.splice(index + 1, 0, createRow());
-};
-
-var removeParam = (row, index) => {
-  state.tableRows.splice(index, 1);
-  if (state.tableRows.length === 0) {
-    addParam(0);
-  }
-};
-
-const changeAccount = (row) => {
-  state.userLists.forEach((e) => {
-    if (e.id == row.account) {
-      row.name = e.name;
-      row.mobile = e.mobile;
-    }
-  });
-  emit("change", {
-    type: "account",
-    data: state.tableRows,
-  });
-};
-
-const changeName = () => {
-  emit("change", {
-    type: "name",
-    data: state.tableRows,
-  });
-};
-
-const changeMobile = () => {
-  emit("change", {
-    type: "mobile",
-    data: state.tableRows,
-  });
-};
-
-var getInputData = () => {
-  let lastData = [];
-  let tempObj = {};
-  state.tableRows.forEach((e) => {
-    tempObj[e.name] = e;
-  });
-  for (const key in tempObj) {
-    if (key && tempObj[key].value) {
-      lastData.push(tempObj[key]);
-    }
-  }
-  return lastData;
-};
-
-const { tableRows, userLists } = toRefs(state);
-
-//暴露获取数据方法
-defineExpose({
-  getInputData,
-  initTable,
-});
-</script>
-
-<style scoped></style>
diff --git a/src/page/main/ticket/business-ticket-list/index.vue b/src/page/main/ticket/business-ticket-list/index.vue
index cb1da7c..52fff98 100644
--- a/src/page/main/ticket/business-ticket-list/index.vue
+++ b/src/page/main/ticket/business-ticket-list/index.vue
@@ -176,6 +176,7 @@ let headers = reactive([
     prop: "operation",
     align: "left",
     width: "80px",
+    fixed: "right",
   },
 ]);
 let rows = ref([]);
diff --git a/src/page/main/ticket/my-business-ticket/index.vue b/src/page/main/ticket/my-business-ticket/index.vue
index 41043ed..fec12c9 100644
--- a/src/page/main/ticket/my-business-ticket/index.vue
+++ b/src/page/main/ticket/my-business-ticket/index.vue
@@ -174,6 +174,7 @@ let headers = reactive([
     prop: "operation",
     align: "left",
     width: "80px",
+    fixed: "right",
   },
 ]);
 let rows = ref([]);
diff --git a/src/page/main/ticket/my-warn-ticket/detail/index.vue b/src/page/main/ticket/my-warn-ticket/detail/index.vue
index 4f0102f..3587f83 100644
--- a/src/page/main/ticket/my-warn-ticket/detail/index.vue
+++ b/src/page/main/ticket/my-warn-ticket/detail/index.vue
@@ -3,8 +3,15 @@
     <div class="breadcrumb">
       <bg-breadcrumb />
     </div>
-    <div class="content">
-      <warn-detail :label-data="labelData" :value-data="info" :tabs="tabs"></warn-detail>
+    <div class="content bg-scroll">
+      <warn-detail :label-data="labelData" :value-data="info" :tabs="tabs">
+        <template #status="{ item, valueData }">
+          <span class="status-body">
+            <span class="status" :class="`status-${valueData.status}`"></span>
+            <span>{{ statusOptions[valueData[item.prop]] }}</span>
+          </span>
+        </template>
+      </warn-detail>
     </div>
   </div>
 </template>
@@ -12,12 +19,34 @@
 <script setup>
 import bgBreadcrumb from "@/components/bg-breadcrumb.vue";
 import warnDetail from "@/components/warn-detail/index.vue";
+import { useRoute } from "vue-router";
+import { ElMessage } from "element-plus";
+import axios from "@/request/http.js";
+import { ref, onBeforeMount } from "vue";
+const route = useRoute();
+const { id } = route.query;
+const ruleTypeOptions = ref({});
+const statusOptions = {
+  1: "已恢复",
+  2: "未恢复",
+  3: "已关闭",
+};
+const riskLevels = {
+  1: "低风险",
+  2: "一般风险",
+  3: "较大风险",
+  4: "重大风险",
+};
 const labelData = [
   [
     {
       label: "预警点",
       prop: "warning_point",
     },
+    {
+      label: "预警分类",
+      prop: "warning_type",
+    },
   ],
   [
     {
@@ -35,7 +64,7 @@ const labelData = [
       prop: "status",
     },
     {
-      label: "预警阀值",
+      label: "预警阈值",
       prop: "warning_threshold",
     },
   ],
@@ -50,35 +79,12 @@ const labelData = [
     },
   ],
 ];
-const info = {
-  warning_point: "SaaS层/数据治理系统",
-  warning_index: "响应时间超时",
-  risk_level: "一般风险",
-  status: "success",
-  warning_threshold: "10ms",
-  current_alarm_value: "16ms",
-  warning_time: "2020-01-01 00:00:00",
-};
-const tabs = [
+const info = ref({});
+const tabs = ref([
   {
     label: "推送记录",
     prop: "push",
-    lists: [
-      {
-        method: "短信",
-        person: [11, 22, 33, 44],
-        push_time: "2022-07-29 10:23:59",
-        push_type: "自动推送",
-        status: "success",
-      },
-      {
-        method: "钉钉",
-        person: [11, 33, 44],
-        push_time: "2022-07-29 10:23:59",
-        push_type: "自动推送",
-        status: "error",
-      },
-    ],
+    lists: [],
   },
   {
     label: "处置记录",
@@ -98,7 +104,85 @@ const tabs = [
       },
     ],
   },
-];
+]);
+const pushType = {
+  1: "自动推送",
+  2: "手动推送",
+};
+const getInfo = () => {
+  const params = {
+    id,
+  };
+  axios.get("/v1/api/alert_list", { params }).then((res) => {
+    if (res.data.code == 200) {
+      const { data } = res.data;
+      info.value = {
+        warning_point: data.alert_point,
+        warning_type: data.class_parent_name,
+        warning_index: data.class_name,
+        risk_level: riskLevels[data.risk_level],
+        status: data.status,
+        warning_threshold: `${data.alert_condition.thresholds_min}${
+          ruleTypeOptions.value[data.alert_rule_type]?.unit || ""
+        }-${data.alert_condition.thresholds_max}${ruleTypeOptions.value[data.alert_rule_type]?.unit || ""}`,
+        current_alarm_value: data.current_value + (ruleTypeOptions.value[data.alert_rule_type]?.unit || ""),
+        warning_time: data.alert_time?.split("+")[0].replace("T", " ").replace("Z", " ") || "-",
+      };
+      //
+      tabs.value = [
+        {
+          label: "推送记录",
+          prop: "push",
+          lists:
+            data.push_records?.map((e) => {
+              return {
+                method: e.notify_method,
+                person: e.system_account,
+                push_time: e.push_time?.split("+")[0].replace("T", " ").replace("Z", " ") || "-",
+                push_type: pushType[e.push_type],
+                status: e.status,
+              };
+            }) || [],
+        },
+        {
+          label: "处置记录",
+          prop: "dispose",
+          lists:
+            data.disposed_list?.map((e) => {
+              return {
+                status: e.is_disposed,
+                feedback: e.disposal_content,
+                feedback_time: e.disposal_time?.split("+")[0].replace("T", " ").replace("Z", " ") || "-",
+                feedback_person: e.disposal_user,
+              };
+            }) || [],
+        },
+      ];
+    }
+  });
+};
+const GetRuleTypeOptions = () => {
+  const params = {
+    page: 1,
+    page_size: 10000000000000,
+    class: 3,
+  };
+  axios.get(`/v1/api/dict`, { params }).then((res) => {
+    if (res.data.code == 200) {
+      res.data.data?.forEach((e) => {
+        let isEmptyOption = e.name == "空";
+        ruleTypeOptions.value[e.id] = {
+          label: e.name,
+          unit: isEmptyOption ? "" : e.unit,
+        };
+      });
+      getInfo();
+    }
+  });
+};
+onBeforeMount(() => {
+  GetRuleTypeOptions();
+});
 </script>
 
 <style lang="scss" scoped>
@@ -117,6 +201,27 @@ const tabs = [
     box-shadow: 0px 1px 4px 0px rgba(0, 7, 101, 0.15);
     border-radius: 6px;
     padding: 32px;
+    .status {
+      display: inline-block;
+      width: 6px;
+      height: 6px;
+      border-radius: 50%;
+      margin-right: 8px;
+      $statusObj: (
+        1: #48ad97,
+        3: #9e9e9e,
+        2: #3759be,
+      );
+      @each $status, $color in $statusObj {
+        &-#{$status} {
+          background-color: $color;
+        }
+      }
+    }
+    .status-body {
+      display: flex;
+      align-items: center;
+    }
   }
 }
 </style>
diff --git a/src/page/main/ticket/my-warn-ticket/index.vue b/src/page/main/ticket/my-warn-ticket/index.vue
index 0a9639f..438e76a 100644
--- a/src/page/main/ticket/my-warn-ticket/index.vue
+++ b/src/page/main/ticket/my-warn-ticket/index.vue
@@ -4,39 +4,17 @@
       <bg-breadcrumb />
     </div>
     <div class="content">
-      <bg-filter-group @search="changeSearch" v-model="filter.key_word" placeholder="请输入角色名称">
+      <bg-filter-group @search="changeSearch" v-model="filter.keyword" placeholder="请输入预警点/分类/指标">
         <template v-slot:filter_group>
           <div class="left-filter filter_list">
-            <div class="filter_item">
-              <span class="filter_title">预警分类</span>
-              <el-select v-model="filter.warning_type" placeholder="请选择" style="width: 300px">
-                <el-option
-                  v-for="(item, index) in wainingTypeOptions"
-                  :key="'pushOptions' + index"
-                  :label="item.name"
-                  :value="item.value">
-                </el-option>
-              </el-select>
-            </div>
-            <div class="filter_item">
-              <span class="filter_title">预警指标</span>
-              <el-select v-model="filter.warning_index" placeholder="请选择" style="width: 300px">
-                <el-option
-                  v-for="(item, index) in wainingIndexOptions"
-                  :key="'warning_index_options' + index"
-                  :label="item.name"
-                  :value="item.value">
-                </el-option>
-              </el-select>
-            </div>
             <div class="filter_item">
               <span class="filter_title">风险等级</span>
               <el-select v-model="filter.risk_level" placeholder="请选择" style="width: 300px">
                 <el-option
-                  v-for="(item, index) in riskLevelOptions"
-                  :key="'risk_level_options' + index"
-                  :label="item.name"
-                  :value="item.id">
+                  v-for="(value, key, index) in riskLevels"
+                  :key="'riskLevels' + index"
+                  :label="value"
+                  :value="key">
                 </el-option>
               </el-select>
             </div>
@@ -44,17 +22,18 @@
               <span class="filter_title">状态</span>
               <el-select v-model="filter.status" placeholder="请选择" style="width: 300px">
                 <el-option
-                  v-for="(item, index) in statusOptions"
-                  :key="'statusOptions' + index"
-                  :label="item"
-                  :value="index">
+                  v-for="(value, key, index) in statusOptions"
+                  :key="'stateOptions' + index"
+                  :label="value"
+                  :value="key">
                 </el-option>
               </el-select>
             </div>
             <div class="filter_item">
               <span class="filter_title">预警时段</span>
               <el-date-picker
-                v-model="filter.date"
+                v-model="filter.time"
+                style="width: 400px"
                 type="datetimerange"
                 value-format="YYYY-MM-DD HH:mm:ss"
                 range-separator="-"
@@ -72,11 +51,34 @@
       <div class="table_container">
         <div class="table">
           <bg-table ref="listtable" :headers="headers" :rows="rows" height="100%" :isIndex="true" :stripe="true">
-            <template #alert_point="{ row }">
-              <div class="href" @click="goTo(row)">{{ row.alert_point || "-" }}</div>
+            <template v-slot:alert_point="{ row }">
+              <span class="can_click_text" @click="goDetail(row)">
+                {{ row.alert_point }}
+              </span>
+            </template>
+            <template v-slot:risk_level="{ row }">
+              {{ riskLevels[row.risk_level] }}
+            </template>
+            <template v-slot:current_value="{ row }">
+              {{ row.current_value }}{{ ruleTypeOptions[row.alert_rule_type]?.unit || "" }}
+            </template>
+            <template v-slot:warn_threshold="{ row }">
+              {{ row.alert_condition.thresholds_min }}{{ ruleTypeOptions[row.alert_rule_type]?.unit || "" }}
+              -
+              {{ row.alert_condition.thresholds_max }}{{ ruleTypeOptions[row.alert_rule_type]?.unit || "" }}
+            </template>
+            <template v-slot:alert_time="{ row }">
+              {{ row.alert_time ? row.alert_time.split("+")[0].replace("T", " ").replace("Z", " ") : "-" }}
+            </template>
+            <template v-slot:last_push_time="{ row }">
+              {{ row.last_push_time ? row.last_push_time.split("+")[0].replace("T", " ").replace("Z", " ") : "-" }}
+            </template>
+            <template #status="{ row }">
+              <span :class="`circle status-${row.status}`"></span>
+              {{ statusOptions[row.status] }}
             </template>
             <template #operation="{ row }">
-              <el-button type="primary" :disabled="row.order_state != 1" link size="small" @click="operation(row)">
+              <el-button type="primary" :disabled="row.is_disposed == 1" link size="small" @click="operation(row)">
                 处置反馈
               </el-button>
             </template>
@@ -98,87 +100,63 @@
 </template>
 
 <script setup>
-import { ref, reactive, onMounted, nextTick } from "vue";
+import { reactive, ref, onBeforeMount, toRefs, computed, watch, nextTick, watchEffect } from "vue";
+import { ElMessage } from "element-plus";
+import axios from "@/request/http.js";
 import bgBreadcrumb from "@/components/bg-breadcrumb.vue";
 import FeedBack from "../modules/feedback.vue";
 import { useRouter } from "vue-router";
+import { GetRuleTypeOptions } from "@/components/env.js";
 const router = useRouter();
 const filter = reactive({
-  warning_type: "",
-  key_word: "",
-  warning_index: "",
-  risk_level: "",
-  status: "",
-  date: [],
+  risk_level: "", // 风险等级
+  status: "", // 状态
+  time: [],
+  keyword: "",
   page: 1,
   page_size: 10,
 });
 const tableTotal = ref(0);
+const ruleTypeOptions = ref({});
 const filterClear = () => {
-  filter.warning_type = "";
-  filter.key_word = "";
   filter.warning_index = "";
   filter.risk_level = "";
   filter.status = "";
-  filter.date = [];
+  filter.time = [];
   filter.page_size = 10;
   filter.page = 1;
   changePage(1);
 }; // 重置筛选项
 const statusOptions = ["全部", "待处置", "已完成", "已关闭"];
-const wainingTypeOptions = ref([
-  {
-    value: "",
-    name: "全部",
-  },
-]);
-const wainingIndexOptions = ref([
-  {
-    value: "",
-    name: "全部",
-  },
-]);
-const riskLevelOptions = ref([
-  {
-    id: "",
-    name: "全部",
-  },
-  {
-    id: 4,
-    name: "重大风险",
-  },
-  {
-    id: 3,
-    name: "较大风险",
-  },
-  {
-    id: 2,
-    name: "一般风险",
-  },
-  {
-    id: 1,
-    name: "低风险",
-  },
-]);
+// const disposedOptions = ["", "已处置", "已处置"];
+const riskLevels = {
+  "": "全部",
+  1: "低风险",
+  2: "一般风险",
+  3: "较大风险",
+  4: "重大风险",
+};
 let headers = reactive([
   {
     label: "预警点",
     prop: "alert_point",
     align: "left",
+    width: 180,
   },
   {
     label: "预警时间",
-    prop: "alert_point",
+    prop: "alert_time",
     align: "left",
+    width: 160,
   },
   {
     label: "预警分类",
-    prop: "warning_type",
+    prop: "class_parent_name",
     align: "left",
   },
   {
     label: "预警指标",
-    prop: "warning_index",
+    prop: "class_name",
     align: "left",
   },
   {
@@ -188,42 +166,40 @@ let headers = reactive([
   },
   {
     label: "当前报警值",
-    prop: "current_alarm_value",
+    prop: "current_value",
     align: "left",
   },
   {
     label: "预警阀值",
-    prop: "warning_threshold",
+    prop: "warn_threshold",
     align: "left",
   },
   {
     label: "推送次数",
-    prop: "push_num",
+    prop: "push_count",
     align: "left",
   },
   {
     label: "最近推送时间",
-    prop: "push_time",
+    prop: "last_push_time",
     align: "left",
+    width: 160,
   },
   {
     label: "状态",
     prop: "status",
     align: "left",
+    width: 90,
   },
   {
     label: "操作",
     prop: "operation",
     align: "left",
-    width: "80px",
-  },
-]);
-let rows = ref([
-  {
-    alert_point: 1,
-    id: 1,
+    width: 80,
+    fixed: "right",
   },
 ]);
+let rows = ref([]);
 const changeSize = (size) => {
   filter.page_size = size;
   changePage(1);
@@ -234,26 +210,23 @@ const changePage = (page) => {
   getTableRows();
 };
 const changeSearch = (val) => {
-  filter.key_word = val;
+  filter.keyword = val;
   changePage(1);
 }; // 表格关键字筛选
 
 const filterAction = () => {
   changePage(1);
 }; // 查询按钮
-onMounted(() => {
-  getTableRows();
-});
 
 const getTableRows = async () => {
-  let [startTime = "", endTime = ""] = filter.date || [];
-  let urlParams = {
+  let [start_time = "", end_time = ""] = filter.time || [];
+  let params = {
     ...filter,
-    startTime,
-    endTime,
+    start_time,
+    end_time,
   };
-  Reflect.deleteProperty(urlParams, "date");
-  axios.get("/v1/api/alert_list/list", { params: urlParams }).then((res) => {
+  Reflect.deleteProperty(params, "time");
+  axios.get("/v1/api/alert_list/list", { params }).then((res) => {
     if (res.data.code == 200) {
       let { list, total_count } = res.data.data;
       rows.value = list || [];
@@ -270,7 +243,7 @@ const operation = (row) => {
   active_row.value = row;
   visible.value = true;
 };
-const goTo = ({ id }) => {
+const goDetail = ({ id }) => {
   router.push({
     path: "/ticket/my-warn-ticket/detail",
     query: {
@@ -278,6 +251,13 @@ const goTo = ({ id }) => {
     },
   });
 };
+const getRuleTypeOptions = async () => {
+  ruleTypeOptions.value = await GetRuleTypeOptions();
+  getTableRows();
+};
+onBeforeMount(() => {
+  getRuleTypeOptions();
+});
 </script>
 
 <style lang="scss" scoped>
-- 
2.26.0