zhgdyunapp/pages/potentialRisk/potentialRisk.vue

629 lines
14 KiB
Vue
Raw Normal View History

2022-08-02 15:11:04 +08:00
<template>
<view style="background: #f6f6f6;">
<headers :showBack="true">
<view class="headerName">
预警上报
</view>
</headers>
<view class="form_box">
<view class="flex between form_item" style="height: 60rpx;font-size: 24rpx;">
<view class="letBox flex">
<view class="xian">
</view>
<view class="" style="margin-left: 20rpx;">
上报安全隐患
</view>
</view>
</view>
<view class="flex between form_item">
<view class="letBox">
检查类型
</view>
<view class="rigBox">
安全检查
</view>
</view>
<view class="flex between form_item">
<view class="letBox">
报警类型
</view>
<view class="rigBox">
{{alarmType[dangerInfo.alarmType]}}报警
</view>
</view>
<view class="flex between form_item">
<view class="letBox">
报警设备
</view>
<view class="rigBox">
{{dangerInfo.hardwareName}}
</view>
</view>
<view class="flex between form_item">
<view class="letBox">
报警地址
</view>
<view class="rigBox">
{{dangerInfo.location}}
</view>
</view>
<view class="flex between form_item">
<view class="letBox">
整改负责人
</view>
<view class="rigBox" @click="$refs.popup.open()">
{{getUsernames()}}
<image src="../../static/icon-down-black.png" style="width: 30rpx;height: 30rpx;margin-left: 6rpx;" mode=""></image>
</view>
</view>
<view class="flex between form_item">
<view class="letBox">
整改部门
</view>
<view class="rigBox">
安全部
</view>
</view>
<view class="flex between form_item">
<view class="letBox">
要求完成时间
</view>
<picker v-if="userInfo.accountType==5&&dangerInfo.status!=3" mode="date" :start="dangerInfo.createTime" @change="selectDate">
<view>
{{dangerInfo.createTime}}
<image src="../../static/icon-down-black.png" style="width: 30rpx;height: 30rpx;margin-left: 6rpx;" mode=""></image>
</view>
</picker>
<view v-else class="rigBox">
{{dangerInfo.createTime}}
</view>
</view>
<view class="" style="margin: 40rpx 0;">
报警抓拍
</view>
<view class="">
<image class="imgbox" @click="previewImage(url_config+'image/'+dangerInfo.imageUrl)"
:src="url_config+'image/'+dangerInfo.imageUrl" mode=""></image>
</view>
<view class="" v-if="userInfo.accountType==6&&dangerInfo.status!=3">
<view class="form-lable" style="margin-top: 30rpx;">
上传整改图片
</view>
<view class="form-item flex f-column a-start">
<view class="uni-form-input imgBox_wrap">
<view class="addImgBox" @click="uploadImg" v-show="imgFileList.length<3">
<image src="/static/safeMange/upload_image.png" class="icon-add" color="#F56C6C">
</image>
</view>
<view class="imgBox" v-show="imgFileList.length>0" v-for="(item,index) in imgFileList"
:key="index">
<image :src="url_config+'image/'+item.url" class="img"
@click="previewImage(url_config+'image/'+item.url)"></image>
<view v-if="!isDisabled" @click="deleteImg(item,1)" class="deleteImg">
<image src="/static/safeMange/close_icon.png" color="#F56C6C"></image>
</view>
</view>
</view>
</view>
<view class="form-lable" style="margin-top: 30rpx;">
整改说明
</view>
<textarea class="explain" v-model="explain" placeholder="选填" />
</view>
<view class="" style="margin-top: 20rpx;" v-if="dangerInfo.status==3">
<view class="" style="margin: 40rpx 0;">
整改图片
</view>
<view class="uni-form-input imgBox_wrap">
<view class="imgBox" v-for="(item,index) in dangerInfo.correctImage" :key="index">
<image :src="url_config+'image/'+item.url" class="imgBox"
@click="previewImage(url_config+'image/'+item.url)"></image>
</view>
</view>
<view class="form-lable" style="margin-top: 30rpx;">
整改说明
</view>
<textarea class="explain" :disabled="true" v-model="dangerInfo.correctRemark" />
</view>
</view>
<view class="" style="height:200rpx;" v-if="userInfo.accountType==6">
</view>
<view v-if="dangerInfo.status!=3" class="svanbtn" @click="saveBtn">
{{userInfo.accountType==5?'提交':'提交整改'}}
</view>
<uni-popup ref="popup" type="bottom">
<view class="uni-list">
<view class="flex between control">
<view class="">
<text style="font-size: 28rpx;margin-right: 12rpx;">全选</text>
<checkbox :checked="selectAll" @click="selectAllEve" />
</view>
<view class="colse" @click="colse">
关闭
</view>
</view>
<scroll-view scroll-y="true" style="margin-top: 30rpx;height: 320rpx;">
<checkbox-group @change="checkUser" class="checkbox-group">
<label class="uni-list-cell" v-for="user in changeUsers" :key="user.value">
<view class="item">
<checkbox :value="user.userId" :checked="userIds.includes(user.userId)" />
</view>
<view>{{user.realName}}</view>
</label>
</checkbox-group>
</scroll-view>
</view>
</uni-popup>
</view>
</template>
<script>
import headers from "@/components/headers/headers.vue"
import {
dateformat
} from "@/utils/tool.js"
export default {
data() {
return {
dangerInfo: {},
selectAll:false,
alarmType: {
1: "烟感",
2: "明火",
3: "人员倒地",
4: "未戴安全帽",
5: "区域入侵",
6: "越界入侵",
7: "人员聚集衣",
8: "反光衣",
9: "裸土覆盖",
13: "口罩识别",
14: "徘徊预警",
15: "物体滞留监测",
16: "绊线监测"
},
userId: "",
userInfo: {},
isDisabled: false,
imgFileList: [],
explain: "",
detailsId: '',
changeUsers: [],
userIds: [],
backupsUserIds:[]
}
},
watch:{
userIds(n,o){
console.log(n,"=====")
if(n.length==this.backupsUserIds.length){
this.selectAll=true
}else{
this.selectAll=false;
}
}
},
onLoad(op) {
// this.dangerInfo = JSON.parse(decodeURIComponent(op.dangerInfo));
this.detailsId = op.id;
console.log(this.dangerInfo, "url_config")
this.queryTypeList();
this.queryUserData();
this.userInfo = JSON.parse(uni.getStorageSync('userInfo'));
this.userId = this.userInfo.userId;
this.getDeatils();
console.log(this.userInfo);
},
methods: {
selectAllEve(){
this.selectAll=!this.selectAll;
if(this.selectAll){
this.userIds=this.changeUsers.map((item)=>{
return item.userId
})
console.log(this.userIds,"==this.userIds")
}else{
this.userIds=[]
}
},
selectDate(e){
console.log(e,'date=====')
this.dangerInfo.createTime=e.detail.value;
},
colse(){
this.$refs.popup.close()
},
// 多选整改人
checkUser(e) {
const values = e.detail.value;
this.userIds = values
console.log(e, this.userIds);
},
getUsernames() {
const names = this.changeUsers
.filter(user => this.userIds.includes(user.userId))
.map(user => user.realName)
// return names.toString()
console.log(names.toString(), '操cao ');
return names.toString() || '请选择'
},
//获取详情
getDeatils() {
let _this = this;
this.sendRequest({
url: 'xmgl/aiAnalyseHardWareAlarmRecord/getDetails',
method: 'post',
data: {
id: _this.detailsId
},
success: res => {
_this.dangerInfo = res.result;
_this.dangerInfo.createTime = dateformat(_this.dangerInfo.createTime, 'yyyy-MM-dd');
if (_this.dangerInfo.correctImage) {
_this.dangerInfo.correctImage = JSON.parse(_this.dangerInfo.correctImage)
} else {
_this.dangerInfo.correctImage = []
}
}
})
},
//删除附件
deleteImg(val, type) {
let that = this;
uni.showModal({
title: '提示',
content: '确定删除该附件吗?',
success: function(res) {
if (res.confirm) {
let fileArr = JSON.parse(JSON.stringify(that.imgFileList));
fileArr.forEach((item, index) => {
if (item.url == val.url) {
fileArr.splice(index, 1)
}
})
that.imgFileList = fileArr;
} else if (res.cancel) {
console.log('用户点击取消');
}
}
});
},
//预览图片
previewImage(url) {
uni.previewImage({
urls: [url]
})
},
//上传附件
uploadImg() {
var that = this
uni.chooseImage({
count: 3 - that.imgFileList.length,
success(res) {
const tempFilePaths = res.tempFilePaths;
console.log(tempFilePaths, "tempFilePaths")
for (let i in tempFilePaths) {
uni.uploadFile({
url: that.url_config + 'upload/image', //仅为示例,非真实的接口地址
filePath: tempFilePaths[i],
name: 'files',
success: (uploadFileRes) => {
let data = {
name: JSON.parse(uploadFileRes.data).data[0].filename,
url: JSON.parse(uploadFileRes.data).data[0].imageUrl
};
console.log(uploadFileRes)
that.imgFileList.push(data)
},
fail(e) {
console.log(e)
}
});
}
}
})
},
seeImg() {
uni.previewImage({
urls: `${this.url_config}+'image/'+${this.dangerInfo.imageUrl}`
})
},
//获取检查类型
queryTypeList() {
let sn = JSON.parse(uni.getStorageSync('userInfo')).headquartersSn
let _this = this
this.sendRequest({
url: 'xmgl/inspectType/list',
method: 'post',
data: {
sn: sn
},
success: res => {
let typeList = res.result
let tres= typeList.find(item => item.inspectTypeName == "安全检查");
if(tres){
_this.inspectTypeId=tres.id
}
console.log(_this.inspectTypeId, '-----检查类型')
}
})
},
queryUserData() {
let _this = this
this.sendRequest({
url: 'xmgl/systemUser/getProjectChilderSystemUserList',
method: 'post',
data: {
projectSn: JSON.parse(uni.getStorageSync('userInfo')).sn
},
success: res => {
_this.changeUsers = res.result
_this.userIds = res.result[0].userId;
_this.backupsUserIds=_this.changeUsers.map((item)=>{
return item.userId
})
console.log(res.result, '-----检查人')
}
})
},
saveBtn() {
let imageUrl = `${this.url_config}+'image/'+${this.dangerInfo.imageUrl}`
// let data = {
// projectSn: this.dangerInfo.projectSn, //项目编号
// reviewId: this.userId, //核查人ID--
// createUser: this.userId, //创建人
// dangerDesc: this.alarmType[this.dangerInfo.alarmType], //报警信息
// status: 2, //整改状态 1无需整改2待整改3待复查4合格5不合格
// dutyRegion: this.dangerInfo.location, //地址
// engineeringId: "", //工程id
// inspectTypeId: this.inspectTypeId, //检查类型
// imageUrl: imageUrl,
// recordType: 1,
// changeLimitTime: dateformat(this.dangerInfo.createTime, 'yyyy-MM-dd'), //更改限制时间
// checkItem: "安全管理", //项目
// checkSubitem: "安全生产责任制",
// // changeUser: "1541226669983522817",
// changeUser: this.changeUser.userId,
// faultLevel: 1,
// hiddenDangerLevel: "二级",
// checkContent: this.alarmType[this.dangerInfo.alarmType],
// enterpriseSn: '',
// rectifyRequire: ""
// };
// this.dangerInfo.correctImage=JSON.stringify(this.dangerInfo.correctImage);
let data = {
...this.dangerInfo
};
if (this.userInfo.accountType == 5) {
data.reType = 1;
data.rectification_person_id = this.userIds
} else if (this.userInfo.accountType == 6) { //整改人需要的字段
data.correctImage = JSON.stringify(this.imgFileList);
data.correctRemark = this.explain;
data.reType = 2;
}
this.sendRequest({
url: 'xmgl/aiAnalyseHardWareAlarmRecord/rectification',
method: 'post',
data: data,
success: (res) => {
if (res.code == 200) {
uni.showToast({
title: '提交成功'
}), uni.navigateBack({})
}
console.log(res.result)
}
})
}
}
}
</script>
<style lang="less" scoped>
.flex{
display: flex;
}
.flex_end{
justify-content: flex-end;
}
.between{
justify-content: space-between;
}
.control{
padding:0 30rpx;
}
.colse{
font-size: 28rpx;
}
.explain {
padding: 12rpx;
font-size: 28rpx;
background-color: #F7F7F7;
margin-top: 20rpx;
border-radius: 20rpx;
height: 120rpx;
}
.imgBox_wrap {
display: flex;
flex-wrap: wrap;
margin-top: 20rpx;
width: 75%;
min-height: 120rpx;
}
.imgBox {
width: 120rpx;
height: 120rpx;
display: inline-flex;
position: relative;
margin-right: 30rpx;
margin-bottom: 16rpx;
.img {
width: 120rpx;
height: 120rpx;
border-radius: 12rpx;
}
.deleteImg {
position: absolute;
right: -12rpx;
top: -18rpx;
uni-image {
width: 20rpx;
height: 20rpx;
}
}
}
.addImgBox {
border: 1px solid rgba(42, 43, 91, 0.1);
background-color: #f6f5f8;
width: 120rpx;
height: 120rpx;
display: inline-flex;
align-items: center;
justify-content: center;
border-radius: 20rpx;
font-size: 24rpx;
margin-right: 12rpx;
uni-image {
width: 120rpx;
height: 120rpx;
}
}
page {
background-color: #f6f6f6;
}
.imgbox {
width: 176rpx;
height: 176rpx;
border-radius: 20rpx;
}
.svanbtn {
width: 100%;
background-color: #007AFF;
color: #fff;
text-align: center;
font-size: 28rxp;
line-height: 80rpx;
height: 80rpx;
position: fixed;
bottom: 0;
left: 0;
}
.xian {
height: 30rpx;
width: 6rpx;
background-color: #007AFF;
}
.form_box {
padding: 20rpx;
background-color: #fff;
margin: 20rpx;
border-radius: 8rpx;
.form_item {
width: 100%;
font-size: 28rpx;
height: 80rpx;
border-bottom: 2rpx solid #F7F7F7;
}
}
.flex {
display: flex;
align-items: center;
}
.center {
justify-content: center;
}
.between {
justify-content: space-between;
}
.warp {
flex-wrap: wrap;
}
.evenly {
justify-content: space-evenly;
}
.uni-popup {
position: absolute;
top: 0;
width: 100%;
height: 667px;
}
.uni-list {
// position: absolute;
// bottom: -667px;
padding-top: 20px;
width: 100%;
height: 420px;
background-color: #fff;
.checkbox-group {
// height: 260px;
}
}
.uni-list-cell {
margin-bottom: 10px;
padding-left: 20px;
display: flex;
align-items: center;
}
</style>