|  |  | 
 |  |  | <template> | 
 |  |  |   <div class="main_app"> | 
 |  |  |     <QueryForm v-model="filters" :query-form-config="queryFormConfig" @handleQuery="getList(1)" @clear="clear" /> | 
 |  |  |     <div class="mt20"> | 
 |  |  |       <el-button @click="handleEx" v-permissions="['business:ywstock:exportExcel']">导出</el-button> | 
 |  |  |     </div> | 
 |  |  |     <el-table v-loading="loading" :data="list" stripe> | 
 |  |  |       <el-table-column prop="materialId" label="资产编码" min-width="100" show-overflow-tooltip /> | 
 |  |  |       <el-table-column prop="materialName" label="资产名称" min-width="100" show-overflow-tooltip /> | 
 |  |  |       <el-table-column prop="materialQrcode" label="条码" min-width="100" show-overflow-tooltip /> | 
 |  |  |       <el-table-column prop="materialBrand" label="品牌" min-width="100" show-overflow-tooltip /> | 
 |  |  |       <el-table-column prop="materialAttr" label="规格型号" min-width="100" show-overflow-tooltip /> | 
 |  |  |       <el-table-column prop="warehouseName" label="所在仓库" min-width="100" show-overflow-tooltip /> | 
 |  |  |       <el-table-column prop="stock" label="库存" min-width="80" show-overflow-tooltip /> | 
 |  |  |     </el-table> | 
 |  |  |     <div class="mt20"> | 
 |  |  |       <Pagination @size-change="handleSizeChange" @current-change="getList" :pagination="pagination" /> | 
 |  |  |     </div> | 
 |  |  |   </div> | 
 |  |  | </template> | 
 |  |  |  | 
 |  |  | <script> | 
 |  |  | import Pagination from '@/components/common/Pagination' | 
 |  |  | import QueryForm from '@/components/common/QueryForm' | 
 |  |  | import dayjs from 'dayjs' | 
 |  |  | import duration from 'dayjs/plugin/duration' | 
 |  |  | dayjs.extend(duration) | 
 |  |  | import { ywStockPage,ywStockPageEx  } from '@/api/store/index' | 
 |  |  | export default { | 
 |  |  |   components: { | 
 |  |  |     Pagination, | 
 |  |  |     QueryForm | 
 |  |  |   }, | 
 |  |  |   data() { | 
 |  |  |     return { | 
 |  |  |       loading: false, | 
 |  |  |       pagination: { | 
 |  |  |         pageSize: 10, | 
 |  |  |         page: 1, | 
 |  |  |         total: 0 | 
 |  |  |       }, | 
 |  |  |       filters: {}, | 
 |  |  |       list: [], | 
 |  |  |       total: 0, | 
 |  |  |       queryFormConfig: { | 
 |  |  |         formItems: [ | 
 |  |  |           { | 
 |  |  |             filed: 'warehouseId', | 
 |  |  |             type: 'select', | 
 |  |  |             label: '所在仓库', | 
 |  |  |             options: [] | 
 |  |  |           }, | 
 |  |  |           { | 
 |  |  |             filed: 'materialId', | 
 |  |  |             type: 'input', | 
 |  |  |             label: '物料名称/编码', | 
 |  |  |             placeholder: '请输入物料名称/编码' | 
 |  |  |           }, | 
 |  |  |           { | 
 |  |  |             filed: 'materialAttr', | 
 |  |  |             type: 'input', | 
 |  |  |             label: '型号', | 
 |  |  |           }, | 
 |  |  |         ] | 
 |  |  |       } | 
 |  |  |     } | 
 |  |  |   }, | 
 |  |  |   created() { | 
 |  |  |     this.getList() | 
 |  |  |   }, | 
 |  |  |   methods: { | 
 |  |  |     getList(page) { | 
 |  |  |       const { pagination, filters } = this | 
 |  |  |       this.loading = true | 
 |  |  |       ywStockPage({ | 
 |  |  |         model: { | 
 |  |  |           ...filters | 
 |  |  |         }, | 
 |  |  |         capacity: pagination.pageSize, | 
 |  |  |         page: page || pagination.page, | 
 |  |  |       }).then(res => { | 
 |  |  |         this.loading = false | 
 |  |  |         this.list = res.records || [] | 
 |  |  |         this.pagination.total = res.total || 0 | 
 |  |  |       }, () => { | 
 |  |  |         this.loading = false | 
 |  |  |       }) | 
 |  |  |     }, | 
 |  |  |     handleEx() { | 
 |  |  |       this.$dialog.exportConfirm('确认导出吗?') | 
 |  |  |         .then(() => { | 
 |  |  |           this.loading = true | 
 |  |  |           ywStockPageEx({ | 
 |  |  |             page: this.pagination.page, | 
 |  |  |             capacity: 1000000, | 
 |  |  |             model: this.filters | 
 |  |  |           }) | 
 |  |  |             .then(response => { | 
 |  |  |               this.download(response) | 
 |  |  |             }) | 
 |  |  |             .catch(e => { | 
 |  |  |               this.$tip.apiFailed(e) | 
 |  |  |             }) | 
 |  |  |             .finally(() => { | 
 |  |  |               this.loading = false | 
 |  |  |             }) | 
 |  |  |         }) | 
 |  |  |         .catch(() => { }) | 
 |  |  |     }, | 
 |  |  |     clear() { | 
 |  |  |       this.filters = {} | 
 |  |  |       this.pagination.pageSize = 10 | 
 |  |  |       this.pagination.page = 1 | 
 |  |  |       this.getList() | 
 |  |  |     }, | 
 |  |  |     handleSizeChange(capacity) { | 
 |  |  |       this.pagination.pageSize = capacity | 
 |  |  |       this.getList() | 
 |  |  |     } | 
 |  |  |   } | 
 |  |  | } | 
 |  |  | </script> | 
 |  |  |  | 
 |  |  | <style></style> |