<template>
	<div class="app-container">
		<search-bar
			:formConfigs="formConfig"
			ref="searchBarForm"
			@headBtnClick="buttonClick" />
		<base-table
			v-loading="dataListLoading"
			:table-props="tableProps"
			:page="listQuery.pageNo"
			:limit="listQuery.pageSize"
			:table-data="tableData">
			<method-btn
				v-if="tableBtn.length"
				slot="handleBtn"
				:width="140"
				label="操作"
				:method-list="tableBtn"
				@clickBtn="handleClick" />
		</base-table>
		<pagination
			:limit.sync="listQuery.pageSize"
			:page.sync="listQuery.pageNo"
			:total="listQuery.total"
			@pagination="getDataList" />
		<base-dialog
			:dialogTitle="addOrEditTitle"
			:dialogVisible="addOrUpdateVisible"
			@cancel="handleCancel"
			@confirm="handleConfirm"
			:before-close="handleCancel"
			width="50%">
			<add-or-update
				ref="addOrUpdate"
				@refreshDataList="successSubmit"/>
		</base-dialog>
	</div>
</template>

<script>
import AddOrUpdate from './add-or-updata';
import basicPage from '../mixins/basic-page';
import { parseTime } from '../mixins/code-filter';
import { getEquipmentPage } from '@/api/oth/equipment';

const tableProps = [
	{
		prop: 'partCode',
		label: '部件编号',
	},
	{
		prop: 'partName',
		label: '部件名称',
	},
	{
		prop: 'partReplaceLastTime',
		label: '上次更换时间',
		filter: (val)=>parseTime(val,'{y}-{m}-{d}'),
	},
	{
		prop: 'partReplaceTime',
		label: '需要更换时间',
		filter: (val)=>parseTime(val,'{y}-{m}-{d}'),
	},
	{
		prop: 'partCleanLastTime',
		label: '上次清洗时间',
		filter: (val)=>parseTime(val,'{y}-{m}-{d}'),
	},
	{
		prop: 'partCleanTime',
		label: '需要清洗时间',
		filter: (val)=>parseTime(val,'{y}-{m}-{d}'),
	},
	{
		prop: 'partLubricationLastTime',
		label: '上次润滑时间',
		filter: (val)=>parseTime(val,'{y}-{m}-{d}'),
	},
	{
		prop: 'partLubricationTime',
		label: '需要润滑时间',
		filter: (val)=>parseTime(val,'{y}-{m}-{d}'),
	},
];
export default {
	mixins: [basicPage],
	data() {
		return {
			urlOptions: {
				getDataListURL: getEquipmentPage,
			},
			tableProps,
			tableBtn: [
				{
					type: 'up',
					btnName: '更换',
				},
				{
					type: 'clean',
					btnName: '清洗',
				},
				{
					type: 'update',
					btnName: '润滑',
				},
			],
			tableData: [],
			formConfig: [
				{
					type: 'input',
					label: '部件编号',
					placeholder: '部件编号',
					param: 'code',
				},
				{
					type: 'input',
					label: '部件名称',
					placeholder: '部件名称',
					param: 'name',
				},
				{
					type: 'datePicker',
					label: '日期',
					dateType: 'daterange',
					format: 'yyyy-MM-dd',
					valueFormat: 'yyyy-MM-dd HH:mm:ss',
					rangeSeparator: '-',
					startPlaceholder: '开始时间',
					endPlaceholder: '结束时间',
					param: 'searchTime',
				},
				{
					type: 'button',
					btnName: '搜索',
					name: 'search',
					color: 'primary',
				},
				{
					type: 'button',
					btnName: '重置',
					name: 'reset',
				},
			],
		};
	},
	components: { AddOrUpdate },
	created() {
		this.listQuery.warehouseId = undefined;
	},
	methods: {
		buttonClick(val) {
			switch (val.btnName) {
				case 'search':
					this.listQuery.pageNo = 1;
					this.listQuery.pageSize = 10;
					this.listQuery.partCode = val.code;
					this.listQuery.partName = val.name;
					this.listQuery.partReplaceLastTime = val.searchTime;
					this.listQuery.partReplaceTime = val.searchTime;
					this.listQuery.partCleanLastTime = val.searchTime;
					this.listQuery.partCleanTime = val.searchTime;
					this.listQuery.partLubricationLastTime = val.searchTime;
					this.listQuery.partLubricationTime = val.searchTime;
					this.getDataList();
					break;
				case 'reset':
					this.$refs.searchBarForm.resetForm();
					this.listQuery = {
						pageSize: 10,
						pageNo: 1,
						total: 1,
					};
					this.getDataList();
					break;
				default:
					console.log(val);
			}
		},
    //tableBtn点击
    otherMethods(val) {
      if (val.type === "clean") {
        this.addOrUpdateVisible = true;
        this.addOrEditTitle = "清洗";
        this.$nextTick(() => {
          this.$refs.addOrUpdate.init(val.data,2);
        });
      } else if (val.type === "update") {
        this.addOrUpdateVisible = true;
        this.addOrEditTitle = "润滑";
        this.$nextTick(() => {
          this.$refs.addOrUpdate.init(val.data,3);
        });
      } else if (val.type === "up") {
        this.addOrUpdateVisible = true;
        this.addOrEditTitle = "更换";
        this.$nextTick(() => {
          this.$refs.addOrUpdate.init(val.data,1);
        });
      }
    },
	},
};
</script>
