ybxf-security-uniapp/pagesA/fire/hidden_trouble/troble_treatment/troble_treatment.vue

<template>
	<view class="container uni-container">
		<u--form :model="queryParams" ref="queryForm" size="small" :inline="true" labelPosition="left"
			label-width="68px">
			<u-form-item label="处理结果" prop="handleResult">
				<u--input v-model="queryParams.handleResult" placeholder="请输入处理结果" clearable
					@keyup.enter.native="handleQuery" />
			</u-form-item>
			<u-form-item label="处理时间" prop="handleTime" @click="showtimeStart=true; hideKeyboard()">
				<u--input v-model="queryParams.handleTime" placeholder="处理时间" clearable
					@keyup.enter.native="showtimeStart=true" />
				<u-datetime-picker :show="showtimeStart" :value="queryParams.handleTime" mode="date" closeOnClickOverlay
					@confirm="confirmStarttime" @cancel="showtimeStart = false" @change="changetime"
					@close="showtimeStart = false">
				</u-datetime-picker>
			</u-form-item>
			<u-form-item label="复核人员" prop="peo" @click="checkpeoplebox=true; hideKeyboard()">
				<u--input v-model="queryParams.peo" placeholder="请选择复核人员" clearable
					@keyup.enter.native="checkpeoplebox=true" />
			</u-form-item>
			<u-form-item label="处理方式" prop="handleMethod">
				<u-radio-group v-model="queryParams.handleMethod">
					<u-radio :customStyle="{marginRight: '16px'}" v-for="dict in dengerHandle" :key="dict.value"
						:label="dict.label" :name="dict.value">
					</u-radio>
				</u-radio-group>
			</u-form-item>
			<u-form-item>
				<u-button @click="cancel">取消</u-button>
				<u-button type="primary" color="rgb(25, 146, 148)" @click="handleQuery">提交</u-button>
			</u-form-item>
		</u--form>
		<!-- 单位进来转发任务显示人员 -->
		<u-popup :show="checkpeoplebox" :round="10" @close="checkpeoplebox=false" style="position: relative;"
			mode="center">
			<view style="width: 90vw;padding: 10px;">
				<text class="text-xl">检查人员</text>
				<view class="" style="padding-top: 20upx;">
					<u-checkbox-group v-model="queryParams.peoIds" 
						placement="column" @change="checkboxChange" activeColor="rgb(25, 146, 148)">
						<u-checkbox :customStyle="{marginBottom: '8px'}" v-for="(item, index) in personInfo" :key="index" :label="item.nickname" :name="item.id" >
						</u-checkbox>
					</u-checkbox-group>
				</view>
				<view class="flex flex-direction-row ">
					<u-button shape="circle" type="primary" color="#4CB2B6" text="确定" @click="checkboxConfirm2"
						customStyle="margin-right:20px;padding:0 30px">
					</u-button> 
					<u-button type="primary" plain color="#4CB2B6" text="取消" shape="circle"
						@click="checkpeoplebox=false" customStyle="padding:0 30px">
					</u-button>
				</view>
			</view>
		</u-popup>
	</view>
</template>
<script>
	import {
		getOneDenger, // 获得单个隐患详情
		getUserPage,
	} from "@/api/hiddenTrouble";
	import {
		DICT_TYPE,
		getDictDatas
	} from "@/utils/dict";
	let that = null;
	export default {
		data() {
			return {
				// 搜索框显示控制 
				showtimeStart: false,
				// 查询参数
				queryParams: {
					pageNo: 1,
					pageSize: 10,
					handleResult: null,
					handleTime: '',
					status: 0,
					handleMethod: null,
					orgId: null,
					userId: null,
					peoIds:[]
				},
				dengerHandle: getDictDatas(DICT_TYPE.DENGER_HANDLE),
				checkpeoplebox: false, //待完成转发弹窗
				personInfo: [], //转发任务的人员信息
				peoIds:[],
			}
		},
		onShow() {
			this.getPeopleData()
		},
		methods: {
			getPeopleData() {
				getUserPage({
					pageNo: 1,
					pageSize: 10
				}).then(response => {
					this.personInfo = response.data.list
				})
			},
			// 隐藏键盘
			hideKeyboard() {
				uni.hideKeyboard()
			},
			// 开始日期
			confirmStarttime(e) {
				this.showtimeStart = false
				console.log(e.value, e.mode);
				let value = new Date(e.value)
				this.queryParams.handleTime = uni.$u.timeFormat(e.value, 'yyyy/mm/dd');
				// this.$forceUpdate()
			},
			changetime(e) {
				console.log('change', e)
			},
			checkboxChange(e){ 
			 this.peoIds=e
			},
			checkboxConfirm2(){
				this.checkpeoplebox=false
				this.queryParams.peoIds=this.peoIds 
				this.queryParams.peo=''
				this.personInfo.map(i=>{
					this.peoIds.map(k=>{
						console.log("i.id==k,i.id,k: ",i.id==k,i.id,k);
					if(i.id==k) {
						this.queryParams.peo=this.queryParams.peo+i.nickname+' '
					}
					})
				})
				console.log("this.queryParams.peo: ",this.queryParams.peo);
			},
			/** 搜索按钮操作 */
			handleQuery() {
				this.queryParams.pageNo = 1
				this.getData(this.queryParams.pageNo)
			},
			cancel() {
				uni.navigateTo({
					// url: '/pagesA/fire/hidden_trouble/trouble_solve/trouble_solve?id=' + this.formData.id,
					url: '/pagesA/fire/hidden_trouble/trouble_details/trouble_details'
				})
			},
		}
	}
</script>
<style lang="scss" scoped>
	.searchpopup {
		height: 60vh;
		display: flex;
		justify-content: center;
		padding: 20rpx
	}
</style>