document.write(
    "<script  src='/static/js/JcPrinter/jquery.js'></script>"
);

document.write(
    "<script src='/static/js/JcPrinter/layer/layer.js' ></script>"
);


document.write(
    "<script   src='/static/js/JcPrinter/jcPrinterSdk_api_third.js'></script>"
);

document.write(
    "<script   src='/static/js/JcPrinter/drawParameter/InitDrawingBoard.js'></script>"
);

document.write(
    "<script   src='/static/js/JcPrinter/drawParameter/initSdk.js'></script>"
);

document.write(
    "<script   src='/static/js/JcPrinter/drawParameter/DrawLableText.js'></script>"
);

document.write(
    "<script   src='/static/js/JcPrinter/drawParameter/DrawLableQrCode.js'></script>"
);

document.write(
    "<script   src='/static/js/JcPrinter/drawParameter/DrawLableLine.js'></script>"
);

document.write(
    "<script   src='/static/js/JcPrinter/drawParameter/DrawLableImage.js'></script>"
);

document.write(
    "<script   src='/static/js/JcPrinter/drawParameter/DrawLableGraph.js'></script>"
);

document.write(
    "<script   src='/static/js/JcPrinter/drawParameter/DrawLableBarCode.js'></script>"
);

document.write(
    "<script   src='/static/js/JcPrinter/drawParameter/generateImagePreviewImage.js'></script>"
);

document.write(
    "<script   src='/static/js/JcPrinter/drawParameter/picturePrint.js'></script>"
);


var bCanclePrint = false;
var base64Data = "";
var readerPrintData = new FileReader();
var readerPrinterInfo = new FileReader();
var strPrintData;
var strPrinterInfo;
var allPrinters;
var pageIndex = 1;


var app = new Vue({
    el: '#app',
    data: {
        form: {
            paperType: '1',
            density: '3',
            pageCount: '1',
            quantityCount: '2',
            printMode: '1'
        },
        formLabelWidth: "120px",
        options: [],
        tags: [],
        isInit: false,
        isInitApi: false,
        isDraw: false,
        isEditTag: false,
        editIndex: 0,
        dialogInitDrawingBoardParam: false,
        dialogDrawLableTextParam: false,
        dialogDrawLableBarCodeParam: false,
        dialogDrawLableQrCodeParam: false,
        dialogDrawLableLineParam: false,
        dialogDrawLableGraphParam: false,
        dialogDrawLableImageParam: false,
        value: '',
        imgSrc: '',
        initSdkParam: {//初始化数据
            "fontDir": "",
        },
        InitDrawingBoardParam: {
            "width": 50,
            "height": 30,
            "rotate": 0,
            "path": "ZT001.ttf",
            "verticalShift": 0,
            "HorizontalShift": 0
        },
        DrawLableTextParam: {
            "x": 1.0,
            "y": 1.0,
            "height": 10,
            "width": 50,
            "value": "",
            "fontFamily": "宋体",
            "rotate": 0,
            "fontSize": 4.0,
            "textAlignHorizonral": 0,
            "textAlignVertical": 0,
            "letterSpacing": 1.0,
            "lineSpacing": 1.0,
            "lineMode": 0,
            "fontStyle": [false, false, false, false],
        },
        DrawLableBarCodeParam: {
            "x": 20.0,
            "y": 10.0,
            "height": 10,
            "width": 50,
            "value": document.getElementById("materialQrCode").value,
            "codeType": 20,
            "rotate": 0,
            "fontSize": 4.0,
            "textHeight": 0,
            "textPosition": 0,
        },
        DrawLableQrCodeParam: {
            "x": 20.0,
            "y": 10.0,
            "height": 10,
            "width": 10,
            "value": document.getElementById("materialQrCode").value,
            "rotate": 0,
            "codeType": 31,
        },
        DrawLableLineParam: {
            "x": 2.0,
            "y": 2.0,
            "height": 2,
            "width": 50,
            "rotate": 0,
            "lineType": 2,
            "dashwidth": [1, 1],
        },
        DrawLableGraphParam: {
            "x": 2.0,
            "y": 5.0,
            "height": 30,
            "width": 40,
            "rotate": 0,
            "graphType": 3,
            "cornerRadius": 0,
            "lineWidth": 4,
            "lineType": 2,
            "dashwidth": [1, 1],
        },
        DrawLableImageParam: {
            "x": 2.0,
            "y": 2.0,
            "height": 10,
            "width": 50,
            "rotate": 0,
            "imageProcessingType": 0,
            "imageProcessingValue": 127,
            "imageData": "",
            "imgSrc": ''
        },
        DrawLableGraphParamDemo: {
            "x": 2.0,
            "y": 2.0,
            "width": 46,
            "height": 26,
            "rotate": 0,
            "graphType": 3,
            "cornerRadius": 0,
            "lineWidth": 0.5,
            "lineType": 1,
            "dashwidth": [1, 1],
        },

    },
    mounted() {
        // 初始化打印服务
        getInstance();
    },
    methods: {
        // 初始化
        initSdkApi() {
            initSdk(this.initSdkParam);
            this.isInitApi = true
        },
        // 选择打印机
        selectPrinterApi() {
            let printerName = '';
            for (let index = 0; index < this.options.length; index++) {
                if (this.value === this.options[index].value) printerName = this.options[index].label
            }
            selectPrinter(printerName, parseInt(this.value), (data => {
                var arrParse = JSON.parse(JSON.stringify(data));
                if (!arrParse.resultAck.result) {
                    return;
                } else if (isJSON(arrParse.resultAck.info)) {
                    //选择成功，打印机连接成功
                    console.log(data)
                }

            }));
        },
        // 重新获取打印机
        refreshPrinters() {
            getAllPrinters(data => {
                let arrParse = JSON.parse(JSON.stringify(data));
                if (isJSON(arrParse.resultAck.info)) {
                    allPrinters = JSON.parse(arrParse.resultAck.info);
                    let allPrintersName = Object.keys(allPrinters);
                    let allPrintersValue = Object.values(allPrinters);
                    this.options = [];
                    for (i = 0; i < allPrintersName.length; i++) {
                        let newopt = {};
                        newopt.label = allPrintersName[i];
                        newopt.value = allPrintersValue[i];
                        this.options.push(newopt)
                    }
                }
            });
        },
        // 初始化画板
        InitDrawingBoardApi() {
            this.dialogInitDrawingBoardParam = true;
            this.isDraw = false;
            this.imgSrc = "";
        },
        handleClose(index) {
            this.tags.splice(index, 1);
        },
        clickTag(tag, index) {
            this.isEditTag = true;
            this.editIndex = index;
            switch (tag.name) {
                case "文本":
                    this.DrawLableTextParam = {...tag};
                    this.dialogDrawLableTextParam = true;
                    break;
                case "一维码":
                    this.DrawLableBarCodeParam = {...tag};
                    this.dialogDrawLableBarCodeParam = true;
                    break;
                case "二维码":
                    this.DrawLableQrCodeParam = {...tag};
                    this.dialogDrawLableQrCodeParam = true;
                    break;
                case "线条":
                    this.DrawLableLineParam = {...tag};
                    this.dialogDrawLableLineParam = true;
                    break;
                case "形状":
                    this.DrawLableGraphParam = {...tag};
                    this.dialogDrawLableGraphParam = true;
                    break;
                case "图片":
                    this.DrawLableImageParam = {...tag};
                    this.dialogDrawLableImageParam = true;
                    break;
            }
        },
        // 初始化画布
        InitDrawingBoardPar(callbackFunction) {
            if (!this.InitDrawingBoardParam.width || !this.InitDrawingBoardParam.height) {
                this.$message({
                    message: '请选填写画板宽高',
                    type: 'warning'
                });
                return
            }
            this.InitDrawingBoardParam.width = Number(this.InitDrawingBoardParam.width);
            this.InitDrawingBoardParam.height = Number(this.InitDrawingBoardParam.height);
            // 创建画板
            /**
             * 1.绘制元素前，必须先初始化画板，否则会引起崩溃！
             2.初始化画板时会清空画板上次绘制的内容！
             */
            InitDrawingBoard(this.InitDrawingBoardParam, callbackFunction);
            this.dialogInitDrawingBoardParam = false;
            this.isInit = true
        },
        // 一维码
        DrawLableBarCodeApi() {
            this.DrawLableBarCodeParam.width = Number(this.DrawLableBarCodeParam.width);
            this.DrawLableBarCodeParam.height = Number(this.DrawLableBarCodeParam.height);
            this.DrawLableBarCodeParam.x = Number(this.DrawLableBarCodeParam.x);
            this.DrawLableBarCodeParam.y = Number(this.DrawLableBarCodeParam.y);
            this.DrawLableBarCodeParam.name = "条形码";
            DrawLableBarCode(this.DrawLableBarCodeParam);
            if (this.isEditTag) {
                this.$set(this.tags, this.editIndex, this.DrawLableBarCodeParam);
            } else {
                this.tags.push(this.DrawLableBarCodeParam)
            }
            this.dialogDrawLableBarCodeParam = false;
            this.isDraw = true
        },
        // 二维码
        DrawLableQrCodeApi() {

            this.DrawLableQrCodeParam.width = Number(this.DrawLableQrCodeParam.width);
            this.DrawLableQrCodeParam.height = Number(this.DrawLableQrCodeParam.width);
            this.DrawLableQrCodeParam.x = Number(this.DrawLableQrCodeParam.x);
            this.DrawLableQrCodeParam.y = Number(this.DrawLableQrCodeParam.y);
            this.DrawLableQrCodeParam.name = "二维码";
            //DrawLableQrCode(this.DrawLableQrCodeParam);
            if (this.isEditTag) {
                this.$set(this.tags, this.editIndex, this.DrawLableQrCodeParam);
            } else {
                this.tags.push(this.DrawLableQrCodeParam)
            }
            this.dialogDrawLableQrCodeParam = false;
            this.isDraw = true
        },
        DragList(List) {
            List.forEach(res => {

            })
        },
        // 预览时进行绘制
        generateImagePreviewImagepi() {
            let List = [...this.tags];
            // 创建画布
            InitDrawingBoard(this.InitDrawingBoardParam, (data => {
                List.forEach(res => {
                    switch (res.name) {
                        case "文本":
                            DrawLableText(res);
                            break;
                        case "条形码":
                            DrawLableBarCode(res);
                            break;
                        case "二维码":
                            DrawLableQrCode(res);
                            break;
                        case "线条":
                            DrawLableLine(res);
                            break;
                        case "形状":
                            DrawLableGraph(res);
                            break;
                        case "图片":
                            DrawLableImage(res);
                            break;
                    }
                });
                // 标签预览
                generateImagePreviewImage(generateImagePreviewImageParam['displayScale'],
                    (data => {
                        var arrParse = JSON.parse(JSON.stringify(data));
                        //var Epc = document.getElementById('searchRfidBox');
                        var base64Data = arrParse.resultAck.info;
                        var obj = JSON.parse(base64Data);
                        var data = obj.ImageData;
                        var imgDisplay = document.getElementById('base64image');
                        var errorCode = obj.errorCode;

                        this.imgSrc = "data:image/jpeg;base64," + data;
                        // self.isInit = false
                    }))
            }));
        },
        //清空
        emptyImagePreviewImage() {
            this.imgSrc = "";
            this.tags = [];
            this.isDraw = false
        },
        DrawLableTextApiDemo(DrawLableTextParamDemo, callbackFunction) {
            DrawLableText(DrawLableTextParamDemo, callbackFunction);
        },
        DrawLableGraphApiDemo(callbackFunction) {
            DrawLableGraph(this.DrawLableGraphParamDemo, callbackFunction);
        },

        DrawLableLineApiDemo(DrawLableLineParamDemo, callbackFunction) {
            DrawLableLine(DrawLableLineParamDemo, callbackFunction);
        },
        DrawLableBarCodeApiDemo(drawLableBarCodeParamDemo, callableFunction) {
            DrawLableBarCode(drawLableBarCodeParamDemo, callableFunction)
        },

        /**
         * 开始打印任务
         * @param {*} pageCount 打印页数
         * @param {*} quantityCount 打印份数
         * @param {*} density 浓度
         * @param {*} paperType 纸张类型
         * @param {*} paperType 材质
         * @param {*} paperType 打印模式
         */
        startPrintJob(index) {
            let {
                pageCount = "1",
                quantityCount = "1",
                density = "3",
                paperType = "1",
                printMode = "1"
            } = this.form;
            const self = this;
            switch (index) {
                case 1:
                    quantityCount = 1;
                    break;
                case 2:
                    quantityCount = 1;
                    pageCount = 2;
                    break;
                case 4:
                    pageCount = 2;
                    break;
            }
            if (this.value === "") {
                self.$message({
                    message: '请选择连接打印机',
                    type: 'warning'
                });
                return;
            }
            if (!this.form.quantityCount && (index === 3 || index === 4)) {
                self.$message({
                    message: '请选填写打印份数',
                    type: 'warning'
                });
                return;
            }

            // 为了防止打印时未生成对应图像
            // 初始化画板
            InitDrawingBoard(this.InitDrawingBoardParam, (data1 => {
                // 添加文字
                this.DrawLableBarCodeApiDemo(this.DrawLableBarCodeParam, (data => {
                    // 提交数据
                    var totalCount = parseInt(pageCount) * parseInt(quantityCount);
                        startJob(parseInt(density), parseInt(paperType), parseInt(printMode), totalCount, function (data) {
                        bCanclePrint = false;
                        var arrParse = JSON.parse(JSON.stringify(data));
                        if (arrParse.resultAck.result !== 0) {
                            self.$message({
                                message: '打印失败！',
                                type: 'warning'
                            });
                            return;
                        }
                        var intPageCount = parseInt(pageCount);
                        var intQuantityCount = parseInt(quantityCount);
                        self.sendCommitJob(self.DrawLableTextParamDemo, pageIndex, intPageCount, intQuantityCount);
                    });
                }))
            }))


        },
        /**
         * 提交打印数据
         * @param {string} printData 打印数据
         * @param {string} printerInfo 打印机信息
         * @param {number} pageIndex 页序号
         * @param {number} pageCount 页数
         * @param {number} quantityCount 单页的份数
         */
        sendCommitJob(printData, pageIndex, pageCount, quantityCount) {
            if (bCanclePrint) {
                return;
            }
            const self = this;
            var jsonObj = {"printerImageProcessingInfo": {"printQuantity": quantityCount}};
            commitJob(null, JSON.stringify(jsonObj), function (data) {
                var arrParse = JSON.parse(JSON.stringify(data));
                var resultInfo = "commitJob ok";
                if (arrParse.resultAck.printQuantity === pageCount && arrParse.resultAck.onPrintPageCompleted === quantityCount) {
                    //所有⻚数据的所有份数打印完成
                    endJob(function (data) {
                        // 停止打印
                        var arrParse = JSON.parse(JSON.stringify(data));
                        if (String(arrParse.resultAck.info).indexOf("endJob ok") > -1) {
                            // document.getElementById("printId").disabled = false;
                        }
                    });
                    return;
                }

                //异常导致打印取消
                if (arrParse.resultAck.errorCode !== 0 && (arrParse.resultAck.cacheStatus === "cancel")) {
                    // document.getElementById("printId").disabled = false;
                    return;
                }

                //异常导致打印暂停
                if (arrParse.resultAck.errorCode !== 0 && (arrParse.resultAck.cacheStatus === "pause")) {
                    cancleJobApi();
                    return;
                }

                //当前⻚所有份数打印完成，但是未打印完所有⻚数据，继续发送下⼀⻚数据
                if (String(arrParse.resultAck.info).indexOf(resultInfo) > -1 && pageIndex !== pageCount) {
                    pageIndex++;
                    setTimeout(function () {
                        // 初始化画板
                        InitDrawingBoard(self.InitDrawingBoardParam, (data1 => {
                            // 添加文字
                            self.DrawLableBarCodeApiDemo(self.DrawLableBarCodeParam, (data => {
                                self.sendCommitJob(self.DrawLableTextParamDemo, pageIndex, pageCount, quantityCount);
                            }))

                        }))// 提交数据
                    }, 500);
                }
            });
        }
    },
});