srmTaskInfo.html 11.4 KB
<!DOCTYPE HTML>
<html lang="zh" xmlns:th="http://www.thymeleaf.org">
<meta charset="utf-8">
<head th:include="include :: header">
</head>
<body class="gray-bg">
<div class="container-div">
    <div class="row">
        <div class="col-sm-12 select-info">
            <form id="inventory-form">
                <div class="select-list">
                    <ul>
                        <li>
                            仓库:
                            <select id="dataBaseNum" name="dataBaseNum">
                                <option value="1">机加立库</option>
                                <option value="2">一厂2号立库</option>
                                <option value="3">二厂立库</option>
                            </select>
                        </li>
                        <li class="time">
                            <label>创建时间: </label>
                            <input type="text" class="time-input" id="startTime" placeholder="开始时间"
                                   name="createdBegin"/>
                            <span>-</span>
                            <div id="tips" style="position: absolute;left: 180px;top: 40px;"></div>
                            <input type="text" class="time-input" id="endTime" placeholder="结束时间" name="createdEnd"/>
                        </li>
                        <li>
                            <a class="btn btn-primary btn-rounded btn-sm" id="btn"><i class="fa fa-search"></i>&nbsp;搜索</a>
                            <a class="btn btn-warning btn-rounded btn-sm" onclick="$.form.reset('inventory-form')"><i
                                    class="fa fa-refresh"></i>&nbsp;重置</a>
                        </li>
                    </ul>
                </div>
            </form>
        </div>
        <!--   任务时长统计     -->
        <div class="col-sm-12 select-info">
            <div id="toolbar1">任务时长统计</div>
            <table id="bootstrap-table" data-mobile-responsive="true"
                   class="table table-bordered table-hover text-nowrap table-primary"></table>
        </div>
        <!--   任务计数统计     -->
        <div class="col-sm-12 select-info">
            <div id="toolbar2">任务计数统计</div>
            <table id="bootstrap-table2" data-mobile-responsive="true"
                   class="table table-bordered table-hover text-nowrap table-success"></table>
        </div>
        <!--   堆垛机状态统计     -->
        <div class="col-sm-12 select-info">
            <div id="toolbar3">堆垛机状态统计</div>
            <table id="bootstrap-table3" data-mobile-responsive="true"
                   class="table table-bordered table-hover text-nowrap table-danger"></table>
        </div>
    </div>
</div>
<div th:include="include :: footer"></div>
<script th:inline="javascript">
    var prefix = ctx + "getSRMTaskInfo";
    var inventoryStatus = [[${@dict.getType('inventorySts')}]];
    var receiptHeaderStatus = [[${@dict.getType('receiptHeaderStatus')}]];
    var shipmentHeaderStatus = [[${@dict.getType('shipmentHeaderStatus')}]];
    var receiptContainerHeaderStatus = [[${@dict.getType('receiptContainerHeaderStatus')}]];
    var shipmentContainerHeaderStatus = [[${@dict.getType('shipmentContainerHeaderStatus')}]];
    var taskStatus = [[${@dict.getType('taskStatus')}]];
    $("#bootstrap-table").bootstrapTable({
        // url: prefix + "/receiptDetail",
        showRefresh: true, //刷新
        showToggle: true, //视图切换
        showColumns: true, //列选择
        clickToSelect: true,
        sortName: "id",
        sortOrder: "desc",
        showExport: true,
        exportDataType: "all",
        toolbar: '#toolbar1',
        toolBarAlign: 'left',
        columns: [
            {
                field: 'createdTime',
                title: '日期'
            },
            {
                field: 'taskSumTime',
                title: '任务总时长'
            },
            {
                field: 'sortingTime',
                title: '分拣任务时长'
            },
            {
                field: 'receiptTime',
                title: '整盘入库时长'
            },
            {
                field: 'shipmentTime',
                title: '整盘出库时长'
            },
            {
                field: 'transferTime',
                title: '移库时长'
            },
            {
                field: 'sortTime',
                title: '分拣时长'
            },
            {
                field: 'sortingTimeRatio',
                title: '分拣任务时长占比'
            },
            {
                field: 'receiptTimeRatio',
                title: '整盘入库时长占比'
            },
            {
                field: 'shipmentTimeRatio',
                title: '整盘出库时长占比'
            },
            {
                field: 'transferTimeRatio',
                title: '移库时长占比'
            },
            {
                field: 'sortTimeRatio',
                title: '分拣时长占比'
            },
        ],
        theadClasses: "thead-light"
    });
    $("#bootstrap-table2").bootstrapTable({
        // url: prefix + "/receiptContainerDetail",
        showRefresh: true, //刷新
        showToggle: true, //视图切换
        showColumns: true, //列选择
        clickToSelect: true,
        sortName: "id",
        sortOrder: "desc",
        showExport: true,
        exportDataType: "all",
        toolbar: '#toolbar2',
        toolBarAlign: 'left',
        columns: [
            {
                field: 'createdTime',
                title: '日期'
            },
            {
                field: 'taskNum',
                title: '任务总数量'
            },
            {
                field: 'sortingNum',
                title: '分拣任务数量'
            },
            {
                field: 'receiptNum',
                title: '整盘入库数量'
            },
            {
                field: 'shipmentNum',
                title: '整盘出库数量'
            },
            {
                field: 'transferNum',
                title: '移库数量'
            },
            {
                field: 'sortingNumRatio',
                title: '分拣任务数量占比'
            },
            {
                field: 'receiptNumRatio',
                title: '整盘入库数量占比'
            },
            {
                field: 'shipmentNumRatio',
                title: '整盘出库数量占比'
            },
            {
                field: 'transferNumRatio',
                title: '移库数量占比'
            },
        ],
        theadClasses: "thead-blue"
    });
    $("#bootstrap-table3").bootstrapTable({
        // url: prefix + "/receiptTaskDetail",
        showRefresh: true, //刷新
        showToggle: true, //视图切换
        showColumns: true, //列选择
        clickToSelect: true,
        sortName: "id",
        sortOrder: "desc",
        showExport: true,
        exportDataType: "all",
        toolbar: '#toolbar3',
        toolBarAlign: 'left',
        columns: [
            {
                field: 'createdTime',
                title: '日期'
            },
            {
                field: 'srmName',
                title: '堆垛机名称'
            },
            {
                field: 'Error',
                title: '故障时长'
            },
            {
                field: 'Manual',
                title: '手动时长'
            },
            {
                field: 'Maintain',
                title: '维修时长'
            },
            {
                field: 'Free',
                title: '空闲时长'
            },
            {
                field: 'Running',
                title: '工作时长'
            },
            {
                field: 'ErrorRatio',
                title: '故障时长占比'
            },
            {
                field: 'ManualRatio',
                title: '手动时长占比'
            },
            {
                field: 'MaintainRatio',
                title: '维修时长占比'
            },
            {
                field: 'FreeRatio',
                title: '空闲时长占比'
            },
            {
                field: 'RunningRatio',
                title: '工作时长占比'
            },
        ]
    });


    function sousuo() {
        debugger;
        if (!$("input[name='createdBegin']").val() || !$("input[name='createdEnd']").val()) {
            layer.tips("输入开始日期和结束日期!", "#tips", {tips: [3, "rgb(28,132,198)"], time: 1000, area: 'auto'})
            return;
        }
        $("#bootstrap-table").bootstrapTable('removeAll');
        $("#bootstrap-table2").bootstrapTable('removeAll');
        $("#bootstrap-table3").bootstrapTable('removeAll');
        $.ajax({
            url: prefix + "/getData",
            type: 'post',
            data: {
                "createdBegin": $("input[name='createdBegin']").val(),
                "createdEnd": $("input[name='createdEnd']").val()
            },
            success: function (value) {
                if(value.taskTimeMapListResult.length==0){
                    $.modal.msgError("没有查到数据,请重试...");
                }
                $("#bootstrap-table").bootstrapTable('load', value.taskTimeMapListResult);
                $("#bootstrap-table2").bootstrapTable('load', value.taskNumMapListResult);
                $("#bootstrap-table3").bootstrapTable('load', value.srmStatusMapList);
                lanse();
            },
            error: function (value) {
                $.modal.msg("服务器错误,请重试...");
            }
        })
    }

    function hongse() {
        //鼠鼻红 合欢红 春梅红 香叶红 艳红 玉红
        $(".table-primary th").css({backgroundColor: "rgb(227,180,184)"});
        $(".table-success th").css({backgroundColor: "rgb(240,161,168)"});
        $(".table-danger th").css({backgroundColor: "rgb(241,147,156)"});
        $(".table-info th").css({backgroundColor: "rgb(240,124,130)"});
        $(".table-dark th").css({backgroundColor: "rgb(237,90,101)"});
        $(".table-warning th").css({backgroundColor: "rgb(192,72,81)"});
        $(".th-inner").css({color: "black"});
    }

    function lanse() {
        //秋波蓝 碧青 涧石蓝 鸢尾蓝 釉蓝 潮蓝
        // $(".table-primary th").css({backgroundColor: "rgb(138,188,209)"});
        // $(".table-success th").css({backgroundColor: "rgb(92,179,204)"});
        // $(".table-danger th").css({backgroundColor: "rgb(102,169,201)"});
        $(".table-primary th").css({backgroundColor: "rgb(21,139,184)"});
        $(".table-success th").css({backgroundColor: "rgb(23,129,181)"});
        $(".table-danger th").css({backgroundColor: "rgb(41,131,187)"});
        $(".table-info th").css({backgroundColor: "rgb(21,139,184)"});
        $(".table-dark th").css({backgroundColor: "rgb(23,129,181)"});
        $(".table-warning th").css({backgroundColor: "rgb(41,131,187)"});
        $(".th-inner").css({color: "black"});
    }

    $("#btn").click(function () {
        if ($("#btn").hasClass("btn-primary")) {
            $("#btn").removeClass("btn-primary").css({backgroundColor: "rgb(128,128,128)"});
            sousuo();
            setTimeout(function () {
                $("#btn").addClass("btn-primary").removeAttr("style");
            }, 1000);
        }
    });

    window.onload = hongse;
</script>
</body>
</html>