From de1de0e73bd260cb1babe7b15c9e943a381009de Mon Sep 17 00:00:00 2001
From: web <candymxq888@outlook.com>
Date: 星期五, 21 三月 2025 17:22:26 +0800
Subject: [PATCH] feat:增加温度系统界面
---
src/views/screen/temperature/report/index.vue | 112 ++++++++++++++++++++++++++++++++++++++++++++++++++++++-
1 files changed, 109 insertions(+), 3 deletions(-)
diff --git a/src/views/screen/temperature/report/index.vue b/src/views/screen/temperature/report/index.vue
index 678bffa..061c394 100644
--- a/src/views/screen/temperature/report/index.vue
+++ b/src/views/screen/temperature/report/index.vue
@@ -1,13 +1,119 @@
<script setup>
+import {ref} from "vue";
+import Table from '@/components/Table/index.vue'
+
+const selectType = ref(1);
+const typeOption = ref([
+ { label: '水电站流量监测点', value: 1 },
+ { label: '新扎口流量监测点', value: 2 },
+])
+const time = ref()
+let tableHead = [
+ { prop: 'code', label: '流速 (m/s)' },
+ { prop: 'shebei', label: '瞬时流量 (m³/h)', },
+ { prop: 'content', label: '累计流量 (m³)' },
+ { prop: 'sure', label: '采集点' },
+ { prop: 'time', label: '采集时间' },
+]
+
+const getTableData = () => {
+ return new Promise(resolve => {
+ let arr = {
+ data:{
+ list: [
+ { code: '201', shebei: '雷达水位计', content: '设备离线', time: '2025-02-08', sure: 1 },
+ { code: '202', shebei: '雷达水位计', content: '设备离线', time: '2025-02-08', sure: 2 },
+ { code: '203', shebei: '雷达水位计', content: '设备离线', time: '2025-02-08', sure: 3 },
+ { code: '204', shebei: '雷达水位计', content: '设备离线', time: '2025-02-08', sure: 1 },
+ { code: '205', shebei: '雷达水位计', content: '设备离线', time: '2025-02-08', sure: 1 },
+ { code: '206', shebei: '雷达水位计', content: '设备离线', time: '2025-02-08', sure: 1 },
+ { code: '207', shebei: '雷达水位计', content: '设备离线', time: '2025-02-08', sure: 1 },
+ { code: '208', shebei: '雷达水位计', content: '设备离线', time: '2025-02-08', sure: 2 },
+ { code: '209', shebei: '雷达水位计', content: '设备离线', time: '2025-02-08', sure: 3 },
+ { code: '2010', shebei: '雷达水位计', content: '设备离线', time: '2025-02-08', sure: 3 },
+ ]
+ },
+ total: 30,
+ }
+ resolve(arr)
+ })
+}
</script>
<template>
- <div>
- 报表管理
+ <div class="report">
+ <div class="report-tool">
+ <el-select
+ v-model="selectType"
+ class="tool-select"
+ size="large"
+ placeholder="Select"
+ style="width: 20rem"
+ >
+ <el-option
+ v-for="item in typeOption"
+ :key="item.value"
+ :label="item.label"
+ :value="item.value"
+ />
+ </el-select>
+ <el-select
+ v-model="selectType"
+ class="tool-select"
+ size="large"
+ placeholder="Select"
+ style="width: 20rem"
+ >
+ <el-option
+ v-for="item in typeOption"
+ :key="item.value"
+ :label="item.label"
+ :value="item.value"
+ />
+ </el-select>
+ <el-date-picker
+ v-model="time"
+ type="datetimerange"
+ format="YYYY-MM-DD HH:mm:ss"
+ size="large"
+ style="width: 30rem"
+ range-separator="至"
+ start-placeholder="开始时间"
+ end-placeholder="结束时间"
+ />
+ <el-button type="success" size="large" style="width: 6rem">一键导出</el-button>
+ </div>
+ <div class="report-table">
+ <Table :getList="getTableData" :headList="tableHead"></Table>
+ </div>
</div>
</template>
<style scoped lang="scss">
-
+.report{
+ height: 100%;
+ background: linear-gradient( 180deg, #91BDDB 0%, rgba(102, 102, 102, 0.5) 100%);
+ display: flex;
+ flex-direction: column;
+ align-items: center;
+ &-tool{
+ padding: 10px 0;
+ display: flex;
+ justify-content: center;
+ align-items: center;
+ gap: 30px;
+ :deep(.el-date-editor){
+ flex-grow: 0;
+ }
+ }
+ &-table{
+ width: 96%;
+ height: 90%;
+ background: rgba(23,108,229,0.3);
+ border: 1px solid #176CE5;
+ border-radius: 8px;
+ padding: 20px;
+ }
+}
</style>
\ No newline at end of file
--
Gitblit v1.9.3