预警列表修改

SafeCampus.WEB/src/views/login/index.vue

@@ -62,7 +62,7 @@ interface LoginProps {
 
 //默认值
 const props = reactive<LoginProps>({
-  sysName: "校园监控智能分析平台",
+  sysName: "AI监控预警分析平台",
   sysVersion: "",
   sysLogo: "",
   sysTenantOption: TenantEnum.CLOSE,

SafeCampus.WEB/src/views/monitor/live/index.vue

@@ -257,10 +257,14 @@ const append = (type: string, data: Tree) => {
   groupVisible.value = true;
   groupFormType.value = type
   if (type == "edit") {
+    groupTitle.value = "编辑分组";
     groupForm.name = data.name;
     groupForm.id = data.id;
   } else if(type == "addChild") {
+    groupTitle.value = "新增分组";
     groupForm.parentId = data.id
+  } else {
+    groupTitle.value = "新增分组";
   }
 };
 // 删除分组

SafeCampus.WEB/src/views/warn/zjrq/index.vue

@@ -11,13 +11,13 @@
       label="label"
       id="value"
       :isData="true"
-      width="260px"
+      width="240px"
       :data="warnOptions"
       @change="changeType"
     ></TreeFilter>
 
     <div class="table-box">
-      <ProTable ref="proTable" :searchCol="3" title="预警列表" :columns="columns" :request-api="warnZJRQApi.page" @reset="resetRecords">
+      <ProTable ref="proTable" title="预警列表" :columns="columns" :request-api="getTableList" @reset="resetRecords">
         <!-- 表格 header 按钮 -->
         <template #tableHeader="scope">
           <!-- <s-button suffix="预警" @click="onOpen(FormOptEnum.ADD)" /> -->
@@ -30,6 +30,14 @@
             @click="onDelete(scope.selectedListIds, '删除所选数据')"
           />
         </template>
+        <!-- tick -->
+        <template #tick="scope">
+          {{ scope.row.tick }}
+        </template>
+        <template #warnHand="scope">
+          <el-tag v-if="scope.row.warnHand == 1" type="success">已处理</el-tag>
+          <el-tag v-else type="danger">未处理</el-tag>
+        </template>
         <!-- 表格 菜单类型 按钮 -->
         <template #menuType="scope">
           <el-space wrap>
@@ -191,6 +199,13 @@ function getWarnTypeList() {
   })
   
 }
+// 自定义渲染表头（使用tsx语法）
+const headerRender = (scope: HeaderRenderScope<User.ResUserList>) => {
+  return (
+    <span>{scope.column.label}</span>
+   
+  );
+};
 // 获取 ProTable 元素，调用其获取刷新数据方法（还能获取到当前查询参数，方便导出携带参数）
 const proTable = ref<ProTableInstance>();
 const dictStore = useDictStore();
@@ -249,7 +264,20 @@ const columns: ColumnProps<ZJRQ.WarnInfo>[] = [
     //   // span: 1
     // } 
   },
+  
   {
+    prop: "tick", 
+    label: "预警时间",
+    headerRender,
+    width: 180,
+    search: {
+      el: "date-picker",
+      span: 2,
+      props: { type: "datetimerange", valueFormat: "YYYY-MM-DD HH:mm:ss" },
+      // defaultValue: ["2022-11-12 11:35:00", "2022-12-12 11:35:00"]
+    }
+   },
+   {
     prop: "warnHand",
     label: "处理状态",
     enum: [
@@ -262,61 +290,29 @@ const columns: ColumnProps<ZJRQ.WarnInfo>[] = [
         value: 0
       }
     ], 
-    render: scope => {
-      if (scope.row.warnHand === 1) {
-        return "已处理";
-      } else {
-        return "未处理";
-      }
-    },
+    // render: scope => {
+    //   if (scope.row.warnHand === 1) {
+    //     return "已处理";
+    //   } else {
+    //     return "未处理";
+    //   }
+    // },
     search: { 
       el: "tree-select",
-      span: 0.1 
+      span: 1 
     } 
   },
-  { 
-    prop: "tick", 
-    label: "预警时间",
-    width: 180,
-    search: {
-      // 自定义 search 组件
-      span: 1,
-      render: ({ searchParam }) => {
-        return (
-          <div class="flex-center">
-            <el-date-picker
-              
-              v-model={searchParam.StartTick}
-              type="datetime"
-              placeholder="开始时间"
-              format="YYYY-MM-DD HH:mm:ss"
-              date-format="YYYY-MM-DD"
-              time-format="HH:mm:ss"
-              value-format="YYYY-MM-DD HH:mm:ss"
-            />
-            {/* <span class="mr10 ml10">-</span> */}
-            <span style="margin: 0 4px;">-</span>
-            <el-date-picker
-             
-              v-model={searchParam.EndTick}
-              type="datetime"
-              placeholder="结束时间"
-              format="YYYY-MM-DD HH:mm:ss"
-              date-format="YYYY-MM-DD"
-              time-format="HH:mm:ss"
-              value-format="YYYY-MM-DD HH:mm:ss"
-            />
-          </div>
-        );
-      }
-    }
-
-   },
   { prop: "operation", label: "操作", width: 250, fixed: "right" }
 ];
 
 
-/**
+const getTableList = (params: any) => {
+  let newParams = JSON.parse(JSON.stringify(params));
+  newParams.tick && (newParams.StartTick = newParams.tick[0]);
+  newParams.tick && (newParams.EndTick = newParams.tick[1]);
+  delete newParams.tick;
+  return warnZJRQApi.page(newParams);
+};/**
  * 删除
  * @param ids  id数组
  */