Bläddra i källkod

feat(device): 井盖报警统计页面添加实时报警数据

-为 fzbj、sqbj 和 swbj 三个页面添加当年、当月和当天报警数统计- 实现了翻转报警、水浸报警和水位报警的统计功能
- 优化了页面布局,将井盖统计改为对应的报警类型统计
- 移除了不必要的警告消息
nahida 1 år sedan
förälder
incheckning
32340ea311

+ 101 - 15
src/views/device/manhole/ldzh/fzbj.vue

@@ -18,21 +18,21 @@
       <el-card shadow="hover" class="mb-4">
         <template #header>
           <div class="flex justify-between items-center">
-            <span class="font-bold">井盖统计</span>
+            <span class="font-bold">翻转报警统计</span>
           </div>
         </template>
         <div class="grid grid-cols-1 md:grid-cols-3 gap-4">
           <div class="stat-card bg-blue-50 p-4 rounded-lg">
             <div class="text-blue-500 text-lg font-medium">当年报警数</div>
-            <div class="text-2xl font-bold mt-2">1</div>
+            <div class="text-2xl font-bold mt-2">{{alarmStatis.currentYearAlarmCount}}</div>
           </div>
           <div class="stat-card bg-green-50 p-4 rounded-lg">
             <div class="text-green-500 text-lg font-medium">当月报警数</div>
-            <div class="text-2xl font-bold mt-2">1</div>
+            <div class="text-2xl font-bold mt-2">{{alarmStatis.currentMonthAlarmCount}}</div>
           </div>
           <div class="stat-card bg-red-50 p-4 rounded-lg">
             <div class="text-red-500 text-lg font-medium">当天报警数</div>
-            <div class="text-2xl font-bold mt-2">0</div>
+            <div class="text-2xl font-bold mt-2">{{alarmStatis.currentDayAlarmCount}}</div>
           </div>
         </div>
       </el-card>
@@ -70,10 +70,10 @@
 </template>
 
 <script setup>
-import { onMounted, ref } from "vue";
-import { ElMessage } from "element-plus";
-import { getflipalarmDataAll } from "@/api/ldzh/index";
-import { parseTime, parseTimeEnd } from "@/utils/ruoyi.js";
+import {onMounted, ref} from "vue";
+import {ElMessage} from "element-plus";
+import {getflipalarmDataAll} from "@/api/ldzh/index";
+import {parseTime, parseTimeEnd} from "@/utils/ruoyi.js";
 
 const tableData = ref([]);
 const totals = ref(0);
@@ -82,6 +82,12 @@ const tableLoading = ref(false);
 const currentPage = ref(1);
 const pageSize = ref(10);
 
+const alarmStatis = ref({
+  currentYearAlarmCount:1,
+  currentMonthAlarmCount:1,
+  currentDayAlarmCount:1
+})
+
 // 构建查询参数
 const buildQueryParams = () => {
   return {
@@ -123,9 +129,6 @@ const getManholeAllData = async () => {
       parseTime(dateRange.value[0]),
       parseTimeEnd(dateRange.value[1])
     );
-    if (totals.value === 0) {
-      ElMessage.warning("暂无数据");
-    }
   } catch (error) {
     console.error("获取数据失败:", error);
     ElMessage.error("数据加载失败,请稍后重试");
@@ -158,9 +161,6 @@ const getEchartsAllData = async () => {
       ElMessage.error(res.msg);
       return;
     }
-    if (totals.value === 0) {
-      ElMessage.warning("暂无数据");
-    }
   } catch (error) {
     console.error("获取数据失败:", error);
     ElMessage.error("数据加载失败,请稍后重试");
@@ -176,8 +176,94 @@ const search = () => {
   getManholeAllData();
 };
 
+const getYearAlarm = async () => {
+  const startTime = parseTime(new Date(new Date().getFullYear(),0,1));
+  const EndTime = parseTimeEnd(new Date(new Date().getFullYear(),11,31));
+  const time = startTime+","+EndTime;
+  const query = {
+    pageNum: 1,
+    pageSize: -1 >>> 1,
+    query: [
+      { column: "alarm_status", type: "ne", value: "0" },
+      {
+        column: "create_time",
+        type: "orderByDesc"
+      },
+      {
+        column: "create_time",
+        type: "between",
+        value: time,
+      },
+    ],
+  };
+  const res = await getflipalarmDataAll(query);
+  if(res.code !== 200){
+    ElMessage.error(res.msg);
+  }
+  alarmStatis.value.currentYearAlarmCount = res.data.records.length;
+}
+
+const getDayAlarm = async () => {
+  const startTime = parseTime(new Date(new Date().getFullYear(),new Date().getMonth(),new Date().getDate()));
+  const EndTime = parseTimeEnd(new Date());
+  const time = startTime+","+EndTime;
+  const query = {
+    pageNum: 1,
+    pageSize: -1 >>> 1,
+    query: [
+      { column: "alarm_status", type: "ne", value: "0" },
+      {
+        column: "create_time",
+        type: "orderByDesc"
+      },
+      {
+        column: "create_time",
+        type: "between",
+        value: time,
+      },
+    ],
+  };
+  const res = await getflipalarmDataAll(query);
+  if(res.code !== 200){
+    ElMessage.error(res.msg);
+  }
+  alarmStatis.value.currentDayAlarmCount = res.data.records.length;
+}
+
+const getMonthAlarm = async () => {
+  const startTime = parseTime(new Date(new Date().getFullYear(),new Date().getMonth(),1));
+  const EndTime = parseTimeEnd(new Date(new Date().getFullYear(),new Date().getMonth()+1,0));
+  const time = startTime+","+EndTime;
+  const query = {
+    pageNum: 1,
+    pageSize: -1 >>> 1,
+    query: [
+      { column: "alarm_status", type: "ne", value: "0" },
+      {
+        column: "create_time",
+        type: "orderByDesc"
+      },
+      {
+        column: "create_time",
+        type: "between",
+        value: time,
+      },
+    ],
+  };
+  const res = await getflipalarmDataAll(query);
+  if(res.code !== 200){
+    ElMessage.error(res.msg);
+  }
+  alarmStatis.value.currentMonthAlarmCount = res.data.records.length;
+}
+
 // 初始化加载
-onMounted(getManholeAllData);
+onMounted(()=>{
+  getManholeAllData();
+  getYearAlarm();
+  getMonthAlarm();
+  getDayAlarm();
+});
 </script>
 
 <style scoped>

+ 97 - 9
src/views/device/manhole/ldzh/sqbj.vue

@@ -17,21 +17,21 @@
       <el-card shadow="hover" class="mb-4">
         <template #header>
           <div class="flex justify-between items-center">
-            <span class="font-bold">井盖统计</span>
+            <span class="font-bold">水浸报警统计</span>
           </div>
         </template>
         <div class="grid grid-cols-1 md:grid-cols-3 gap-4">
           <div class="stat-card bg-blue-50 p-4 rounded-lg">
             <div class="text-blue-500 text-lg font-medium">当年报警数</div>
-            <div class="text-2xl font-bold mt-2">1</div>
+            <div class="text-2xl font-bold mt-2">{{ alarmStatis.currentYearAlarmCount}}</div>
           </div>
           <div class="stat-card bg-green-50 p-4 rounded-lg">
             <div class="text-green-500 text-lg font-medium">当月报警数</div>
-            <div class="text-2xl font-bold mt-2">1</div>
+            <div class="text-2xl font-bold mt-2">{{ alarmStatis.currentMonthAlarmCount}}</div>
           </div>
           <div class="stat-card bg-red-50 p-4 rounded-lg">
             <div class="text-red-500 text-lg font-medium">当天报警数</div>
-            <div class="text-2xl font-bold mt-2">0</div>
+            <div class="text-2xl font-bold mt-2">{{alarmStatis.currentDayAlarmCount}}</div>
           </div>
         </div>
       </el-card>
@@ -52,7 +52,6 @@
           </el-tag>
         </template>
       </el-table-column>
-      <el-table-column prop="tiltAngle" label="倾斜角度" />
       <el-table-column prop="createTime" label="创建时间" width="400" />
     </el-table>
 
@@ -79,6 +78,12 @@ const tableLoading = ref(false);
 const currentPage = ref(1);
 const pageSize = ref(10);
 
+const alarmStatis = ref({
+  currentYearAlarmCount:1,
+  currentMonthAlarmCount:1,
+  currentDayAlarmCount:1
+})
+
 // 构建查询参数
 const buildQueryParams = () => ({
   pageNum: currentPage.value,
@@ -111,9 +116,6 @@ const getManholeAllData = async () => {
     totals.value = res.data.total;
     tableData.value = res.data.records || [];
 
-    if (totals.value === 0) {
-      ElMessage.warning("暂无数据");
-    }
   } catch (error) {
     console.error("获取数据失败:", error);
     ElMessage.error("数据加载失败,请稍后重试");
@@ -122,6 +124,87 @@ const getManholeAllData = async () => {
   }
 };
 
+const getYearAlarm = async () => {
+  const startTime = parseTime(new Date(new Date().getFullYear(),0,1));
+  const EndTime = parseTimeEnd(new Date(new Date().getFullYear(),11,31));
+  const time = startTime+","+EndTime;
+  const query = {
+    pageNum: 1,
+    pageSize: -1 >>> 1,
+    query: [
+      { column: "water_infiltration_alarm_status", type: "ne", value: "0" },
+      {
+        column: "create_time",
+        type: "orderByDesc"
+      },
+      {
+        column: "create_time",
+        type: "between",
+        value: time,
+      },
+    ],
+  };
+  const res = await getflipalarmDataAll(query);
+  if(res.code !== 200){
+    ElMessage.error(res.msg);
+  }
+  alarmStatis.value.currentYearAlarmCount = res.data.records.length;
+}
+
+const getDayAlarm = async () => {
+  const startTime = parseTime(new Date(new Date().getFullYear(),new Date().getMonth(),new Date().getDate()));
+  const EndTime = parseTimeEnd(new Date());
+  const time = startTime+","+EndTime;
+  const query = {
+    pageNum: 1,
+    pageSize: -1 >>> 1,
+    query: [
+      { column: "water_infiltration_alarm_status", type: "ne", value: "0" },
+      {
+        column: "create_time",
+        type: "orderByDesc"
+      },
+      {
+        column: "create_time",
+        type: "between",
+        value: time,
+      },
+    ],
+  };
+  const res = await getflipalarmDataAll(query);
+  if(res.code !== 200){
+    ElMessage.error(res.msg);
+  }
+  alarmStatis.value.currentDayAlarmCount = res.data.records.length;
+}
+
+const getMonthAlarm = async () => {
+  const startTime = parseTime(new Date(new Date().getFullYear(),new Date().getMonth(),1));
+  const EndTime = parseTimeEnd(new Date(new Date().getFullYear(),new Date().getMonth()+1,0));
+  const time = startTime+","+EndTime;
+  const query = {
+    pageNum: 1,
+    pageSize: -1 >>> 1,
+    query: [
+      { column: "water_infiltration_alarm_status", type: "ne", value: "0" },
+      {
+        column: "create_time",
+        type: "orderByDesc"
+      },
+      {
+        column: "create_time",
+        type: "between",
+        value: time,
+      },
+    ],
+  };
+  const res = await getflipalarmDataAll(query);
+  if(res.code !== 200){
+    ElMessage.error(res.msg);
+  }
+  alarmStatis.value.currentMonthAlarmCount = res.data.records.length;
+}
+
 // 搜索时重置页码
 const search = () => {
   currentPage.value = 1;
@@ -129,7 +212,12 @@ const search = () => {
 };
 
 // 初始化加载
-onMounted(getManholeAllData);
+onMounted(()=>{
+  getManholeAllData();
+  getYearAlarm();
+  getMonthAlarm();
+  getDayAlarm();
+});
 </script>
 
 <style scoped>

+ 97 - 9
src/views/device/manhole/ldzh/swbj.vue

@@ -17,21 +17,21 @@
       <el-card shadow="hover" class="mb-4">
         <template #header>
           <div class="flex justify-between items-center">
-            <span class="font-bold">井盖统计</span>
+            <span class="font-bold">水位报警统计</span>
           </div>
         </template>
         <div class="grid grid-cols-1 md:grid-cols-3 gap-4">
           <div class="stat-card bg-blue-50 p-4 rounded-lg">
             <div class="text-blue-500 text-lg font-medium">当年报警数</div>
-            <div class="text-2xl font-bold mt-2">1</div>
+            <div class="text-2xl font-bold mt-2">{{ alarmStatis.currentYearAlarmCount}}</div>
           </div>
           <div class="stat-card bg-green-50 p-4 rounded-lg">
             <div class="text-green-500 text-lg font-medium">当月报警数</div>
-            <div class="text-2xl font-bold mt-2">1</div>
+            <div class="text-2xl font-bold mt-2">{{ alarmStatis.currentMonthAlarmCount}}</div>
           </div>
           <div class="stat-card bg-red-50 p-4 rounded-lg">
             <div class="text-red-500 text-lg font-medium">当天报警数</div>
-            <div class="text-2xl font-bold mt-2">0</div>
+            <div class="text-2xl font-bold mt-2">{{ alarmStatis.currentDayAlarmCount}}</div>
           </div>
         </div>
       </el-card>
@@ -52,7 +52,6 @@
           </el-tag>
         </template>
       </el-table-column>
-      <el-table-column prop="tiltAngle" label="倾斜角度" />
       <el-table-column prop="createTime" label="创建时间" width="400" />
     </el-table>
 
@@ -79,6 +78,12 @@ const tableLoading = ref(false);
 const currentPage = ref(1);
 const pageSize = ref(10);
 
+const alarmStatis = ref({
+  currentYearAlarmCount:1,
+  currentMonthAlarmCount:1,
+  currentDayAlarmCount:1
+})
+
 // 构建查询参数
 const buildQueryParams = () => ({
   pageNum: currentPage.value,
@@ -111,9 +116,6 @@ const getManholeAllData = async () => {
     totals.value = res.data.total;
     tableData.value = res.data.records || [];
 
-    if (totals.value === 0) {
-      ElMessage.warning("暂无数据");
-    }
   } catch (error) {
     console.error("获取数据失败:", error);
     ElMessage.error("数据加载失败,请稍后重试");
@@ -122,6 +124,87 @@ const getManholeAllData = async () => {
   }
 };
 
+const getYearAlarm = async () => {
+  const startTime = parseTime(new Date(new Date().getFullYear(),0,1));
+  const EndTime = parseTimeEnd(new Date(new Date().getFullYear(),11,31));
+  const time = startTime+","+EndTime;
+  const query = {
+    pageNum: 1,
+    pageSize: -1 >>> 1,
+    query: [
+      { column: "water_level_alarm_status", type: "ne", value: "0" },
+      {
+        column: "create_time",
+        type: "orderByDesc"
+      },
+      {
+        column: "create_time",
+        type: "between",
+        value: time,
+      },
+    ],
+  };
+  const res = await getflipalarmDataAll(query);
+  if(res.code !== 200){
+    ElMessage.error(res.msg);
+  }
+  alarmStatis.value.currentYearAlarmCount = res.data.records.length;
+}
+
+const getDayAlarm = async () => {
+  const startTime = parseTime(new Date(new Date().getFullYear(),new Date().getMonth(),new Date().getDate()));
+  const EndTime = parseTimeEnd(new Date());
+  const time = startTime+","+EndTime;
+  const query = {
+    pageNum: 1,
+    pageSize: -1 >>> 1,
+    query: [
+      { column: "water_level_alarm_status", type: "ne", value: "0" },
+      {
+        column: "create_time",
+        type: "orderByDesc"
+      },
+      {
+        column: "create_time",
+        type: "between",
+        value: time,
+      },
+    ],
+  };
+  const res = await getflipalarmDataAll(query);
+  if(res.code !== 200){
+    ElMessage.error(res.msg);
+  }
+  alarmStatis.value.currentDayAlarmCount = res.data.records.length;
+}
+
+const getMonthAlarm = async () => {
+  const startTime = parseTime(new Date(new Date().getFullYear(),new Date().getMonth(),1));
+  const EndTime = parseTimeEnd(new Date(new Date().getFullYear(),new Date().getMonth()+1,0));
+  const time = startTime+","+EndTime;
+  const query = {
+    pageNum: 1,
+    pageSize: -1 >>> 1,
+    query: [
+      { column: "water_level_alarm_status", type: "ne", value: "0" },
+      {
+        column: "create_time",
+        type: "orderByDesc"
+      },
+      {
+        column: "create_time",
+        type: "between",
+        value: time,
+      },
+    ],
+  };
+  const res = await getflipalarmDataAll(query);
+  if(res.code !== 200){
+    ElMessage.error(res.msg);
+  }
+  alarmStatis.value.currentMonthAlarmCount = res.data.records.length;
+}
+
 // 搜索时重置页码
 const search = () => {
   currentPage.value = 1;
@@ -129,7 +212,12 @@ const search = () => {
 };
 
 // 初始化加载
-onMounted(getManholeAllData);
+onMounted(()=>{
+  getManholeAllData();
+  getYearAlarm();
+  getMonthAlarm();
+  getDayAlarm();
+});
 </script>
 
 <style scoped>