Merge branch 'master' of http://8.141.155.183:3000/bjquanjiang/pinganxiaoyuan

SafeCampus.WEB/src/api/modules/screen/index.ts

@@ -23,31 +23,31 @@ const http = moduleRequest("/large/screen/");
 const screenApi = {
   /** 获取大屏首页数据 */
   getHomeData(params: any={}) {
-    return http.get("getHomeData", params);
+    return http.get("getHomeData", params,{loading:false});
   },
   /** 获取大屏学生归寝数据 */
   getStudentReturnBed(params: any={}) {
-    return http.get("getStudentReturnBed", params);
+    return http.get("getStudentReturnBed", params,{loading:false});
   },
   /** 获取大屏智慧课堂数据 */
   getSmartClassroom(params: any={}) {
-    return http.get("getSmartClassroom", params);
+    return http.get("getSmartClassroom", params,{loading:false});
   },
   /** 获取宿舍楼 */
   getNoPageList(params: any={}) {
-    return http.get("getNoPageList", params);
+    return http.get("getNoPageList", params,{loading:false});
   },
   /** 获取班级列表 */
   getPersonSetNoPageList(params: any={}) {
-    return http.get("getPersonSetNoPageList", params);
+    return http.get("getPersonSetNoPageList", params,{loading:false});
   },
   /** 获取单页详情 */
   detail(params: any) {
-    return http.get("getStartVideoLive", params);
+    return http.get("getStartVideoLive", params,{loading:false});
   },
   /** 获取单页详情 */
   stopUrl(params: any) {
-    return http.get("getStopVideoLive", params);
+    return http.get("getStopVideoLive", params,{loading:false});
   },
 };
 

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/screen/classroom.vue

@@ -34,18 +34,18 @@
           <iframe :src="rtsUrl" frameborder="0" style="width: 100%; height: 100%"></iframe>
         </div>
         <div class="stuEnterList myborder">
-          <stuEnterList :screenData="screenData"></stuEnterList>
+          <stuEnterList ref="stuEnterListRef" :screenData="screenData"></stuEnterList>
         </div>
       </div>
       <div class="main-bottom">
         <div class="classStatistics myborder">
-          <classStatistics :screenData="screenData"></classStatistics>
+          <classStatistics ref="classStatisticsRef" :screenData="screenData"></classStatistics>
         </div>
         <div class="classNotice myborder">
-          <classNotice :screenData="screenData"></classNotice>
+          <classNotice ref="classNoticeRef" :screenData="screenData"></classNotice>
         </div>
         <div class="classAnalysis myborder">
-          <classAnalysis :screenData="screenData" />
+          <classAnalysis ref="classAnalysisRef" :screenData="screenData" />
         </div>
       </div>
     </main>
@@ -63,17 +63,15 @@ const screenData = ref({});
 const classInfo = ref({});
 const ready = ref(false);
 const classRoom = ref({});
-const alarmList = ref([]);
-const rollCall = ref([]);
-const statisti = ref({
-  labale: [],
-  value: []
-});
+const stuEnterListRef = ref(null);
+const classStatisticsRef = ref(null);
+const classNoticeRef = ref(null);
+const classAnalysisRef = ref(null);
 const getClassRoomInfo = obj => {
-  classInfo.value = obj;
+  if (obj) classInfo.value = obj;
+  if (!timer) refresh(getClassRoomInfo, 60000);
   // 归寝人数信息
-  ready.value = false;
-  screenApi.getSmartClassroom({ personSetId: obj.value }).then(res => {
+  return screenApi.getSmartClassroom({ personSetId: classInfo.value.value }).then(res => {
     if (res.code == 200) {
       screenData.value = res.data;
       classRoom.value = screenData.value.classRoom;
@@ -84,10 +82,6 @@ const getClassRoomInfo = obj => {
         classRoom.value.isClassing = true;
       }
       showRts(classRoom.value.cameraId);
-      classInfo.value = screenData.value.classInfo;
-      alarmList.value = screenData.value.alarmList;
-      rollCall.value = screenData.value.rollCall;
-      statisti.value = screenData.value.statisti;
       console.log(res.data);
       ready.value = true;
       nextTick(() => {
@@ -96,6 +90,17 @@ const getClassRoomInfo = obj => {
     }
   });
 };
+// 定时刷新
+var timer = "";
+const refresh = (fn = () => {}, time = 5000) => {
+  timer = setInterval(async () => {
+    await fn();
+    stuEnterListRef.value.init();
+    classStatisticsRef.value.init();
+    classNoticeRef.value.init();
+    classAnalysisRef.value.init();
+  }, time);
+};
 // 监控
 const streamId = ref("");
 const videoToken = ref("");
@@ -128,6 +133,7 @@ const stopUrl = () => {
 };
 onUnmounted(() => {
   stopUrl();
+  timer && clearInterval(timer);
 });
 </script>
 <style lang="scss" scoped>

SafeCampus.WEB/src/views/screen/component/classroom/classAnalysis.vue

@@ -20,9 +20,12 @@ const props = defineProps({
 });
 const statisti = ref({});
 onMounted(() => {
+  init();
+});
+const init = () => {
   statisti.value = props.screenData.statisti;
   getCharts1();
-});
+};
 const getCharts1 = () => {
   const chart = echarts.init(chart1.value);
   let data = statisti.value.labale.map((e, i) => {
@@ -103,6 +106,9 @@ const getCharts1 = () => {
     chart.resize();
   });
 };
+defineExpose({
+  init
+});
 </script>
 <style lang="scss" scoped>
 </style>

SafeCampus.WEB/src/views/screen/component/classroom/classNotice.vue

@@ -30,7 +30,13 @@ const props = defineProps({
 });
 const alarmList = ref([]);
 onMounted(() => {
+  init();
+});
+const init = () => {
   alarmList.value = props.screenData.alarmList || [];
+};
+defineExpose({
+  init
 });
 </script>
 <style scoped lang="scss">

SafeCampus.WEB/src/views/screen/component/classroom/classStatistics.vue

@@ -19,10 +19,6 @@ const props = defineProps({
 });
 const statisti = ref({});
 let chart1 = ref(null);
-onMounted(() => {
-  statisti.value = props.screenData.statisti;
-  getCharts1();
-});
 const getCharts1 = () => {
   const chart = echarts.init(chart1.value);
   let data = statisti.value.labale.map((e, i) => {
@@ -99,6 +95,16 @@ const getCharts1 = () => {
     chart.resize();
   });
 };
+onMounted(() => {
+  init();
+});
+const init = () => {
+  statisti.value = props.screenData.statisti;
+  getCharts1();
+};
+defineExpose({
+  init
+});
 </script>
   <style lang="scss" scoped>
 </style>

SafeCampus.WEB/src/views/screen/component/classroom/stuEnterList.vue

@@ -37,11 +37,17 @@ const props = defineProps({
 });
 const studentList = ref([]);
 onMounted(() => {
+  init();
+});
+const init = () => {
   studentList.value = props.screenData.studentList;
   studentList.value = studentList.value.map(e => {
     e.faceUrl = e.faces.length ? e.faces[0].faceUrl : "";
     return e;
   });
+};
+defineExpose({
+  init
 });
 </script>
 <style scoped lang="scss">

SafeCampus.WEB/src/views/screen/component/header.vue

@@ -37,7 +37,7 @@
     </div>
     <div class="right">
       <div class="time">{{ currentDate }}</div>
-      <img src="/static/screen/img/greenLight.png" alt="" />
+      <!-- <img src="/static/screen/img/greenLight.png" alt="" /> -->
     </div>
   </header>
 </template>

SafeCampus.WEB/src/views/screen/component/index/peopeleNum.vue

@@ -62,11 +62,14 @@ let chart1 = ref(null);
 let chart2 = ref(null);
 let chart3 = ref(null);
 onMounted(() => {
+  init();
+});
+const init = () => {
   getstudentPersonNum();
   getCharts1();
   getCharts2();
   getCharts3();
-});
+};
 // 学生人数
 const studentPersonNumKeyValue = { femaleNum: "女生人数", maleNum: "男生人数", totalNum: "学生总人数" };
 const studentPersonNum_ = reactive({
@@ -80,7 +83,7 @@ const studentPersonNum = reactive({
   totalNum: []
 });
 const getstudentPersonNum = () => {
-  studentPersonNum_.value = props.screenData.studentPersonNum;
+  studentPersonNum_.value = props.screenData.studentPersonNum || { femaleNum: 0, maleNum: 0, totalNum: 0 };
   for (const key in studentPersonNum_.value) {
     let item = studentPersonNum_.value[key];
     let arr = item.toString().split("");
@@ -237,7 +240,7 @@ const getCharts2 = data => {
 const count = ref(0);
 const getCharts3 = () => {
   const chart = echarts.init(chart3.value);
-  let data = props.screenData.camera;
+  let data = props.screenData.camera || [];
   let xArr = data.map(e => e.cameraInfos.length);
   xArr.forEach(element => {
     count.value += element;
@@ -312,6 +315,9 @@ const getCharts3 = () => {
     chart.resize();
   });
 };
+defineExpose({
+  init
+});
 </script>
 <style scoped lang="scss">
 ul {

SafeCampus.WEB/src/views/screen/component/index/todayInfo.vue

@@ -98,7 +98,13 @@ const placeChange = () => {
   }
 };
 onMounted(() => {
+  init();
+});
+const init = () => {
   getwarnList();
+};
+defineExpose({
+  init
 });
 </script>
 

SafeCampus.WEB/src/views/screen/component/index/todayNotice.vue

@@ -87,9 +87,12 @@ const getData = () => {
   });
 };
 onMounted(() => {
+  init();
+});
+const init = () => {
   getData();
   getRightData();
-});
+};
 // 右边模块
 const groupStatisti = ref([]);
 const getRightData = () => {
@@ -115,6 +118,9 @@ const setBoder1 = () => {
     e.append(borderImgs);
   });
 };
+defineExpose({
+  init
+});
 </script>
 <style scoped lang="scss">
 .commontitle {

SafeCampus.WEB/src/views/screen/component/index/video.vue

@@ -80,9 +80,9 @@ const areaId = ref("");
 const sensorId = ref("");
 // 获取区域设备信息
 const getInfo = () => {
-  resInfo.value = props.screenData.camera;
+  resInfo.value = props.screenData.camera || [];
   areaList.value = JSON.parse(JSON.stringify(resInfo.value));
-  props.screenData.camera.forEach(e => {
+  resInfo.value.forEach(e => {
     allDevice.value = allDevice.value.concat(e.cameraInfos);
   });
   let obj = areaList.value.find(e => e.cameraInfos.length);
@@ -141,10 +141,15 @@ const stopUrl = () => {
 };
 onMounted(() => {
   getInfo();
+  init();
 });
+const init = () => {};
 onUnmounted(() => {
   stopUrl();
 });
+defineExpose({
+  init
+});
 </script>
 <style lang="scss" scoped>
 .myvideo {

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

@@ -11,21 +11,21 @@
         <div class="main-left">
           <div style="display: flex">
             <div class="peapleNum myborder">
-              <peopeleNum :screenData="screenData"></peopeleNum>
+              <peopeleNum ref="peopeleNumRef" :screenData="screenData"></peopeleNum>
             </div>
             <div class="videoBox myborder">
-              <myVideo :screenData="screenData"></myVideo>
+              <myVideo ref="myVideoRef" :screenData="screenData"></myVideo>
             </div>
           </div>
           <div class="todayNotice myborder">
-            <todayNotice :screenData="screenData"></todayNotice>
+            <todayNotice ref="todayNoticeRef" :screenData="screenData"></todayNotice>
           </div>
         </div>
       </div>
       <!-- 页面右边模块 -->
       <div>
         <div class="main-right myborder">
-          <todayInfo :screenData="screenData"></todayInfo>
+          <todayInfo ref="todayInfoRef" :screenData="screenData"></todayInfo>
         </div>
       </div>
     </main>
@@ -41,9 +41,22 @@ import { screenApi } from "@/api";
 const screenData = ref({});
 const ready = ref(false);
 const myHeaderRef = ref(null);
+const peopeleNumRef = ref(null);
+const myVideoRef = ref(null);
+const todayNoticeRef = ref(null);
+const todayInfoRef = ref(null);
 onMounted(() => {
-  ready.value = false;
-  screenApi.getHomeData().then(res => {
+  getData();
+  refresh(async () => {
+    await getData();
+    peopeleNumRef.value.init();
+    myVideoRef.value.init();
+    todayNoticeRef.value.init();
+    todayInfoRef.value.init();
+  }, 60000);
+});
+const getData = () => {
+  return screenApi.getHomeData().then(res => {
     if (res.code == 200) {
       screenData.value = res.data;
       console.log(res.data);
@@ -53,6 +66,14 @@ onMounted(() => {
       });
     }
   });
+};
+// 定时刷新
+var timer = "";
+const refresh = (fn = () => {}, time = 5000) => {
+  timer = setInterval(fn, time);
+};
+onUnmounted(() => {
+  timer && clearInterval(timer);
 });
 </script>
 <style lang="scss" scoped>

SafeCampus.WEB/src/views/screen/stureturn.vue

@@ -81,11 +81,11 @@ const ready = ref(false);
 const chamberList = ref([]);
 const tableData = ref([]);
 const buildInfo = ref({});
-const getStuReturnInfo = obj => {
-  buildInfo.value = obj;
-  // 归寝人数信息
-  ready.value = false;
-  screenApi.getStudentReturnBed({ buildId: obj.value }).then(res => {
+const getStuReturnInfo = async obj => {
+  if (obj) buildInfo.value = obj;
+  // 监控
+  showRts(buildInfo.value.insCameraId);
+  screenApi.getStudentReturnBed({ buildId: buildInfo.value.value }).then(res => {
     if (res.code == 200) {
       res.data.attendList = res.data.attendList.map(e => {
         e.$status = e.cameraId == buildInfo.value.outCameraId ? "未归寝" : e.cameraId == buildInfo.value.insCameraId ? "归寝" : "";
@@ -98,8 +98,12 @@ const getStuReturnInfo = obj => {
       getstudentPersonNum();
     }
   });
-  // 监控
-  showRts(buildInfo.value.insCameraId);
+  if (!timer) refresh(getStuReturnInfo, 60000);
+};
+// 定时刷新
+var timer = "";
+const refresh = (fn = () => {}, time = 5000) => {
+  timer = setInterval(fn, time);
 };
 // 性别
 const genderOptions = ref([
@@ -152,6 +156,7 @@ const stopUrl = () => {
 };
 onUnmounted(() => {
   stopUrl();
+  timer && clearInterval(timer);
 });
 // 归寝信息
 const studentPersonNum_ = reactive({

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

@@ -4,125 +4,151 @@
  * @Date: 2023-12-15 15:44:05
 !-->
 <template>
-  <div class="table-box">
-    <ProTable ref="proTable" title="预警列表" :columns="columns" :request-api="warnZJRQApi.page">
-      <!-- 表格 header 按钮 -->
-      <template #tableHeader="scope">
-        <!-- <s-button suffix="预警" @click="onOpen(FormOptEnum.ADD)" /> -->
-        <s-button
-          type="danger"
-          plain
-          suffix="预警"
-          :opt="FormOptEnum.DELETE"
-          :disabled="!scope.isSelected"
-          @click="onDelete(scope.selectedListIds, '删除所选数据')"
-        />
-      </template>
-      <!-- 表格 菜单类型 按钮 -->
-      <template #menuType="scope">
-        <el-space wrap>
-          <el-tag v-if="scope.row.menuType === MenuTypeDictEnum.MENU" type="success">{{
-            dictStore.dictTranslation(SysDictEnum.MENU_TYPE, MenuTypeDictEnum.MENU)
-          }}</el-tag>
-          <el-tag v-else-if="scope.row.menuType === MenuTypeDictEnum.LINK" type="warning">{{
-            dictStore.dictTranslation(SysDictEnum.MENU_TYPE, MenuTypeDictEnum.LINK)
-          }}</el-tag>
-          <el-tag v-else type="info">{{ dictStore.dictTranslation(SysDictEnum.MENU_TYPE, scope.row.menuType) }}</el-tag>
-          <el-tag v-if="scope.row.isHome === true" type="danger">首页</el-tag>
-        </el-space>
-      </template>
-      <!-- 操作 -->
-      <template #operation="scope">
-        <s-button link :opt="FormOptEnum.VIEW" @click="onDetail(scope.row)"> 详情 </s-button>
-        <s-button v-if="scope.row.warnHand == 0" link :opt="FormOptEnum.EDIT" @click="toHandle(FormOptEnum.EDIT, scope.row)">处理</s-button>
-        <s-button link :opt="FormOptEnum.DELETE" @click="onDelete([scope.row.id], `确定删除该预警吗？`)" />
-      </template>
-    </ProTable>
-    <el-dialog v-model="visible" :title="detailData.alarmTypeDesc + '-' + detailData.tick" width="830px" :before-close="handleClose">
-      <div>
-        <img class="detailpic" :src="detailData.snapshotUrl" alt="" />
-        <el-row :gutter="20">
-          <el-col :span="12">
-            <div class="linebox">所属学校：演示学校</div>
-          </el-col>
-          <el-col :span="12">
-            <div class="linebox">班级：{{ detailData.personSetName ? detailData.personSetName : "暂无数据" }}</div>
-          </el-col>
-          <el-col :span="12">
-            <div class="linebox">姓名：{{ detailData.personName ? detailData.personName : "暂无数据" }}</div>
-          </el-col>
-          <el-col :span="12">
-            <div class="linebox">预警摄像头：{{ detailData.cameraName }}</div>
-          </el-col>
-          <el-col :span="12">
-            <div class="linebox">预警类型：{{ detailData.alarmTypeDesc }}</div>
-          </el-col>
-          <el-col :span="12">
-            <div class="linebox">预警时间：{{ detailData.tick }}</div>
-          </el-col>
+  <div class="main-box">
+    <TreeFilter
+      ref="treeFilters"
+      title="预警类型"
+      label="label"
+      id="value"
+      :isData="true"
+      width="240px"
+      :data="warnOptions"
+      @change="changeType"
+    ></TreeFilter>
 
-          <el-col :span="12">
-            <div class="linebox">备注信息：{{ detailData.extend ? detailData.extend : "暂无数据" }}</div>
-          </el-col>
-          <el-col :span="12">
-            <div class="linebox">
-              复核视频：
-              <span style="cursor: pointer" v-if="detailData.videoUrl" @click="onPlay(detailData.videoUrl)">
-                <el-icon color="#409efc" :size="20">
-                  <VideoCamera />
-                </el-icon>
-                <!-- <el-icon><VideoCamera /></el-icon> -->
-              </span>
-              <span v-else>暂无数据</span>
-              <!-- {{ detailData.videoUrl }} -->
-            </div>
-          </el-col>
-          <el-col :span="24">
-            <div class="linebox">
-              处理意见：
-              <span style="cursor: pointer" v-if="detailData.remark">
-                {{ detailData.remark }}
-              </span>
-              <span v-else>暂无数据</span>
-              <!-- {{ detailData.videoUrl }} -->
-            </div>
-          </el-col>
-        </el-row>
-      </div>
-      <template #footer>
-        <div class="dialog-footer">
-          <el-button @click="visible = false">关闭</el-button>
+    <div class="table-box">
+      <ProTable ref="proTable" title="预警列表" :columns="columns" :request-api="getTableList" @reset="resetRecords">
+        <!-- 表格 header 按钮 -->
+        <template #tableHeader="scope">
+          <!-- <s-button suffix="预警" @click="onOpen(FormOptEnum.ADD)" /> -->
+          <s-button
+            type="danger"
+            plain
+            suffix="预警"
+            :opt="FormOptEnum.DELETE"
+            :disabled="!scope.isSelected"
+            @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>
+            <el-tag v-if="scope.row.menuType === MenuTypeDictEnum.MENU" type="success">{{
+              dictStore.dictTranslation(SysDictEnum.MENU_TYPE, MenuTypeDictEnum.MENU)
+            }}</el-tag>
+            <el-tag v-else-if="scope.row.menuType === MenuTypeDictEnum.LINK" type="warning">{{
+              dictStore.dictTranslation(SysDictEnum.MENU_TYPE, MenuTypeDictEnum.LINK)
+            }}</el-tag>
+            <el-tag v-else type="info">{{ dictStore.dictTranslation(SysDictEnum.MENU_TYPE, scope.row.menuType) }}</el-tag>
+            <el-tag v-if="scope.row.isHome === true" type="danger">首页</el-tag>
+          </el-space>
+        </template>
+        <!-- 操作 -->
+        <template #operation="scope">
+          <s-button link :opt="FormOptEnum.VIEW" @click="onDetail(scope.row)"> 详情 </s-button>
+          <s-button v-if="scope.row.warnHand == 0" link :opt="FormOptEnum.EDIT" @click="toHandle(FormOptEnum.EDIT, scope.row)">处理</s-button>
+          <s-button link :opt="FormOptEnum.DELETE" @click="onDelete([scope.row.id], `确定删除该预警吗？`)" />
+        </template>
+      </ProTable>
+      <el-dialog
+        v-model="visible"
+        :title="detailData.alarmTypeDesc ? detailData.alarmTypeDesc + '-' + detailData.tick : ''"
+        width="830px"
+        :before-close="handleClose"
+      >
+        <div>
+          <img class="detailpic" :src="detailData.snapshotUrl" alt="" />
+          <el-row :gutter="20">
+            <el-col :span="12">
+              <div class="linebox">所属学校：演示学校</div>
+            </el-col>
+            <el-col :span="12">
+              <div class="linebox">班级：{{ detailData.personSetName ? detailData.personSetName : "暂无数据" }}</div>
+            </el-col>
+            <el-col :span="12">
+              <div class="linebox">姓名：{{ detailData.personName ? detailData.personName : "暂无数据" }}</div>
+            </el-col>
+            <el-col :span="12">
+              <div class="linebox">预警摄像头：{{ detailData.cameraName }}</div>
+            </el-col>
+            <el-col :span="12">
+              <div class="linebox">预警类型：{{ detailData.alarmTypeDesc }}</div>
+            </el-col>
+            <el-col :span="12">
+              <div class="linebox">预警时间：{{ detailData.tick }}</div>
+            </el-col>
+
+            <el-col :span="12">
+              <div class="linebox">备注信息：{{ detailData.extend ? detailData.extend : "暂无数据" }}</div>
+            </el-col>
+            <el-col :span="12">
+              <div class="linebox">
+                复核视频：
+                <span style="cursor: pointer" v-if="detailData.videoUrl" @click="onPlay(detailData.videoUrl)">
+                  <el-icon color="#409efc" :size="20">
+                    <VideoCamera />
+                  </el-icon>
+                  <!-- <el-icon><VideoCamera /></el-icon> -->
+                </span>
+                <span v-else>暂无数据</span>
+                <!-- {{ detailData.videoUrl }} -->
+              </div>
+            </el-col>
+            <el-col :span="24">
+              <div class="linebox">
+                处理意见：
+                <span style="cursor: pointer" v-if="detailData.remark">
+                  {{ detailData.remark }}
+                </span>
+                <span v-else>暂无数据</span>
+                <!-- {{ detailData.videoUrl }} -->
+              </div>
+            </el-col>
+          </el-row>
         </div>
-      </template>
-    </el-dialog>
-    <!-- 视频 -->
-    <el-dialog v-model="videoVisible" title="视频" width="830px" :before-close="handleCloseVideo">
-      <div>
-        <div class="dialogHeader">
-          <div></div>
-          <!-- <div class="dialogBtn" @click="refreshUrl">
+        <template #footer>
+          <div class="dialog-footer">
+            <el-button @click="visible = false">关闭</el-button>
+          </div>
+        </template>
+      </el-dialog>
+      <!-- 视频 -->
+      <el-dialog v-model="videoVisible" title="视频" width="830px" :before-close="handleCloseVideo">
+        <div>
+          <div class="dialogHeader">
+            <div></div>
+            <!-- <div class="dialogBtn" @click="refreshUrl">
               <el-icon color="#409efc" :size="20">
                     <Refresh />
               </el-icon>
               <div>刷新视频</div>
             </div> -->
+          </div>
+          <VideoPlay :videoUrl="videoUrls" />
         </div>
-        <VideoPlay :videoUrl="videoUrls" />
-      </div>
-      <template #footer>
-        <div class="dialog-footer">
-          <el-button @click="handleCloseVideo">关闭</el-button>
+        <template #footer>
+          <div class="dialog-footer">
+            <el-button @click="handleCloseVideo">关闭</el-button>
+          </div>
+        </template>
+      </el-dialog>
+      <!-- 预览头像 -->
+      <el-dialog v-model="preViewvisible" title="查看图片" width="830px" :before-close="previewhandleClose">
+        <div style="display: flex; align-items: center; justify-content: center">
+          <img class="detailpic" :src="faceUrl" alt="" />
         </div>
-      </template>
-    </el-dialog>
-    <!-- 预览头像 -->
-    <el-dialog v-model="preViewvisible" title="查看图片" width="830px" :before-close="previewhandleClose">
-      <div style="display: flex; align-items: center; justify-content: center">
-        <img class="detailpic" :src="faceUrl" alt="" />
-      </div>
-    </el-dialog>
-    <!-- 处理预警 -->
-    <handleForm ref="formRefH" />
+      </el-dialog>
+      <!-- 处理预警 -->
+      <handleForm ref="formRefH" />
+    </div>
   </div>
 </template>
 
@@ -155,23 +181,31 @@ function toHandle(opt: FormOptEnum, record: {} | ZJRQ.WarnInfo= {}) {
 }
 let warnOptions = ref([]);
 function getWarnTypeList() {
+  warnOptions.value = []
   setTimeout(async ()=> {
     await warnZJRQApi.warnType({}).then((res:any) => {
-    let { code, data } = res;
-   
-    if (code == 200) {
-      warnOptions.value = data.map((item:any) => {
-        return {
-          label: item.name,
-          value: item.code
-        };
-      })
-      
-    }
-  });
+      let { code, data } = res;
+    
+      if (code == 200) {
+        warnOptions.value = data.map((item:any) => {
+          return {
+            label: item.name,
+            value: item.code
+          };
+        })
+        
+      }
+    });
   })
   
 }
+// 自定义渲染表头（使用tsx语法）
+const headerRender = (scope: any) => {
+  return (
+    <span>{scope.column.label}</span> 
+   
+  );
+};
 // 获取 ProTable 元素，调用其获取刷新数据方法（还能获取到当前查询参数，方便导出携带参数）
 const proTable = ref<ProTableInstance>();
 const dictStore = useDictStore();
@@ -225,12 +259,25 @@ const columns: ColumnProps<ZJRQ.WarnInfo>[] = [
     prop: "alarmType",
     label: "预警类型",
     enum: warnOptions, 
-    search: { 
-      el: "tree-select",
-      // span: 1
-    } 
+    // search: { 
+    //   el: "tree-select",
+    //   // 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: [
@@ -243,58 +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: 1 
+      span: 1 
     } 
   },
-  { 
-    prop: "tick", 
-    label: "预警时间",
-    search: {
-      // 自定义 search 组件
-      span: 1,
-      render: ({ searchParam }) => {
-        return (
-          <div class="flex-center">
-            <el-date-picker
-              style="150px; flex-shink: 1;"
-              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>
-            <el-date-picker
-              style="150px;"
-              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数组
  */
@@ -315,16 +333,14 @@ function RefreshTable() {
 let detailData = ref({});
 function onDetail(row: any) {
   visible.value = true;
-  setTimeout(async ()=> {
-    await warnZJRQApi.detail({ id: row.id }).then((res:any) => {
+   warnZJRQApi.detail({ id: row.id }).then((res:any) => {
       let { code, data } = res;
     
       if (code == 200) {
         detailData.value = data
-        
       }
     });
-  })
+  
   
 }
 
@@ -336,13 +352,21 @@ const videoUrls = ref('');
 const onPlay = (url:string) => {
   videoVisible.value = true;
   videoUrls.value = url
-  console.log(videoUrls.value)
 }
 const handleCloseVideo = () => {
   videoVisible.value = false;
   videoUrls.value = ''
 };
-
+const alarmType = ref<number | string>()
+function changeType(val: number | string) {
+  alarmType.value = val
+  proTable.value!.pageable.pageNum = 1;
+  proTable.value!.searchParam.alarmType = val;
+  proTable.value!.search();
+}
+function resetRecords() {
+  getWarnTypeList()
+}
 </script>
 
 <style lang="scss" scoped>