185 lines
7.2 KiB
Plaintext
185 lines
7.2 KiB
Plaintext
<%@ Page Language="C#" AutoEventWireup="true" CodeFile="print_multi_new.aspx.cs" Inherits="admin_print_print_multi_new" %>
|
|
|
|
<!DOCTYPE html>
|
|
|
|
<html xmlns="http://www.w3.org/1999/xhtml">
|
|
<head runat="server">
|
|
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
|
|
<title></title>
|
|
<link href="~/js/bootstrap5/bootstrap.min.css" rel="stylesheet" />
|
|
<%--<link href="~/js/fontawesome6/css/all.css" rel="stylesheet" />--%>
|
|
<link href="~/js/mdi-font/css/materialdesignicons.min.css" rel="stylesheet" />
|
|
<link href="~/js/vuetify_ez.css" rel="stylesheet" />
|
|
<link href="~/js/sweetalert2/sweetalert2.min.css" rel="stylesheet" />
|
|
|
|
<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" />
|
|
</head>
|
|
<body>
|
|
<form id="form1" runat="server">
|
|
<div id="printArea" style="width: 100vw; height: 100vh">
|
|
<div class="canvas-area flex-grow-1 overflow-auto d-flex flex-column align-items-center position-relative" id="canvas">
|
|
<%-- <div class="tablet-paper">
|
|
</div>--%>
|
|
</div>
|
|
</div>
|
|
</form>
|
|
</body>
|
|
<script src="<%=ResolveUrl("~/js/bootstrap5/js/bootstrap.bundle.min.js")%>"></script>
|
|
<script src="<%=ResolveUrl("~/js/jquery-4.0.0.min.js")%>"></script>
|
|
<script src="<%=ResolveUrl("~/js/vue.min.js")%>"></script>
|
|
<script src="<%=ResolveUrl("~/js/vuetify.min.js")%>"></script>
|
|
<script src="<%=ResolveUrl("~/js/axios.min.js")%>"></script>
|
|
<script src="<%=ResolveUrl("~/js/moment.min.js")%>"></script>
|
|
<script src="<%=ResolveUrl("~/js/sweetalert2/sweetalert2.all.min.js") %>"></script>
|
|
<script src="<%=ResolveUrl("~/admin/Templates/TBS5ADM001/js/Script.js")%>"></script>
|
|
<script src="<%=ResolveUrl("~/admin/item/jquery-ui/jquery-ui.min.js")%>"></script>
|
|
<script>
|
|
const Printer = {
|
|
http_host: "",
|
|
allStyle: [],
|
|
allSize: [],
|
|
allStyleDetails:[],
|
|
printData: [],
|
|
tabletElement: [],
|
|
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-2.svg" },
|
|
{ name: "紅2", path: "../../admin/print/html/tablet-2B.svg" }
|
|
],
|
|
async init() {
|
|
let HTTP_HOST = "<%=UrlHost()%>";
|
|
this.http_host = HTTP_HOST;
|
|
await Promise.all([
|
|
this.getPaperSize(),
|
|
this.getTabletElement(),
|
|
this.getTabletStyles(),
|
|
this.getAllStyleDetails()
|
|
]);
|
|
this.getData();
|
|
|
|
},
|
|
async getAllStyleDetails() {
|
|
await axios
|
|
.post(this.http_host + 'api/tablet/GetStyleDetailData', {})
|
|
.then(response => {
|
|
if (response.status == "200") {
|
|
let data = response.data;
|
|
if (data.result == "Y") {
|
|
let details = data.data;
|
|
this.allStyleDetails = details;
|
|
console.log(data.data);
|
|
}
|
|
}
|
|
}
|
|
);
|
|
},
|
|
async getPaperSize() {
|
|
let self = this
|
|
await axios
|
|
.post(this.http_host + 'api/tablet/GetPaperSize', {})
|
|
.then(response => {
|
|
//if (response.result=="Y") {
|
|
if (response.status == "200") {
|
|
let data = response.data;
|
|
this.allSize = data.data;
|
|
|
|
}
|
|
}
|
|
)
|
|
},
|
|
async getTabletElement() {
|
|
await axios
|
|
.post(this.http_host + 'api/tablet/GetTabletElement', {})
|
|
.then(response => {
|
|
//if (response.result=="Y") {
|
|
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")
|
|
let param = [];
|
|
let data = JSON.parse(list)
|
|
data.forEach(x => {
|
|
param.push({ order_no: x.order_no, num: x.num });
|
|
});
|
|
await axios
|
|
.post(this.http_host + 'api/orderdetail/GetDetailToPrint', { param: param })
|
|
.then(response => {
|
|
|
|
if (response.status == 200) {
|
|
this.printData = response.data;
|
|
|
|
this.render();
|
|
}
|
|
});
|
|
},
|
|
render() {
|
|
|
|
this.printData.forEach(x => {
|
|
|
|
let style = this.allStyle.find(y => y.style == x.styleID);
|
|
let size = this.allSize.find(y => y.paperID == style.paperSize);
|
|
|
|
let tabletpaper = $(` <div class="tablet-paper">
|
|
</div>`)
|
|
|
|
tabletpaper.css({
|
|
"background-color": "white",
|
|
width: size.width + 'mm',
|
|
height:size.height + 'mm',
|
|
position: "absolute",
|
|
|
|
"background-image": 'url("../../admin/print/html/tablet-2.svg")', 'background-size': '100% 100%',
|
|
});
|
|
let tablet = JSON.parse(x.f_num_tablet);
|
|
|
|
let mid_items = tablet.mid_items;
|
|
let left_items = tablet.left_items;
|
|
|
|
let details = this.allStyleDetails.filter(y => y.styleID == x.style);
|
|
console.log("QQ:",details,x.style);
|
|
details.forEach(d => {
|
|
if (d.isActive!="hidden") {
|
|
let content = $(`<div class="tablet-element vertical-text "></div>`)
|
|
.css({
|
|
position: "absolute", left: d.x + "mm", top: d.y + "mm", fontSize: d.fontSize + 'pt', fontFamily: d.fontFamily, "z-index": 9999, visibility: d.isActive
|
|
//position: "absolute", left: el.startX + "mm", top: el.startY + "mm", fontSize: el.fontSize + 'pt', fontFamily: el.fontFamily, "z-index": 9999, visibility: el.isActive
|
|
})
|
|
.html("測試");
|
|
tabletpaper.append(content);
|
|
}
|
|
console.log("tabletDetails:",d);
|
|
})
|
|
$("#canvas").append(tabletpaper);
|
|
|
|
});
|
|
}
|
|
}
|
|
|
|
$(() => Printer.init());
|
|
</script>
|
|
|
|
|
|
</html>
|