#托盘码下架

zjj

2023-11-03 a546b70a863e44c2e8735b3cfc9da45a781b735f

 src/main/webapp/views/home/console.html

@@ -31,11 +31,15 @@
            display: inline-block;
            width: 49%;
        }
        .chart-elem div {
            padding-top: 15px;
            padding-bottom: 5px;
        }
        .chart-elem:first-child {
            padding: 0 50px;
        }
        .chart-elem:last-child {
            padding-left: 20px;
            padding: 0 50px;
            border-left: 1px solid rgba(0,0,0,.1);
        }
        /*表格工具栏*/
@@ -88,7 +92,25 @@
<!--报表数据-->
<div class="home-elem charts-contain">
    <div class="chart-elem">
        <div id="pie"></div>
        <div class="layui-tab layui-tab-card" style="width: 100%">
            <ul class="layui-tab-title">
                <li class="layui-this">总计</li>
                <li>A区</li>
                <li>B区</li>
                <li>C区</li>
                <li>D区</li>
                <li>E区</li>
            </ul>
            <div class="layui-tab-content">
                <div class="layui-tab-item layui-show" id="pie" style="width: 95%"></div>
                <div class="layui-tab-item" id="pie2" style="width: 95%"></div>
                <div class="layui-tab-item" id="pie3" style="width: 95%"></div>
                <div class="layui-tab-item" id="pie4" style="width: 95%"></div>
                <div class="layui-tab-item" id="pie5" style="width: 95%"></div>
                <div class="layui-tab-item" id="pie6" style="width: 95%"></div>
            </div>
        </div>
<!--        <div id="pie"></div>-->
    </div>
    <div class="chart-elem">
        <div id="line"></div>
@@ -105,7 +127,20 @@
</body>
<script>
    pieCharts();
    pieACharts();
    pieBCharts();
    pieCCharts();
    pieDCharts();
    pieECharts();
    lineCharts();
    layui.use('element', function(){
        var element = layui.element;

        //一些事件触发
        element.on('tab(demo)', function(data){
            console.log(data);
        });
    });
    // 饼图
    function pieCharts(){
        $.ajax({
@@ -127,7 +162,7 @@
                    text: '库位使用比例',
                    margin:1,
                    style: {fontSize: '18px',color: '#777',fontWeight: 'bold'},
                    y: 20
                    y: 5
                };
                var tooltip = {
                    pointFormat: '{series.name}: <b>{point.percentage:.1f}%</b>'
@@ -150,13 +185,17 @@
                    name: '库位占比',
                    data: dataPie
                }];

                var loading = {
                    hideDuration: 3,
                    showDuration: 3
                };
                var json = {};
                json.chart = chart;
                json.title = title;
                json.tooltip = tooltip;
                json.series = series;
                json.plotOptions = plotOptions;
                json.loading = loading;
                json.credits = {enabled: false};
                $('#pie').highcharts(json);

@@ -165,6 +204,318 @@
            }
        });
    }

    function pieACharts(){
        $.ajax({
            url:baseUrl+'/console/loc/pieA/charts',
            headers: {'token': localStorage.getItem('token')},
            dataType: 'json',
            contentType: 'application/json;charset=UTF-8',
            crossDomain: true,
            method: 'POST',
            success:function(res){
                var data = res.data;
                var dataPie=eval(data.rows);
                var chart = {
                    plotBackgroundColor: null,
                    plotBorderWidth: null,
                    plotShadow: false
                };
                var title = {
                    text: '库位使用比例',
                    margin:1,
                    style: {fontSize: '18px',color: '#777',fontWeight: 'bold'},
                    y: 5
                };
                var tooltip = {
                    pointFormat: '{series.name}: <b>{point.percentage:.1f}%</b>'
                };
                var plotOptions = {
                    pie: {
                        allowPointSelect: true,
                        cursor: 'pointer',
                        dataLabels: {
                            enabled: true,
                            format: '<b>{point.name}</b>: {point.percentage:.1f} %',
                            style: {
                                color: (Highcharts.theme && Highcharts.theme.contrastTextColor) || 'black'
                            }
                        }
                    }
                };
                var series= [{
                    type: 'pie',
                    name: '库位占比',
                    data: dataPie
                }];
                var loading = {
                    hideDuration: 3,
                    showDuration: 3
                };
                var json = {};
                json.chart = chart;
                json.title = title;
                json.tooltip = tooltip;
                json.series = series;
                json.plotOptions = plotOptions;
                json.loading = loading;
                json.credits = {enabled: false};
                $('#pie2').highcharts(json);

            },
            error:function(){
            }
        });
    }
    function pieBCharts(){
        $.ajax({
            url:baseUrl+'/console/loc/pieB/charts',
            headers: {'token': localStorage.getItem('token')},
            dataType: 'json',
            contentType: 'application/json;charset=UTF-8',
            crossDomain: true,
            method: 'POST',
            success:function(res){
                var data = res.data;
                var dataPie=eval(data.rows);
                var chart = {
                    plotBackgroundColor: null,
                    plotBorderWidth: null,
                    plotShadow: false
                };
                var title = {
                    text: '库位使用比例',
                    margin:1,
                    style: {fontSize: '18px',color: '#777',fontWeight: 'bold'},
                    y: 5
                };
                var tooltip = {
                    pointFormat: '{series.name}: <b>{point.percentage:.1f}%</b>'
                };
                var plotOptions = {
                    pie: {
                        allowPointSelect: true,
                        cursor: 'pointer',
                        dataLabels: {
                            enabled: true,
                            format: '<b>{point.name}</b>: {point.percentage:.1f} %',
                            style: {
                                color: (Highcharts.theme && Highcharts.theme.contrastTextColor) || 'black'
                            }
                        }
                    }
                };
                var series= [{
                    type: 'pie',
                    name: '库位占比',
                    data: dataPie
                }];
                var loading = {
                    hideDuration: 3,
                    showDuration: 3
                };
                var json = {};
                json.chart = chart;
                json.title = title;
                json.tooltip = tooltip;
                json.series = series;
                json.plotOptions = plotOptions;
                json.loading = loading;
                json.credits = {enabled: false};
                $('#pie3').highcharts(json);

            },
            error:function(){
            }
        });
    }
    function pieCCharts(){
        $.ajax({
            url:baseUrl+'/console/loc/pieC/charts',
            headers: {'token': localStorage.getItem('token')},
            dataType: 'json',
            contentType: 'application/json;charset=UTF-8',
            crossDomain: true,
            method: 'POST',
            success:function(res){
                var data = res.data;
                var dataPie=eval(data.rows);
                var chart = {
                    plotBackgroundColor: null,
                    plotBorderWidth: null,
                    plotShadow: false
                };
                var title = {
                    text: '库位使用比例',
                    margin:1,
                    style: {fontSize: '18px',color: '#777',fontWeight: 'bold'},
                    y: 5
                };
                var tooltip = {
                    pointFormat: '{series.name}: <b>{point.percentage:.1f}%</b>'
                };
                var plotOptions = {
                    pie: {
                        allowPointSelect: true,
                        cursor: 'pointer',
                        dataLabels: {
                            enabled: true,
                            format: '<b>{point.name}</b>: {point.percentage:.1f} %',
                            style: {
                                color: (Highcharts.theme && Highcharts.theme.contrastTextColor) || 'black'
                            }
                        }
                    }
                };
                var series= [{
                    type: 'pie',
                    name: '库位占比',
                    data: dataPie
                }];
                var loading = {
                    hideDuration: 3,
                    showDuration: 3
                };
                var json = {};
                json.chart = chart;
                json.title = title;
                json.tooltip = tooltip;
                json.series = series;
                json.plotOptions = plotOptions;
                json.loading = loading;
                json.credits = {enabled: false};
                $('#pie4').highcharts(json);

            },
            error:function(){
            }
        });
    }
    function pieDCharts(){
        $.ajax({
            url:baseUrl+'/console/loc/pieD/charts',
            headers: {'token': localStorage.getItem('token')},
            dataType: 'json',
            contentType: 'application/json;charset=UTF-8',
            crossDomain: true,
            method: 'POST',
            success:function(res){
                var data = res.data;
                var dataPie=eval(data.rows);
                var chart = {
                    plotBackgroundColor: null,
                    plotBorderWidth: null,
                    plotShadow: false
                };
                var title = {
                    text: '库位使用比例',
                    margin:1,
                    style: {fontSize: '18px',color: '#777',fontWeight: 'bold'},
                    y: 5
                };
                var tooltip = {
                    pointFormat: '{series.name}: <b>{point.percentage:.1f}%</b>'
                };
                var plotOptions = {
                    pie: {
                        allowPointSelect: true,
                        cursor: 'pointer',
                        dataLabels: {
                            enabled: true,
                            format: '<b>{point.name}</b>: {point.percentage:.1f} %',
                            style: {
                                color: (Highcharts.theme && Highcharts.theme.contrastTextColor) || 'black'
                            }
                        }
                    }
                };
                var series= [{
                    type: 'pie',
                    name: '库位占比',
                    data: dataPie
                }];
                var loading = {
                    hideDuration: 3,
                    showDuration: 3
                };
                var json = {};
                json.chart = chart;
                json.title = title;
                json.tooltip = tooltip;
                json.series = series;
                json.plotOptions = plotOptions;
                json.loading = loading;
                json.credits = {enabled: false};
                $('#pie5').highcharts(json);

            },
            error:function(){
            }
        });
    }
    function pieECharts(){
        $.ajax({
            url:baseUrl+'/console/loc/pieE/charts',
            headers: {'token': localStorage.getItem('token')},
            dataType: 'json',
            contentType: 'application/json;charset=UTF-8',
            crossDomain: true,
            method: 'POST',
            success:function(res){
                var data = res.data;
                var dataPie=eval(data.rows);
                var chart = {
                    plotBackgroundColor: null,
                    plotBorderWidth: null,
                    plotShadow: false
                };
                var title = {
                    text: '库位使用比例',
                    margin:1,
                    style: {fontSize: '18px',color: '#777',fontWeight: 'bold'},
                    y: 5
                };
                var tooltip = {
                    pointFormat: '{series.name}: <b>{point.percentage:.1f}%</b>'
                };
                var plotOptions = {
                    pie: {
                        allowPointSelect: true,
                        cursor: 'pointer',
                        dataLabels: {
                            enabled: true,
                            format: '<b>{point.name}</b>: {point.percentage:.1f} %',
                            style: {
                                color: (Highcharts.theme && Highcharts.theme.contrastTextColor) || 'black'
                            }
                        }
                    }
                };
                var series= [{
                    type: 'pie',
                    name: '库位占比',
                    data: dataPie
                }];
                var loading = {
                    hideDuration: 3,
                    showDuration: 3
                };
                var json = {};
                json.chart = chart;
                json.title = title;
                json.tooltip = tooltip;
                json.series = series;
                json.plotOptions = plotOptions;
                json.loading = loading;
                json.credits = {enabled: false};
                $('#pie6').highcharts(json);

            },
            error:function(){
            }
        });
    }


    // 折线图
    function lineCharts() {
@@ -181,7 +532,7 @@
                    text: '日入出库数量',
                    margin: 1,
                    style: {fontSize: '18px',color: '#777',fontWeight: 'bold'},
                    y: 20
                    y: 5
                };
                var xAxis = {
                    categories: [getDate(-11), getDate(-10), getDate(-9), getDate(-8), getDate(-7), getDate(-6),
@@ -204,6 +555,10 @@
                    verticalAlign: 'middle',
                    borderWidth: 0
                };
                var loading = {
                    hideDuration: 3,
                    showDuration: 3
                }
                var series = dataPie;
                var json = {};
                json.title = title;
@@ -211,6 +566,7 @@
                json.yAxis = yAxis;
                json.tooltip = tooltip;
                json.legend = legend;
                json.loading = loading;
                json.series = series;
                json.credits = {enabled: false};
                $('#line').highcharts(json);
@@ -220,6 +576,15 @@

    // 表格
    var pageCurr;
    function getCol() {
        var cols = [
            {field: 'appeTime$', title: '入库时间', align: 'center', width: 200}
            ,{field: 'stay_time', align: 'center',title: '滞留天数'}
            ,{field: 'loc_no', align: 'center',title: '库位号'}
        ];
        cols.push.apply(cols, detlCols);
        return cols;
    }
    layui.use(['table','laydate', 'form'], function() {
        var table = layui.table;
        var $ = layui.jquery;
@@ -236,21 +601,7 @@
            even: true,
            cellMinWidth: 50,
            crossDomain: true,
            cols: [[
                {field: 'appe_time', title: '入库时间', align: 'center', width: 200}
                ,{field: 'stay_time', align: 'center',title: '滞留天数'}
                ,{field: 'loc_no', align: 'center',title: '库位号'}
                ,{field: 'matnr', align: 'center',title: '物料'}
                ,{field: 'maktx', align: 'center',title: '物料描述'}
                ,{field: 'lgnum', align: 'center',title: '仓库号'}
                ,{field: 'tbnum', align: 'center',title: '请求编号'}
                ,{field: 'zmatid', align: 'center',title: '物料标签ID'}
                ,{field: 'werks', align: 'center',title: '工厂'}
                ,{field: 'anfme', align: 'center',title: '数量'}
                ,{field: 'altme', align: 'center',title: '单位'}
                ,{field: 'zpallet', align: 'center',title: '托盘码'}
                ,{field: 'bname', align: 'center',title: '用户ID'}
            ]],
            cols: [getCol()],
            request: {
                pageName: 'curr',
                pageSize: 'limit'
@@ -268,7 +619,7 @@
            },
            done: function(res, curr, count) {
                if (res.code === 403) {
                    top.location.href = "/";
                    top.location.href = baseUrl+"/";
                }
                pageCurr=curr;
            }
@@ -289,7 +640,7 @@
                },
                done: function (res, curr, count) {
                    if (res.code === 403) {
                        top.location.href = "/";
                        top.location.href = baseUrl+"/";
                    }
                    pageCurr=curr;
                }
@@ -322,4 +673,4 @@
        return fmt;
    }
</script>
</html>
</html>