ManagerWaybill.vue 8.3 KB
<template>
    <div>
        <div>
            <el-form :inline="true" :model="query" >
                <el-form-item label="">
                    <el-input size="medium" v-model="query.billNo" placeholder="主输入主单号"></el-input>
                </el-form-item>
                <el-form-item width="200px" label="">
                    <div class="block">
                        <el-date-picker
                                style="background: none"
                                size="medium"
                                v-model="value2"
                                type="daterange"
                                align="right"
                                unlink-panels
                                range-separator="至"
                                start-placeholder="开始日期"
                                end-placeholder="结束日期"
                                value-format="yyyy-MM-dd HH:mm:ss"
                                :picker-options="pickerOptions">
                        </el-date-picker>
                    </div>
                </el-form-item>
                <el-form-item label="">
                    <el-button size="medium" @click="getList" type="primary">查询</el-button>
                </el-form-item>
            </el-form>
        </div>
        <div style="margin-bottom: 10px"><span style="color: red">合计:毛重:{{totalweight}}KG 净重:{{totalnetweight}}KG 清单数量:{{totalcount}}</span></div>
        <div>
            <el-table
                    :data="tableData"
                    border
                    style="width: 100%">
                <el-table-column
                        prop="clientCode"
                        label="客户编码"
                        width="150">
                </el-table-column>
                <el-table-column
                        prop="billNo"
                        label="主单号"
                        width="150">
                </el-table-column>
                <el-table-column
                        prop="grossWeightSum"
                        label="毛重"
                        width="150">
                </el-table-column>
                <el-table-column
                        prop="netWeightSum"
                        label="净重"
                        width="150">
                </el-table-column>
                <el-table-column
                        prop="countBillNo"
                        label="清单数量"
                        width="150">
                </el-table-column>
                <el-table-column
                        prop="logisticsName"
                        label="物流企业名称"
                        width="150">
                </el-table-column>
                <el-table-column
                        prop="agentName"
                        label="申报企业名称"
                        width="150">
                </el-table-column>
                <el-table-column
                        prop="ebpName"
                        label="电商企业名称"
                        width="150">
                </el-table-column>
                <!--<el-table-column
                        fixed="right"
                        label="操作"
                        width="100">
                    <template slot-scope="scope">
                        <el-button @click="handleClick(scope.row)" type="text" size="small">查看</el-button>
                    </template>
                </el-table-column>-->
            </el-table>
        </div>
        <div class="block">
            <el-pagination
                    @size-change="handleSizeChange"
                    @current-change="handleCurrentChange"
                    :current-page="query.pageNum"
                    :page-sizes="[10, 20, 30, 40]"
                    :page-size="query.pageSize"
                    layout="total, sizes, prev, pager, next, jumper"
                    :total="total">
            </el-pagination>
        </div>
    </div>
</template>
<script>
    import {billNoStatistics} from '../../api/consigner/exportOrder';
    export default {
        data(){
            return{
                query:{
                    billNo:'',
                    startTime:'',
                    endTime:'',
                    pageNum:0,
                    pageSize:10,
                },
                totalweight:0,
                totalnetweight:0,
                totalcount:0,
                total:0,
                value2: '',
                pickerOptions: {
                    shortcuts: [{
                        text: '最近一周',
                        onClick(picker) {
                            const end = new Date();
                            const start = new Date();
                            start.setTime(start.getTime() - 3600 * 1000 * 24 * 7);
                            picker.$emit('pick', [start, end]);
                        }
                    }, {
                        text: '最近一个月',
                        onClick(picker) {
                            const end = new Date();
                            const start = new Date();
                            start.setTime(start.getTime() - 3600 * 1000 * 24 * 30);
                            picker.$emit('pick', [start, end]);
                        }
                    }, {
                        text: '最近三个月',
                        onClick(picker) {
                            const end = new Date();
                            const start = new Date();
                            start.setTime(start.getTime() - 3600 * 1000 * 24 * 90);
                            picker.$emit('pick', [start, end]);
                        }
                    }]
                },
                tableData: []
            }
        },
        methods: {
            handleSizeChange(val) {
                this.query.pageSize=val;
                this.getList();
            },
            handleCurrentChange(val) {
                this.query.pageNum=val;
                this.getList();
            },
            /*handleClick(row) {
                console.log(row);
            },*/
            getList(){
                if(this.query.billNo==='' && this.value2===''){
                    return this.$message.error('请选择时间段')
                }
                if(this.query.billNo==='' && this.value2===null){
                    return this.$message.error('请选择时间段')
                }
                if(this.query.billNo===null && this.value2===''){
                    return this.$message.error('请选择时间段')
                }
                if(this.query.billNo===null && this.value2===null){
                    return this.$message.error('请选择时间段')
                }
                if(this.value2 !== null && this.value2 !== ""){
                    this.query.startTime = this.value2[0];
                    this.query.endTime = this.value2[1];
                }
                billNoStatistics(this.query).then((response) => {
                    const res = response.data;
                    if (res.code !== '200') {
                        return this.$message.error('获取消息收发记录,失败!')
                    }
                    if(res.data.list.length!==0){

                        const sumweight=res.data.list.reduce((acc, item) => acc + (item.grossWeightSum || 0), 0);
                        this.totalweight=Number(sumweight.toFixed(2));
                        //this.totalnetweight=res.data.list.reduce((acc, item) => acc + (item.netWeightSum || 0), 0);
                        const sum = res.data.list.reduce((acc, item) => acc + (item.netWeightSum || 0), 0);
                        this.totalnetweight=Number(sum.toFixed(2));
                        this.totalcount=res.data.list.reduce((acc, item) => acc + (item.countBillNo || 0), 0);
                    }
                    // 获取列表数据
                    this.tableData = res.data.list
                    // 获取列表的总记录数
                    this.total = res.data.total
                    this.$message.success('获取消息收发记录,成功!');
                }).catch(error => {
                    // 关闭加载
                    this.$message.error(error.toString())
                })
            }
        },
    }
</script>