<!-- 
    filename: MaintainRecord.vue
    author: DY
    date: 2023-12-12 13:54:53
    description: 
-->

<template>
	<div class="app-container">
		<!-- 搜索工作栏 -->
		<SearchBar
			:formConfigs="searchBarFormConfig"
			ref="search-bar"
			@select-changed="handleSearchBarChange"
			@headBtnClick="handleSearchBarBtnClick" />
		<WaitingListTable
			ref="waiting-list-table"
			:table-data="list"
			:page="queryParams.pageNo"
			:limit="queryParams.pageSize"
			@edit="handleEdit"
			@detail="handleDetail"
			@delete="handleDelete"
			@confirm="handleConfirm" />

		<!-- 分页组件 -->
		<pagination
			v-show="total > 0"
			:total="total"
			:page.sync="queryParams.pageNo"
			:limit.sync="queryParams.pageSize"
			@pagination="getList" />

		<!-- 对话框(添加) -->
		<base-dialog
			:dialogTitle="title"
			:dialogVisible="open"
			width="60%"
			@close="cancel"
			@cancel="cancel"
			@confirm="submitForm">
			<DialogFormUnplanned
				v-if="open"
				ref="form"
				v-model="form"
				:disabled="mode == 'detail'" />
			<el-row v-if="mode === 'detail'" slot="footer" type="flex" justify="end">
				<el-col :span="12">
					<el-button size="small" class="btnTextStyle" @click="cancel">
						关闭
					</el-button>
				</el-col>
			</el-row>
		</base-dialog>

		<!-- 编辑 -->
		<UnplannedEditDrawer
			ref="unplanned"
			v-if="openUnplannedDrawer"
			@refreshDataList="getList"
			@destroy="openUnplannedDrawer = false" />
		<PlannedEditDrawer
			ref="planned"
			v-if="openPlannedDrawer"
			@refreshDataList="getList"
			@destroy="openPlannedDrawer = false" />

		<RecordDetail
			v-if="recordDetailVisible"
			ref="recordDetailDrawer"
			@destroy="recordDetailVisible = false" />
	</div>
</template>

<script>
import moment from 'moment';
import basicPageMixin from '@/mixins/lb/basicPageMixin';
import DialogFormUnplanned from './WaitingList--add--unplanned.vue';
import UnplannedEditDrawer from './WaitingListUnplanned--edit.vue';
import PlannedEditDrawer from './WaitingListPlanned--edit.vue';
import {
	exportMaintainLogExcel,
} from '@/api/equipment/base/maintain/record';
import WaitingListTable from './WaitingListTable.vue';
import RecordDetail from './Record--detail.vue';

const timeFilter = (val) => moment(val).format('yyyy-MM-DD HH:mm:ss');

const btn = {
	name: 'tableBtn',
	props: ['injectData'],
	data() {
		return {};
	},
	methods: {
		handleClick() {
			this.$emit('emitData', {
				action: this.injectData.label,
				value: this.injectData,
			});
		},
	},
	render: function (h) {
		return (
			<el-button type="text" onClick={this.handleClick}>
				{this.injectData.name}
			</el-button>
		);
	},
};

export default {
	name: 'Confirm',
	components: {
		DialogFormUnplanned,
		WaitingListTable,
		RecordDetail,
		UnplannedEditDrawer,
		PlannedEditDrawer
	},
	mixins: [basicPageMixin],
	data() {
		return {
			recordDetailVisible: false,
			searchBarKeys: [
				'maintainPlanId',
				'startTime',
			],
			tobeConfirmedIdList: [],
			searchBarFormConfig: [
				{
					type: 'select',
					label: '保养计划名称',
					placeholder: '请选择保养计划名称',
					param: 'maintainPlanId',
					defaultSelect: null,
				},
				// 开始结束时间
				{
					type: 'datePicker',
					label: '实际开始时间',
					dateType: 'daterange', // datetimerange
					format: 'yyyy-MM-dd',
					valueFormat: 'yyyy-MM-dd HH:mm:ss',
					rangeSeparator: '-',
					startPlaceholder: '开始日期',
					endPlaceholder: '结束日期',
					defaultTime: ['00:00:00', '23:59:59'],
					param: 'startTime',
					defaultSelect: null,
					// width: 350,
				},
				{
					type: 'button',
					btnName: '查询',
					name: 'search',
					color: 'primary',
				},
				{
					type: (this.$auth.hasPermi('equipment:maintain-confirm:confirm') || this.$auth.hasPermi('equipment:maintain-confirm:confirm') || this.$auth.hasPermi('equipment:maintain-confirm:export')) ? 'separate' : '',
				},
				{
					type: this.$auth.hasPermi('equipment:maintain-confirm:create')
						? 'button'
						: '',
					btnName: '新增',
					name: 'add',
					plain: true,
					color: 'success',
				},
				{
					type: this.$auth.hasPermi('equipment:maintain-confirm:confirm')
						? 'button'
						: '',
					btnName: '批量确认',
					name: 'batchConfirm',
					color: 'primary',
					plain: true,
				},
				{
					type: this.$auth.hasPermi('equipment:maintain-confirm:export')
						? 'button'
						: '',
					btnName: '导出',
					name: 'export',
					plain: true,
					color: 'primary',
				},
				// {
				// 	type: this.$auth.hasPermi('equipment:maintain-record:create')
				// 		? 'button'
				// 		: '',
				// 	btnName: '新增',
				// 	name: 'add',
				// 	plain: true,
				// 	color: 'success',
				// },
			],
			// 是否显示弹出层
			open: false,
			// 查询参数
			queryParams: {
				pageNo: 1,
				pageSize: 20,
				maintainPlanId: null,
				startTime: null,
				special: false,
				confirmed: false,
			},
			// 表单参数
			form: {},
			basePath: '/base/equipment-maintain-log',
			mode: null,
			allSpecialEquipments: [],
			openPlannedDrawer: false,
			openUnplannedDrawer: false,
			openPlannedDrawer: false,
		};
	},
	watch: {
		tobeConfirmedIdList: {
			handler(val) {
				if (val.length == this.list.length) {
					this.$refs['table'].toggleAllSelection();
				}
			},
		},
	},
	created() {
		this.initSearchBar();
		// if (this.$route.query) {
		// 	this.queryParams.specialType =
		// 		this.$route.query?.specialType ?? undefined;
		// 	this.queryParams.equipmentId =
		// 		this.$route.query?.equipmentId ?? undefined;
		// 	this.queryParams.maintainPlanId =
		// 		this.$route.query?.maintainPlanId ?? undefined;
		// 	this.queryParams.relatePlan = this.$route.query?.relatePlan ?? undefined;
		// 	this.queryParams.startTime = this.$route.query?.createTime ?? undefined;
		// 	this.searchBarFormConfig[0].defaultSelect =
		// 		this.$route.query.specialType ?? undefined;
		// 	this.searchBarFormConfig[1].defaultSelect =
		// 		this.$route.query.equipmentId ?? undefined;
		// 	this.searchBarFormConfig[2].defaultSelect =
		// 		this.$route.query.maintainPlanId ?? undefined;
		// 	this.searchBarFormConfig[3].defaultSelect =
		// 		this.$route.query?.createTime ?? undefined;
		// 	this.searchBarFormConfig[4].defaultSelect =
		// 		Number(this.$route.query.relatePlan) ?? undefined;
		// }
		this.getList();
		// if (this.$route.query.addRecord) {
		// 	this.handleAdd();
		// }
	},
	methods: {
		/** 批量确认 */
		async searchBarClicked(btn) {
			switch (btn.btnName) {
				case 'batchConfirm':
					if (this.$refs['waiting-list-table'].selectedPlan.length == 0) {
						this.$message.warning('请选择待确认的设备保养记录');
						return;
					}
					this.$modal
						.confirm('是否确认所有选中保养单"?')
						.then(() => {
							return this.$axios({
								url: '/base/equipment-maintain-log/confirm',
								method: 'put',
								data: this.$refs['waiting-list-table'].selectedPlan.map(
									(item) => item.id
								),
							});
					// if (res.code == 0) {
					// 	this.$message.success('确认成功');
					// 	this.getList();
					// }
						})
						.then((res) => {
							this.getList();
							res.code == 0 && this.$modal.msgSuccess('确认成功');
							res.code != 0 && this.$modal.msgError('确认失败');
						})
						.catch(() => {});
					break;
			}
		},
		handleSelectionChange(list) {
			if (this.tobeConfirmedIdList.length) {
				this.tobeConfirmedIdList = [];
				this.list.forEach((item) => {
					this.handleEmitFun({
						action: 'row-selected',
						value: { row: item, selected: false },
					});
				});
				console.log(
					'清空选择列表',
					this.list.map((item) => item._selection)
				);
			} else {
				this.tobeConfirmedIdList = list.map((item) => item.id);
				this.list.forEach((item) => {
					this.handleEmitFun({
						action: 'row-selected',
						value: { row: item, selected: true },
					});
				});
				console.log(
					'全选',
					this.list.map((item) => item._selection)
				);
			}
		},

		handleEmitFun({ action, value }) {
			switch (action) {
				case '详情':
					this.recordDetailVisible = true;
					this.$nextTick(() => {
						this.$refs.recordDetailDrawer.show({
							id: value.id,
							planMaintainWorker: value.planMaintainWorker,
							maintainWorker: value.maintainWorker,
						});
					});
					break;
				case 'row-selected':
					if (value.selected) {
						this.tobeConfirmedIdList.push(value.row.id);
						value.row._selection = 0b11;
					} else {
						const index = this.tobeConfirmedIdList.indexOf(value.row.id);
						if (index != -1) {
							this.tobeConfirmedIdList.splice(index, 1);
						}
					}
					console.log('tobeConfirmedIdList', this.tobeConfirmedIdList);
					break;
			}
		},

		handleSearchBarChange({ param, value }) {
			console.log('122', param)
			// if ('specialType' === param) {
			// 	if (!value) {
			// 		this.setSearchBarEquipmentList(this.allSpecialEquipments);
			// 		return;
			// 	}
			// 	this.setSearchBarEquipmentList(
			// 		this.allSpecialEquipments.filter((item) => item.specialType == value)
			// 	);
			// }
		},
		initSearchBar() {
			// this.http('/base/core-equipment/listAll', 'get').then(({ data }) => {
			// 	this.allSpecialEquipments = data.filter((item) => item.special);
			// 	this.setSearchBarEquipmentList(data.filter((item) => item.special));
			// });
			this.http('/base/equipment-maintain-plan/page', 'get', {
				pageNo: 1,
				pageSize: 100,
				special: false,
			}).then(({ data }) => {
				this.$set(
					this.searchBarFormConfig[0],
					// this.searchBarFormConfig[2],
					'selectOptions',
					(data?.list || []).map((item) => ({
						name: item.name,
						id: item.id,
					}))
				);
			});
		},
		/** 查询列表 */
		getList() {
			this.loading = true;
			// 执行查询
			this.recv({
				...this.queryParams,
				special: false,
				// relatePlan: 2,
				confirmed: false,
			}).then((response) => {
				this.list = response.data.list;
				this.total = response.data.total;
				this.loading = false;
			});
		},
		/** 取消按钮 */
		cancel() {
			this.open = false;
			this.mode = null;
			this.reset();
		},
		/** 表单重置 */
		reset() {
			this.form = {
				id: null,
				relatePlan: null,
				maintainWorker: [],
				maintainOrderNumber: null,
				departmentId: null,
				lineId: null,
				startTime: null,
				endTime: null,
				planStartTime: null,
				planEndTime: null,
				confirmed: false,
				remark: null,
				special: false,
			};
			this.resetForm('form');
		},
		/** 搜索按钮操作 */
		handleQuery() {
			this.queryParams.pageNo = 1;
			this.getList();
		},
		/** 重置按钮操作 */
		resetQuery() {
			this.resetForm('queryForm');
			this.handleQuery();
		},
		/** 新增按钮操作 */
		handleAdd() {
			// this.reset();
			// this.open = true;
			// this.title = '添加待确认保养记录';
			this.openUnplannedDrawer = true;
			this.$nextTick(() => {
				this.$refs.unplanned.init();
			});
		},

		getConfirmed() {
			return this.$confirm('是否直接确认保养记录', '提示', {
				confirmButtonText: '确定',
				cancelButtonText: '取消',
				type: 'warning',
			});
		},

		/** 提交按钮 */
		submitForm() {
			this.$refs['form'].validate((valid) => {
				if (!valid) {
					return;
				}
				// 修改的提交
				if (this.form.id != null) {
					this.put({
						...this.form,
						maintainWorker: this.form.maintainWorker.join(','),
						special: false,
						relatePlan: 2,
					}).then((response) => {
						this.$modal.msgSuccess('修改成功');
						this.open = false;
						this.getList();
					});
					return;
				}

				// 添加的提交
				this.getConfirmed()
					.then((confirmed) => {
						this.post({
							...this.form,
							maintainWorker: this.form.maintainWorker.join(','),
							special: false,
							relatePlan: 2,
							confirmed: true,
						}).then((response) => {
							this.$modal.msgSuccess('新增成功');
							this.open = false;
							this.getList();
						});
					})
					.catch((err) => {
						this.post({
							...this.form,
							maintainWorker: this.form.maintainWorker.join(','),
							special: false,
							relatePlan: 2,
							confirmed: false,
						}).then((response) => {
							this.$modal.msgSuccess('新增成功');
							this.open = false;
							this.getList();
						});
					});
			});
		},
		/** 确认 */
		async handleConfirm(row) {
			this.$modal
				.confirm('是否确认保养单"' + row.maintainOrderNumber + '"?')
				.then(() => {
					return this.$axios({
						url: '/base/equipment-maintain-log/confirm',
						method: 'put',
						data: [row.id],
					});
			// if (res.code == 0) {
			// 	this.$message.success('确认成功');
			// 	this.getList();
			// }
				})
				.then((res) => {
					this.getList();
					res.code == 0 && this.$modal.msgSuccess('确认成功');
					res.code != 0 && this.$modal.msgError('确认失败');
				})
				.catch(() => {});
		},
		/** 编辑 */
		async handleEdit(row) {
			this.reset();
			if (row.relatePlan == 1) {
				// 计划型
				// const res = await this.info({ id: row.id });
				// this.form = res.data;
				// this.form.maintainWorker = res.data.maintainWorker.split(',');
				this.openPlannedDrawer = true;
				this.$nextTick(() => {
					this.$refs.planned.init(row);
				});
			} else {
				this.openUnplannedDrawer = true;
				this.$nextTick(() => {
					this.$refs.unplanned.init(row);
				});
			}
		},
		/** 删除按钮操作 */
		handleDelete(row) {
			this.$modal
				.confirm(
					'是否确认删除设备保养单号为"' + row.maintainOrderNumber + '"的数据项?'
				)
				.then(() => {
					return this.$axios({
						url: '/base/equipment-maintain-log/delete?id=' + row.id,
						method: 'delete',
					});
				})
				.then(() => {
					this.getList();
					this.$modal.msgSuccess('删除成功');
				})
				.catch(console.error);
		},
		handleDetail(row) {
			this.recordDetailVisible = true;
			this.$nextTick(() => {
				this.$refs.recordDetailDrawer.show({
					id: row.id,
					planMaintainWorker: row.planMaintainWorker,
					maintainWorker: row.maintainWorker,
				});
			});
		},
		/** 导出按钮操作 */
		handleExport() {
			// 处理查询参数
			let params = { ...this.queryParams };
			params.pageNo = undefined;
			params.pageSize = undefined;
			this.$modal
				.confirm('是否确认导出所有待确认的保养记录?')
				.then(() => {
					this.exportLoading = true;
					return exportMaintainLogExcel(params);
				})
				.then((response) => {
					this.$download.excel(response, '设备保养待确认记录.xls');
					this.exportLoading = false;
				})
				.catch(() => {});
		},
	},
};
</script>
