init

pc/src/api/methods/index.js

@@ -19,5 +19,13 @@ export default {
 	//工单详情
 	getPatrolDetail(params) {
 		return http.post('web/patrol/getPatrolDetail', params)
-	}
+	},
+	//获取历史数据列表
+	getHistoryDataList(params) {
+		return http.post('web/data/getHistoryDataList', params)
+	},
+	//获取液位
+	getYewei(params) {
+		return http.post('web/data/getYewei', params)
+	},
 }

pc/src/views/home.vue

@@ -152,11 +152,13 @@
 			}
 			function loadScript() {
 				const script = document.createElement("script");
-				script.src = "https://api.map.baidu.com/api?v=1.0&type=webgl&ak=fklOeUwr7Y1amxhGFZL8lvE6QvIKpGNi&callback=initMap";
+				script.src = "https://api.map.baidu.com/api?v=1.0&type=webgl&ak=fklOeUwr7Y1amxhGFZL8lvE6QvIKpGNi";
 			}
 			onMounted(()=>{
 				nextTick(()=>{
+					setTimeout(()=>{
 						initMap();
+					},2000);
 					state.timer = setInterval(() => {
 						state.time = myPublic.dateFormat.format(Date.now(), 'HH:mm:ss YYYY年MM月DD日');
 					}, 1000)

pc/src/views/site-detail.vue

@@ -86,7 +86,7 @@
 					<div class="filter-one">
 						<p class="filter-name">类型筛选</p>
 						<div class="filter-content">
-							<el-select v-model="filter.type" class="m-2" placeholder="请选择类型" @change="()=>getList()">
+							<el-select v-model="filter.type_name" class="m-2" placeholder="请选择类型" @change="()=>getHistoryDataList()">
 								<el-option
 									v-for="item in [{name:'全部类型',value:'',prop:''},...typeList]"
 									:key="item.prop"
@@ -109,7 +109,7 @@
 								end-placeholder="结束时间"
 								:teleported="false"
 								:editable="true"
-								@change="()=>getList()"
+								@change="()=>getHistoryDataList()"
 							/>
 						</div>
 					</div>
@@ -123,13 +123,13 @@
 						</div>
 					</div>
 					<div class="table-body">
-						<div class="row" v-for="(item,index) in typeList" :key="index">
+						<div class="row" v-for="(item,index) in typeList.filter(one=>one.show)" :key="index">
 							<div class="cell flex_2">
 								<span class="point" :style="`background-color:${item.color}`"></span>
 								<span :style="`color:${item.color}`">{{item.name}}</span>
 							</div>
 							<div class="cell flex_3">{{item.value}} {{item.unit}}</div>
-							<div class="cell">{{item.create_time}}</div>
+							<div class="cell">{{item.CreatedAt}}</div>
 						</div>
 					</div>
 				</div>
@@ -283,7 +283,7 @@
 				detail: {
 					poster:[],
 					index: 0,
-					yewei:0.7,
+					yewei:0,
 					type:1,
 					accessToken:'at.bvx2ea007tfqqdvkcb9iuhk70q6gjodm-7smdnjfh9j-1wdmw5f-mal3go2vz',
 					url:'ezopen://open.ys7.com/E77565052/1.live',
@@ -319,7 +319,7 @@
 				tab: 'base',
 				myChart:null,
 				filter:{
-					type:'',
+					type_name:'',
 					order_type:'',
 					time:['',''],
 					time_order:['','']
@@ -327,67 +327,75 @@
 				typeList:[
 					{
 						name:'液位',
-						prop:'a1',
+						prop:'液位',
 						value:0.7,
 						unit:'m',
 						color:'#09a8ae',
-						create_time:'2022-09-01 10:00'
+						CreatedAt:'',
+						show:false
 					},
 					{
 						name:'调解池流量',
-						prop:'a2',
-						value:1,
-						unit:'m^3/h',
+						prop:'调解池流量',
+						value:0,
+						unit:'m3/h',
 						color:'#ff6b6b',
-						create_time:'2022-09-01 10:00'
+						CreatedAt:'',
+						show:false
 					},
 					{
 						name:'出水池流量',
-						prop:'a3',
-						value:1,
-						unit:'m^3/h',
+						prop:'出水池流量',
+						value:0,
+						unit:'m3/h',
 						color:'#946fd0',
-						create_time:'2022-09-01 10:00'
+						CreatedAt:'',
+						show:false
 					},
 					{
 						name:'厌氧池PH值',
-						prop:'a4',
-						value:8,
+						prop:'厌氧池PH值',
+						value:0,
 						unit:'',
 						color:'#3396fb',
-						create_time:'2022-09-01 10:00'
+						CreatedAt:'',
+						show:false
 					},
 					{
 						name:'好氧池PH值',
-						prop:'a5',
-						value:8,
+						prop:'好氧池PH值',
+						value:0,
 						unit:'',
 						color:'#28ae09',
-						create_time:'2022-09-01 10:00'
+						CreatedAt:'',
+						show:false
 					},
 					{
 						name:'出水池PH值',
-						prop:'a6',
-						value:8,
+						prop:'出水池PH值',
+						value:0,
 						unit:'',
 						color:'#ffc019',
-						create_time:'2022-09-01 10:00'
+						CreatedAt:'',
+						show:false
 					},
 					{
 						name:'好氧池DO值',
-						prop:'a7',
-						value:1,
+						prop:'好氧池DO值',
+						value:0,
 						unit:'mg/l',
 						color:'#f8893f',
-						create_time:'2022-09-01 10:00'
+						CreatedAt:'',
+						show:false
 					},
 					{
 						name:'MBR池DO值',
-						prop:'a8',
-						value:1,
+						prop:'MBR池DO值',
+						value:0,
 						unit:'mg/l',
 						color:'#eb509d',
-						create_time:'2022-09-01 10:00'
+						CreatedAt:'',
+						show:false
 					}
 				],
 				typeList_order:[
@@ -422,11 +430,12 @@
 						}
 						nextTick(()=>{
 							state.showBanner = true;
-						})
+						});
 						Object.assign(state.detail,{...res.data});
 						if(state.detail.type==1){
 							state.tabs.find(one=>one.value=='process').show = true;
 						}
+						getYewei();
 					}
 				});
 			}
@@ -447,17 +456,32 @@
 			function tabActive(item) {
 				if (state.tab != item.value) {
 					state.tab = item.value;
+					state.list.data = [];
+					state.list.page = 1;
 					if(item.value=='base'){
 						initGauge();
+						getYewei();
 					}
-					if(item.value=='history'){
-						getList();
+					if(item.value=='monitor'){
+						// getList();
+					}
+					if(item.value=='history'||item.value=='process'){
+						getHistoryDataList();
 					}
 					if(item.value=='order'){
 						getOrderList();
 					}
 				}
 			}
+			function getYewei() {
+				api.getYewei({toilet_id:props.site_id}).then((res)=>{
+					if(res.code==0){
+						if(res.data.value){
+							state.detail.yewei = Number(res.data.value);
+						}
+					}
+				});
+			}
 			function initGauge(){
 				nextTick(()=>{
 					setTimeout(()=>{
@@ -546,7 +570,7 @@
 									radius:"95%",
 									startAngle:210,
 									endAngle:-30,
-									max:1
+									max:20
 								}
 							]
 						};
@@ -556,8 +580,42 @@
 					},500)
 				})
 			}
-			function getList(){
-
+			function getHistoryDataList(page=1){
+				let p = {
+					page:page,
+					page_size:state.list.pageSize,
+					toilet_id:props.site_id
+				};
+				if(state.filter.type_name){
+					p.type_name = state.filter.type_name;
+				}
+				if(state.filter.time&&state.filter.time[0]&&state.filter.time[1]){
+					p.start_time = state.filter.time[0];
+					p.end_time = state.filter.time[1];
+				}
+				state.list.page = page;
+				api.getHistoryDataList(p).then((res)=>{
+					state.typeList.forEach((item)=>{
+						item.show = false;
+						item.value = 0;
+						item.unit = '';
+						item.CreatedAt = '';
+					});
+					if(res.code==0){
+						if(Array.isArray(res.data.list)){
+							res.data.list.forEach((item)=>{
+								if(state.typeList.find(one=>one.name==item.typeName)){
+									state.typeList.find(one=>one.name==item.typeName).show = true;
+									state.typeList.find(one=>one.name==item.typeName).value = item.value;
+									state.typeList.find(one=>one.name==item.typeName).unit = item.unit;
+									state.typeList.find(one=>one.name==item.typeName).CreatedAt = myPublic.dateFormat.format(item.CreatedAt);
+								}
+							});
+							state.list.data = res.data.list;
+							state.list.total = res.data.total;
+						}
+					}
+				})
 			}
 			function getOrderList(page=1){
 				let p = {
@@ -578,7 +636,7 @@
 						if(Array.isArray(res.data.list)){
 							res.data.list.forEach((item)=>{
 								item.CreatedAt = myPublic.dateFormat.format(item.CreatedAt);
-							})
+							});
 							state.list.data = res.data.list;
 							state.list.total = res.data.total;
 						}
@@ -609,8 +667,8 @@
 				close,
 				tabActive,
 				typeChange,
-				getList,
 				getOrderList,
+				getHistoryDataList,
 				seeDetail,
 				wcTypeChange
 			}