<template>
    <div class="un-done">
        <layout-filter>
            <filter-item :label="filters.orderNo.label">
                <Input v-model.trim.number="filters.orderNo.model"
                       :placeholder="filters.orderNo.holder"></Input>
            </filter-item>
            <filter-item :label="filters.expressNo.label">
                <Input v-model.trim="filters.expressNo.model"
                       :placeholder="filters.expressNo.holder"></Input>
            </filter-item>
            <filter-item :label="filters.prodCode.label">
                <Input v-model.trim.number="filters.prodCode.model"
                       :placeholder="filters.prodCode.holder" :maxlength="9"></Input>
            </filter-item>
            <filter-item :label="filters.skuCode.label">
                <Input v-model.trim.number="filters.skuCode.model"
                       :placeholder="filters.skuCode.holder" :maxlength="9"></Input>
            </filter-item>
            <filter-item :label="filters.prodBarCode.label">
                <Input v-model.trim="filters.prodBarCode.model"
                       :placeholder="filters.prodBarCode.holder"></Input>
            </filter-item>
            <filter-item :label="filters.sendTime.label">
                <Date-picker type="daterange"
                             placeholder="选择日期"
                             @on-change="dateChange"
                             v-model.trim="filters.sendTime.model">
                </Date-picker>
            </filter-item>
            <filter-item>
                <Button type="primary" @click="filterSearch">筛选</Button>
                <Button @click="clearFilter">清空条件</Button>
                <Button type="warning" @click="exportSelected">导出</Button>
                <Button type="warning" v-show="canExportAll" @click="exportAll">导出全部</Button>
                <filter-tips type="warning" show-icon closable>请务必认真填写发货情况及物流信息，否则商品无法正常入库</filter-tips>
            </filter-item>
        </layout-filter>

        <layout-list>
            <Table border :columns="table.cols" :data="table.list" @on-selection-change="selectionChange"></Table>
            <Page :total="page.total" :current="page.current"
                  @on-change="pageChange" :page-size="20" show-total></Page>
        </layout-list>
    </div>
</template>

<script>
    import _ from 'lodash';
    import moment from 'moment';
    import {express as expressStore} from '../store';
    import TradeService from 'services/trade/trade-service';

    export default {
        name: 'TabDone',
        data() {
            return expressStore.apply(this);
        },
        created() {
            const params = {
                pageNo: 1,
                pageSize: 20,
                sellTypes: [7],
                statusList: [2, 3]
            };

            this.tradeService = new TradeService();
            this.getExpList(params);
        },
        computed: {
            canExportAll() {
                const filterKeys = {
                    skn: 'prodCode',
                    sku: 'skuCode',
                    proReqFormId: 'orderNo',
                    expressNumber: 'expressNo',
                    skuFactoryCode: 'prodBarCode',
                    startTime: 'sendStartTime',
                    endTime: 'sendEndTime',
                };

                return _.some(filterKeys, val => {
                    return this.filters[val].model;
                });
            }
        },
        methods: {
            getExpList(params) {
                this.$Loading.start();
                this.tradeService.allotExpressList(params)
                    .then(res => {
                        this.$Loading.finish();
                        this.handleData(res.data);
                    });
            },
            filterSearch() {
                this.useFilter = true;
                if (this.params()) {
                    this.getExpList(this.params());
                    this.page.current = 1;
                }
            },
            clearFilter() {
                this.useFilter = false;
                if (this.params()) {
                    this.getExpList(this.params());
                    this.page.current = 1;
                }
                _.each(this.filters, item => {
                    item.model = '';
                });
            },
            pageChange(page) {
                let params = this.params();

                params.pageNo = page;
                this.page.current = page;
                this.getExpList(params);
            },
            setModel(k, v) {
                this.filters[k].model = v;
            },
            dateChange(date) {
                this.setModel('sendStartTime', date[0]);
                this.setModel('sendEndTime', date[1]);
            },
            params() {
                const data = {
                    pageNo: 1,
                    pageSize: 20,
                    sellTypes: [7],
                    statusList: [2, 3]
                };
                const mapKeys = {
                    skn: 'prodCode',
                    sku: 'skuCode',
                    proReqFormId: 'orderNo',
                    expressNumber: 'expressNo',
                    skuFactoryCode: 'prodBarCode',
                    startTime: 'sendStartTime',
                    endTime: 'sendEndTime',
                };

                if (!this.useFilter) {
                    return data;
                }

                let val;

                _.each(mapKeys, (v, k) => {
                    val = '' + this.filters[v].model;
                    if (val.length) {
                        data[k] = this.filters[v].model;
                    }
                });

                if (data.startTime && data.endTime) {
                    data.startTime = moment(data.startTime).unix();
                    data.endTime = moment(data.endTime).unix();
                }

                if (typeof data.proReqFormId !== 'undefined' &&
                    !_.isFinite(+data.proReqFormId)) {
                    this.$Message.error('调拨单号只能是数字', 3);
                    return false;
                }

                if (typeof data.skn !== 'undefined' &&
                    !_.isFinite(+data.skn)) {
                    this.$Message.error('SKN编码只能是数字', 3);
                    return false;
                }

                if (typeof data.sku !== 'undefined' &&
                    !_.isFinite(+data.sku)) {
                    this.$Message.error('SKU编码只能是数字', 3);
                    return;
                }

                return data;
            },
            goExpDetail(expressNo) {
                this.$router.push({
                    name: 'trade.expdetail',
                    query: {
                        expressNo
                    }
                });
            },
            handleData(data) {
                _.each(data.records, record => {
                    const pageSelection = this.selection[this.page.current];

                    if (pageSelection) {
                        record._checked = _.some(pageSelection, row => {
                            return row.expressNumber === record.expressNumber;
                        });
                    }
                });

                this.table.list = data.records;
                this.page.total = data.totalCount;
            },
            exportAll() {
                let filter = {};

                const fieldKeys = {
                    productSkn: 'prodCode',
                    productSku: 'skuCode',
                    proReqFormId: 'orderNo',
                    expressNumber: 'expressNo',
                    skuFactoryCode: 'prodBarCode',
                    startTime: 'sendStartTime',
                    endTime: 'sendEndTime',
                };

                _.each(fieldKeys, (val, key) => {
                    if (this.filters[val].model) {
                        filter[key] = this.filters[val].model;
                    }
                });

                if (filter.startTime && filter.endTime) {
                    filter.startTime = moment(filter.startTime).unix();
                    filter.endTime = moment(filter.endTime).unix();
                }

                if (typeof filter.proReqFormId !== 'undefined' &&
                    !_.isFinite(+filter.proReqFormId)) {
                    this.$Message.error('调拨单号只能是数字', 3);
                    return false;
                }

                if (typeof filter.productSkn !== 'undefined' &&
                    !_.isFinite(+filter.productSkn)) {
                    this.$Message.error('SKN编码只能是数字', 3);
                    return false;
                }

                if (typeof filter.productSku !== 'undefined' &&
                    !_.isFinite(+filter.productSku)) {
                    this.$Message.error('SKU编码只能是数字', 3);
                    return;
                }

                this.tradeService.allotExportAllExpressDetail(filter).then(res => {
                    if (res.code === 200) {
                        window.open(res.data, '_blank');
                    } else {
                        this.$Message.error(res.message, 3);
                    }
                });
            },
            exportSelected() {
                let express = [];

                _.each(this.selection, pageSel => {
                    _.each(pageSel, sel => {
                        express.push(sel.expressNumber);
                    });
                });

                if (!express.length) {
                    return this.$Message.warning('请选择需要导出的条目', 3);
                }

                this.tradeService.allotExportExpressDetail(express).then(res => {
                    if (res.code === 200) {
                        window.open(res.data, '_blank');
                        this.table.list = _.map(this.table.list, item => {
                            item._checked = false;
                            return item;
                        });
                        this.selection = {};
                    } else {
                        this.$Message.error(res.message, 3);
                    }
                });
            },
            selectionChange(rows) {
                this.selection[this.page.current] = rows;
            }
        }
    };
</script>

<style lang="scss">
</style>