<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="120" 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"></add-or-update> </base-dialog> </div> </template> <script> import AddOrUpdate from './add-or-updata'; import basicPage from '../../core/mixins/basic-page'; import { parseTime } from '../../core/mixins/code-filter'; import { getMaterialLogPage, deleteMaterialLog } from '@/api/base/materialUseLog'; const tableProps = [ { prop: 'materialName', label: '物料名称' }, { prop: 'materialCode', label: '物料编码' }, { prop: 'materialDateName', label: '物料批次' }, { prop: 'equipName', label: '使用设备' }, { prop: 'num', label: '使用数量' }, { prop: 'useTime', label: '使用时间', filter: parseTime }, { prop: 'userName', label: '操作人' }, { prop: 'source', label: '数据来源', filter: (val) => ['未知', '手动', '自动'][val] }, { prop: 'remark', label: '备注' } ]; export default { mixins: [basicPage], data() { return { urlOptions: { getDataListURL: getMaterialLogPage, deleteURL: deleteMaterialLog, // exportURL: exportFactoryExcel, }, tableProps, tableBtn: [ this.$auth.hasPermi(`base:material-use-log:update`) ? { type: 'edit', btnName: '编辑', } : undefined, this.$auth.hasPermi(`base:material-use-log:delete`) ? { type: 'delete', btnName: '删除', } : undefined, ].filter((v)=>v), tableData: [], listQuery: { pageSize: 10, pageNo: 1, total: 1, materialName: undefined, useTime: [] }, formConfig: [ { type: 'input', label: '物料名称', placeholder: '物料名称', param: 'name', }, { type: 'datePicker', label: '使用时间段', dateType: 'datetimerange', format: 'yyyy-MM-dd', valueFormat: 'yyyy-MM-dd HH:mm:ss', rangeSeparator: '-', startPlaceholder: '开始时间', endPlaceholder: '结束时间', width: 350, param: 'time', }, { type: 'button', btnName: '查询', name: 'search', color: 'primary' }, { type: 'separate', }, { type: this.$auth.hasPermi('base:material-use-log:create') ? 'button' : '', btnName: '新增', name: 'add', color: 'success', plain: true }, ], }; }, components: { AddOrUpdate, }, created() {}, methods: { // 获取数据列表 getDataList() { this.dataListLoading = true; this.urlOptions.getDataListURL(this.listQuery).then(response => { this.tableData = response.data.records; this.listQuery.total = response.data.total; this.dataListLoading = false; }); }, buttonClick(val) { switch (val.btnName) { case 'search': this.listQuery.pageNo = 1; this.listQuery.pageSize = 10; this.listQuery.materialName = val.name ? val.name : undefined; if (val.time) { this.listQuery.useTime[0] = val.time[0] this.listQuery.useTime[1] = val.time[1] } else { this.listQuery.useTime = [] } this.getDataList(); break; case 'reset': this.$refs.searchBarForm.resetForm(); this.listQuery = { pageSize: 10, pageNo: 1, total: 1, }; this.getDataList(); break; case 'add': this.addOrEditTitle = '新增'; this.addOrUpdateVisible = true; this.addOrUpdateHandle(); break; case 'export': this.handleExport(); break; default: console.log(val); } }, //tableBtn点击 handleClick(val) { if (val.type === "edit") { this.addOrUpdateVisible = true; this.addOrEditTitle = "编辑"; this.$nextTick(() => { this.$refs.addOrUpdate.init(val.data.id); }); } else if (val.type === "delete") { this.deleteHandle(val.data.id, val.data.materialName, val.data._pageIndex) } else if (val.type === "change") { this.changeStatus(val.data.id) } else { this.otherMethods(val) } } }, }; </script>