CKQ/pages/risk/rectify/form/form.vue

<template>
	<div class="body">		
		<uni-forms ref="form" label-position="top" :model="formData">
			<uni-forms-item label="处理动作" name="actionId" required>
				<uni-data-checkbox v-model="flowData.actionId" :localdata="actionList" @change="changeCheck"/>
			</uni-forms-item>
			<uni-forms-item label="处理说明" name="rectifyRemark" required>
				<uni-easyinput type="textarea" autoHeight v-model="formData.rectifyRemark" placeholder="请输入描述"></uni-easyinput>
			</uni-forms-item>
			<uni-forms-item label="验收人" name="rectifyAccountId" required>
				<uni-data-select
					v-model="formData.rectifyAccountId"
					:localdata="userList"
				></uni-data-select>
			</uni-forms-item>
			<uni-forms-item label="附件">
				<div class="upload-container">
					<image @click="upload" class="upload" src="/static/icon/upload.png" mode="widthFix"></image>
					<p class="tip">注：单个附件上传不超过10M，附件累计不超过20M</p>					
				</div>
				<view class="preview" v-if="formData.attachList.length>0">
					<image class="preview-item" :src="attach.fileUrl" mode="widthFix" v-for="(attach,index) in formData.attachList" :key="index"></image>
				</view>
			</uni-forms-item>
		</uni-forms>	
		<view class="footer" @click="onSubmit">提交</view>
	</div>
</template>

<script>
	import {getUserByPage} from '@/api/user.js'
	import {upload} from '@/api/index.js'
    import { startWorkflow, getWorkflowById, handleWorkflow } from '@/api/system/wfApi'
	import { updateDanger, getDangerById } from '@/api/dangerApi'
	import {parseTime} from '@/libs'
	export default {
		data() {
			return {
				formData:{
					'hdangerId': undefined,
					'formCode': 'submit',
					'hdangerTitle': '', // 隐患标题
					'dangerCatId': undefined, // 隐患类别ID
					'hdangerLevel': 1, // 隐患等级
					'rectifyRemark': '', // 描述
					'submitTime': parseTime(new Date()),
					'dangerDeadline': '', // 截止时间
					'goafId': undefined,
					'checklistId': '',
					"attachList":[]
				},
				flowData:{
				},
				actionList:[],
				userList:[]
			}
		},
		created() {
			this.init()
		},
		methods: {
			// 获取流程
			get(wfInsId) {
			  // this.resetFormData()
			  getWorkflowById(wfInsId).then((resp) => {
				const { code, data, msg } = resp
				if (code === 0) {
				  this.flowData = data
				  this.flowData.wfDefId = data.wfDefId
				  this.flowData.wfInsId = data.wfInsId
				  this.flowData.activityDefId = data.curActivityIns.activityDefId
				  this.flowData.activityInsId = data.curActivityIns.activityInsId
				  this.flowData.activityCode = data.curActivityIns.activityCode
				  let actionList=this.flowData.curActivityIns.actionList.map(function(item){
					  item.value=item.actionId
					  item.text=item.actionTitle
					  return item
				  })
				  this.actionList=JSON.parse(JSON.stringify(actionList))
				  this.flowData.actionId=actionList[0].actionId
				}
			  })
			},
			init(){
				let data=uni.getStorageSync('submit-data')
				//初始化流程
				let danger_info=uni.getStorageSync('danger-info')
				this.formData={...this.formData,...danger_info}
				this.get(danger_info.hdangerId)
				this.getUser()
				if(data){
					this.formData.checklistId = data.checklistId
					this.formData.goafId = data.goafId
					this.formData.rectifyRemark = data.checkItemNopass
					this.formData.hdangerTitle = data.checkItemNopass		
				}
			},
			async onSubmit(){
				let user=this.userList.filter(item=>item.accountId===this.formData.acceptAccountId)[0]
				if(user){
					this.formData.acceptAccountName = user.accountName
					this.formData.acceptGroupId = user.groupId
					this.formData.acceptGroupName = user.groupName
					this.formData.acceptPositionId = user.positionId
					this.formData.acceptPositionName = user.positionName	
					this.formData.ocId=user.ocId
				}
				if(!this.verify()){
					return
				}
				handleWorkflow({
				    "wfDefId": this.flowData.wfDefId,
				    "wfInsId": this.flowData.wfInsId,
				    "activityDefId": this.flowData.activityDefId,
				    "activityInsId": this.flowData.activityInsId,
				    "activityCode": this.flowData.activityCode,
				    "actionId": this.flowData.actionId,
				    "actionCode": this.flowData.actionCode,
				    "actionRemark": this.formData.rectifyRemark,
					"attachList":this.formData.attachList,
					"groupIdTo": user.groupId,
					"positionIdTo": user.positionId,
					"accountIdTo": user.groupId,
					"groupNameTo": user.groupName,
					"positionNameTo": user.positionName,
					"accountNameTo": user.accountName,
				})
				//renshengkuduan !
				this.formData.status=3
				this.formData.submitTime=parseTime(this.formData.submitTime)
				this.formData.dangerDeadline=parseTime(this.formData.dangerDeadline)
				updateDanger(this.formData).then((resp) => {
					uni.switchTab({
						url:'/pages/risk/risk'
					})
				})
			},
			getUser(){
				getUserByPage({
					page: 1,
					limit: 999999
				}).then((res)=>{
					this.userList=res.data.map(item=>{
						return{
							...item,
							value:item.accountId,
							text:item.accountName
						}
					})
				})
			},
			upload(){
				let self=this;
				uni.chooseImage({
					success:(files)=>{
						let filePath = files.tempFilePaths[0]
						upload({
							filePath
						}).then((res)=>{
							let result=JSON.parse(res);
							let attachList=[result.data]
							self.$set(self.formData,'attachList',attachList)
						})
					}
				})
			},
			verify(){
				let items={
					'rectifyRemark': '处理说明', // 		
				}
				for(let key in items){
					if(this.formData[key]===""||this.formData[key]===undefined||this.formData[key]==="undefined"){
						uni.showToast({
							icon:'none',
							title:`请填写${items[key]}`
						})	
						return false;
					}
				}
				return true
			},
			changeCheck(){
				let actionCode=this.actionList.filter(item=>item.actionId===this.flowData.actionId)[0].actionCode
				this.flowData.actionCode=actionCode
			}
		}
	}
</script>
<style lang="scss" scoped>
.body{
	min-height: 100vh;
	box-sizing: border-box;
	padding:21rpx 16rpx;
	background-color: #F3F5FB;
	padding-bottom: 160rpx;
	.status-item{
		padding: 22rpx 32rpx;
		background-color: #fff;
		font-size: 28rpx;
		line-height: 1;
		display: inline-block;
		color: #434343;
		margin-right: 20rpx;
		border-radius: 2px;
		&.active{
			background: rgba(22, 141, 236, 0.16);
			color:#168DEC ;
		}
	}
	::v-deep .uni-forms-item__content{
		.uni-easyinput,.uni-select{
			background-color: #fff;
		}	
	}
	.upload-container{
		.upload{
			width: 216rpx;
			display: block;
		}
		.tip{
			font-size: 24rpx;
			line-height: 28rpx;
			color: #999999;
			padding-top: 20rpx;
		}
	}
	.footer{
		width: 100%;
		height: 136upx;
		background: #FFFFFF;
		border-radius: 16upx 16upx 0px 0px;
		position: fixed;
		left: 0;
		bottom: 0;
		text-align: center;
		color: #168DEC;
		font-size: 32upx;
		padding-top: 20upx;
		letter-spacing: 2px;
	}
	.preview{
		padding-top: 50rpx;
		.preview-item{
			width: 200rpx;
			height: 200rpx;
		}
	}
}
</style>