|  |  |  | 
|---|
|  |  |  | <input type="radio" name="selectTemplate" value="1" title="模板一" lay-filter="selectTemplateRadio" checked=""> | 
|---|
|  |  |  | <input type="radio" name="selectTemplate" value="2" title="模板二" lay-filter="selectTemplateRadio"> | 
|---|
|  |  |  | <input type="radio" name="selectTemplate" value="3" title="模板三" lay-filter="selectTemplateRadio"> | 
|---|
|  |  |  | <input type="radio" name="selectTemplate" value="4" title="模板四" lay-filter="selectTemplateRadio"> | 
|---|
|  |  |  | </div> | 
|---|
|  |  |  | <fieldset class="layui-elem-field site-demo-button" style="margin-top: 30px;text-align: left;"> | 
|---|
|  |  |  | <legend>打印预览</legend> | 
|---|
|  |  |  | 
|---|
|  |  |  |  | 
|---|
|  |  |  | <!-- 预览图 1 --> | 
|---|
|  |  |  | <div id="template-preview-1" class="template-preview" style="display: inline-block"> | 
|---|
|  |  |  | <table class="contain" width="280" | 
|---|
|  |  |  | <table class="contain" width="300" | 
|---|
|  |  |  | style="overflow: hidden;font-size: xx-small;table-layout: fixed;"> | 
|---|
|  |  |  | <tr style="height: 74px"> | 
|---|
|  |  |  | <td colspan="3" align="center" scope="col">商品编码</td> | 
|---|
|  |  |  | <td class="barcode" colspan="9" align="center" scope="col"> | 
|---|
|  |  |  | <img class="template-code template-barcode" src="" width="90%;"> | 
|---|
|  |  |  | <div style="letter-spacing: 2px;margin-top: 1px; text-align: center;"> | 
|---|
|  |  |  | <tr style="height: 50px"> | 
|---|
|  |  |  | <td align="center" scope="col" colspan="1">名称</td> | 
|---|
|  |  |  | <td align="center" scope="col" colspan="1" style="">xxxxxx-xx/xx</td> | 
|---|
|  |  |  | <td align="center" scope="col" colspan="2" rowspan="2"> | 
|---|
|  |  |  | <img class="template-code template-qrcode" src="" width="80%"> | 
|---|
|  |  |  | <div style="letter-spacing: 1px;margin-top: 1px; text-align: center"> | 
|---|
|  |  |  | <span>xxxxxx</span> | 
|---|
|  |  |  | </div> | 
|---|
|  |  |  | </td> | 
|---|
|  |  |  | </tr> | 
|---|
|  |  |  | <tr style="height: 74px"> | 
|---|
|  |  |  | <td align="center" colspan="3">商品</td> | 
|---|
|  |  |  | <td align="center" colspan="5">xxxxxx-xx/xx</td> | 
|---|
|  |  |  | <td align="center" colspan="2">备注</td> | 
|---|
|  |  |  | <td align="center" colspan="2">xx</td> | 
|---|
|  |  |  | <tr style="height: 50px"> | 
|---|
|  |  |  | <td align="center" colspan="1">规格</td> | 
|---|
|  |  |  | <td align="center" colspan="1" | 
|---|
|  |  |  | style="overflow:hidden; white-space:nowrap; text-overflow:ellipsis;">xxxxxxx | 
|---|
|  |  |  | </td> | 
|---|
|  |  |  | </tr> | 
|---|
|  |  |  | <tr style="height: 50px"> | 
|---|
|  |  |  | <td align="center" colspan="1">图号</td> | 
|---|
|  |  |  | <td align="center" colspan="1" | 
|---|
|  |  |  | style="overflow:hidden; white-space:nowrap; text-overflow:ellipsis;">xxxxxxx | 
|---|
|  |  |  | </td> | 
|---|
|  |  |  | <td align="center" colspan="1">重量</td> | 
|---|
|  |  |  | <td align="center" colspan="1" | 
|---|
|  |  |  | style="overflow:hidden; white-space:nowrap; text-overflow:ellipsis;">xxxxxxx | 
|---|
|  |  |  | </td> | 
|---|
|  |  |  | </tr> | 
|---|
|  |  |  | <tr style="height: 50px"> | 
|---|
|  |  |  | <td align="center" colspan="1">机型</td> | 
|---|
|  |  |  | <td align="center" colspan="1" | 
|---|
|  |  |  | style="overflow:hidden; white-space:nowrap; text-overflow:ellipsis;">xxxxxxx | 
|---|
|  |  |  | </td> | 
|---|
|  |  |  | <td align="center" colspan="1">材质</td> | 
|---|
|  |  |  | <td align="center" colspan="1" | 
|---|
|  |  |  | style="overflow:hidden; white-space:nowrap; text-overflow:ellipsis;">xxxxxxx | 
|---|
|  |  |  | </td> | 
|---|
|  |  |  | </tr> | 
|---|
|  |  |  | <tr style="height: 50px"> | 
|---|
|  |  |  | <td align="center" colspan="1">制令</td> | 
|---|
|  |  |  | <td align="center" colspan="1" | 
|---|
|  |  |  | style="overflow:hidden; white-space:nowrap; text-overflow:ellipsis;">xxxxxxx | 
|---|
|  |  |  | </td> | 
|---|
|  |  |  | <td align="center" colspan="1">长宽高</td> | 
|---|
|  |  |  | <td align="center" colspan="1" | 
|---|
|  |  |  | style="overflow:hidden; white-space:nowrap; text-overflow:ellipsis;">xxxxxxx | 
|---|
|  |  |  | </td> | 
|---|
|  |  |  | </tr> | 
|---|
|  |  |  | </table> | 
|---|
|  |  |  | </div> | 
|---|
|  |  |  | 
|---|
|  |  |  | </tr> | 
|---|
|  |  |  | </table> | 
|---|
|  |  |  | </div> | 
|---|
|  |  |  |  | 
|---|
|  |  |  | <!-- 预览图 4 --> | 
|---|
|  |  |  | <div id="template-preview-4" class="template-preview" style="display: none"> | 
|---|
|  |  |  | <table class="contain" width="280" | 
|---|
|  |  |  | style="overflow: hidden;font-size: xx-small;table-layout: fixed;"> | 
|---|
|  |  |  | <tr style="height: 74px"> | 
|---|
|  |  |  | <td colspan="3" align="center" scope="col">商品编码</td> | 
|---|
|  |  |  | <td class="barcode" colspan="9" align="center" scope="col"> | 
|---|
|  |  |  | <img class="template-code template-barcode" src="" width="90%;"> | 
|---|
|  |  |  | <div style="letter-spacing: 2px;margin-top: 1px; text-align: center;"> | 
|---|
|  |  |  | <span>xxxxxx</span> | 
|---|
|  |  |  | </div> | 
|---|
|  |  |  | </td> | 
|---|
|  |  |  | </tr> | 
|---|
|  |  |  | <tr style="height: 74px"> | 
|---|
|  |  |  | <td align="center" colspan="3">商品</td> | 
|---|
|  |  |  | <td align="center" colspan="5">xxxxxx-xx/xx</td> | 
|---|
|  |  |  | <td align="center" colspan="2">备注</td> | 
|---|
|  |  |  | <td align="center" colspan="2">xx</td> | 
|---|
|  |  |  | </tr> | 
|---|
|  |  |  | </table> | 
|---|
|  |  |  | </div> | 
|---|
|  |  |  | </div> | 
|---|
|  |  |  | </fieldset> | 
|---|
|  |  |  |  | 
|---|
|  |  |  | 
|---|
|  |  |  |  | 
|---|
|  |  |  | <!-- 模板引擎 --> | 
|---|
|  |  |  | <!-- 模板1 --> | 
|---|
|  |  |  | <script type="text/template" id="templatePreview1" class="template-barcode"> | 
|---|
|  |  |  | <script type="text/template" id="templatePreview1" class="template-qrcode"> | 
|---|
|  |  |  | {{#each data}} | 
|---|
|  |  |  | <table class="contain" width="280" style="overflow: hidden;font-size: small;table-layout: fixed;"> | 
|---|
|  |  |  | <tr style="height: 74px"> | 
|---|
|  |  |  | <td align="center" colspan="3" scope="col">商品编码</td> | 
|---|
|  |  |  | <td align="center" class="barcode" colspan="9" scope="col"> | 
|---|
|  |  |  | <img class="template-code" src="{{this.barcodeUrl}}" width="90%"> | 
|---|
|  |  |  | <div style="letter-spacing: 2px;margin-top: 1px; text-align: center"> | 
|---|
|  |  |  | <table class="contain" width="300" | 
|---|
|  |  |  | style="overflow: hidden;font-size: xx-small;table-layout: fixed;margin-top: 20px;"> | 
|---|
|  |  |  | <tr style="height: 50px"> | 
|---|
|  |  |  | <td align="center" scope="col" colspan="1">名称</td> | 
|---|
|  |  |  | <td align="center" scope="col" colspan="1" style="">{{this.maktx}}</td> | 
|---|
|  |  |  | <td align="center" scope="col" colspan="2" rowspan="2"> | 
|---|
|  |  |  | <img class="template-code template-qrcode" src="{{this.barcodeUrl}}" width="80%"> | 
|---|
|  |  |  | <div style="letter-spacing: 1px;margin-top: 1px; text-align: center"> | 
|---|
|  |  |  | <span>{{this.matnr}}</span> | 
|---|
|  |  |  | </div> | 
|---|
|  |  |  | </td> | 
|---|
|  |  |  | </tr> | 
|---|
|  |  |  | <tr style="height: 74px"> | 
|---|
|  |  |  | <td align="center" colspan="3">商品</td> | 
|---|
|  |  |  | <td align="center" colspan="5" style="overflow: hidden; white-space: nowrap;text-overflow: ellipsis;"> | 
|---|
|  |  |  | {{this.maktx}} | 
|---|
|  |  |  | <tr style="height: 50px"> | 
|---|
|  |  |  | <td align="center" colspan="1">规格</td> | 
|---|
|  |  |  | <td align="center" colspan="1" | 
|---|
|  |  |  | style="overflow:hidden; white-space:nowrap; text-overflow:ellipsis;">{{this.specs}} | 
|---|
|  |  |  | </td> | 
|---|
|  |  |  | <td align="center" colspan="2">备注</td> | 
|---|
|  |  |  | <td align="center" colspan="2">{{this.memo}}</td> | 
|---|
|  |  |  | </tr> | 
|---|
|  |  |  | <tr style="height: 50px"> | 
|---|
|  |  |  | <td align="center" colspan="1">图号</td> | 
|---|
|  |  |  | <td align="center" colspan="1" | 
|---|
|  |  |  | style="overflow:hidden; white-space:nowrap; text-overflow:ellipsis;">{{this.imgNum}} | 
|---|
|  |  |  | </td> | 
|---|
|  |  |  | <td align="center" colspan="1">重量</td> | 
|---|
|  |  |  | <td align="center" colspan="1" | 
|---|
|  |  |  | style="overflow:hidden; white-space:nowrap; text-overflow:ellipsis;">{{this.weight}} | 
|---|
|  |  |  | </td> | 
|---|
|  |  |  | </tr> | 
|---|
|  |  |  | <tr style="height: 50px"> | 
|---|
|  |  |  | <td align="center" colspan="1">机型</td> | 
|---|
|  |  |  | <td align="center" colspan="1" | 
|---|
|  |  |  | style="overflow:hidden; white-space:nowrap; text-overflow:ellipsis;">{{this.model}} | 
|---|
|  |  |  | </td> | 
|---|
|  |  |  | <td align="center" colspan="1">材质</td> | 
|---|
|  |  |  | <td align="center" colspan="1" | 
|---|
|  |  |  | style="overflow:hidden; white-space:nowrap; text-overflow:ellipsis;">{{this.material}} | 
|---|
|  |  |  | </td> | 
|---|
|  |  |  | </tr> | 
|---|
|  |  |  | <tr style="height: 50px"> | 
|---|
|  |  |  | <td align="center" colspan="1">制令</td> | 
|---|
|  |  |  | <td align="center" colspan="1" | 
|---|
|  |  |  | style="overflow:hidden; white-space:nowrap; text-overflow:ellipsis;">{{this.decrees}} | 
|---|
|  |  |  | </td> | 
|---|
|  |  |  | <td align="center" colspan="1">长宽高</td> | 
|---|
|  |  |  | <td align="center" colspan="1" | 
|---|
|  |  |  | style="overflow:hidden; white-space:nowrap; text-overflow:ellipsis;">{{this.length}}x{{this.width}}x{{this.height}} | 
|---|
|  |  |  | </td> | 
|---|
|  |  |  | </tr> | 
|---|
|  |  |  | </table> | 
|---|
|  |  |  | {{/each}} | 
|---|
|  |  |  | 
|---|
|  |  |  | </table> | 
|---|
|  |  |  | {{/each}} | 
|---|
|  |  |  | </script> | 
|---|
|  |  |  | <!-- 模板4 --> | 
|---|
|  |  |  | <script type="text/template" id="templatePreview4" class="template-barcode"> | 
|---|
|  |  |  | {{#each data}} | 
|---|
|  |  |  | <table class="contain" width="280" style="overflow: hidden;font-size: small;table-layout: fixed;"> | 
|---|
|  |  |  | <tr style="height: 74px"> | 
|---|
|  |  |  | <td align="center" colspan="3" scope="col">商品编码</td> | 
|---|
|  |  |  | <td align="center" class="barcode" colspan="9" scope="col"> | 
|---|
|  |  |  | <img class="template-code" src="{{this.barcodeUrl}}" width="90%"> | 
|---|
|  |  |  | <div style="letter-spacing: 2px;margin-top: 1px; text-align: center"> | 
|---|
|  |  |  | <span>{{this.matnr}}</span> | 
|---|
|  |  |  | </div> | 
|---|
|  |  |  | </td> | 
|---|
|  |  |  | </tr> | 
|---|
|  |  |  | <tr style="height: 74px"> | 
|---|
|  |  |  | <td align="center" colspan="3">商品</td> | 
|---|
|  |  |  | <td align="center" colspan="5" style="overflow: hidden; white-space: nowrap;text-overflow: ellipsis;"> | 
|---|
|  |  |  | {{this.maktx}} | 
|---|
|  |  |  | </td> | 
|---|
|  |  |  | <td align="center" colspan="2">备注</td> | 
|---|
|  |  |  | <td align="center" colspan="2">{{this.memo}}</td> | 
|---|
|  |  |  | </tr> | 
|---|
|  |  |  | </table> | 
|---|
|  |  |  | {{/each}} | 
|---|
|  |  |  | </script> | 
|---|
|  |  |  |  | 
|---|
|  |  |  | </body> | 
|---|
|  |  |  | </html> | 
|---|