<!-- 日常观测-->
<template>
	<view class="page-wrap">
		<view class="card">
			<view class="background"></view>
			<view>
				<u--form labelPosition="left" labelWidth="auto" labelAlign="center" :model="model" :rules="rules" ref="wForm" errorType="border-bottom" class="demo-ruleForm">
					<u-form-item required label="尾矿库" prop="TAILING_NAME" borderBottom @click="handleShowSheet({title: '尾矿库选择', name: 'TAILING_NAME'})">
						<u--input disabledColor="#fff" v-model="model.TAILING_NAME" border="none" inputAlign="right" fontSize="14px"></u--input>
						<u-icon style="margin-left: 4px;" slot="right" name="arrow-down"></u-icon>
					</u-form-item>
					<u-form-item label="观测时间" required prop="DATETIME" borderBottom @click="showCheckDate()">
						<u--input disabledColor="#fff" v-model="model.DATETIME" placeholder="请选择观测时间" border="none" inputAlign="right" fontSize="14px"></u--input>
						<u-icon style="margin-left: 4px;" slot="right" name="arrow-down"></u-icon>
					</u-form-item>
					<u-form-item label="观测人" required borderBottom prop="ListUserName" @click="handleShowSheet({title: '观测人选择', name: 'ListUserName'})">
						<u--input disabledColor="#fff" v-model="model.ListUserName" border="none" inputAlign="right" fontSize="14px"></u--input>
						<u-icon style="margin-left: 4px;" slot="right" name="arrow-down"></u-icon>
					</u-form-item>

				</u--form>
			</view>
		</view>
		<view class="card" style="margin-bottom: 100px;">
			<view>
				<u--form labelPosition="left" labelWidth="auto" labelAlign="center" errorType="border-bottom" v-if='model.Nav_ListDetail!=null &&model.Nav_ListDetail.length>0' class="demo-ruleForm">
					<view v-for="item in model.Nav_ListDetail">
						<u-form-item :label='item.Nav_Item.NAME+" ("+item.Nav_Item.UNITE+")"' :prop='item.ITEM_VALUE'>
						</u-form-item>
						<u--input disabledColor="#fff" placeholder="请输入观测值" border="bottom" v-model="item.ITEM_VALUE" fontSize="14px"></u--input>
					</view>

				</u--form>
			</view>
		</view>

		<u-datetime-picker :show="dateTimePickerInfo.showCheckDate" v-model='dateTimePickerInfo.defaultDateTime' @confirm="handleCheckDate" @close="dateTimePickerInfo.showCheckDate = false"
			@cancel="dateTimePickerInfo.showCheckDate = false"></u-datetime-picker>

		<query-selector :multiple="selectorInfo.isMultiple" :show="selectorInfo.showPopup" :defaultChecked="selectorInfo.defaultChecked" :title="selectorInfo.title" :lists="selectorInfo.dataLists" @search="handleSearch"
			@select="handleSelected" @close="selectorInfo.showPopup=false" :total="selectorInfo.totalCount" />

		<view class="bottom-button">
			<u-button type="primary" v-if='(isDIY||(isLoadOK && tableKey === "1"))' @click="FullCheckUpdate" color="#3d4b70">提交</u-button>
		</view>

	</view>
</template>

<script>
	import {
		initFilter,
		extendRule,
		extendInclude,
		guid,
	} from '../../../../utils/common'

	import {
		GetTL037,
		OrderPagedTL037,
		FullUpdateTL037,
		GetItemsByTailingID
	} from '../../../../services/apply/subPages/TL/TLService'

	import {
		UserPagedLimit
	} from '../../../../services/common'

	export default {
		data() {
			return {
				total: 0,
				tableKey: '0',
				TaskID: '',
				AUDIT_OPINION: '',
				ORG_ID: '',
				isDIY: false,
				model: {
					ID: '',
					TaskID: '',
					ORG_ID: '',
					TAILING_NAME: '',
					TAILING_ID: '',
					DATETIME: '',
					Nav_Tailing: {
						NAME: ''
					},
					ListUserName: '',
					Nav_ListUser: [{
						DAYLY_ID: '',
						USER_ID: '',
						ORG_ID: '',
						Nav_User: {
							ID: '',
							NAME: ''
						}
					}],
					//操作需要同时操作 Nav_ListSafeCheckDetailShow
					Nav_ListDetail: [{
						DAYLY_ID: '',
						ITEM_ID: '',
						Nav_Item: {
							ID: '',
							NAME: '',
							UNITE: ''
						},
						ITEM_VALUE: ''
					}] //子表
				},
				isAudit: true,
				isLoadOK: false,
				dateTimePickerInfo: {
					showCheckDate: false,
					dataIndex: undefined,
					defaultDateTime: uni.$u.timeFormat(new Date(), 'yyyy-mm-dd hh:MM:ss'),
					value: ''
				},
				selectorInfo: {
					isSubShow: false,
					isMultiple: false,
					showPopup: false,
					totalCount: 0,
					title: '检查人员',
					itemData: {},
					index: 0,
					dataLists: [],
					defaultText: '',
					defaultValue: '',
					name: '',
					defaultChecked: []
				},

				showDelModalIndex: undefined,
				rules: {
					'TAILING_NAME': {
						type: 'string',
						required: true,
						trigger: ['blur', 'change'],
						message: '请选择尾矿库'
					},
					'DATETIME': {
						type: 'string',
						required: true,
						trigger: ['blur', 'change'],
						message: '请选择观测时间'
					},
					'ListUserName': {
						type: 'string',
						required: true,
						trigger: ['blur', 'change'],
						message: '请选择观测人'
					}
				},
			}
		},
		onLoad(option) {
			this.model.ID = option.ID
			this.model.TaskID = option.taskID
			this.TaskID = option.taskID
			this.tableKey = option.tableKey
			this.ORG_ID = uni.getStorageSync('orgId')
			if (option.ID != null && option.ID != 'null') {
				this.loadData()
			} else {
				this.isLoadOK = true
				this.model.ID = guid()
				this.model.ORG_ID = this.ORG_ID
				this.isDIY = true
				this.model.DATETIME = uni.$u.timeFormat(new Date(), 'yyyy-mm-dd hh:MM:ss')

				var user = uni.getStorageSync('appInfo').User
				this.model.ListUserName = user.NAME
				this.model.Nav_ListUser = []
				this.model.Nav_ListUser.push({
					USER_ID: user.ID,
					DAYLY_ID: this.model.ID,
					Nav_User: user,
					ORG_ID: this.ORG_ID
				})
				this.init()
			}
		},
		methods: {
			async loadData() {
				const orgId = uni.getStorageSync('orgId')
				const json = initFilter(orgId, "", "CODE", 1)
				extendRule(json, 'ID', 1, this.model.ID);
				extendInclude(json, "Nav_Tailing");
				extendInclude(json, "Nav_ListDetail.Nav_Item");
				extendInclude(json, "Nav_ListUser.Nav_User");
				json.IgnoreDataRule = true
				GetTL037(json).then(res => {
					this.model = res
					var ListUserName = ''
					if (this.model.Nav_ListUser != null && this.model.Nav_ListUser.length > 0) {
						this.model.Nav_ListUser.forEach(e => {
							ListUserName += e.Nav_User.NAME + ' '
						})
					}
					this.model.ListUserName = ListUserName
					this.isLoadOK = true
				})
			},
			//
			async init() {
				const orgId = this.ORG_ID
				const json = initFilter(orgId)
				extendRule(json, 'STATE', 1, '20');
				json.IgnoreDataRule = true
				OrderPagedTL037(json).then(res => {
					if (res != null && res.length > 0) {
						this.model.Nav_Tailing = res[0]
						this.model.TAILING_NAME = this.model.Nav_Tailing.NAME
						this.model.TAILING_ID = this.model.Nav_Tailing.ID
						this.GetItemsByTailingID()
					}
				})
			},
			async GetItemsByTailingID() {
				if (this.model.TAILING_ID) {
					let json = initFilter(this.ORG_ID, this.model.TAILING_ID);
					GetItemsByTailingID(json).then(res => {
						if (res != null && res.length > 0) {
							if (res && res.length > 0) {
								res.forEach(e => {
									if (e.ITEM_VALUE == 0) {
										e.ITEM_VALUE = ''
									}
								})
							}
							this.model.Nav_ListDetail = res
						}
					})
				}
			},
			//下拉数据加载
			async handleShowSheet(p) {
				const orgId = uni.getStorageSync('orgId')
				const json = initFilter(orgId, "", "", 0, p.pageIndex ?? 1)
				let dataSelect = []
				// this.selectorInfo.defaultChecked = []
				var defaultChecked = []
				if (p.name == 'TAILING_NAME') {
					this.selectorInfo.isMultiple = false
					const json = initFilter(orgId)
					// extendRule(json, 'STATE', 1, '20');
					json.IgnoreDataRule = true
					dataSelect = await OrderPagedTL037(json).then(res => {
						if (res != undefined && res.length > 0) {
							for (let i = 0; i < res.length; i++) {
								res[i].name = res[i].NAME
								res[i].code = res[i].CODE
							}
						}
						return res
					})
				} else if (p.name == 'ListUserName') {
					this.selectorInfo.isMultiple = true
					if (p.val) {
						extendRule(json, 'NAME', 9, p.val);
					}
					json.Limit = 20
					json.Sort = 'NAME'
					if (p.pageIndex) {
						json.Start = (p.pageIndex - 1) * json.Limit;
					}
					dataSelect = await UserPagedLimit(json).then(res => {
						this.selectorInfo.totalCount = res.TotalCount
						if (res.Data != undefined && res.Data.length > 0) {
							for (let i = 0; i < res.Data.length; i++) {
								res.Data[i].name = res.Data[i].NAME,
									res.Data[i].code = res.Data[i].CODE
							}
						}
						return res.Data
					})
					// this.selectorInfo.defaultChecked = []
					if (this.model.Nav_ListCheckUser != null && this.model.Nav_ListCheckUser.length > 0 && this.model
						.Nav_ListCheckUser[0].Nav_User != null) {
						this.model.Nav_ListCheckUser.forEach(e => {
							if (e.Nav_User != null && e.Nav_User.NAME != null && e.Nav_User.NAME.length > 0)
								defaultChecked.push(e.Nav_User)
						})
					}
				}

				if (defaultChecked == null)
					defaultChecked = []
				if (dataSelect.length) {
					this.selectorInfo = {
						itemData: p.itemData != undefined ? p.itemData : this.selectorInfo
							.itemData, //itemData: p.itemData,  搜索的时候  p.itemData为空  赋值修改 为 她自己本身 this.selectorInfo.itemData
						isMultiple: this.selectorInfo.isMultiple,
						totalCount: this.selectorInfo.totalCount,
						showPopup: true,
						title: p.title,
						name: p.name,
						dataLists: dataSelect,
						defaultChecked: defaultChecked
					}
				} else {
					// 暂无数据
				}
			},

			handleSelected(e) {
				this.selectorInfo.showPopup = false
				if (this.selectorInfo.name == "TAILING_NAME") {
					this.model.Nav_Tailing = e
					this.model.TAILING_NAME = e.NAME
					this.model.TAILING_ID = e.ID
					this.GetItemsByTailingID()
				} else if (this.selectorInfo.name == "ListUserName") {
					this.model.Nav_ListUser = []
					this.model.ListUserName = ''
					if (e && e.length > 0) {
						e.forEach(eu => {
							this.model.ListUserName += (' ' + eu.NAME)
							this.model.Nav_ListUser.push({
								DAYLY_ID: this.model.ID,
								USER_ID: eu.ID,
								ORG_ID: this.ORG_ID,
								Nav_User: eu
							})
						})
					}
				}
			},

			FullCheckUpdate() {
				const ele = this.$refs
				this.modelEdit = JSON.parse(JSON.stringify(this.model))
				ele['wForm'].validate().then(res => {
					this.modelEdit.STATUS = 20
					this.modelEdit.TaskID = this.TaskID
					this.modelEdit.Nav_Tailing = null
					this.modelEdit.Nav_ListUser.forEach(e => {
						e.Nav_User = null
					})
					this.modelEdit.Nav_ListDetail.forEach(e => {
						e.Nav_Item = null
					})

					FullUpdateTL037(this.modelEdit).then(res => {
						if (res) {
							uni.$showMsgFunc('操作成功!', () => {
								uni.navigateBack()
							}, 'success', 1000)
						} else {
							uni.$showErrorInfo('操作失败！')
						}
					})
				}).catch(err => {
					if (err.length > 0) {
						uni.$showErrorInfo(err[0].message)
					} else {
						uni.$showErrorInfo('校验失败！')
					}
				})
			},
			//显示时间控件
			showCheckDate(dataIndex) {
				if (this.model.NAME == '') {
					uni.$showErrorInfo('请先选择隐患通知！')
					return false
				}

				if (this.model.DATETIME == null) {
					this.model.DATETIME = uni.$u.timeFormat(new Date(),
						'yyyy-mm-dd hh:MM:ss')
				}
				this.dateTimePickerInfo = {
					showCheckDate: true,
					dataIndex: dataIndex,
					defaultDateTime: this.model.DATETIME
				}
			},
			//隐藏控件 显示时间
			handleCheckDate(e) {
				let v = uni.$u.timeFormat(e.value, 'yyyy-mm-dd hh:MM:ss')
				const {
					name,
					dataIndex
				} = this.dateTimePickerInfo
				this.dateTimePickerInfo.showCheckDate = false
				this.model.DATETIME = uni.$u.timeFormat(e.value,
					'yyyy-mm-dd hh:MM:ss')
			},
			//数据加载
			handleSearch(val, pageIndex) {
				var p = {
					name: this.selectorInfo.name,
					title: this.selectorInfo.title,
					val: val,
					pageIndex: pageIndex
				}
				this.handleShowSheet(p)
			},
		},
	}
</script>


<style scoped>
	/* @import url("../../../../style/css/editTemplate.css"); */
	.todo-page {
		/* padding: 16px 16px 70px; */
	}

	.background {
		position: fixed;
		top: 0;
		left: 0;
		right: 0;
		bottom: 0;
		background: #edf1fd;
		z-index: -1;
	}

	.card {
		margin: 20px 16px 40px 16px;
		/* border: 1px solid #EBEEF5; */
		padding: 20px 30px 40px 30px;
		/* box-shadow: rgba(0, 0, 0, 0.08) 0px 0px 3px 1px; */
		background-color: #ffffff;
		border-radius: 10px;
	}

	.upload-title {
		font-size: 14px;
		color: #8e8b9c;
		line-height: 22px;
		padding: 8px 0px;
	}

	.demo-ruleForm>>>.u-form-item__body__left__content__label {
		font-size: 14px;
		color: #8e8b9c;
		/* justify-content: flex-start; */
	}

	.demo-ruleForm>>>.u-form-item__body__left__content__ {
		left: -11px;
		top: 0px
	}

	.demo-ruleForm>>>.u-textarea__field {
		font-size: 14px;
	}

	.demo-ruleForm>>>.u-cell__title-text {
		font-size: 14px;
	}

	.bottom-button {
		position: fixed;
		bottom: 0;
		left: 0;
		width: 100%;
		padding: 10px 16px;
		box-sizing: border-box;
		background: #edf1fd;
		z-index: 999;
	}
</style>