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

排版

Browse Source
This commit is contained in:
minom
2026-04-02 18:22:18 +08:00
parent 37d0b928ec
commit 7998312785
11 changed files with 469 additions and 352 deletions
Download Patch File Download Diff File Expand all files Collapse all files

3
web/App_Code/Model/Model.cs
View File

@@ -184,6 +184,9 @@ namespace Model
public string partno { get; set; }
public string print_init { get; set; }
public string is_reconcile { get; set; }
public string pageSize { get; set; }
public string printSize { get; set; }
public string defaultStyle { get; set; }
public virtual actItem_kind actItem_kind { get; set; }
[System.Diagnostics.CodeAnalysis.SuppressMessage("Microsoft.Usage", "CA2227:CollectionPropertiesShouldBeReadOnly")]

35
web/App_Code/Model/Model.edmx
View File

@@ -91,6 +91,9 @@
<Property Name="customize_data" Type="nvarchar(max)" />
<Property Name="reg_time" Type="datetime" />
<Property Name="is_reconcile" Type="nvarchar" MaxLength="1" />
<Property Name="pageSize" Type="varchar" MaxLength="50" />
<Property Name="printSize" Type="varchar" MaxLength="50" />
<Property Name="defaultStyle" Type="varchar" MaxLength="50" />
</EntityType>
<EntityType Name="actItem_files">
<Key>
@@ -480,7 +483,7 @@
<Property Name="country" Type="nvarchar" MaxLength="5" />
<Property Name="appellation_id" Type="int" />
<Property Name="follower_hash" Type="nvarchar" MaxLength="100" />
<Property Name="search_keywords" Type="nvarchar(max)" />
<Property Name="search_keywords" Type="varchar(max)" />
</EntityType>
<EntityType Name="followers_tablet">
<Key>
@@ -981,7 +984,7 @@
<Property Name="balance_act_item" Type="int" />
<Property Name="balance_pro_order_detail" Type="int" />
</EntityType>
<Association Name="FK__Ancestral__Regis__4DF47A4E">
<Association Name="FK__Ancestral__Regis__1A9EF37A">
<End Role="AncestralTabletRegistrant" Type="Self.AncestralTabletRegistrant" Multiplicity="1" />
<End Role="AncestralTabletPositionRecord" Type="Self.AncestralTabletPositionRecord" Multiplicity="*" />
<ReferentialConstraint>
@@ -1129,18 +1132,6 @@
</Dependent>
</ReferentialConstraint>
</Association>
<Association Name="FK_activity_activity_kind">
<End Role="activity_kind" Type="Self.activity_kind" Multiplicity="0..1" />
<End Role="activity" Type="Self.activity" Multiplicity="*" />
<ReferentialConstraint>
<Principal Role="activity_kind">
<PropertyRef Name="num" />
</Principal>
<Dependent Role="activity">
<PropertyRef Name="kind" />
</Dependent>
</ReferentialConstraint>
</Association>
<Association Name="FK_activity_check_activity">
<End Role="activity" Type="Self.activity" Multiplicity="0..1">
<OnDelete Action="Cascade" />
@@ -2158,7 +2149,7 @@
<EntitySet Name="supplier" EntityType="Self.supplier" Schema="dbo" store:Type="Tables" />
<EntitySet Name="supplier_kind" EntityType="Self.supplier_kind" Schema="dbo" store:Type="Tables" />
<EntitySet Name="transfer_register" EntityType="Self.transfer_register" Schema="dbo" store:Type="Tables" />
<AssociationSet Name="FK__Ancestral__Regis__4DF47A4E" Association="Self.FK__Ancestral__Regis__4DF47A4E">
<AssociationSet Name="FK__Ancestral__Regis__1A9EF37A" Association="Self.FK__Ancestral__Regis__1A9EF37A">
<End Role="AncestralTabletRegistrant" EntitySet="AncestralTabletRegistrant" />
<End Role="AncestralTabletPositionRecord" EntitySet="AncestralTabletPositionRecord" />
</AssociationSet>
@@ -2206,10 +2197,6 @@
<End Role="activity_category_kind" EntitySet="activity_category_kind" />
<End Role="activity" EntitySet="activity" />
</AssociationSet>
<AssociationSet Name="FK_activity_activity_kind" Association="Self.FK_activity_activity_kind">
<End Role="activity_kind" EntitySet="activity_kind" />
<End Role="activity" EntitySet="activity" />
</AssociationSet>
<AssociationSet Name="FK_activity_check_activity" Association="Self.FK_activity_check_activity">
<End Role="activity" EntitySet="activity" />
<End Role="activity_check" EntitySet="activity_check" />
@@ -2614,6 +2601,9 @@
<Property Name="print_init" Type="String" MaxLength="100" FixedLength="false" Unicode="true" />
<NavigationProperty Name="transfer_register" Relationship="Model.FK_transfer_register_actItem" FromRole="actItem" ToRole="transfer_register" />
<Property Name="is_reconcile" Type="String" MaxLength="1" FixedLength="false" Unicode="true" />
<Property Name="pageSize" Type="String" MaxLength="50" FixedLength="false" Unicode="false" />
<Property Name="printSize" Type="String" MaxLength="50" FixedLength="false" Unicode="false" />
<Property Name="defaultStyle" Type="String" MaxLength="50" FixedLength="false" Unicode="false" />
</EntityType>
<EntityType Name="actItem_files">
<Key>
@@ -2973,7 +2963,7 @@
<NavigationProperty Name="transfer_register" Relationship="Model.FK_transfer_register_followers" FromRole="follower" ToRole="transfer_register" />
<NavigationProperty Name="transfer_register1" Relationship="Model.FK_transfer_register_followers_match" FromRole="follower" ToRole="transfer_register" />
<NavigationProperty Name="GuaDanOrder" Relationship="Model.FK_GuaDanOrder_Followers" FromRole="follower" ToRole="GuaDanOrder" />
<Property Name="search_keywords" Type="String" MaxLength="Max" FixedLength="false" Unicode="true" />
<Property Name="search_keywords" Type="String" MaxLength="Max" FixedLength="false" Unicode="false" />
<NavigationProperty Name="GuaDanOrderGuest" Relationship="Model.FK_GuaDanOrderGuest_FOLLOWERS" FromRole="follower" ToRole="GuaDanOrderGuest" />
</EntityType>
<EntityType Name="followers_tablet">
@@ -3189,7 +3179,7 @@
<Property Name="UpdateTime" Type="DateTime" Precision="7" />
<NavigationProperty Name="accountings" Relationship="Model.FK_accounting_pro_order_detail" FromRole="pro_order_detail" ToRole="accounting" />
<NavigationProperty Name="transfer_register" Relationship="Model.FK_transfer_register_pro_order_detail" FromRole="pro_order_detail" ToRole="transfer_register" />
<Property Name="style" Type="String" Unicode="true" FixedLength="false" MaxLength="50" Nullable="true" />
<Property Name="style" Type="String" Unicode="false" FixedLength="false" MaxLength="50" Nullable="true" />
</EntityType>
<EntityType Name="pro_order_record">
<Key>
@@ -5336,6 +5326,9 @@
<EntitySetMapping Name="actItems">
<EntityTypeMapping TypeName="Model.actItem">
<MappingFragment StoreEntitySet="actItem">
<ScalarProperty Name="defaultStyle" ColumnName="defaultStyle" />
<ScalarProperty Name="printSize" ColumnName="printSize" />
<ScalarProperty Name="pageSize" ColumnName="pageSize" />
<ScalarProperty Name="is_reconcile" ColumnName="is_reconcile" />
<ScalarProperty Name="print_init" ColumnName="print_init" />
<ScalarProperty Name="partno" ColumnName="partno" />

2
web/App_Code/Model/Model.edmx.diagram
View File

@@ -17,7 +17,7 @@
<EntityTypeShape EntityType="Model.activity_check" Width="1.5" PointX="5.25" PointY="18.5" IsExpanded="true" />
<EntityTypeShape EntityType="Model.activity_kind" Width="1.5" PointX="0.75" PointY="11.625" IsExpanded="true" />
<EntityTypeShape EntityType="Model.activity_kind_detail" Width="1.5" PointX="13.5" PointY="3.875" IsExpanded="true" />
<EntityTypeShape EntityType="Model.activity_relating" Width="1.5" PointX="10.5" PointY="9.875" IsExpanded="true" />
<EntityTypeShape EntityType="Model.activity_relating" Width="1.5" PointX="11.25" PointY="9.875" IsExpanded="true" />
<EntityTypeShape EntityType="Model.activity_spares" Width="1.5" PointX="13.5" PointY="7.75" IsExpanded="true" />
<EntityTypeShape EntityType="Model.admin" Width="1.5" PointX="6" PointY="1.375" IsExpanded="true" />
<EntityTypeShape EntityType="Model.admin_group" Width="1.5" PointX="3.75" PointY="3.625" IsExpanded="true" />

43
web/App_Code/api/designerController.cs
View File

@@ -1,5 +1,6 @@
using Microsoft.Ajax.Utilities;
using MINOM.COM.Utility;
using Model;
using Newtonsoft.Json;
using Newtonsoft.Json.Linq;
using System;
@@ -14,6 +15,7 @@ using System.Web.Http;
/// </summary>
public class designerController : ApiController
{
private Model.ezEntities _db = new Model.ezEntities();
public designerController()
{
//
@@ -21,6 +23,19 @@ public class designerController : ApiController
//
}
[HttpPost]
[Route("api/tablet/GetActItem")]
public IHttpActionResult GetActItem([FromBody] dynamic data)
{
LogUtility log = new LogUtility();
var json = data;
string itemNum = (json == null || json.itemNum == null) ? "" : (string)json.itemNum;
int num = int.Parse(itemNum);
var item=_db.actItems.AsQueryable().Where(x => x.num == num).FirstOrDefault();
return Ok(new { result = "Y", data =item});
}
[HttpPost]
[Route("api/tablet/GetTabletElement")]
public IHttpActionResult GetTabletElement([FromBody] dynamic data)
@@ -131,6 +146,14 @@ public class designerController : ApiController
if (mode == "add")
{
object[] obj = new StyleDataAccess().AddStyle(ts, list);
if (obj[0].ToString() == "Y")
{
return Ok(new { result = "Y" });
}
else
{
return Ok(new { result = "N" });
}
}
return Ok();
}
@@ -188,8 +211,14 @@ public class designerController : ApiController
}
object[] obj = new StyleDataAccess().UpdateStyle(ts, list);
return Ok();
if (obj[0].ToString() == "Y")
{
return Ok(new { result = "Y" });
}
else
{
return Ok(new { result = "N" });
}
}
@@ -238,8 +267,14 @@ public class designerController : ApiController
tps.UTime = DateTime.Now.ToString("HHmmss");
object[] obj = new StyleDataAccess().AddTabletPaper(tps);
return Ok();
if (obj[0].ToString()=="Y")
{
return Ok(new { result = "Y" });
}
else
{
return Ok(new { result = "N"});
}
}
}

80
web/admin/activity/item_reg.aspx
View File

@@ -23,6 +23,8 @@
data() {
return {
this_id: '<%= Request["num"] %>',
paperlist: [],
stylelist:[],
options: {},
optionsDetail: {
multiSort: false,
@@ -332,6 +334,45 @@
.catch(
error => console.log(error)
)
axios
.post(HTTP_HOST + 'api/tablet/GetPaperSize', {})
.then(response => {
console.log(response);
if (response.status == "200") {
let data = response.data;
if (data.result == "Y") {
data.data.forEach(x => {
this.paperlist.push({ name: x.paperName, id: x.paperID, width: x.width, height: x.height })
$("#pageSize").append(`<option value="${x.paperID}">${x.paperName}</option>`);
$("#printSize").append(`<option value="${x.paperID}">${x.paperName}</option>`);
});
}
}
})
.catch(
error => console.log(error)
)
axios
.post(HTTP_HOST + 'api/tablet/GetStyleData', {})
.then(response => {
console.log(response);
if (response.status == "200") {
let data = response.data;
if (data.result == "Y") {
data.data.forEach(x => {
if (x.styleID != "000001") {
this.stylelist.push({ styleID: x.styleID, name: x.name })
$("#defaultStyle").append(`<option value="${x.styleID}">${x.name}</option>`);
}
});
}
}
})
.catch(
error => console.log(error)
)
}
},
@@ -525,6 +566,15 @@
}
}
},
selectChange(what) {
if (what == "pageSize") {
document.getElementById('<%= pageSizeSel.ClientID %>').value = $("#pageSize").val();
} else if (what == "printSize") {
document.getElementById('<%= printSizeSel.ClientID %>').value = $("#printSize").val();
} else if (what=="defaultStyle") {
document.getElementById('<%= defaultStyleSel.ClientID %>').value = $("#defaultStyle").val();
}
}
},
computed: {
},
@@ -624,6 +674,36 @@
<asp:TextBox ID="price" MaxLength="7" runat="server" CssClass="form-control" placeholder="請輸入預設金額"></asp:TextBox>
<asp:RegularExpressionValidator ControlToValidate="price" Display="Dynamic" SetFocusOnError="true" ErrorMessage="只能輸入數字" ID="RegularExpressionValidator3" runat="server" ValidationExpression="^(-?\d+)(\.\d+)?$" />
</div>
</div>
<div class="row mb-1 label-sm-right">
<label class="col-sm-2 col-form-label">預設頁面尺寸</label>
<div class="col-sm-4">
<select id="pageSize" onchange="VueApp.selectChange('pageSize')">
<option value="">請選擇</option>
</select>
<asp:HiddenField ID="pageSizeSel" runat="server" Value="" />
<%--<asp:DropDownList ID="pageSize" runat="server"></asp:DropDownList> --%>
</div>
<label class="col-sm-2 col-form-label">預設列印尺寸</label>
<div class="col-sm-4">
<select id="printSize" onchange="VueApp.selectChange('printSize')">
<option value="">請選擇</option>
</select>
<asp:HiddenField ID="printSizeSel" runat="server" Value="" />
<%-- <asp:DropDownList ID="printSize" runat="server"></asp:DropDownList> --%>
</div>
</div>
<div class="row mb-1 label-sm-right">
<label class="col-sm-2 col-form-label">預設版型</label>
<div class="col-sm-4">
<select id="defaultStyle" onchange="VueApp.selectChange('defaultStyle')">
<option value="">請選擇</option>
</select>
<asp:HiddenField ID="defaultStyleSel" runat="server" Value="" />
<%--<asp:DropDownList ID="pageSize" runat="server"></asp:DropDownList> --%>
</div>
</div>
</div>
<asp:UpdatePanel ID="UpdatePanel1" runat="server" class="row mb-1 label-sm-right">
<ContentTemplate>

24
web/admin/activity/item_reg.aspx.cs
View File

@@ -121,6 +121,18 @@ public partial class admin_activity_item_reg : MyWeb.config
actItem.subject = subject.Text;
actItem.print_init = print_init.Text;
actItem.partno = PARTNO.Text;
if (!isStrNull(pageSizeSel.Value))
{
actItem.pageSize =(pageSizeSel.Value);
}
if (!isStrNull(printSizeSel.Value))
{
actItem.printSize = (printSizeSel.Value);
}
if (!isStrNull(defaultStyleSel.Value))
{
actItem.defaultStyle = (defaultStyleSel.Value);
}
//if (!isStrNull(kind.SelectedValue)) { actItem.kind = Val(kind.SelectedValue); } else { actItem.kind = null; }
if (!isStrNull(category.SelectedValue)) { actItem.category = Val(category.SelectedValue); } else { actItem.category = null; }
if (!isStrNull(kind.Value)) { actItem.kind = Val(kind.Value); } else { actItem.kind = null; }
@@ -168,6 +180,18 @@ public partial class admin_activity_item_reg : MyWeb.config
actItem.subject = subject.Text;
actItem.print_init = print_init.Text;
actItem.partno = PARTNO.Text;
if (!isStrNull(pageSizeSel.Value))
{
actItem.pageSize = (pageSizeSel.Value);
}
if (!isStrNull(printSizeSel.Value))
{
actItem.printSize = (printSizeSel.Value);
}
if (!isStrNull(defaultStyleSel.Value))
{
actItem.defaultStyle = (defaultStyleSel.Value);
}
//if (!isStrNull(kind.SelectedValue)) { actItem.kind = Val(kind.SelectedValue); } else { actItem.kind = null; }
if (!isStrNull(category.SelectedValue)) { actItem.category = Val(category.SelectedValue); } else { actItem.category = null; }
if (!isStrNull(kind.Value)) { actItem.kind = Val(kind.Value); } else { actItem.kind = null; }

2
web/admin/activity/reg.aspx
View File

@@ -641,11 +641,13 @@
};
// Add form fields
console.log(this.thisItemSelected.val, this.thisFilesSelected.val,JSON.stringify(list));
addHiddenField("item", this.thisItemSelected.val);
addHiddenField("file", this.thisFilesSelected.val);
addHiddenField("list", JSON.stringify(list));
addHiddenField("title", `${this.thisItemSelected.text} / ${this.thisFilesSelected.text}`);
//console.log("底家:",this.data_table.selected);
localStorage.setItem("item", this.thisItemSelected.val);
localStorage.setItem("list", JSON.stringify(this.data_table.selected));
/*

28
web/admin/item/TabletDesigner.aspx
View File

@@ -168,13 +168,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">
<input type="number" id="xPosition" class="form-control form-control-sm mb-2" onchange="Designer.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">
<input type="number" id="yPosition" class="form-control form-control-sm mb-2" onchange="Designer.changePosition()">
<label class="small" for="yPosition">Y</label>
</div>
</div>
@@ -225,8 +225,8 @@
allSize: [
],
bg: [
{ name: "黃1", path: "../../admin/print/html/tablet-1.svg" },
{ name: "黃2", path: "../../admin/print/html/tablet-1B.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" }
],
@@ -572,6 +572,13 @@
},
changePrintSize() {
},
changePosition() {
//this.activeId = id;
const el = this.elements.find(x => x.id === this.activeId);
el.x=$('#xPosition').val();
el.y = $("#yPosition").val();
$(`.tablet-element[id="${this.activeId}"]`).css({ left: el.x + "mm", top: el.y + "mm" });
},
changePaper() {
let paperSize = $("#paperSize").val()
@@ -599,6 +606,9 @@
.post(HTTP_HOST + 'api/tablet/SavePaperSize', ps)
.then(response => {
if (response.status == "200") {
if (response.data.result=="Y") {
alert("ok");
}
}
});
@@ -926,7 +936,7 @@
const id = `${prefix}-${Date.now()}-${i}`;
this.elements.push({
id, type: 'title', text: `正名${i}`, x: 100 - (i * 30), y: 80,
style: { fontSize: 24, fontFamily: 'Kaiti', isVertical: true }
style: { fontSize: 24, fontFamily: 'DFKai-sb', isVertical: true }
});
}
//this.render();
@@ -937,7 +947,7 @@
this.elements.push({
id: 'combined-' + Date.now(), type: 'combined-center', text: '林張\n氏歷代祖先', x: 130, y: 80,
style: { fontSize: 24, fontFamily: 'Kaiti', isVertical: true }
style: { fontSize: 24, fontFamily: 'DFKai-sb', isVertical: true }
});
//this.render();
},
@@ -1015,7 +1025,11 @@
await axios
.post(HTTP_HOST + `api/tablet/${path}`, master)
.then(response => {
console.log(response);
if (response.status == "200") {
if (response.data.result == "Y") {
alert("ok");
}
}
});
}
};

2
web/admin/order/reg.aspx
View File

@@ -2576,7 +2576,7 @@
<v-btn icon @click="tablet_edit.show=false"><v-icon>mdi-close</v-icon></v-btn>
</v-card-title>
<v-card-text>
<iframe id="tablet_edit_iframe" src="../print/tablet_edit/editornew.html" style="width: 100%; height: 550px;" frameborder="0"></iframe>
<iframe id="tablet_edit_iframe" src="../print/tablet_edit/editornew.html" style="width: 100%; height: 580px;" frameborder="0"></iframe>
</v-card-text>
</v-card>
</v-dialog>

695
web/admin/print/print_multi_new.aspx
View File

@@ -14,38 +14,16 @@
<link href="~/admin/Templates/TBS5ADM001/css/Style.css" rel="stylesheet" />
<link href="~/admin/item/css/floating.css" rel="stylesheet" />
<link href="~/admin/item/css/tablet-design.css" rel="stylesheet" />
<style>
@media print {
/*@page {
size: 398mm 216mm portrait;
margin: 0;
}*/
html, body, form, .full-home, #printArea, .canvas-area {
height: auto !important;
width: auto !important;
overflow: visible !important; /*必須為 visible */
margin: 0 !important;
padding: 0 !important;
/* display: block !important;*/
}
.no-print, #customMenu {
display: none !important;
}
}
</style>
<%--<link href="~/admin/item/css/tablet-design.css" rel="stylesheet" />--%>
</head>
<body>
<span class="btn btn-primary no-print" onclick="Printer.print()">列印</span>
<select id="paperSizeSel" onchange="Printer.render()">
<option>紙張尺寸</option>
<!-- onchange="Printer.render()"-->
<option value="">紙張尺寸</option>
</select>
<div class="d-flex full-home" style="height: auto;width:100%;">
<div class="d-flex full-home no-print" style="height: auto;width:100%;">
<div id="printArea" class="printArea" style="width: auto; height: auto">
<%-- <div class="tablet-paper">
@@ -98,14 +76,20 @@
<script src="<%=ResolveUrl("~/admin/Templates/TBS5ADM001/js/Script.js")%>"></script>
<script src="<%=ResolveUrl("~/admin/item/jquery-ui/jquery-ui.min.js")%>"></script>
<script>
// 建立 MutationObserver 實例，並傳入 callback 函式
const Printer = {
selected: null,
http_host: "",
pageStyle: "",
pSize:"",
allStyle: [],
allSize: [],
allStyleDetails: [],
printData: [],
tabletElement: [],
observer: null,
isInit:true,
bg: [
{ name: "黃1", path: "../../admin/print/html/tablet-1_new.svg" },
{ name: "黃2", path: "../../admin/print/html/tablet-1B_new.svg" },
@@ -116,14 +100,38 @@
let HTTP_HOST = "<%=UrlHost()%>";
this.http_host = HTTP_HOST;
await Promise.all([
//
Promise.all([
this.getActItem(),
this.getPaperSize(),
]).then(() => {
Promise.all([
this.getTabletElement(),
this.getTabletStyles(),
this.getAllStyleDetails()
]);
this.getData();
this.getAllStyleDetails(),
this.getData(),
]).then(() => {
this.render();
})
})
},
async getActItem() {
axios
.post('/api/tablet/GetActItem', { itemNum: localStorage.getItem("item") })
.then(response => {
if (response.data.result == "Y" && response.data.data) {
this.pSize = response.data.data.printSize;
$("#paperSizeSel").val(this.pSize);
} else {
$("#paperSizeSel").val("0001");
}
//$("#paperSizeSel").trigger('change');
//this.render();
//this.print();
//this.isInit = false;
}
);
},
async getAllStyleDetails() {
await axios
@@ -134,7 +142,7 @@
if (data.result == "Y") {
let details = data.data;
this.allStyleDetails = details;
console.log(data.data);
//console.log(data.data);
}
}
}
@@ -149,13 +157,20 @@
if (response.status == "200") {
let data = response.data;
this.allSize = data.data;
//console.log(this.allSize);
if (this.allSize) {
this.allSize.forEach(x => {
$("#paperSizeSel").append(`<option value="${x.paperID}">${x.paperName}</option>`);
})
$("#paperSizeSel").val("0003")
//if (this.printSize) {
// $("#paperSizeSel").val(this.printSize);
//} else {
// $("#paperSizeSel").val("0003")
//}
}
}
//$("#paperSizeSel").val("0003");
}
)
},
async getTabletElement() {
@@ -166,23 +181,18 @@
if (response.status == "200") {
let data = response.data;
this.tabletElement = data.data;
}
}
);
});
},
async getTabletStyles() {
await axios
.post(this.http_host + 'api/tablet/GetStyleData', {})
.then(response => {
//if (response.result=="Y") {
if (response.status == "200") {
let data = response.data;
this.allStyle = data.data;
}
}
);
});
},
async getData() {
let list = localStorage.getItem("list")
@@ -198,40 +208,49 @@
if (response.status == 200) {
this.printData = response.data;
this.render();
this.print();
//this.render();
//this.print();
}
});
},
render() {
//console.log(this.pSize)
//if (this.isInit) {
// return false;
//}
$("#printArea").empty();
let self = this;
let canvas = $(` <div class="canvas-area flex-grow-1 overflow-auto d-flex flex-row align-items-center position-relative" ></div>`)
let nowPageWidth = 0;
let tabletpaper;
this.printData.forEach(x => {
if ($("#paperSizeSel").val() == "") {
if (this.pSize&&this.pSize!=undefined) {
$("#paperSizeSel").val(this.pSize);
} else {
$("#paperSizeSel").val("0003");
}
}
let style = self.allStyle.find(y => y.styleID == x.style);
let size = self.allSize.find(y => y.paperID == style.paperSize);
let pageSize = self.allSize.find(y => y.paperID == $("#paperSizeSel").val());
let printSize = self.allSize.find(y => y.paperID ==style.printSize);
console.log("size:",size);
if ((nowPageWidth + parseFloat(size.width)) > pageSize.width) {
$(canvas).css("width", printSize.width + "mm");
$(canvas).css("height", printSize.height + "mm");
$(canvas).css("justify-content", "center");
$(canvas).css("break-after", "page");
$(canvas).css("page-break-after", "always");
if ((nowPageWidth + parseFloat(printSize.width)) > pageSize.width) {
//$(canvas).css("width", printSize.width + "mm");
//$(canvas).css("height", printSize.height + "mm");
//$(canvas).css("justify-content", "center");
//$(canvas).css("break-after", "page");
//$(canvas).css("page-break-after", "always");
$(canvas).append(tabletpaper);
$("#printArea").append(canvas);
canvas = $(` <div class="canvas-area flex-grow-1 overflow-auto d-flex flex-row align-items-center position-relative" ></div>`)
nowPageWidth = 0;
}
nowPageWidth = nowPageWidth + parseFloat(size.width);
nowPageWidth = nowPageWidth + parseFloat(printSize.width);
tabletpaper = $(` <div class="tablet-paper">
</div>`)
let img = self.bg.find(y => y.name == style.backendImg);
tabletpaper.css({
/*tabletpaper.css({
"background-color": "white",
width: size.width + 'mm',
height: size.height + 'mm',
@@ -239,9 +258,9 @@
"margin-bottom": "0",
"background-image": `url(${img.path})`,
'background-size': '100% 100%',
//"break-after": "page",
//"page-break-after": "always"
});
"break-after": "page",
"page-break-after": "always"
});*/
let tablet = JSON.parse(x.f_num_tablet);
let mid_items = tablet.mid_items;
@@ -261,9 +280,6 @@
details.forEach(d => {
if (d.isActive != "hidden") {
//console.log(d);
//let { newFontSize, newTxtWidth } = self.scaleFontSize(mid, style, d)
let newFontSize = self.scaleFontSize(mid, d.fontSize, d.width);
let html = "";
@@ -314,34 +330,9 @@
html = $namelist;
} else if (d.elementID === "alive") {
//陽上
//d.startX
//yang = $("<div class='yang'></div>").css({
// height: "36px","font-size": "12px"
//});
//$(yang).append("<span>陽上</span>")
html = self.renderLiveList(left, d);
//拜薦
//bi = $("<div class='bi'></div>")
//$(bi).append("<span>拜薦</span>").css({
// height: "36px","font-size":"12px"
//});
//alive = $("<div class='yangshang-wrapper'></div>").css({
// //"font-size": d.fontSize+"px",
// display: "flex ",
// "flex-direction": "row", /* 垂直堆疊 */
// "justify-content": "space-between ", /* 陽上與拜薦各據頂底 */
// "align-items": "center", /* 水平方向置中 */
// "height": "100%",//"100% !important",
// "width": "100% ",
// "writing-mode": "vertical-rl", /* 確保內部文字均為垂直書寫 */
// "text-orientation": "upright", /* 確保文字方向轉正 */
// "gap": "1px"
//})
newFontSize = d.fontSize;
//html=$(alive).append(yang).append(html).append(bi);
}
let content = $(`<div class="tablet-element vertical-text "></div>`)
@@ -349,15 +340,10 @@
position: "absolute", left: d.startX + "mm", top: d.startY + "mm", fontSize: newFontSize + 'px',
fontFamily: d.fontFamily, "font-weight": "bold", "z-index": 9999, visibility: d.isActive,
"align-items":"center"
//"text-align": "justify","text-align-last": "justify",
//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);
//if (d.elementID == "alive") {
// tabletpaper.append( $(alive).append(yang).append(content).append(bi));
//} else {
tabletpaper.append(content);
//}
html = "";
alive = "";
yang = "";
@@ -366,263 +352,24 @@
})
let pageStyle = `<style id="pageStyle">
self.pageStyle = `<style id="pageStyle">
{
-webkit-print-color-adjust: exact !important;
print-color-adjust: exact !important;
color-adjust: exact !important;
}
.vertical-text {
writing-mode: vertical-rl !important;
-webkit-writing-mode: vertical-rl !important;
text-orientation: mixed !important;
}
@media print{
:host {
width:auto !important;
height:auto !important;
}
@page {
size:${pageSize.width}mm 393mm !important;
margin:0;
}
}
</style>
`
console.log("pageSize:",pageSize);
$("#pageStyle").remove();
$("head").append(pageStyle);
$(canvas).append(tabletpaper);
$(canvas).css("width", printSize.width + "mm");
$(canvas).css("height", printSize.height + "mm");
$(canvas).css("justify-content", "center");
$("#printArea").append(canvas);
//this.bindKeyEvent();
});
$(".tablet-element").draggable({
start(e, ui) {
//console.log("gogogogo");
},
stop(e, ui) {
//console.log(ui.position.left, ui.position.top);
}
});
$(".tablet-element").on("click", function (e) {
e.preventDefault();
self.selected = $(this);
let fontSize = $(this).css("fontSize");
let fontFamily = $(this).css("fontFamily");
let left = $(this).css("left");
let top = $(this).css("top");
});
$(".tablet-element").on("contextmenu", function (e) {
e.preventDefault();
self.selected = $(this);
let fontSize = $(this).css("font-size");
let fontFamily = $(this).css("font-family");
console.log($(this).css("font-size"));
let textWidth = $(this).find("span").first().css("width");
let left = $(this).css("left");
let top = $(this).css("top");
$("#customMenu").css({
top: e.pageY + "px",
left: (e.pageX + 30) + "px"
});
left = left.replace("px", "");
top = top.replace("px", "");
$("#textX").val(self.fix2(left * 0.265));
$("#textY").val(self.fix2(top * 0.265));
$("#fontSize").val(fontSize);
$("#textWidth").val(textWidth);
$("#customMenu").show();
});
},
fix2(val) {
return Number.parseFloat(val).toFixed(2);
},
renderLiveList(names, el) {
let $namelist = $(`<div class='liveList'></div>`).css({
"writing-mode": "vertical rl",
display: "flex",
"flex-direction": "row",
"flex-wrap": "wrap",
margin: "auto",
width: `${el.width}px`,
height: `${el.height}px`,
border: "0px solid #ccc",
padding: "1px",
"font-family": el.fontFamily,
"letter-spacing": "0.1em",
"column-gap": "1px",
"row-gap": "1px",
"align-items": "center",
});
let self = this;
//$namelist.append("陽上");
names.forEach(n => {
$namelist.append(self.renderLiveSpan(n, el))
})
//$namelist.append("拜薦");
return $namelist;
},
renderLiveSpan(name, el) {
return $(`<span>${name}</span>`).css({
display: "block",
"min-height": `${el.textHeight}px`,
"max-height": `${el.height}px`,
width: `${el.textWidth}px`,
height: `${el.textHeight}px`,
"text-align": "justify",
"text-align-last": "justify",
"margin-bottom": "15px",
//"margin-left": "5px",
"text-justify": "inter-character",
});
},
getTextInfo(text,font) {
const canvas = document.createElement("canvas");
const context = canvas.getContext("2d");
context.font = font;
const metrics = context.measureText(text);
return metrics
},
getTextWidth(text,font) {
const canvas = document.createElement("canvas");
const context = canvas.getContext("2d");
context.font = font;
const metrics = context.measureText(text);
return metrics;
},
getTextSize(txt, fontsize) {
let span = document.createElement("span");
span.style.visibility = "hidden";
span.style.position = "absolute";
span.style.fontSize = fontsize + "px";
span.style.fontFamily = "";
span.innerText = txt;
document.body.appendChild(span);
let result = {
width: span.offsetWidth,
height: span.offsetHeight
}
//console.log("result:",result);
document.body.removeChild(span);
return result;
},
scaleFontSize(txtContent, fontSize,elementWidth) {
let font = this.getTextSize("講", parseInt(fontSize));
console.log("scaleFontSize:", fontSize, " A:", font, " B:", Math.ceil((txtContent.length) / 2), " C:", font.width, elementWidth, (Math.ceil(txtContent.length / 2) * font.width)*2)
//console.log(newFontSize, newTxtWidth)
//自動判斷縮小字型的規則,要同時縮小間距
// console.log("A:", dStyle, dStyle.fontSize)
//if (dStyle.elementID === 'title1') {//表示是一般正名，也就是牌位正中間的一般格式，排法是上下上下
if ((Math.ceil(txtContent.length / 2) * font.width)*2 > parseFloat(elementWidth)) {
let newfontSize = parseInt(fontSize) - 1;
//console.log("newfontSize:",newfontSize)
return this.scaleFontSize(txtContent, newfontSize,elementWidth);
}
//}
//console.log(txtContent,style,dStyle)
//console.log(newFontSize,newTxtWidth)
return fontSize;
},
breakWord(txtContent, style, dStyle) {
//自動判斷斷字
//1. by 特定字 2.by長度
},
async changeLocation() {
$(this.selected).css("left", $("#textX").val() + "mm");
$(this.selected).css("top", $("#textY").val() + "mm");
},
async changeSize() {
$(this.selected).css("font-size", $("#fontSize").val())
},
async changeWidth() {
let nameList = $(this.selected).find(".nameList").first();
if (nameList) {
let spans = $(nameList).find("span");
if (spans) {
spans.each(function (index, x) {
$(x).css("width", $("#textWidth").val())
});
}
}
let liveList = $(this.selected).find(".liveList").first();
if (liveList) {
let spans = $(liveList).find("span");
if (spans) {
spans.each(function (index, x) {
$(x).css("width", $("#textWidth").val())
});
}
}
},
print() {
//setTimeout(() => { window.print(); }, 1000);
//let s = this.allStyle.find(x => x.styleID == this.style)
//let size = this.allSize.find(x => x.paperID == s.paperSize)
let pageSize = this.allSize.find(x => x.paperID == $("#paperSizeSel").val());
let printSize = this.allSize.find(x => x.paperID == $("#paperSizeSel").val());
//console.log("a:",pageSize," b:",printSize);
let w = window.open('', '_blank');
if (!w) {
alert("請允許瀏覽器開啟彈出式視窗！");
return;
}
// 1. 抓取您原本網頁定義的 HTTP_HOST (您的全域變數)，如果沒有則抓取當前網址
let hostUrl = typeof this.http_host !== 'undefined' ? this.http_host : (window.location.protocol + "//" + window.location.host);
if (!hostUrl.endsWith('/')) hostUrl += '/';
// 2. 抓出畫布完整的 HTML
let canvasHtml = $("#printArea").html();
// 3. 【關鍵修復】把所有的 "../../" 替換成完整的網址，解決底圖破圖問題！
canvasHtml = canvasHtml.replace(/\.\.\/\.\.\//g, hostUrl);
// 4. 組合列印視窗的 HTML
let htmlContent = `
<!DOCTYPE html>
<html>
<head>
<title>預覽列印 - 牌位設計</title>
<meta charset="utf-8">
<style>
/* 基礎變數與強制背景列印 */
* {
-webkit-print-color-adjust: exact !important;
print-color-adjust: exact !important;
color-adjust: exact !important;
}
/* 螢幕預覽樣式 */
@media screen {
body {
background-color: #525659;
display: flex;
flex-direction: column;
align-items: center;
padding: 20px 0;
}
#printArea {
width: auto !important;
height: auto !important; /* 移除 100vh 限制 */
}
.tablet-paper {
margin-bottom: 30px;
box-shadow: 0 0 10px rgba(0,0,0,0.5);
background-color: white;
text-align:justify;
}
}
/* 關鍵：修正 Ctrl+P 空白問題 */
@media print {
@page {
size: ${printSize.width}mm 393mm !important;
size:${pageSize.width}mm ${pageSize.height}mm !important;
margin:0;
}
html, body, form, .full-home, #printArea, .canvas-area {
@@ -633,6 +380,11 @@
padding: 0 !important;
display: block !important;
}
.no-print, #customMenu {
display: none !important;
}
.canvas-area{
display:flex !important;
flex-direction: row !important;
@@ -655,19 +407,8 @@
position: absolute !important;
white-space: normal;
color: black !important; /* 確保文字是黑色的 */
}
}
/* 【修復排版沒照設定】覆寫原本 HTML 裡的 fixed，並防止 Bootstrap 洗掉 absolute */
.tablet-paper {
width: var(--page-w);
height: var(--page-h);
}
.vertical-text {
writing-mode: vertical-rl !important;
-webkit-writing-mode: vertical-rl !important;
text-orientation: mixed !important;
}
/* 名單金字塔佈局容器 */
@@ -714,10 +455,6 @@
print-color-adjust: exact !important;
color-adjust: exact !important;
}
.ancestor-wrapper {
/* 重置為橫向流，這樣 column 才會是真正的上下堆疊 */
writing-mode: horizontal-tb;
@@ -741,7 +478,233 @@
writing-mode:vertical-rl
}
.canvas-area{
width: ${printSize.width}mm;
height: ${printSize.height}mm;
justify-content: center;
break-after: page;
page-break-after: always;
}
.tablet-paper{
background-color: white;
width: ${size.width}mm !important;
height: ${ size.height }mm !important;
position: relative;
margin-bottom: 0;
background-image: url(${ img.path });
background-size: 100% 100%;
break-after: page;
page-break-after: always;
}
.tablet-element {
cursor: move;
padding: 4px;
color: black !important; /* 強制墨水為黑色 */
border: 1px solid transparent;
transition: writing-mode 0.3s, transform 0.2s;
}
.tablet-element:hover { border-color: rgba(13, 110, 253, 0.3); }
.tablet-paper:last-child { page-break-after: auto; }
</style>
`
$("#pageStyle").remove();
$("head").append(self.pageStyle);
$(canvas).append(tabletpaper);
//$(canvas).css("width", printSize.width + "mm");
//$(canvas).css("height", printSize.height + "mm");
//$(canvas).css("justify-content", "center");
$("#printArea").append(canvas);
});
$(".tablet-element").draggable({
start(e, ui) {
//console.log("gogogogo");
},
stop(e, ui) {
//console.log(ui.position.left, ui.position.top);
}
});
$(".tablet-element").on("click", function (e) {
e.preventDefault();
self.selected = $(this);
let fontSize = $(this).css("fontSize");
let fontFamily = $(this).css("fontFamily");
let left = $(this).css("left");
let top = $(this).css("top");
});
$(".tablet-element").on("contextmenu", function (e) {
e.preventDefault();
self.selected = $(this);
let fontSize = $(this).css("font-size");
let fontFamily = $(this).css("font-family");
console.log($(this).css("font-size"));
let textWidth = $(this).find("span").first().css("width");
let left = $(this).css("left");
let top = $(this).css("top");
$("#customMenu").css({
top: e.pageY + "px",
left: (e.pageX + 30) + "px"
});
left = left.replace("px", "");
top = top.replace("px", "");
$("#textX").val(self.fix2(left * 0.265));
$("#textY").val(self.fix2(top * 0.265));
$("#fontSize").val(fontSize);
$("#textWidth").val(textWidth);
$("#customMenu").show();
});
},
fix2(val) {
return Number.parseFloat(val).toFixed(2);
},
renderLiveList(names, el) {
let $namelist = $(`<div class='liveList'></div>`).css({
"writing-mode": "vertical rl",
display: "flex",
"flex-direction": "row",
"flex-wrap": "wrap",
margin: "auto",
width: `${el.width}px`,
height: `${el.height}px`,
border: "0px solid #ccc",
padding: "1px",
"font-family": el.fontFamily,
"letter-spacing": "0.1em",
"column-gap": "1px",
"row-gap": "1px",
"align-items": "center",
});
let self = this;
names.forEach(n => {
$namelist.append(self.renderLiveSpan(n, el))
})
return $namelist;
},
renderLiveSpan(name, el) {
return $(`<span>${name}</span>`).css({
display: "block",
"min-height": `${el.textHeight}px`,
"max-height": `${el.height}px`,
width: `${el.textWidth}px`,
height: `${el.textHeight}px`,
"text-align": "justify",
"text-align-last": "justify",
"margin-bottom": "15px",
"text-justify": "inter-character",
});
},
getTextInfo(text,font) {
const canvas = document.createElement("canvas");
const context = canvas.getContext("2d");
context.font = font;
const metrics = context.measureText(text);
return metrics
},
getTextWidth(text,font) {
const canvas = document.createElement("canvas");
const context = canvas.getContext("2d");
context.font = font;
const metrics = context.measureText(text);
return metrics;
},
getTextSize(txt, fontsize) {
let span = document.createElement("span");
span.style.visibility = "hidden";
span.style.position = "absolute";
span.style.fontSize = fontsize + "px";
span.style.fontFamily = "";
span.innerText = txt;
document.body.appendChild(span);
let result = {
width: span.offsetWidth,
height: span.offsetHeight
}
document.body.removeChild(span);
return result;
},
scaleFontSize(txtContent, fontSize,elementWidth) {
let font = this.getTextSize("講", parseInt(fontSize));
//自動判斷縮小字型的規則,要同時縮小間距
//if (dStyle.elementID === 'title1') {//表示是一般正名，也就是牌位正中間的一般格式，排法是上下上下
if ((Math.ceil(txtContent.length / 2) * font.width)*2 > parseFloat(elementWidth)) {
let newfontSize = parseInt(fontSize) - 1;
//console.log("newfontSize:",newfontSize)
return this.scaleFontSize(txtContent, newfontSize,elementWidth);
}
return fontSize;
},
breakWord(txtContent, style, dStyle) {
//自動判斷斷字
//1. by 特定字 2.by長度
},
async changeLocation() {
$(this.selected).css("left", $("#textX").val() + "mm");
$(this.selected).css("top", $("#textY").val() + "mm");
},
async changeSize() {
$(this.selected).css("font-size", $("#fontSize").val())
},
async changeWidth() {
let nameList = $(this.selected).find(".nameList").first();
if (nameList) {
let spans = $(nameList).find("span");
if (spans) {
spans.each(function (index, x) {
$(x).css("width", $("#textWidth").val())
});
}
}
let liveList = $(this.selected).find(".liveList").first();
if (liveList) {
let spans = $(liveList).find("span");
if (spans) {
spans.each(function (index, x) {
$(x).css("width", $("#textWidth").val())
});
}
}
},
print() {
//let pageSize = this.allSize.find(x => x.paperID == $("#paperSizeSel").val());
//let printSize = this.allSize.find(x => x.paperID == $("#paperSizeSel").val());
//console.log("a:",pageSize," b:",printSize);
let w = window.open('', '_blank');
if (!w) {
alert("請允許瀏覽器開啟彈出式視窗！");
return;
}
// 1. 抓取您原本網頁定義的 HTTP_HOST (您的全域變數)，如果沒有則抓取當前網址
let hostUrl = typeof this.http_host !== 'undefined' ? this.http_host : (window.location.protocol + "//" + window.location.host);
if (!hostUrl.endsWith('/')) hostUrl += '/';
// 2. 抓出畫布完整的 HTML
let canvasHtml = $("#printArea").html();
// 3. 【關鍵修復】把所有的 "../../" 替換成完整的網址，解決底圖破圖問題！
canvasHtml = canvasHtml.replace(/\.\.\/\.\.\//g, hostUrl);
// 4. 組合列印視窗的 HTML
let htmlContent = `
<!DOCTYPE html>
<html>
<head>
<title>預覽列印 - 牌位設計</title>
<meta charset="utf-8">
${this.pageStyle}
</head>
<body>
${canvasHtml}
@@ -758,28 +721,6 @@
w.print();
}, 1200);
},
//bindKeyEvent() {
// let element = document.querySelectorAll(".tablet-element");
// element.forEach(y => {
// console.log("QQ:",y);
// $(y).on("keydown", (e) => {
// console.log(e.key);
// e.preventDefault();
// let top = parseInt(y.style.top);
// let left = parseInt(y.style.left);
// switch (e.key) {
// case 'ArrowUp': top = top - 10; break;
// case 'ArrowDown': top = top + 10; break;
// case 'ArrowLeft': left = left - 10; break;
// case 'ArrowRight': left = left + 10; break;
// }
// y.style.top = top + 'px';
// y.style.left = left + 'px';
// })
// })
//}
}
$(document).click(function (e) {
if (!$("#customMenu").is(e.target) && $("#customMenu").has(e.target).length === 0) {

37
web/admin/print/tablet_edit/editornew.html
View File

@@ -80,7 +80,7 @@
top: -2px;
}
.equal-card {
min-height: 260px;
min-height: 280px;
}
.checkbox-narrow {
min-width: 32px;
@@ -402,6 +402,8 @@
selected: {
style:""
},
actitem: "",
pageSize:"",
isAllSelected: false,
dialog: false,
addDialog: false, // 新增項目對話框
@@ -440,6 +442,12 @@
}
},
deep: true
},
actitem: {
handler() {
this.getActItem();
},
deep: true
}
},
computed: {
@@ -524,6 +532,9 @@
} else {
this.selected.style = "";
}
this.actitem = receivedData.tabletItem.actitem_num_selected.val;
console.log("actitem:",receivedData.tabletItem.actitem_num_selected.val);
// 處理 f_num_tablet 資料
if (this.tabletItem.f_num_tablet) {
try {
@@ -570,11 +581,26 @@
}
}
//this.getActItem();
});
this.getStyle();
},
methods: {
getActItem() {
axios
.post('/api/tablet/GetActItem', { itemNum: this.actitem })
.then(response => {
console.log(response);
if (response.data.result == "Y" && response.data.data) {
this.pageSize = response.data.data.pageSize;
this.getStyle();
}
}
);
},
getStyle() {
axios
.post('/api/tablet/GetStyleData', {}, {})
@@ -583,14 +609,13 @@
if (response.data.data) {
response.data.data.forEach(x => {
if (x.styleID != "000001") {
console.log(this.pageSize, x.paperSize);
if (this.pageSize&&this.pageSize==x.paperSize) {
this.code.style.push(x)
}
}
})
}
//this.code.style = response.data.data;
//this.detail_table.list = response.data.list
//this.detail_table.count = response.data.count;
//this.detail_table.loading = false
})
.catch(error => console.log(error))
},