Browse Source

feat:故障风险日历数据接入

master
liujiangyong 2 years ago
parent
commit
982bd3da71
  1. 87
      weapp/package/riskManagement/riskCalendar/riskCalendar.js
  2. 22
      weapp/package/riskManagement/riskCalendar/riskCalendar.wxml
  3. 1
      weapp/package/riskManagement/riskCalendar/riskCalendar.wxss
  4. 7
      weapp/package/riskManagement/riskManagement.js
  5. 2
      weapp/package/riskManagement/riskManagement.wxml

87
weapp/package/riskManagement/riskCalendar/riskCalendar.js

@ -1,14 +1,28 @@
// package/riskManagement/riskCalendar/riskCalendar.js // package/riskManagement/riskCalendar/riskCalendar.js
Page({ import { getPatrolRecord } from "../../../utils/getApiUrl";
import { Request } from "../../../common";
import moment from '../../../utils/moment';
Page({
/** /**
* 页面的初始数据 * 页面的初始数据
*/ */
data: { data: {
show: false, show: false,
level: ['轻微', '中度', '严重'], level: ['全部', '轻微', '中度', '严重'],
curLevel: '轻微', curLevel: '全部',
todayAlarm: [1, 2, 3], minDate: moment().startOf('day').subtract(6, 'days').valueOf(),
maxDate: moment().endOf('day').valueOf(),
curDate: moment().format('YYYY-MM-DD'),
showList: [],
formatter(day) { return day; },
},
dayData: [], // 每天的异常数据
onDateSelect(e) {
this.setData({ curDate: moment(e.detail).format('YYYY-MM-DD') })
this.calcShowList(this.data.curLevel, moment(e.detail).format('YYYY-MM-DD'))
}, },
showPopup() { showPopup() {
@ -19,13 +33,76 @@ Page({
}, },
onConfirm(e) { onConfirm(e) {
this.setData({ curLevel: e.detail.value, show: false }) this.setData({ curLevel: e.detail.value, show: false })
this.calcShowList(e.detail.value, this.data.curDate)
},
calcShowList(level = this.data.curLevel, date = this.data.curDate) {
const { dayData } = this;
let nextShowList = []
for (const day of dayData) {
if (day.formatDate === date) {
nextShowList = day.data;
}
}
if (level !== '全部') {
nextShowList = nextShowList.filter(l => l.level === level)
}
this.setData({ showList: nextShowList })
},
// 查看详情
toDetail(e) {
let data = JSON.stringify(e.currentTarget.dataset.item);
wx.navigateTo({
url: '/package/polling/inspectionRecordDetail/inspectionRecordDetail?data=' + encodeURIComponent(data),
})
}, },
/** /**
* 生命周期函数--监听页面加载 * 生命周期函数--监听页面加载
*/ */
onLoad(options) { onLoad(options) {
const { minDate, maxDate } = this.data;
Request.get(getPatrolRecord('all', moment(minDate).format('YYYY-MM-DD HH:mm:ss'), moment(maxDate).format('YYYY-MM-DD HH:mm:ss'), true, 'null')).then(res => {
let dayData = new Array(7)
for (let i = 6; i >= 0; i--) {
const month = moment().subtract(i, 'day').month();
const date = moment().subtract(i, 'day').date();
let data = [];
res.forEach(d => {
if (moment(d.inspectionTime).date() === date) {
// 计算此记录的异常等级(检查项中异常最高等级),用于列表展示
let tempLevel = '轻微';
for (const device of d.points.inspectContent) {
if (device.alarm === true) {
for (const item of device.checkItems) {
if (item.level) { tempLevel = item.level; }
}
}
}
data.push({
...d, level: tempLevel,
inspectionTime: moment(d.inspectionTime).format('YYYY-MM-DD HH:mm:ss'),
lastInspectionTime: d.lastInspectionTime ? moment(d.lastInspectionTime).format('YYYY-MM-DD HH:mm:ss') : '--',
})
}
})
dayData[6 - i] = { month, date, formatDate: moment().subtract(i, 'day').format('YYYY-MM-DD'), data }
}
const formatter = (day) => {
const month = day.date.getMonth();
const date = day.date.getDate();
dayData.forEach(d => {
if (d.month === month && d.date === date && d.data.length) {
day.bottomInfo = '🔸'
}
})
return day;
}
this.setData({ formatter });
this.dayData = dayData;
this.calcShowList();
})
}, },
/** /**

22
weapp/package/riskManagement/riskCalendar/riskCalendar.wxml

@ -6,7 +6,7 @@
<image class="card-icon" src="/images/calendar_icon.png" /> <image class="card-icon" src="/images/calendar_icon.png" />
<view class="title">巡检日历</view> <view class="title">巡检日历</view>
</view> </view>
<view class="card-right">{{'2023-10-20'}}</view> <view class="card-right">{{curDate}}</view>
<image src="/images/calendar_card_bg.png" class="card-bg" /> <image src="/images/calendar_card_bg.png" class="card-bg" />
</view> </view>
<view class="calendar-box"> <view class="calendar-box">
@ -16,6 +16,10 @@
show-subtitle="{{ false }}" show-subtitle="{{ false }}"
poppable="{{ false }}" poppable="{{ false }}"
show-confirm="{{ false }}" show-confirm="{{ false }}"
min-date="{{ minDate }}"
max-date="{{ maxDate }}"
formatter="{{ formatter }}"
bind:select="onDateSelect"
row-height="48" row-height="48"
color="#1684FF" color="#1684FF"
class="calendar" class="calendar"
@ -30,7 +34,7 @@
<image class="arrow" src="/images/arrow_right_blue.svg" /> <image class="arrow" src="/images/arrow_right_blue.svg" />
</view> </view>
</view> </view>
<van-popup show="{{ show }}" round position="bottom" bind:click-overlay="onCancel"> <van-popup show="{{ show }}" round position="bottom" close-on-click-overlay="{{false}}">
<van-picker <van-picker
show-toolbar show-toolbar
columns="{{ level }}" columns="{{ level }}"
@ -39,27 +43,27 @@
/> />
</van-popup> </van-popup>
<view wx:for="{{todayAlarm}}" class="card" style="margin-bottom: 10px"> <view wx:for="{{showList}}" class="card" style="margin-bottom: 10px">
<view class="card-top flex flex-between"> <view class="card-top flex flex-between">
<view class="card-left flex"> <view class="card-left flex">
<image class="card-icon" src="/images/right_icon.png" /> <image class="card-icon" src="/images/right_icon.png" />
<view class="title">结构物A</view> <view class="title">{{item.points.project.name}}</view>
</view> </view>
<view class="card-right-btn flex">查看详情</view> <view class="card-right-btn flex" data-item="{{item}}" bindtap="toDetail">查看详情</view>
<image src="/images/right_card_bg.png" class="card-bg" /> <image src="/images/right_card_bg.png" class="card-bg" />
</view> </view>
<view class="card-content"> <view class="card-content">
<view class="row flex flex-between"> <view class="row flex flex-between">
<view class="content-left">本次巡检日期</view> <view class="content-left">本次巡检日期</view>
<view class="content-right">2020/12/21 17:00:00</view> <view class="content-right">{{item.inspectionTime}}</view>
</view> </view>
<view class="row flex flex-between"> <view class="row flex flex-between">
<view class="content-left">点位</view> <view class="content-left">点位</view>
<view class="content-right">点位A</view> <view class="content-right">{{item.points.itemData.name}}</view>
</view> </view>
<view class="row flex flex-between"> <view class="row flex flex-between">
<view class="content-left">巡检人</view> <view class="content-left">巡检人</view>
<view class="content-right">离成功</view> <view class="content-right">{{item.points.user.name}}</view>
</view> </view>
<view class="row flex flex-between"> <view class="row flex flex-between">
<view class="content-left">巡检结果</view> <view class="content-left">巡检结果</view>
@ -67,7 +71,7 @@
</view> </view>
<view class="row flex flex-between"> <view class="row flex flex-between">
<view class="content-left">异常等级</view> <view class="content-left">异常等级</view>
<view class="content-right" style="color: red;">轻微</view> <view class="content-right" style="color: red;">{{item.level}}</view>
</view> </view>
</view> </view>
</view> </view>

1
weapp/package/riskManagement/riskCalendar/riskCalendar.wxss

@ -47,6 +47,7 @@
border-radius: 16px; border-radius: 16px;
color: #fff; color: #fff;
font-size: 13px; font-size: 13px;
z-index: 99;
} }
.card-icon { .card-icon {

7
weapp/package/riskManagement/riskManagement.js

@ -28,7 +28,12 @@ function setOption(chart, data) {
}, },
}, },
yAxis: { yAxis: {
type: 'value' type: 'value',
splitLine: { // 网格线
lineStyle: {
type: 'dashed'
},
}
}, },
series: [ series: [
{ {

2
weapp/package/riskManagement/riskManagement.wxml

@ -2,7 +2,7 @@
<view class="risk-management"> <view class="risk-management">
<image src="/images/right_bg.png" class="page-bg" /> <image src="/images/right_bg.png" class="page-bg" />
<view class="icon"><text class="icon-text">故障统计</text></view> <view class="icon flex"><text class="icon-text">故障统计</text></view>
<view class="flex flex-between"> <view class="flex flex-between">
<view class="title-item flex flex-col"> <view class="title-item flex flex-col">

Loading…
Cancel
Save