From 98247bb0b4da9a322c97867262c1a76c53ace520 Mon Sep 17 00:00:00 2001
From: web <candymxq888@outlook.com>
Date: 星期三, 26 三月 2025 17:05:18 +0800
Subject: [PATCH] fix: 生态报表
---
src/api/screen/report/index.js | 25 ++
src/views/screen/flow/shebei/index.vue | 8
src/views/screen/flow/report/index.vue | 122 +++++++-----
src/views/facility/monitorList/index.vue | 5
src/components/Table/index.vue | 13 +
src/views/facility/facilityType/index.vue | 6
src/assets/images/screen_home_bg.png | 0
src/utils/validate.js | 8
.env.development | 2
/dev/null | 3
src/views/system/user/index.vue | 4
src/api/screen/index.js | 21 ++
src/views/facility/facilityList/index.vue | 8
src/screen/index.vue | 32 ++-
src/views/screen/flow/warning/index.vue | 7
src/views/screen/temperature/shebei/index.vue | 118 +++++++-----
src/utils/index.js | 4
src/views/screen/temperature/report/index.vue | 102 +++++-----
src/assets/images/screen_home.png | 0
19 files changed, 294 insertions(+), 194 deletions(-)
diff --git a/.env.development b/.env.development
index 6911e80..c742c27 100644
--- a/.env.development
+++ b/.env.development
@@ -6,7 +6,7 @@
VITE_APP_ENV = 'development'
# 图片地址
-VITE_APP_IMG_BASEURL = 'http://192.168.0.200:8036/upload'
+VITE_APP_IMG_BASEURL='http://192.168.0.200:8036/upload'
# 金川接口
# VITE_APP_PUBLIC_REQUEST_API = 'http://113.250.189.120:8030'
diff --git a/src/api/screen/index.js b/src/api/screen/index.js
new file mode 100644
index 0000000..e0c2c6c
--- /dev/null
+++ b/src/api/screen/index.js
@@ -0,0 +1,21 @@
+import { publicRequest } from '@/utils/request'
+
+/**
+ * 获取生态流量监测点
+ */
+export const getFlowPointList = () => {
+ return publicRequest({
+ url: "/waterFlow/getPointList",
+ method: "GET",
+ })
+}
+
+/**
+ * 获取水温监测点
+ */
+export const getTemperaturePointList = () => {
+ return publicRequest({
+ url: "/waterTemperature/getPointList",
+ method: "GET",
+ })
+}
\ No newline at end of file
diff --git a/src/api/screen/report/index.js b/src/api/screen/report/index.js
new file mode 100644
index 0000000..932b593
--- /dev/null
+++ b/src/api/screen/report/index.js
@@ -0,0 +1,25 @@
+import { publicRequest } from '@/utils/request'
+
+
+/**
+ * 生态流量报表数据
+ */
+export const getFlowReportList = (data) => {
+ return publicRequest({
+ url: '/dataUploadLljRecord/search',
+ method: 'post',
+ data
+ })
+}
+
+/**
+ * 生态流量报表数据导出
+ */
+export const exportFlowReportList = (data) => {
+ return publicRequest({
+ url: '/dataUploadLljRecord/exportExcel',
+ method: 'post',
+ data,
+ responseType: 'blob'
+ })
+}
\ No newline at end of file
diff --git a/src/assets/images/screen_home.png b/src/assets/images/screen_home.png
new file mode 100644
index 0000000..e19043a
--- /dev/null
+++ b/src/assets/images/screen_home.png
Binary files differ
diff --git a/src/assets/images/screen_home_bg.png b/src/assets/images/screen_home_bg.png
new file mode 100644
index 0000000..368b20c
--- /dev/null
+++ b/src/assets/images/screen_home_bg.png
Binary files differ
diff --git a/src/components/Table/index.vue b/src/components/Table/index.vue
index 7c01647..e3f9796 100644
--- a/src/components/Table/index.vue
+++ b/src/components/Table/index.vue
@@ -43,7 +43,7 @@
const loading = ref(false);
// 默认第一页
-const getData = (data={page:1}) => {
+const getData = (data={ page: state.page }) => {
const pagedata = { limit: state.limit, page: data.page, ...props.searchData }
loading.value = true;
props.getList(pagedata).then(res => {
@@ -54,12 +54,19 @@
})
}
+// 分页按钮
+const paginationFun = (data) => {
+ state.page = data.page
+ getData(data)
+}
+
onMounted(() =>{
getData({ page: state.page })
})
// 将方法抛出去，外面可以调用
defineExpose({
+ state,
getData
})
</script>
@@ -109,9 +116,9 @@
<pagination
layout="prev, pager, next, jumper"
:total="state.total"
- :page="state.current"
+ :page="state.page"
:limit="state.limit"
- @pagination="getData"
+ @pagination="paginationFun"
/>
<!-- 页码右侧自定义插槽，可以加自定义按钮 -->
<slot name="pagination"></slot>
diff --git a/src/config/index.js b/src/config/index.js
deleted file mode 100644
index a52f57e..0000000
--- a/src/config/index.js
+++ /dev/null
@@ -1,3 +0,0 @@
-
-// export const PREURL = 'http://113.250.189.120:8029/upload' //图片地址
-export const PREURL = 'https://www.huiwuyuntong.com/water-qinghe-beta/upload' //图片地址
\ No newline at end of file
diff --git a/src/screen/index.vue b/src/screen/index.vue
index 5c5eb42..2dbcd2b 100644
--- a/src/screen/index.vue
+++ b/src/screen/index.vue
@@ -1,8 +1,9 @@
<template>
<div class="container">
+ <div class="t">请选择要进入的系统</div>
<div class="list">
<router-link to="/temp" class="item">水温监测系统</router-link>
- <router-link to="/flow" class="item">流量监测系统</router-link>
+ <router-link to="/flow" class="item">生态流量监测系统</router-link>
</div>
</div>
</template>
@@ -15,22 +16,35 @@
.container{
width: 100%;
height: 100%;
- padding: 100px;
+ background: url("@/assets/images/screen_home_bg.png") no-repeat;
+ background-size: cover;
+ .t{
+ height: 100px;
+ line-height: 100px;
+ font-size: 63px;
+ color: #2F97CC;
+ text-align: center;
+ }
.list{
+ width: 100%;
+ height: calc(100% - 100px);
display: flex;
align-items: center;
+ justify-content: space-between;
gap: 30px;
+ background: url("@/assets/images/screen_home.png") no-repeat 0 50%;
+ background-size: 100%;
}
.item{
- width: 300px;
- height: 150px;
+ width: 44%;
+ height: 300px;
text-align: center;
- line-height: 150px;
- font-size: 28px;
- color: #fff;
- background-color: #1ab394;
- box-shadow: 0 0 10px #1ab394;
+ line-height: 480px;
+ font-size: 44px;
+ letter-spacing: 3px;
+ color: #5DBDED;
border-radius: 10px;
+ font-weight: 700;
}
}
</style>
\ No newline at end of file
diff --git a/src/utils/index.js b/src/utils/index.js
index 8994d62..c86a731 100644
--- a/src/utils/index.js
+++ b/src/utils/index.js
@@ -476,12 +476,12 @@
/**
* blob文件流导出
*/
-export function exportBlobFile(blob) {
+export function exportBlobFile(blob, name) {
const link = document.createElement('a')
const url = URL || window.webkitURL
const href = url.createObjectURL(blob)
link.href = href;
- link.download = '报警记录.xlsx'
+ link.download = name + '.xlsx'
link.click()
}
diff --git a/src/utils/validate.js b/src/utils/validate.js
index 78487c0..b5d17f9 100644
--- a/src/utils/validate.js
+++ b/src/utils/validate.js
@@ -93,12 +93,12 @@
}
//设置图片路径
-import { PREURL } from '@/config/index'
+const imgBaseUrl = import.meta.env.VITE_APP_IMG_BASEURL //图片前缀
export const getImage = (imgList) =>{
if(imgList != null){
return imgList.split(',').map((image) => {
if(image.indexOf('http') == -1 && image != ''){
- return PREURL + image
+ return imgBaseUrl + image
}else {
return image
}
@@ -107,8 +107,8 @@
}
export const setImage = (imgList) =>{
return imgList.map((image) => {
- if(image.indexOf(PREURL) != -1){
- return image.replace(PREURL,'')
+ if(image.indexOf(imgBaseUrl) != -1){
+ return image.replace(imgBaseUrl,'')
}else {
return image
}
diff --git a/src/views/facility/facilityList/index.vue b/src/views/facility/facilityList/index.vue
index 03e6ce3..0faed5d 100644
--- a/src/views/facility/facilityList/index.vue
+++ b/src/views/facility/facilityList/index.vue
@@ -1,16 +1,14 @@
<script setup>
import facilityApi from "@/api/facility/index";
import pointApi from "@/api/facility/point";
-import supplierApi from "@/api/facility/supplier.js";
import facilityTypeApi from "@/api/facility/facilityType.js";
import commonParameters from "@/api/configuration/commonParameters/index.js";
import waterFacilityParameter from "@/api/facility/parameter.js";
-import {PREURL} from '@/config/index'
import setPostParams from "@/utils/searchParams.js";
import {onMounted} from "vue";
const route = useRoute();
-const preUrl = ref(PREURL);
const {proxy} = getCurrentInstance();
+const imgBaseUrl = import.meta.env.VITE_APP_IMG_BASEURL //图片前缀
/**
* 搜索相关
@@ -210,7 +208,7 @@
}
//上传文件，添加图片地址信息
const uploadData = (data) => {
- form.value.facilityUrl = data.toString();
+ form.value.facilityUrl = imgBaseUrl + data.toString();
}
/** 提交按钮 */
@@ -317,7 +315,7 @@
>
<template #default="scope">
<div v-if="key.toString() === 'facilityUrl'" style="height: 50px;margin: 0 auto">
- <img :src="preUrl + scope.row.facilityUrl" class="table-headImg"/>
+ <img :src="imgBaseUrl + scope.row.facilityUrl" class="table-headImg" alt="" />
</div>
</template>
</el-table-column>
diff --git a/src/views/facility/facilityType/index.vue b/src/views/facility/facilityType/index.vue
index 45b0355..d484b16 100644
--- a/src/views/facility/facilityType/index.vue
+++ b/src/views/facility/facilityType/index.vue
@@ -12,7 +12,7 @@
const route = useRoute();
const {proxy} = getCurrentInstance();
-
+const imgBaseUrl = import.meta.env.VITE_APP_IMG_BASEURL //图片前缀
/**
* 搜索相关
@@ -119,7 +119,7 @@
//上传文件，添加图片地址信息
const uploadData = (data) => {
- form.value.headImg = data.newFileView
+ form.value.headImg = imgBaseUrl + data.newFileView
}
/** 提交按钮 */
@@ -208,7 +208,7 @@
>
<template #default="scope">
<div v-if="key.toString() == 'headImg'">
- <img :src="scope.row.headImg" class="table-headImg"/>
+ <img :src="imgBaseUrl + scope.row.headImg" class="table-headImg" alt="" />
</div>
</template>
</el-table-column>
diff --git a/src/views/facility/monitorList/index.vue b/src/views/facility/monitorList/index.vue
index 936c6ca..5a75b87 100644
--- a/src/views/facility/monitorList/index.vue
+++ b/src/views/facility/monitorList/index.vue
@@ -13,6 +13,7 @@
const route = useRoute();
const {proxy} = getCurrentInstance();
+const imgBaseUrl = import.meta.env.VITE_APP_IMG_BASEURL //图片前缀
/**
* 搜索相关
@@ -148,7 +149,7 @@
//上传文件，添加图片地址信息
const uploadData = (data) => {
- form.value.imageUrl = data.toString();
+ form.value.imageUrl = imgBaseUrl + data.toString();
}
/** 提交按钮 */
@@ -243,7 +244,7 @@
>
<template #default="scope">
<div v-if="key === 'imageUrl'">
- <img :src="scope.row.headImg" class="table-headImg"/>
+ <img :src="imgBaseUrl + scope.row.headImg" class="table-headImg" alt="" />
</div>
<div v-else-if="key === 'pointType'">
{{ scope.row.pointType === 1 ? '水温监测点' : '生态流量监测点' }}
diff --git a/src/views/screen/flow/report/index.vue b/src/views/screen/flow/report/index.vue
index 061c394..72cec00 100644
--- a/src/views/screen/flow/report/index.vue
+++ b/src/views/screen/flow/report/index.vue
@@ -1,91 +1,109 @@
<script setup>
-import {ref} from "vue";
+import {ref, onMounted} from "vue";
+import {getFlowPointList} from "@/api/screen/index.js";
+import {getFlowReportList, exportFlowReportList} from "@/api/screen/report/index.js";
import Table from '@/components/Table/index.vue'
+import { exportBlobFile } from '@/utils/index.js'
-const selectType = ref(1);
-const typeOption = ref([
- { label: '水电站流量监测点', value: 1 },
- { label: '新扎口流量监测点', value: 2 },
+const cascaderOption = { label: 'pointName', value: 'id', children: 'childrenList', checkStrictly: true, expandTrigger: 'hover', emitPath: false }; //级联选择器配置
+const typeOption = ref([])
+const timeOption = ref([
+ { label: '小时', value: 1 },
+ { label: '日', value: 2 },
+ { label: '月', value: 3 },
+ { label: '季度', value: 4 },
+ { label: '年', value: 5 },
])
-const time = ref()
+const timeVal = ref([])
+const searchData = reactive({
+ pointId: '',
+ dateType: 2,
+ createTimeRange: ''
+})
+const tableRef = ref(null); //表格实例
let tableHead = [
- { prop: 'code', label: '流速 (m/s)' },
- { prop: 'shebei', label: '瞬时流量 (m³/h)', },
- { prop: 'content', label: '累计流量 (m³)' },
- { prop: 'sure', label: '采集点' },
- { prop: 'time', label: '采集时间' },
+ { prop: 'flowVelocity', label: '流速 (m/s)' },
+ { prop: 'newFlow', label: '瞬时流量 (m³/h)', },
+ { prop: 'totalFlow', label: '累计流量 (m³)' },
+ { prop: 'pointName', label: '采集点' },
+ { prop: 'uploadTimeView', 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)
+// 获取监测点
+const getPoint = () => {
+ getFlowPointList().then(res => {
+ typeOption.value = res.data
})
}
+// 导出报表
+const exportData = () => {
+ let data = {
+ limit: tableRef.value.state.limit,
+ page: tableRef.value.state.page,
+ ...searchData
+ }
+ if(timeVal.value && timeVal.value.length > 0) {
+ data.createTimeRange = timeVal.value[0] + '~' + timeVal.value[1]
+ } else {
+ data.createTimeRange = ''
+ }
+ exportFlowReportList(data).then(res => {
+ exportBlobFile(res, '统计报表')
+ })
+}
+
+// 搜索数据
+const searchTable = () => {
+ if(timeVal.value && timeVal.value.length > 0) {
+ searchData.createTimeRange = timeVal.value[0] + '~' + timeVal.value[1]
+ } else {
+ searchData.createTimeRange = ''
+ }
+ tableRef.value.getData()
+}
+
+onMounted(() => {
+ getPoint()
+})
</script>
<template>
<div class="report">
<div class="report-tool">
+ <el-cascader size="large" v-model="searchData.pointId" :options="typeOption" :show-all-levels="false" :props="cascaderOption" clearable />
<el-select
- v-model="selectType"
+ v-model="searchData.dateType"
class="tool-select"
size="large"
- placeholder="Select"
- style="width: 20rem"
+ placeholder="请选择"
+ clearable
+ style="width: 15rem"
>
<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"
+ v-for="item in timeOption"
:key="item.value"
:label="item.label"
:value="item.value"
/>
</el-select>
<el-date-picker
- v-model="time"
+ v-model="timeVal"
type="datetimerange"
format="YYYY-MM-DD HH:mm:ss"
+ value-format="YYYY-MM-DD HH:mm:ss"
size="large"
style="width: 30rem"
+ clearable
range-separator="至"
start-placeholder="开始时间"
end-placeholder="结束时间"
/>
- <el-button type="success" size="large" style="width: 6rem">一键导出</el-button>
+ <el-button type="primary" size="large" style="width: 6rem" @click="searchTable">搜索</el-button>
+ <el-button type="success" size="large" style="width: 6rem" @click="exportData">一键导出</el-button>
</div>
<div class="report-table">
- <Table :getList="getTableData" :headList="tableHead"></Table>
+ <Table ref="tableRef" :getList="getFlowReportList" :headList="tableHead" :searchData="searchData"></Table>
</div>
</div>
</template>
diff --git a/src/views/screen/flow/shebei/index.vue b/src/views/screen/flow/shebei/index.vue
index 9162fed..5b383c1 100644
--- a/src/views/screen/flow/shebei/index.vue
+++ b/src/views/screen/flow/shebei/index.vue
@@ -5,8 +5,8 @@
import { getFlowMenu } from '@/api/screen/shebei/index.js'
import setPostParams from "@/utils/searchParams.js";
import { useRouter } from "vue-router";
-
const router = useRouter();
+const imgBaseUrl = import.meta.env.VITE_APP_IMG_BASEURL; //图片前缀
const menuList = ref([])
const deviceList = ref([])
@@ -107,7 +107,7 @@
<div>{{item.facilityCode}}</div>
</div>
<div class="item-img">
- <img v-if="item.image" :src="VITE_APP_IMG_BASEURL + item.image" alt="" />
+ <img v-if="item.facilityUrl" :src="imgBaseUrl + item.facilityUrl" alt="" />
</div>
<div class="item-info">
<div class="online">设备在线状态： <span :style="{color: item.isOnline ? '#56d12c' : '#bababa'}">{{item.isOnline ? '在线' : '掉线'}}</span></div>
@@ -123,7 +123,7 @@
<div>{{item.facilityCode}}</div>
</div>
<div class="item-img">
- <img v-if="item.image" :src="VITE_APP_IMG_BASEURL + item.image" alt="" />
+ <img v-if="item.facilityUrl" :src="imgBaseUrl + item.facilityUrl" alt="" />
</div>
<div class="item-info">
<div class="online">设备在线状态： <span :style="{color: item.isOnline ? '#56d12c' : '#bababa'}">{{item.isOnline ? '在线' : '掉线'}}</span></div>
@@ -139,7 +139,7 @@
<div>{{item.facilityCode}}</div>
</div>
<div class="item-img">
- <img v-if="item.image" :src="VITE_APP_IMG_BASEURL + item.image" alt="" />
+ <img v-if="item.facilityUrl" :src="imgBaseUrl + item.facilityUrl" alt="" />
</div>
<div class="item-info">
<div class="online">设备在线状态： <span :style="{color: item.isOnline ? '#56d12c' : '#bababa'}">{{item.isOnline ? '在线' : '掉线'}}</span></div>
diff --git a/src/views/screen/flow/warning/index.vue b/src/views/screen/flow/warning/index.vue
index bfec15f..b208026 100644
--- a/src/views/screen/flow/warning/index.vue
+++ b/src/views/screen/flow/warning/index.vue
@@ -73,8 +73,10 @@
}
const searchTable = () => {
- if(exportTime.value) {
+ if(exportTime.value && exportTime.value.length > 0) {
searchData.createTimeRange = exportTime.value[0] + '~' + exportTime.value[1]
+ }else {
+ searchData.createTimeRange = ''
}
tableRef.value.getData()
}
@@ -82,7 +84,7 @@
// 导出报警报表
const exportWarnTabl = () => {
exportWarnHistory({ createTimeRange: searchData.createTimeRange }).then(res => {
- exportBlobFile(res)
+ exportBlobFile(res, '报警记录')
})
}
@@ -125,6 +127,7 @@
format="YYYY-MM-DD HH:mm:ss"
value-format="YYYY-MM-DD HH:mm:ss"
style="width: 28rem"
+ clearable
range-separator="至"
start-placeholder="开始时间"
end-placeholder="结束时间"
diff --git a/src/views/screen/temperature/report/index.vue b/src/views/screen/temperature/report/index.vue
index 8c58523..47c0271 100644
--- a/src/views/screen/temperature/report/index.vue
+++ b/src/views/screen/temperature/report/index.vue
@@ -1,91 +1,91 @@
<script setup>
-import {ref} from "vue";
+import {ref, onMounted} from "vue";
+import {getTemperaturePointList} from "@/api/screen/index.js";
+import {getFlowReportList} from "@/api/screen/report/index.js";
import Table from '@/components/Table/index.vue'
-const selectType = ref(1);
-const typeOption = ref([
- { label: '水电站流量监测点', value: 1 },
- { label: '新扎口流量监测点', value: 2 },
+const cascaderOption = { label: 'pointName', value: 'id', children: 'childrenList', checkStrictly: true, expandTrigger: 'hover', emitPath: false }; //级联选择器配置
+const typeOption = ref([])
+const timeOption = ref([
+ { label: '小时', value: 1 },
+ { label: '日', value: 2 },
+ { label: '月', value: 3 },
+ { label: '季度', value: 4 },
+ { label: '年', value: 5 },
])
-const time = ref()
+const timeVal = ref([])
+const searchData = reactive({
+ pointId: '',
+ dateType: 2,
+ createTimeRange: ''
+})
+const tableRef = ref(null); //表格实例
let tableHead = [
- { prop: 'code', label: '流速 (m/s)' },
- { prop: 'shebei', label: '瞬时流量 (m³/h)', },
- { prop: 'content', label: '累计流量 (m³)' },
- { prop: 'sure', label: '采集点' },
- { prop: 'time', label: '采集时间' },
+ { prop: 'flowVelocity', label: '流速 (m/s)' },
+ { prop: 'newFlow', label: '瞬时流量 (m³/h)', },
+ { prop: 'totalFlow', label: '累计流量 (m³)' },
+ { prop: 'pointName', label: '采集点' },
+ { prop: 'uploadTimeView', 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)
+// 获取监测点
+const getPoint = () => {
+ getTemperaturePointList().then(res => {
+ typeOption.value = res.data
})
}
+// 搜索数据
+const searchTable = () => {
+ if(timeVal.value && timeVal.value.length > 0) {
+ searchData.createTimeRange = timeVal.value[0] + '~' + timeVal.value[1]
+ } else {
+ searchData.createTimeRange = ''
+ }
+ tableRef.value.getData()
+}
+
+onMounted(() => {
+ getPoint()
+})
</script>
<template>
<div class="report">
<div class="report-tool">
+ <el-cascader size="large" v-model="searchData.pointId" :options="typeOption" :show-all-levels="false" :props="cascaderOption" clearable />
<el-select
- v-model="selectType"
+ v-model="searchData.dateType"
class="tool-select"
size="large"
- placeholder="Select"
- style="width: 20rem"
+ placeholder="请选择"
+ clearable
+ style="width: 15rem"
>
<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"
+ v-for="item in timeOption"
:key="item.value"
:label="item.label"
:value="item.value"
/>
</el-select>
<el-date-picker
- v-model="time"
+ v-model="timeVal"
type="datetimerange"
format="YYYY-MM-DD HH:mm:ss"
+ value-format="YYYY-MM-DD HH:mm:ss"
size="large"
style="width: 30rem"
+ clearable
range-separator="至"
start-placeholder="开始时间"
end-placeholder="结束时间"
/>
+ <el-button type="primary" size="large" style="width: 6rem" @click="searchTable">搜索</el-button>
<el-button type="success" size="large" style="width: 6rem">一键导出</el-button>
</div>
<div class="report-table">
- <Table :getList="getTableData" :headList="tableHead"></Table>
+ <Table ref="tableRef" :getList="getFlowReportList" :headList="tableHead" :searchData="searchData"></Table>
</div>
</div>
</template>
diff --git a/src/views/screen/temperature/shebei/index.vue b/src/views/screen/temperature/shebei/index.vue
index a588778..3ce6d4e 100644
--- a/src/views/screen/temperature/shebei/index.vue
+++ b/src/views/screen/temperature/shebei/index.vue
@@ -1,7 +1,15 @@
<script setup>
-import {ref} from "vue";
+import {ref, onMounted} from "vue";
+import facilityApi from "@/api/facility/index";
+import { getTemperatureMenu } from '@/api/screen/shebei/index.js'
import {getUserType} from '@/utils/auth.js'
+import setPostParams from "@/utils/searchParams.js";
+import {useRouter} from "vue-router";
+const router = useRouter();
+const imgBaseUrl = import.meta.env.VITE_APP_IMG_BASEURL; //图片前缀
+const menuList = ref([])
+const deviceList = ref([])
const userType = ref(getUserType())
const monitorRef = ref()
const searchVal = ref('')
@@ -12,21 +20,37 @@
{ label: '1个', value: 1 },
])
-const shebeiData = ref([
- { name: '雷达水位计', code: 'SWY001', image: '', online: true, time: '2025-02-15', address: '上游灌木丛' },
- { name: '雷达水位计', code: 'SWY001', image: '', online: true, time: '2025-02-15', address: '上游灌木丛' },
- { name: '雷达水位计', code: 'SWY001', image: '', online: true, time: '2025-02-15', address: '上游灌木丛' },
- { name: '雷达水位计', code: 'SWY001', image: '', online: true, time: '2025-02-15', address: '上游灌木丛' },
- { name: '雷达水位计', code: 'SWY001', image: '', online: true, time: '2025-02-15', address: '上游灌木丛' },
- { name: '雷达水位计', code: 'SWY001', image: '', online: true, time: '2025-02-15', address: '上游灌木丛' },
- { name: '雷达水位计', code: 'SWY001', image: '', online: true, time: '2025-02-15', address: '上游灌木丛' },
- { name: '雷达水位计', code: 'SWY001', image: '', online: true, time: '2025-02-15', address: '上游灌木丛' },
-])
+// 获取菜单列表
+const getMenu = () => {
+ getTemperatureMenu().then(res => {
+ menuList.value = res.data
+ })
+}
+
+// 获取设备
+const getDataList = () => {
+ let postParam = setPostParams()
+ facilityApi().search({ ...postParam, keywords: searchVal.value }).then(res => {
+ deviceList.value = res.data.list
+ })
+}
// 全屏操作
const handleFullScreen = () => {
monitorRef.value.requestFullscreen()
}
+
+// 选择菜单
+const handleSelectMenu = (id) => {
+ facilityApi().get({ id }).then(res => {
+ deviceList.value = [res.data]
+ })
+}
+
+onMounted(() => {
+ getMenu()
+ getDataList()
+})
</script>
@@ -34,28 +58,20 @@
<div class="shebei">
<div class="shebei-menu">
<div class="menu-t">设备列表</div>
- <el-menu class="el-menu">
- <el-sub-menu index="1">
- <template #title>
- <span>雷达水位计</span>
+ <el-menu class="el-menu-vertical-demo" @select="handleSelectMenu">
+ <template v-for="(item, index) in menuList" :key="index+1">
+ <template v-if="item?.facilityPOList?.length === 0">
+ <el-menu-item :index="item.id">{{item.name}}</el-menu-item>
</template>
- <el-menu-item index="1-1">SWY001</el-menu-item>
- <el-menu-item index="1-2">SWY002</el-menu-item>
- </el-sub-menu>
- <el-sub-menu index="2">
- <template #title>
- <span>雷达测速仪</span>
+ <template v-else>
+ <el-sub-menu :index="item.id">
+ <template #title>
+ <span>{{item.name}}</span>
+ </template>
+ <el-menu-item v-for="(child, cidx) in item.facilityPOList" :key="cidx" :index="child.id">{{child.facilityName}}</el-menu-item>
+ </el-sub-menu>
</template>
- <el-menu-item index="2-1">CY001</el-menu-item>
- <el-menu-item index="2-2">CY002</el-menu-item>
- </el-sub-menu>
- <el-sub-menu index="3">
- <template #title>
- <span>雷达流量计</span>
- </template>
- <el-menu-item index="3-1">LJL001</el-menu-item>
- <el-menu-item index="3-2">LJL002</el-menu-item>
- </el-sub-menu>
+ </template>
</el-menu>
</div>
<div class="shebei-monitor">
@@ -75,9 +91,9 @@
:value="item.value"
/>
</el-select>
- <el-input v-model="searchVal" style="width: 20rem" placeholder="请输入监测点名称" />
- <el-button><el-icon><Search /></el-icon>搜索</el-button>
- <el-button style="margin-left: 0" v-if="userType === '1'"><el-icon><Plus /></el-icon>新增</el-button>
+ <el-input v-model="searchVal" style="width: 20rem" placeholder="请输入设备名称" />
+ <el-button @click="getDataList"><el-icon><Search /></el-icon>搜索</el-button>
+ <el-button style="margin-left: 0" v-if="userType === '1'" @click="router.push('/facilityList')"><el-icon><Plus /></el-icon>新增</el-button>
</div>
<div class="tool-r" @click="handleFullScreen">
<img src="@/assets/images/flow/fullscreen.png" />
@@ -86,49 +102,49 @@
</div>
<div class="monitor-box" ref="monitorRef">
<div class="list-six list" v-if="selectNum === 6">
- <div class="item" v-for="(item, index) in shebeiData" :key="index">
+ <div class="item" v-for="(item, index) in deviceList" :key="index">
<div class="item-t">
- <div>{{item.name}}</div>
- <div>{{item.code}}</div>
+ <div>{{item.facilityName}}</div>
+ <div>{{item.facilityCode}}</div>
</div>
<div class="item-img">
- <img v-if="item.image" :src="item.image" />
+ <img v-if="item.facilityUrl" :src="imgBaseUrl + item.facilityUrl" alt="" />
</div>
<div class="item-info">
- <div class="online">设备在线状态： <span :style="{color: item.online ? '#56d12c' : '#bababa'}">{{item.online ? '在线' : '掉线'}}</span></div>
- <div class="time">安装时间： <span>{{item.time}}</span></div>
+ <div class="online">设备在线状态： <span :style="{color: item.isOnline ? '#56d12c' : '#bababa'}">{{item.isOnline ? '在线' : '掉线'}}</span></div>
+ <div class="time">安装时间： <span>{{item.installDate}}</span></div>
<div class="address">安装位置： <span>{{item.address}}</span></div>
</div>
</div>
</div>
<div class="list-two list" v-else-if="selectNum === 2">
- <div class="item" v-for="(item, index) in shebeiData" :key="index">
+ <div class="item" v-for="(item, index) in deviceList" :key="index">
<div class="item-t">
- <div>{{item.name}}</div>
- <div>{{item.code}}</div>
+ <div>{{item.facilityName}}</div>
+ <div>{{item.facilityCode}}</div>
</div>
<div class="item-img">
- <img v-if="item.image" :src="item.image" />
+ <img v-if="item.facilityUrl" :src="imgBaseUrl + item.facilityUrl" alt="" />
</div>
<div class="item-info">
<div class="online">设备在线状态： <span :style="{color: item.online ? '#56d12c' : '#bababa'}">{{item.online ? '在线' : '掉线'}}</span></div>
- <div class="time">安装时间： <span>{{item.time}}</span></div>
+ <div class="time">安装时间： <span>{{item.installDate}}</span></div>
<div class="address">安装位置： <span>{{item.address}}</span></div>
</div>
</div>
</div>
<div class="list-one list" v-else-if="selectNum === 1">
- <div class="item" v-for="(item, index) in shebeiData" :key="index">
+ <div class="item" v-for="(item, index) in deviceList" :key="index">
<div class="item-t">
- <div>{{item.name}}</div>
- <div>{{item.code}}</div>
+ <div>{{item.facilityName}}</div>
+ <div>{{item.facilityCode}}</div>
</div>
<div class="item-img">
- <img v-if="item.image" :src="item.image" />
+ <img v-if="item.facilityUrl" :src="imgBaseUrl + item.facilityUrl" alt="" />
</div>
<div class="item-info">
- <div class="online">设备在线状态： <span :style="{color: item.online ? '#56d12c' : '#bababa'}">{{item.online ? '在线' : '掉线'}}</span></div>
- <div class="time">安装时间： <span>{{item.time}}</span></div>
+ <div class="online">设备在线状态： <span :style="{color: item.isOnline ? '#56d12c' : '#bababa'}">{{item.isOnline ? '在线' : '掉线'}}</span></div>
+ <div class="time">安装时间： <span>{{item.installDate}}</span></div>
<div class="address">安装位置： <span>{{item.address}}</span></div>
</div>
</div>
diff --git a/src/views/system/user/index.vue b/src/views/system/user/index.vue
index 01d2789..99c400e 100644
--- a/src/views/system/user/index.vue
+++ b/src/views/system/user/index.vue
@@ -131,10 +131,10 @@
<script setup>
import user from "@/api/system/user";
import role from "@/api/system/role";
- import { PREURL } from "@/config/index";
import { sysDictData } from "@/api/system/dict";
import setPostParams from "@/utils/searchParams.js";
const { proxy } = getCurrentInstance();
+ const imgBaseUrl = import.meta.env.VITE_APP_IMG_BASEURL //图片前缀
/**
* 搜索相关
@@ -232,7 +232,7 @@
//上传文件，添加图片地址信息
const uploadData = (img) => {
- form.value.headImg = img.toString()
+ form.value.headImg = imgBaseUrl + img.toString()
}
//获取用户分类列表
--
Gitblit v1.9.3