设备异常记录/设备异常记录详情

common/apiurl.js

@@ -63,6 +63,10 @@ export const apiurl = {
 	// 设备异常记录模块接口
 	deviceAbnormal: {
 		// 获取设备异常记录列表接口
-		getDeviceAbnormalListUrl: '/admin/deviceexcptionoper'
+		getDeviceAbnormalListUrl: '/operator/deviceexcptionoper',
+		// 获取设备异常记录详情接口
+		getDeviceAbnormalDetailsUrl: '/operator/deviceexcptionoper/findById',
+		// 修改设备异常记录信息为已读接口
+		updateDeviceAbnormalInfoUrl: '/operator/deviceexcptionoper/updateRedStatus'
 	}
 }

common/http.api.js

@@ -126,7 +126,13 @@ const install = (Vue, vm) => {
 		// 获取设备异常记录列表
 		getDeviceAbnormalListApi: (params = {}) => vm.$u.http.get(apiurl.deviceAbnormal.getDeviceAbnormalListUrl, {
 			params
-		})
+		}),
+		// 获取设备异常记录详情
+		getDeviceAbnormalDetailsApi: (params = {}) => vm.$u.http.get(apiurl.deviceAbnormal.getDeviceAbnormalDetailsUrl, {
+			params
+		}),
+		// 修改设备异常记录信息为已读
+		updateDeviceAbnormalInfoApi: (params = {}) => vm.$u.http.put(apiurl.deviceAbnormal.updateDeviceAbnormalInfoUrl, params)
 	}
 
 	// 将各个定义的接口名称，统一放进对象挂载到vm.$u.api(因为vm就是this，也即this.$u.api)下

pages.json

@@ -45,55 +45,78 @@
 			"path": "pages/orderManagement/parkingRecord/parkingRecord",
 			"style": {
 				"navigationBarTitleText": "停车记录",
-				"enablePullDownRefresh": false
+				"enablePullDownRefresh": false,
+				"navigationBarBackgroundColor": "#1767F2",
+				"navigationBarTextStyle": "white"
 			}
 
 		}, {
 			"path": "pages/orderManagement/arrearageRecord/arrearageRecord",
 			"style": {
 				"navigationBarTitleText": "欠费记录",
-				"enablePullDownRefresh": false
+				"enablePullDownRefresh": false,
+				"navigationBarBackgroundColor": "#1767F2",
+				"navigationBarTextStyle": "white"
 			}
 
 		}, {
 			"path": "pages/orderManagement/collectionRecord/collectionRecord",
 			"style": {
 				"navigationBarTitleText": "收款记录",
-				"enablePullDownRefresh": false
+				"enablePullDownRefresh": false,
+				"navigationBarBackgroundColor": "#1767F2",
+				"navigationBarTextStyle": "white"
 			}
 
 		}, {
 			"path": "pages/orderManagement/feeEvasionRecord/feeEvasionRecord",
 			"style": {
 				"navigationBarTitleText": "逃费记录",
-				"enablePullDownRefresh": false
+				"enablePullDownRefresh": false,
+				"navigationBarBackgroundColor": "#1767F2",
+				"navigationBarTextStyle": "white"
 			}
 
 		}, {
 			"path": "pages/orderManagement/voidRecord/voidRecord",
 			"style": {
 				"navigationBarTitleText": "作废记录",
-				"enablePullDownRefresh": false
+				"enablePullDownRefresh": false,
+				"navigationBarBackgroundColor": "#1767F2",
+				"navigationBarTextStyle": "white"
 			}
 
 		}, {
 			"path": "pages/orderManagement/recoveryRecord/recoveryRecord",
 			"style": {
 				"navigationBarTitleText": "追缴记录",
-				"enablePullDownRefresh": false
+				"enablePullDownRefresh": false,
+				"navigationBarBackgroundColor": "#1767F2",
+				"navigationBarTextStyle": "white"
 			}
 
 		}, {
 			"path": "pages/patrolManagement/patrolRecord/patrolRecord",
 			"style": {
 				"navigationBarTitleText": "巡检记录",
-				"enablePullDownRefresh": false
+				"enablePullDownRefresh": false,
+				"navigationBarBackgroundColor": "#1767F2",
+				"navigationBarTextStyle": "white"
 			}
 
 		}, {
 			"path": "pages/patrolManagement/deviceAbnormalRecords/deviceAbnormalRecords",
 			"style": {
 				"navigationBarTitleText": "设备异常记录",
+				"enablePullDownRefresh": true,
+				"navigationBarBackgroundColor": "#1767F2",
+				"navigationBarTextStyle": "white"
+			}
+
+		}, {
+			"path": "pages/patrolManagement/deviceAbnormalRecords/recordsDetails/recordsDetails",
+			"style": {
+				"navigationBarTitleText": "设备异常记录详情",
 				"enablePullDownRefresh": false,
 				"navigationBarBackgroundColor": "#1767F2",
 				"navigationBarTextStyle": "white"

pages/orderManagement/arrearageRecord/arrearageRecord.vue

@@ -1,7 +1,7 @@
 <!-- 欠费记录 -->
 <template>
 	<view>
-		
+		<u-empty style="padding-top: 270px;" mode="page" icon="http://cdn.uviewui.com/uview/empty/page.png" text="页面未开发"></u-empty>
 	</view>
 </template>
 

pages/orderManagement/collectionRecord/collectionRecord.vue

@@ -1,7 +1,7 @@
 <!-- 收款记录 -->
 <template>
 	<view>
-		
+		<u-empty style="padding-top: 270px;" mode="page" icon="http://cdn.uviewui.com/uview/empty/page.png" text="页面未开发"></u-empty>
 	</view>
 </template>
 

pages/orderManagement/feeEvasionRecord/feeEvasionRecord.vue

@@ -1,7 +1,7 @@
 <!-- 逃费记录 -->
 <template>
 	<view>
-		
+		<u-empty style="padding-top: 270px;" mode="page" icon="http://cdn.uviewui.com/uview/empty/page.png" text="页面未开发"></u-empty>
 	</view>
 </template>
 

pages/orderManagement/parkingRecord/parkingRecord.vue

@@ -1,7 +1,7 @@
 <!-- 停车记录 -->
 <template>
 	<view>
-		
+		<u-empty style="padding-top: 270px;" mode="page" icon="http://cdn.uviewui.com/uview/empty/page.png" text="页面未开发"></u-empty>
 	</view>
 </template>
 
@@ -9,11 +9,11 @@
 	export default {
 		data() {
 			return {
-				
+
 			}
 		},
 		methods: {
-			
+
 		}
 	}
 </script>

pages/orderManagement/recoveryRecord/recoveryRecord.vue

@@ -1,7 +1,7 @@
 <!-- 追缴记录 -->
 <template>
 	<view>
-		
+		<u-empty style="padding-top: 270px;" mode="page" icon="http://cdn.uviewui.com/uview/empty/page.png" text="页面未开发"></u-empty>
 	</view>
 </template>
 

pages/orderManagement/voidRecord/voidRecord.vue

@@ -1,7 +1,7 @@
 <!-- 作废记录 -->
 <template>
 	<view>
-		
+		<u-empty style="padding-top: 270px;" mode="page" icon="http://cdn.uviewui.com/uview/empty/page.png" text="页面未开发"></u-empty>
 	</view>
 </template>
 

pages/patrolManagement/deviceAbnormalRecords/deviceAbnormalRecords.scss

@@ -24,6 +24,13 @@
 				line-height: 17px;
 				padding-bottom: 8px;
 				border-bottom: solid 1px #DBDBDB;
+				view {
+					overflow: hidden;
+					text-overflow: ellipsis;
+					display: -webkit-box;
+					-webkit-line-clamp: 3;
+					-webkit-box-orient: vertical;
+				}
 			}
 			&-bottom {
 				display: flex;
@@ -34,4 +41,9 @@
 			}
 		}
 	}
+	&-empty {
+		background-color: #fff;
+		padding: 15px;
+		border-radius: 5px;
+	}
 }

pages/patrolManagement/deviceAbnormalRecords/deviceAbnormalRecords.vue

@@ -1,14 +1,14 @@
 <!-- 设备异常记录 -->
 <template>
 	<view class="records">
-		<view class="records-list">
-			<view class="records-list-item" v-for="(item, index) in recordList" :key="index">
+		<view class="records-list" v-if="recordList.length">
+			<view class="records-list-item" v-for="(item, index) in recordList" :key="index" @click="recordClick(item)">
 				<view class="records-list-item-header">
 					<view>{{ item.roadName }}</view>
 					<view>{{ item.createBy }}</view>
 				</view>
 				<view class="records-list-item-content">
-					{{ item.content }}
+					<view>{{ item.exceprionDes }}</view>
 				</view>
 				<view class="records-list-item-bottom">
 					<view>{{ $u.timeFormat(item.createTime, 'mm-dd hh:MM') }}</view>
@@ -16,7 +16,10 @@
 				</view>
 			</view>
 		</view>
-		<u-loadmore :status="status" color="#fff"/>
+		<view class="records-empty" v-else>
+			<u-empty mode="list" icon="http://cdn.uviewui.com/uview/empty/list.png" />
+		</view>
+		<u-loadmore v-if="recordList.length" :status="status" color="#fff" />
 	</view>
 </template>
 
@@ -24,64 +27,48 @@
 	export default {
 		data() {
 			return {
-				recordList: [{
-						roadName: '可处路-KC001',
-						createBy: '张三',
-						content: '“繁体字”这个词只在一个字存在简化字时使用，如某汉字无对应的简化字，则属于传承字范畴。但在某些时候，港澳台通行字体会被笼统地称为“繁体字”或“繁体中文”；',
-						createTime: '2022-01-20 13:00:00'
-					},
-					{
-						roadName: '可处路-KC002',
-						createBy: '李四',
-						content: '“繁体字”这个词只在一个字存在简化字时使用，如某汉字无对应的简化字，则属于传承字范畴。但在某些时候，港澳台通行字体会被笼统地称为“繁体字”或“繁体中文”；',
-						createTime: '2022-01-18 13:00:00'
-					},
-					{
-						roadName: '可处路-KC002',
-						createBy: '李四',
-						content: '“繁体字”这个词只在一个字存在简化字时使用，如某汉字无对应的简化字，则属于传承字范畴。但在某些时候，港澳台通行字体会被笼统地称为“繁体字”或“繁体中文”；',
-						createTime: '2022-01-18 13:00:00'
-					},
-					{
-						roadName: '可处路-KC002',
-						createBy: '李四',
-						content: '“繁体字”这个词只在一个字存在简化字时使用，如某汉字无对应的简化字，则属于传承字范畴。但在某些时候，港澳台通行字体会被笼统地称为“繁体字”或“繁体中文”；',
-						createTime: '2022-01-18 13:00:00'
-					},
-					{
-						roadName: '可处路-KC002',
-						createBy: '李四',
-						content: '“繁体字”这个词只在一个字存在简化字时使用，如某汉字无对应的简化字，则属于传承字范畴。但在某些时候，港澳台通行字体会被笼统地称为“繁体字”或“繁体中文”；',
-						createTime: '2022-01-18 13:00:00'
-					}
-				],
+				recordList: [],
 				status: 'loadmore',
-				page: 1
+				page: 1,
+				loading: false
 			}
 		},
 		onShow() {
-			// this.recordList = []
-			this.getRecordList()
+			this.recordList = []
+			this.getRecordList();
 		},
 		methods: {
 			getRecordList() {
-				// uni.$u.api.deviceAbnormalApi.getDeviceAbnormalListApi({
-				// 	pageNum: this.page, pageSize: 10
-				// }).then(res => {
-				// 	console.log(res)
-				// })
-				this.recordList.push({
-					roadName: '可处路-KC002',
-					createBy: '李四',
-					content: '“繁体字”这个词只在一个字存在简化字时使用，如某汉字无对应的简化字，则属于传承字范畴。但在某些时候，港澳台通行字体会被笼统地称为“繁体字”或“繁体中文”；',
-					createTime: '2022-01-18 13:00:00'
+				uni.$u.api.deviceAbnormalApi.getDeviceAbnormalListApi({
+					pageNum: this.page,
+					pageSize: 10
+				}).then(res => {
+					if (res.code === 200) {
+						this.recordList = this.recordList.concat(res.data.rows)
+						setTimeout(() => {
+							if (this.page >= res.data.pages) this.status = 'nomore';
+							else this.status = 'loading';
+						}, 1000)
+					}
+				})
+			},
+			recordClick(item) {
+				uni.$u.route({
+					url: 'pages/patrolManagement/deviceAbnormalRecords/recordsDetails/recordsDetails',
+					params: {
+						id: item.id
+					}
 				})
-				setTimeout(() => {
-					if (this.page >= 100) this.status = 'nomore';
-					else this.status = 'loading';
-				}, 1000)
 			}
 		},
+		onPullDownRefresh() {
+			this.recordList = []
+			this.status = 'loading';
+			this.getRecordList();
+			setTimeout(function() {
+				uni.stopPullDownRefresh();
+			}, 1000);
+		},
 		onReachBottom() {
 			if (this.page >= 100) return;
 			this.status = 'loading';

pages/patrolManagement/deviceAbnormalRecords/recordsDetails/recordsDetails.scss

@@ -0,0 +1,40 @@
+.details {
+	padding: 15px;
+	&-content {
+		background-color: #fff;
+		border-radius: 5px;
+		padding: 15px;
+		font-family: PingFangSC-Regular, PingFang SC;
+		&-road {
+			display: flex;
+			justify-content: space-between;
+			align-items: center;
+			margin-bottom: 12px;
+			&-name {
+				font-size: 19px;
+				color: #171717;
+			}
+			&-date {
+				color: #767676;
+				font-size: 13px;
+			}
+		}
+		&-describe {
+			color: #616161;
+			font-size: 13px;
+		}
+		&-imgs {
+			margin-top: 11px;
+			display: flex;
+			flex-wrap: wrap;
+			&-item {
+				border: solid 1px #f1efef;
+				margin-right: 25px;
+				margin-bottom: 11px;
+				&:nth-child(2n) {
+					margin-right: 0;
+				}
+			}
+		}
+	}
+}

pages/patrolManagement/deviceAbnormalRecords/recordsDetails/recordsDetails.vue

@@ -0,0 +1,87 @@
+<template>
+	<view class="details">
+		<view class="details-content" v-if="detailsInfo.id">
+			<view class="details-content-road">
+				<view class="details-content-road-name">{{ detailsInfo.roadName }}</view>
+				<view class="details-content-road-date">{{ detailsInfo.createTime }}</view>
+			</view>
+			<view class="details-content-describe">
+				{{ detailsInfo.exceprionDes }}
+			</view>
+			<view class="details-content-imgs" v-if="detailsInfo.imgsList && detailsInfo.imgsList.length">
+				<view class="details-content-imgs-item" v-for="(img, index) in detailsInfo.imgsList" :key="index">
+					<u--image :showLoading="true" mode="aspectFit" :src="img" width="150px" height="92px"
+						@click="previewImage(detailsInfo.imgsList, index)" />
+				</view>
+			</view>
+		</view>
+		<view class="details-content" v-else>
+			<u-empty mode="data" icon="http://cdn.uviewui.com/uview/empty/data.png" />
+		</view>
+	</view>
+</template>
+
+<script>
+	export default {
+		data() {
+			return {
+				id: undefined,
+				detailsInfo: {}
+			}
+		},
+		onLoad(page) {
+			this.id = page.id
+		},
+		onShow() {
+			if (this.id) {
+				this.getDetails(this.id)
+			}
+		},
+		methods: {
+			getDetails(id) {
+				this.loading = true
+				uni.$u.api.deviceAbnormalApi.getDeviceAbnormalDetailsApi({
+					id
+				}).then(res => {
+					if (res.code === 200) {
+						this.detailsInfo = res.data
+						if (this.detailsInfo.imgs) {
+							this.detailsInfo.imgsList = this.detailsInfo.imgs.split(';')
+						}
+						if (this.detailsInfo.isRed === 0) {
+							this.updateDeviceAbnormalInfo(this.id);
+						}
+					}
+				})
+			},
+			/**
+			 * 设置消息已读
+			 * @param {Object} id
+			 */
+			updateDeviceAbnormalInfo(id) {
+				uni.$u.api.deviceAbnormalApi.updateDeviceAbnormalInfoApi({
+					id
+				}).then(res => {
+					console.log('已读:', res)
+				})
+			},
+			previewImage(list, current) {
+				uni.previewImage({
+					urls: list,
+					current
+				});
+			}
+		}
+	}
+</script>
+
+<style lang="scss">
+	page {
+		min-height: calc(100vh - 44px);
+		background-color: #1767F2;
+	}
+</style>
+
+<style lang="scss" scoped>
+	@import './recordsDetails.scss';
+</style>

pages/patrolManagement/patrolRecord/patrolRecord.vue

@@ -1,7 +1,7 @@
 <!-- 巡检记录 -->
 <template>
 	<view>
-		
+		<u-empty style="padding-top: 270px;" mode="page" icon="http://cdn.uviewui.com/uview/empty/page.png" text="页面未开发"></u-empty>
 	</view>
 </template>
 

utils/request/index.js

@@ -1,15 +0,0 @@
-// 引入配置
-import {
-	config
-} from '@/common/config'
-// 初始化请求配置
-uni.$u.http.setConfig((defaultConfig) => {
-	/* defaultConfig 为默认全局配置 */
-	defaultConfig.baseURL = config.baseUrl
-	return defaultConfig
-})
-
-module.exports = (vm) => {
-	require('./requestInterceptors')(vm)
-	require('./responseInterceptors')(vm)
-}

utils/request/requestInterceptors.js

@@ -1,18 +0,0 @@
-/**
- * 请求拦截
- * @param {Object} http
- */
-module.exports = (vm) => {
-	uni.$u.http.interceptors.request.use((config) => { // 可使用async await 做异步操作
-			// 可以在此通过vm引用vuex中的变量，具体值在vm.$store.state中
-			if (vm.vuex_token) {
-				config.header.Authorization = `Bearer ${vm.vuex_token}`;
-			}
-			// url加时间戳
-			config.url = config.url + '?t=' + Date.now()
-			let noTokenList = [''];
-			if (noTokenList.includes(config.url)) config.header.noToken = true;
-			return config;
-		}, (config) => // 可使用async await 做异步操作
-		Promise.reject(config))
-}

utils/request/responseInterceptors.js

@@ -1,29 +0,0 @@
-/**
- * 响应拦截
- * @param {Object} http 
- */
-module.exports = (vm) => {
-    uni.$u.http.interceptors.response.use((response) => { /* 对响应成功做点什么 可使用async await 做异步操作*/
-        const data = response.data
-        // 自定义参数
-        const custom = response.config?.custom
-        if (data.code == 200) {
-          return res;
-        } else if (data.code == 401) {
-          uni.showToast({
-          	title: 'Token失效',
-          	icon: 'none',
-          	duration: 2000
-          })
-        } else {
-        	uni.showToast({
-        		title: data.msg,
-        		icon: 'none',
-        		duration: 2000
-        	})
-        }
-        return data.data || {}
-    }, (response) => {
-        return Promise.reject(response)
-    })
-}