yiming/17168ERP
1
0
Fork 0
Code Issues Pull Requests 2 Actions Packages Projects Releases Wiki Activity

調整

Browse Source
This commit is contained in:
minom
2026-07-22 18:04:17 +08:00
parent 07c5027ad8
commit da58dc92d0
19 changed files with 2105 additions and 148 deletions
Download Patch File Download Diff File Expand all files Collapse all files
web/admin/print/TabletDesign.aspx
+94 -41
View File
@@ -317,13 +317,13 @@
<div class="row">
<div class="col-6">
<div class="form-floating mb-3">
<input type="number" id="xPosition" class="form-control form-control-sm mb-2" onchange="changePosition()">
<input type="number" id="xPosition" class="form-control form-control-sm mb-2" @change.prevent="changePosition">
<label class="small" for="xPosition">X</label>
</div>
</div>
<div class="col-6">
<div class="form-floating mb-3">
<input type="number" id="yPosition" class="form-control form-control-sm mb-2" onchange="changePosition()">
<input type="number" id="yPosition" class="form-control form-control-sm mb-2" @change.prevent="changePosition">
<label class="small" for="yPosition">Y</label>
</div>
</div>
@@ -518,7 +518,7 @@
},
methods: {
onTabsResize(e) {
console.log(e)
//console.log(e)
// 當畫面變動時，呼叫 Vuetify 內部的呼叫方法重新計算寬度
//if (this.$refs.myTabs) {
// this.$refs.myTabs.onResize();
@@ -781,7 +781,7 @@
await axios
.post(HTTP_HOST + 'api/tablet/GetTabletElement', {})
.then(response => {
console.log(response)
//console.log(response)
//if (response.result=="Y") {
if (response.status == "200") {
let data = response.data;
@@ -932,7 +932,7 @@
changePaper1(val) {
//$("#paperSize").val(val)
this.paperSize = val.id
console.log("changePaper1:",val)
//console.log("changePaper1:",val)
this.changePaper()
},
changePaper() {
@@ -985,7 +985,7 @@
async removePaper() {
this.removeDialog = true;
this.removeTarget = "paper";
console.log("QQOO", this.removeStyle)
//console.log("QQOO", this.removeStyle)
},
async confirmRemoveStyle() {
let self = this;
@@ -1012,7 +1012,7 @@
async removeStyle() {
this.removeDialog = true;
this.removeTarget = "style";
console.log("QQOO",this.removeStyle)
//console.log("QQOO",this.removeStyle)
},
async newPaperSize() {
this.paperDialog = true
@@ -1049,8 +1049,8 @@
changeRosterLimit() {
//this.rosterLimit = parseInt(this.rosterLimit) //parseInt($("#rosterLimit").val());
},
changePrintMode() {
changePrintMode(printMode) {
this.printMode = printMode
},
bindEvents() {
// 文字變更連動渲染
@@ -1123,9 +1123,18 @@
createEl(el, slice) {
let html = '';
let fontSize = el.style.fontSize;
// 1. 智慧名單渲染
if (el.type === 'roster') {
html = this.renderRoster(slice, el);
let perRow = Math.floor(Number(el.height) / Number(el.textHeight));
let rows = Math.ceil(Number(slice.length) / Number(perRow));//總行數
let rowWidth = Math.floor(Number(el.width) / rows);
let fontSize = Math.floor(rowWidth / 2);
if (fontSize > el.style.fontSize) {
fontSize = el.style.fontSize;
rowWidth = fontSize * 2;
}
html = this.renderRoster(slice, el, rowWidth);
}
// 2. 正名合併置中
else if (el.type === 'combined-center') {
@@ -1140,24 +1149,43 @@
html = el.text.replace(/(\d+)/g, '<span class="tate-chu-yoko">$1</span>');
}
else if (el.id === 'title1') {
html = this.renderNameList(slice, el);
//要先去算出需要縮到多小字，根據總寬度跟行數，這樣才會在正中間
//字體大小*2如果大於行數就要縮字體
let perRow = Math.floor(Number(el.height) / Number(el.textHeight));
let rows = Math.ceil(Number(slice.length) / Number(perRow));//總行數
let rowWidth = Math.floor(Number(el.width) / rows);
fontSize = Math.floor(rowWidth / 2);
//console.log(el.height, el.textHeight, perRow, rows, rowWidth, fontSize)
if (fontSize > el.style.fontSize) {
fontSize = el.style.fontSize;
rowWidth = fontSize * 2;
}
html = this.renderNameList(slice, el, rowWidth);
}
else if (el.id === 'alive') {
console.log("createEl:", slice, el)
html = this.renderLiveList(slice, el);
//console.log("createEl:", slice, el)
let perRow = Math.floor(Number(el.height) / Number(el.textHeight));
let rows = Math.ceil(Number(slice.length) / Number(perRow));//總行數
let rowWidth = Math.floor(Number(el.width) / rows);
fontSize = Math.floor(rowWidth / 2);
if (fontSize > el.style.fontSize) {
fontSize = el.style.fontSize;
rowWidth = fontSize * 2;
}
html = this.renderLiveList(slice, el, rowWidth);
}
else {
html = el.text;
}
//el.style.fontSize
return $(`<div class="tablet-element vertical-text ${this.activeId === el.id ? 'selected' : ''}" id="${el.id}"></div>`)
.css({
position: "absolute", left: el.x + "mm", top: el.y + "mm", fontSize: el.style.fontSize + 'pt', fontFamily: el.style.fontFamily, "z-index": 9999, visibility: el.style.visibility
position: "absolute", left: el.x + "mm", top: el.y + "mm", fontSize: fontSize + 'pt', fontFamily: el.style.fontFamily, "z-index": 9999, visibility: el.style.visibility
//position: "absolute", left: el.startX + "mm", top: el.startY + "mm", fontSize: el.fontSize + 'pt', fontFamily: el.fontFamily, "z-index": 9999, visibility: el.isActive
})
.html(html);
},
renderNameList(names, el) {
renderNameList(names, el,rowWidth) {
let $namelist = $(`<div class='nameList'></div>`).css({
"writing-mode": "vertical rl",
display: "flex",
@@ -1177,16 +1205,16 @@
//"row-gap": "1px",
let self = this;
names.forEach(n => {
$namelist.append(self.renderNameSpan(n, el))
$namelist.append(self.renderNameSpan(n, el, rowWidth))
})
return $namelist;
},
renderNameSpan(name, el) {
renderNameSpan(name, el, rowWidth) {
return $(`<span>${name}</span>`).css({
display: "block",
"min-height": `${el.textHeight}px`,
"max-height": `${el.height}px`,
width: `${el.textWidth}px`,
width: `${rowWidth}px`,
"text-align": "justify",
"text-align-last": "justify",
@@ -1194,8 +1222,8 @@
"text-justify": "inter-character",
});// "margin-bottom": `${el.textSpan}px`,
},
renderLiveList(names, el) {
console.log("renderLiveList:", names);
renderLiveList(names, el, rowWidth) {
//console.log("renderLiveList:", names);
//$("#imp-text").updateActive("text",names)
let $namelist = $(`<div class='liveList'></div>`).css({
"writing-mode": "vertical rl",
@@ -1216,18 +1244,17 @@
//"row-gap": "1px",
let self = this;
names.forEach(n => {
$namelist.append(self.renderLiveSpan(n, el))
$namelist.append(self.renderLiveSpan(n, el, rowWidth))
})
return $namelist;
},
renderLiveSpan(name, el) {
console.log("renderLiveSpan:", name, el
);
renderLiveSpan(name, el, rowWidth) {
//console.log("renderLiveSpan:", name, el );
return $(`<span>${name}</span>`).css({
display: "block",
"min-height": `${el.textHeight}px`,
"max-height": `${el.height}px`,
width: `${el.textWidth}px`,
width: `${rowWidth}px`,
"text-align": "justify",
"text-align-last": "justify",
@@ -1236,7 +1263,7 @@
});//"margin-bottom": `${el.textSpan}px`,
},
// 品字佈局邏輯：一上二下
renderRoster(names, el) {
renderRoster(names, el,rowWidth) {
if (!names.length) return '';
const mid = names.length === 1 ? 1 : Math.floor(names.length / 2);
const top = names.slice(0, mid);
@@ -1297,9 +1324,9 @@
},
select(id) {
console.log("QQ:", id);
//console.log("QQ:", id);
this.activeId = id;
console.log("QQ:", this.elements);
//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');
@@ -1321,7 +1348,7 @@
},
updateActive(key, val) {
console.log("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);
@@ -1334,12 +1361,19 @@
else el[key] = val;
if (el.type == "roster") {
const names = el.text.split('\n').filter(s => s.trim());
let perRow = Math.floor(Number(el.height) / Number(el.textHeight));
let rows = Math.ceil(Number(names.length) / Number(perRow));//總行數
let rowWidth = Math.floor(Number(el.width) / rows);
let fontSize = Math.floor(rowWidth / 2);
if (fontSize > el.style.fontSize) {
fontSize = el.style.fontSize;
rowWidth = fontSize * 2;
}
$(`.tablet-element[id="${this.activeId}"]`).css({
position: "absolute", left: el.startX + "mm", top: el.startY + "mm", fontSize: el.style.fontSize + 'pt', fontFamily: el.fontFamily, "z-index": 9999, visibility: el.style.isActive
}).html(this.renderRoster(names.slice(0 * this.rosterLimit, (0 + 1) * this.rosterLimit), el));
position: "absolute", left: el.startX + "mm", top: el.startY + "mm", fontSize: fontSize + 'pt', fontFamily: el.fontFamily, "z-index": 9999, visibility: el.style.isActive
}).html(this.renderRoster(names.slice(0 * this.rosterLimit, (0 + 1) * this.rosterLimit), el, rowWidth));
} else if (el.type == "combined-center") {
console.log("combined-center");
//console.log("combined-center");
const parts = el.text.split('\n');
html = `<div class="ancestor-wrapper" style='width:${el.width}px !important;height:${el.height}px !important' >
@@ -1353,18 +1387,37 @@
}).html(html);
} else if (this.activeId === "title1") {
let names = el.text.split('\n').filter(s => s.trim());
let slice = names.slice(0 * this.rosterLimit, (0 + 1) * this.rosterLimit);
html = this.renderNameList(slice, el);
let perRow = Math.floor(Number(el.height) / Number(el.textHeight));
let rows = Math.ceil(Number(slice.length) / Number(perRow));//總行數
let rowWidth = Math.floor(Number(el.width) / rows);
let fontSize = Math.floor(rowWidth / 2);
if (fontSize > el.style.fontSize) {
fontSize = el.style.fontSize;
rowWidth = fontSize * 2;
}
//console.log(el.height, el.textHeight, perRow, rows, rowWidth, fontSize)
html = this.renderNameList(slice, el, rowWidth);//el.style.fontSize
$(`.tablet-element[id="${this.activeId}"]`).css({
position: "absolute", left: el.x + "mm", top: el.y + "mm", fontSize: el.style.fontSize + 'pt', fontFamily: el.style.fontFamily, "z-index": 9999, visibility: el.style.visibility
position: "absolute", left: el.x + "mm", top: el.y + "mm", fontSize: fontSize + 'pt', fontFamily: el.style.fontFamily, "z-index": 9999, visibility: el.style.visibility
}).html(html);
} else if (this.activeId === "alive") {
let names = el.text.split('\n').filter(s => s.trim());
let slice = names.slice(0 * this.rosterLimit, (0 + 1) * this.rosterLimit);
html = this.renderLiveList(slice, el);
let perRow = Math.floor(Number(el.height) / Number(el.textHeight));
let rows = Math.ceil(Number(slice.length) / Number(perRow));//總行數
let rowWidth = Math.floor(Number(el.width) / rows);
let fontSize = Math.floor(rowWidth / 2);
if (fontSize > el.style.fontSize) {
fontSize = el.style.fontSize;
rowWidth = fontSize * 2;
}
html = this.renderLiveList(slice, el, rowWidth);
$(`.tablet-element[id="${this.activeId}"]`).css({
position: "absolute", left: el.x + "mm", top: el.y + "mm", fontSize: el.style.fontSize + 'pt', fontFamily: el.style.fontFamily, "z-index": 9999, visibility: el.style.visibility
position: "absolute", left: el.x + "mm", top: el.y + "mm", fontSize: fontSize + 'pt', fontFamily: el.style.fontFamily, "z-index": 9999, visibility: el.style.visibility
}).html(html);
} else if (this.activeId === "righttitle") {
$(`.tablet-element[id="${this.activeId}"]`).css({
@@ -1392,11 +1445,11 @@
//this.render();
},
displayItem(id) {
console.log("displayItem:", this.elements, id);
//console.log("displayItem:", this.elements, id);
let el = this.elements.find(x => x.id === id);
el.style.visibility = el.style.visibility === "hidden" ? "" : "hidden";
//要判斷如果所在位置超出範圍，要拉回來放
console.log("displayItem:", this.paper, el)
//console.log("displayItem:", this.paper, el)
if (el.x > this.paper.width) {
el.x = this.paper.width / 2
}
@@ -1494,7 +1547,7 @@
orientation:"", printPageCount:this.perPage, rosterLimit: 8,
detail: detail
}
console.log(master);
//console.log(master);
let path = "SavDegignerData";
if (this.styleID != null && this.styleID != "") {
path = "UpdateDegignerData"