<template>
    <view class="ex-warehousing">
        <view class="uni-table-box">
            <uni-table type="selection" border stripe emptyText="暂无更多数据" @selection-change="selectionChange">
                <uni-tr>
                    <uni-th align="center">入仓号</uni-th>
                    <uni-th align="center">车序</uni-th>
                    <uni-th align="center">汇总件数</uni-th>
                </uni-tr>
                <uni-tr v-for="(item, index) in list" :key="index">
                    <uni-swipe-action ref="swipeAction">
                        <uni-swipe-action-item :right-options="options" @click="bindClick($event, index)" @change="swipeChange($event, index)">
                            <uni-td align="center">{{ item.erp_order_sn || '' }}</uni-td>
                            <uni-td align="center">{{ item.car_sort || '' }}</uni-td>
                            <uni-td align="center">{{ item.num || '' }}</uni-td>
                        </uni-swipe-action-item>
                    </uni-swipe-action>
                </uni-tr>
            </uni-table>
        </view>
        <view class="scan row rowCenter verCenter" @click="scanChange()" hover-class="none">
            <text class="iconfont icon-juxing2"></text>
            <text class="tt">继续扫描</text>
        </view>
        <view class="fix-info row bothSide verCenter">
            <view class="text row verCenter">
                <text class="t1">入仓号数：</text>
                <text class="t2">{{ selectedIndexs.length }}</text>
            </view>
            <view class="btn row rowCenter verCenter" @click="szScanOutChange">出库单号确认</view>
        </view>
    </view>
</template>

<script>
import { API } from '@/util/api.js';

export default {
    data() {
        return {
            options: [
                {
                    text: '取消',
                    style: {
                        backgroundColor: '#007aff'
                    }
                },
                {
                    text: '删除',
                    style: {
                        backgroundColor: '#dd524d'
                    }
                }
            ],
            selectedIndexs: [],
            erp_order_sn: '',
            list: [
                {
                    erp_order_sn: 'B154542',
                    car_sort: '1车次',
                    num: 100
                },
                {
                    erp_order_sn: 'B1542',
                    car_sort: '2车次',
                    num: 10
                }
            ],
            filterList: [],
            startTime: '',
            endTime: ''
        };
    },
    onLoad(options) {
        this.erp_order_sn = options.number;
        this.startTime = options.startTime;
        this.endTime = options.endTime;
        this.getData();
    },
    onShow() {
        this.selectedIndexs = [];
    },
    methods: {
        bindClick(e, index) {
            console.log('点击了' + (e.position === 'left' ? '左侧' : '右侧') + e.content.text + '按钮');
            if (e.content.text == '删除') {
                this.list.splice(index, 1);
            }
        },
        swipeChange(e, index) {
            //console.log('当前状态：' + e + '，下标：' + index);
        },
        selectionChange(e) {
            this.selectedIndexs = e.detail.index;
            this.filterList = this.selectedIndexs.map(i => this.list[i]);
        },
        scanChange(type) {
            uni.scanCode({
                success: res => {
                    console.log(res);
                    if (res.errMsg == 'scanCode:ok') {
                        this.erp_order_sn = res.result;
                        this.getData();
                    }
                },
                fail: res => {
                    console.log(res);
                    uni.showToast({
                        title: '扫码失败',
                        icon: 'error'
                    });
                }
            });
        },
        getData() {
            this.request(API.szScanOut, 'POST', { erp_order_sn: this.erp_order_sn, is_submit: 0 }, true).then(res => {
                if (res.err_code === 0) {
                    this.list.push({
                        car_sort: res.data.car_sort,
                        erp_order_sn: res.data.erp_order_sn,
                        num: res.data.num
                    });
                } else {
                    this.list = [];
                    uni.showToast({
                        title: res.err_msg,
                        icon: 'none'
                    });
                }
            });
        },
        szScanOutChange() {
            if (this.filterList.length <= 0) {
                uni.showModal({
                    title: '提示',
                    content: '请勾选入仓号',
                    showCancel: false
                });
                return false;
            }

            this.request(API.szScanOut, 'POST', { list: this.filterList, is_submit: 1, erp_order_sn: this.erp_order_sn, startTime: this.startTime, endTime: this.endTime }, true).then(res => {
                if (res.err_code === 0) {
                    uni.showToast({
                        title: '提交成功',
                        duration: 2000
                    });
                    setTimeout(() => {
                        uni.navigateTo({
                            url: '/pages/pda/logisticsList'
                        });
                    }, 2000);
                } else {
                    uni.showModal({
                        title: '提示',
                        content: res.err_msg,
                        showCancel: false
                    });
                }
            });
        }
    }
};
</script>

<style scoped lang="scss">
@import '../../assets/css/pda/exWarehouse.scss';
</style>