提交

README.md

@@ -16,7 +16,7 @@
 	--|
     |-- pages  //主包
         |-- fault    				    // 故障上报
-        |-- monitor     				// 可视监控模块
+        |-- camera     					// 可视监控模块
 			|-- index.vue					// 可视监控列表
 			|-- details.vue					// 可视监控详情
 		--|

api/camera.js

@@ -4,13 +4,15 @@ import request from '@/utils/request/index.js'
  */
 
 // 可视监控数据请求父类函数
-const cameraRequest = (url, data) => request.post(`api/api_gateway?method=camera.camera_manage.${url}`, data);
-
+const cameraRequest =async (url, data) => {
+	const res = await request.post(`api/api_gateway?method=camera.camera_manage.${url}`, data);
+	return res?.data;
+}
 // 监控列表
-export const getCameraList = (data) => cameraRequest('list_camera',data);
+export const getCameraList = (data) => cameraRequest('list_camera', data);
 
 // 播放地址
-export const getCameraAddress = (data) => cameraRequest('addr_camera',data);
+export const getCameraAddress = (data) => cameraRequest('addr_camera', data);
 
 // 监控控制
-export const controlCamera = (data) => cameraRequest('ctrl_camera',data);
+export const controlCamera = (data) => cameraRequest('ctrl_camera', data);

api/fault.js

@@ -4,8 +4,10 @@ import request from '@/utils/request/index.js'
  */
 
 // 预警上报数据请求父类函数
-const faultRequest = (url, data) => request.post(`api/api_gateway?method=after_sale.after_sale_manage.${url}`, data);
-
+const faultRequest = async (url, data) => {
+	const res = await request.post(`api/api_gateway?method=after_sale.after_sale_manage.${url}`, data);
+	return res?.data;
+}
 
 // 设备详情
 export const getAftersaleInfo = (data) => faultRequest('aftersale_infos',data);

api/weather.js

@@ -132,7 +132,7 @@ export const getWeatherChart = async (params) => {
  * 气象站、墒情站24小时数据
  * @param {*} data 
  */
-export const getWeatherData = async (data) => {
+export const getWeatherDayData = async (data) => {
 	let res = await weatherRequest('qxz_day_data', data);
 	return res;
 };

pages.json

@@ -62,14 +62,14 @@
 			}
 
 		}, {
-			"path": "pages/monitor/index",
+			"path": "pages/camera/index",
 			"style": {
 				"navigationBarTitleText": "监控列表",
 				"enablePullDownRefresh": false
 			}
 
 		}, {
-			"path": "pages/monitor/details",
+			"path": "pages/camera/details",
 			"style": {
 				"navigationBarTitleText": "监控画面",
 				"enablePullDownRefresh": false

pages/monitor/index.vue

@@ -1,9 +1,9 @@
 <template>
 	<!-- 可视监控 -->
-	<view class="monitor-panel">
+	<view class="camera-panel">
 		<!-- 监控列表 -->
-		<block v-for="(item,index) in monitorList" :key="index">
-			<view class="monitor-item">
+		<block v-for="(item,index) in cameraList" :key="index">
+			<view class="camera-item" @click="openCameraDetails(item.device_id)">
 				<image class="pic" mode="aspectFill"
 					src="https://bjetxgzv.cdn.bspapp.com/VKCEYUGU-uni-app-doc/6acec660-4f31-11eb-a16f-5b3e54966275.jpg">
 				</image>
@@ -14,23 +14,63 @@
 			</view>
 		</block>
 		<!-- 监控列表end -->
+		<ui-empty v-if="cameraList.length==0"></ui-empty>
 	</view>
 </template>
 
 <script>
+	import {
+		getCameraList
+	} from '@/api/camera.js'
 	export default {
 		data() {
 			return {
+				params: {
+					page: 1,
+					page_size: 10,
+					// device_id:
+				},
 				// 监控列表
-				monitorList: [{}, {}, {}, {}, {}, {}, {}],
+				cameraList: [],
+				total: 0, // 设备总数
 			};
+		},
+		onLoad() {
+			this.getCameraList();
+		},
+		onReachBottom(e) {
+			if (this.cameraList.length >= this.total) {
+				return;
+			}
+			this.params.page += 1;
+			this.getCameraList();
+		},
+		methods: {
+			// 获取监控列表
+			async getCameraList() {
+				const {
+					data,
+					counts
+				} = await getCameraList(this.params);
+				this.cameraList = [...this.cameraList, ...data];
+				this.total = counts;
+			},
+			/**
+			 * 打开监控详情
+			 * @param {string} id 设备id
+			 */
+			openCameraDetails(id){
+				uni.navigateTo({
+					url:`details?id=${id}`
+				})
+			}
 		}
 	}
 </script>
 
 <style lang="scss">
 	// 可视监控面板
-	.monitor-panel {
+	.camera-panel {
 		display: flex;
 		flex-wrap: wrap;
 		padding: 24rpx;
@@ -39,12 +79,12 @@
 	}
 
 	// 可视列表项
-	.monitor-item {
+	.camera-item {
 		width: 336rpx;
-		
+
 		margin-right: 28rpx;
 		margin-bottom: 24rpx;
-		
+
 		border-radius: 12rpx;
 		border: 1rpx solid #F1F1F1;
 

pages/index/index.vue

@@ -20,7 +20,7 @@
 						text:'虫情监测'
 					},
 					{
-						url:'/pages/monitor/index',
+						url:'/pages/camera/index',
 						text:'监控列表'
 					},
 					{

pages/pest/index.vue

@@ -2,7 +2,7 @@
 	<!-- 病虫害百科 -->
 	<view>
 		<ui-search placeholder="请输入害虫名字" @confirm="searchLampList"></ui-search>
-		<ui-tabs :list="tabs" :active="1"></ui-tabs>
+		<ui-tabs :list="tabs" :active="tabValue"></ui-tabs>
 		<!-- 病虫害百科列表 -->
 		<view class="page-panel pest-panel">
 			<block v-for="(item,index) in pestList" :key="index">
@@ -45,7 +45,7 @@
 			};
 		},
 		onLoad() {
-
+			this.getPestList();
 		},
 		methods: {
 			// 获取虫害列表

pages/weather/components/w-line-charts.vue

@@ -1,7 +1,8 @@
 <template>
 	<!-- 气象历史数据 折线统计图 -->
 	<view>
-		<ui-charts ref="wLineCharts" type="line" :ontouch="true" :opts="opts" :chartData="chartData"></ui-charts>
+		<ui-charts ref="wLineCharts"  type="line" :ontouch="true" :opts="opts" :chartData="chartData">
+		</ui-charts>
 	</view>
 </template>
 
@@ -15,7 +16,6 @@
 		name: 'w-line-charts',
 		data() {
 			return {
-
 				opts: {
 					loadingType: 0,
 					color: ["#317afd"],
@@ -70,23 +70,32 @@
 			}
 		},
 		props: {
-
 			chartData: {
 				type: [Array, Object],
 				default () {
 					return []
 				}
 			},
+			width: {
+				type: [String],
+				default: 'required'
+			},
+			height: {
+				type: [String],
+				default: 'required'
+			},
 		},
 		watch: {
 			chartData: {
 				deep: true, // 深度监听
 				handler(val) {
-
-					// this.$refs.wLineCharts.updataUChart()
 				}
 			}
 		},
+		mounted(){
+			this.opts.width=this.width; 
+			this.opts.height=this.height; 
+		},
 		methods: {}
 	};
 </script>

pages/weather/details.vue

@@ -15,26 +15,43 @@
 		<view class="row-between m-12">
 			<view class="font-16 mr">实时数据</view>
 			<view class="flex-1 font-10 text-sub">（可点击查看24小时数据）</view>
-			<navigator :url="`history?id=${deviceInfo.equip_id}`" class="font-14 text-primary" hover-class="none">历史数据</navigator>
+			<navigator :url="`history?id=${deviceInfo.equip_id}`" class="font-14 text-primary" hover-class="none">历史数据
+			</navigator>
 		</view>
 		<!-- 数据列表 -->
 		<view class="latest-list">
-			<view class="ui-card latest-item" v-for="(item,index) in latestList" :key="index">
-				<view class="icon"></view>
-				<view class="column-between text-info font-12">
-					<view class="text">{{item.text}}</view>
-					<view class="text">{{item.value}}</view>
+			<block v-for="(item,index) in latestList" :key="index">
+				<view class="ui-card latest-item" @click="openLatestChart(item)">
+					<view class="icon"></view>
+					<view class="column-between text-info font-12">
+						<view class="text">{{item.text}}</view>
+						<view class="text">{{item.value}}</view>
+					</view>
 				</view>
-			</view>
+			</block>
 		</view>
 		<!-- 数据列表end -->
+		<!-- 统计图24小时数据 -->
+		<uni-popup ref="chartsPopup" type="dialog" background-color="#fff">
+			<!-- <view class="charts-popup" v-if="chartshow">
+				<lineCharts :chartData="chartShowData"></lineCharts>
+			</view> -->
+			<view class="charts-popup">
+				<view class="charts-title">
+					24小时数据
+				</view>
+				<lineCharts :chartData="chartShowData"></lineCharts>
+			</view>
+		</uni-popup>
 	</view>
 </template>
 
 <script>
 	import {
-		getWeatherDeviceDetail
+		getWeatherDeviceDetail,
+		getWeatherDayData
 	} from '@/api/weather.js'
+	import lineCharts from './components/w-line-charts.vue' // 折线图
 	// 设备详情
 	export default {
 		data() {
@@ -43,19 +60,38 @@
 				deviceInfo: {}, // 设备信息
 				// 实时数据列表 { icon:'图标', text:'标题',valu7e:'值'}
 				latestList: [],
+				// 统计图24小时数据
+				chartShowData: {
+					categories: [],
+					series: [],
+				},
 
 			};
 		},
+		components: {
+			lineCharts
+		},
 		onLoad(options) {
 			this.deviceInfo = JSON.parse(options.params);
 			this.getLatestList();
+			this.getWeatherDayData();
 		},
 		methods: {
 			// 获取实时数据列表
 			async getLatestList() {
 				this.latestList = await getWeatherDeviceDetail({
-					device_id:this.deviceInfo.equip_id
+					device_id: this.deviceInfo.equip_id
 				});
+			},
+			// 获取24小时实时数据
+			async getWeatherDayData() {
+				let res = await getWeatherDayData({
+					device_id: this.deviceInfo.equip_id
+				});
+			},
+			// 实时数据折线图信息
+			openLatestChart() {
+				this.$refs['chartsPopup'].open();
 			}
 		}
 
@@ -63,4 +99,15 @@
 </script>
 
 <style lang="scss">
+	.charts-popup {
+		width: 500rpx;
+		height: 500rpx;
+	}
+
+	.charts-title {
+		font-size: $font-size-title;
+		color: $color-title;
+		line-height: $line-height-title;
+		text-align: center;
+	}
 </style>

pages/weather/history.vue

@@ -142,7 +142,7 @@
 				this.chartShowData = {
 					categories: times,
 					series: [{
-						name: pickes[0]?.text,
+						name: pickes[0]?.text ?? '',
 						data: charts[this.pickesId] ?? []
 					}]
 				}

pages/weather/index.vue

@@ -11,12 +11,13 @@
 					<view class="font-16  title on">设备名称：{{item.equip_name}}</view>
 					<view class="text">设备ID：{{item.equip_id}}</view>
 					<view class="text text-ellipsis">地址：{{item.address}}</view>
-					<view class="text">最新上报时间：{{item.uptime | timeFrom('yyyy-mm-dd hh:MM:ss')}}</view>
+					<view class="text">最新上报时间：{{item.uptime | timeFrom}}</view>
 				</view>
 				<ui-state :state="item.is_online"></ui-state>
 			</view>
 		</block>
 		<!-- 气象列表end -->
+		<ui-empty v-if="deviceList.length==0"></ui-empty>
 	</view>
 </template>
 
@@ -83,7 +84,7 @@
 				const {
 					ids,
 					nums
-				} = await getWeatherDeviceList(this.params);
+				} = await getWeatherDeviceList();
 				this.deviceList = [...this.deviceList, ...ids];
 				this.total = nums ?? 0;
 			},

pages/worm/details.vue

@@ -15,15 +15,15 @@
 		<!-- 导航选项 -->
 		<view class="ui-card  worm-nav">
 			<navigator :url="`image?id=${deviceId}`" class="worm-nav-item" hover-class="none">
-				<view class="icon"></view>
+				<image src="@/static/img/worm-nav-2.png" class="icon" mode="aspectFill"></image>
 				<view class="text">查看图片</view>
 			</navigator>
 			<navigator :url="`analyse?id=${deviceId}`" class="worm-nav-item" hover-class="none">
-				<view class="icon"></view>
+				<image src="@/static/img/worm-nav-1.png" class="icon" mode="aspectFill"></image>
 				<view class=" text">害虫分析</view>
 			</navigator>
 			<navigator :url="`history?id=${deviceId}`" class="worm-nav-item" hover-class="none">
-				<view class="icon"></view>
+				<image src="@/static/img/worm-nav-3.png" class="icon" mode="aspectFill"></image>
 				<view class="text">历史数据</view>
 			</navigator>
 
@@ -35,14 +35,18 @@
 		<!-- 数据列表 -->
 		<view class="latest-list">
 			<view class="ui-card latest-item">
-				<view class="icon"></view>
+				<view class="icon">
+					<image src="@/static/worm/is_online.png"></image>
+				</view>
 				<view class="column-between text-info font-12">
 					<view class="text">在线状态</view>
 					<view class="text">{{lampDetails.is_online==1?'在线':'离线'}}</view>
 				</view>
 			</view>
 			<view class="ui-card latest-item">
-				<view class="icon"></view>
+				<view class="icon">
+					<image src="@/static/worm/ds.png"></image>
+				</view>
 				<view class="column-between text-info font-12">
 					<view class="text">开机状态</view>
 					<view class="text">{{lampDetails.ds==1?'开机':'关机'}}</view>
@@ -56,7 +60,9 @@
 				</view>
 			</view>
 			<view class="ui-card latest-item">
-				<view class="icon"></view>
+				<view class="icon">
+					<image src="@/static/worm/hs.png"></image>
+				</view>
 				<view class="column-between text-info font-12">
 					<view class="text">加热状态</view>
 					<view class="text">{{lampDetails.hs==1?'加热':'正常'}}</view>
@@ -77,38 +83,46 @@
 				</view>
 			</view>
 			<view class="ui-card latest-item">
-				<view class="icon"></view>
+				<view class="icon"><image src="@/static/worm/csq.png"></image></view>
 				<view class="column-between text-info font-12">
 					<view class="text">信号强度</view>
-					<view class="text"></view>
+					<view class="text">{{lampDetails.csq}}</view>
 				</view>
 			</view>
 			<view class="ui-card latest-item">
-				<view class="icon"></view>
+				<view class="icon">
+					<image src="@/static/worm/dver.png"></image>
+				</view>
 				<view class="column-between text-info font-12">
 					<view class="text">设备版本</view>
-					<view class="text"></view>
+					<view class="text">{{lampDetails.dver}}</view>
 				</view>
 			</view>
 			<view class="ui-card latest-item">
-				<view class="icon"></view>
+				<view class="icon">
+					<image src="@/static/worm/rps.png"></image>
+				</view>
 				<view class="column-between text-info font-12">
 					<view class="text">雨控制状态</view>
-					<view class="text"></view>
+					<view class="text">{{lampDetails.rps==1?'保护':'正常'}}</view>
 				</view>
 			</view>
 			<view class="ui-card latest-item">
-				<view class="icon"></view>
+				<view class="icon">
+					<image src="@/static/worm/tps.png"></image>
+				</view>
 				<view class="column-between text-info font-12">
 					<view class="text">温控状态</view>
-					<view class="text"></view>
+					<view class="text">{{lampDetails.tps==1?'温控':'正常'}}</view>
 				</view>
 			</view>
 			<view class="ui-card latest-item">
-				<view class="icon"></view>
+				<view class="icon">
+					<image src="@/static/worm/lps.png"></image>
+				</view>
 				<view class="column-between text-info font-12">
 					<view class="text">光控状态</view>
-					<view class="text"></view>
+					<view class="text">{{lampDetails.lps==1?'光控':'正常'}}</view>
 				</view>
 			</view>
 			<view class="ui-card latest-item">
@@ -119,17 +133,21 @@
 				</view>
 			</view>
 			<view class="ui-card latest-item">
-				<view class="icon"></view>
+				<view class="icon">
+					<image src="@/static/worm/upds.png"></image>
+				</view>
 				<view class="column-between text-info font-12">
 					<view class="text">上仓门</view>
-					<view class="text"></view>
+					<view class="text">{{lampDetails.upds==1?'打开':'关闭'}}</view>
 				</view>
 			</view>
 			<view class="ui-card latest-item">
-				<view class="icon"></view>
+				<view class="icon">
+					<image src="@/static/worm/dnds.png"></image>
+				</view>
 				<view class="column-between text-info font-12">
 					<view class="text">下仓门</view>
-					<view class="text"></view>
+					<view class="text">{{lampDetails.dnds==1?'打开':'关闭'}}</view>
 				</view>
 			</view>
 		</view>
@@ -189,14 +207,13 @@
 		&-item {
 			display: block;
 			flex: 1;
-			padding: 50rpx 0 48rpx;
+			padding: 36rpx 0 48rpx;
 			text-align: center;
 
 			.icon {
-				width: 92rpx;
-				height: 92rpx;
-				margin: 0 auto 26rpx;
-				background-color: $color-primary;
+				width: 136rpx;
+				height: 136rpx;
+				margin: 0 auto 18rpx;
 				border-radius: 100%;
 			}
 

styles/common.scss

@@ -533,11 +533,19 @@ image {
 		margin-right: 24rpx;
 	}
 	.icon{
+		display: flex;
+		align-items: center;
+		justify-content: center;
 		width: 88rpx;
 		height: 88rpx;
 		margin-right: 24rpx;
 		background:$color-primary;
 		border-radius: 100%;
+		image{
+			display: block;
+			width: 60rpx;
+			height: 60rpx;
+		}
 	}
 	.text{
 		line-height: 34rpx;

uni_modules/uni-table/components/uni-table/uni-table.vue

@@ -371,6 +371,7 @@ $border-color: #ebeef5;
 }
 .uni-table-text {
 	position: absolute;
+	top:25rpx;
 	right: 0;
 	left: 0;
 	text-align: center;