设备异常记录调整及对接

pages/patrolManagement/deviceAbnormalRecords copy/deviceAbnormalRecords.scss

@@ -0,0 +1,62 @@
+.records {
+	padding: 10px 15px;
+	font-family: PingFangSC-Regular, PingFang SC;
+	&-list {
+		&-item {
+			background-color: #fff;
+			border-radius: 5px;
+			padding: 12px 15px;
+			margin-bottom: 10px;
+			&-header {
+				display: flex;
+				justify-content: space-between;
+				color: #171717;
+				font-size: 18px;
+				margin-bottom: 12px;
+				view:last-child {
+					color: #1767F2;
+					font-size: 15px;
+				}
+				.not-red {
+					position: relative;
+					&::after {
+						content: '';
+						position: absolute;
+						top: 10px;
+						right: -15px;
+						width: 7px;
+						height: 7px;
+						background-color: #f00;
+						border-radius: 50%;
+					}
+				}
+			}
+			&-content {
+				color: #616161;
+				font-size: 12px;
+				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;
+				justify-content: space-between;
+				color: #767676;
+				font-size: 12px;
+				margin-top: 8px;
+			}
+		}
+	}
+	&-empty {
+		background-color: #fff;
+		padding: 15px;
+		border-radius: 5px;
+	}
+}

pages/patrolManagement/deviceAbnormalRecords copy/deviceAbnormalRecords.vue

@@ -0,0 +1,90 @@
+<!-- 设备异常记录 -->
+<template>
+	<view class="records">
+		<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 :class="{'not-red': Number(item.isRed) === 0}">{{ item.roadName }}</view>
+					<view>{{ item.createBy }}</view>
+				</view>
+				<view class="records-list-item-content">
+					<view>{{ item.exceprionDes }}</view>
+				</view>
+				<view class="records-list-item-bottom">
+					<view>{{ $u.timeFormat(item.createTime, 'mm-dd hh:MM') }}</view>
+					<view>查看详情</view>
+				</view>
+			</view>
+		</view>
+		<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>
+
+<script>
+	export default {
+		data() {
+			return {
+				recordList: [],
+				status: 'loadmore',
+				page: 1,
+			}
+		},
+		onShow() {
+			this.page = 1
+			this.recordList = []
+			this.getRecordList();
+		},
+		methods: {
+			getRecordList() {
+				uni.$u.api.deviceAbnormalApi.getDeviceAbnormalListApi({
+					pageNum: this.page,
+					pageSize: 15
+				}).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
+					}
+				})
+			}
+		},
+		onPullDownRefresh() {
+			this.recordList = []
+			this.page = 1;
+			this.status = 'loading';
+			this.getRecordList();
+			setTimeout(function() {
+				uni.stopPullDownRefresh();
+			}, 1000);
+		},
+		onReachBottom() {
+			if (this.page >= 100) return;
+			this.status = 'loading';
+			this.page = ++this.page;
+			this.getRecordList()
+		}
+	}
+</script>
+
+<style lang="scss">
+	page {
+		min-height: calc(100vh - 44px);
+		background-color: #1767F2;
+	}
+</style>
+<style lang="scss" scoped>
+	@import './deviceAbnormalRecords.scss';
+</style>

pages/patrolManagement/deviceAbnormalRecords copy/recordsDetails/recordsDetails.scss

@@ -0,0 +1,45 @@
+.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: 20px;
+				margin-bottom: 11px;
+				width: calc(50% - 12px);
+				&:nth-child(2n) {
+					margin-right: 0;
+				}
+				image {
+					width: 100%;
+					height: 30vw;
+				}
+			}
+		}
+	}
+}

pages/patrolManagement/deviceAbnormalRecords copy/recordsDetails/recordsDetails.vue

@@ -0,0 +1,96 @@
+<template>
+	<view class="details">
+		<!-- <u-loading-page :loading="loading"></u-loading-page> -->
+		<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">
+					<image :src="img" mode="aspectFit" @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: {},
+				loading: false
+			}
+		},
+		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);
+						}
+					}
+					this.loading = false
+				}).catch(e => {
+					this.loading = false
+				})
+			},
+			/**
+			 * 设置消息已读
+			 * @param { String } id
+			 */
+			updateDeviceAbnormalInfo(id) {
+				uni.$u.api.deviceAbnormalApi.updateDeviceAbnormalInfoApi({
+					id
+				}).then(res => {
+					console.log('已读:', id)
+				})
+			},
+			/**
+			 * 预览图片
+			 * @param { Array } list
+			 * @param { Number } current
+			 */
+			previewImage(list, current = 0) {
+				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/deviceAbnormalRecords/deviceAbnormalRecords.scss

@@ -1,62 +1,71 @@
 .records {
-	padding: 10px 15px;
-	font-family: PingFangSC-Regular, PingFang SC;
-	&-list {
-		&-item {
-			background-color: #fff;
-			border-radius: 5px;
-			padding: 12px 15px;
-			margin-bottom: 10px;
-			&-header {
-				display: flex;
-				justify-content: space-between;
-				color: #171717;
-				font-size: 18px;
-				margin-bottom: 12px;
-				view:last-child {
-					color: #1767F2;
-					font-size: 15px;
-				}
-				.not-red {
-					position: relative;
-					&::after {
-						content: '';
-						position: absolute;
-						top: 10px;
-						right: -15px;
-						width: 7px;
-						height: 7px;
-						background-color: #f00;
-						border-radius: 50%;
-					}
-				}
-			}
-			&-content {
-				color: #616161;
-				font-size: 12px;
-				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;
-				justify-content: space-between;
-				color: #767676;
-				font-size: 12px;
-				margin-top: 8px;
-			}
-		}
-	}
-	&-empty {
-		background-color: #fff;
-		padding: 15px;
-		border-radius: 5px;
-	}
+  font-family: PingFangSC-Regular, PingFang SC;
+  &-tabs {
+    background-color: #fff;
+    height: 44px;
+    line-height: 44px;
+    margin-bottom: 20px;
+    display: flex;
+    justify-content: space-between;
+    align-items: center;
+    &-item {
+      width: 33%;
+      text-align: center;
+    }
+    .active {
+      color: #1767f2;
+      view {
+        border-bottom: 2px solid #1767f2;
+        display: inline-block;
+      }
+    }
+  }
+  &-scroll {
+    height: calc(100vh - 128px);
+  }
+  &-list {
+    padding: 0 15px;
+    &-item {
+      background-color: #fff;
+      border-radius: 5px;
+      padding: 12px 15px;
+      margin-bottom: 10px;
+      color: #999999;
+      &-top {
+        width: 100%;
+        .rlit-item {
+          font-size: 15px;
+          margin-bottom: 10px;
+          width: 100%;
+          white-space: nowrap;
+          overflow: hidden;
+          text-overflow: ellipsis;
+          word-break: break-all;
+          text {
+            font-size: 18px;
+            color: #333333;
+          }
+        }
+      }
+      &-bottom {
+        display: flex;
+        justify-content: space-between;
+        align-items: center;
+        font-size: 12px;
+        color: #999999;
+        .rlib-right {
+          background-color: #edf3ff;
+          border-radius: 8px;
+          padding: 2px 8px;
+          color: #1767f2;
+          font-size: 11px;
+        }
+      }
+    }
+  }
+  &-empty {
+    background-color: #fff;
+    padding: 15px;
+    border-radius: 5px;
+  }
 }

pages/patrolManagement/deviceAbnormalRecords/deviceAbnormalRecords.vue

@@ -1,90 +1,140 @@
-<!-- 设备异常记录 -->
+<!--
+ * @Description: 设备异常记录
+ * @Author: 空白格
+ * @Date: 2022-08-04 23:10:11
+ * @LastEditors: 空白格
+ * @LastEditTime: 2022-08-23 14:01:25
+ * @FilePath: \parking_operation\pages\patrolManagement\deviceAbnormalRecords\deviceAbnormalRecords.vue
+ * @Copyright: Copyright (c) 2016~2022 by 空白格, All Rights Reserved. 
+-->
 <template>
-	<view class="records">
-		<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 :class="{'not-red': Number(item.isRed) === 0}">{{ item.roadName }}</view>
-					<view>{{ item.createBy }}</view>
-				</view>
-				<view class="records-list-item-content">
-					<view>{{ item.exceprionDes }}</view>
-				</view>
-				<view class="records-list-item-bottom">
-					<view>{{ $u.timeFormat(item.createTime, 'mm-dd hh:MM') }}</view>
-					<view>查看详情</view>
-				</view>
-			</view>
-		</view>
-		<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>
+  <view class="records">
+    <view class="records-tabs">
+      <view class="records-tabs-item" v-for="(tab, index) in tabList" :key="index" :class="{ active: tabCur === tab.value }" @click="tabClick(tab)">
+        <view class="records-tabs-item-text">{{ tab.label }}</view>
+      </view>
+    </view>
+    <scroll-view class="records-scroll" :scroll-y="true">
+      <view class="records-list" v-if="recordList.length">
+        <view class="records-list-item" v-for="(item, index) in recordList" :key="index">
+          <view class="records-list-item-top">
+            <template v-if="tabCur === 3">
+              <view class="rlit-item"
+                >停车场：<text>{{ item.roadName }}</text></view
+              ></template
+            >
+            <template v-else>
+              <view class="rlit-item"
+                >路段：<text>{{ item.roadName }}</text></view
+              >
+              <view class="rlit-item"
+                >泊位号：<text>{{ item.roadNo }}</text></view
+              >
+            </template>
+            <view class="rlit-item"
+              >异常详情：<text>{{ item.exceprionDes }}</text></view
+            >
+          </view>
+          <view class="records-list-item-bottom">
+            <view class="rlib-left">上报：{{ $u.timeFormat(item.createTime, 'mm月dd日hh:MM') }}</view>
+            <view class="rlib-right" @click="viewDetails(item)">查看</view>
+          </view>
+        </view>
+      </view>
+      <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" />
+    </scroll-view>
+  </view>
 </template>
 
 <script>
-	export default {
-		data() {
-			return {
-				recordList: [],
-				status: 'loadmore',
-				page: 1,
-			}
-		},
-		onShow() {
-			this.page = 1
-			this.recordList = []
-			this.getRecordList();
-		},
-		methods: {
-			getRecordList() {
-				uni.$u.api.deviceAbnormalApi.getDeviceAbnormalListApi({
-					pageNum: this.page,
-					pageSize: 15
-				}).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
-					}
-				})
-			}
-		},
-		onPullDownRefresh() {
-			this.recordList = []
-			this.page = 1;
-			this.status = 'loading';
-			this.getRecordList();
-			setTimeout(function() {
-				uni.stopPullDownRefresh();
-			}, 1000);
-		},
-		onReachBottom() {
-			if (this.page >= 100) return;
-			this.status = 'loading';
-			this.page = ++this.page;
-			this.getRecordList()
+export default {
+  data() {
+    return {
+      tabList: [
+        { label: '地磁', value: 1 },
+        { label: '车位锁', value: 2 },
+        { label: '停车场', value: 3 }
+      ],
+      recordList: [],
+      status: 'loadmore',
+      page: 1,
+      tabCur: 1
+    };
+  },
+  onShow() {
+    this.page = 1;
+    this.recordList = [];
+    this.getRecordList();
+  },
+  methods: {
+    getRecordList() {
+      uni.$u.api.deviceAbnormalApi
+        .getDeviceAbnormalListApi({
+          pageNum: this.page,
+          pageSize: 15,
+          deviceType: this.tabCur
+        })
+        .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
+        }
+      });
+    },
+    tabClick(item) {
+      this.tabCur = item.value;
+      this.page = 1;
+      this.recordList = [];
+      this.getRecordList();
+    },
+    viewDetails(item) {
+			uni.$u.route({
+        url: 'pages/patrolManagement/deviceAbnormalRecords/recordsDetails/recordsDetails',
+        params: {
+          id: item.id,
+					type: this.tabCur
+        }
+      });
 		}
-	}
+  },
+  onPullDownRefresh() {
+    this.recordList = [];
+    this.page = 1;
+    this.status = 'loading';
+    this.getRecordList();
+    setTimeout(function () {
+      uni.stopPullDownRefresh();
+    }, 1000);
+  },
+  onReachBottom() {
+    if (this.page >= 100) return;
+    this.status = 'loading';
+    this.page = ++this.page;
+    this.getRecordList();
+  }
+};
 </script>
 
 <style lang="scss">
-	page {
-		min-height: calc(100vh - 44px);
-		background-color: #1767F2;
-	}
+page {
+  min-height: calc(100vh - 44px);
+  background-color: #f6f6f6;
+}
 </style>
 <style lang="scss" scoped>
-	@import './deviceAbnormalRecords.scss';
+@import './deviceAbnormalRecords.scss';
 </style>

pages/patrolManagement/deviceAbnormalRecords/recordsDetails/recordsDetails.scss

@@ -1,45 +1,51 @@
 .details {
-	padding: 15px;
-	&-content {
+  &-item {
+    &-title {
+      padding: 10px 15px;
+      &-text {
+        font-size: 18px;
+        font-weight: 500;
+        padding-left: 10px;
+        color: #333;
+        position: relative;
+        &::before {
+          content: '';
+          display: inline-block;
+          width: 2px;
+          height: 18px;
+          background-color: #333;
+          position: absolute;
+          left: 0;
+          top: 5px;
+        }
+      }
+    }
+    &-content {
+      background-color: #fff;
+      padding: 12px 15px;
+      &-item {
+        color: #333333;
+        font-size: 15px;
+        margin-bottom: 10px;
+        display: flex;
+        .left {
+          width: 45px;
+        }
+        .right {
+          display: flex;
+          flex-wrap: wrap;
+          &-img {
+            width: 80px;
+            height: 80px;
+            margin-right: 10px;
+            margin-bottom: 10px;
+          }
+        }
+      }
+    }
+  }
+	.empty {
 		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: 20px;
-				margin-bottom: 11px;
-				width: calc(50% - 12px);
-				&:nth-child(2n) {
-					margin-right: 0;
-				}
-				image {
-					width: 100%;
-					height: 30vw;
-				}
-			}
-		}
+		padding: 30px;
 	}
-}
+}

pages/patrolManagement/deviceAbnormalRecords/recordsDetails/recordsDetails.vue

@@ -1,96 +1,155 @@
 <template>
-	<view class="details">
-		<!-- <u-loading-page :loading="loading"></u-loading-page> -->
-		<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">
-					<image :src="img" mode="aspectFit" @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>
+  <view class="details">
+    <view class="details-item">
+      <view class="details-item-title">
+        <view class="details-item-title-text">异常信息</view>
+      </view>
+      <view class="details-item-content">
+        <template v-if="Number(type) === 3">
+					<view class="details-item-content-item">停车场：{{ detailsInfo.roadName || '-' }}</view>
+				</template>
+        <template v-else>
+          <view class="details-item-content-item">路段：{{ detailsInfo.roadName || '-' }}</view>
+          <view class="details-item-content-item">泊位号：{{ detailsInfo.spaceNo || '-' }}</view>
+        </template>
+        <view class="details-item-content-item">问题描述：{{ detailsInfo.exceprionDes || '-' }}</view>
+        <view class="details-item-content-item">
+          <view class="left">图片：</view>
+          <view class="right" v-if="detailsInfo.imgList && detailsInfo.imgList.length">
+            <u--image
+              class="right-img"
+              v-for="(item, index) in detailsInfo.imgList"
+              :key="index"
+              :showLoading="true"
+              :src="item"
+              width="80px"
+              height="80px"
+              @click="previewImgae(detailsInfo.imgList, index)"
+            >
+              <view slot="error" style="font-size: 24rpx">加载失败</view>
+            </u--image>
+          </view>
+          <view v-else>暂无</view>
+        </view>
+      </view>
+    </view>
+    <view class="details-item">
+      <view class="details-item-title">
+        <view class="details-item-title-text">处理信息</view>
+      </view>
+      <view class="details-item-content">
+        <view class="details-item-content-item">处理状态：{{ detailsInfo.isProcess | filtersStatus }}</view>
+        <view class="details-item-content-item">处理设备：{{ detailsInfo.processDeviceName || '-' }}</view>
+        <view class="details-item-content-item">损坏方式：{{ detailsInfo.damageTypeName || '-' }}</view>
+        <view class="details-item-content-item">处理方式：{{ detailsInfo.processTypeName || '-' }}</view>
+        <view class="details-item-content-item">处理员：{{ detailsInfo.processBy || '-' }}</view>
+        <view class="details-item-content-item">上报时间：{{ detailsInfo.updateTime || '-' }}</view>
+        <view class="details-item-content-item">上报人：{{ detailsInfo.createBy || '-' }}</view>
+      </view>
+    </view>
+    <view class="details-item">
+      <view class="details-item-title">
+        <view class="details-item-title-text">评价信息</view>
+      </view>
+      <view class="details-item-content" v-if="detailsInfo.evaluateList && detailsInfo.evaluateList.length">
+        <view class="details-item-content-item" v-for="(item, index) in detailsInfo.evaluateList" :key="index">
+          {{ item.evaluateDes }} ------- {{ item.createBy }}
+        </view>
+      </view>
+      <view class="empty" v-else>
+        <u-empty mode="comment" icon="http://cdn.uviewui.com/uview/empty/comment.png" text="暂无评价" iconSize="40" width="120px" height="120px" />
+      </view>
+    </view>
+  </view>
 </template>
 
 <script>
-	export default {
-		data() {
-			return {
-				id: undefined,
-				detailsInfo: {},
-				loading: false
-			}
-		},
-		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);
-						}
-					}
-					this.loading = false
-				}).catch(e => {
-					this.loading = false
-				})
-			},
-			/**
-			 * 设置消息已读
-			 * @param { String } id
-			 */
-			updateDeviceAbnormalInfo(id) {
-				uni.$u.api.deviceAbnormalApi.updateDeviceAbnormalInfoApi({
-					id
-				}).then(res => {
-					console.log('已读:', id)
-				})
-			},
-			/**
-			 * 预览图片
-			 * @param { Array } list
-			 * @param { Number } current
-			 */
-			previewImage(list, current = 0) {
-				uni.previewImage({
-					urls: list,
-					current
-				});
-			}
-		}
-	}
+export default {
+  data() {
+    return {
+      id: undefined,
+      detailsInfo: {},
+      loading: false,
+      type: 1
+    };
+  },
+  onLoad(page) {
+    this.id = page.id;
+    this.type = page?.type ?? 1;
+  },
+  onShow() {
+    if (this.id) {
+      this.getDetails(this.id);
+    }
+  },
+  methods: {
+    getDetails(id) {
+      uni.$u.api.deviceAbnormalApi
+        .getDeviceAbnormalDetailsApi({
+          id
+        })
+        .then((res) => {
+          if (res.code === 200) {
+            this.detailsInfo = res.data;
+          }
+        })
+    },
+    /**
+     * 设置消息已读
+     * @param { String } id
+     */
+    updateDeviceAbnormalInfo(id) {
+      uni.$u.api.deviceAbnormalApi
+        .updateDeviceAbnormalInfoApi({
+          id
+        })
+        .then((res) => {
+          console.log('已读:', id);
+        });
+    },
+    /**
+     * 预览图片
+     * @date 2022-08-23
+     * @param {any} imgList
+     * @param {any} index
+     * @returns {any}
+     */
+    previewImgae(imgList, index) {
+      uni.previewImage({
+        current: index,
+        urls: imgList
+      });
+    }
+  },
+  filters: {
+    filtersStatus(val) {
+      let label = '-';
+      if (val || val === 0) {
+        switch (Number(val)) {
+          case 0:
+            label = '未处理';
+            break;
+          case 1:
+            label = '已处理';
+            break;
+          case 2:
+            label = '部分处理';
+            break;
+        }
+      }
+      return label;
+    }
+  }
+};
 </script>
 
 <style lang="scss">
-	page {
-		min-height: calc(100vh - 44px);
-		background-color: #1767F2;
-	}
+page {
+  min-height: calc(100vh - 44px);
+  background-color: #f6f6f6;
+}
 </style>
 
 <style lang="scss" scoped>
-	@import './recordsDetails.scss';
+@import './recordsDetails.scss';
 </style>

pages/patrolManagement/emergencyDisposalRecords/emergencyDisposalRecords.scss

@@ -24,7 +24,7 @@
             text-overflow: ellipsis;
             word-break: break-all;
             text {
-              font-size: 18px;
+              font-size: 16px;
               color: #171717;
             }
           }