peng.peng
1 year ago
51 changed files with 2368 additions and 181 deletions
After Width: | Height: | Size: 1.1 KiB |
After Width: | Height: | Size: 1.3 KiB |
Binary file not shown.
After Width: | Height: | Size: 1.2 KiB |
After Width: | Height: | Size: 1.6 KiB |
After Width: | Height: | Size: 808 B |
After Width: | Height: | Size: 1.6 KiB |
@ -0,0 +1,168 @@ |
|||||
|
// package/riskManagement/riskCalendar/riskCalendar.js
|
||||
|
import * as echarts from '../components/ec-canvas/echarts'; |
||||
|
|
||||
|
Page({ |
||||
|
initECharts(option) { |
||||
|
this.ecComponent.init((canvas, width, height, dpr) => { |
||||
|
const chart = echarts.init(canvas, null, { |
||||
|
width: width, |
||||
|
height: height, |
||||
|
devicePixelRatio: dpr, |
||||
|
}); |
||||
|
chart.setOption(option); |
||||
|
this.chart = chart; |
||||
|
return chart; |
||||
|
}); |
||||
|
}, |
||||
|
initDeviceECharts(option) { |
||||
|
this.ecDeviceComponent.init((canvas, width, height, dpr) => { |
||||
|
const chart = echarts.init(canvas, null, { |
||||
|
width: width, |
||||
|
height: height, |
||||
|
devicePixelRatio: dpr, |
||||
|
}); |
||||
|
chart.setOption(option); |
||||
|
this.chart = chart; |
||||
|
return chart; |
||||
|
}); |
||||
|
}, |
||||
|
/** |
||||
|
* 页面的初始数据 |
||||
|
*/ |
||||
|
data: { |
||||
|
ec:{} |
||||
|
}, |
||||
|
navigator(e) { |
||||
|
wx.navigateTo({ |
||||
|
url: '/package/deviceBigdataGraph/statusDetail/statusDetail', |
||||
|
}) |
||||
|
console.log('xxxxxx',e) |
||||
|
}, |
||||
|
/** |
||||
|
* 生命周期函数--监听页面加载 |
||||
|
*/ |
||||
|
onLoad(options) { |
||||
|
const that = this |
||||
|
that.ecComponent = that.selectComponent('#mychart-dom-pie'); |
||||
|
that.ecDeviceComponent=that.selectComponent('#mychart-device-pie'); |
||||
|
var option = { |
||||
|
backgroundColor: "#ffffff", |
||||
|
legend: { |
||||
|
bottom: 10, |
||||
|
left: 'center', |
||||
|
}, |
||||
|
series: [{ |
||||
|
label: { |
||||
|
normal: { |
||||
|
fontSize: 14 |
||||
|
} |
||||
|
}, |
||||
|
type: 'pie', |
||||
|
center: ['50%', '50%'], |
||||
|
radius: ['20%', '40%'], |
||||
|
data: [{ |
||||
|
name: '类型一', |
||||
|
value: 1 |
||||
|
}, |
||||
|
{ |
||||
|
name: '类型二', |
||||
|
value: 2 |
||||
|
}, |
||||
|
{ |
||||
|
name: '类型三', |
||||
|
value: 3 |
||||
|
}, |
||||
|
{ |
||||
|
name: '类型四', |
||||
|
value: 4 |
||||
|
} |
||||
|
] |
||||
|
|
||||
|
}] |
||||
|
}; |
||||
|
var optionDevice = { |
||||
|
backgroundColor: "#ffffff", |
||||
|
legend: { |
||||
|
bottom: 10, |
||||
|
left: 'center', |
||||
|
}, |
||||
|
series: [{ |
||||
|
label: { |
||||
|
normal: { |
||||
|
fontSize: 14 |
||||
|
} |
||||
|
}, |
||||
|
type: 'pie', |
||||
|
center: ['50%', '50%'], |
||||
|
radius: ['20%', '40%'], |
||||
|
|
||||
|
data: [{ |
||||
|
name: '正常', |
||||
|
value: 1 |
||||
|
}, |
||||
|
{ |
||||
|
name: '未知', |
||||
|
value: 2 |
||||
|
}, |
||||
|
{ |
||||
|
name: '异常', |
||||
|
value: 3 |
||||
|
}, |
||||
|
|
||||
|
] |
||||
|
|
||||
|
}] |
||||
|
}; |
||||
|
that.initECharts(option); |
||||
|
that.initDeviceECharts(optionDevice); |
||||
|
}, |
||||
|
|
||||
|
/** |
||||
|
* 生命周期函数--监听页面初次渲染完成 |
||||
|
*/ |
||||
|
onReady() { |
||||
|
|
||||
|
}, |
||||
|
|
||||
|
/** |
||||
|
* 生命周期函数--监听页面显示 |
||||
|
*/ |
||||
|
onShow() { |
||||
|
|
||||
|
}, |
||||
|
|
||||
|
/** |
||||
|
* 生命周期函数--监听页面隐藏 |
||||
|
*/ |
||||
|
onHide() { |
||||
|
|
||||
|
}, |
||||
|
|
||||
|
/** |
||||
|
* 生命周期函数--监听页面卸载 |
||||
|
*/ |
||||
|
onUnload() { |
||||
|
|
||||
|
}, |
||||
|
|
||||
|
/** |
||||
|
* 页面相关事件处理函数--监听用户下拉动作 |
||||
|
*/ |
||||
|
onPullDownRefresh() { |
||||
|
|
||||
|
}, |
||||
|
|
||||
|
/** |
||||
|
* 页面上拉触底事件的处理函数 |
||||
|
*/ |
||||
|
onReachBottom() { |
||||
|
|
||||
|
}, |
||||
|
|
||||
|
/** |
||||
|
* 用户点击右上角分享 |
||||
|
*/ |
||||
|
onShareAppMessage() { |
||||
|
|
||||
|
} |
||||
|
}) |
@ -0,0 +1,11 @@ |
|||||
|
{ |
||||
|
"navigationBarBackgroundColor": "#1979ff", |
||||
|
"navigationBarTextStyle": "white", |
||||
|
"navigationBarTitleText": "设备大数据图谱", |
||||
|
"enablePullDownRefresh": false, |
||||
|
"usingComponents": { |
||||
|
"ec-canvas": "../components/ec-canvas/ec-canvas", |
||||
|
"van-button": "@vant/weapp/button/index", |
||||
|
"van-progress": "@vant/weapp/progress/index" |
||||
|
} |
||||
|
} |
@ -0,0 +1,63 @@ |
|||||
|
<!--package/riskManagement/riskCalendar/riskCalendar.wxml--> |
||||
|
<view class="container"> |
||||
|
<!--质保图谱--> |
||||
|
<view class="card"> |
||||
|
<image src="/images/shape3.png" class="imgStyle"></image> |
||||
|
<view class="top"> |
||||
|
<view style="display: flex; align-items: center;"> |
||||
|
<image style="width: 30px; height: 30px;" src="/images/edit.png" /> |
||||
|
<text class="fontStyle">质保图谱</text> |
||||
|
</view> |
||||
|
<view class="detailStyle"> |
||||
|
<van-button type="info" round size="small">查看详情</van-button> |
||||
|
</view> |
||||
|
</view> |
||||
|
<view class="progress-container"> |
||||
|
<text class="label">过保比率:</text> |
||||
|
<view class="progress-wrapper"> |
||||
|
<progress class="progress" percent="50" color="#4E87FF"></progress> |
||||
|
<text>50%</text> |
||||
|
</view> |
||||
|
</view> |
||||
|
<view class="progress-container"> |
||||
|
<text class="label">质保期比例:</text> |
||||
|
<view class="progress-wrapper"> |
||||
|
<progress class="progress" percent="50"></progress> |
||||
|
<text>50%</text> |
||||
|
</view> |
||||
|
</view> |
||||
|
|
||||
|
</view> |
||||
|
<!--设备状态--> |
||||
|
<view class="card"> |
||||
|
<image src="/images/shape1.png" class="imgStyle"></image> |
||||
|
<view class="top"> |
||||
|
<view style="display: flex; align-items: center;"> |
||||
|
<image style="width: 30px; height: 30px;" src="/images/device.png" /> |
||||
|
<text class="fontStyle">设备状态</text> |
||||
|
</view> |
||||
|
<view class="detailStyle"> |
||||
|
<van-button type="info" round size="small" bindtap="navigator">查看详情</van-button> |
||||
|
</view> |
||||
|
</view> |
||||
|
<view style="height: 250px;"> |
||||
|
<ec-canvas id="mychart-device-pie" canvas-id="mychart-device-pie" ec="{{ ec }}"></ec-canvas> |
||||
|
</view> |
||||
|
</view> |
||||
|
<!--设备类型--> |
||||
|
<view class="card"> |
||||
|
<image src="/images/shape1.png" class="imgStyle"></image> |
||||
|
<view class="top"> |
||||
|
<view style="display: flex; align-items: center;"> |
||||
|
<image style="width: 30px; height: 30px;" src="/images/device.png" /> |
||||
|
<text class="fontStyle">设备类型</text> |
||||
|
</view> |
||||
|
<view class="countStyle"> |
||||
|
总数: |
||||
|
</view> |
||||
|
</view> |
||||
|
<view style="height: 250px;"> |
||||
|
<ec-canvas id="mychart-dom-pie" canvas-id="mychart-pie" ec="{{ ec }}"></ec-canvas> |
||||
|
</view> |
||||
|
</view> |
||||
|
</view> |
@ -0,0 +1,91 @@ |
|||||
|
/* package/riskManagement/riskCalendar/riskCalendar.wxss */ |
||||
|
.container { |
||||
|
background-image: linear-gradient(179deg, #006BE3 0%, #4E87FF 16%, #4e87ff00 93%); |
||||
|
padding: 0 15px; |
||||
|
} |
||||
|
|
||||
|
.card { |
||||
|
position: relative; |
||||
|
background-color: #fff; |
||||
|
border: 1px solid #ddd; |
||||
|
border-radius: 8px; |
||||
|
/* padding: 10px; */ |
||||
|
box-shadow: 0 4px 8px rgba(0, 0, 0, 0.2); |
||||
|
margin-top: 12px; |
||||
|
width: 100%; |
||||
|
background-image: linear-gradient(0deg, #F3F7FF 84%, #DBE6FF 100%); |
||||
|
|
||||
|
} |
||||
|
|
||||
|
.top { |
||||
|
display: flex; |
||||
|
justify-content: space-between; |
||||
|
padding: 10px; |
||||
|
|
||||
|
/* background-position: bottom; */ |
||||
|
} |
||||
|
|
||||
|
.fontStyle { |
||||
|
width: 64px; |
||||
|
height: 22px; |
||||
|
font-family: PingFangSC-Medium; |
||||
|
font-weight: 500; |
||||
|
font-size: 16px; |
||||
|
color: #000000d9; |
||||
|
letter-spacing: 0; |
||||
|
margin-left: 5px; |
||||
|
} |
||||
|
|
||||
|
.imgStyle { |
||||
|
position: absolute; |
||||
|
width: 115px; |
||||
|
height: 67px; |
||||
|
right: 0; |
||||
|
|
||||
|
} |
||||
|
|
||||
|
.detailStyle { |
||||
|
z-index: 1; |
||||
|
} |
||||
|
|
||||
|
.progress-container { |
||||
|
display: flex; |
||||
|
align-items: center; |
||||
|
width: 100%; |
||||
|
margin: 0px 0px 10px 10px; |
||||
|
} |
||||
|
|
||||
|
.label { |
||||
|
margin-right: 10px; |
||||
|
width: 50%; |
||||
|
height: 20px; |
||||
|
font-family: PingFangSC-Regular; |
||||
|
font-weight: 400; |
||||
|
font-size: 14px; |
||||
|
color: #383A3B; |
||||
|
} |
||||
|
|
||||
|
.progress-wrapper { |
||||
|
display: flex; |
||||
|
align-items: center; |
||||
|
width: 100%; |
||||
|
|
||||
|
} |
||||
|
|
||||
|
.percentage { |
||||
|
margin-right: 10px; |
||||
|
} |
||||
|
|
||||
|
.progress { |
||||
|
width: 75%; |
||||
|
} |
||||
|
|
||||
|
.countStyle { |
||||
|
width: 89px; |
||||
|
height: 24px; |
||||
|
font-family: PingFangSC-Medium; |
||||
|
font-weight: 500; |
||||
|
font-size: 17px; |
||||
|
color: #1684FF; |
||||
|
letter-spacing: 0; |
||||
|
} |
@ -0,0 +1,120 @@ |
|||||
|
// package/deviceBigdataGraph/detail/detail.js
|
||||
|
import * as echarts from '../../components/ec-canvas/echarts'; |
||||
|
function setOption(chart, data) { |
||||
|
const option = { |
||||
|
grid: { |
||||
|
top: '5%', |
||||
|
left: '3%', |
||||
|
right: '4%', |
||||
|
bottom: '3%', |
||||
|
containLabel: true |
||||
|
}, |
||||
|
xAxis: { |
||||
|
type: 'category', |
||||
|
data: ['Mon', 'Tue', 'Wed', 'Thu', 'Fri', 'Sat', 'Sun'] |
||||
|
}, |
||||
|
yAxis: { |
||||
|
type: 'value' |
||||
|
}, |
||||
|
series: [ |
||||
|
{ |
||||
|
data: data, |
||||
|
type: 'line' |
||||
|
} |
||||
|
] |
||||
|
}; |
||||
|
chart.setOption(option); |
||||
|
} |
||||
|
|
||||
|
Page({ |
||||
|
|
||||
|
/** |
||||
|
* 页面的初始数据 |
||||
|
*/ |
||||
|
data: { |
||||
|
ec: { |
||||
|
// onInit: initChart,
|
||||
|
lazyLoad: true, // 将 lazyLoad 设为 true 后,需要手动初始化图表
|
||||
|
}, |
||||
|
isLoaded: false, |
||||
|
list: [1,2,3] |
||||
|
}, |
||||
|
|
||||
|
/** |
||||
|
* 生命周期函数--监听页面加载 |
||||
|
*/ |
||||
|
onLoad(options) { |
||||
|
setTimeout(() => { |
||||
|
this.initChart([250, 300, 100, 147, 260, 123, 311]) |
||||
|
}, 1000) |
||||
|
}, |
||||
|
initChart: function (data) { |
||||
|
this.ecComponent.init((canvas, width, height, dpr) => { |
||||
|
const chart = echarts.init(canvas, null, { |
||||
|
width: width, |
||||
|
height: height, |
||||
|
devicePixelRatio: dpr // new
|
||||
|
}); |
||||
|
setOption(chart, data); |
||||
|
|
||||
|
// 将图表实例绑定到 this 上,可以在其他成员函数中访问
|
||||
|
this.chart = chart; |
||||
|
|
||||
|
this.setData({ |
||||
|
isLoaded: true, |
||||
|
}); |
||||
|
|
||||
|
// 注意这里一定要返回 chart 实例,否则会影响事件处理等
|
||||
|
return chart; |
||||
|
}); |
||||
|
}, |
||||
|
/** |
||||
|
* 生命周期函数--监听页面初次渲染完成 |
||||
|
*/ |
||||
|
onReady() { |
||||
|
this.ecComponent = this.selectComponent('#device-status-chart'); |
||||
|
|
||||
|
}, |
||||
|
|
||||
|
/** |
||||
|
* 生命周期函数--监听页面显示 |
||||
|
*/ |
||||
|
onShow() { |
||||
|
|
||||
|
}, |
||||
|
|
||||
|
/** |
||||
|
* 生命周期函数--监听页面隐藏 |
||||
|
*/ |
||||
|
onHide() { |
||||
|
|
||||
|
}, |
||||
|
|
||||
|
/** |
||||
|
* 生命周期函数--监听页面卸载 |
||||
|
*/ |
||||
|
onUnload() { |
||||
|
|
||||
|
}, |
||||
|
|
||||
|
/** |
||||
|
* 页面相关事件处理函数--监听用户下拉动作 |
||||
|
*/ |
||||
|
onPullDownRefresh() { |
||||
|
|
||||
|
}, |
||||
|
|
||||
|
/** |
||||
|
* 页面上拉触底事件的处理函数 |
||||
|
*/ |
||||
|
onReachBottom() { |
||||
|
|
||||
|
}, |
||||
|
|
||||
|
/** |
||||
|
* 用户点击右上角分享 |
||||
|
*/ |
||||
|
onShareAppMessage() { |
||||
|
|
||||
|
} |
||||
|
}) |
@ -0,0 +1,10 @@ |
|||||
|
{ |
||||
|
"navigationBarBackgroundColor": "#1979ff", |
||||
|
"navigationBarTextStyle": "white", |
||||
|
"navigationBarTitleText": "设备状态", |
||||
|
"enablePullDownRefresh": false, |
||||
|
"usingComponents": { |
||||
|
"ec-canvas": "../../components/ec-canvas/ec-canvas" |
||||
|
|
||||
|
} |
||||
|
} |
@ -0,0 +1,26 @@ |
|||||
|
<!--package/deviceBigdataGraph/detail/detail.wxml--> |
||||
|
<view class="status-detail"> |
||||
|
<view class="icon"><text class="icon-text">设备总数</text></view> |
||||
|
<view>300</view> |
||||
|
<view class="flex flex-around"> |
||||
|
<view class="title-item flex flex-col"> |
||||
|
<view>设备故障率</view> |
||||
|
<view><text class="title-num">{{86}}%</text></view> |
||||
|
</view> |
||||
|
<view class="title-item flex flex-col"> |
||||
|
<view>完好率</view> |
||||
|
<view><text class="title-num">{{300}}%</text></view> |
||||
|
</view> |
||||
|
</view> |
||||
|
|
||||
|
<view class="card"> |
||||
|
<view class="flex flex-start"> |
||||
|
<!-- <image src="" class="card-img" /> --> |
||||
|
<view class="card-img" style="background: blue;"></view> |
||||
|
<view class="card-title">历史风险趋势</view> |
||||
|
</view> |
||||
|
<view class="chart"> |
||||
|
<ec-canvas id="device-status-chart" canvas-id="device-status-chart" ec="{{ ec }}"></ec-canvas> |
||||
|
</view> |
||||
|
</view> |
||||
|
</view> |
@ -0,0 +1,76 @@ |
|||||
|
/* package/deviceBigdataGraph/detail/detail.wxss */ |
||||
|
.status-detail { |
||||
|
height: 100vh; |
||||
|
background-image: linear-gradient(179deg, #006BE3 0%, #4E87FF 16%, #4e87ff00 93%); |
||||
|
padding: 0 15px; |
||||
|
} |
||||
|
|
||||
|
.icon { |
||||
|
width: 61px; |
||||
|
height: 31.86px; |
||||
|
background-image: linear-gradient(0deg, #EAF2FF 5%, #2578F0 100%); |
||||
|
box-shadow: 0 3px 4px 1px #bfdbfa4f; |
||||
|
} |
||||
|
|
||||
|
.icon-text { |
||||
|
width: 48px; |
||||
|
height: 17px; |
||||
|
font-family: PingFangSC-Medium; |
||||
|
font-weight: 500; |
||||
|
font-size: 12px; |
||||
|
color: #FFFFFF; |
||||
|
} |
||||
|
|
||||
|
.title-item { |
||||
|
width: 150px; |
||||
|
color: #ffffffd9; |
||||
|
} |
||||
|
|
||||
|
.title-num { |
||||
|
font-size: 20px; |
||||
|
color: #FFFFFF; |
||||
|
} |
||||
|
|
||||
|
.title-unit { |
||||
|
font-size: 10px; |
||||
|
color: #FFFFFE; |
||||
|
margin-left: 10px; |
||||
|
} |
||||
|
|
||||
|
.card { |
||||
|
background: #FFFFFF; |
||||
|
box-shadow: 2px 2px 11px 0 #00000008, 0 0 4px 0 #00000012; |
||||
|
border-radius: 4px; |
||||
|
padding: 12px; |
||||
|
margin-top: 12px; |
||||
|
} |
||||
|
|
||||
|
.card-img { |
||||
|
width: 18px; |
||||
|
height: 18px; |
||||
|
margin-right: 13px; |
||||
|
} |
||||
|
|
||||
|
.card-title { |
||||
|
font-weight: 500; |
||||
|
font-size: 16px; |
||||
|
color: #383A3B; |
||||
|
} |
||||
|
|
||||
|
.card-link { |
||||
|
font-weight: 500; |
||||
|
font-size: 14px; |
||||
|
color: #1684FF; |
||||
|
} |
||||
|
|
||||
|
.chart { |
||||
|
width: 100%; |
||||
|
height: 195px; |
||||
|
margin-top: 20px; |
||||
|
} |
||||
|
|
||||
|
.list { |
||||
|
margin-top: 10px; |
||||
|
padding: 10px 7px; |
||||
|
background-color: #F1F7FF; |
||||
|
} |
@ -0,0 +1,552 @@ |
|||||
|
// package/report/report.js
|
||||
|
|
||||
|
import { getPointList,getPatrolTemplate,getTemplates,reportQuest,getPatrolPlan } from "../../utils/getApiUrl"; |
||||
|
import {Request} from "../../common"; |
||||
|
const moment = require("../../utils/moment"); |
||||
|
|
||||
|
Page({ |
||||
|
data: { |
||||
|
isPlanState: false, |
||||
|
structList: [{ |
||||
|
id: 0, |
||||
|
name: '指挥中心' |
||||
|
}, { |
||||
|
id: 1, |
||||
|
name: '管廊' |
||||
|
}, |
||||
|
{ |
||||
|
id: 2, |
||||
|
name: '电梯系统' |
||||
|
}, { |
||||
|
id: 3, |
||||
|
name: '供配电系统' |
||||
|
}, { |
||||
|
id: 4, |
||||
|
name: '燃气仓' |
||||
|
}, |
||||
|
{ |
||||
|
id: 5, |
||||
|
name: '给水仓' |
||||
|
}, { |
||||
|
id: 6, |
||||
|
name: '防雷与接地系统' |
||||
|
}, { |
||||
|
id: 7, |
||||
|
name: '电气仓' |
||||
|
}, |
||||
|
{ |
||||
|
id: 8, |
||||
|
name: '高压电力仓' |
||||
|
}, { |
||||
|
id: 9, |
||||
|
name: '安防系统' |
||||
|
} |
||||
|
], |
||||
|
data:[],//巡检计划的数据(包括点位,设备等等)
|
||||
|
structListIndex: undefined,//结构物id
|
||||
|
pointList:[],//点位列表
|
||||
|
pointIndex:undefined,//点位索引
|
||||
|
devicesList:[],//设备列表
|
||||
|
dataList: '', // 当前巡检计划
|
||||
|
patrolTemplate:[],//巡检模板
|
||||
|
templateData:[],//巡检模板总数居
|
||||
|
// curPlanTemplateId:0,//当前巡检计划的模板id
|
||||
|
patrolTemplateIndex:undefined,//巡检模板索引
|
||||
|
itemData: '', // 点位
|
||||
|
address: '', // 当前位置
|
||||
|
imgUrl: getApp().globalData.imgUrl, |
||||
|
checkItems: [], // 检查项
|
||||
|
inspectContentArr: [], // 巡检内容
|
||||
|
isCommitting: false, |
||||
|
planList: null, // 巡检计划列表
|
||||
|
structListVisible: true, |
||||
|
scenePointId: null, // 当前点位id
|
||||
|
}, |
||||
|
//巡检计划
|
||||
|
getPatrolPlan: function (scenePointId) { |
||||
|
let that = this; |
||||
|
wx.showLoading({ |
||||
|
title: '加载中', |
||||
|
}) |
||||
|
Request.get(getPatrolPlan()).then(res => { |
||||
|
wx.hideLoading(); |
||||
|
let pointPlan = res.rows.filter(plan => { |
||||
|
for (const point of plan.points) { |
||||
|
if (point.id == scenePointId) { |
||||
|
return true; |
||||
|
} |
||||
|
} |
||||
|
return false; |
||||
|
}).map(p => ({ |
||||
|
label: p.name, |
||||
|
value: p.name, |
||||
|
...p |
||||
|
})) |
||||
|
that.setData({ |
||||
|
planList: pointPlan |
||||
|
}) |
||||
|
}) |
||||
|
}, |
||||
|
//点位改变函数
|
||||
|
pointChange(e){ |
||||
|
const that = this |
||||
|
that.getPatrolPlan(that.data.data[e.detail.value].id) |
||||
|
that.setData({ |
||||
|
inspectContentArr:[], |
||||
|
pointIndex:e.detail.value, |
||||
|
devicesList:that.data.data[e.detail.value].devices, |
||||
|
scenePointId:that.data.data[e.detail.value].id |
||||
|
}) |
||||
|
}, |
||||
|
// 预览图片
|
||||
|
previewImg: function (e) { |
||||
|
const { deviceidx, itemidx, index } = e.currentTarget.dataset; |
||||
|
// 所有图片
|
||||
|
const imgs = this.data.inspectContentArr[deviceidx].checkItems[itemidx].imgs; |
||||
|
const newImgs = imgs.map(i => this.data.imgUrl + i); |
||||
|
wx.previewImage({ |
||||
|
// 当前显示图片
|
||||
|
current: newImgs[index], |
||||
|
// 所有图片
|
||||
|
urls: newImgs |
||||
|
}) |
||||
|
}, |
||||
|
//结构物改变函数
|
||||
|
structChange(event) { |
||||
|
const that = this |
||||
|
that.setData({ |
||||
|
structListIndex: event.detail.value, |
||||
|
// isPlanState: true,
|
||||
|
pointList:[],//选择结构物后先置空先前的点位列表
|
||||
|
}) |
||||
|
|
||||
|
const keywords=that.data?.structList[event.detail.value]?.name |
||||
|
const query={keywords} |
||||
|
|
||||
|
Request.get(getTemplates(query)).then(res=>{ |
||||
|
if(res){ |
||||
|
const rlst=res.map(item=>item.patrolTemplate) |
||||
|
that.setData({patrolTemplate:rlst,templateData:res}) |
||||
|
}else{ |
||||
|
|
||||
|
} |
||||
|
}) |
||||
|
Request.get(getPointList(query)).then(res => { |
||||
|
if(res){ |
||||
|
const pointList=res.map(item=>{ |
||||
|
return { |
||||
|
id:item.id, |
||||
|
name:item.name |
||||
|
} |
||||
|
}) |
||||
|
that.setData({pointList:pointList,data:res}) |
||||
|
}else { |
||||
|
wx.hideLoading(); |
||||
|
} |
||||
|
}) |
||||
|
|
||||
|
}, |
||||
|
//整理设备和检查项
|
||||
|
getPatrolTemplate(templateId,pointDevices=[]) { |
||||
|
const that=this |
||||
|
Request.get(getPatrolTemplate(templateId)).then(res => { |
||||
|
const checkItems = res.rows[0].checkItems; |
||||
|
let inspectContentArr = []; |
||||
|
// 有绑定设备的点位,每个设备都要检查各个检查项
|
||||
|
if (pointDevices.length) { |
||||
|
pointDevices.forEach(device => { |
||||
|
inspectContentArr.push({ |
||||
|
deviceName: device.name, |
||||
|
deviceId: device.id, |
||||
|
checkItems: checkItems.map(c => ({ |
||||
|
id: `${device.id}-${c.id}`, |
||||
|
name: c.name, |
||||
|
isNormal: null, |
||||
|
msgInp: null, |
||||
|
level: null, |
||||
|
imgs: [], |
||||
|
})) |
||||
|
}) |
||||
|
}); |
||||
|
} else { |
||||
|
inspectContentArr.push({ |
||||
|
checkItems: checkItems.map(c => ({ |
||||
|
id: c.id, |
||||
|
name: c.name, |
||||
|
isNormal: null, |
||||
|
msgInp: null, |
||||
|
level: null, |
||||
|
imgs: [], |
||||
|
})) |
||||
|
}) |
||||
|
} |
||||
|
this.setData({ |
||||
|
checkItems, |
||||
|
inspectContentArr: inspectContentArr, |
||||
|
}) |
||||
|
}) |
||||
|
}, |
||||
|
//选择异常或者正常
|
||||
|
handleChangeTwo(e) { |
||||
|
const isNormal = e.detail === 'normal'; |
||||
|
const { deviceidx, itemidx } = e.currentTarget.dataset; |
||||
|
let nextInspectContentArr = this.data.inspectContentArr; |
||||
|
|
||||
|
nextInspectContentArr[deviceidx].checkItems[itemidx].isNormal = isNormal; |
||||
|
if (isNormal) { // 清除异常数据
|
||||
|
nextInspectContentArr[deviceidx].checkItems[itemidx].msgInp = null; |
||||
|
nextInspectContentArr[deviceidx].checkItems[itemidx].level = null; |
||||
|
nextInspectContentArr[deviceidx].checkItems[itemidx].imgs = []; |
||||
|
} |
||||
|
this.setData({ inspectContentArr: nextInspectContentArr }) |
||||
|
}, |
||||
|
//返回前一页
|
||||
|
bindCancel() { |
||||
|
wx.navigateBack(); |
||||
|
}, |
||||
|
// 开始巡检录入
|
||||
|
addPatrolRecord: function () { |
||||
|
const that = this; |
||||
|
if (that.data.isCommitting) { return } |
||||
|
let { |
||||
|
patrolTemplate, |
||||
|
patrolTemplateIndex, |
||||
|
structListIndex, |
||||
|
pointIndex, |
||||
|
pointList, |
||||
|
inspectContentArr, |
||||
|
dataList, |
||||
|
address, |
||||
|
data, |
||||
|
templateData |
||||
|
} = that.data; |
||||
|
let alarm = false; |
||||
|
if (!address) { |
||||
|
wx.showToast({ |
||||
|
title: '请获取当前位置', |
||||
|
icon: 'none', |
||||
|
duration: 1500 |
||||
|
}) |
||||
|
return; |
||||
|
} |
||||
|
if (!structListIndex) { |
||||
|
wx.showToast({ |
||||
|
title: '请选择结构物', |
||||
|
icon: 'none', |
||||
|
duration: 1500 |
||||
|
}) |
||||
|
return; |
||||
|
} |
||||
|
if (!patrolTemplateIndex) { |
||||
|
wx.showToast({ |
||||
|
title: '请选择模板', |
||||
|
icon: 'none', |
||||
|
duration: 1500 |
||||
|
}) |
||||
|
return; |
||||
|
} |
||||
|
if (!pointIndex) { |
||||
|
wx.showToast({ |
||||
|
title: '请选择点位', |
||||
|
icon: 'none', |
||||
|
duration: 1500 |
||||
|
}) |
||||
|
return; |
||||
|
} |
||||
|
let reportArr = inspectContentArr.map(d => ({ ...d, alarm: false })); |
||||
|
for (const [index, device] of inspectContentArr.entries()) { |
||||
|
for (const item of device.checkItems) { |
||||
|
if (item.isNormal === null) { |
||||
|
wx.showToast({ |
||||
|
title: '请填写完整', |
||||
|
icon: 'none', |
||||
|
duration: 1500 |
||||
|
}) |
||||
|
return; |
||||
|
} |
||||
|
if ((!item.isNormal) && (!item.level || !item.msgInp)) { |
||||
|
wx.showToast({ |
||||
|
title: '异常项必须输入巡查详情和选择严重等级', |
||||
|
icon: 'none', |
||||
|
duration: 2000 |
||||
|
}) |
||||
|
return; |
||||
|
} |
||||
|
if (item.isNormal === false) { |
||||
|
alarm = true; // 巡检记录异常
|
||||
|
reportArr[index].alarm = true; // 设备异常
|
||||
|
} |
||||
|
} |
||||
|
} |
||||
|
const { id, name, departmentId, deptName } = wx.getStorageSync('userInfo'); |
||||
|
const curPlan = that.data.planList.find(item=>item.id=patrolTemplate[patrolTemplateIndex].id) |
||||
|
const nextItemData = curPlan.points.find(p => p.id == this.data.scenePointId) |
||||
|
const aboutSend=templateData.find(item=>item.patrolTemplate.id===patrolTemplate[patrolTemplateIndex].id) |
||||
|
let datas = { |
||||
|
patrolPlanId: -1, |
||||
|
pointId: pointList[pointIndex].id, |
||||
|
inspectionTime: moment().format('YYYY-MM-DD HH:mm:ss'), |
||||
|
points: { |
||||
|
user: { id, name, department: { id: departmentId, name: deptName } }, |
||||
|
project: aboutSend.project, |
||||
|
frequency: aboutSend.frequency, |
||||
|
itemData:nextItemData, |
||||
|
inspectContent: reportArr, |
||||
|
address: address |
||||
|
}, |
||||
|
alarm, |
||||
|
projectId: aboutSend.project.id |
||||
|
} |
||||
|
wx.showLoading({ title: '提交中...' }); |
||||
|
that.setData({ isCommitting: true }); |
||||
|
Request.post(reportQuest(), datas).then(res => { |
||||
|
wx.hideLoading(); |
||||
|
that.setData({ isCommitting: false }); |
||||
|
wx.showToast({ |
||||
|
title: '提交成功', |
||||
|
icon: 'success' |
||||
|
}) |
||||
|
setTimeout(() => { |
||||
|
that.bindCancel(); |
||||
|
}, 1500) |
||||
|
}) |
||||
|
}, |
||||
|
//多张图片上传
|
||||
|
uploadImg: function (data, deviceidx, itemidx) { |
||||
|
wx.showLoading({ |
||||
|
title: '上传中...', |
||||
|
mask: true, |
||||
|
}) |
||||
|
let that = this, |
||||
|
i = data.i ? data.i : 0, |
||||
|
success = data.success ? data.success : 0, |
||||
|
fail = data.fail ? data.fail : 0; |
||||
|
let imgs = that.data.inspectContentArr[deviceidx].checkItems[itemidx].imgs; |
||||
|
wx.uploadFile({ |
||||
|
url: data.url, |
||||
|
filePath: data.path[i], |
||||
|
name: 'file', |
||||
|
success: (resp) => { |
||||
|
wx.hideLoading(); |
||||
|
success++; |
||||
|
let str = JSON.parse(resp.data) // 返回的结果,可能不同项目结果不一样
|
||||
|
str = str.uploaded |
||||
|
if (imgs.length >= 20) { |
||||
|
let nextInspectContentArr = that.data.inspectContentArr; |
||||
|
nextInspectContentArr[deviceidx].checkItems[itemidx].imgs = imgs; |
||||
|
that.setData({ inspectContentArr: nextInspectContentArr }); |
||||
|
return false; |
||||
|
} else { |
||||
|
imgs.push(str); |
||||
|
let nextInspectContentArr = that.data.inspectContentArr; |
||||
|
nextInspectContentArr[deviceidx].checkItems[itemidx].imgs = imgs; |
||||
|
that.setData({ inspectContentArr: nextInspectContentArr }); |
||||
|
} |
||||
|
}, |
||||
|
fail: (res) => { |
||||
|
fail++; |
||||
|
console.log('fail:' + i + "fail:" + fail); |
||||
|
}, |
||||
|
complete: () => { |
||||
|
i++; |
||||
|
if (i == data.path.length) { // 当图片传完时,停止调用
|
||||
|
console.log('执行完毕'); |
||||
|
console.log('成功:' + success + " 失败:" + fail); |
||||
|
} else { // 若图片还没有传完,则继续调用函数
|
||||
|
data.i = i; |
||||
|
data.success = success; |
||||
|
data.fail = fail; |
||||
|
that.uploadImg(data, deviceidx, itemidx); // 递归,回调自己
|
||||
|
} |
||||
|
} |
||||
|
}); |
||||
|
}, |
||||
|
// 上传图片
|
||||
|
chooseImg: function (e) { // 这里是选取图片的方法
|
||||
|
const { deviceidx, itemidx } = e.currentTarget.dataset; |
||||
|
const that = this; |
||||
|
let pics = []; |
||||
|
const detailPics = that.data.inspectContentArr[deviceidx].checkItems[itemidx].imgs; |
||||
|
if (detailPics.length >= 20) { |
||||
|
wx.showToast({ |
||||
|
title: '最多选择20张图片上传', |
||||
|
icon: 'none' |
||||
|
}); |
||||
|
return; |
||||
|
} |
||||
|
wx.chooseMedia({ |
||||
|
count: 20, // 基础库2.25.0前,最多可支持9个文件,2.25.0及以后最多可支持20个文件
|
||||
|
mediaType: ['image'], // 文件类型
|
||||
|
sizeType: ['original', 'compressed'], // original 原图,compressed 压缩图,默认二者都有
|
||||
|
sourceType: ['album', 'camera'], // album 从相册选图,camera 使用相机,默认二者都有
|
||||
|
success: function (res) { |
||||
|
const imgs = res.tempFiles; |
||||
|
for (let i = 0; i < imgs.length; i++) { |
||||
|
if (res.tempFiles[i].size > 15728640) { |
||||
|
wx.showToast({ title: '图片大于15M,不可上传', icon: 'none' }); |
||||
|
return; |
||||
|
} |
||||
|
const fileNameArr = res.tempFiles[i].tempFilePath.split('.'); |
||||
|
const extension = res.tempFiles[i].tempFilePath.split('.')[fileNameArr.length - 1]; |
||||
|
if (extension !== 'jpg' && extension !== 'png' && extension !== 'jpeg') { |
||||
|
wx.showToast({ title: '只能上传jpg、jpeg、png格式的图片', icon: 'none' }); |
||||
|
return; |
||||
|
} |
||||
|
pics.push(imgs[i].tempFilePath) |
||||
|
} |
||||
|
that.uploadImg({ |
||||
|
url: getApp().globalData.webUrl + '_upload/attachments/project', // 图片上传的接口
|
||||
|
path: pics, // 选取的图片的地址数组
|
||||
|
}, deviceidx, itemidx); |
||||
|
}, |
||||
|
}) |
||||
|
}, |
||||
|
// 删除图片
|
||||
|
deleteImg: function (e) { |
||||
|
const { deviceidx, itemidx, index } = e.currentTarget.dataset; |
||||
|
let imgs = this.data.inspectContentArr[deviceidx].checkItems[itemidx].imgs; |
||||
|
imgs.splice(index, 1); |
||||
|
let nextInspectContentArr = this.data.inspectContentArr; |
||||
|
nextInspectContentArr[deviceidx].checkItems[itemidx].imgs = imgs; |
||||
|
this.setData({ inspectContentArr: nextInspectContentArr }) |
||||
|
}, |
||||
|
// 巡查详情
|
||||
|
bindInput: function (e) { |
||||
|
const { deviceidx, itemidx } = e.currentTarget.dataset; |
||||
|
let nextInspectContentArr = this.data.inspectContentArr; |
||||
|
|
||||
|
nextInspectContentArr[deviceidx].checkItems[itemidx].msgInp = e.detail.value; |
||||
|
this.setData({ inspectContentArr: nextInspectContentArr }) |
||||
|
}, |
||||
|
|
||||
|
handleChangeThree(e) { |
||||
|
const { deviceidx, itemidx } = e.currentTarget.dataset; |
||||
|
let nextInspectContentArr = this.data.inspectContentArr; |
||||
|
nextInspectContentArr[deviceidx].checkItems[itemidx].level = e.detail; |
||||
|
this.setData({ inspectContentArr: nextInspectContentArr }) |
||||
|
}, |
||||
|
|
||||
|
|
||||
|
//巡检模板改变
|
||||
|
patrolTemplateChange(e){ |
||||
|
const that=this |
||||
|
that.getPatrolTemplate(that.data.patrolTemplate[e.detail.value].id,that.data.devicesList) |
||||
|
that.setData({ |
||||
|
patrolTemplateIndex:e.detail.value |
||||
|
}) |
||||
|
}, |
||||
|
bindShowMsg() { |
||||
|
this.setData({ |
||||
|
select: !this.data.select |
||||
|
}) |
||||
|
}, |
||||
|
|
||||
|
mySelect(e) { |
||||
|
var name = e.currentTarget.dataset.name |
||||
|
this.setData({ |
||||
|
tihuoWay: name, |
||||
|
select: false |
||||
|
}) |
||||
|
}, |
||||
|
/** |
||||
|
* 页面的初始数据 |
||||
|
*/ |
||||
|
// data: {
|
||||
|
|
||||
|
// },
|
||||
|
|
||||
|
/** |
||||
|
* 生命周期函数--监听页面加载 |
||||
|
*/ |
||||
|
onLoad(options) { |
||||
|
const that=this |
||||
|
wx.setNavigationBarTitle({ |
||||
|
title: options.key, |
||||
|
}); |
||||
|
|
||||
|
}, |
||||
|
onStructListPicker() { |
||||
|
this.setData({ |
||||
|
structListVisible: true |
||||
|
}); |
||||
|
}, |
||||
|
// 获取当前位置
|
||||
|
selfLocation() { |
||||
|
const that = this |
||||
|
wx.showLoading({ |
||||
|
title: '定位中', |
||||
|
mask: true, |
||||
|
}); |
||||
|
wx.getLocation({ |
||||
|
type: 'wgs84', |
||||
|
success: (res) => { |
||||
|
wx.request({ |
||||
|
url: `https://apis.map.qq.com/ws/geocoder/v1/?location=${res.latitude},${res.longitude}&key=${getApp().globalData.key}`, |
||||
|
success: function (res) { |
||||
|
wx.hideLoading(); |
||||
|
// 根据自己项目需求获取res内容
|
||||
|
that.setData({ |
||||
|
address: res.data.result.address |
||||
|
}) |
||||
|
} |
||||
|
}) |
||||
|
}, |
||||
|
fail: (res) => { |
||||
|
wx.hideLoading(); |
||||
|
wx.showToast({ |
||||
|
title: res.errMsg, |
||||
|
icon: 'none', |
||||
|
duration: 1000 |
||||
|
}); |
||||
|
} |
||||
|
}); |
||||
|
}, |
||||
|
/** |
||||
|
* 生命周期函数--监听页面初次渲染完成 |
||||
|
*/ |
||||
|
onReady() { |
||||
|
|
||||
|
}, |
||||
|
|
||||
|
/** |
||||
|
* 生命周期函数--监听页面显示 |
||||
|
*/ |
||||
|
onShow() { |
||||
|
|
||||
|
}, |
||||
|
|
||||
|
/** |
||||
|
* 生命周期函数--监听页面隐藏 |
||||
|
*/ |
||||
|
onHide() { |
||||
|
|
||||
|
}, |
||||
|
|
||||
|
/** |
||||
|
* 生命周期函数--监听页面卸载 |
||||
|
*/ |
||||
|
onUnload() { |
||||
|
|
||||
|
}, |
||||
|
|
||||
|
/** |
||||
|
* 页面相关事件处理函数--监听用户下拉动作 |
||||
|
*/ |
||||
|
onPullDownRefresh() { |
||||
|
|
||||
|
}, |
||||
|
|
||||
|
/** |
||||
|
* 页面上拉触底事件的处理函数 |
||||
|
*/ |
||||
|
onReachBottom() { |
||||
|
|
||||
|
}, |
||||
|
|
||||
|
/** |
||||
|
* 用户点击右上角分享 |
||||
|
*/ |
||||
|
onShareAppMessage() { |
||||
|
|
||||
|
} |
||||
|
}) |
@ -0,0 +1,25 @@ |
|||||
|
{ |
||||
|
"navigationBarBackgroundColor": "#1979ff", |
||||
|
"navigationBarTextStyle": "white", |
||||
|
"navigationBarTitleText": "发现问题", |
||||
|
"enablePullDownRefresh": false, |
||||
|
"componentFramework": "glass-easel", |
||||
|
"usingComponents": { |
||||
|
"van-button": "@vant/weapp/button/index", |
||||
|
"van-field": "@vant/weapp/field/index", |
||||
|
"van-cell": "@vant/weapp/cell/index", |
||||
|
"van-cell-group": "@vant/weapp/cell-group/index", |
||||
|
"van-picker": "@vant/weapp/picker/index", |
||||
|
"van-popup": "@vant/weapp/popup/index", |
||||
|
"van-icon": "@vant/weapp/icon/index", |
||||
|
"van-collapse": "@vant/weapp/collapse/index", |
||||
|
"van-collapse-item": "@vant/weapp/collapse-item/index", |
||||
|
"van-divider": "@vant/weapp/divider/index", |
||||
|
"t-cell-group": "tdesign-miniprogram/cell-group/cell-group", |
||||
|
"t-cell": "tdesign-miniprogram/cell/cell", |
||||
|
"t-picker": "tdesign-miniprogram/picker/picker", |
||||
|
"t-picker-item": "tdesign-miniprogram/picker-item/picker-item", |
||||
|
"van-radio": "@vant/weapp/radio/index", |
||||
|
"van-radio-group": "@vant/weapp/radio-group/index" |
||||
|
} |
||||
|
} |
@ -0,0 +1,96 @@ |
|||||
|
<view class="popBox"> |
||||
|
<view> |
||||
|
<van-cell-group class="mission-card"> |
||||
|
<van-cell> |
||||
|
<view style="display:flex"> |
||||
|
<view class="fs-cell-title" style="">结构物:</view> |
||||
|
<picker style="width:100%;text-align:left" bindchange="structChange" data-type='jiegouwu' value="{{0}}" range="{{structList}}" range-key="name"> |
||||
|
<view class="fs-cell-content" style="width:100%"> |
||||
|
{{structListIndex||structListIndex==0?structList[structListIndex].name:'请选择'}} |
||||
|
<van-icon name="arrow" style="float:right;position:relative; top:4px" /> |
||||
|
</view> |
||||
|
</picker> |
||||
|
</view> |
||||
|
</van-cell> |
||||
|
<van-cell> |
||||
|
<view style="display:flex"> |
||||
|
<view class="fs-cell-title" style="">当前点位:</view> |
||||
|
<picker style="width:100%;text-align:left" bindchange="pointChange" data-type='point' range="{{pointList}}" range-key="name"> |
||||
|
<view class="fs-cell-content" style="width:100%"> |
||||
|
{{pointIndex||pointIndex==0?pointList[pointIndex].name:'请选择'}} |
||||
|
<van-icon name="arrow" style="float:right;position:relative; top:4px" /> |
||||
|
</view> |
||||
|
</picker> |
||||
|
</view> |
||||
|
</van-cell> |
||||
|
<van-cell> |
||||
|
<view style="overflow: hidden;"> |
||||
|
<view style="float: left;" class="fs-cell-title">当前位置:</view> |
||||
|
<view style="float:right;" class="fs-cell-content" wx:if="{{address}}"> |
||||
|
{{address}} |
||||
|
</view> |
||||
|
<view style="float:right;"> |
||||
|
<image wx:if="{{!address}}" class="icon" src="../../images/landmark.svg" /> |
||||
|
<view style="display: inline-block;" bindtap="selfLocation" wx:if="{{!address}}"> |
||||
|
点击获取 |
||||
|
</view> |
||||
|
</view> |
||||
|
</view> |
||||
|
</van-cell> |
||||
|
<van-cell> |
||||
|
<view style="display:flex"> |
||||
|
<view class="fs-cell-title">巡检模板:</view> |
||||
|
<picker style="width:100%;text-align:left" bindchange="patrolTemplateChange" data-type='template' value="{{0}}" range="{{patrolTemplate}}" range-key="name"> |
||||
|
<view class="fs-cell-content" style="width:100%"> |
||||
|
{{patrolTemplateIndex||patrolTemplateIndex==0?patrolTemplate[patrolTemplateIndex].name:'请选择'}} |
||||
|
<van-icon name="arrow" style="float:right;position:relative; top:4px" /> |
||||
|
</view> |
||||
|
</picker> |
||||
|
</view> |
||||
|
</van-cell> |
||||
|
|
||||
|
|
||||
|
|
||||
|
</van-cell-group> |
||||
|
</view> |
||||
|
|
||||
|
<!-- 渲染巡检内容 --> |
||||
|
<view wx:for="{{inspectContentArr}}" wx:key="id" wx:for-item="device" wx:for-index="deviceidx" > |
||||
|
<view wx:if="{{device.deviceName}}" class="flex flex-start" style="height: 40px">{{device.deviceName}}</view> |
||||
|
<view wx:for="{{device.checkItems}}" wx:key="id" wx:for-index="itemidx"> |
||||
|
<view class="flex-between"> |
||||
|
<view class="item-name">{{item.name}}:</view> |
||||
|
<van-radio-group style="padding:10px 15px;" data-deviceidx="{{deviceidx}}" data-itemidx="{{itemidx}}" bindchange="handleChangeTwo"> |
||||
|
<van-radio style="margin-right: 20px;" class="radio-text" color="#1979ff" name="normal">正常</van-radio> |
||||
|
<van-radio class="radio-text" checked-color="#CC0000" name="abnormal">异常</van-radio> |
||||
|
</van-radio-group> |
||||
|
</view> |
||||
|
<view class="divider" /> |
||||
|
<van-radio-group class="flex-end" style="padding:10px 15px;" data-deviceidx="{{deviceidx}}" data-itemidx="{{itemidx}}" bindchange="handleChangeThree" wx:if="{{item.isNormal === false}}"> |
||||
|
<van-radio style="margin-right: 20px;" class="radio-text" checked-color="#FF9900" name="轻微">轻微</van-radio> |
||||
|
<van-radio style="margin-right: 20px;" class="radio-text" checked-color="#FF3300" name="中度">中度</van-radio> |
||||
|
<van-radio class="radio-text" checked-color="#990000" name="严重">严重</van-radio> |
||||
|
</van-radio-group> |
||||
|
<textarea class="textarea" placeholder="请输入巡查详情" maxlength="-1" wx:if="{{item.isNormal === false}}" data-deviceidx="{{deviceidx}}" data-itemidx="{{itemidx}}" bindinput="bindInput" /> |
||||
|
<view class="weui-uploader" style="padding: 20rpx 30rpx;overflow-y:scroll;" wx:if="{{item.isNormal === false}}"> |
||||
|
<view class="img-v weui-uploader__bd" style="overflow:hidden;"> |
||||
|
<view class="pic" wx:for="{{item.imgs}}" wx:for-item="img" wx:key="*this"> |
||||
|
<image class="weui-uploader__img showImg" src="{{imgUrl + img}}" data-index="{{index}}" data-deviceidx="{{deviceidx}}" data-itemidx="{{itemidx}}" mode="aspectFill" bindtap="previewImg"> |
||||
|
<icon type="cancel" class="delete-btn" data-index="{{index}}" data-deviceidx="{{deviceidx}}" data-itemidx="{{itemidx}}" catchtap="deleteImg" /> |
||||
|
</image> |
||||
|
</view> |
||||
|
<!-- 用来提示用户上传图片 --> |
||||
|
<view class="weui-uploader__input-box pic" data-item="{{item.name}}" data-deviceidx="{{deviceidx}}" data-itemidx="{{itemidx}}" bindtap="chooseImg"> |
||||
|
<image class="upload" src="/images/upload.png" /> |
||||
|
</view> |
||||
|
</view> |
||||
|
</view> |
||||
|
<view class="divider" /> |
||||
|
</view> |
||||
|
</view> |
||||
|
|
||||
|
<view class="btnBox"> |
||||
|
<view class="cancel" bindtap="bindCancel">取消</view> |
||||
|
<view class="submit" bindtap="addPatrolRecord">提交</view> |
||||
|
</view> |
||||
|
</view> |
@ -0,0 +1,131 @@ |
|||||
|
.divider { |
||||
|
width: 100%; |
||||
|
height: 0px; |
||||
|
border-top: 1px solid #F5F5F5; |
||||
|
} |
||||
|
|
||||
|
.flex-between { |
||||
|
display: flex; |
||||
|
justify-content: space-between; |
||||
|
} |
||||
|
|
||||
|
.flex-end { |
||||
|
display: flex; |
||||
|
justify-content: flex-end; |
||||
|
} |
||||
|
|
||||
|
.popBox { |
||||
|
position: absolute; |
||||
|
left: 50%; |
||||
|
z-index: 1000; |
||||
|
background: #fff; |
||||
|
width: 95%; |
||||
|
margin-left: -356rpx; |
||||
|
padding: 20rpx 0; |
||||
|
} |
||||
|
|
||||
|
.item-name { |
||||
|
margin: 20rpx 0 0 30rpx; |
||||
|
} |
||||
|
|
||||
|
.btnBox { |
||||
|
padding: 50px 30rpx; |
||||
|
overflow: hidden; |
||||
|
font-size: 30rpx; |
||||
|
display: flex; |
||||
|
justify-content: space-between; |
||||
|
} |
||||
|
|
||||
|
.cancel { |
||||
|
width: 38vw; |
||||
|
height: 42px; |
||||
|
line-height: 42px; |
||||
|
text-align: center; |
||||
|
background: #fff; |
||||
|
border: 1px solid #006BE3; |
||||
|
border-radius: 24px; |
||||
|
font-weight: 600; |
||||
|
font-size: 16px; |
||||
|
color: #1684FF; |
||||
|
} |
||||
|
|
||||
|
.submit { |
||||
|
width: 38vw; |
||||
|
height: 42px; |
||||
|
line-height: 42px; |
||||
|
text-align: center; |
||||
|
background: #1684FF; |
||||
|
border: 1px solid #006BE3; |
||||
|
border-radius: 24px; |
||||
|
font-weight: 600; |
||||
|
font-size: 16px; |
||||
|
color: #FFFFFF; |
||||
|
} |
||||
|
|
||||
|
.pic { |
||||
|
float: left; |
||||
|
position: relative; |
||||
|
margin-right: 8px; |
||||
|
margin-bottom: 8px; |
||||
|
} |
||||
|
|
||||
|
.showImg { |
||||
|
width: 160rpx; |
||||
|
height: 160rpx; |
||||
|
} |
||||
|
|
||||
|
.delete-btn { |
||||
|
position: absolute; |
||||
|
top: 0; |
||||
|
right: 0; |
||||
|
} |
||||
|
|
||||
|
.upload { |
||||
|
width: 63px; |
||||
|
height: 63px; |
||||
|
} |
||||
|
|
||||
|
.block { |
||||
|
display: block; |
||||
|
} |
||||
|
|
||||
|
.icon { |
||||
|
width: 18px; |
||||
|
height: 18px; |
||||
|
margin-right: 5px; |
||||
|
} |
||||
|
|
||||
|
.radio-text { |
||||
|
font-size: 14px; |
||||
|
color: #323233; |
||||
|
} |
||||
|
|
||||
|
.van-radio-group { |
||||
|
display: flex; |
||||
|
} |
||||
|
|
||||
|
.textarea { |
||||
|
width: 84%; |
||||
|
margin: 0 auto; |
||||
|
padding: 20rpx; |
||||
|
height: 120rpx; |
||||
|
border: 1px solid #61616166; |
||||
|
} |
||||
|
.mission-card-title { |
||||
|
background-color: #fff; |
||||
|
overflow: auto; |
||||
|
padding: 24rpx 16px; |
||||
|
display: flex; |
||||
|
align-items: center |
||||
|
} |
||||
|
.fs-cell-title { |
||||
|
max-width: 6.2em; |
||||
|
min-width: 6.2em; |
||||
|
margin-right: 12px; |
||||
|
text-align: left; |
||||
|
color: var(--field-label-color, #646566) |
||||
|
} |
||||
|
|
||||
|
.fs-cell-content { |
||||
|
color: var(--field-input-text-color, #323233) |
||||
|
} |
@ -0,0 +1,145 @@ |
|||||
|
// package/subSystem/dayPatrolInfo/dayPatrolInfo.js
|
||||
|
import * as echarts from '../../components/ec-canvas/echarts'; |
||||
|
|
||||
|
const setPieOptions = ((chart, data) => { |
||||
|
const option = { |
||||
|
grid: { |
||||
|
top: '0%', |
||||
|
left: '3%', |
||||
|
right: '4%', |
||||
|
bottom: '3%', |
||||
|
containLabel: true |
||||
|
}, |
||||
|
tooltip: { |
||||
|
trigger: 'item' |
||||
|
}, |
||||
|
legend: { |
||||
|
top: 'bottom', |
||||
|
}, |
||||
|
series: [ |
||||
|
{ |
||||
|
type: 'pie', |
||||
|
radius: ['30%', '55%'], |
||||
|
// avoidLabelOverlap: false,
|
||||
|
emphasis: { |
||||
|
label: { |
||||
|
show: true, |
||||
|
fontWeight: 'bold' |
||||
|
} |
||||
|
}, |
||||
|
data: data |
||||
|
} |
||||
|
] |
||||
|
}; |
||||
|
chart.setOption(option); |
||||
|
}) |
||||
|
|
||||
|
Page({ |
||||
|
|
||||
|
/** |
||||
|
* 页面的初始数据 |
||||
|
*/ |
||||
|
data: { |
||||
|
needEc: { lazyLoad: true }, |
||||
|
alreadyEc: { lazyLoad: true }, |
||||
|
}, |
||||
|
|
||||
|
// 今日待检分布图表
|
||||
|
initNeedChart: function (data) { |
||||
|
this.needEcComponent.init((canvas, width, height, dpr) => { |
||||
|
const chart = echarts.init(canvas, null, { |
||||
|
width: width, |
||||
|
height: height, |
||||
|
devicePixelRatio: dpr // new
|
||||
|
}); |
||||
|
setPieOptions(chart, data) |
||||
|
return chart; |
||||
|
}); |
||||
|
}, |
||||
|
|
||||
|
// 今日已检分布图表
|
||||
|
initAlreadyChart: function (data) { |
||||
|
this.alreadyEcComponent.init((canvas, width, height, dpr) => { |
||||
|
const chart = echarts.init(canvas, null, { |
||||
|
width: width, |
||||
|
height: height, |
||||
|
devicePixelRatio: dpr // new
|
||||
|
}); |
||||
|
setPieOptions(chart, data) |
||||
|
return chart; |
||||
|
}); |
||||
|
}, |
||||
|
|
||||
|
/** |
||||
|
* 生命周期函数--监听页面加载 |
||||
|
*/ |
||||
|
onLoad(options) { |
||||
|
wx.setNavigationBarTitle({ title: options.day }) |
||||
|
setTimeout(() => { |
||||
|
this.initNeedChart([ |
||||
|
{ value: 1048, name: 'Search Engine' }, |
||||
|
{ value: 735, name: 'Direct' }, |
||||
|
{ value: 580, name: 'Email' }, |
||||
|
{ value: 580, name: 'Email2' }, |
||||
|
{ value: 580, name: 'Email3' }, |
||||
|
]) |
||||
|
this.initAlreadyChart([ |
||||
|
{ value: 1048, name: 'Search Engine' }, |
||||
|
{ value: 735, name: 'Direct' }, |
||||
|
{ value: 580, name: 'Email' }, |
||||
|
{ value: 580, name: 'Email2' }, |
||||
|
{ value: 580, name: 'Email3' }, |
||||
|
]) |
||||
|
}, 1000) |
||||
|
}, |
||||
|
|
||||
|
/** |
||||
|
* 生命周期函数--监听页面初次渲染完成 |
||||
|
*/ |
||||
|
onReady() { |
||||
|
this.needEcComponent = this.selectComponent('#need-chart-dom'); |
||||
|
this.alreadyEcComponent = this.selectComponent('#already-chart-dom'); |
||||
|
}, |
||||
|
|
||||
|
/** |
||||
|
* 生命周期函数--监听页面显示 |
||||
|
*/ |
||||
|
onShow() { |
||||
|
|
||||
|
}, |
||||
|
|
||||
|
/** |
||||
|
* 生命周期函数--监听页面隐藏 |
||||
|
*/ |
||||
|
onHide() { |
||||
|
|
||||
|
}, |
||||
|
|
||||
|
/** |
||||
|
* 生命周期函数--监听页面卸载 |
||||
|
*/ |
||||
|
onUnload() { |
||||
|
|
||||
|
}, |
||||
|
|
||||
|
/** |
||||
|
* 页面相关事件处理函数--监听用户下拉动作 |
||||
|
*/ |
||||
|
onPullDownRefresh() { |
||||
|
|
||||
|
}, |
||||
|
|
||||
|
/** |
||||
|
* 页面上拉触底事件的处理函数 |
||||
|
*/ |
||||
|
onReachBottom() { |
||||
|
|
||||
|
}, |
||||
|
|
||||
|
/** |
||||
|
* 用户点击右上角分享 |
||||
|
*/ |
||||
|
onShareAppMessage() { |
||||
|
|
||||
|
} |
||||
|
}) |
@ -0,0 +1,9 @@ |
|||||
|
{ |
||||
|
"navigationBarBackgroundColor": "#006BE3", |
||||
|
"navigationBarTextStyle": "white", |
||||
|
"navigationBarTitleText": "", |
||||
|
"enablePullDownRefresh": false, |
||||
|
"usingComponents": { |
||||
|
"ec-canvas": "../../components/ec-canvas/ec-canvas" |
||||
|
} |
||||
|
} |
@ -0,0 +1,49 @@ |
|||||
|
<!--package/subSystem/dayPatrolInfo/dayPatrolInfo.wxml--> |
||||
|
<view class="day-patrol-info"> |
||||
|
<view class="card" style="margin-bottom: 10px"> |
||||
|
<view class="card-top flex flex-between"> |
||||
|
<view class="card-left flex"> |
||||
|
<image class="card-icon" src="/images/right_icon.png" /> |
||||
|
<view class="title">今日问题分布</view> |
||||
|
</view> |
||||
|
<image src="/images/right_card_bg.png" class="card-bg" /> |
||||
|
</view> |
||||
|
<view wx:for="{{[1,2,3,4]}}" class="problem-box flex"> |
||||
|
<view class="problem-title text---">类型1:</view> |
||||
|
<progress |
||||
|
style="width: 70%;" |
||||
|
percent="{{80}}" |
||||
|
stroke-width="8" |
||||
|
show-info |
||||
|
font-size="14" |
||||
|
border-radius="4" |
||||
|
/> |
||||
|
</view> |
||||
|
</view> |
||||
|
<view class="card" style="margin-bottom: 10px"> |
||||
|
<view class="card-top flex flex-between"> |
||||
|
<view class="card-left flex"> |
||||
|
<image class="card-icon" src="/images/right_icon.png" /> |
||||
|
<view class="title">今日待检分布</view> |
||||
|
</view> |
||||
|
<view class="card-right">总次数:{{50}}次</view> |
||||
|
<image src="/images/right_card_bg.png" class="card-bg" /> |
||||
|
</view> |
||||
|
<view class="pie-chart-box"> |
||||
|
<ec-canvas id="need-chart-dom" canvas-id="need-chart" ec="{{ needEc }}"></ec-canvas> |
||||
|
</view> |
||||
|
</view> |
||||
|
<view class="card" style="margin-bottom: 10px"> |
||||
|
<view class="card-top flex flex-between"> |
||||
|
<view class="card-left flex"> |
||||
|
<image class="card-icon" src="/images/right_icon.png" /> |
||||
|
<view class="title">今日已检分布</view> |
||||
|
</view> |
||||
|
<view class="card-right">总次数:{{50}}次</view> |
||||
|
<image src="/images/right_card_bg.png" class="card-bg" /> |
||||
|
</view> |
||||
|
<view class="pie-chart-box"> |
||||
|
<ec-canvas id="already-chart-dom" canvas-id="already-chart" ec="{{ alreadyEc }}"></ec-canvas> |
||||
|
</view> |
||||
|
</view> |
||||
|
</view> |
@ -0,0 +1,71 @@ |
|||||
|
.day-patrol-info { |
||||
|
height: 100%; |
||||
|
background-image: linear-gradient(179deg, #006BE3 0%, #4E87FF 16%, #4e87ff00 93%); |
||||
|
padding: 0 15px 15px; |
||||
|
} |
||||
|
|
||||
|
.card { |
||||
|
box-sizing: border-box; |
||||
|
background: #FFFFFF; |
||||
|
box-shadow: 2px 2px 11px 0 #00000008, 0 0 4px 0 #00000012; |
||||
|
border-radius: 4px; |
||||
|
} |
||||
|
|
||||
|
.card-top { |
||||
|
height: 68px; |
||||
|
background-image: linear-gradient(0deg, #F3F7FF 84%, #DBE6FF 100%); |
||||
|
border-radius: 4px; |
||||
|
position: relative; |
||||
|
} |
||||
|
|
||||
|
.card-bg { |
||||
|
position: absolute; |
||||
|
top: 0; |
||||
|
right: 11px; |
||||
|
width: 115px; |
||||
|
height: 67px; |
||||
|
} |
||||
|
|
||||
|
.card-left { |
||||
|
margin-left: 23px; |
||||
|
font-weight: 500; |
||||
|
font-size: 16px; |
||||
|
color: #000000d9; |
||||
|
} |
||||
|
|
||||
|
.card-right { |
||||
|
margin-right: 18px; |
||||
|
color: #1684FF; |
||||
|
} |
||||
|
|
||||
|
.card-icon { |
||||
|
width: 30px; |
||||
|
height: 30px; |
||||
|
margin-right: 8px; |
||||
|
} |
||||
|
|
||||
|
.problem-box { |
||||
|
width: 100%; |
||||
|
height: 58px; |
||||
|
padding: 18px; |
||||
|
border-top: 1px solid rgb(238, 237, 237); |
||||
|
box-sizing: border-box; |
||||
|
} |
||||
|
|
||||
|
.problem-title { |
||||
|
width: 30%; |
||||
|
font-size: 14px; |
||||
|
color: #383A3B; |
||||
|
} |
||||
|
|
||||
|
.t-class-label { |
||||
|
font-size: 14px; |
||||
|
color: #383A3B; |
||||
|
} |
||||
|
|
||||
|
.pie-chart-box { |
||||
|
box-sizing: border-box; |
||||
|
width: 100%; |
||||
|
height: 280px; |
||||
|
padding: 0 10px 10px; |
||||
|
} |
Loading…
Reference in new issue