feat: 设备迁移

main.js

@@ -15,6 +15,7 @@ Vue.prototype.$appimghost = 'http://www.hnyfwlw.com:8006/bigdata_app';
 
 import config from './util/neutral.js';
 Vue.prototype.$isneutral = config.isneutral;
+Vue.prototype.$imageURL = config.imageURL;// 线上图片服务器路径常量
 
 import { QueryPermission } from './util/QueryPermission.js';
 // Vue.use(QueryPermission)

pages.json

@@ -440,6 +440,12 @@
       }
     },
     {
+      "path": "pages/webviewdgp",
+      "style": {
+        "navigationBarTitleText": "监控列表"
+      }
+    },
+    {
       "path": "pages/fourBase/basefacility",
       "style": {
         "navigationBarTitleText": "",
@@ -808,7 +814,14 @@
         "enablePullDownRefresh": false
       }
     },
-
+    {
+      "path": "pages/fmSys/details",
+      "style": {
+        "navigationBarTitleText": "阀门",
+        "enablePullDownRefresh": false,
+        "navigationStyle": "custom"
+      }
+    },
     {
       "path": "pages/cb/wenshizs/detail",
       "style": {

pages/equipList/index.vue

@@ -401,6 +401,18 @@ export default {
               this.accessToken,
           });
           break;
+        case 43:
+          uni.navigateTo({
+            url: "/pages/fmSys/details?info=" + JSON.stringify(item)
+          })
+          break;
+        case 44:
+          uni.navigateTo({
+            url: "/pages/webviewdgp?device_id=" + item.device_id + "&accessToken=" + uni
+              .getStorageSync('session_key') +
+              '&type=dgp'
+          })
+          break;
         case 3:
           item.addtime = item.uptime;
           item.type = this.type_id;

pages/equipList/search.vue

@@ -372,6 +372,18 @@ export default {
             url: '../cb/xylps/detail?detail=' + JSON.stringify(item),
           });
           break;
+        case 43:
+          uni.navigateTo({
+            url: "/pages/fmSys/details?info=" + JSON.stringify(item)
+          })
+          break;
+        case 44:
+          uni.navigateTo({
+            url: "/pages/webviewdgp?device_id=" + item.device_id + "&accessToken=" + uni
+              .getStorageSync('session_key') +
+              '&type=dgp'
+          })
+          break;
         default:
           item.type = this.type_id;
           uni.navigateTo({

pages/fmSys/details.vue

@@ -1,129 +1,137 @@
 <template>
 	<view class="fm-page">
+		<!-- <view class="status_bar"></view> -->
 		<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="`${$imageURL}/bigdata_pc/equipdistribute/${equipInfo.type}.png`" mode="">
+					</image>
+					{{equipInfo.imei||equipInfo.device_id}}
+					<image :src="$imageURL+'/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="$imageURL+'/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" style="width:170rpx">
+						<u-button text="设置开度" size="mini" @click="kdShow = true">设置开度</u-button>
 					</view>
-					<view class="btn">
-						<u-button text="上升" size="mini" @click="timeshow = true">上升</u-button>
+					<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="$imageURL+'/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="$imageURL+'/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>
-				<view class="val">
-		
+				<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="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>
@@ -131,10 +139,11 @@
 		QueryPermission,
 		getPermissionById,
 		getUserPermission
-	} from "../../util/QueryPermission.js"
+	} from "@/util/QueryPermission.js"
 	export default {
 		data() {
 			return {
+				      maxDate: '2050-12-31',
 				city: "",
 				type: null, //设备类型
 				device_status: null,
@@ -154,12 +163,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 +210,15 @@
 		onReachBottom() {
 			if (this.status == 'loadmore') {
 				this.page++;
-				// this.getEquipcontroldata()
+				this.getEquipcontroldata()
 			}
 		},
 		onLoad(option) {
 
 			this.equipInfo = JSON.parse(option.info)
-			console.log(this.equipInfo)
+			console.log(this.equipInfo,'equipInfoequipInfo')
+			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 +232,59 @@
 			// 		this.date = times.getFullYear() + 1 + "-" + Number(times.getMonth() + 1) + "-" + times.getDate()
 		},
 		methods: {
+			clickLeft() {
+				uni.navigateBack({
+					delta: 1
+				})
+			},
+			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 +293,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 +320,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({
@@ -433,11 +538,14 @@
 			width: 100%;
 			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%);
+			padding-top: 44rpx;
 		}
-		.fm-content{
+
+		.fm-content {
 			padding: 0rpx 32rpx;
 			box-sizing: border-box;
 		}
+
 		.title {
 			color: #999999;
 			margin: 32rpx 0;
@@ -551,7 +659,7 @@
 				align-items: center;
 
 				.left {
-					width: 80%;
+					width: 40%;
 					display: flex;
 					align-items: center;
 				}
@@ -566,9 +674,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 +708,7 @@
 				background: linear-gradient(180deg, #14a4781a 0%, #14a47800 100%), #FFF;
 
 				.opt {
-					width: 160rpx;
+					width: 70rpx;
 					height: 70rpx;
 					font-size: 24rpx;
 					color: #687A74;
@@ -664,6 +774,7 @@
 		border-radius: 16rpx;
 		margin-top: 32rpx;
 		min-height: calc(100vh - 1020rpx);
+
 		.title {
 			margin: 0;
 			margin-bottom: 16rpx;
@@ -719,4 +830,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>

pages/fourBase/basefacility.vue

@@ -99,7 +99,7 @@
 					duration: 500
 				})
 			},
-			skip(items){
+			async skip(items){
 				console.log(items)
 				var item = JSON.stringify(items)
 				switch (items.equip_type){
@@ -113,6 +113,34 @@
 							url: "/pages/webview?device_id=" + items.device_id + "&accessToken=" + this.accessToken
 						})
 					break
+					case 43:
+						const resFm = await this.$myRequest({
+							url: '/api/api_gateway?method=forecast.worm_lamp.lamp_list',
+							data: {
+								device_type_id: 43,
+								page: 1,
+								page_size: "10",
+								device_id: items.device_id,
+							}
+						})
+						let item43 = {
+							...items
+						}
+						if (resFm.counts == 1) {
+							item43 = {
+								...items,
+								...resFm.data[0]
+							}
+						}
+						uni.navigateTo({
+							url: "../fmSys/details?info=" + JSON.stringify(item43)
+						})
+						break;
+          case 44:
+            uni.navigateTo({
+							url: "/pages/webviewdgp?device_id=" + items.device_id + "&accessToken=" + this.accessToken
+						})
+          break;
 					case 10 :
 						uni.navigateTo({
 							url: '/pages/cb/xy2.0/particulars?info=' + item

pages/webviewdgp.vue

@@ -0,0 +1,64 @@
+<template>
+	<view class="webview">
+		<web-view :src="url" id="webcon" @message="handleMessage">
+		</web-view>
+	</view>
+</template>
+
+<script>
+	export default {
+		data() {
+			return {
+				url: '',
+				device_id: '',
+				accessToken: ''
+			}
+		},
+		onLoad(options) {
+			this.device_id = options.device_id
+			this.accessToken = options.accessToken
+			// this.url = "http://8.136.98.49/#/recognition"
+			this.url = "/static/h52dgp.html?device_id=" + this.device_id + "&accessToken=" + this.accessToken
+			// uni.setStorage({
+			// 	key: 'obj',
+			// 	data: JSON.stringify({
+			// 		device_id: this.device_id,
+			// 		accessToken: this.accessToken
+			// 	})
+			// })
+			//设置 webview 界面的状态栏的 title
+			uni.setNavigationBarTitle({
+				title: '监控详情'
+			});
+
+			// this.getWebviewPage()
+		},
+		methods: {
+			getWebviewPage(id) {
+				this.url = "/static/h5.html?device_id=" + this.device_id + "&accessToken=" + this.accessToken
+				// uni.setStorage({
+				// 	key: 'obj',
+				// 	data: JSON.stringify({
+				// 		device_id: this.device_id,
+				// 		accessToken: this.accessToken
+				// 	})
+				// })
+				//设置 webview 界面的状态栏的 title
+				uni.setNavigationBarTitle({
+					title: '监控详情'
+				});
+			},
+			handleMessage(evt) {
+				console.log('接收到的消息：' + JSON.stringify(evt.detail.data));
+			}
+
+		}
+	}
+</script>
+
+<style>
+	.webview {
+		width: 100vw;
+		height: 100vh;
+	}
+</style>

static/h52dgp.html

@@ -0,0 +1,504 @@
+<!DOCTYPE html>
+<html lang=zh-CN>
+	<head>
+		<meta charset="utf-8" />
+		<meta name="viewport"
+			content="width=device-width,initial-scale=1,minimum-scale=1,maximum-scale=1,user-scalable=no" />
+		<title>监控详情页</title>
+		<link href="https://unpkg.com/video.js@7.10.2/dist/video-js.min.css" rel="stylesheet" />
+		<link rel="stylesheet" href="./font/iconfont.css" />
+		<style type="text/css">
+			body {
+				margin: 0;
+				background-color: #f3f3f3;
+			}
+
+			span.vjs-control-text {
+				display: none;
+			}
+
+			/* iframe {
+				width: 375px;
+				height: 667px;
+				background-color: #fff;
+				box-sizing: content-box;
+				border: none;
+			} */
+			.btn-box {
+				margin-top: 20px;
+				display: flex;
+				flex-direction: row;
+				justify-content: space-around;
+				align-items: center;
+			}
+
+			.btn-container {
+				position: relative;
+			}
+
+			.videoBtnPlay {
+				position: absolute;
+				height: 100px;
+				width: 100px;
+				top: 50%;
+				left: 50%;
+				transform: translate(-50%, -50%);
+			}
+
+			.more,
+			.less {
+				flex: 1
+			}
+
+			img {
+				width: 100%;
+			}
+
+			.direc {
+				width: 150px;
+				height: 150px;
+				background: url('https://s3.hnyfwlw.com/webstaticimg/bigdata_app/image/monitor/1.png');
+				background-size: 100% auto;
+				background-repeat: no-repeat;
+				position: relative;
+				display: flex;
+				justify-content: center;
+				align-items: center;
+			}
+
+			.direc div {
+				width: 50px;
+				height: 50px;
+				position: absolute;
+			}
+
+			.photo {
+				font-size: 30px;
+				color: #4ec467;
+				padding: 16px;
+			}
+
+			.top {
+				top: 0;
+				left: 50px
+			}
+
+			.bottom {
+				bottom: 0;
+				left: 50px
+			}
+
+			.left {
+				left: 0;
+				top: 50px
+			}
+
+			.right {
+				right: 0;
+				top: 50px
+			}
+
+			#box {
+				height: 300px;
+				width: 100%;
+				background: #000;
+				overflow: hidden;
+			}
+
+			#dialog {
+				display: none;
+				min-width: 200px;
+				line-height: 80px;
+				background: rgba(0, 0, 0, .8);
+				color: #fff;
+				text-align: center;
+				position: absolute;
+				left: 50%;
+				margin-left: -100px;
+				border-radius: 4px;
+				z-index: 999;
+				top: 50%;
+				margin-top: -40px;
+			}
+
+			.imgBtn {
+				position: absolute;
+				width: 100%;
+				padding: 10px;
+				bottom: 0;
+				left: 0;
+				text-align: center;
+				color: #338cd9;
+				font-size: 16px;
+				box-sizing: border-box;
+				display: flex;
+				justify-content: center;
+				gap: 16px;
+			}
+
+			.imgBtn div {
+				/* padding: 0 16px; */
+			}
+
+			.imgBtn img {
+				display: inline-block;
+				width: 20px;
+				height: 20px;
+				vertical-align: middle;
+				margin-right: 2px;
+				margin-bottom: 3px;
+			}
+
+			.imgBtnDgp {
+				display: none;
+			}
+		</style>
+	</head>
+	<body>
+		<div class="btn-container">
+			<div id="box"> </div>
+			<div class="videoBtnPlay">
+				<img src="https://webstaticimg.oss-cn-hangzhou.aliyuncs.com/bigdata_app/img/wxplayer.png" />
+			</div>
+		</div>
+		<div id="dialog">
+
+		</div>
+		<div class="btn-box">
+			<div class="more" ontouchstart="_configCamera('move', 8)" ontouchend="_stopConfigCamera()">
+				<image src="https://s3.hnyfwlw.com/webstaticimg/bigdata_app/image/monitor/3.png" mode="widthFix">
+				</image>
+			</div>
+			<div class="direc">
+				<div class="top" ontouchstart="_configCamera('move', 0)" ontouchend="_stopConfigCamera()">
+
+				</div>
+				<div class="bottom" ontouchstart="_configCamera('move', 1)" ontouchend="_stopConfigCamera()">
+
+				</div>
+				<p class="photo yficonfont icon-paizhao-xianxing" ontouchstart="_configCamera('takephoto', '')">
+
+				</p>
+				<div class="left" ontouchstart="_configCamera('move', 2)" ontouchend="_stopConfigCamera()">
+
+				</div>
+				<div class="right" ontouchstart="_configCamera('move', 3)" ontouchend="_stopConfigCamera()">
+
+				</div>
+			</div>
+			<div class="less" ontouchstart="_configCamera('move', 9)" ontouchend="_stopConfigCamera()">
+				<image src="https://s3.hnyfwlw.com/webstaticimg/bigdata_app/image/monitor/2.png" mode="widthFix">
+				</image>
+			</div>
+		</div>
+		<div class="imgBtn">
+			<div class="imgBtnCamrea"> <img src="https://webstaticimg.oss-cn-hangzhou.aliyuncs.com/bigdata_app/img/img_icon.png" />查看图片</div>
+			<div class="imgBtnDgp"><img src="https://webstaticimg.oss-cn-hangzhou.aliyuncs.com/bigdata_app/img/img_icon.png" />查看光谱图片</div>
+
+		</div>
+	</body>
+	<script src="https://cdn.bootcdn.net/ajax/libs/jquery/3.5.1/jquery.min.js"></script>
+	<!-- 微信 JS-SDK 如果不需要兼容小程序，则无需引用此 JS 文件。 -->
+	<!-- <script type="text/javascript" src="//res.wx.qq.com/open/js/jweixin-1.4.0.js"></script> -->
+	<!-- uni 的 SDK -->
+	<script type="text/javascript" src="https://js.cdn.aliyun.dcloud.net.cn/dev/uni-app/uni.webview.1.5.2.js"></script>
+
+	<script src="https://unpkg.com/video.js@7.10.2/dist/video.min.js"></script>
+	<script type="module">
+		import Player from './videoPlayer/videoPlay-js.js'
+		let player = null
+		let stopTimer = 0
+		//上下左右和拍照
+		var str = window.location.search.substr(1)
+		var arr = str.split('&')
+		console.log(str, arr);
+		var device_id = arr[0].split('=')[1]
+		// console.log(device_id);
+		var accessToken = arr[1].slice(12)
+		var videoType = arr[2]?.split('=')[1]
+		var token = accessToken
+		console.log(videoType, videoType == 'dgp')
+		window._configCamera = configCamera;
+		window._stopConfigCamera = stopConfigCamera;
+		window._postPic = postPic;
+		if (videoType == 'dgp') {
+			$('.imgBtnDgp').show()
+		} else {
+			$('.imgBtnDgp').hide()
+		}
+		$('.photo').click(() => {
+
+		})
+
+		function configCamera(ctrl, movenum) {
+			if (ctrl == "takephoto") {
+
+				if (player) {
+					// 云联的拍照特殊处理
+					player.screenshot('yunlianPlayer')
+				} else {
+
+					$('#dialog').html('拍照指令正在下发，请等待...').stop().show(50)
+					let url = "http://47.110.79.22:9000/api/api_gateway?method=camera.camera_manage.camera_takephoto"
+					if (videoType == 'dgp') {
+						url = "http://47.110.79.22:9000/api/api_gateway?method=camera.camera_manage.multi_camera_takephoto"
+					}
+					$.ajax({
+						type: "POST",
+						url: url,
+						data: {
+							device_id: device_id,
+							token
+						}
+					}).then((res) => {
+
+						if (res.data == true) {
+							$('#dialog').html('拍照成功').stop().show(500).delay(1000).hide(500)
+						} else {
+							$('#dialog').html(res.message).stop().show(500).delay(1000).hide(500)
+						}
+					});
+				}
+
+			} else {
+				let url = "http://47.110.79.22:9000/api/api_gateway?method=camera.camera_manage.ctrl_camera"
+				let postData = {
+					device_id: device_id,
+					token
+				}
+				if (videoType == 'dgp') {
+					url = "http://47.110.79.22:9000/api/api_gateway?method=camera.camera_manage.multi_ctrl_camera"
+					postData.ctrl = movenum
+				} else {
+					postData.ctrl = ctrl
+					postData.movenum = movenum
+				}
+				//上下左右、放大、缩小
+				$.ajax({
+					type: "POST",
+					url: url,
+					data: postData
+				}).then((res) => {
+					$('#dialog').html('指令下发成功,请等待...').stop().show(500).delay(3000).hide(500)
+				})
+			}
+		}
+
+		function stopConfigCamera() {
+
+			if (videoType == 'dgp') {
+				if(stopTimer) clearTimeout(stopTimer)
+				stopTimer = setTimeout(()=>{
+					$.ajax({
+						type: "POST",
+						url: "http://47.110.79.22:9000/api/api_gateway?method=camera.camera_manage.mulit_stop_move",
+						data: {
+							device_id: device_id,
+							token
+						},
+					});
+				},3000)
+				
+			} else {
+				$.ajax({
+					type: "POST",
+					url: "http://47.110.79.22:9000/api/api_gateway?method=camera.camera_manage.ctrl_camera",
+					data: {
+						device_id: device_id,
+						ctrl: "stop",
+						token
+					},
+				});
+			}
+		}
+
+		function postPic(file) {
+			let form = new FormData()
+			form.append('img_file', file)
+			form.append('device_id', device_id)
+			form.append('token', token)
+			$.ajax({
+				type: "POST",
+				url: "http://47.110.79.22:9000/api/api_gateway?method=camera.camera_manage.save_camera_photo",
+				contentType: false,
+				processData: false,
+				data: form
+			}).then((res) => {
+
+				if (res.message == '') {
+					$('#dialog').html('拍照成功').stop().show(500).delay(1500).hide(500)
+				} else {
+					$('#dialog').html(res.data.message).stop().show(500).delay(1500).hide(500)
+				}
+			});
+
+		}
+		async function initYunlianPlayer(videoURL) {
+			var playHtml =
+				`<div id="yunlianPlayer" style="width: 100%;height: 300px;overflow: hidden;"></div>`;
+			$("#box").html(playHtml)
+			player = new Player(['yunlianPlayer'], {
+				playFileOver: () => {
+					console.log('播放结束')
+				},
+				playError: (id, e) => {
+					console.log('播放错误', id, e)
+				},
+				talkStart: () => {
+					console.log('对讲开始')
+				},
+				runtimeInitializedCallBack: () => {
+					console.log('播放器初始化完成')
+				},
+				captureCallback: (id, data) => {
+					// console.log('截图返回的数据', data.buffer)
+					const blob = new Blob([data], {
+						type: 'image/jpeg'
+					})
+					_postPic(blob)
+				}
+			})
+			await player.init()
+			setTimeout(() => {
+				player.play('yunlianPlayer', {
+					streamURL: videoURL,
+
+					channelId: '0',
+
+					bitStream: '0',
+
+					isLive: true
+				})
+			}, 1000)
+		}
+
+
+		$('.videoBtnPlay').click(function() {
+			$('.videoBtnPlay').hide()
+			if (videoType == 'dgp') {
+				$.ajax({
+					type: "POST",
+					url: "http://47.110.79.22:9000/api/api_gateway?method=camera.camera_manage.multi_addr_camera",
+					data: {
+						device_id: device_id,
+						token
+					}
+				}).then((res) => {
+					// console.log(JSON.stringify(res))
+					if (res.message == '') {
+						var data = null
+						if (typeof res.data == 'string') {
+							data = eval('(' + res.data + ')');
+						} else {
+							data = res.data;
+						}
+						console.log(data, 'data');
+
+						let hlsHdSrc = data.rtmp;
+						var playHtml =
+							`<video id="myPlayer"   poster='' controls playsInline  webkit-playsinline src=${hlsHdSrc}  style="width:100%; height:100%;"></video>`;
+						$("#box").html(playHtml)
+						var myVideo = videojs(`myPlayer`, {
+							controls: true,
+							autoplay: 'play',
+							url: hlsHdSrc,
+							sources: [{
+								type: 'application/x-mpegURL',
+								src: hlsHdSrc,
+							}],
+						}, function onPlayerReady() {
+							myVideo.play()
+							console.log('准备好了')
+						});
+						myVideo.on('play', function() {
+							console.log('开始播放')
+						})
+
+
+					} else {
+						alert(res.message)
+					}
+
+				})
+
+			} else {
+				$.ajax({
+					type: "POST",
+					url: "http://47.110.79.22:9000/api/api_gateway?method=camera.camera_manage.addr_camera",
+					// url: "http://192.168.0.117:8003/api/api_gateway?method=camera.camera_manage.addr_camera",
+					data: {
+						device_id: device_id,
+						token
+						// device_id: 'FA8690323-1',
+						// token: localStorage.getItem('session_key')
+					}
+				}).then((res) => {
+					// console.log(JSON.stringify(res))
+					if (res.message == '') {
+						var data = null
+						if (typeof res.data == 'string') {
+							data = eval('(' + res.data + ')');
+						} else {
+							data = res.data;
+						}
+						console.log(data, 'data');
+						if (data.type_id == 2) {
+							// 大华云联
+							initYunlianPlayer(data.rtsp)
+
+						} else {
+							let hlsHdSrc = data.type_id == 0 ? data.hls : data.hlsHd;
+							var playHtml =
+								`<video id="myPlayer"   poster='' controls playsInline  webkit-playsinline src=${hlsHdSrc}  style="width:100%; height:100%;"></video>`;
+							$("#box").html(playHtml)
+							var myVideo = videojs(`myPlayer`, {
+								controls: true,
+								autoplay: 'play',
+								url: hlsHdSrc,
+								sources: [{
+									type: 'application/x-mpegURL',
+									src: hlsHdSrc,
+								}],
+							}, function onPlayerReady() {
+								myVideo.play()
+								console.log('准备好了')
+							});
+							myVideo.on('play', function() {
+								console.log('开始播放')
+							})
+						}
+
+					} else {
+						alert(res.message)
+					}
+
+				})
+
+			}
+
+		})
+		document.addEventListener('UniAppJSBridgeReady', function() {
+
+			$('.imgBtnCamrea').click(function() {
+				// if (player) {
+				// 	player.close('yunlianPlayer')
+				// 	player = null
+				// }
+
+				uni.navigateTo({
+					url: '/pages/monitor/imagelist?id=' + device_id
+				})
+			})
+			$('.imgBtnDgp').click(function() {
+				// if (player) {
+				// 	player.close('yunlianPlayer')
+				// 	player = null
+				// }
+
+				uni.navigateTo({
+					url: '/pages/monitor/dgpImagelist?id=' + device_id
+				})
+			})
+		});
+	</script>
+</html>

util/api.js

@@ -12,7 +12,7 @@ export const myRequest = (options) => {
     //     : 'http://8.136.98.49:8002';
     BASE_URL =
       process.env.NODE_ENV === 'development'
-        ? 'http://192.168.1.107:8000'
+        ? 'https://uat.hnyfwlw.com'
         : 'http://8.136.98.49:8002';
     // BASE_URL = 'http://192.168.1.77:8002'
     // BASE_URL = 'http://218.28.198.186:10508';

util/neutral.js

@@ -1,4 +1,5 @@
 export default {
   // isneutral:true//云飞智控
   isneutral: false, //智控
+  imageURL:'https://s3.hnyfwlw.com/webstaticimg',//图片访问路径
 };