# 预览面单

发送指令给打印组件,预览对应的面单

# 注意事项

调用前,先从 获取打印报文电子面单取号 接口获取返回的 print_info 信息

# 请求示例

const ws = new WebSocket('ws://127.0.0.1:12705');
ws.onopen = () => {
    console.log('与打印组件建立连接成功: ');
    ws.send(JSON.stringify({
        command: 'preview',
        requestID: '1234', //调用方保证唯一
        taskList: [{
            taskID: '1234', //String, 调用方保证唯一
            printInfo: '', // String, [获取打印报文]接口返回的print_info
            printNum: {
                curNum: 1, // 打印计数-当前张数
                sumNum: 2, // 打印计数-总张数
            },
            // 自定义模板信息,没有自定义模板需求可不传
            // 参考模板url:https://res.wx.qq.com/shop/public/2023-09-12/c39e49ba-9c0e-4912-91c1-5386fdd08f80.xml
            customInfo: {
                templateUrl: 'https://res.wx.qq.com/shop/public/210bea5b-4652-46b8-b7d8-2fbf90023133.xml', // 自定义模板url
                // 模板里面定义的数据字段
                data: {
                    shopName: "测试小店",
                    productInfo: [
                        {name: "商品1", count: 1, code: "asd"},
                        {name: "商品2", count: 2, code: "zxc123"}
                    ],
                    imgSrc: "https://www.tencent.com/img/index/tencent_logo.png"
                }
            },
            // 面单补充信息,用来覆盖寄件人信息,没有这种需求可以不传
            extendData: {
                sender: {
                    address: {
                        provinceName: "广东省",
                        cityName: "广州市",
                        countyName: "海珠区",
                        detailInfo: "TiT创意园"
                    },
                    userName: "张三",
                    telNumber: "1311111111"
                }
            }
        }]
    }))
};

ws.onmessage = (e) => {
    const resp = JSON.parse(e.data || '{}')
    if (resp.command === 'preview') {
        console.log('预览结果: ', resp);
    }
};

# 自定义模板示例

<div>
    <div style="font-weight: 700;"> 店铺名称 {{ shopName }}! </div>
    {{#productInfo}}
    <div>{{name}},{{count}},{{code}}</div>
    {{/productInfo}}
    <img src="{{imgSrc}}" width="300" height="50"/>
</div>

# 返回参数示例

{
  "requestID": "1234",
  "command": "preview",
  "previewUrl": "xxx"
}