liujiangyong
2 years ago
9 changed files with 603 additions and 12 deletions
@ -0,0 +1,443 @@ |
|||
// package/inspectionInput/inspectionInput.js
|
|||
import { addPatrolRecord, getPatrolTemplate, getPatrolPlan } from "../../utils/getApiUrl"; |
|||
import { Request } from "../../common"; |
|||
const moment = require("../../utils/moment"); |
|||
|
|||
Page({ |
|||
/** |
|||
* 页面的初始数据 |
|||
*/ |
|||
data: { |
|||
dataList: '', // 当前巡检计划
|
|||
itemData: '', // 点位
|
|||
address: '', // 当前位置
|
|||
imgUrl: getApp().globalData.imgUrl, |
|||
checkItems: [], // 检查项
|
|||
inspectContent: {}, // 巡检内容
|
|||
/*** 扫码巡检 ***/ |
|||
planList: null, // 巡检计划列表
|
|||
planListVisible: true, |
|||
scenePointId: null, // 当前点位id
|
|||
}, |
|||
|
|||
// 获取巡检计划
|
|||
getPatrolPlan: function (scenePointId) { |
|||
let that = this; |
|||
wx.showLoading({ |
|||
title: '加载中', |
|||
}) |
|||
const userInfo = wx.getStorageSync('userInfo'); |
|||
Request.get(getPatrolPlan(), { userId: userInfo.id }).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 |
|||
})) |
|||
if (!pointPlan.length) { |
|||
wx.showModal({ |
|||
title: '提示', |
|||
content: '你没有当前点位的巡检权限,请联系管理员进行授权', |
|||
showCancel: false, |
|||
success: function () { |
|||
wx.switchTab({ |
|||
url: '/pages/index/index', |
|||
}) |
|||
} |
|||
}) |
|||
} |
|||
that.setData({ |
|||
planList: pointPlan |
|||
}) |
|||
}) |
|||
}, |
|||
|
|||
// 获取巡检模板
|
|||
getPatrolTemplate(templateId) { |
|||
Request.get(getPatrolTemplate(templateId)).then(res => { |
|||
const checkItems = res.rows[0].check_items; |
|||
const inspectContent = {}; |
|||
for (const c of checkItems) { |
|||
inspectContent[c.name] = { |
|||
isNormal: null, |
|||
msgInp: null, |
|||
level: null, |
|||
imgs: [], |
|||
}; |
|||
} |
|||
this.setData({ |
|||
checkItems, |
|||
inspectContent, |
|||
}) |
|||
}) |
|||
}, |
|||
|
|||
onPickerChange(e) { |
|||
const { key } = e.currentTarget.dataset; |
|||
const { value } = e.detail; |
|||
|
|||
this.setData({ |
|||
[`${key}Visible`]: false, |
|||
[`${key}Value`]: value, |
|||
[`${key}Text`]: value.join(' '), |
|||
}); |
|||
|
|||
const curPlan = this.data.planList[e.detail.columns[0].index]; |
|||
this.setData({ |
|||
dataList: curPlan, |
|||
itemData: curPlan.points.find(p => p.id == this.data.scenePointId) |
|||
}); |
|||
this.getPatrolTemplate(curPlan.templateId); |
|||
}, |
|||
|
|||
onPickerCancel(e) { |
|||
const { key } = e.currentTarget.dataset; |
|||
this.setData({ |
|||
[`${key}Visible`]: false, |
|||
}); |
|||
}, |
|||
|
|||
onPlanListPicker() { |
|||
this.setData({ planListVisible: 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) => { |
|||
console.log(res) |
|||
wx.hideLoading(); |
|||
wx.showToast({ |
|||
title: res.errMsg, |
|||
icon: 'none', |
|||
duration: 1000 |
|||
}); |
|||
} |
|||
}); |
|||
}, |
|||
|
|||
handleChangeTwo(e) { |
|||
const isNormal = e.detail.value === 'normal'; |
|||
const inspectContent = this.data.inspectContent; |
|||
inspectContent[e.currentTarget.dataset.item].isNormal = isNormal; |
|||
if (isNormal) { // 清除异常数据
|
|||
inspectContent[e.currentTarget.dataset.item].msgInp = null; |
|||
inspectContent[e.currentTarget.dataset.item].level = null; |
|||
inspectContent[e.currentTarget.dataset.item].imgs = []; |
|||
} |
|||
this.setData({ |
|||
inspectContent, |
|||
}) |
|||
}, |
|||
|
|||
handleChangeThree(e) { |
|||
const inspectContent = this.data.inspectContent; |
|||
inspectContent[e.currentTarget.dataset.item].level = e.detail.value; |
|||
this.setData({ |
|||
inspectContent |
|||
}) |
|||
}, |
|||
|
|||
// 巡查详情
|
|||
bindInput: function (e) { |
|||
const inspectContent = this.data.inspectContent; |
|||
inspectContent[e.currentTarget.dataset.item].msgInp = e.detail.value; |
|||
this.setData({ |
|||
inspectContent |
|||
}) |
|||
}, |
|||
|
|||
// 上传图片
|
|||
chooseImg: function (e) { // 这里是选取图片的方法
|
|||
const that = this; |
|||
let pics = []; |
|||
const detailPics = that.data.inspectContent[e.currentTarget.dataset.item].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) { |
|||
commonJs.showToast('图片大于15M,不可上传'); |
|||
return; |
|||
} |
|||
pics.push(imgs[i].tempFilePath) |
|||
} |
|||
that.uploadimg({ |
|||
url: getApp().globalData.webUrl + '_upload/attachments/project', // 图片上传的接口
|
|||
path: pics, // 选取的图片的地址数组
|
|||
}, e.currentTarget.dataset.item); |
|||
}, |
|||
}) |
|||
}, |
|||
|
|||
//多张图片上传
|
|||
uploadimg: function (data, itemName) { |
|||
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.inspectContent[itemName].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 |
|||
console.log(str); |
|||
if (imgs.length >= 20) { |
|||
const inspectContent = that.data.inspectContent; |
|||
inspectContent[itemName].imgs = imgs; |
|||
that.setData({ |
|||
inspectContent, |
|||
}); |
|||
return false; |
|||
} else { |
|||
imgs.push(str); |
|||
const inspectContent = that.data.inspectContent; |
|||
inspectContent[itemName].imgs = imgs; |
|||
that.setData({ |
|||
inspectContent, |
|||
}) |
|||
} |
|||
}, |
|||
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, itemName); // 递归,回调自己
|
|||
} |
|||
} |
|||
}); |
|||
}, |
|||
|
|||
// 删除图片
|
|||
deleteImg: function (e) { |
|||
let imgs = this.data.inspectContent[e.currentTarget.dataset.item].imgs; |
|||
const index = e.currentTarget.dataset.index; |
|||
imgs.splice(index, 1); |
|||
const inspectContent = this.data.inspectContent; |
|||
inspectContent[e.currentTarget.dataset.item].imgs = imgs; |
|||
this.setData({ |
|||
inspectContent |
|||
}); |
|||
}, |
|||
|
|||
// 预览图片
|
|||
previewImg: function (e) { |
|||
// 获取当前图片的下标
|
|||
const index = e.currentTarget.dataset.index; |
|||
// 所有图片
|
|||
const imgs = this.data.inspectContent[e.currentTarget.dataset.item].imgs; |
|||
wx.previewImage({ |
|||
// 当前显示图片
|
|||
current: imgs[index], |
|||
// 所有图片
|
|||
urls: imgs |
|||
}) |
|||
}, |
|||
|
|||
bindCancel() { |
|||
if (this.data.scenePointId) { |
|||
wx.switchTab({ url: '/pages/index/index' }) |
|||
} else { |
|||
wx.navigateBack(); |
|||
} |
|||
}, |
|||
|
|||
// 开始巡检录入
|
|||
addPatrolRecord: function () { |
|||
const that = this; |
|||
let { |
|||
itemData, |
|||
inspectContent, |
|||
dataList, |
|||
address |
|||
} = that.data; |
|||
let alarm = false; |
|||
|
|||
if (!address) { |
|||
wx.showToast({ |
|||
title: '请获取当前位置', |
|||
icon: 'none', |
|||
duration: 1500 |
|||
}) |
|||
return; |
|||
} |
|||
|
|||
for (const item in inspectContent) { |
|||
if (inspectContent[item].isNormal === null) { |
|||
wx.showToast({ |
|||
title: '请填写完整', |
|||
icon: 'none', |
|||
duration: 1500 |
|||
}) |
|||
return; |
|||
} |
|||
if ((!inspectContent[item].isNormal) && (!inspectContent[item].level || !inspectContent[item].msgInp)) { |
|||
wx.showToast({ |
|||
title: '异常项必须输入巡查详情和选择严重等级', |
|||
icon: 'none', |
|||
duration: 2000 |
|||
}) |
|||
return; |
|||
} |
|||
if (inspectContent[item].isNormal === false) { |
|||
alarm = true; |
|||
} |
|||
} |
|||
|
|||
let data = { |
|||
patrolPlanId: dataList.id, |
|||
pointId: itemData.id, |
|||
lastInspectionTime: itemData.lastInspectionTime, |
|||
inspectionTime: moment().format('YYYY-MM-DD HH:mm:ss'), |
|||
points: { |
|||
user: dataList.user, |
|||
project: dataList.project, |
|||
frequency: dataList.frequency, |
|||
itemData: itemData, |
|||
inspectContent, |
|||
address: address |
|||
}, |
|||
alarm |
|||
} |
|||
Request.post(addPatrolRecord(), data).then(res => { |
|||
wx.showToast({ |
|||
title: '提交成功', |
|||
icon: 'success' |
|||
}) |
|||
setTimeout(() => { |
|||
that.bindCancel(); |
|||
}, 1500) |
|||
}) |
|||
}, |
|||
|
|||
/** |
|||
* 生命周期函数--监听页面加载 |
|||
*/ |
|||
onLoad(options) { |
|||
const that = this; |
|||
const scenePointId = options.scene; |
|||
if (scenePointId) { // 扫小程序码进入
|
|||
const userInfo = wx.getStorageSync('userInfo'); |
|||
if (!userInfo || !userInfo.id) { // 如果没登录,先登录
|
|||
wx.showToast({ title: '请先登录' }) |
|||
wx.reLaunch({ |
|||
url: `/pages/login/login?scene=${scenePointId}` |
|||
}); |
|||
return; |
|||
} |
|||
that.setData({ scenePointId }); |
|||
that.getPatrolPlan(scenePointId); |
|||
} else { // 正常点击进入
|
|||
const dataList = JSON.parse(decodeURIComponent(options.dataList)); |
|||
const itemData = JSON.parse(decodeURIComponent(options.itemData)); |
|||
that.setData({ |
|||
dataList, |
|||
itemData |
|||
}) |
|||
that.getPatrolTemplate(dataList.templateId); |
|||
} |
|||
}, |
|||
|
|||
/** |
|||
* 生命周期函数--监听页面初次渲染完成 |
|||
*/ |
|||
onReady() { |
|||
|
|||
}, |
|||
|
|||
/** |
|||
* 生命周期函数--监听页面显示 |
|||
*/ |
|||
onShow() { |
|||
|
|||
}, |
|||
|
|||
/** |
|||
* 生命周期函数--监听页面隐藏 |
|||
*/ |
|||
onHide() { |
|||
|
|||
}, |
|||
|
|||
/** |
|||
* 生命周期函数--监听页面卸载 |
|||
*/ |
|||
onUnload() { |
|||
|
|||
}, |
|||
|
|||
/** |
|||
* 页面相关事件处理函数--监听用户下拉动作 |
|||
*/ |
|||
onPullDownRefresh() { |
|||
|
|||
}, |
|||
|
|||
/** |
|||
* 页面上拉触底事件的处理函数 |
|||
*/ |
|||
onReachBottom() { |
|||
|
|||
}, |
|||
|
|||
/** |
|||
* 用户点击右上角分享 |
|||
*/ |
|||
onShareAppMessage() { |
|||
|
|||
} |
|||
}) |
@ -0,0 +1,13 @@ |
|||
{ |
|||
"navigationBarBackgroundColor": "#1979ff", |
|||
"navigationBarTextStyle": "white", |
|||
"navigationBarTitleText": "巡检录入", |
|||
"enablePullDownRefresh": false, |
|||
"component": true, |
|||
"usingComponents": { |
|||
"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" |
|||
} |
|||
} |
@ -0,0 +1,52 @@ |
|||
<!-- package/inspectionInput/inspectionInput.wxml --> |
|||
<view class="popBox"> |
|||
<view wx:if="{{planList}}"> |
|||
<t-cell class="block" title="选择巡检计划" arrow hover note="{{planListText}}" bind:click="onPlanListPicker" /> |
|||
<t-picker visible="{{planListVisible}}" value="{{planListValue}}" data-key="planList" title="选择巡检计划" cancelBtn="取消" confirmBtn="确认" bindchange="onPickerChange" bindcancel="onPickerCancel"> |
|||
<t-picker-item options="{{planList}}" format></t-picker-item> |
|||
</t-picker> |
|||
</view> |
|||
<view style="padding:20rpx 30rpx;overflow: hidden;"> |
|||
<view style="float: left;">当前点位:</view> |
|||
<view style="float:left;width:480rpx;text-align: justify;">{{itemData.name}}</view> |
|||
</view> |
|||
<view style="padding:20rpx 30rpx;overflow: hidden;"> |
|||
<view style="float: left;">当前位置:</view> |
|||
<view style="float:left;width:480rpx;text-align: justify;" wx:if="{{address}}"> |
|||
{{address}} |
|||
</view> |
|||
<view style="float:left;width:480rpx;text-align: justify;" bindtap="selfLocation" wx:if="{{!address}}"> |
|||
点击获取当前位置 |
|||
</view> |
|||
</view> |
|||
<view wx:for="{{checkItems}}" wx:key="id"> |
|||
<view class="item-name">{{item.name}}:</view> |
|||
<radio-group style="padding:10px 15px;display:flex;justify-content: space-evenly;" data-item="{{item.name}}" bindchange="handleChangeTwo"> |
|||
<radio style="color:#1979ff;" color="#1979ff" value="normal">正常</radio> |
|||
<radio style="color:#CC0000;" color="#CC0000" value="abnormal">异常</radio> |
|||
</radio-group> |
|||
<textarea style="width: 84%;margin:0 auto;border:2rpx solid #ccc;padding:20rpx;height: 120rpx;border-radius: 10rpx;" placeholder="请输入巡查详情" maxlength="-1" wx:if="{{inspectContent[item.name].isNormal === false}}" data-item="{{item.name}}" bindinput="bindInput"></textarea> |
|||
<radio-group style="padding:10px 15px;display:flex;justify-content: space-evenly;" data-item="{{item.name}}" bindchange="handleChangeThree" wx:if="{{inspectContent[item.name].isNormal === false}}"> |
|||
<radio style="color:#FF9900;" color="#FF9900" value="轻微">轻微</radio> |
|||
<radio style="color:#FF3300;" color="#FF3300" value="中度">中度</radio> |
|||
<radio style="color:#990000;" color="#990000" value="严重">严重</radio> |
|||
</radio-group> |
|||
<view class="weui-uploader" style="padding: 20rpx 30rpx;overflow-y:scroll;" wx:if="{{inspectContent[item.name].isNormal === false}}"> |
|||
<view class="img-v weui-uploader__bd" style="overflow:hidden;"> |
|||
<view class='pic' wx:for="{{inspectContent[item.name].imgs}}" wx:for-item="img" wx:key="*this"> |
|||
<image class='weui-uploader__img showImg' src="{{imgUrl + img}}" data-index="{{index}}" data-item="{{item.name}}" mode="aspectFill" bindtap="previewImg"> |
|||
<icon type='cancel' class="delete-btn" data-index="{{index}}" data-item="{{item.name}}" catchtap="deleteImg"></icon> |
|||
</image> |
|||
</view> |
|||
<!-- 用来提示用户上传图片 --> |
|||
<view class="weui-uploader__input-box pic" data-item="{{item.name}}" bindtap="chooseImg"> |
|||
<image class="upload" src="/images/upload.png" /> |
|||
</view> |
|||
</view> |
|||
</view> |
|||
</view> |
|||
<view class="btnBox"> |
|||
<view class="cancel" bindtap="bindCancel">取消</view> |
|||
<view class="submit" bindtap="addPatrolRecord">提交</view> |
|||
</view> |
|||
</view> |
@ -0,0 +1,69 @@ |
|||
/* package/inspectionInput/inspectionInput.wxss */ |
|||
.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: 30rpx; |
|||
overflow: hidden; |
|||
font-size: 30rpx; |
|||
} |
|||
|
|||
.cancel { |
|||
width: 180rpx; |
|||
float: left; |
|||
text-align: center; |
|||
background: #fff; |
|||
border: 2rpx solid #1979ff; |
|||
border-radius: 10rpx; |
|||
padding: 12rpx 0; |
|||
color: #1979ff; |
|||
} |
|||
|
|||
.submit { |
|||
width: 180rpx; |
|||
float: right; |
|||
text-align: center; |
|||
border-radius: 10rpx; |
|||
padding: 12rpx 0; |
|||
background: #1979ff; |
|||
color: #fff; |
|||
border: 2rpx solid #1979ff; |
|||
} |
|||
|
|||
.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: 160rpx; |
|||
height: 160rpx; |
|||
} |
|||
|
|||
.block { |
|||
display: block; |
|||
} |
Loading…
Reference in new issue