智慧运维页面模拟数据填充

src/api/alarm.ts

@@ -0,0 +1,68 @@
+/**
+ * 水文测站实时信息
+ */
+export function getAlarmInfo() {
+  // return request({
+  //   url: '/tbazmw_api/tbazmw/thdata/getRVandDrpMaxDate',
+  //   method: 'get'
+  // })
+  return Promise.resolve([
+    {
+      "id": "1",
+      "deviceName": "设备故障",
+      "content": "COD分析仪故障",
+      "tm": "2024-10-30 14:00:00",
+    }, {
+      "id": "2",
+      "deviceName": "数据中断",
+      "content": "水质监测数据中断",
+      "tm": "2024-10-30 14:00:00",
+    }, {
+      "id": "3",
+      "deviceName": "数据异常",
+      "content": "数据出现大值",
+      "tm": "2024-10-30 14:00:00",
+    }, {
+      "id": "4",
+      "deviceName": "设备故障",
+      "content": "高锰酸盐设备故障",
+      "tm": "2024-10-30 14:00:00",
+    }, {
+      "id": "5",
+      "deviceName": "设备不在线",
+      "content": "设备断电",
+      "tm": "2024-10-30 14:00:00",
+    }, {
+      "id": "6",
+      "deviceName": "温度",
+      "content": "高温报警",
+      "tm": "2024-10-30 14:00:00",
+    }, {
+      "id": "7",
+      "deviceName": "数据跳变",
+      "content": "数据变化范围超10%",
+      "tm": "2024-10-30 14:00:00",
+    }, {
+      "id": "8",
+      "deviceName": "水压",
+      "content": "高压泵进口水压力低报警",
+      "tm": "2024-10-30 14:00:00",
+    }, {
+      "id": "9",
+      "deviceName": "温度",
+      "content": "高温报警",
+      "tm": "2024-10-30 14:00:00",
+    }, {
+      "id": "10",
+      "deviceName": "数据跳变",
+      "content": "数据变化范围超10%",
+      "tm": "2024-10-30 14:00:00",
+    }, {
+      "id": "11",
+      "deviceName": "水压",
+      "content": "高压泵进口水压力低报警",
+      "tm": "2024-10-30 14:00:00",
+    },
+  ])
+}
+

src/components/StripeTable.vue

@@ -12,7 +12,7 @@ function handleClick(row) {
 </script>
 
 <template>
-  <el-table :data="data" height="100%" stripe @row-click="handleClick">
+  <el-table :data="data" height="100%" stripe @row-click="handleClick" style="font-size: 16px">
     <el-table-column v-for="column in columns" :key="column.prop" :label="column.label" :prop="column.prop"
                      :width="column.width" align="center">
       <template v-if="!column.convertFn" #default="scope">
@@ -24,3 +24,9 @@ function handleClick(row) {
     </el-table-column>
   </el-table>
 </template>
+
+<style lang="scss" scoped>
+.custom-table .cell {
+  font-size: 16px; /* 你想要的字体大小 */
+}
+</style>

src/utils/device.ts

@@ -22,7 +22,8 @@ const deviceDetailList = [
     "ueDeviceName": "COD分析仪",
     idx: ['CODMN'],
     img: new URL('@/assets/images/detail2.jpg', import.meta.url).href,
-    detail: '仪表选型来自水利部南京水利水文自动化研究所自研的NSY-CODmn型智能高锰酸盐指数在线分析仪。\n检测方法：高锰酸盐氧化法，光度滴定测量法。'
+    detail: '仪表选型来自水利部南京水利水文自动化研究所自研的NSY-CODmn型智能高锰酸盐指数在线分析仪。\n检测方法：高锰酸盐氧化法，光度滴定测量法。',
+    list:[{}]
   },
   {
     "deviceType": "水质测验设备",

src/views/Detail.vue

@@ -29,7 +29,7 @@ const deviceInfoData = [
   { name: '总磷分析仪', loc: '100米', status: '正常' },
   { name: '总氮分析仪', loc: '100米', status: '正常' },
   { name: '水位计', loc: '100米', status: '正常' },
-  { name: '氢氮分析仪', loc: '100米', status: '正常' }
+  { name: '氨氮分析仪', loc: '100米', status: '正常' }
 ]
 
 

src/views/Device.vue

@@ -6,7 +6,7 @@ import Card01 from '@/components/card/Card01.vue'
 import StripeTable from '@/components/StripeTable.vue'
 import { getDeviceByName } from '@/utils/device'
 import Chart from '@/components/Chart.vue'
-import StationRightButtonGroup from "@/components/StationRightButtonGroup.vue";
+import StationRightButtonGroup from '@/components/StationRightButtonGroup.vue'
 
 const route = useRoute()
 const right3Ref = ref(null)
@@ -14,27 +14,29 @@ const device = ref(getDeviceByName('COD分析仪'))
 
 
 const deviceStatusColumns = [
-  {label: '维护信息', prop: 'name'},
-  {label: '维护人员', prop: 'volume', width: '110'},
-  {label: '维护日期‌', prop: 'updateTm', width: '110'}
+  { label: '维护信息', prop: 'deviceName', width: '100' },
+  { label: '维护人员', prop: 'woker', width: '90' },
+  { label: '维护日期‌', prop: 'updateTm' },
+  { label: '状态', prop: 'status',width: '70' }
 ]
 
 const deviceStatusData = [
-  { name: '总磷分析仪', volume: 2, updateTm: '11-20 15:00:00' },
-  { name: '总氮分析仪', volume: 2, updateTm: '11-20 15:00:00' },
-  { name: '水位计', volume: 2, updateTm: '11-20 15:00:00' },
-  { name: '氢氮分析仪', volume: 2, updateTm: '11-20 15:00:00' }
+  { deviceName: '总磷分析仪', woker: '陈标', updateTm: '11-20 15:00:00', status: '正常' },
+  { deviceName: '总氮分析仪', woker: '于奇', updateTm: '11-20 15:00:00', status: '正常' },
+  { deviceName: '水位计', woker: '张孝荣', updateTm: '11-20 15:00:00', status: '正常' },
+  { deviceName: '氨氮分析仪', woker: '张孝荣', updateTm: '11-20 15:00:00', status: '正常' }
 ]
 const accessoriesColumns = [
-  { label: '试剂名称', prop: 'name' },
-  { label: '添加体积', prop: 'volume', width: '110' },
-  { label: '更换时间', prop: 'updateTm', width: '110' }
+  { label: '耗材名称', prop: 'name', width: '110' },
+  { label: '剩余有效期', prop: 'days', width: '110' },
+  { label: '到期时间', prop: 'updateTm' }
 ]
 const accessoriesData = [
-  { name: '总磷分析仪', volume: 2, updateTm: '11-20 15:00:00' },
-  { name: '总氮分析仪', volume: 2, updateTm: '11-20 15:00:00' },
-  { name: '水位计', volume: 2, updateTm: '11-20 15:00:00' },
-  { name: '氢氮分析仪', volume: 2, updateTm: '11-20 15:00:00' }
+  { name: '1-16泵管', days: 120, updateTm: '11-20 15:00:00' },
+  { name: '试管', days: 20, updateTm: '11-20 15:00:00' },
+  { name: '滴定管', days: 90, updateTm: '11-20 15:00:00' },
+  { name: '3-16泵管', days: 65, updateTm: '11-20 15:00:00' },
+  { name: '瓶子', days: 102, updateTm: '11-20 15:00:00' }
 ]
 
 const reagentColumns = [
@@ -43,127 +45,204 @@ const reagentColumns = [
   { label: '更换时间', prop: 'updateTm', width: '110' }
 ]
 const reagentData = [
-  { name: '总磷分析仪', volume: 2, updateTm: '11-20 15:00:00' },
-  { name: '总氮分析仪', volume: 2, updateTm: '11-20 15:00:00' },
-  { name: '水位计', volume: 2, updateTm: '11-20 15:00:00' },
-  { name: '氢氮分析仪', volume: 2, updateTm: '11-20 15:00:00' }
+  { name: '硫酸溶液', volume: 2, updateTm: '11-20 15:00:00' },
+  { name: '高锰酸钾溶液', volume: 1, updateTm: '11-20 15:00:00' },
+  { name: '草酸钠溶液', volume: 3, updateTm: '11-20 15:00:00' },
+  { name: '去离子水', volume: 2, updateTm: '11-20 15:00:00' }
 ]
 
-function reloadRight3(list) {
-  if (!list || list.length === 0) {
-    return
-  }
-
-  const typeSet = new Set()
-  const times = []
-  list.forEach((item, index) => {
-    Object.keys(item).forEach(key => typeSet.add(key))
-    times.push(item['maintainDate'] || index + 1)
-  })
-  typeSet.delete('maintainDate')
-  const types = Array.from(typeSet)
-  const rawData = []
-  types.forEach(t => {
-    let array = []
-    list.forEach(d => array.push(d[t] || 0))
-    rawData.push(array)
-  })
-  const totalData = []
-  for (let i = 0; i < rawData[0].length; ++i) {
-    let sum = 0
-    for (let j = 0; j < rawData.length; ++j) {
-      sum += Number(rawData[j][i])
-    }
-    totalData.push(sum)
-  }
-  const grid = {
-    left: 10,
-    right: 10,
-    top: 50,
-    bottom: 10,
-    containLabel: true
-  }
-  const series = types.map((name, sid) => {
-    return {
-      name,
-      type: 'bar',
-      stack: 'total',
-      barWidth: '60%',
-      label: { show: false },
-      data: rawData[sid]
-    }
-  })
-  series.push({
-    name: '总计',
-    type: 'bar',
-    stack: 'total',
-    label: {
-      show: true,
-      position: 'top',
-      color: '#fff',
-      formatter: params => totalData[params.dataIndex] + '个'
-    },
-    data: totalData.map(t => 0)
-  })
-  let maxValue = totalData.reduce((a, b) => Math.max(a, b))
+// function reloadRight3(list) {
+//   if (!list || list.length === 0) {
+//     return
+//   }
+//
+//   const typeSet = new Set()
+//   const times = []
+//   list.forEach((item, index) => {
+//     Object.keys(item).forEach(key => typeSet.add(key))
+//     times.push(item['maintainDate'] || index + 1)
+//   })
+//   typeSet.delete('maintainDate')
+//   const types = Array.from(typeSet)
+//   const rawData = []
+//   types.forEach(t => {
+//     let array = []
+//     list.forEach(d => array.push(d[t] || 0))
+//     rawData.push(array)
+//   })
+//   const totalData = []
+//   for (let i = 0; i < rawData[0].length; ++i) {
+//     let sum = 0
+//     for (let j = 0; j < rawData.length; ++j) {
+//       sum += Number(rawData[j][i])
+//     }
+//     totalData.push(sum)
+//   }
+//   const grid = {
+//     left: 10,
+//     right: 10,
+//     top: 50,
+//     bottom: 10,
+//     containLabel: true
+//   }
+//   const series = types.map((name, sid) => {
+//     return {
+//       name,
+//       type: 'bar',
+//       stack: 'total',
+//       barWidth: '60%',
+//       label: { show: false },
+//       data: rawData[sid]
+//     }
+//   })
+//   series.push({
+//     name: '总计',
+//     type: 'bar',
+//     stack: 'total',
+//     label: {
+//       show: true,
+//       position: 'top',
+//       color: '#fff',
+//       formatter: params => totalData[params.dataIndex] + '个'
+//     },
+//     data: totalData.map(t => 0)
+//   })
+//   let maxValue = totalData.reduce((a, b) => Math.max(a, b))
+//   const option = {
+//     tooltip: {
+//       trigger: 'axis',
+//       axisPointer: {
+//         type: 'shadow'
+//       },
+//       formatter(params) {
+//         let circle = `<span style="display:inline-block;margin-right:5px;border-radius:50%;width:10px;height:10px;left:5px;background-color:`
+//         let info = params[0].axisValueLabel
+//         for (let i = 0; i < params.length; i++) {
+//           let param = params[i]
+//           if (i === params.length - 1) {
+//             info += `<br/>${circle}${param.color}"></span> ${param.seriesName}: ${totalData[param.dataIndex]}个`
+//           } else {
+//             if (param.value > 0) {
+//               info += `<br/>${circle}${param.color}"></span> ${param.seriesName}: ${param.value}个`
+//             }
+//           }
+//         }
+//         return info
+//       }
+//     },
+//     legend: {
+//       type: 'scroll',
+//       icon: 'circle',
+//       data: types,
+//       selectedMode: false,
+//       textStyle: {
+//         color: '#fff'
+//       }
+//     },
+//     grid,
+//     yAxis: {
+//       type: 'value',
+//       name: '个',
+//       nameTextStyle: {
+//         color: '#fff'
+//       },
+//       minInterval: 1,
+//       interval: Math.ceil(maxValue / 5),
+//       axisLabel: {
+//         color: '#fff'
+//       }
+//     },
+//     xAxis: {
+//       type: 'category',
+//       axisLabel: {
+//         color: '#fff'
+//       },
+//       data: times
+//     },
+//     series
+//   }
+//   right3Ref.value.loadChart(option)
+// }
+function reloadRight3() {
   const option = {
+    // backgroundColor: "#0B2D55",
     tooltip: {
-      trigger: 'axis',
       axisPointer: {
-        type: 'shadow'
-      },
-      formatter(params) {
-        let circle = `<span style="display:inline-block;margin-right:5px;border-radius:50%;width:10px;height:10px;left:5px;background-color:`
-        let info = params[0].axisValueLabel
-        for (let i = 0; i < params.length; i++) {
-          let param = params[i]
-          if (i === params.length - 1) {
-            info += `<br/>${circle}${param.color}"></span> ${param.seriesName}: ${totalData[param.dataIndex]}个`
-          } else {
-            if (param.value > 0) {
-              info += `<br/>${circle}${param.color}"></span> ${param.seriesName}: ${param.value}个`
-            }
-          }
-        }
-        return info
+        type: 'cross'
       }
     },
-    legend: {
-      type: 'scroll',
-      icon: 'circle',
-      data: types,
-      selectedMode: false,
-      textStyle: {
-        color: '#fff'
-      }
+    grid: {
+      top: '14%',
+      left: '2%',
+      right: '4%',
+      bottom: '5%',
+      containLabel: true
     },
-    grid,
-    yAxis: {
-      type: 'value',
+    xAxis: [{
+      type: 'category',
+      axisLine: { // 坐标轴轴线相关设置。数学上的x轴
+        show: true,
+        lineStyle: {
+          color: '#233e64'
+        }
+      },
+      axisLabel: { // 坐标轴刻度标签的相关设置
+        color: '#02cacf'
+      },
+      axisTick: { show: false },
+      data: ['1-16氯管', 'p3-16氯管', '3-16氯管']
+    }],
+    yAxis: [{
       name: '个',
       nameTextStyle: {
-        color: '#fff'
+        color: '#02cacf'
       },
-      minInterval: 1,
-      interval: Math.ceil(maxValue / 5),
+      min: value => (value.min - 1).toFixed(0),
+      max: value => (value.max + 1).toFixed(0),
       axisLabel: {
-        color: '#fff'
+        margin: 20,
+        color: '#02cacf'
+      },
+      splitLine: {
+        show: true,
+        lineStyle: {
+          color: '#233e64'
+        }
+      },
+      axisLine: {
+        show: true
       }
-    },
-    xAxis: {
-      type: 'category',
-      axisLabel: {
-        color: '#fff'
+    }],
+    series: [{
+      name: '数量',
+      type: 'bar',
+      itemStyle: {
+        color: function(params) {
+          // 根据params的
+          const colorsMap = [
+            '#4768ec',
+            '#92da76',
+            '#dc8a5e'
+          ]
+          //返回对应的颜色
+          return colorsMap[params.dataIndex]
+        }
       },
-      data: times
-    },
-    series
+      barWidth: 50,
+      label: {
+        show: true,
+        position: 'top'
+      },
+      data: [3, 5, 6]
+    }
+    ]
   }
   right3Ref.value.loadChart(option)
 }
 
 onMounted(() => {
-  reloadRight3([])
+  // reloadRight3([])
+  reloadRight3()
 
 })
 </script>
@@ -171,7 +250,7 @@ onMounted(() => {
 <template>
   <right-frame>
     <template #leftModule>
-      <card01 :title="device.name" style="height: 65%">
+      <card01 :title="device.deviceName" style="height: 65%">
         <h4 style="color: #00ccff">设备简介</h4>
         <el-row>
           <el-col :span="16">
@@ -188,7 +267,7 @@ onMounted(() => {
         <p>·检查电源线路，确保干燥和稳定。</p>
         <p>·校准仪器，确保测量准确性。</p>
       </card01>
-      <card01 style="height: 40%" title="设备状态">
+      <card01 style="height: 40%" title="设备维护情况">
         <stripe-table :columns="deviceStatusColumns" :data="deviceStatusData"></stripe-table>
       </card01>
     </template>

src/views/Home.vue

@@ -103,7 +103,7 @@ function reloadRight1() {
         // rotate: -45, //旋转的角度从 -90 度到 90 度。
         color: '#02cacf'
       },
-      data: ['河道', '闸坝', '潮位']
+      data: ['河道水文', '水文', '实验']
     },
     series: [
       {
@@ -117,7 +117,7 @@ function reloadRight1() {
           color: '#fff',
           formatter: params => params.value > 0 ? params.value + '个' : ''
         },
-        data: [1, 2, 4]
+        data: [0, 0, 0]
       },
       {
         name: '超保证（设计）',
@@ -128,7 +128,7 @@ function reloadRight1() {
           color: '#fff',
           formatter: params => params.value > 0 ? params.value + '个' : ''
         },
-        data: [0, 1, 2]
+        data: [0, 0, 0]
       }
     ]
   }

src/views/IntellOper.vue

@@ -11,6 +11,7 @@ import {getPie3DSimple} from "@/utils/chart";
 import {View} from "@/utils/tdInstruction";
 import StationRightButtonGroup from "@/components/StationRightButtonGroup.vue";
 import {getDeviceByName} from "@/utils/device";
+import { getAlarmInfo } from '@/api/alarm'
 
 const route = useRoute()
 
@@ -36,6 +37,32 @@ const deviceColumns = [
 ]
 const deviceData = reactive([])
 
+
+const alarmColumns = [
+  {
+    label: '报警类型', prop: 'deviceName', width: '100',convertFn: (data) => {
+      return data ? data.trim() : ''
+    }
+  },
+  {
+    label: '时间', prop: 'tm',  convertFn: (data) => {
+      return data ? data.substring(5, 16) : ''
+    }
+  },
+  {
+    label: '告警内容', prop: 'content', width: '180', convertFn: (data) => {
+      return data ? data.trim() : ''
+    }
+  },
+]
+const alarmData = reactive([])
+function getAlarmList() {
+  getAlarmInfo().then(res => {
+    alarmData.push(...res)
+    // initPoints()
+  })
+}
+
 const right3Ref = ref(null)
 
 function reloadRight3() {
@@ -118,6 +145,7 @@ const imgSrc = ref(new URL('@/assets/images/szpj.png', import.meta.url).href)
 onMounted(() => {
   getDeviceInfoList()
   getDeviceDetailInfoList()
+  getAlarmList()
   reloadRight3()
 })
 
@@ -185,7 +213,7 @@ function handleDeviceClick(row) {
         <chart ref="right3Ref"></chart>
       </card01>
       <card01 style="height: 65%" title="故障报警列表">
-        <stripe-table :columns="deviceColumns" :data="deviceData"></stripe-table>
+        <stripe-table :columns="alarmColumns" :data="alarmData"></stripe-table>
       </card01>
     </template>
     <template #btnGroup>

src/views/StationHouse.vue

@@ -9,7 +9,7 @@ import {getWaterLevelAndFlowListOfPageByStcd, getWaterQualityLatest} from '@/api
 import {formatd} from '@/utils/ruoyi'
 import {Label, Setting, View} from '@/utils/tdInstruction'
 import StripeTable from '@/components/StripeTable.vue'
-import {getRStLLMaxDate} from '@/api/home'
+import {getAlarmInfo} from '@/api/alarm.ts'
 import StationRightButtonGroup from "@/components/StationRightButtonGroup.vue";
 
 const route = useRoute()
@@ -50,38 +50,28 @@ function getLatestWaterQuality() {
   })
 }
 
-const tableColumns = [
+const alarmColumns = [
   {
-    label: '站名', prop: 'stnm', convertFn: (data) => {
+    label: '报警类型', prop: 'deviceName', width: '100',convertFn: (data) => {
       return data ? data.trim() : ''
     }
   },
   {
-    label: '时间', prop: 'tm', width: '90', convertFn: (data) => {
+    label: '时间', prop: 'tm',  convertFn: (data) => {
       return data ? data.substring(5, 16) : ''
     }
   },
   {
-    label: '水位(m)', prop: 'z', width: '80', convertFn: (data) => {
-      return Number(data).toFixed(2)
-    }
-  },
-  {
-    label: '流量', prop: 'q', width: '70', convertFn: (data) => {
-      return Number(data).toFixed(2)
+    label: '告警内容', prop: 'content', width: '180', convertFn: (data) => {
+      return data ? data.trim() : ''
     }
   },
-  {
-    label: '雨量', prop: 'drp', width: '65', convertFn: (data) => {
-      return data | 0
-    }
-  }
 ]
-const tableData = reactive([])
+const alarmData = reactive([])
 
-function getStationList() {
-  getRStLLMaxDate().then(res => {
-    tableData.push(...res)
+function getAlarmList() {
+  getAlarmInfo().then(res => {
+    alarmData.push(...res)
     // initPoints()
   })
 }
@@ -89,78 +79,83 @@ function getStationList() {
 const left1Ref = ref(null)
 
 async function reloadLeft1() {
-  const sevenDayAgo = new Date(new Date().getTime() - 1 * 24 * 60 * 60 * 1000)
-  const flowData = await getWaterLevelAndFlowListOfPageByStcd({
-    stcd: route.params.stcd,
-    startTime: formatd(sevenDayAgo),
-    endTime: formatd(new Date())
-  }).then(res => {
-    return res.rows
-  })
-  const option = {
-    // backgroundColor: "#0B2D55",
+  const colors = ['#5470C6', '#91CC75', '#EE6666'];
+  var option = {
+    // title: {
+    //   text: '环境温湿度',
+    //   textStyle: {
+    //     fontSize: 14,
+    //     color: '#fff',
+    //   },
+    //   left:'50'
+    //
+    // },
     tooltip: {
-      trigger: 'axis',
+      trigger: 'axis'
+    },
+    legend: {
+      data: ['温度', '湿度'],
+      textStyle: {
+        fontSize: 12,
+        color: '#fff'
+      }
     },
     grid: {
-      top: '14%',
-      left: '2%',
+      left: '5%',
       right: '4%',
-      bottom: '2%',
+      bottom: '1%',
+      top:'20%',
       containLabel: true
     },
-    xAxis: [{
+    xAxis: {
       type: 'category',
       boundaryGap: false,
-      axisLine: { // 坐标轴轴线相关设置。数学上的x轴
+      data: ['11::30', '11:35', '11:40', '11:45', '11:50', '11:55', '12:00', '12:05', '12:10', '12:15']
+    },
+    yAxis: [ {
+      type: 'value',
+      name: ' %',
+      position: 'right',
+      alignTicks: true,
+      axisLine: {
         show: true,
         lineStyle: {
-          color: '#233e64'
+          color: colors[0]
         }
       },
-      axisLabel: { // 坐标轴刻度标签的相关设置
-        color: '#02cacf'
-      },
-      axisTick: {show: false},
-      data: flowData.map(item => item.tm ? item.tm.substring(11, 16) + '\n' + item.tm.substring(5, 10) : '')
-    }],
-    yAxis: [{
-      name: 'm³/s',
-      nameTextStyle: {
-        color: '#02cacf'
-      },
-      min: value => (value.min - 10).toFixed(0),
-      max: value => (value.max + 10).toFixed(0),
       axisLabel: {
-        color: '#02cacf'
-      },
-      splitLine: {
+        formatter: '{value} %'
+      }
+    }, {
+      type: 'value',
+      name: ' °C',
+      position: 'left',
+      alignTicks: true,
+      axisLine: {
         show: true,
         lineStyle: {
-          color: '#233e64'
+          color: colors[1]
         }
       },
-      axisLine: {
-        show: true
+      axisLabel: {
+        formatter: '{value} °C'
       }
     }],
-    series: [{
-      name: '流量',
-      type: 'line',
-      areaStyle: {},
-      smooth: true, //是否平滑曲线显示
-      lineStyle: {
-        color: '#3deaff'
+    series: [
+      {
+        name: '温度',
+        type: 'line',
+        stack: 'Total',
+        data: [20, 21, 25, 26, 32, 30, 26,39,29,30]
       },
-      // barWidth: 18,
-      // label: {
-      //   show: true,
-      //   position: 'top'
-      // },
-      data: flowData.map(item => item.q)
-    }
+      {
+        name: '湿度',
+        type: 'line',
+        stack: 'Total',
+        data: [40, 45, 30, 31, 36, 33, 31,50,30,20]
+      }
     ]
-  }
+  };
   left1Ref.value.loadChart(option)
 }
 
@@ -170,7 +165,7 @@ onMounted(() => {
 
   // 获取最新水质数据
   getLatestWaterQuality()
-  getStationList()
+  getAlarmList()
 
 })
 </script>
@@ -197,7 +192,7 @@ onMounted(() => {
         </el-row>
       </card01>
       <card01 style="height: 55%" title="告警记录">
-        <stripe-table :columns="tableColumns" :data="tableData"></stripe-table>
+        <stripe-table :columns="alarmColumns" :data="alarmData"></stripe-table>
       </card01>
     </template>
     <template #rightModule>