<template>

	<el-dialog
	 :close-on-click-modal="false"
	 :close-on-press-escape="false"
	 :visible.sync="dialogVisible"
	 title="修改当日考勤"
	>
		<el-form ref="elForm" :model="formData" label-width="150px" size="medium">
			<el-form-item label="违规类别" prop="field101">
				<el-checkbox-group v-model="formData.weiGuiType" size="medium">
					<el-checkbox
					 v-for="(item, index) in field101Options"
					 :key="index"
					 :label="item.value"
					>
						{{ item.label }}
					</el-checkbox>
				</el-checkbox-group>
			</el-form-item>
			<el-row>
				<el-form-item label="违规时长说明" prop="field103">
					<el-input v-model="formData.weiguiRemarke" :autosize="{minRows: 4, maxRows: 4}"
										:style="{width: '100%'}"
										placeholder="请输入违规时长说明" type="textarea"
					></el-input>
				</el-form-item>
			</el-row>
			<el-form-item label="出勤类别" prop="happen_type1">
				<el-checkbox-group v-model="formData.chuqingType" size="medium">
					<el-checkbox
					 v-for="(item, index) in field104Options"
					 :key="index"
					 :label="item.value"
					>
						{{ item.label }}
					</el-checkbox>
				</el-checkbox-group>
			</el-form-item>
			<el-form-item label="出勤时长说明" prop="field105">
				<el-input v-model="formData.chuqingRemarke" :autosize="{minRows: 4, maxRows: 4}"
									:style="{width: '100%'}"
									placeholder="请输入出勤时长说明" type="textarea"
				></el-input>
			</el-form-item>
		</el-form>
		<el-row :gutter="15">
			<el-col :col="24">
				<el-table :data="holiadyData" style="width: 100%" border>
					<el-table-column
					 prop="happenTypeString"
					 label="类型"
					 width="100"
					>
					</el-table-column>
					<el-table-column
					 prop="name"
					 label="时间范围"
					>
						<template slot-scope="scope">
							{{ $common.transTime(scope.row.doStartTime) }}至{{ $common.transTime(scope.row.doEndTime) }}
						</template>
					</el-table-column>
					<el-table-column
					 prop="name"
					 label="操作时间"
					>
						<template slot-scope="scope">
							{{ $common.transTime(scope.row.createdAt) }}
						</template>
					</el-table-column>

				</el-table>
			</el-col>
		</el-row>
		<div slot="footer">
			<el-button @click="dialogVisible=false">取消</el-button>
			<el-button type="primary" :loading="buttonStatus" :disabled="buttonStatus" @click="handelConfirm">确定
			</el-button>
		</div>
	</el-dialog>

</template>
<script>
const formData = {
	weiGuiType: [],
	chuqingType: []
}
export default {
	inheritAttrs: false,
	components: {},
	props: [],
	data() {
		return {
			buttonStatus: false,
			holiadyData: [],
			logUserId: null,
			formData: { ...formData },
			dialogVisible: false,
			field101Options: [
				{
					label: '迟到',
					value: 10
				},
				{
					label: '早退',
					value: 11
				},
				{
					label: '旷工',
					value: 12
				}
			],
			field104Options: [
				{
					label: '外出',
					value: 13
				},
				{
					label: '居家',
					value: 14
				},
				{
					label: '出差（离开本市）',
					value: 15
				}

			]
		}
	},
	computed: {},
	watch: {},
	created() {
	},
	mounted() {
	},
	methods: {
		setVisible(val, logUserId, row) {
			try {

				this.buttonStatus = false
				this.formData = { ...formData }
				this.dialogVisible = true
				this.formData.year_month = val.year_month
				this.logUserId = logUserId
				this.holiadyData = val.workAttendanceLogList
				if (val.workAttendanceLogList) {
					let workAttendanceLogList = val.workAttendanceLogList
					// console.log(workAttendanceLogList.length)
					let weiguiId = null   // : workAttendanceLogList[0].id ? workAttendanceLogList[0].id : null,
					let chuqingId = null // : workAttendanceLogList[1].id ? workAttendanceLogList[1].id : null,
					let weiGuiType = [] // : workAttendanceLogList[0].happenType ? workAttendanceLogList[0].happenType : null,
					let chuqingType = [] // : workAttendanceLogList[1].happenType ? workAttendanceLogList[1].happenType : null,
					let weiguiRemarke = null // : workAttendanceLogList[0].remark ? workAttendanceLogList[0].remark : null,
					let chuqingRemarke = null // : workAttendanceLogList[1].remark ? workAttendanceLogList[1].remark : null,

					for (let i = 0; i < workAttendanceLogList.length; i++) {
						let workAttendanceLog = workAttendanceLogList[i]
						console.log(workAttendanceLog.happenType)
						let happenType = workAttendanceLogList[i].happenType
						if (happenType == 11 || happenType == 10 || happenType == 12) {
							weiGuiType.push(workAttendanceLogList[i].happenType)
							weiguiRemarke = workAttendanceLogList[i].remark
						} else if (happenType == 13 || happenType == 14 || happenType == 15) {
							chuqingType.push(workAttendanceLogList[i].happenType)
							chuqingRemarke = workAttendanceLogList[i].remark
						}

						for (let j = 0; j < this.field101Options.length; j++) {
							let oneInfo = this.field101Options[j]
							if (oneInfo.value == workAttendanceLog.happenType) {
								weiguiId = workAttendanceLogList[i].id
							}
						}
						for (let j = 0; j < this.field104Options.length; j++) {
							let twoInfo = this.field104Options[j]
							if (twoInfo.value == workAttendanceLog.happenType) {
								chuqingId = workAttendanceLogList[i].id

							}
						}
					}
					console.log('chuqingTypechuqingTypechuqingType', chuqingType)
					console.log('weiGuiTypeweiGuiTypeweiGuiType', weiGuiType)

					this.formData = {
						year_month: val.year_month,
						weiguiId: weiguiId,
						chuqingId: chuqingId,
						weiGuiType: weiGuiType,
						chuqingType: chuqingType,
						weiguiRemarke: weiguiRemarke,
						chuqingRemarke: chuqingRemarke

						// weiguiId: workAttendanceLogList[0].id ? workAttendanceLogList[0].id : null,
						// chuqingId: workAttendanceLogList[1].id ? workAttendanceLogList[1].id : null,
						// weiGuiType: workAttendanceLogList[0].happenType ? workAttendanceLogList[0].happenType : null,
						// chuqingType: workAttendanceLogList[1].happenType ? workAttendanceLogList[1].happenType : null,
						// weiguiRemarke: workAttendanceLogList[0].remark ? workAttendanceLogList[0].remark : null,
						// chuqingRemarke: workAttendanceLogList[1].remark ? workAttendanceLogList[1].remark : null,
					}
					console.log(this.formData)
				}
				this.$forceUpdate()
			} catch (e) {
				console.log(e)
			}
		},
		baseRequest(opUrl, postData) {
			return this.$channel.globleRequest('WorkAttendanceLogController', opUrl, postData, 'project')
		},
		async handelConfirm() {
			try {
				let array = []
				for (let i = 0; i < this.formData.chuqingType.length; i++) {
					if (this.formData.chuqingType) {
						array.push({
							doDay: this.formData.year_month + ' 00:00:00',
							happenType: this.formData.chuqingType[i],
							remark: this.formData.chuqingRemarke,
							id: !this.formData.chuqingId ? null : this.formData.chuqingId,
							userId: this.logUserId
						})
					}
				}
				for (let i = 0; i < this.formData.weiGuiType.length; i++) {
					if (this.formData.weiGuiType) {
						array.push({
							doDay: this.formData.year_month + ' 00:00:00',
							happenType: this.formData.weiGuiType[i],
							remark: this.formData.chuqingRemarke,
							id: !this.formData.weiguiId ? null : this.formData.weiguiId,
							userId: this.logUserId
						})
					}
				}
				let obj = {
					userId: this.logUserId,
					doDay: this.formData.year_month + ' 00:00:00',
					records: JSON.stringify(array)

				}
				this.buttonStatus = true
				let { data } = await this.baseRequest('addOrEditList', obj)
				this.buttonStatus = false
				if (data.code == 200) {

					this.$message.success('操作成功')
					this.dialogVisible = false
					this.$emit('getData')

				}
			} catch (e) {
				console.log(e)
			}

		}
	}
}

</script>
<style>
</style>
