diff --git a/web/admin/item/TabletDesigner.aspx b/web/admin/item/TabletDesigner.aspx index 756feb8..f7d3a14 100644 --- a/web/admin/item/TabletDesigner.aspx +++ b/web/admin/item/TabletDesigner.aspx @@ -93,14 +93,14 @@ -
+ <%--
-
+
--%> <%--
@@ -114,7 +114,7 @@ 存檔
- 預覽列印 + <%--預覽列印--%>
@@ -237,10 +237,10 @@ allSize: [ ], bg: [ - { name: "黃1", path: "../../admin/print/html/tablet-1_new.svg" }, - { name: "黃2", path: "../../admin/print/html/tablet-1B_new.svg" }, - { name: "紅1", path: "../../admin/print/html/tablet-2.svg" }, - { name: "紅2", path: "../../admin/print/html/tablet-2B.svg" } + { name: "超薦1", path: "../../admin/print/html/tablet-1_new.svg" }, + { name: "超薦2", path: "../../admin/print/html/tablet-1B_new.svg" }, + { name: "消災1", path: "../../admin/print/html/tablet-2.svg" }, + { name: "消災2", path: "../../admin/print/html/tablet-2B.svg" } ], allStyle: [ ], @@ -603,7 +603,8 @@ if (paperSize == "newsize") { $("#sizeDiv").attr("style", "display:"); } else { - // console.log("paperSize:", paperSize); + // console.log("paperSize:", paperSize); + $("#sizeDiv").attr("style", "display:none;"); let size = this.allSize.find(x => x.id == paperSize) $(".tablet-paper").css({ "background-color": "white", @@ -641,6 +642,7 @@ bindEvents() { // 文字變更連動渲染 //$('#rosterLimit').on('input', (e) =>this.) + console.log("OOQ"); $('#inp-text').on('input', (e) => this.updateActive('text', $(e.target).val())); $('#inp-size').on('input', (e) => this.updateActive('fontSize', $(e.target).val())); $('#width').on('input', (e) => this.updateActive('width', $(e.target).val())) @@ -671,12 +673,12 @@ render() { $(".tablet-paper").empty(); //const $canvas = $('#canvas').empty(); - const roster = this.elements.find(e => e.type === 'roster'); - const names = roster ? roster.text.split('\n').filter(s => s.trim()) : []; - const pages = Math.max(1, Math.ceil(names.length / this.rosterLimit)); + + //const roster = this.elements.find(e => e.type === 'roster'); + let style = this.allStyle.find(x => x.styleID == this.styleID); let size = this.allSize.find(x => x.id == style.paperSize); - console.log(this.paper, size); + //console.log(this.paper, size); //for (let p = 0; p < pages; p++) { // const $paper = $('
') // .css({ "background-color": "red", width: this.paper.width + 'mm', height: this.paper.height + 'mm' }); @@ -687,9 +689,14 @@ position: "absolute" }); //const slice = names.slice(p * this.rosterLimit, (p + 1) * this.rosterLimit); - const slice = names.slice(0 * this.rosterLimit, (0 + 1) * this.rosterLimit); + //const roster = this.elements.find(e => e.id === this.styleID); + let self = this; + this.elements.forEach(el => { - $paper.append(this.createEl(el, slice)); + const names = el.text.split('\n').filter(s => s.trim()); + const pages = Math.max(1, Math.ceil(names.length / self.rosterLimit)); + const slice = names.slice(0 * self.rosterLimit, (0 + 1) * self.rosterLimit); + $paper.append(self.createEl(el, slice)); }); //$canvas.append($paper); //} @@ -722,6 +729,7 @@ html = this.renderNameList(slice, el); } else if (el.id === 'alive') { + console.log("createEl:",slice,el) html = this.renderLiveList(slice, el); } else { @@ -772,6 +780,8 @@ }); }, renderLiveList(names, el) { + console.log("renderLiveList:",names); + //$("#imp-text").updateActive("text",names) let $namelist = $(`
`).css({ "writing-mode": "vertical rl", display: "flex", @@ -795,6 +805,8 @@ return $namelist; }, renderLiveSpan(name, el) { + console.log("renderLiveSpan:", name, el + ); return $(`${name}`).css({ display: "block", "min-height": `${el.textHeight}px`, @@ -869,8 +881,11 @@ }, select(id) { + console.log("QQ:",id); this.activeId = id; + console.log("QQ:",this.elements); const el = this.elements.find(x => x.id === id); + const el1 = this.elements.find(x => x.id === "titletriangle"); $('#attr-box').removeClass('d-none'); $('#inp-text').val(el.text); $('#inp-size').val(el.style.fontSize); @@ -889,6 +904,7 @@ }, updateActive(key, val) { + console.log("updateActive:",key, val) const el = this.elements.find(x => x.id === this.activeId); if (key === 'fontSize') el.style.fontSize = parseFloat(val); @@ -1049,7 +1065,7 @@ let master = { styleID: this.styleID, styleName: $("#styleName").val(), paperSize: $("#paperSize").val(), backendImg: $("#backendInp").val(), printSize: $("#printSize").val(), printMode: $("#printMode").val(), - orientation: $("#paperOrientation").val(), printPageCount: $("#perpage").val(), rosterLimit: $("#rosterLimit").val(), + orientation: $("#paperOrientation").val(), printPageCount: $("#perpage").val(), rosterLimit: 8, detail: detail } console.log(master); diff --git a/web/admin/print/tablet_edit/editorNewOne.html b/web/admin/print/tablet_edit/editorNewOne.html index 99dd723..5c94683 100644 --- a/web/admin/print/tablet_edit/editorNewOne.html +++ b/web/admin/print/tablet_edit/editorNewOne.html @@ -44,7 +44,8 @@
版型設定: -
@@ -211,10 +212,10 @@ toast: null, modal: null, bg: [ - { name: "黃1", path: "../../../admin/print/html/tablet-1_new.svg" }, - { name: "黃2", path: "../../../admin/print/html/tablet-1B_new.svg" }, - { name: "紅1", path: "../../../admin/print/html/tablet-2.svg" }, - { name: "紅2", path: "../../../admin/print/html/tablet-2B.svg" } + { name: "超薦1", path: "../../../admin/print/html/tablet-1_new.svg" }, + { name: "超薦2", path: "../../../admin/print/html/tablet-1B_new.svg" }, + { name: "消災1", path: "../../../admin/print/html/tablet-2.svg" }, + { name: "消災2", path: "../../../admin/print/html/tablet-2B.svg" } ], async init() { // 載入常用片語 @@ -303,7 +304,7 @@ let data = response.data; if (data.data) { data.data.forEach(x => { - if (x.styleID !== "00001") { + if (x.styleID !== "000001") { this.allStyle.push(x); $("#styleSel").append(`