feat:阀门页面接口对接

pages.json

@@ -808,7 +808,14 @@
         "enablePullDownRefresh": false
       }
     },
-
+	{
+	  "path": "pages/fmSys/details",
+	  "style": {
+	    "navigationBarTitleText": "阀门",
+	    "enablePullDownRefresh": false,
+	    "navigationStyle": "custom"
+	  }
+	},
     {
       "path": "pages/cb/wenshizs/detail",
       "style": {

pages/fmSys/details.vue

@@ -1,129 +1,131 @@
 <template>
 	<view class="fm-page">
 		<uni-nav-bar left-icon="back" background-color='rgba(0,0,0,0)' title="闸门" @clickLeft="clickLeft">
-		<!-- 	<view class="self-title">标题栏</view>
+			<!-- 	<view class="self-title">标题栏</view>
 			<template v-slot:left><view class="self-back"><uni-icons type="arrowleft" size="24"></uni-icons></view></template>
 		 -->
 		</uni-nav-bar>
 		<view class="fm-content">
-			
-		
-		<view class="info">
-			<view class="device-id" @click="copy(equipInfo)">
-				<image class="logo"
-					:src="`http://www.hnyfwlw.com:8006/bigdata_pc/equipdistribute/${equipInfo.type}.png`" mode="">
-				</image>
-				{{equipInfo.imei||equipInfo.device_id}}
-				<image src="https://www.hnyfwlw.com:8006/bigdata_app/image/environment/fuzhi.png" mode="" class="tishi">
-				</image>
-				<view :class="['float-right','yficonfont',equipInfo.is_online==1?'on icon-zaixian':'off icon-lixian']">
-					{{equipInfo.is_online==1?'在线':'离线'}}
-				</view>
-			</view>
-			<view class="info-list">
-				<span class="float-left">设备名称：</span> <span class="float-right">{{equipInfo.device_name}}</span>
-			</view>
-			<view class="info-list">
-				<span class="float-left">上报时间：</span> <span
-					class="float-right">{{equipInfo.addtime||equipInfo.uptime | timeFormat}}</span>
-			</view>
-			<view class="info-list">
-				<span class="float-left">设备地址：</span> <span
-					class="float-right">{{equipInfo.address?equipInfo.address:"--"}}</span>
-			</view>
-		
-		
-			<u-calendar v-model="calendar_show" mode="date" :max-date="date" @change="timeChange($event)">
-			</u-calendar>
-			<u-toast ref="toast" />
-		</view>
-		<view class="title"></view>
-		<view class="newState">
-			<view class="top">
-				<view class="left">
-					<image class="img" src="https://www.hnyfwlw.com:8006/bigdata_app/image/irrigate/fm.png"></image>
-					<view>
-						<p> <span class="num">100</span> mm</p>
-						<p>闸门下降中...</p>
+
+
+			<view class="info">
+				<view class="device-id" @click="copy(equipInfo)">
+					<image class="logo"
+						:src="`http://www.hnyfwlw.com:8006/bigdata_pc/equipdistribute/${equipInfo.type}.png`" mode="">
+					</image>
+					{{equipInfo.imei||equipInfo.device_id}}
+					<image src="https://www.hnyfwlw.com:8006/bigdata_app/image/environment/fuzhi.png" mode=""
+						class="tishi">
+					</image>
+					<view
+						:class="['float-right','yficonfont',equipInfo.is_online==1?'on icon-zaixian':'off icon-lixian']">
+						{{equipInfo.is_online==1?'在线':'离线'}}
 					</view>
-					
 				</view>
-				<view class="right btn">
-					<u-button text="设置开度" size="mini" @click="timeshow = true">设置开度</u-button>
+				<view class="info-list">
+					<span class="float-left">设备名称：</span> <span class="float-right">{{equipInfo.device_name}}</span>
+				</view>
+				<view class="info-list">
+					<span class="float-left">上报时间：</span> <span
+						class="float-right">{{equipInfo.addtime||equipInfo.uptime | timeFormat}}</span>
 				</view>
+				<view class="info-list">
+					<span class="float-left">设备地址：</span> <span
+						class="float-right">{{equipInfo.address?equipInfo.address:"--"}}</span>
+				</view>
+
+
+				<u-calendar v-model="calendar_show" mode="date" :max-date="date" @change="timeChange($event)">
+				</u-calendar>
+				<u-toast ref="toast" />
 			</view>
-			<view class="up-down">
-				<view class="bottom">
-					<view class="opt">
-						<image src="https://www.hnyfwlw.com:8006/bigdata_app/image/irrigate/fm-up.png"></image>
-						<p class="num">到位</p>
-						<p>顶到位</p>
+			<view class="title"></view>
+			<view class="newState">
+				<view class="top">
+					<view class="left">
+						<image class="img" src="https://www.hnyfwlw.com:8006/bigdata_app/image/irrigate/fm.png"></image>
+						<view>
+							<p> <span class="num">{{deviceData.nowHeight}}</span> mm</p>
+							<p>{{deviceData.deviceStatus}}</p>
+						</view>
+
 					</view>
-					<view class="btn">
-						<u-button text="上升" size="mini" @click="timeshow = true">上升</u-button>
+					<view class="btn" style="width:170rpx">
+						<u-button text="设置开度" size="mini" @click="kdShow = true">设置开度</u-button>
+					</view>
+					<view class="right btn">
+						<u-button text="刷新" size="mini" @click="zfControl('refresh')">刷新</u-button>
 					</view>
 				</view>
-				<view class="bottom">
-					<view class="opt">
-						<image src="https://www.hnyfwlw.com:8006/bigdata_app/image/irrigate/fm-down.png"></image>
-						<p class="num">未到位</p>
-						<p>底到位</p>
+				<view class="up-down">
+					<view class="bottom">
+						<view class="opt">
+							<image src="https://www.hnyfwlw.com:8006/bigdata_app/image/irrigate/fm-up.png"></image>
+							<!-- <p class="num">到位</p>
+						<p>顶到位</p> -->
+						</view>
+						<view class="btn">
+							<u-button text="上升" size="mini" @click="zfControl('up')">上升</u-button>
+						</view>
 					</view>
-					<view class="btn">
-						<u-button class="active" text="下降" size="mini" @click="timeshow = true">下降</u-button>
+					<view class="bottom">
+						<view class="opt">
+							<image src="https://www.hnyfwlw.com:8006/bigdata_app/image/irrigate/fm-down.png"></image>
+							<!-- <p class="num">未到位</p>
+						<p>底到位</p> -->
+						</view>
+						<view class="btn">
+							<u-button class="active" text="下降" size="mini" @click="zfControl('down')">下降</u-button>
+						</view>
 					</view>
 				</view>
+				<view class="btn">
+					<button text="停止" @click="zfControl('stop')">停止</button>
+				</view>
 			</view>
-			<view class="btn">
-				<button text="停止" @click="timeshow = true">停止</button>
-			</view>
-		</view>
-		
-		<!-- 操作记录 -->
-		<view class="consoleList">
-			<view class="title">操作记录</view>
-			<!-- <view class="histimeBox">
-							<u-icon name="calendar" color="#C1C1C1" size="24"></u-icon>
-							<view class="time" @click="consoleshow = true">
-								{{consoleTime.startDate ? consoleTime.startDate : '开始'}}
-							</view>
-							<view class="">至</view>
-							<view class="time" @click="consoleshow = true">{{consoleTime.endDate ? consoleTime.endDate : '结束'}}
-							</view>
-							<u-icon name="close-circle" color="#C1C1C1" size="28" @click="clearContime"
-								v-if="consoleTime.startDate"></u-icon>
-						</view>
-						<u-calendar v-model="consoleshow" mode="range" @change="changeConsoleDate"></u-calendar> -->
-			<view class="tableList tableTitle">
-		
-				<view>时间</view>
-				<view>操作内容</view>
-				<view>操作结果</view>
-				<view>操作人</view>
-			</view>
-			<view class="tableList" v-for="(item, index) in tableData" :key="item.uptime + index">
-				<view>{{item.uptime}}</view>
-				<view :class="item.status ? 'success' : 'error'">{{item.operation_content}}</view>
-				<view>{{item.uptime}}</view>
-				<view>{{item.device_name}}</view>
-			</view>
-			<u-loadmore style="margin-top: 16rpx;" :status="status" />
-		</view>
-		<view class="item" v-for="item in curState">
-			<view class="item_info_img">
-				<image :src="'https://www.hnyfwlw.com:8006/bigdata_app'+item.icon" mode="widthFix"></image>
-			</view>
-			<view class="info-con">
-				<view class="active">
-					{{item.value | formatValue(item.txt,type)}}
+
+			<!-- 操作记录 -->
+			<view class="consoleList">
+				<view class="title">操作记录</view>
+				<view class="histimeBox">
+					<u-icon name="calendar" color="#C1C1C1" size="24"></u-icon>
+					<view class="time" @click="consoleshow = true">
+						{{consoleTime.startDate ? consoleTime.startDate : '开始'}}
+					</view>
+					<view class="">至</view>
+					<view class="time" @click="consoleshow = true">{{consoleTime.endDate ? consoleTime.endDate : '结束'}}
+					</view>
+					<u-icon name="close-circle" color="#C1C1C1" size="28" @click="clearContime"
+						v-if="consoleTime.startDate"></u-icon>
+				</view>
+				<u-calendar  @maxDate="maxDate" v-model="consoleshow" mode="range" @change="changeConsoleDate"></u-calendar>
+				<view class="tableList tableTitle">
+
+					<view>时间</view>
+					<view>操作内容</view>
+					<view>操作结果</view>
+					<view>操作人</view>
 				</view>
-				<view class="val">
-		
+				<view class="tableList" v-for="(item, index) in tableData" :key="item.addtime + index">
+					<view>{{item.addtime}}</view>
+					<view :class="item.status=='成功' ? 'success' : 'error'">{{item.order}}</view>
+					<view>{{item.status}}</view>
+					<view>{{item.user}}</view>
 				</view>
+				<u-loadmore style="margin-top: 16rpx;" :status="status" />
 			</view>
+			<u-popup v-model="kdShow" mode="center" width="600rpx">
+				<view style="padding: 40rpx;">
+					<slider style="margin-top: 20rpx;" :value="kdValue" show-value="true" :min="0" :max="1000"
+						block-color="#57C878" activeColor="#57C878" step="1" />
+					<view class="btn-box">
+						<u-button @click="kdSubmit" size="mini" type="success">确定</u-button>
+					</view>
+				</view>
+
+			</u-popup>
 		</view>
 	</view>
-	</view>
 </template>
 
 <script>
@@ -135,6 +137,7 @@
 	export default {
 		data() {
 			return {
+				      maxDate: '2050-12-31',
 				city: "",
 				type: null, //设备类型
 				device_status: null,
@@ -154,12 +157,12 @@
 				operateType: '',
 				status: '', //是否加载更多
 				page: 1,
-				tableData: [{
-					uptime: '06-11 14:02',
-					operation_content: '指定开度（700mm）',
-					device_name: 'admin'
-				}
-				]
+				tableData: [],
+				deviceData: {},
+				consoleshow: false,
+				consoleTime: {},
+				kdValue: 0,
+				kdShow: false
 			}
 		},
 		computed: {
@@ -201,13 +204,15 @@
 		onReachBottom() {
 			if (this.status == 'loadmore') {
 				this.page++;
-				// this.getEquipcontroldata()
+				this.getEquipcontroldata()
 			}
 		},
 		onLoad(option) {
 
 			this.equipInfo = JSON.parse(option.info)
 			console.log(this.equipInfo)
+			this.getEquipcontroldata()
+			this.getDeviceList()
 			// 		this.getDeviceStatus()
 			// 		this.type = Number(this.equipInfo.type) || Number(this.equipInfo.equip_type) || Number(this.equipInfo
 			// 			.device_type_id)
@@ -221,6 +226,54 @@
 			// 		this.date = times.getFullYear() + 1 + "-" + Number(times.getMonth() + 1) + "-" + times.getDate()
 		},
 		methods: {
+			kdSubmit() {
+				this.kdShow = false
+				this.zfControl('value')
+			},
+			// 指令下发
+			zfControl(cmd) {
+
+				this.$myRequest({
+					method: 'POST',
+					url: '/api/api_gateway?method=hran.view.hran_order',
+					data: {
+						d_id: this.equipInfo.d_id,
+						order: cmd,
+						controlValue: this.kdValue
+					}
+				}).then((res) => {
+					console.log('指令', res)
+					if (res == true) {
+						uni.showToast({
+							title: '指令下发成功！',
+							duration: 2000,
+						});
+						setTimeout(() => {
+							this.tableData = [];
+							this.page = 1;
+							this.getEquipcontroldata()
+						}, 2000)
+					} else {
+						uni.showToast({
+							title: '指令下发失败！',
+							duration: 2000,
+						});
+					}
+				})
+			},
+			changeConsoleDate(e) {
+				console.log(e)
+				this.consoleTime = e;
+				this.tableData = [];
+				this.page = 1;
+				this.getEquipcontroldata();
+			},
+			clearContime() {
+				this.consoleTime = {};
+				this.tableData = [];
+				this.page = 1;
+				this.getEquipcontroldata();
+			},
 			//操作记录
 			async getEquipcontroldata() {
 				uni.showLoading({
@@ -229,25 +282,26 @@
 				const {
 					consoleTime
 				} = this;
-				let begin = consoleTime.startDate ? new Date(consoleTime.startDate).getTime() / 1000 : '';
-				let end = consoleTime.endDate ? new Date(consoleTime.endDate).getTime() / 1000 : '';
+				let begin = consoleTime.startDate ? new Date(consoleTime.startDate+ ' 00:00:00').getTime() / 1000 : '';
+				let end = consoleTime.endDate ? new Date(consoleTime.endDate+ ' 23:59:59').getTime() / 1000 : '';
 				//操作记录
 				let res = await this.$myRequest({
 					method: "POST",
-					url: "/api/api_gateway?method=xphsp.views.control_log",
+					url: "/api/api_gateway?method=hran.view.hran_order_list",
 					data: {
-						device_id: this.device_id,
-						page_num: this.page,
+						d_id: this.equipInfo.d_id,
+						page: this.page,
 						page_size: 15,
 						start: begin,
 						end: end
 					},
 				})
+				console.log(res)
 				uni.hideLoading();
 				// this.tableData = [];
-				const record = res.result;
+				const record = res.data;
 				this.tableData = [...this.tableData, ...record];
-				this.total = res.count;
+				this.total = res.total;
 				if (this.page * 15 > this.total) {
 					this.status = 'nomore'
 				} else {
@@ -255,6 +309,46 @@
 				}
 				// console.log(this.tableData);
 			},
+			// 获取设备数据
+			getDeviceList() {
+				this.devicetf = true
+				const {
+					consoleTime
+				} = this;
+				let begin = consoleTime.startDate ? new Date(consoleTime.startDate+ ' 00:00:00').getTime() / 1000 : '';
+				let end = consoleTime.endDate ? new Date(consoleTime.endDate+ ' 23:59:59').getTime() / 1000 : '';
+				try {
+					this.$myRequest({
+						method: 'POST',
+						url: '/api/api_gateway?method=hran.view.hran_data',
+						data: {
+							d_id: this.equipInfo.d_id,
+							start: begin,
+							end: end,
+							page: 1,
+							page_size: 1
+						}
+					}).then((res) => {
+						this.devicetf = false
+						console.log('设备数据', res)
+
+						if (res.data.length > 0) {
+							const {
+								data,
+								title
+							} = res
+							// console.log(data, title, total)
+							this.deviceData = data[0]
+							// this.deviceTitle = title
+						} else {
+							this.deviceData = {}
+						}
+
+					})
+				} catch (error) {
+					console.log('+++++', error)
+				}
+			},
 			async getDeviceStatus() {
 
 				const res = await this.$myRequest({
@@ -434,10 +528,12 @@
 			min-height: 100%;
 			background: linear-gradient(180deg, #f5f6fa00 0%, #F5F6FA 23.64%, #F5F6FA 100%), linear-gradient(102deg, #BFEADD 6.77%, #B8F1E7 40.15%, #B9EEF5 84.02%);
 		}
-		.fm-content{
+
+		.fm-content {
 			padding: 0rpx 32rpx;
 			box-sizing: border-box;
 		}
+
 		.title {
 			color: #999999;
 			margin: 32rpx 0;
@@ -551,7 +647,7 @@
 				align-items: center;
 
 				.left {
-					width: 80%;
+					width: 40%;
 					display: flex;
 					align-items: center;
 				}
@@ -566,9 +662,11 @@
 					height: 110rpx;
 					margin-right: 32rpx;
 				}
-				p:nth-child(2){
-					color:#687A74 ;
+
+				p:nth-child(2) {
+					color: #687A74;
 				}
+
 				.num {
 					font-size: 40rpx;
 					font-weight: 700;
@@ -598,7 +696,7 @@
 				background: linear-gradient(180deg, #14a4781a 0%, #14a47800 100%), #FFF;
 
 				.opt {
-					width: 160rpx;
+					width: 70rpx;
 					height: 70rpx;
 					font-size: 24rpx;
 					color: #687A74;
@@ -664,6 +762,7 @@
 		border-radius: 16rpx;
 		margin-top: 32rpx;
 		min-height: calc(100vh - 1020rpx);
+
 		.title {
 			margin: 0;
 			margin-bottom: 16rpx;
@@ -719,4 +818,35 @@
 			height: 78rpx;
 		}
 	}
+
+	.histimeBox {
+		display: flex;
+		align-items: center;
+		justify-content: space-between;
+		height: 56rpx;
+		padding: 6rpx 24rpx;
+		box-sizing: border-box;
+		border-radius: 8rpx;
+		margin-top: 54rpx;
+		border: 2rpx solid var(--neutral-color-border-light, #e4edea);
+
+		.u-icon {
+			z-index: 10;
+		}
+
+		.time {
+			width: 280rpx;
+			color: #c1c1c1;
+		}
+
+		view {
+			color: #333333;
+			text-align: center;
+		}
+
+	}
+
+	.btn-box {
+		text-align: center;
+	}
 </style>