{首页主词},&

Vue Print Receipt With Detail vue 打印帶明細的票據- CCPrintingAPI Vue js 打印API接口,,vue print,vue靜默打印,vue打印,vue實現打印,web 打印, js打印, js 打印, Javascript 打印, js 靜默打印,js 不預覽打印,瀏覽器打印,js標簽打印,js單據打印,ChicoreDriver,vue 明細票據打印,vue打印小票,vue打印單據 ,CCPrintingAPI for Vue 靜默打印帶有明細的商業小票，API接口的使用方法, Vue js 打印接口快速上手，打印范例代碼，vue 單據打印,vue 票據打印，很容易集成。

適配

150+

品牌，

8000+

型號打印機

支持熱敏/熱轉印標簽、票據打印機，激光、噴墨、針式打印機

CCPrintingAPI

更好用、更通用的打印機 API 開發接口

文本圖片條碼二維碼序列號生產日期有效期 GS1 UDI 等變量打印

支持開發語言：Java , C# , C, C++, Javascript, Vue js , Python, VB.net, VB6, VB script

UniApp, 小程序, HTTP POST 接口

購開發接口專用版（特定打印機使用）

購開發接口通用版（不限打印機型號）

詳情咨詢微信客服

通用版(不含打印機)

不限打印機型號

適配標簽機激光噴墨針式

專用版(含打印機)

ZPX5020t

熱轉印 200dpi

專用版(含打印機)

ZPX5030t

熱轉印 300dpi

CCPrintingAPI

概述

功能特性

商業授權

配備CCPrintingAPI的標簽打印機

更優惠

多臺并行打印

視頻

多臺并行打印(ChicoreDriver)

CCPrintingAPI 使用手冊

模板設計

Vue Javascript

Javascript

Java

Python

VB 6.0/VBScript

C/C++

打印機

ChicoreDriver

鏈接

視頻號教程

微信客服

Vue API 打印帶有明細的票據

Vue

Vue 打印機開發接口,Vue Print Receipt With Detail vue 打印帶明細的票據，通過Vue調用CCPrintingAPI打印機接口API,打印票據，打印小票，打印單據，打印報表。

獲取打印機列表打印1單打印2單打印3單預覽

1. 使用設計器設計模板

使用智高標簽打印軟件（可以在我們官網下載），按照要打印的樣式，設計打印模板，并保存文件，將模板文件保存在本地或服務器，打印時，通過指定的屬性配置模板文件。

CCPrintingAPI，也支持無模板打印，可以直接使用代碼進行模板的構建。

使用智高標簽打印軟件 CCPrintingAPI 打印帶有明細的票據打印明細小票

2. Vue項目中,引入 CCPrintingAPI.min.vue.js

引入CCPrintingAPI.min.vue.js后，即可使用API的相關方法，進行設置和打印操作。

import { CCPrintingAPI } from '../../js/CCPrintingAPI.min.vue.js'

3. 如何獲取打印機列表

獲取計算機上安裝的所有打印機, 在調用API接口的打印方法時，指定該列表的打印機名稱進行打印。如果能確保打印機名稱不變，該操作也可省去。如果使用我們的打印機，可以直接使用訂購時的免驅打印機名稱，不用安裝驅動，也無需使用此代碼獲取打印機列表。


    GetPrinters: function () {
    var cfgData = new Object;
    cfgData.XAction = "Printers";
    cfgData.XOpenId = m_OpenId;
    cfgData.XTokens = m_Tokens;
    CCPrintingAPI.Excute(cfgData,
    XTimeout => { },
    XFail => {
    this.mytipsmessage = 'API可能未安裝或未啟動, ' + XFail;
    },
    XSuccess => {
    var d = new Date;
    this.timetick = d.getTime();
    var apiResult = JSON.parse(XSuccess.trim());
    if (apiResult.Status == "1") {
        if (apiResult.Message.length > 1) {
            this.options = [];
            for (var i = 1; i < apiResult.Message.length; i++) {
                var op = new Object;
                op.text = apiResult.Message[i];
                op.value = apiResult.Message[i];
                this.options.push(op);
            }
            /*設置上次使用的打印機*/
            this.selected = this.options[0].value;
        }
    } else {
        if (apiResult.Message.length > 1)
            this.mytipsmessage = apiResult.Message[0] + " :  " + apiResult.Message[1];
        else
            this.mytipsmessage = apiResult.Message[0];
        }
    }
    );
    }

4. 打印

進行相關參數設置后（指定打印機，設置模板，設置打印數據），將指令通過API傳給打印機。


    Print: function (arr) {
    var cfgData = new Object;
    cfgData.XAction = "Print"
    cfgData.XOpenId = m_OpenId;
    cfgData.XTokens = m_Tokens;
    /*指定打印機*/
    cfgData.PrinterName = this.selected;
    /*模板方式，0-客戶端模板，1-遠程模板，
    2-如果本地模板存在，使用本地，不存在使用遠程模板，3-不使用模板*/
    cfgData.TemplateMode = "1";
    /*遠程模板URL或本地模板的文件夾*/
    cfgData.TemplateURL = "http://img.51321.cn/web/chicore/VPrinting/API";
    //cfgData.TemplateURL =  "E:\\臨時數據\\打印\\打印樣本\\API標簽模板";
    /*模板文件名*/
    cfgData.TemplateName = "Label1-Receipt.Lblx";
    /*打印數據的類型，0-數組，1-Json數組，元素為JSON對象，字段：值*/
    cfgData.PrintDataType = 1;
    /*傳遞打印數據 Json數組*/ /*內容不允許 半角的逗號及半角的分隔符*/
    cfgData.PrintData = JSON.stringify(arr);
    /*打印 發送給打印機進行打印*/
    CCPrintingAPI.Excute(cfgData,
    XTimeout => { },
    XFail => {
        this.mytipsmessage = 'API可能未安裝或未啟動, ' + XFail;
    },
    XSuccess => {
    var d = new Date;
    this.timetick = d.getTime();
    var apiResult = JSON.parse(XSuccess.trim());
    if (apiResult.Status == "1") {
        var smsg = apiResult.Message[0];
        if (apiResult.Message.length > 1)
            smsg += " : " + apiResult.Message[1]
            this.mytipsmessage = smsg;
        } else {
        if (apiResult.Message.length > 1)
            this.mytipsmessage = apiResult.Message[0] + " :  " + apiResult.Message[1];
        else
            this.mytipsmessage = apiResult.Message[0];
        }
    }
    );
    }

4. 1 打印1單

API傳1單數據，打印1個訂單票據。


                    Print1:function(){
                        var arr = [
{"orderid":"2023030919103001","pname":"電源適配器24V 2.5A","orderdate":"2023/03/09 19:10:31","sn":"81322","qty":"6"},
{"orderid":"2023030919103001","pname":"LED光源","orderdate":"2023/03/09 19:10:30","sn":"49267","qty":"3"},
{"orderid":"2023030919103001","pname":"CCXt標簽打印機","orderdate":"2023/03/09 18:07:11","sn":"35178","qty":"1"}
];
                        Print(arr);
                    }

4. 2 打印2單

API傳2單數據，打印2個訂單票據。


                    Print2:function(){
                        var arr = [
{"orderid":"2023030919103001","pname":"電源適配器24V 2.5A","orderdate":"2023/03/09 19:10:31","sn":"81322","qty":"6"},
{"orderid":"2023030919103001","pname":"LED光源","orderdate":"2023/03/09 19:10:30","sn":"49267","qty":"3"},
{"orderid":"2023030919103001","pname":"CCXt標簽打印機","orderdate":"2023/03/09 18:07:11","sn":"35178","qty":"1"},
{"orderid":"2023030919103002","pname":"HW手機Mate90","orderdate":"2023/03/09 18:07:07","sn":"69092","qty":"5"},
{"orderid":"2023030919103002","pname":"CCPrintingAPI許可證","orderdate":"2023/03/09 18:07:06","sn":"47505","qty":"10"},
{"orderid":"2023030919103002","pname":"UGEE顯示器","orderdate":"2023/03/09 17:18:15","sn":"26612","qty":"7"},
{"orderid":"2023030919103002","pname":"MBOX MUSIC Play","orderdate":"2023/03/09 17:18:10","sn":"75149","qty":"2"},
{"orderid":"2023030919103002","pname":"鴻蒙Harmony","orderdate":"2023/03/09 17:18:05","sn":"51926","qty":"4"}
];
                        Print(arr);                        
                    }

4. 3 打印3單

API傳3單數據，打印3個訂單票據。


                    Print3:function(){                        
                        var arr = [
{"orderid":"2023030919103001","pname":"電源適配器24V 2.5A","orderdate":"2023/03/09 19:10:31","sn":"81322","qty":"6"},
{"orderid":"2023030919103001","pname":"LED光源","orderdate":"2023/03/09 19:10:30","sn":"49267","qty":"3"},
{"orderid":"2023030919103001","pname":"CCXt標簽打印機","orderdate":"2023/03/09 18:07:11","sn":"35178","qty":"1"},
{"orderid":"2023030919103002","pname":"HW手機Mate90","orderdate":"2023/03/09 18:07:07","sn":"69092","qty":"5"},
{"orderid":"2023030919103002","pname":"CCPrintingAPI許可證","orderdate":"2023/03/09 18:07:06","sn":"47505","qty":"10"},
{"orderid":"2023030919103002","pname":"UGEE顯示器","orderdate":"2023/03/09 17:18:15","sn":"26612","qty":"7"},
{"orderid":"2023030919103002","pname":"MBOX MUSIC Play","orderdate":"2023/03/09 17:18:10","sn":"75149","qty":"2"},
{"orderid":"2023030919103002","pname":"鴻蒙Harmony","orderdate":"2023/03/09 17:18:05","sn":"51926","qty":"4"},
{"orderid":"2023030919103003","pname":"PCB ROHS 線路板","orderdate":"2023/03/09 17:18:03","sn":"97951","qty":"6"},
{"orderid":"2023030919103003","pname":"GPTX 工業打印機","orderdate":"2023/03/09 17:18:01","sn":"54115","qty":"8"}
];
                        Print(arr);
                    }

5. 預覽

進行相關參數設置后，獲取單據的預覽。


                    Printpreview: function (arr) {
                        this.myhid = '';
                        this.mytipsmessage = '';
                        this.timetick = '';
                        var cfgData = new Object;
                        cfgData.XAction = "Print"
                        cfgData.XOpenId = m_OpenId;
                        cfgData.XTokens = m_Tokens;
                        cfgData.Preview = "3";	
                        /*指定打印機*/
                        cfgData.PrinterName = this.selected;
                        /*模板方式，0-客戶端模板，1-遠程模板，
                                    2-如果本地模板存在，使用本地，不存在使用遠程模板，3-不使用模板*/
                        cfgData.TemplateMode = "1";
                        /*遠程模板URL或本地模板的文件夾*/
                        cfgData.TemplateURL = "http://img.51321.cn/web/chicore/VPrinting/API";
                        //cfgPrintSettings.TemplateURL =  "E:\\臨時數據\\打印\\打印樣本\\API標簽模板";
                        /*模板文件名183601-100X100*/
                        cfgData.TemplateName = "Label1-Receipt.Lblx";
                        /*打印數據的類型，0-數組，1-Json數組，元素為JSON對象，字段：值*/
                        cfgData.PrintDataType = 1;
                        /*傳遞打印數據 Json數組*/ /*內容不允許 半角的逗號及半角的分隔符*/
                        cfgData.PrintData = JSON.stringify(arr);
                        /*打印 發送給打印機進行打印*/
                        CCPrintingAPI.Excute(cfgData,
                            XTimeout => { },
                            XFail => {
                                this.mytipsmessage = 'API可能未安裝或未啟動, ' + XFail;
                            },
                            XSuccess => {
                                var d = new Date;
                                this.timetick = d.getTime();
                                var apiResult = JSON.parse(XSuccess.trim());
                                if (apiResult.Status == "1") {
                                    var smsg = apiResult.Message[0];
                                    if (apiResult.Message.length > 1)
                                        smsg += " : " + apiResult.Message[1]
                                    this.mytipsmessage = "";
                                } else {
                                    if (apiResult.Message.length > 1)
                                        this.mytipsmessage = apiResult.Message[0] + " :  " + apiResult.Message[1];
                                    else
                                        this.mytipsmessage = apiResult.Message[0];
                                }
                            }
                        );
                    }

5. 1 獲取預覽

API傳1單數據，獲取1單預覽。


                    Printpreview1:function(){
                        var arr = [
{"orderid":"2023030919103001","pname":"電源適配器24V 2.5A","orderdate":"2023/03/09 19:10:31","sn":"81322","qty":"6"},
{"orderid":"2023030919103001","pname":"LED光源","orderdate":"2023/03/09 19:10:30","sn":"49267","qty":"3"},
{"orderid":"2023030919103001","pname":"CCXt標簽打印機","orderdate":"2023/03/09 18:07:11","sn":"35178","qty":"1"}
];
                        Printpreview(arr);
                    }