<template> <a-card size="small" :bordered="false" class="exportCheckList-wrap"> <a-spin :spinning="spinning" tip="Loading..."> <!-- 搜索条件 --> <div ref="tableSearch"> <a-form-model id="exportCheckList-form" ref="ruleForm" class="form-model-con" :model="queryParam" :rules="rules" :labelCol="labelCol" :wrapperCol="wrapperCol" @keyup.enter.native="handleSearch" > <a-row :gutter="15"> <a-col :md="12" :sm="24"> <a-form-model-item label="选择盘点单" prop="checkWarehouseSn"> <a-select id="exportCheckList-print" v-model="queryParam.checkWarehouseSn" placeholder="请选择盘点单" allowClear> <a-select-option v-for="item in checkList" :value="item.checkWarehouseSn" :key="item.checkWarehouseSn"> <span>{{ item.financeAuditTime }} - {{ item.checkWarehouseNo }}</span> </a-select-option> </a-select> </a-form-model-item> </a-col> </a-row> <a-row :gutter="15"> <a-col :md="12" :sm="24"> <a-form-model-item label="选择仓库" prop="warehouseSn"> <warehouse v-model="queryParam.warehouseSn" id="exportCheckList-warehouseSn" placeholder="请选择仓库" /> </a-form-model-item> </a-col> </a-row> <a-form-model-item :wrapper-col="{ span: 12, offset: 6 }"> <a-button type="primary" class="button-warning" @click="handleExport" :disabled="disabled" :loading="exportLoading" id="exportCheckList-export">导出</a-button> <a-button @click="cancel" style="margin-left: 15px" id="chooseCustom-btn-back">重置</a-button> </a-form-model-item> </a-form-model> </div> </a-spin> </a-card> </template> <script> import { commonMixin } from '@/utils/mixin' import { STable, VSelect } from '@/components' import { checkWarehouseExcelList, checkWarehouseExport } from '@/api/checkWarehouse' import warehouse from '@/views/common/chooseWarehouse.js' import { hdExportExcel } from '@/libs/exportExcel' export default { name: 'ExportCheckList', mixins: [commonMixin], components: { STable, VSelect, warehouse }, data () { return { spinning: false, tableHeight: 0, labelCol: { span: 8 }, wrapperCol: { span: 16 }, queryParam: { // 查询条件 checkWarehouseSn: undefined, warehouseSn: undefined }, rules: { checkWarehouseSn: [{ required: true, message: '请选择盘点单', trigger: 'change' }], warehouseSn: [{ required: true, message: '请选择仓库', trigger: 'change' }] }, disabled: false, // 查询、重置按钮是否可操作 exportLoading: false, checkList: [] } }, methods: { getList () { checkWarehouseExcelList().then(res => { if (res.status == 200) { this.checkList = res.data || [] } else { this.checkList = [] } }) }, // 导出 handleExport () { const _this = this this.$refs.ruleForm.validate(valid => { if (valid) { const params = _this.queryParam _this.exportLoading = true _this.spinning = true hdExportExcel(checkWarehouseExport, params, '导出盘点', function () { _this.exportLoading = false _this.spinning = false }) } else { console.log('error submit!!') return false } }) }, cancel(){ this.queryParam.checkWarehouseSn = undefined this.queryParam.warehouseSn = undefined this.$refs.ruleForm.resetFields() }, pageInit () { this.cancel() this.getList() } }, mounted () { if (!this.$store.state.app.isNewTab) { // 页签刷新时调用 this.pageInit() } }, activated () { // 如果是新页签打开,则重置当前页面 if (this.$store.state.app.isNewTab) { this.pageInit() } // 仅刷新列表,不重置页面 if (this.$store.state.app.updateList) { this.pageInit() } }, beforeRouteEnter (to, from, next) { next(vm => {}) } } </script> <style lang="less"> .exportCheckList-wrap{ height: 99%; .form-model-con{ margin-top: 50px; } } </style>