| | |
| | | <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="materialCode" 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' |
| | | import { fetchList as getStoreList } from '@/api/ywWarehouse' |
| | | 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: '所在仓库', |
| | | labelCode: 'name', |
| | | valueCode: 'id', |
| | | options: [] |
| | | }, |
| | | { |
| | | filed: 'materialCode', |
| | | type: 'input', |
| | | label: '物料名称/编码', |
| | | placeholder: '请输入物料名称/编码' |
| | | }, |
| | | { |
| | | filed: 'materialAttr', |
| | | type: 'input', |
| | | label: '型号', |
| | | }, |
| | | ] |
| | | } |
| | | } |
| | | }, |
| | | created() { |
| | | this.getList() |
| | | this.initData() |
| | | }, |
| | | methods: { |
| | | initData() { |
| | | getStoreList({ capacity: 9999, page: 1, model: {} }).then(res => { |
| | | this.queryFormConfig.formItems[0].options = res.records || [] |
| | | }) |
| | | }, |
| | | 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> |