http://www.c-lodop.com/LodopDemo.html


<?php
/**
 * Created by PhpStorm.
 * User: huzhen
 * Date: 2018/3/15
 * Time: 下午2:40
 */
use yiiootstrapActiveForm;
use yiiwidgetsLinkPager;
use PSIutilFormatUtil;
use PSIassetsSelect2Asset;
use PSIassetsDateAsset;
use PSIassetsIviewAsset;

IviewAsset::register($this);
DateAsset::register($this);
Select2Asset::register($this);
$this->title = '每日订单汇总（接单员）';
$this->params['breadcrumbs'][] = ['label' => '订单管理', 'url' => ['index']];
$this->params['breadcrumbs'][] = $this->title;
?>
<style>
    #app{
        min-height: 500px;
    }
    #ereryOrder{
        padding: 15px 30px;
    }
    .selectBox{
        padding: 15px 0;
    }
    .position_top{
        position: relative;
        top:8px;
    }
</style>
<script language="javascript" src="/lodop6/LodopFuncs.js"></script>
<object  id="LODOP_OB" classid="clsid:2105C259-1E0C-4534-8141-A753534CB4CA" width=0 height=0>
    <embed id="LODOP_EM" type="application/x-print-lodop" width=0 height=0></embed>
</object>
<div id="app" class="container">
    <div id="ereryOrder">
        <div class="selectBox">
            <Row :gutter="16"  >
                <i-col span="6">
                    <Date-picker :value="selectDate" @on-change="chooseDate" format="yyyy-MM-dd " type="date" placeholder="请选择日期"></Date-picker>
                </i-col>
                <i-col span="6">
                    <i-select v-model="selectMeal" @on-change="chooseMeal" placeholder="请选择餐类">
                        <i-option v-for="item in mealType" :value="item.value" :key="item.value">{{ item.label }}</i-option>
                    </i-select>
                </i-col>
                <i-col span="6">
                    <i-select v-model="selectClerk" @on-change="chooseClerk" placeholder="请选择接单员">
                        <i-option v-for="item in clerkList" :value="item.value" :key="item.value">{{ item.label }}</i-option>
                    </i-select>
                </i-col>
            </Row>
        </div>
        <div class="row">
            <div class="col-xs-2">
                <button  class="btn btn-danger hidden-print" onclick="CheckIsInstall()">检测打印机</button>　
            </div>
            <div class="col-xs-2  position_top">
                <input type="radio" id="Radio2" name="RadioS1" onclick="CreatePrinterList()" class='hidden-print'>
                <span class='hidden-print'>指定打印机:</span>
            </div>
            <div class="col-xs-3 position_top">
                <select id="PrinterList" size="1" class='hidden-print'></select>
            </div>
            <div class="col-xs-1 col-xs-offset-2">
                <button id="reload" type="button" class="btn btn-primary" onclick="reload()">刷新</button>
            </div>
            <div class="col-xs-2">
            <span id="print-export"><button onclick="printOrder()" class="btn btn-info">打印</button>
            </div>
        </div>
        <hr>
        <div id='table-detail'>
            <div  class="detailMsg" style="border: 1px solid black;margin-bottom: 20px;padding: 0 15px 15px;overflow: hidden" v-for="item in orderList">
                <div class="row detailMsg_header" style="padding: 15px;border-bottom: 1px solid black">
                    <div class="col-xs-12">
                        <span>接收人:</span><span class="margin-right_20" style="margin-right: 20px;">{{item.receipt_name}}</span>
                        <span>电话:</span><span class="margin-right_20" style="margin-right: 20px;">{{item.mobile}}</span>
                        <span>地址:</span><span class="margin-right_20" style="margin-right: 20px;">{{item.address}}</span>
                    </div>
                </div>
                <div class="detailMsg_meal" style="padding: 15px 0 0 0;text-align:center;overflow:hidden;">
                    <div  v-for="meal in item.orderMsg" style=" 25%;float:left;display: inline-block;margin-bottom:5px">
                        <div class="detailMsg-meal_border" style="border: 1px solid black;padding: 5px;margin-right: 5px">
                            <div>{{meal.shop_product_name}}</div>
                            <div>{{meal.property_option_name}}</div>
                            <div>{{meal.property_str}}</div>
                        </div>
                    </div>
                </div>
            </div>
        </div>
    </div>
    <div>
        <?php
        if ($pages){
            echo LinkPager::widget([
                'pagination' => $pages,
            ]);
        }
        ?>
        <hr/>

    </div>
</div>

<script>
    <?php $this->beginBlock('js') ?>
    var app = new Vue({
        el: '#app',
        data:{
            selectDate:"<?= $date ?>",
            selectMeal:<?= (int)$sellTimeType ?>,
            mealType:<?= $sellTimeTypeJson ?>,
            selectClerk:"<?= $userId ?>",
            clerkList:<?= $clerkOrderList ?>,
            orderList:<?= $formatConsigneeArr ?>
        }
        ,methods:{
            chooseDate(value){
                this.selectDate=value
                this.postData()
            },
            chooseMeal(value){
                this.postData()
            },
            chooseClerk(value){
                this.postData()
            },
            postData(value){
                let superMallId = "<?= Yii::$app->request->get('superMallId') ?>";
                window.location.href="/shop/clerk-order/clerk-order-summary?superMallId="+superMallId+"&date="+this.selectDate+"&sellTimeType="+this.selectMeal+"&userId="+this.selectClerk;
            }
        }
    });

    function reload() {
        window.location.reload();
    }

    var arrJson=[1];

    function printOrder(){
        for(var key in arrJson){
            PrintInFullPage(arrJson[key]);
        }
        alert("表格打印创建成功");
    }
    function CheckIsInstall() {
        try{
            var LODOP=getLodop();
            if (LODOP.VERSION) {
                if (LODOP.CVERSION)
                    alert("当前有C-Lodop云打印可用!
 C-Lodop版本:"+LODOP.CVERSION+"(内含Lodop"+LODOP.VERSION+")");
                else
                    alert("本机已成功安装了Lodop控件！
 版本号:"+LODOP.VERSION);
            }
        }catch(err){
        }
    }
    function PrintInFullPage(page){
        console.log("all-content-"+page);
        LODOP=getLodop();
        //LODOP.SET_PRINT_MODE("WINDOW_DEFPRINTER","PRINT");
        LODOP.SET_PRINT_MODE("POS_BASEON_PAPER",true);
        LODOP.PRINT_INIT(page);
        LODOP.SET_PRINTER_INDEX($("#PrinterList").val());
        var htmlStr = document.getElementById("table-detail").innerHTML
        LODOP.ADD_PRINT_HTM("2%","2%","96%","96%",htmlStr);
        LODOP.SET_PRINT_PAGESIZE(1,0,0,"A4");
        LODOP.PRINT();
    }

    function CreatePrinterList(){
        if (document.getElementById('PrinterList').innerHTML!="") return;
        LODOP=getLodop();
        var iPrinterCount=LODOP.GET_PRINTER_COUNT();
        for(var i=0;i<iPrinterCount;i++){
            var option=document.createElement('option');
            option.innerHTML=LODOP.GET_PRINTER_NAME(i);
            option.value=i;
            document.getElementById('PrinterList').appendChild(option);
        }
    }

    <?php $this->endBlock() ?>
    <?php $this->registerJs($this->blocks['js'], yiiwebView::POS_END); ?>
</script>