左右正名可選可輸入

web/admin/item/TabletDesigner.aspx

@@ -101,14 +101,14 @@
                 </select>
                 <label for="printMode" style="color: black">列印模式</label>
             </div>
-             <div class="form-floating mb-3">
+ <%--            <div class="form-floating mb-3">
                  <input type="number" id="rosterLimit" onchange="Designer.changeRosterLimit()" class="form-control form-control-sm mb-2">
                  <label class="small" for="rosterLimit" style="color: black;">正名上限</label>
              </div>
             <div class="form-floating mb-3">
                 <input type="number" id="perpage" class="form-control form-control-sm mb-2">
                 <label class="small" for="perpage" style="color: black;">每頁列印筆數</label>
-            </div>
+            </div>--%>
             <div class="row">
                 <div class="col-6">
                     <span class="btn btn-sm btn-outline-info w-100 mb-2" onclick="Designer.saveStyle()">存檔</span>
@@ -135,7 +135,7 @@
                 <label class="small" for="inp-size">字體大小 (pt)</label>
             </div>
 
-            <div class="row ">
+           <%-- <div class="row ">
                 <div class="col-6">
                     <div class="form-floating mb-3">
                         <input type="number" id="2offset" class="form-control form-control-sm mb-2">
@@ -163,7 +163,7 @@
                         <label class="small" for="breakLen">斷行字數</label>
                     </div>
                 </div>
-            </div>
+            </div>--%>
 
             <div class="row">
                 <div class="col-6">
@@ -210,7 +210,19 @@
         </div>
     </div>
 
-
+    <div class="position-fixed top-50 start-50 p-3" style="z-index: 10001" >
+        <div id="liveToast" class="toast hide " role="alert" aria-live="assertive" 
+             data-bs-delay="3000" aria-atomic="true" 
+             style="color:white;background-color:dimgray;opacity:1;font-size:24px;">
+            <div class="toast-header">
+                <strong class="me-auto">提示訊息</strong>
+                <button type="button" class="btn-close" data-bs-dismiss="toast" aria-label="Close"></button>
+            </div>
+            <div class="toast-body" id="toast_body">
+                
+            </div>
+        </div>
+    </div>
 
 </asp:Content>
 
@@ -235,6 +247,7 @@
             tabletElements: [
             ],
             orientation: "portrait",
+            toast:null,
             init() {
                 //$(".tablet-element").draggable({});
                 this.getPaperSize();
@@ -247,13 +260,17 @@
                     $("#backendInp").append("<option value='" + x.name + "'>" + x.name + "</option>")
                 });
                 $("#paperOrientation").html("<span>直向</span>")
+                this.toast = new bootstrap.Toast($('#liveToast'));
             },
             print() {
+                let self = this;
                 let s = this.allStyle.find(x => x.styleID == this.styleID)
                 let size = this.allSize.find(x => x.id = s.paperSize)
                 let w = window.open('', '_blank');
                 if (!w) {
-                    alert("請允許瀏覽器開啟彈出式視窗！");
+                
+                    $("#toast_body").html(`${"請允許瀏覽器開啟彈出式視窗！"}`)
+                    self.toast.show();
                     return;
                 }
 
@@ -586,7 +603,7 @@
                 if (paperSize == "newsize") {
                     $("#sizeDiv").attr("style", "display:");
                 } else {
-                    console.log("paperSize:", paperSize);
+                   // console.log("paperSize:", paperSize);
                     let size = this.allSize.find(x => x.id == paperSize)
                     $(".tablet-paper").css({
                         "background-color": "white",
@@ -607,7 +624,9 @@
                     .then(response => {
                         if (response.status == "200") {
                             if (response.data.result=="Y") {
-                                alert("ok");
+
+                                $("#toast_body").html(`${"ok"}`)
+                                self.toast.show();
                             }
                         }
                     });
@@ -1011,7 +1030,7 @@
                 })
             },
             async saveStyle() {
-
+                let self = this;
                 let detail = [
 
                 ];
@@ -1043,7 +1062,9 @@
                     .then(response => {
                         if (response.status == "200") {
                             if (response.data.result == "Y") {
-                                alert("ok");
+
+                                $("#toast_body").html(`${"ok！"}`)
+                                self.toast.show();
                             }
                         }
                     });