588 lines
14 KiB
Vue
Raw Blame History

This file contains ambiguous Unicode characters

This file contains Unicode characters that might be confused with other characters. If you think that this is intentional, you can safely ignore this warning. Use the Escape button to reveal them.

<template>
<view>
<view>
<headers :showBack="true">
<view class="headerName"></view>
{{title}}回复
</headers>
</view>
<view class="content">
<form @submit="formSubmit">
<view class="flex type">
<view class="name"><text class="star">*</text>{{title}}时间</view>
<dateTimePiccker :placeholder="startTime" disabled :start="startTime" fields="minute" @change="bindPickerChange($event,'startTime')" class="dateTimePiccker">
<view class="uni-input uni-select cl" v-if="rectifyTime===''">
请选择 <image class="icon-right" src="/static/icon-right.png"></image>
</view>
<view class="uni-input uni-select" v-else>{{rectifyTime}}
<image class="icon-right" src="/static/icon-right.png"></image>
</view>
</dateTimePiccker>
<!-- <u-picker mode="time" v-model="show" :params="params"></u-picker>
<picker @change="bindPickerChange" mode="date" :value="rectifyTime" class="picker">
<view class="uni-input uni-select cl" v-if="rectifyTime===''">
请选择 <image class="icon-right" src="/static/icon-right.png"></image>
</view>
<view class="uni-input uni-select" v-else>{{rectifyTime}}
<image class="icon-right" src="/static/icon-right.png"></image>
</view>
</picker> -->
</view>
<view class="type flex" v-if="title != '整改'">
<view class=" name">{{title}}结果:</view>
<view class="flex">
<text :class="status==1?'status':''">{{type == 1 ? '未整改':'不合格'}}</text>
<switch :checked="status==2" @change="switchChange"
style="margin: 0 10px;transform: scale(0.74,0.7)" />
<text :class="status==2?'status':''">{{type == 1 ? '已整改':'合格'}}</text>
</view>
</view>
<view class="type flex" v-if="title == '整改'">
<view class="uni-form-label">
<text class="star">*</text>违章人员
</view>
<!-- <picker mode="selector" :range="personList" range-key="workerName" @change="handleChangeRegion"
filterable>
<view class="picker">
<view class="" style="color: #c0c4cc; font-size: 28rpx;" v-if="!violatorId">
请选择
</view>
<view class="" v-else>
{{workerName}}
</view>
</view>
</picker> -->
<g-picker v-model="workerName" :columns="personList" :filter="{label: 'workerName', value: 'id'}" input-align="left" @confirm="handleChangeCharger"></g-picker>
</view>
<view class="uni-form-item">
<view class="uni-form-label">
<text class="star">*</text>补充说明
</view>
<view class="uni-form-input">
<textarea class="textarea" maxlength="-1" placeholder-class="cl" name="inspectContent"
@input='changeTextarea' :value="content" placeholder="请输入"></textarea>
</view>
</view>
<view class="uni-form-item">
<view class="uni-form-label">
<text class="star" v-if="type == 1">*</text>附件
</view>
<view class="uni-form-input imgBox_wrap">
<view class="imgBox" v-show="fileList.length>0" v-for="(item,index) in fileList" :key="index">
<image :src="url_config+'image/'+item.url" class="img"></image>
<view @click="deleteImg(item)" class="deleteImg">×</view>
</view>
<view class="addImgBox" @click="selectImg" v-if="fileList.length<5">
<image src="/static/icon-add.png" class="icon-add"></image>
</view>
</view>
</view>
<view class="flex btn_wrap">
<button class="deleteBtn" @click="deleteFn">取消</button>
<button form-type="submit" type="primary" class="submitBtn">提交</button>
</view>
<!-- <view v-if="type==2 || type==3" class="flex btn_wrap">
<button class="deleteBtn" @click="audit(3)">不通过</button>
<button form-type="submit" type="primary" class="submitBtn">通过</button>
</view> -->
</form>
</view>
<canversCom v-if="openImg" @imgUrl="imgUrl" :imgList="imgList"></canversCom>
</view>
</template>
<script>
import canversCom from "@/pages/videoManage/component/canversCom.vue"
import dateTimePiccker from '@/components/dateTimePicker/index.vue'
export default {
components: {
canversCom,
dateTimePiccker
},
data() {
return {
params: {
year: true,
month: true,
day: true,
hour: true,
minute: true,
second: true
},
show: false,
imgList: {},
openImg: false,
base64Image: '',
title: '',
type: 1, // 1 整改回复 2 审核
stateId: '', //获取到整改单最后一个整改内容id
id: '',
content: '', //回复内容
fileList: [],
rectifyTime: '',
status: 2,
createId: '',
createUser: '',
qualityId: '',
userInfo:'',
startTime: "",
violatorId: "",
workerName: "",
personList: [],
projectSn: "",
}
},
onLoad(option) {
this.startTime = this.$formatDates(new Date().getTime(), 'yyyy-MM-dd HH:mm:ss');
this.rectifyTime = this.$formatDates(new Date().getTime(), 'yyyy-MM-dd HH:mm:ss');
this.userInfo= JSON.parse(uni.getStorageSync('userInfo'))
this.projectSn = JSON.parse(uni.getStorageSync('projectDetail')).projectSn;
this.id = option.id;
this.type = Number(option.type);
this.stateId = Number(option.stateId);
this.createId = option.createId
if (option.type == 1) {
this.title = '整改'
this.getPointAreaFn();
} else if (option.type == 2) {
this.title = '复查'
} else if (option.type == 3) {
this.title = '核验'
}
},
methods: {
// 获取违章人员列表
getPointAreaFn() {
let requestData = {
projectSn: this.projectSn,
};
this.sendRequest({
url: 'xmgl/workerInfo/getLaborManagementInfoList',
method: 'post',
data: requestData,
success: (res) => {
console.log(res);
this.personList = res.result;
},
})
},
// 切换违章人员
handleChangeRegion(e) {
let index = e.detail.value;
let findItem = this.personList[index];
this.violatorId = findItem.id;
this.workerName = findItem.workerName;
console.info(this.enterpriseList, 'enlist')
},
handleChangeCharger(e,values,labels) {
this.violatorId = values.join(',');
this.workerName = labels.join('、');
},
imgUrl(val) {
this.openImg = false
this.imgUpload(val)
this.openImg = true
},
//图片上传请求的接口
imgUpload(baseImg) {
let that = this
let arr = []
that.base64Image = baseImg
let parmars = {
base64Image: that.base64Image
}
this.sendRequest({
url: 'xmgl/upload/uploadBase64',
method: 'post',
header: {
'content-type': 'application/x-www-form-urlencoded' //自定义请求头信息
},
data: parmars,
success: (res) => {
that.fileList[that.fileList.length - 1].url = res.data.imageUrl
}
})
},
//回复内容
changeTextarea(e) {
this.content = e.detail.value;
},
bindPickerChange(e,t) {
console.log('时间选择e',e);
console.log('时间选择t',t);
if(t=='startTime'){
this.rectifyTime = e.f3;
}
},
switchChange(e) {
console.log(e.detail.value)
if (e.detail.value) {
this.status = 2;
} else {
this.status = 1;
}
},
// 获取当前时间
getNewDate() {
var date = new Date();
var seperator1 = "-";
var seperator2 = ":";
var month = date.getMonth() + 1;
var strDate = date.getDate();
if (month >= 1 && month <= 9) {
month = "0" + month;
}
if (strDate >= 0 && strDate <= 9) {
strDate = "0" + strDate;
}
var Hours = date.getHours();
var Minutes = date.getMinutes();
var Seconds = date.getSeconds();
if (Hours >= 0 && Hours <= 9) {
Hours = "0" + Hours;
}
if (Minutes >= 0 && Minutes <= 9) {
Minutes = "0" + Minutes;
}
if (Seconds >= 0 && Seconds <= 9) {
Seconds = "0" + Seconds;
}
var currentdate = date.getFullYear() + seperator1 + month + seperator1 + strDate +
" " + Hours + seperator2 + Minutes +
seperator2 + Seconds;
return currentdate;
},
//上传附件
selectImg() {
var that = this
uni.chooseImage({
count: 5 - that.fileList.length,
success(res) {
const tempFilePaths = res.tempFilePaths;
uni.uploadFile({
url: that.url_config + 'upload/image', //仅为示例,非真实的接口地址
filePath: tempFilePaths[0],
name: 'files',
success: (uploadFileRes) => {
let data = {
name: JSON.parse(uploadFileRes.data).data[0].filename,
url: JSON.parse(uploadFileRes.data).data[0].imageUrl
};
that.fileList.push(data)
uni.getImageInfo({
src: tempFilePaths[0],
success: (resInfo) => {
console.log('传过去啦 resInfo', resInfo)
that.imgList = {
imgUrl: tempFilePaths[0],
imgWidth: resInfo.width,
imgHeight: resInfo.height,
// team:'班组人员',
// name: '张三'
}
that.openImg = true
}
})
that.openImg = false
}
});
}
})
},
//删除附件
deleteImg(val) {
let that = this;
uni.showModal({
title: '提示',
content: '确定删除该附件吗?',
success: function(res) {
if (res.confirm) {
let fileArr = JSON.parse(JSON.stringify(that.fileList));
fileArr.forEach((item, index) => {
if (item.url == val.url) {
fileArr.splice(index, 1)
}
})
that.fileList = fileArr;
} else if (res.cancel) {
console.log('用户点击取消');
}
}
});
},
//提交表单
formSubmit(e) {
if (this.content == '') {
uni.showToast({
title: "请输入回复内容",
icon: "none"
})
return
}
if (this.fileList.length == 0 && this.type == 1) {
uni.showToast({
title: "请上传附件",
icon: "none"
})
return
}
if (this.rectifyTime == '') {
uni.showToast({
title: "请选择时间",
icon: "none"
})
return
}
if (this.violatorId == "" && this.type == 1) {
this.$message.error("请选择违章人员");
return;
}
let time = this.getNewDate()
let data = {
additionalRemarks: this.content,
createTime: time,
status: this.status,
qualityId: this.id,
rectifyTime: this.rectifyTime,
violatorId: this.violatorId,
type: this.type,
fileUrl: JSON.stringify(this.fileList),
createUser: this.userInfo.userId
}
// if (this.stateId){
// data.id = this.stateId
// }
console.log('data传的参数', data)
this.sendRequest({
url: 'xmgl/xzSecurityQualityRectifyRecord/add',
method: 'post',
data: data,
success: res => {
console.log('上传成功res---', res)
let dynamicTitle = `新增${this.title}回复成功`;
if (res.code == 200) {
let dynamicTitleWithActualValue = dynamicTitle.replace('{this.title}', this.title);
uni.showToast({
title: dynamicTitleWithActualValue,
duration: 2000,
icon: 'none',
mask: true,
})
setTimeout(() => {
uni.navigateBack({
url: './list'
})
}, 1200)
} else {
uni.showToast({
title: res.message,
icon: 'none'
})
}
}
})
},
// //审核
// audit(status){
// if(this.content==''){
// uni.showToast({
// title:"请输入回复内容",
// icon:"none"
// })
// return
// }
// if(this.fileList.length==0){
// uni.showToast({
// title:"请上传附件",
// icon:"none"
// })
// return
// }
// let data = {
// auditReplyContent: this.content,
// auditReplyImg:JSON.stringify(this.fileList),
// status:status,
// id:this.stateId,
// inspectId:this.id,
// };
// this.sendRequest({
// url:'xmgl/inspectionRectifyRecord/auditInspectionRectifyRecord',
// data:data,
// method:'post',
// success:res=>{
// if(res.code==200){
// uni.showToast({
// title:"审核成功"
// })
// uni.navigateBack()
// }
// }
// })
// },
//取消
deleteFn() {
uni.showModal({
title: '提示',
content: '确定取消编辑整改回复吗?',
success: function(res) {
if (res.confirm) {
uni.navigateBack({})
} else if (res.cancel) {}
}
})
},
}
}
</script>
<style lang="scss" scoped>
/deep/.headerBox {
text-align: center;
line-height: 40px;
}
.addImgBox {
border: 1px solid rgba(42, 43, 91, 0.1);
background-color: #f6f5f8;
width: 60px;
height: 60px;
display: inline-flex;
align-items: center;
justify-content: center;
border-radius: 10px;
font-size: 12px;
.icon-add {
width: 18px;
height: 18px;
}
}
.flex {
display: flex;
align-items: center;
justify-content: space-around;
}
.type {
font-size: 32rpx;
line-height: 40px;
margin-bottom: 8px;
justify-content: space-between;
white-space: nowrap;
/* border-bottom: 1px solid rgba(194, 194, 194, 0.2); */
}
.cl {
font-size: 30rpx;
}
.picker {
box-sizing: border-box;
font-size: 30rpx;
}
.icon-right {
margin-left: 16rpx;
width: 16rpx;
height: 32rpx;
}
.type .name {
margin-right: 6px;
width: 176rpx;
text-align: right;
}
.content {
padding: 10px 30rpx 0;
box-sizing: border-box;
}
.uni-form-label {
margin: 10px 0;
}
.imgBox_wrap {
display: flex;
flex-wrap: wrap;
}
.imgBox {
width: 60px;
height: 60px;
display: inline-flex;
position: relative;
margin-right: 15px;
margin-bottom: 8px;
.img {
width: 100%;
height: 100%;
border-radius: 10px;
}
.deleteImg {
position: absolute;
right: 3px;
top: -5px;
color: #fff;
}
}
.textarea {
width: 100%;
border-radius: 10px;
border: 1px solid rgba(42, 43, 91, 0.3);
padding: 8px 15px;
box-sizing: border-box !important;
height: 90px;
}
.submitBtn {
font-size: 32rpx;
width: 33%;
line-height: 40px;
height: 42px;
margin: 0;
}
.deleteBtn {
font-size: 32rpx;
width: 33%;
line-height: 36px;
height: 38px;
margin: 0;
}
.btn_wrap {
margin-top: 100px;
}
</style>