小程序查看巡检记录

weapp/package/polling/inspectionRecordDetail/inspectionRecordDetail.js

@@ -6,20 +6,26 @@ Page({
    */
   data: {
     dataList: '',
-    imgUrl: getApp().globalData.imgUrl
+    imgUrl: getApp().globalData.imgUrl,
+    activeValues: []
+  },
+
+  handleChange(e) {
+    this.setData({
+      activeValues: e.detail.value,
+    });
   },
 
   // 预览图片
   previewImg: function (e) {
-    //获取当前图片的下标
+    // 获取当前图片的下标
-    var index = e.currentTarget.dataset.index;
+    const index = e.currentTarget.dataset.index;
-    //所有图片
+    // 所有图片
-    var imgs = this.data.dataList.imgs;
+    const imgs = this.data.dataList.points.inspectContent[e.currentTarget.dataset.key].imgs;
+    const newImgs = imgs.map(i => this.data.imgUrl + i);
     wx.previewImage({
-      //当前显示图片
+      current: newImgs[index],
-      current: imgs[index],
+      urls: newImgs
-      //所有图片
-      urls: imgs
     })
   },
 
@@ -27,22 +33,9 @@ Page({
    * 生命周期函数--监听页面加载
    */
   onLoad(options) {
-    let that = this;
+    const that = this;
-    let data = JSON.parse(decodeURIComponent(options.data))
+    const data = JSON.parse(decodeURIComponent(options.data))
-    if (data.points.imgs != undefined) {
+    that.setData({ dataList: data })
-      let newArr = data.points.imgs.map(e => {
-        e = that.data.imgUrl + e;
-        return e;
-      })
-      that.setData({
-        dataList: { ...data, imgs: newArr }
-      })
-    } else {
-      that.setData({
-        dataList: data
-      })
-    }
-
   },
 
   /**

weapp/package/polling/inspectionRecordDetail/inspectionRecordDetail.json

@@ -2,5 +2,9 @@
   "navigationBarBackgroundColor": "#1979ff",
   "navigationBarTextStyle": "white",
   "navigationBarTitleText": "巡检记录详情",
-  "enablePullDownRefresh": false
+  "enablePullDownRefresh": false,
+  "usingComponents": {
+    "t-collapse": "tdesign-miniprogram/collapse/collapse",
+    "t-collapse-panel": "tdesign-miniprogram/collapse-panel/collapse-panel"
+  }
 }

weapp/package/polling/inspectionRecordDetail/inspectionRecordDetail.wxml

@@ -1,77 +1,61 @@
-<!--package/inspectionRecord/inspectionRecordDetail/inspectionRecordDetail.wxml-->
+<!-- package/inspectionRecord/inspectionRecordDetail/inspectionRecordDetail.wxml -->
 <view class="page">
   <view class='list'>
     <view class='content'>
       <view class='title'>结构物名称：</view>
-      <view class='value'>
+      <view class='value'>{{dataList.points.project.name}}</view>
-        {{dataList.points.project.name}}
-      </view>
     </view>
     <view class='content'>
       <view class='title'>巡检人：</view>
-      <view class='value'>
+      <view class='value'>{{dataList.points.user.name}}</view>
-        {{dataList.points.user.name}}
-      </view>
     </view>
     <view class='content'>
       <view class='title'>巡检单位：</view>
-      <view class='value'>
+      <view class='value'>{{dataList.points.user.department.name}}</view>
-        {{dataList.points.user.department.name}}
-      </view>
     </view>
     <view class='content'>
       <view class='title'>巡检频次：</view>
-      <view class='value'>
+      <view class='value'>{{dataList.points.frequency}}</view>
-        {{dataList.points.frequency}}
-      </view>
     </view>
     <view class='content'>
       <view class='title'>上次巡检日期：</view>
-      <view class='value'>
+      <view class='value'>{{dataList.lastInspectionTime}}</view>
-        {{dataList.lastInspectionTime}}
-      </view>
     </view>
     <view class='content'>
       <view class='title'>本次巡检日期：</view>
-      <view class='value'>
+      <view class='value'>{{dataList.inspectionTime}}</view>
-        {{dataList.inspectionTime}}
-      </view>
     </view>
     <view class='content'>
       <view class='title'>巡检结果：</view>
-      <view class='value'>
+      <view class='value'>{{dataList.alarm ? '异常' : '正常'}}</view>
-        {{dataList.alarm ? '异常' : '正常'}}
-      </view>
     </view>
     <view class='content'>
       <view class='title'>当前点位：</view>
-      <view class='value'>
+      <view class='value'>{{dataList.points.itemData.name}}</view>
-        {{dataList.points.itemData.name}}
-      </view>
     </view>
     <view class='content'>
       <view class='title'>当前位置：</view>
-      <view class='value'>
+      <view class='value'>{{dataList.points.address}}</view>
-        {{dataList.points.address}}
-      </view>
     </view>
+    <t-collapse value="{{activeValues}}" bind:change="handleChange">
+      <view wx:for="{{dataList.points.inspectContent}}" wx:key="key" wx:for-index="key" wx:for-item="value">
+        <t-collapse-panel header="{{key + '： ' + (value.isNormal ? '正常' : '异常')}}" value="{{key}}" expandIcon disabled="{{value.isNormal}}">
           <view class='content'>
-      <view class='title'>巡检详情：</view>
+            <view class='title'>描述：</view>
-      <view class='value'>
+            <view class='value'>{{value.msgInp || '--'}}</view>
-        {{dataList.points.msgInp || '--'}}
-      </view>
           </view>
           <view class='content'>
             <view class='title'>异常等级：</view>
-      <view class='value'>
+            <view class='value'>{{value.level || '--'}}</view>
-        {{dataList.points.changeThree || '--'}}
-      </view>
           </view>
-
+          <view class='title'>巡检图片：</view>
           <view class="img-v weui-uploader__bd" style="overflow:hidden;">
-      <view class='pic' wx:for="{{dataList.imgs}}" wx:for-item="item" wx:key="*this">
+            <view class='pic' wx:for="{{value.imgs}}" wx:for-item="item" wx:key="*this">
-        <image class='weui-uploader__img showImg' src="{{item}}" data-index="{{index}}" mode="aspectFill" bindtap="previewImg"></image>
+              <image class='weui-uploader__img showImg' src="{{imgUrl + item}}" data-img="{{imgUrl + item}}" data-key="{{key}}" mode="aspectFill" bindtap="previewImg"></image>
+            </view>
           </view>
+        </t-collapse-panel>
       </view>
+    </t-collapse>
   </view>
 </view>

weapp/package/polling/inspectionRecordDetail/inspectionRecordDetail.wxss

@@ -41,10 +41,18 @@ page {
   box-shadow: 0rpx 0rpx 16rpx #ccc;
 }
 
+.item-key {
+  margin-right: 30rpx;
+}
+
+.abnormal-ctx {
+  padding-left: 20rpx;
+}
+
 .content {
   width: 100%;
   overflow: hidden;
-  margin: 30rpx auto;
+  margin-bottom: 30rpx;
 }
 
 .title {