feat(mall): 添加订单一键发货和取消发货功能

KKSU

2025-02-11 e8f8d89a4248cd4d0a7138cc2e5a36ea9b136699

 src/main/resources/templates/febs/views/modules/order/orderList.html

@@ -7,9 +7,9 @@
                        <div class="layui-form-item">
                            <div class="layui-col-md10">
                                <div class="layui-inline">
                                    <label class="layui-form-label">用户名：</label>
                                    <label class="layui-form-label">购买人：</label>
                                    <div class="layui-input-inline">
                                        <input type="text" placeholder="用户名" name="name" autocomplete="off" class="layui-input">
                                        <input type="text" placeholder="购买人" name="name" autocomplete="off" class="layui-input">
                                    </div>
                                </div>
                                <div class="layui-inline">
@@ -19,7 +19,7 @@
                                    </div>
                                </div>
                                <div class="layui-inline">
                                    <label class="layui-form-label layui-form-label-sm">订单状态</label>
                                    <label class="layui-form-label layui-form-label-sm">状态</label>
                                    <div class="layui-input-inline">
                                        <select name="status">
                                            <option value="">请选择</option>
@@ -65,14 +65,14 @@
                                        <label class="layui-form-label layui-form-label-sm">开始时间</label>
                                        <div class="layui-input-inline">
                                            <input type="text" name="startTime" id="febs-form-group-date-start" lay-verify="date"
                                                   placeholder="yyyy-MM-dd" autocomplete="off" class="layui-input">
                                                   placeholder="yyyy-MM-dd HH:mm:ss" autocomplete="off" class="layui-input">
                                        </div>
                                </div>
                                <div class="layui-inline">
                                        <label class="layui-form-label layui-form-label-sm">结束时间</label>
                                        <div class="layui-input-inline">
                                            <input type="text" name="endTime" id="febs-form-group-date-end" lay-verify="date"
                                                   placeholder="yyyy-MM-dd" autocomplete="off" class="layui-input">
                                                   placeholder="yyyy-MM-dd HH:mm:ss" autocomplete="off" class="layui-input">
                                        </div>
                                </div>
                            </div>
@@ -89,7 +89,7 @@
                    </form>
                    <table lay-filter="orderTable" lay-data="{id: 'orderTable'}"></table>
                    <style type="text/css">
                        .layui-table-cell{
                        .layui-table cell{
                            text-align:center;
                            height: auto;
                            white-space: nowrap; /*文本不会换行，在同一行显示*/
@@ -98,6 +98,11 @@
                        }
                        .layui-table img{
                            max-width:100px
                        }

                        ::-webkit-scrollbar {
                            height: 20px !important;
                            background-color: #f4f4f4;
                        }
                    </style>
                </div>
@@ -113,7 +118,7 @@
    <a lay-event="edit" shiro:hasPermission="user:update"><i
            class="layui-icon febs-edit-area febs-blue">&#xe7a5;</i></a>
</script>
<script type="text/html" id="tableToolBar">
<script type="text/html" id="tableToolBarOrder">
    <div class="layui-btn-container">
<!--        <button class="layui-btn layui-btn-sm layui-btn-primary febs-button-blue-plain" lay-event="exportDeliverOne">导出待发货订单,系统自动发货</button>-->
<!--        <button class="layui-btn layui-btn-sm layui-btn-primary febs-button-blue-plain" lay-event="confirmOrder">确认到货</button>-->
@@ -138,18 +143,21 @@
            $reset = $view.find('#reset'),
            $searchForm = $view.find('form'),
            $add = $view.find('#add'),
            sortObject = {field: 'phone', type: null},
            sortObject = {field: 'orderTime', type: 'desc'},
            formSelects = layui.formSelects,
            laydate = layui.laydate,
            tableIns;

        let currPageOrder = 1;//首先默认值为1，防止出错
        //获取当前页
        currPageOrder = $view.find(".layui-laypage-em").next().html();
        //日期范围
        laydate.render({
            elem: '#febs-form-group-date-start'
            elem: '#febs-form-group-date-start',type: 'datetime'
        });

        laydate.render({
            elem: '#febs-form-group-date-end'
            elem: '#febs-form-group-date-end',type: 'datetime'
        });


@@ -187,19 +195,24 @@
                    printSelect(checkStatus.data)
                }
            }
            let statisticIds = 0;
            if(event === 'goodsStatistics'){
                var data = checkStatus.data;
                let statistics = 0;
                for(let i = 0;i < data.length;i++){
                        statistics = statistics+ "," + data[i].id;
                }
                console.log(statistics);
                if(statistics == null || statistics == ""){
                    febs.alert.warn('请选择需要统计的订单');
                    return;
                }
                febs.modal.open( '商品数量统计', 'modules/order/goodsStatistics/'+statistics, {
                statisticIds = statistics;
                console.log(statisticIds);
                febs.modal.open( '商品数量统计', 'modules/order/goodsStatistics/'+statisticIds, {
                    maxmin: true,
                });
                statistics = 0;
                // febs.get(ctx + 'admin/order/goodsStatistics?orderIds='+ids, null, function () {
                //     febs.alert.success('操作成功');
                //     $query.click();
@@ -311,9 +324,22 @@
                layEvent = obj.event;
            if (layEvent === 'deliverGoods') {
                febs.modal.open('发货', 'modules/order/deliverGoods/' + data.id, {
                    btn: ['确认', '取消'],
                    btn: ['确认','取消'],
                    yes: function (index, layero) {
                        $('#deliver-update').find('#submit').trigger('click');
                        // $query.click();
                    },
                    btn2: function () {
                        layer.closeAll();
                    }
                });
            }
            if (layEvent === 'updateDeliver') {
                febs.modal.open('修改物流信息', 'modules/order/deliverGoods/' + data.id, {
                    btn: ['确认','取消'],
                    yes: function (index, layero) {
                        $('#deliver-update').find('#deliverInfoSubmit').trigger('click');
                        // $query.click();
                    },
                    btn2: function () {
                        layer.closeAll();
@@ -328,6 +354,16 @@
            if (layEvent === 'cancelOrder') {
                febs.modal.confirm('取消订单', '确认取消订单？', function () {
                    cancelOrder(data.id);
                });
            }
            if (layEvent === 'deliverPdfGoods') {
                febs.modal.confirm('一键发货', '确认一键发货？', function () {
                    deliverPdfGoods(data.id);
                });
            }
            if (layEvent === 'cancelDeliver') {
                febs.modal.confirm('取消发货', '确认取消发货？', function () {
                    cancelDeliver(data.id);
                });
            }
            if (layEvent === 'seePayImage') {
@@ -347,6 +383,13 @@
            }
        });

        function cancelDeliver(id) {
            febs.get(ctx + 'admin/order/cancelDeliver/' + id, null, function (data) {
                febs.alert.success(data.message);
                $query.click();
            });
        }

        function cancelOrder(id) {
            febs.get(ctx + 'admin/order/cancelOrder/' + id, null, function () {
                febs.alert.success('操作成功');
@@ -354,17 +397,193 @@
            });
        }

        function deliverPdfGoods(id) {
            febs.get(ctx + 'admin/order/deliverPdfGoods/' + id, null, function (e) {
                if (e.code == 200) {
                    // 创建弹层容器
                    const content = `
                                        <div style="position:relative;min-height:500px">
                                          <div id="pdfContainer" style="margin:20px auto;max-width:800px"></div>
                                          <div class="layui-form" style="text-align:center;margin-top:20px">
                                            <button class="layui-btn layui-btn-normal" onclick="printPdf()">打印</button>
                                          </div>
                                        </div>
                                      `;

                    // 显示弹层
                    const index = layer.open({
                        type: 1,
                        title: "电子面单",
                        content: content,
                        area: ['90%', '90%'],
                        success: function() {
                            // 渲染PDF
                            renderPdf(e.data.pdfStream);
                        }
                    });
                    // 存储当前PDF数据
                    window.currentPDF = e.data.pdfStream;
                } else {
                    febs.alert.warn(e.message);
                }
            });
            $query.click();
        }

        // PDF渲染函数
        function renderPdf(base64Data) {
            // 清理容器
            const container = document.getElementById('pdfContainer');
            container.innerHTML = '';

            // Base64转Blob
            const byteCharacters = atob(base64Data);
            const byteNumbers = new Array(byteCharacters.length);
            for (let i = 0; i < byteCharacters.length; i++) {
                byteNumbers[i] = byteCharacters.charCodeAt(i);
            }
            const byteArray = new Uint8Array(byteNumbers);
            const blob = new Blob([byteArray], {type: 'application/pdf'});

            // 生成临时URL
            const url = URL.createObjectURL(blob);

            // 使用PDF.js渲染
            pdfjsLib.getDocument(url).promise.then(pdf => {
                // 循环渲染所有页面
                for (let pageNum = 1; pageNum <= pdf.numPages; pageNum++) {
                    pdf.getPage(pageNum).then(page => {
                        const scale = 1.5;
                        const viewport = page.getViewport({scale: scale});
                        const canvas = document.createElement('canvas');
                        const context = canvas.getContext('2d');
                        canvas.height = viewport.height;
                        canvas.width = viewport.width;

                        // 创建页面容器
                        const pageDiv = document.createElement('div');
                        pageDiv.className = 'pdf-page';
                        pageDiv.style.margin = '10px 0';
                        container.appendChild(pageDiv);

                        // 渲染到Canvas
                        page.render({
                            canvasContext: context,
                            viewport: viewport
                        }).promise.then(() => {
                            pageDiv.appendChild(canvas);
                        });
                    });
                }
            });
        }

        // 打印函数
        window.printPdf = function() {
            let base64Image = window.currentPDF;
            const printWindow = window.open('', '_blank');
            printWindow.document.write(`
                                        <html>
                                          <head>
                                            <title>电子面单打印</title>
                                            <style>
                                              body { margin: 0; padding: 20px }
                                              canvas {
                                                width: 100%!important;
                                                height: auto!important;
                                                page-break-after: always;
                                              }
                                            </style>
                                          </head>
                                          <body>
                                            <iframe src="data:application/pdf;base64,`+base64Image+`" width="100%" height="100%"></iframe>
                                          </body>
                                        </html>
                                      `);
            printWindow.document.close();
            printWindow.onload = function() {
                printWindow.print();
                printWindow.close();
            }
        }

        // function deliverPdfGoods(id) {
        //     febs.get(ctx + 'admin/order/deliverPdfGoods/' + id, null, function (e) {
        //         if(e.code == 200){
        //             console.info(e.data);
        //             console.info(e.data.pdfStream);
        //             console.info(e.data.result);
        //             layer.open({
        //                 type: 1,
        //                 title: "电子面单",
        //                 skin: 'layui-layer-rim', //加上边框
        //                 area: ['100%', '100%'], //宽高
        //                 shadeClose: true, //开启遮罩关闭
        //                 end: function (index, layero) {
        //                     return false;
        //                 },
        //                 content: '<div class="layui-card-body" id="pdfViewer"></div>'
        //             });
        //             if(e.data.pdfStream === null){
        //
        //                 renderPdf(e.data.pdfStreamList);
        //             }
        //             renderPdf(e.data.pdfStream);
        //         }else{
        //             febs.alert.warn(e.message);
        //         }
        //         $query.click();
        //     });
        // }

        // 渲染 PDF 到页面
        // function renderPdf(base64Data) {
        //     // Base64 转 Blob
        //     const byteCharacters = atob(base64Data);
        //     const byteNumbers = new Array(byteCharacters.length);
        //     for (let i = 0; i < byteCharacters.length; i++) {
        //         byteNumbers[i] = byteCharacters.charCodeAt(i);
        //     }
        //     const byteArray = new Uint8Array(byteNumbers);
        //     const blob = new Blob([byteArray], {type: 'application/pdf'});
        //
        //     // 生成临时 URL
        //     const url = URL.createObjectURL(blob);
        //
        //     // 使用 PDF.js 渲染
        //     pdfjsLib.getDocument(url).promise.then(function(pdf) {
        //         pdf.getPage(1).then(function(page) {
        //             const scale = 1.5;
        //             const viewport = page.getViewport({scale: scale});
        //             const canvas = document.createElement('canvas');
        //             const context = canvas.getContext('2d');
        //             canvas.height = viewport.height;
        //             canvas.width = viewport.width;
        //
        //             // 将 PDF 页面渲染到 Canvas
        //             page.render({
        //                 canvasContext: context,
        //                 viewport: viewport
        //             }).promise.then(function() {
        //                 $('#pdfViewer').html(canvas);
        //             });
        //         });
        //     }).catch(function(error) {
        //         layer.msg('PDF渲染失败: ' + error.message, {icon: 2});
        //     });
        // }

        // 查询按钮
        $query.on('click', function () {
            var params = $.extend(getQueryParams(), {field: sortObject.field, order: sortObject.type});
            tableIns.reload({where: params, page: {curr: 1}});
            tableIns.reload({where: params, page: {curr: currPageOrder}});
        });

        // 刷新按钮
        $reset.on('click', function () {
            $searchForm[0].reset();
            sortObject.type = 'null';
            tableIns.reload({where: getQueryParams(), page: {curr: 1}, initSort: sortObject});
            tableIns.reload({where: getQueryParams(), page: {curr: currPageOrder}, initSort: sortObject});
        });

        $add.on('click', function () {
@@ -378,16 +597,19 @@
                url: ctx + 'admin/order/orderList?orderType=1',
                // defaultToolbar: [],
                //系统自带打印导出
                toolbar: '#tableToolBar',
                totalRow : true,
                toolbar: '#tableToolBarOrder',
                cols: [[
                        {type: 'checkbox', fixed: 'left'},
                        {field: 'orderNo', title: '订单编号', minWidth: 200,align:'left'},
                        {field: 'orderNo', title: '订单编号', minWidth: 200,align:'left' ,totalRowText:"合计"},
                        {field: 'memberName', title: '购买人', minWidth: 100,align:'left'},
                        {field: 'memberPhone', title: '联系方式', minWidth: 120,align:'left'},
                        {field: 'refererName', title: '推荐人', minWidth: 100,align:'left'},
                        {field: 'goodsName', title: '商品', minWidth: 160,align:'left'},
                        {field: 'goodsAmount', title: '价格', minWidth: 80,align:'left'},
                        {field: 'carriage', title: '邮费', minWidth: 80,align:'left'},
                        {field: 'amount', title: '总金额', minWidth: 100,align:'left'},
                        {field: 'remark', title: '备注', minWidth: 160,align:'left'},
                        {field: 'goodsAmount', title: '价格', minWidth: 80,align:'left', totalRow:true},
                        {field: 'carriage', title: '邮费', minWidth: 80,align:'left', totalRow:true},
                        {field: 'amount', title: '总金额', minWidth: 100,align:'left', totalRow:true},
                        {field: 'orderTime', title: '下单时间', minWidth: 200,align:'left'},
                        {field: 'status', title: '状态',
                            templet: function (d) {
@@ -427,8 +649,13 @@
                        {title: '操作',
                            templet: function (d) {
                                if(d.status === 2){
                                    return '<button class="layui-btn layui-btn-normal layui-btn-xs" lay-event="deliverPdfGoods" shiro:hasPermission="user:update">一键发货</button>'
                                    +'<button class="layui-btn layui-btn-normal layui-btn-xs" lay-event="seeOrder" shiro:hasPermission="user:update">详情</button>'
                                    // +'<button class="layui-btn layui-btn-normal layui-btn-xs" lay-event="deliverGoods" shiro:hasPermission="user:update">发货</button>'
                                }else if(d.status === 3){
                                    return '<button class="layui-btn layui-btn-normal layui-btn-xs" lay-event="seeOrder" shiro:hasPermission="user:update">详情</button>'
                                    +'<button class="layui-btn layui-btn-normal layui-btn-xs" lay-event="deliverGoods" shiro:hasPermission="user:update">发货</button>'
                                        +'<button class="layui-btn layui-btn-normal layui-btn-xs" lay-event="cancelDeliver" shiro:hasPermission="user:update">取消发货</button>'
                                    // +'<button class="layui-btn layui-btn-normal layui-btn-xs" lay-event="updateDeliver" shiro:hasPermission="user:update">修改物流信息</button>'
                                }else{
                                    return '<button class="layui-btn layui-btn-normal layui-btn-xs" lay-event="seeOrder" shiro:hasPermission="user:update">详情</button>'
                                }
@@ -505,7 +732,7 @@
            //用于包含内容
            var v = document.createElement("div");
            //页面头部，导入css  ，media="print"表示打印时使用该样式
            var f = ["<head>", "<style>", "div{font-size:8px;}", ".main{width:100%;height:20%}",
            var f = ["<head>", "<style>", "div{font-size:8px;}", ".main{width:100%;}",
                ".main div{width:100%;display:inline-block;}", "</style>", "</head>"
            ].join("");
            var contentHtml = "";
@@ -513,12 +740,12 @@
                let data = allData[i]
                var template =
                    "<div class='main'>" +
                    // "<div style='text-align: center;font-size: 22px;font-weight: bold;margin-bottom: 30px'>订单详情</div>" +
                    "<div>姓名：" + data.name + "</div><br><br>" +
                    "<div>电话：" + data.phone + "</div><br><br>" +
                    "<div>地址：" + data.address + "</div><br><br>" +
                    "<div>编号：" + data.orderNo + "</div><br><br>" +
                    "<div>商品：" + data.goodsName + "</div><br><br>" +
                    "<div style='text-align: center;font-size: 10px;font-weight: bold;margin-bottom: 10px'>订单编号：" + data.orderNo + "</div>" +
                        "<span style='font-size: 10px;font-weight: bold;'>收货人：</span><span>" + data.name + "，</span>" +
                        "<span style='font-size: 10px;font-weight: bold;'>电话：</span><span>" + data.phone + "，</span>" +
                        "<span style='font-size: 10px;font-weight: bold;'>地址：</span><span>" + data.address + "</span><br>" +
                        "<span style='font-size: 10px;font-weight: bold;'>商品：</span><span>" + data.goodsName + "</span><br>" +
                        "<span style='font-size: 10px;font-weight: bold;'>备注：</span><span>" + data.remark + "</span><br>" +
                    "</div>"

                contentHtml += template;