巡检报告UI

2 years ago · b84e1cf9ea
5 changed files with 121 additions and 52 deletions
--- a/weapp/images/word.svg
+++ b/weapp/images/word.svg
@ -1 +1,42 @@
-<?xml version="1.0" standalone="no"?><!DOCTYPE svg PUBLIC "-//W3C//DTD SVG 1.1//EN" "http://www.w3.org/Graphics/SVG/1.1/DTD/svg11.dtd"><svg t="1677747046135" class="icon" viewBox="0 0 1024 1024" version="1.1" xmlns="http://www.w3.org/2000/svg" p-id="2531" xmlns:xlink="http://www.w3.org/1999/xlink" width="200" height="200"><path d="M616.746667 85.333333L896 347.904V853.333333a85.333333 85.333333 0 0 1-85.333333 85.333334H213.333333a85.333333 85.333333 0 0 1-85.333333-85.333334V170.666667a85.333333 85.333333 0 0 1 85.333333-85.333334h403.413334z m244.352 295.381334L581.802667 118.186667v177.237333a85.333333 85.333333 0 0 0 85.333333 85.333333h193.962667z m-107.264 76.373333h-49.152l-79.488 227.157333-109.354667-227.114666h-13.226667l-110.506666 226.688-77.824-226.688H265.130667l113.749333 328.192h13.226667l117.12-239.36 114.858666 239.36h13.781334l115.968-328.192z" fill="#0F90E3" p-id="2532"></path></svg>
+<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 34 34" class="design-iconfont">
+  <defs>
+    <linearGradient x1="50%" y1="0%" x2="50%" y2="100%" id="d1kuej8y0__xps4xewpya">
+      <stop stop-color="#4A86FE" offset="0%"/>
+      <stop stop-color="#4C87FF" offset="100%"/>
+    </linearGradient>
+    <linearGradient x1="72.4703275%" y1="64.21875%" x2="72.4703275%" y2="0%" id="d1kuej8y0__ueh4pkefrb">
+      <stop stop-color="#3E7DFB" offset="0%"/>
+      <stop stop-color="#3E7EFE" offset="100%"/>
+    </linearGradient>
+    <linearGradient x1="68.0814303%" y1="0%" x2="68.0814303%" y2="64.2089844%" id="d1kuej8y0__2pntdsugbc">
+      <stop stop-color="#2289FF" offset="0%"/>
+      <stop stop-color="#1B65FA" offset="100%"/>
+      <stop stop-color="#1B65FA" offset="100%"/>
+    </linearGradient>
+    <linearGradient x1="56.4650316%" y1="0%" x2="56.4650316%" y2="95.8170573%" id="d1kuej8y0__5vp8mk2e0d">
+      <stop stop-color="#087BFF" offset="0%"/>
+      <stop stop-color="#046CE4" offset="100%"/>
+    </linearGradient>
+    <linearGradient x1="68.1731171%" y1="11.3486842%" x2="44.1411133%" y2="59.1248629%" id="d1kuej8y0__0uzm58816e">
+      <stop stop-color="#184890" offset="0%"/>
+      <stop stop-color="#3F5F96" offset="100%"/>
+    </linearGradient>
+    <linearGradient x1="46.6625977%" y1="13.8037109%" x2="43.5351562%" y2="95.4663086%" id="d1kuej8y0__g4kqpu1khf">
+      <stop stop-color="#046CE4" offset="0%"/>
+      <stop stop-color="#4C87FF" offset="100%"/>
+    </linearGradient>
+    <linearGradient x1="50%" y1="0%" x2="50%" y2="100%" id="d1kuej8y0__mxs6mzwptg">
+      <stop stop-color="#FFF" offset="0%"/>
+      <stop stop-color="#FFF" offset="100%"/>
+    </linearGradient>
+  </defs>
+  <g fill-rule="nonzero" fill="none">
+    <path d="M34,10.25 L34,3.37499998 C34,2.54999998 33.4222222,2 32.5555555,2 L9.44444446,2 C8.57777779,2 8,2.55000001 8,3.37499998 L8,10.25 L21,13 L34,10.25 Z" fill="url(#d1kuej8y0__xps4xewpya)"/>
+    <path fill="url(#d1kuej8y0__ueh4pkefrb)" d="M34 10L8 10 8 17.1428571 21.7222222 20 34 17.1428571z"/>
+    <path fill="url(#d1kuej8y0__2pntdsugbc)" d="M34 17L8 17 8 23.9230769 21 26 34 23.9230769z"/>
+    <path d="M34,24 L8,24 L8,31.5 C8,32.4 8.57777779,33 9.44444446,33 L32.5555555,33 C33.4222222,33 34,32.4 34,31.5 L34,24 Z" fill="url(#d1kuej8y0__5vp8mk2e0d)"/>
+    <path d="M19.2666667,8 L8,8 L8,28 L18.9777778,28 C19.9888889,28 21,27 21,26 L21,9.71428572 C21,8.7142857 20.2777778,8 19.2666667,8 Z" fill="url(#d1kuej8y0__0uzm58816e)" opacity=".5"/>
+    <path d="M1.71428572,27 C0.714285704,27 0,26.2857143 0,25.2857143 L0,8.71428571 C0,7.71428574 0.714285704,7 1.71428572,7 L18.4285714,7 C19.2857143,7 20,7.7142857 20,8.71428571 L20,25.4285714 C20,26.2857143 19.2857143,27 18.2857143,27 L1.71428572,27 Z" fill="url(#d1kuej8y0__g4kqpu1khf)"/>
+    <path fill="url(#d1kuej8y0__mxs6mzwptg)" d="M14.6666667 23L12.4791667 23 10 15.4375 7.52083331 23 5.33333331 23 3 12 5.04166666 12 6.64583331 19.7 9.125 12.275 10.875 12.275 13.2083333 19.7 14.9583333 12 17 12 14.6666667 23z"/>
+  </g>
+</svg>
--- a/weapp/package/inspectionReport/inspectionReport.js
+++ b/weapp/package/inspectionReport/inspectionReport.js
@ -11,9 +11,7 @@ Page({
  data: {
    structures: [], // 结构物
    struLoading: false,
-    struVisible: false,
-    dateVisible: false,
-    curStru: 0, // 选中结构物index
+    curStruId: 'all', // 选中结构物id
    startTime: new Date().getTime(),
    endTime: new Date().getTime(),
    formatStartTime: moment(new Date().getTime()).format('YYYY-MM-DD'),
@ -21,23 +19,15 @@ Page({
    report: [], // 巡检报告
  },

-  showPopup(e) {
-    const { item } = e.currentTarget.dataset;
-    this.setData({ [`${item}Visible`]: true });
-  },
-
  onClose(e) {
-    const { item } = e.currentTarget.dataset;
-    this.setData({ [`${item}Visible`]: false });
    // 获取报告
    this.getPatrolReport();
  },

  onStruChange(e) {
    if (e.detail) {
-      const { index } = e.detail;
      this.setData({
-        curStru: index
+        curStruId: e.detail
      })
    }
  },
@ -77,9 +67,9 @@ Page({
  },

  getPatrolReport() {
-    const { structures, curStru, formatStartTime, formatEndTime } = this.data;
+    const { curStruId, formatStartTime, formatEndTime } = this.data;
    const params = {
-      projectId: structures[curStru].id,
+      projectId: curStruId === 'all' ? '' : curStruId,
      startTime: formatStartTime + ' 00:00:00',
      endTime: formatEndTime + ' 23:59:59',
    }
@ -89,7 +79,7 @@ Page({
      this.setData({
        report: res.rows.map(r => {
          const fileName = r.excelPath.substring(r.excelPath.lastIndexOf('/') + 1);
-          return { ...r, fileName }
+          return { ...r, fileName, inspectTm: moment(r.inspectTm).format('YYYY-MM-DD HH:mm:ss') }
        })
      })
    })
@ -101,8 +91,8 @@ Page({
      this.setData({
        struLoading: false,
        structures: [
-          { name: '全部', id: '' },
-          ...res.rows.map(s => ({ name: s.name, id: s.id }))
+          { text: '全部', value: 'all' },
+          ...res.rows.map(s => ({ text: s.name, value: s.id }))
        ]
      }, () => { this.getPatrolReport(); })
    })
--- a/weapp/package/inspectionReport/inspectionReport.json
+++ b/weapp/package/inspectionReport/inspectionReport.json
@ -10,6 +10,8 @@
    "van-datetime-picker": "@vant/weapp/datetime-picker/index",
    "van-button": "@vant/weapp/button/index",
    "van-divider": "@vant/weapp/divider/index",
-    "van-empty": "@vant/weapp/empty/index"
+    "van-empty": "@vant/weapp/empty/index",
+    "van-dropdown-menu": "@vant/weapp/dropdown-menu/index",
+    "van-dropdown-item": "@vant/weapp/dropdown-item/index"
  }
 }
--- a/weapp/package/inspectionReport/inspectionReport.wxml
+++ b/weapp/package/inspectionReport/inspectionReport.wxml
@ -1,26 +1,25 @@
 <!-- package/inspectionReport/inspectionReport.wxml -->
-<view>
-  <van-cell-group>
-    <van-cell title="结构物" value="{{structures[curStru].name}}" is-link arrow-direction="down" data-item="stru" bind:click="showPopup" />
-    <van-popup show="{{ struVisible }}" data-item="stru" bind:close="onClose" round position="bottom" custom-style="height: 40%">
-      <van-picker columns="{{ structures }}" value-key="name" bind:change="onStruChange" default-index="{{ curStru }}" loading="{{struLoading}}" />
-    </van-popup>
-    <van-cell title="时间" title-width="80rpx" value="{{formatStartTime + ' - ' + formatEndTime}}" is-link arrow-direction="down" data-item="date" bind:click="showPopup" />
-    <van-popup show="{{ dateVisible }}" data-item="date" bind:close="onClose" round position="bottom" custom-style="height: 40%">
-      <view style="max-height:100%; display:flex" class="time-option">
-        <van-datetime-picker type="datetime" show-toolbar="{{false}}" type="date" value="{{ startTime }}" bind:input="onStartTimeChange" />
-        <view style="display:flex; align-items:center">至</view>
-        <van-datetime-picker type="datetime" show-toolbar="{{false}}" type="date" value="{{ endTime }}" bind:input="onEndTimeChange" />
+<view class="page">
+  <van-dropdown-menu>
+    <van-dropdown-item title="{{ '时间' }}" bind:close="onClose">
+      <view style="max-height:60%; display:flex" class="time-option">
+        <van-datetime-picker show-toolbar="{{false}}" type="date" value="{{ startTime }}" bind:input="onStartTimeChange" min-date="{{1640966400000}}"/>
+          <view style="display:flex; align-items:center">至</view>
+        <van-datetime-picker show-toolbar="{{false}}" type="date" value="{{ endTime }}" bind:input="onEndTimeChange" min-date="{{1640966400000}}"/>
      </view>
-    </van-popup>
-  </van-cell-group>
+    </van-dropdown-item>
+    <van-dropdown-item title="{{ '结构物' }}" bind:close="onClose" bind:change="onStruChange" value="{{ curStruId }}" options="{{ structures }}" />
+  </van-dropdown-menu>
  <view wx:if="{{report.length}}">
-    <view class="file-box" wx:for="{{report}}">
+    <view class="file-box" wx:for="{{report}}" wx:key="id" data-url="{{item.excelPath}}" bindtap="download">
      <view class="file">
        <image class="logo" src="/images/word.svg"></image>
-        <view>{{item.fileName}}</view>
+        <view class="text">
+          <view class="name">{{item.fileName}}</view>
+          <view class="time">{{item.inspectTm}}</view>
+        </view>
      </view>
-      <van-button type="primary" size="small" color="#169bd5" data-url="{{item.excelPath}}" bind:click="download">打开</van-button>
+      <image class="arrow" src="/images/right.svg"></image>
    </view>
  </view>
  <view wx:else>
--- a/weapp/package/inspectionReport/inspectionReport.wxss
+++ b/weapp/package/inspectionReport/inspectionReport.wxss
@ -1,31 +1,68 @@
 /* package/inspectionReport/inspectionReport.wxss */
+.page {
+  min-height: 100vh;
+  background: #F7F7FA;
+  position: relative;
+  --dropdown-menu-background-color: #fff;
+  --dropdown-menu-box-shadow: 0 2px 12px fade(#646566, 12);
+}
+
 .time-option {
-    display: flex;
-    justify-content: space-evenly;
+  display: flex;
+  justify-content: space-evenly;
 }

 .time-option .van-picker {
-    width: 45vw;
+  width: 45vw;
 }

 .file-box {
-    width: 94%;
-    height: 100rpx;
-    padding: 0 20rpx;
-    display: flex;
-    justify-content: space-between;
-    align-items: center;
-    border-bottom: 1px solid rgb(240, 239, 239);
+  width: auto;
+  height: 85px;
+  background: #FFFFFF;
+  border-radius: 8px;
+  margin: 16px;
+  display: flex;
+  justify-content: space-between;
+  align-items: center;
 }

 .file-box .file .logo {
-    width: 80rpx;
-    height: 80rpx;
-    float: left;
-    margin-right: 20rpx;
+  width: 34px;
+  height: 34px;
+  float: left;
+  margin-left: 13px;
+  margin-right: 20px;
+}
+
+.file-box .file .text {
+  height: 60px;
+  display: flex;
+  flex-direction: column;
+  justify-content: space-evenly;
+}
+
+.file-box .file .name {
+  font-weight: 600;
+  font-size: 17px;
+  color: #414141;
+}
+
+.file-box .file .time {
+  font-weight: 400;
+  font-size: 12px;
+  color: #414141a6;
+  letter-spacing: 0.09px;
+}
+
+.file-box .arrow {
+  width: 15px;
+  height: 15px;
+  float: right;
+  margin-right: 11px;
 }

 .file-box .file {
-    display: flex;
-    align-items: center;
+  display: flex;
+  align-items: center;
 }