393 lines
9.8 KiB
Vue
393 lines
9.8 KiB
Vue
<template>
|
|
<view class="fullHeight">
|
|
<headers :showBack="true">
|
|
<view class="headerName">
|
|
{{pageTitle}}
|
|
</view>
|
|
</headers>
|
|
<view class="formBox">
|
|
<form @submit="formSubmit">
|
|
<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="form.inspectContent" placeholder="请输入"></textarea>
|
|
</view>
|
|
</view>
|
|
<view class="uni-form-item">
|
|
<view class="uni-form-label">
|
|
<text class="star">*</text>检查位置
|
|
</view>
|
|
<view class="uni-form-input">
|
|
<input class="uni-input" placeholder-class="cl" name="inspectPlace" @input='changeInput'
|
|
:value="form.inspectPlace" placeholder="请输入" />
|
|
</view>
|
|
</view>
|
|
<view class="uni-form-item">
|
|
<view class="uni-form-label" style="padding-left: 24rpx; box-sizing: border-box;">
|
|
附件
|
|
</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>
|
|
<uni-icons2 @click="deleteImg(item)" class="deleteImg" type="clear" size="24"></uni-icons2>
|
|
</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="uni-form-item">
|
|
<view class="uni-form-label" style="padding-left: 24rpx; box-sizing: border-box;">
|
|
是否需要整改
|
|
</view>
|
|
<switch :checked="form.isRectify" @change="switchChange" />
|
|
</view>
|
|
<view class="uni-form-item" v-if="form.isRectify">
|
|
<view class="uni-form-label">
|
|
<text class="star">*</text>整改人
|
|
</view>
|
|
<view class="uni-form-input">
|
|
<picker @change="bindPickerChange" :value="selectIndex" :range="personList"
|
|
range-key="workerName">
|
|
<view class="uni-input uni-select cl" v-if="selectIndex==null">
|
|
请选择 <image class="icon-down" src="/static/icon-down-black.png" mode=""></image>
|
|
</view>
|
|
<view class="uni-input uni-select" v-else>{{personList[selectIndex].workerName}}
|
|
<image class="icon-down" src="/static/icon-down-black.png" mode=""></image>
|
|
</view>
|
|
</picker>
|
|
</view>
|
|
</view>
|
|
|
|
<view class="uni-form-item" v-if="form.isRectify">
|
|
<view class="uni-form-label">
|
|
<text class="star">*</text>整改结束时间
|
|
</view>
|
|
<view class="">
|
|
<!-- <picker mode ="date"></picker> -->
|
|
<dateTimePiccker placeholder="请选择整改结束时间" :start="startTime"
|
|
fields="day" @change="changeDatetimePicker($event,'startTime')"
|
|
class="dateTimePiccker"></dateTimePiccker>
|
|
</view>
|
|
</view>
|
|
|
|
<!-- <view class="uni-form-item" v-if="form.isRectify">
|
|
<view class="uni-form-label">
|
|
<text class="star">*</text>整改结束时间
|
|
</view>
|
|
<view class="">
|
|
<dateTimePiccker placeholder="请选择结束时间" :start="endTime"
|
|
fields="minute" @change="changeDatetimePicker($event,'endTime')"
|
|
class="dateTimePiccker"></dateTimePiccker>
|
|
</view>
|
|
</view> -->
|
|
|
|
|
|
|
|
|
|
<button form-type="submit" type="primary" class="btn submitBtn big">保存</button>
|
|
<button class="btn deleteBtn" v-show="!isAdd" @click="deleteFn">删除</button>
|
|
</form>
|
|
</view>
|
|
</view>
|
|
</template>
|
|
|
|
<script>
|
|
import dateTimePiccker from '@/components/dateTimePicker/index.vue'
|
|
export default {
|
|
components: {
|
|
dateTimePiccker
|
|
},
|
|
data() {
|
|
return {
|
|
startTime: '',
|
|
endTime: '',
|
|
maxEndTime: '',
|
|
|
|
startTimeVal: '',
|
|
endTimeVal: '',
|
|
pageTitle: '新增巡检',
|
|
projectDetail: {},
|
|
personList: [],
|
|
form: {
|
|
isRectify: true,
|
|
inspectContent: "",
|
|
imgUrl: "",
|
|
inspectPlace: "",
|
|
inspector: "",
|
|
rectifyPeople: "", //整改人
|
|
},
|
|
selectIndex: null,
|
|
fileList: [],
|
|
isAdd: true,
|
|
}
|
|
},
|
|
|
|
onLoad(options) {
|
|
this.projectDetail = JSON.parse(uni.getStorageSync('projectDetail'));
|
|
this.getPersonList();
|
|
|
|
// 初始化时间选择范围
|
|
this.startTime = this.$formatDates(new Date().getTime());
|
|
this.endTime = this.$formatDates(new Date().getTime() + 1800000);
|
|
this.maxEndTime = this.$formatDates(new Date().getTime() + 3 * 86400000);
|
|
|
|
},
|
|
mounted() {
|
|
|
|
|
|
},
|
|
methods: {
|
|
changeDatetimePicker(date, t) {
|
|
console.log('选择的日期时间数据：', date, t);
|
|
// this.endTime = this.$formatDates(date.f10 + 1800000);
|
|
this.endTime = this.$formatDates(date.f10,'yyyy-MM-dd')
|
|
console.log('整改结束时间',this.endTime)
|
|
this.maxEndTime = this.$formatDates(date.f10 + (3 * 86400000));
|
|
if (t == 'startTime') {
|
|
this.startTimeVal = date.f3
|
|
// this.startTimeValNum = date.f10;
|
|
|
|
}
|
|
// else if (t == 'endTime') {
|
|
// this.endTimeVal = date.f3;
|
|
// // this.endTimeValNum = date.f10;
|
|
|
|
// }
|
|
},
|
|
//获取整改人列表
|
|
getPersonList() {
|
|
let that = this;
|
|
console.log(that.projectDetail)
|
|
this.sendRequest({
|
|
url: 'xmgl/systemUser/getProjectChilderSystemUserList',
|
|
method: 'post',
|
|
data: {
|
|
projectSn: that.projectDetail.projectSn
|
|
},
|
|
success: res => {
|
|
this.personList = res.result;
|
|
}
|
|
})
|
|
},
|
|
|
|
//输入内容
|
|
changeTextarea(e) {
|
|
this.form.inspectContent = e.detail.value;
|
|
},
|
|
//输入位置
|
|
changeInput(e) {
|
|
this.form.inspectPlace = e.detail.value;
|
|
},
|
|
|
|
//是否需要整改
|
|
switchChange(e) {
|
|
this.form.isRectify = e.detail.value;
|
|
if (!e.detail.value) {
|
|
this.selectIndex = null;
|
|
}
|
|
},
|
|
//整改人选择
|
|
bindPickerChange(e) {
|
|
console.log(e)
|
|
this.selectIndex = e.detail.value;
|
|
},
|
|
//上传附件
|
|
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)
|
|
}
|
|
});
|
|
}
|
|
})
|
|
},
|
|
//删除附件
|
|
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) {
|
|
let data = JSON.parse(JSON.stringify(this.form));
|
|
console.log(data)
|
|
if (data.inspectContent == '') {
|
|
uni.showToast({
|
|
title: '请输入检查内容',
|
|
duration: 2000,
|
|
icon: "none"
|
|
});
|
|
return
|
|
}
|
|
if (data.inspectPlace == '') {
|
|
uni.showToast({
|
|
title: '请输入检查位置',
|
|
duration: 2000,
|
|
icon: "none"
|
|
});
|
|
return
|
|
}
|
|
|
|
// if(this.fileList.length==0){
|
|
// uni.showToast({
|
|
// title: '请上传附件',
|
|
// duration: 2000,
|
|
// icon:"none"
|
|
// });
|
|
// return
|
|
// }
|
|
if (data.isRectify && this.selectIndex == null) {
|
|
uni.showToast({
|
|
title: '请选择整改人',
|
|
duration: 2000,
|
|
icon: "none"
|
|
});
|
|
return
|
|
}
|
|
// if (!this.startTimeVal) {
|
|
// uni.showToast({
|
|
// title: '请选择开始时间',
|
|
// duration: 2000,
|
|
// icon: "none"
|
|
// });
|
|
// return
|
|
// }
|
|
|
|
if (!this.startTimeVal) {
|
|
uni.showToast({
|
|
title: '请选择结束时间',
|
|
duration: 2000,
|
|
icon: "none"
|
|
});
|
|
return
|
|
}
|
|
|
|
data.rectifyPeople = data.isRectify ? this.personList[this.selectIndex].userId : '';
|
|
data.imgUrl = this.fileList.length > 0 ? JSON.stringify(this.fileList) : '';
|
|
data.isRectify = data.isRectify ? 0 : 1;
|
|
data.projectSn = this.projectDetail.projectSn;
|
|
data.inspector = JSON.parse(uni.getStorageSync('userInfo')).userId;
|
|
//新增开始和结束时间
|
|
// data.rectificationStartsDate=this.startTimeVal;
|
|
// data.rectificationEndDate=new Date(this.startTimeVal);
|
|
data.rectificationEndDate=this.endTime
|
|
|
|
this.sendRequest({
|
|
url: 'xmgl/inspectionRecord/add',
|
|
method: 'post',
|
|
data: data,
|
|
success: res => {
|
|
if (res.code == 200) {
|
|
uni.showToast({
|
|
title: '新增成功',
|
|
duration: 2000,
|
|
})
|
|
uni.navigateBack({})
|
|
}
|
|
}
|
|
})
|
|
|
|
},
|
|
|
|
deleteFn() {
|
|
|
|
},
|
|
|
|
}
|
|
}
|
|
</script>
|
|
|
|
<style lang="scss" scoped>
|
|
.flex {
|
|
display: flex;
|
|
|
|
}
|
|
.dateTimePiccker{
|
|
font-size:32rpx
|
|
}
|
|
.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;
|
|
|
|
.icon-add {
|
|
width: 36rpx;
|
|
height: 36rpx;
|
|
}
|
|
}
|
|
|
|
.imgBox_wrap {
|
|
display: flex;
|
|
flex-wrap: wrap;
|
|
}
|
|
|
|
.imgBox {
|
|
width: 120rpx;
|
|
height: 120rpx;
|
|
display: inline-flex;
|
|
position: relative;
|
|
margin-right: 30rpx;
|
|
margin-bottom: 16rpx;
|
|
|
|
.img {
|
|
width: 100%;
|
|
height: 100%;
|
|
border-radius: 20rpx;
|
|
}
|
|
|
|
.deleteImg {
|
|
position: absolute;
|
|
right: -20rpx;
|
|
top: -20rpx;
|
|
}
|
|
}
|
|
|
|
.textarea {
|
|
width: calc(100% - 64rpx);
|
|
border-radius: 20rpx;
|
|
border: 1px solid rgba(42, 43, 91, 0.3);
|
|
padding: 8px 30rpx;
|
|
box-sizing: border-box;
|
|
height: 180rpx;
|
|
}
|
|
</style>
|