list.vue 5.29 KB
<template>
    <layout-body>
        <layout-filter>
            <filter-item :label="filters.id.label">
                <Input v-model.trim="filters.id.model"
                       :placeholder="filters.id.holder" ></Input>
            </filter-item>

            <filter-item :label="filters.expressNumber.label">
                <Input v-model.trim="filters.expressNumber.model"
                       :placeholder="filters.expressNumber.holder" ></Input>
            </filter-item>

            <filter-item :label="filters.productSkn.label">
                <Input v-model.trim="filters.productSkn.model"
                       :placeholder="filters.productSkn.holder"></Input>
            </filter-item>

            <filter-item :label="filters.skuFactoryCode.label">
                <Input v-model.trim="filters.skuFactoryCode.model"
                       :placeholder="filters.skuFactoryCode.holder"></Input>
            </filter-item>

            <filter-item>
                <Button type="primary" @click="getExpress">筛选</Button>
                <Button type="warning" @click="exportList">导出</Button>
                <Button @click="clearFilters">清空条件</Button>
            </filter-item>
        </layout-filter>

        <layout-list>
            <Table border :columns="tableCols" :data="tableData"></Table>
            <Page :total="pageData.total" :current="pageData.current"
                  @on-change="pageChange" :page-size="20" show-total></Page>
        </layout-list>

    </layout-body>
</template>

<script>
    import {tableCols, tableData, pageData} from './store/list-table';
    import ExpressService from 'services/repository/express-service';

    export default {
        created() {
            this.expressService = new ExpressService();
        },
        data() {
            return {
                tableCols: tableCols.call(this),
                tableData,
                pageData,
                filters: {
                    id: {
                        label: '入库单号',
                        labelSpan: 6,
                        model: '',
                        holder: '',
                        fieldSpan: 18
                    },
                    expressNumber: {
                        label: '物流单号',
                        labelSpan: 6,
                        model: '',
                        holder: '',
                        fieldSpan: 18
                    },
                    productSkn: {
                        label: 'SKN编码',
                        labelSpan: 6,
                        model: '',
                        holder: '',
                        fieldSpan: 18
                    },
                    skuFactoryCode: {
                        label: '商品条码',
                        labelSpan: 6,
                        model: '',
                        holder: '',
                        fieldSpan: 18
                    },
                }
            };
        },
        mounted() {
            this.getExpress();
        },
        methods: {
            clearFilters() {
                this.filters.id.model = null;
                this.filters.expressNumber.model = null;
                this.filters.productSkn.model = null;
                this.filters.skuFactoryCode.model = null;
                this.pageData.current = 1;
                this.pageData.total = 0;

                this.getExpress();
            },
            filtersParams() {
                let params = {};

                if (this.filters.id.model) {
                    params.proReqFormId = this.filters.id.model;
                }

                if (this.filters.expressNumber.model) {
                    params.expressNumber = this.filters.expressNumber.model;
                }

                if (this.filters.productSkn.model) {
                    params.productSkn = this.filters.productSkn.model;
                }

                if (this.filters.skuFactoryCode.model) {
                    params.skuFactoryCode = this.filters.skuFactoryCode.model;
                }

                params.pageSize = this.pageData.pageSize;
                params.pageNo = this.pageData.current;

                return Promise.resolve(params);
            },
            getExpress() {
                return this.filtersParams().then((params) => {
                    this.$Loading.start();
                    return this.expressService.list(params);
                }).then((result) => {
                    if (result.code === 200) {
                        this.pageData.total = result.data.totalCount;
                        this.pageData.current = result.data.pageNo;
                        this.tableData = result.data.records;
                    }
                    this.$Loading.finish();
                });
            },
            info(data) {
                this.$router.push({
                    name: 'repository.express.info',
                    params: {
                        id: data.expressNumber
                    },
                    query: {
                        time: data.createTime
                    }
                });
            },
            exportList() {
                this.expressService.exportList().then((url) => {
                    window.open(url, '_blank');
                });
            }
        }
    };
</script>