zhgdyunapp/pages/projectEnd/dangerBigProject/addFinallyAcceptance.vue

<template>
	<view class="addPlan">
		<headers class="fixedheader" :themeType="true" :showBack="true">
			<view class="headerName">
				{{title}}
			</view>
		</headers>
		<view :style="{ 'padding-top': statusBarHeight + 45 + 'px' }">
			<view class="plan-form">
				<view class="form-item b-bottom">
					<view class="form-lable"><text class="tag">*</text>验收单位</view>
					<picker @change="bindPickerChange" :value="typeIndex" range-key="enterpriseName" :range="enterpriseInfoList">
						<view style="display: flex;align-items: center;">
							<view class="uni-input" style="margin-right: 10px;">{{enterpriseInfoList[typeIndex] ? enterpriseInfoList[typeIndex].name : ""}}</view>
							<uni-icons2 type="arrowright" size="20"></uni-icons2>
						</view>
					</picker>
				</view>
				<view class="form-item b-bottom">
					<view class="form-lable"><text class="tag">*</text>验收人</view>
					<picker @change="bindPickerChange" :value="typeIndex" range-key="name" :range="typeList">
						<view style="display: flex;align-items: center;">
							<view class="uni-input" style="margin-right: 10px;">{{typeList[typeIndex] ? typeList[typeIndex].name : ""}}</view>
							<uni-icons2 type="arrowright" size="20"></uni-icons2>
						</view>
					</picker>
				</view>
				<view class="form-item b-bottom">
					<view class="form-lable"><text class="tag">*</text>验收时间</view>
					<dateTimePicker :placeholder="'请选择验收时间'" :disabled="isDisabled"
					  :start="checkedTime" :fields="'minute'" :default-value="inspectTime"
						@change="bindPickerChange($event,'checkedTime')"
					  class="form-content">
					  <view class="uni-input">
					    <!-- <text>{{addForm.inspectTime}}</text> -->
					  	<uni-icons v-if="!isDisabled" type="arrowright" color="#6C7178" />
					  </view>
					</dateTimePicker>
				</view>
			</view>
		</view>
		<view class="save-btn" @click="saveForm">保存</view>
	</view>
</template>

<script>
	import dateTimePicker from '@/components/dateTimePicker/index.vue'
import { computed } from "vue";
	export default {
		components:{
			dateTimePicker
		},
		data(){
			return{
				projectSn: '',
				enterpriseInfoList: [],
				isDisabled: false,
				checkedTime: '',
				
				statusBarHeight: 0,
				title: "下发验证任务",
				inspectTime:'',
				formData:{
					acceptanceRegion: "",
					acceptanceDescribe: "",
					imgFileList:[],
					acceptanceResult: 1,
					acceptanceType: "",
					dangerousEngineeringId: ""
				},
				textareaLengh: 0,
				typeIndex: "",
				typeList:[{
					id: 1,
					name: '施工条件验收'
				},{
					id: 2,
					name: '危大工程验收'
				}]
			}
		},
		created() {
			this.projectSn = JSON.parse(uni.getStorageSync('projectDetail'))
		},
		onShow(){
			this.statusBarHeight = uni.getStorageSync('systemInfo').statusBarHeight;
		},
		onLoad(val){
			this.formData.dangerousEngineeringId = val.id
			this.getEnterpriseInfoList()
		},
		methods:{
			async getEnterpriseInfoList(){
				await this.sendRequest({
					url:'xmgl/enterpriseInfo/list',
					method:'post',
					data:{
						// engineeringId: this.detailId,
						projectSn: this.projectSn,
					},
					success:res=>{
						uni.hideLoading()
						console.log("xmgl/xzDangerousEngineeringAcceptance/list",res);
						this.enterpriseInfoList = res.result;
						
						
					}
				})
			},
			
			
			checkRadio(val){
				this.formData.acceptanceResult = val
			},
			
			bindTextAreaBlur(e){
				console.log(e)
				this.formData.acceptanceDescribe = e.detail.value
			},
			
			bindInputBlur(e){
				console.log(e)
				this.formData.acceptanceRegion = e.detail.value
			},
			
			uploadImg() {
				var that = this
				uni.chooseImage({
					count: 5 - that.formData.imgFileList.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.formData.imgFileList.push(data)
							}
						});
					}
				})
			},
			
			//删除附件
			deleteImg(val, type) {
				let that = this;
				uni.showModal({
					title: '提示',
					content: '确定删除该附件吗?',
					success: function(res) {
						if (res.confirm) {
							if (type == 1) {
								let fileArr = JSON.parse(JSON.stringify(that.formData.imgFileList));
								fileArr.forEach((item, index) => {
									if (item.url == val.url) {
										fileArr.splice(index, 1)
									}
								})
								that.formData.imgFileList = fileArr;
							} else if (type == 2) {
								let fileArr = JSON.parse(JSON.stringify(that.videoFileList));
								fileArr.forEach((item, index) => {
									if (item.url == val.url) {
										fileArr.splice(index, 1)
									}
								})
								that.videoFileList = fileArr;
							}
			
						} else if (res.cancel) {
							console.log('用户点击取消');
						}
					}
				});
			
			},
			
			//预览图片
			previewImage(url) {
				uni.previewImage({
					urls: [url]
				})
			},
			
			bindLength(e){
				// console.log(e)
				this.textareaLengh = e.detail.value.split('').length
			},
			
			saveForm(){
				// console.log(this.formData)
				let data = {
					acceptanceDescribe: this.formData.acceptanceDescribe,
					acceptanceRegion: this.formData.acceptanceRegion,
					acceptanceResult: this.formData.acceptanceResult,
					acceptanceType: this.formData.acceptanceType,
					dangerousEngineeringId: this.formData.dangerousEngineeringId
				}
				data.createUser = JSON.parse(uni.getStorageSync('userInfo')).userId;
				let arr = []
				this.formData.imgFileList.forEach(item=>{
					arr.push(item.url)
				})
				data.imageUrl = arr.join(',')
				if(data.acceptanceType == ""){
					uni.showToast({
					    title: '请选择验收类型！',
						icon: "none",
						duration: 2000
					});
					return;
				}
				if(data.acceptanceRegion == ""){
					uni.showToast({
					    title: '请输入验收部位！',
						icon: "none",
						duration: 2000
					});
					return;
				}
				console.log(data)
				this.sendRequest({
					url:'xmgl/dangerousEngineeringAcceptanceCheck/add',
					method:'post',
					data: data,
					success:res=>{
						uni.hideLoading()
						if(res.code==200){
							uni.showToast({
								title:'保存成功'
							})
							uni.navigateBack({})
						}
						console.log(res)
					}
				})
			},
			
			bindPickerChange(e){
				this.typeIndex = e.target.value
				this.formData.acceptanceType = this.typeList[e.target.value].id
			}
		}
	}
</script>

<style lang="scss" scoped>
.addPlan{
	min-height: 100%;
	background: #F6F6F6;
	.fixedheader{
		position: fixed;
		top: 0;
		left: 0;
		width: 100%;
		z-index: 2;
	}
	.save-btn{
		position: fixed;
		bottom: 0;
		left: 0;
		width: 100%;
		height: 96rpx;
		background: #2b8df3;
		color: #fff;
		text-align: center;
		line-height: 96rpx;
	}
	.imgBox_wrap {
		display: flex;
		flex-wrap: wrap;
		margin-top: 20rpx;
		width: 100%;
		min-height: 120rpx;
	}
	
	.imgBox {
		width: 120rpx;
		height: 120rpx;
		display: inline-flex;
		position: relative;
		margin-right: 30rpx;
		margin-bottom: 16rpx;
	
		.img {
			width: 100%;
			height: 100%;
			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: 100%;
			height: 100%;
		}
		// .icon-add {
		// 	width: 36rpx;
		// 	height: 36rpx;
		// }
	}
	.b-bottom{
		border-bottom: 1px solid #F6F6F6;
	}
	.f-column{
		flex-direction: column;
	}
	.plan-form{
		padding-top: 20rpx;
		padding-bottom: 96rpx;
		.form-item{
			padding: 28rpx 24rpx;
			display: flex;
			justify-content: space-between;
			align-items: center;
			background: #fff;
			.form-lable{
				white-space: nowrap;
				.tag{
					color: #DD524D;
				}
			}
			.from-input{
				text-align: right;
			}
			.form-result{
				.form-radio{
					display: flex;
					margin-left: 30rpx;
					border: 1px solid #E5E5E5;
					padding: 0;
					border-radius: 12rpx;
					overflow: hidden;
					li{
						list-style: none;
						font-size: 14px;
						background: #EEEEEE;
						text-align: center;
						width: 156rpx;
						padding: 12rpx 0;
					}
					.active-radio{
						background: #2b8df3;
						color: #fff;
					}
				}
			}
		}
		.txt-length{
			color: #888;
			text-align: right;
			margin-top: 20rpx;
			font-size: 14px;
		}
		.form-textarea{
			margin-top: 30rpx;
			width: 100%;
			background: #F8F8F8;
			border: 1px solid #f0f0f0;
			height: 160rpx;
			padding: 20rpx;
			box-sizing: border-box;
			// overflow: auto;
			/deep/uni-textarea{
				width: 100%;
				height: 100%;
				font-size: 28rpx;
				.uni-textarea-compute{
					width: 100%;
					height: 100%;
					overflow: auto;
				}
			}
		}
		.a-none{
			align-items: initial;
		}
	}
}
</style>