@extends('layouts.father')
@section('style')
    <style>
        body{
            position: relative;
        }
        /*.layui-form-item{*/
        /*clear: none!important;*/
        /*}*/

        .info_tr a{
            text-decoration: underline!important;
        }
        .info_tr a:hover{
            color: red!important;
        }
        .layui-btn-warm{
            width: 60px;
            height: 10px;
        }
    </style>
@endsection
@section('title', '装箱单列表')
@section('body')
    <div class="wrap">
        <div class="x-nav">
      <span class="layui-breadcrumb">
        <a onclick="goindex()">首页</a>
        <a href="#">库存管理</a>
        <a>
          <cite>装箱单列表</cite></a>
      </span>
            <a class="layui-btn layui-btn-small" style="line-height:1.6em;margin-top:3px;float:right"
               href='/admin/packingList' title="刷新"><i class="layui-icon" style="line-height:30px">&#xe669;</i></a>
        </div>
        <div class="x-body">
            <form action="" class="layui-form-item layui-form" style="height: 100%;position: relative;width: 100%;">
                <div class="layui-form">
                    <div class="layui-form-item">
                        <div class="buttonIndex" style="margin-left: 15px">
                            <a class="indexAbottonHref" href="/admin/packingList">全部</a>
                            <a class="indexAbottonHref" href="/admin/packingList?date=today">今日</a>
                            <a class="indexAbottonHref" href="/admin/packingList?date=week"> <span>最近一周</span></a>
                            <a class="indexAbottonHref" title="新建装箱单" target="_blank" href="{{env("APP_PDA_URL")}}#/fillingGoods?id=&FGid=&number=">新建装箱单</a>

                        </div>
                        <div class="layui-inline">
                            <div class="layui-input-inline">
                                <input name="dateList" type="text" placeholder="选择日期范围" class="layui-input" id="test6" placeholder="" lay-key="7">
                            </div>
                            <div class="layui-input-inline">
                                <input type="text" name="number" @if(isset($req['number']))  value="{{$req['number']}}" @endif  placeholder="装箱单编号" autocomplete="off" class="layui-input">
                            </div>
                            <div class="layui-input-inline">
                                <input type="text" name="relevance" @if(isset($req['relevance']))  value="{{$req['relevance']}}" @endif  placeholder="订单号" autocomplete="off" class="layui-input">
                            </div>
                            <div class="layui-input-inline">
                                <input type="text" name="express" @if(isset($req['express']))  value="{{$req['express']}}" @endif  placeholder="快递单号" autocomplete="off" class="layui-input">
                            </div>
                            <div class="layui-input-inline" id="changes">
                                <select name="order_shop" lay-filter="enteradd" lay-verify="required" lay-search>
                                    <option value="">请选择门店名称</option>
                                    @foreach($order_shop as $b)
                                        <option @if(isset($req['order_shop']) && $req['order_shop'] == $b) selected @endif>{{$b}}</option>
                                    @endforeach
                                </select>
                            </div>
                            <input type="hidden" name="text" value="">
                            <button class="layui-btn" style="margin: 0" lay-filter="sreach"><i class="layui-icon">&#xe615;</i></button>
                        </div>
                        <div>
                            <input type="checkbox" name="all" title="全选" id="all" style="margin: 0" lay-filter="all">
                            <div class="layui-btn layui-btn-sm" style="margin-top: 5px" onclick="all_express()">打印快递单</div>
                            <div class="layui-btn layui-btn-sm" style="margin-top: 5px" onclick="JD_all_express()">打印京东快递单</div>
                            {{--<div class="layui-btn layui-btn-sm" style="margin-top: 5px" onclick="all_excel()">导出发货明细表</div>
                            <div class="layui-btn layui-btn-sm" style="margin-top: 5px" onclick="all_excelprint()">打印发货明细表</div>--}}
                        </div>
                    </div>
                </div>
            </form>
            <form class="layui-form" action="">
                <div id="table">
                        <table class="layui-table" lay-size="sm">
                            <thead>
                            <tr class="tr_head">
                                <th class="checkboxId">选择</th>
                                <th>序号</th>
                                <th>ID</th>
                                <th>装箱单编号</th>
                                <th>订单号</th>
                                @if(isset($packinginfo_list[0]))
                                    <th>api单号</th>
                                @endif
                                <th>快递单号</th>
                                <th>客户名称</th>
                                <th>创建人</th>
                                <th>订单状态</th>
                                <th>创建时间</th>
                                <th class="tdEnd">操作</th>
                            </tr>
                            </thead>
                        </table>
                        <table class="layui-table" lay-size="sm">
                            <tbody id="x-img">
                            @if($packing_role)
                                @foreach($packing as $key=>$v)
                                    <tr class="info_tr">
                                        <td class="checkboxId">
                                            <input type="checkbox" name="select" lay-skin="primary" class="selectTd" lay-filter="selectTd">
                                        </td>
                                        <td>{{ $key + 1 }}</td>
                                        <td class="express-id">{{ $v->id}}</td>
                                        <td>
                                            <a class="shopIdTd" href="{{env('APP_PDA_URL')}}#/fillingGoods?FGid={{$v->id}}&number={{$v->packing_num}}&type=false" target="_blank" onclick="go_FGurl()">{{$v->packing_num}}</a>
                                        </td>
                                        <td>
                                            @if(substr($v->relevance,0,1) == 'H')
                                                <a class="shopIdTd" onclick="x_admin_show('售后单','/admin/afterSaleAdd?id={{$v->relevance}}')" >{{$v->relevance}}</a>
                                            @else
                                                <a class="shopIdTd" onclick="x_admin_show('订单','/admin/orderDetail/{{$v->relevance}}')" >{{$v->relevance}}</a>
                                            @endif
                                        </td>
                                        @if(isset($packinginfo_list[0]))
                                            <td>{{ $v->api_number }}</td>
                                        @endif
                                        <td>{{ $v->express ? $v->express : $v->expressDIY }}</td>
                                        <td>{{$v->kh_name}}</td>
                                        <td>{{$v->creater}}</td>
                                        <td>{{$v->ostatus}}</td>
                                        <td>{{$v->created_at}}</td>
                                        <td class="tdEnd">
                                            <!-- <a class="layui-btn layui-btn-xs layui-btn-danger" onclick="packingDel({{$v->id}})" href="javascript:;">删除</a> 删除隐藏-->
                                            {{-- <a class="layui-btn layui-btn-xs" href='/admin/packExcel?id={{$v->id}}' href="javascript:;">导出发货明细表</a>--}}
                                            <a class="layui-btn layui-btn-xs" href="javascript:;" onclick="x_admin_show('快递单','/admin/packExpress?id={{$v->id}}')" >打印快递单</a>
                                            <a class="layui-btn layui-btn-warm layui-btn-xs" onclick="x_admin_show('日志详情','/admin/historyInfo/{{$v->packing_num}}')" href="javascript:;">查看日志</a>
                                        </td>
                                    </tr>
                                @endforeach
                            @endif
                            </tbody>
                        </table>
                    </div>
            </form>
            <div class="page">
                <div>
                    {{$packing->appends($req)->links()}}
                </div>
            </div>
        </div>
    </div>
    <script>
        //表格打印
        function  all_excelprint(){
            let time=$('input[name="dateList"]').val();
            let shop=document.querySelector('#changes > div > div >input').value;
            // 选择页面中所有class为'layui-inline'的div
            // 使用split方法分割这个字符串，得到一个包含两个日期的数组
            var dates = time.split(' ~ ');
            var startDate = new Date(dates[0]);
            var endDate = new Date(dates[1]);
            // 计算两个日期之间的差异（以毫秒为单位）
            var difference = endDate - startDate;
            var days = difference / (1000 * 60 * 60 * 24);

            if (days >= 7) {
                var boolen=false;
            } else {
                var boolen=true;
            }
            if(time&&shop&&boolen===true){
                let shops=shop;
                shop = encodeURIComponent(shop);
                let indexs =layer.load();
                $.get("/admin/packPrint?time="+time+"&shop="+ shop, function (res) {
                    if(res.data&&res.data!=""){
                        layer.close(indexs);
                        layer.open({
                            type: 1,
                            closeBtn:1,
                            title: '发货明细',
                            skin: 'layui-layer-rim', //加上边框
                            area: ['1050px', '600px'], //宽高
                            content: urls(res.data,shops,time),
                        });
                    }else {
                        layer.alert('数据为空', {icon: 5});
                        layer.close(indexs);
                    }

                });
            }else {
                layer.alert('需要选择门店和时间区间或选择的时间区间大于7天', {icon: 5});
            }
        }
        function dayin(){
            $('.dayin').remove()
            wrapHtml = document.querySelector('.x-body').innerHTML
            bdhtml = document.querySelector('.alls').innerHTML;//获取当前页的html代码
            sprnstr = "<!--startprint" + 1 + "-->";//设置打印开始区域
            eprnstr = "<!--endprint" + 1 + "-->";//设置打印结束区域
            prnhtml = bdhtml.substring(bdhtml.indexOf(sprnstr) + 18); //从开始代码向后取html
            prnhtml = prnhtml.substring(0, prnhtml.indexOf(eprnstr));//从结束代码向前取html
            window.document.body.innerHTML = prnhtml;
            window.print();
            location.reload()
        }
        //表格内容渲染
        function urls(res,shops,time){
            let url="";
            url += '<div class="alls">'
            url += '<!--startprint1--><!--打印内容开始-->'
            url += '<div class="dayin">'
            url += '<button class="layui-btn" onclick="dayin()">打印</button>';
            url += '</div>'
            url+='<div class="prints">';
            url += '<div id="table-head" style="margin-top: 20px; text-align: center; font-size: 35px; font-weight: bold; position: relative;">';
// 添加"米乐+外发明细表"文本
            url += '米乐+外发明细表';
            url += '<div id="times" style="position: absolute; top: 90px; right: 110px; font-size: 12px; font-weight: bold;">' + time + '</div>';
            url += '</div>';
            url += '<div id="milan" style="margin-top: 20px; text-align: center; font-size: 35px; font-weight: bold;">';
            // 添加"米乐+外发明细表"文本
            if(shops.includes('米兰')){
                url += '收货单位: 米兰';
            }else if(shops.includes('威撒')){
                url += '收货单位: 威撒';
            }else if(shops.includes('城市素颜')){
                url += '收货单位: 城市素颜';
            }else if(shops.includes('领绣')){
                url += '收货单位: 领绣';
            }else if(shops.includes('帘创优家')){
                url += '收货单位: 帘创优家';
            }else if(shops.includes('绣工坊')){
                url += '收货单位: 绣工坊';
            }else {
                url += '收货单位: '+shops;
            }
            url += '</div>';
        // 添加<table>标签及其内部内容
            url += '<table id="my-table" class="layui-table" style="width: 80%;margin-left: 100px">';
            url += '<thead>';
            if(shops.includes('米兰')){
                url += '<tr>';
                url += '<th>序号</th>';
                url += '<th>商品名</th>';
                url += '<th>宽度</th>';
                url += '<th>高度</th>';
                url += '<th>项目名称</th>';
                url += '<th>明细码</th>';
                url += '</tr>';
            }else if(shops.includes('威撒')){
                url += '<tr>';
                url += '<th>序号</th>';
                url += '<th>商品名</th>';
                url += '<th>型号</th>';
                url += '<th>宽度</th>';
                url += '<th>高度</th>';
                url += '<th>项目名称</th>';
                url += '<th>备注</th>';
                url += '<th>明细码</th>';
                url += '</tr>';
            }else if(shops.includes('城市素颜')){
                url += '<tr>';
                url += '<th>序号</th>';
                url += '<th>明细id</th>';
                url += '<th>收货人姓名</th>';
                url += '<th>规格</th>';
                url += '<th>备注</th>';
                url += '</tr>';
            }else if(shops.includes('领绣')){
                url += '<tr>';
                url += '<th>发货时间</th>';
                url += '<th>米乐+ID明细</th>';
                url += '<th>订单号</th>';
                url += '<th>房称-行号</th>';
                url += '<th>序号</th>';
                url += '<th>备注</th>';
                url += '</tr>';
            }
            else if(shops.includes('帘创优家')){
                url += '<tr>';
                url += '<th>序号</th>';
                url += '<th>明细码</th>';
                url += '<th>收货人姓名</th>';
                url += '<th>商品名</th>';
                url += '<th>主布</th>';
                url += '<th>配布</th>';
                url += '<th>开合方向</th>';
                url += '<th>宽度</th>';
                url += '<th>高度</th>';
                url += '<th>主布用料</th>';
                url += '<th>配布用料</th>';
                url += '<th>备注</th>';
                url += '</tr>';
            }else if(shops.includes('绣工坊')){
                url += '<tr>';
                url += '<th>序号</th>';
                url += '<th>明细码</th>';
                url += '<th>收货人姓名</th>';
                url += '<th>商品名</th>';
                url += '<th>时间</th>';
                url += '<th>主布</th>';
                url += '<th>备注</th>';
                url += '</tr>';
            }else {
                url += '<tr>';
                url += '<th>序号</th>';
                url += '<th>明细码</th>';
                url += '<th>商品名</th>';
                url += '<th>主布</th>';
                url += '<th>开合方向</th>';
                url += '<th>宽度</th>';
                url += '<th>高度</th>';
                url += '<th>项目名称</th>';
                url += '<th>备注</th>';
                url += '</tr>';
            }
            url += '</thead>';
            url += '<tbody>';
        // 添加表格内容行
            if(shops.includes('米兰')){
                for (let i = 0; i < res.length; i++) {
                    url += '<tr>';
                    url += '<td>' + res[i]["序号"] + '</td>';
                    url += '<td>' + res[i]["商品名"] + '</td>';
                    url += '<td>' + res[i]["宽度"] + '</td>';
                    url += '<td>' + res[i]["高度"] + '</td>';
                    url += '<td>' + res[i]["项目名称"] + '</td>';
                    url += '<td>' + res[i]["明细码"] + '</td>';
                    url += '</tr>';
                }
            }else if(shops.includes('威撒')){
                for (let i = 0; i < res.length; i++) {
                    url += '<tr>';
                    url += '<td>' + res[i]["序号"] + '</td>';
                    url += '<td>' + res[i]["商品名称"] + '</td>';
                    url += '<td>' + res[i]["型号"] + '</td>';
                    url += '<td>' + res[i]["宽度"] + '</td>';
                    url += '<td>' + res[i]["高度"] + '</td>';
                    url += '<td>' + res[i]["项目名称"] + '</td>';
                    url += '<td>' + res[i]["备注"] + '</td>';
                    url += '<td>' + res[i]["明细码"] + '</td>';
                    url += '</tr>';
                }
            }else if(shops.includes('城市素颜')){
                for (let i = 0; i < res.length; i++) {
                    url += '<tr>';
                    url += '<td>' + res[i]["序号"] + '</td>';
                    url += '<td>' + res[i]["明细id"] + '</td>';
                    url += '<td>' + res[i]["收货人姓名"] + '</td>';
                    url += '<td>' + res[i]["规格"] + '</td>';
                    url += '<td>' + res[i]["备注"] + '</td>';
                    url += '</tr>';
                }
            }else if(shops.includes('领绣')){
                for (let i = 0; i < res.length; i++) {
                url += '<tr>';
                url += '<td>' + res[i]["发货时间"] + '</td>';
                url += '<td>' + res[i]["米乐+ID明细"] + '</td>';
                url += '<td>' + res[i]["订单号"] + '</td>';
                url += '<td>' + res[i]["房称-行号"] + '</td>';
                url += '<td>' + res[i]["序号"] + '</td>';
                url += '<td>' + res[i]["备注"] + '</td>';
                url += '</tr>';
                }
            }else if(shops.includes('帘创优家')){
                for (let i = 0; i < res.length; i++) {
                    url += '<tr>';
                    url += '<td>' + res[i]["序号"] + '</td>';
                    url += '<td>' + res[i]["明细码"] + '</td>';
                    url += '<td>' + res[i]["收货人姓名"] + '</td>';
                    url += '<td>' + res[i]["商品名"] + '</td>';
                    url += '<td>' + res[i]["主布"] + '</td>';
                    url += '<td>' + res[i]["配布"] + '</td>';
                    url += '<td>' + res[i]["开合方向"] + '</td>';
                    url += '<td>' + res[i]["宽度"] + '</td>';
                    url += '<td>' + res[i]["高度"] + '</td>';
                    url += '<td>' + res[i]["主布用料"] + '</td>';
                    url += '<td>' + res[i]["配布用料"] + '</td>';
                    url += '<td>' + res[i]["备注"] + '</td>';
                    url += '</tr>';
                }
            }else if(shops.includes('绣工坊')){
                for (let i = 0; i < res.length; i++) {
                    url += '<tr>';
                    url += '<td>' + res[i]["序号"] + '</td>';
                    url += '<td>' + res[i]["明细码"] + '</td>';
                    url += '<td>' + res[i]["收货人姓名"] + '</td>';
                    url += '<td>' + res[i]["商品名"] + '</td>';
                    url += '<td>' + res[i]["时间"] + '</td>';
                    url += '<td>' + res[i]["主布"] + '</td>';
                    url += '<td>' + res[i]["备注"] + '</td>';
                    url += '</tr>';
                }
            }else{
                for (let i = 0; i < res.length; i++) {
                    url += '<tr>';
                    url += '<td>' + res[i]["序号"] + '</td>';
                    url += '<td>' + res[i]["明细码"] + '</td>';
                    url += '<td>' + res[i]["商品名"] + '</td>';
                    url += '<td>' + res[i]["主布"] + '</td>';
                    url += '<td>' + res[i]["开合方向"] + '</td>';
                    url += '<td>' + res[i]["宽度"] + '</td>';
                    url += '<td>' + res[i]["高度"] + '</td>';
                    url += '<td>' + res[i]["项目名称"] + '</td>';
                    url += '<td>' + res[i]["备注"] + '</td>';
                    url += '</tr>';
                }
            }
            url += '</tbody>';
            url += '</table>';
            url+='</div>';
            url += '<!--打印内容结束--><!--endprint1-->'
            url+='</div>';
            return url
        }

        function all_number_data() {
            let customization_data = []
            $('.selectTd').each(function () {
                if($(this)[0].checked === true){
                    if($(this).parent().parent().find('.express-id').text() !== ''){
                        customization_data.push($(this).parent().parent().find('.express-id').text())
                    }
                }
            })
            return customization_data
        }
        function JD_all_express(){
            let data = all_number_data()
            if(data.length !== 0){
              x_admin_show('JD快递单' , '/admin/packExpress?id=' + data.join() + '&type=jd')
            }else{
              layer.alert('请先勾选要打印的明细' , {icon:5})
            }
        }

        function all_express() {
            let data = all_number_data()
            if(data.length !== 0){
                x_admin_show('快递单','/admin/packExpress?id=' + data.join() + '&type=dd')
            }else {
                layer.alert('请先勾选要打印的明细', {icon: 5});
            }
        }
        function all_excel() {
            let time=$('input[name="dateList"]').val();
            let shop=document.querySelector('#changes > div > div >input').value;
            // 选择页面中所有class为'layui-inline'的div
            // 使用split方法分割这个字符串，得到一个包含两个日期的数组
            var dates = time.split(' ~ ');
            var startDate = new Date(dates[0]);
            var endDate = new Date(dates[1]);
            // 计算两个日期之间的差异（以毫秒为单位）
            var difference = endDate - startDate;
            var days = difference / (1000 * 60 * 60 * 24);
            if (days >= 7) {
               var boolen=false;
            } else {
                var boolen=true;
            }
            if(time&&shop&&boolen===true){
                 shop = encodeURIComponent(shop);
                location.href="/admin/packExcel?time="+time+"&shop="+ shop;
            }else {
                layer.alert('需要选择门店和时间区间或选择的时间区间大于7天', {icon: 5});
            }
        }
        layui.use(['form','laydate'], () => {
            var form = layui.form
            var laydate = layui.laydate;
            //日期范围
            laydate.render({
                elem: '#test6'
                ,range: '~'
                , type: 'datetime'
                ,format: 'yyyy-MM-dd HH:mm:ss'
            });
            form.on('checkbox(all)', function (data) {
                var a = data.elem.checked;
                if (a === true) {
                    $(".selectTd").prop("checked", true);
                    form.render('checkbox');
                } else {
                    $(".selectTd").prop("checked", false);
                    form.render('checkbox');
                }
            })
            form.on('checkbox(filter)', function(data){
                if(!data.elem.checked){
                    dy_cs.push(data.elem.value)
                }else {
                    for(let i = 0; i < dy_cs.length ; i++){
                        if(dy_cs[i] === data.elem.value){
                            dy_cs.splice(i,1)
                        }
                    }
                }
            });
        })

        function packingDel(id) {
            layer.confirm('确认要删除吗？', function (index) {
                //发异步删除数据
                $.post("/admin/packingDel", {
                    '_token': '{{ csrf_token() }}',
                    'id':id
                }, function (res) {

                    // 发异步，把数据提交给php
                    if (res.status == 1) {
                        //发异步把用户状态进行更改
                        layer.msg(res.msg, {icon: 6, time: 1000}, function () {

                            location.reload();
                        });
                    } else {

                        layer.alert(res.msg, {icon: 5});
                    }
                });
            });

        }
    </script>
    <script type="text/javascript" src="/js/tableContentRoll.js"></script>
    <script type="text/javascript" src="/js/outboundPrint.js"></script>
    <link rel="stylesheet" href="/css/tableContentRoll.css">
@endsection