2026年9月23日 星期三

V60202P: 列印標籤 (標籤格式: 10cm*6cm) - HTML 版面配置 - 標籤預覽 - New

 目的: V60202P: 列印標籤 (標籤格式: 10cm*6cm )

處理說明: 1>div_列印:  標籤格式  
                      <div id='div_print_area'  style=’width=10cm;height=5.8cm;font-sizeL9pt;’ >
                  2>div_資料/分頁:   資料/分頁  高度比例
                       <div id = 'div_data'  style='width:100%;height:98%; margin-left: 3px'> 
                       <div id = 'div_break_page'  style='width:100%;height:2%; margin-left: 3px'> 
                  3>div_資料: tbl_1 (height:10%)
                                       tbl_2 (height:90%)
                                           -tbl_21(width:55%)  
                                           -tbl_22(width:45%)  
                 4> 預覽:  $("#div_print_area").printThis();
                 5>載入*.css(橫向/直向列印) 
                                $(Tmp_prn_div_Str).printThis({
                                          loadCSS: "../JsFunction/print_V60202P.css?v=@date",            
                                 });
                6>子畫面-預留 panel 放[預覽列印]  的html內容 BOM
                     以便將 div_print_area 送至 printThis() , 預覽列印







1>*.js
                  {  //純粹放[標籤預覽.html]用 , 所以高度很小
                        xtype: 'panel', id: 'sub_panel4', region: 'south', layout: 'vbox',
                        height:10,
                        //flex: 1,
                        items: [],
                    }


      //[列印標籤]鈕 
    function V60202P_OK() {

        //1>目前挑選資料
        var cur_recs = Ext.getCmp('sub_Grid').getSelectionModel().getSelection();
        if (cur_recs.length == 0) {
            mywarnalert("請先選擇資料");
            return;
        }        
        var cur_rec = cur_recs[0];
        var Tmp_MATNR = "", Tmp_PRNNO = "", Tmp_CHECKID = "", Tmp_CHECKID_ = "";
        var Tmp_MFGBATCH = "", Tmp_MFG_RCBATCH = "", Tmp_VFDAT = "";
        var Tmp_MIXTM = "", Tmp_MIXRATE = "", Tmp_WKTIMELIM = "";
        var Tmp_MIXID = "", Tmp_MIXID_ = "";
        Tmp_MATNR = nulltoStr(cur_rec.data['MATNR']).toString();
        Tmp_PRNNO = nulltoStr(cur_rec.data['PRNNO']).toString();
        Tmp_CHECKID = nulltoStr(cur_rec.data['CHECKID']).toString();
        Tmp_CHECKID_ = nulltoStr(cur_rec.data['CHECKID_']).toString();
        Tmp_MFGBATCH = nulltoStr(cur_rec.data['MFGBATCH']).toString();
        Tmp_MFG_RCBATCH = nulltoStr(cur_rec.data['MFG_RCBATCH']).toString();
        Tmp_VFDAT = nulltoStr(cur_rec.data['VFDAT']).toString();
        Tmp_MIXRATE = nulltoStr(cur_rec.data['MIXRATE']).toString();
        Tmp_WKTIMELIM = nulltoStr(cur_rec.data['WKTIMELIM']).toString();
        Tmp_MIXID = nulltoStr(cur_rec.data['MIXID']).toString();
        Tmp_MIXID_ = nulltoStr(cur_rec.data['MIXID_']).toString();
        //預覽列印的 HTML 內容
        /*
         <!DOCTYPE html>
<html>
<title>Online HTML Editor</title>
<head>
</head>
<body>
    <div id='print_area' style='width:10cm;height:6cm;border:3px solid yellow;font-size:8pt;'>
        <div id='my_div_1' >
            <table id='my_tbl_11' style='width:100%;' border=1 bordercolor='red'>
                <tr>
                    <th>膠漆料混合工作時限管制標簽
                    </th>
                </tr>
            </table> <!-- end of table id='my_tbl_11' -->
 <table id='my_tbl_12' style='width:100%;' border=2 bordercolor='blue'>
  <tr>
   <td style='width:55%;height:100%;'>
     <table id='my_tbl_121' style='width:100%;' border=0 bordercolor='blue' cellspacing=0>
        <tr><td>件號<br>Parts No:</td><td>16VE049011-11</td></tr>
        <tr><td>膠漆料申請調配序號<br>Adheslve/Paint mixed serial No:</td>
            <td>201912301543<br>611292<br>宋喜珍</td>
        </tr>
        <tr><td>製造批號<br>Batch No:</td><td>mkb-1</td></tr>
        <tr><td>接收批號<br>Receiving No:</td><td>recvb-1</td></tr>
      <tr><td>存儲限期<br>Shelf life:</td><td>2026/09/30</td></tr>
     </table> <!-- end of table id='my_tbl_122' -->
  </td> <!-- end of td style='width:60%;'> -->
  <td style='width:45%;'>
     <table id='my_tbl_122' style='width:100%;' border=0 bordercolor='green' cellspacing=0>
        <tr><td>混合時間<br>Mixing time:</td><td>30:20</td></tr>
        <tr><td>混合比例<br>Mixing Rate:</td><td>10:6</td></tr>
        <tr><td>工作時限<br>Working time limiaation:</td><td>2hr</td></tr>
        <tr><td>調合人員(簽章<br>Mixer(Stamp):</td><td></td></tr>
        <tr><td><br></td></tr>
        <tr><td><br></td></tr>
        <tr><td><br></td></tr>
        </tr>
     </table> <!-- end of table id='my_tbl_122' -->
  </td> <!-- end of td style='width:40%;'> -->
 </tr>
 </table>  <!-- end of table id='my_tbl_12' -->
        </div>
        <div class='display' id='break_page1' style='break-after:page'>
        </div>
    </div>  <!-- end of   <div id='print_area' style='border: 5px solid green;'> -->
</body>
</html>
         */
        try
        {
  var pub_print_area_Str1 = "<div id='div_print_area' style = 'width:10cm;height:5.8cm;border:1px solid black;font-size:9pt;' >  "
                + "<div id = 'div_data'  style='width:100%;height:98%; margin-left: 3px'>  "
                + "  <table id='tbl_1' style='width:100%;height:10%;' border=1 bordercolor= 'black'  cellspacing=0>  "
            + "      <tr><th>膠漆料混合工作時限管制標簽</th></tr>"
            + "  </table > <!--end of table id = 'my_tbl_1' --> "
                + "  <table id='tbl_2' style='width:100%;height:90%' border=1 bordercolo = 'black'  cellspacing=0>  "
            + "    <tr>  "
            + "     <td style = 'width:55%;' > "
            + "         <table id='tbl_21' style='width:100%;' border=0 bordercolor='black' cellspacing=0>  "
                + "            <tr><td >件號<br>Parts No:</td><td style = 'font-size:8pt;' >" + Tmp_MATNR + "</td></tr>  "
                + "            <tr><td >膠漆料申請調配序號<br>Adheslve/Paint mixed serial No:</td> "
            + "<td>" + Tmp_PRNNO + "<br>" + Tmp_CHECKID + "<br>" + Tmp_CHECKID_ + "</td></tr>"
                + "             <tr><td >製造批號<br>Batch No:</td><td>" + Tmp_MFGBATCH + "</td></tr>"
                + "            <tr><td >接收批號<br>Receiving No:</td><td>" + Tmp_MFG_RCBATCH + "</td></tr>"
                + "            <tr><td >存儲限期<br>Shelf life:</td><td>" + Tmp_VFDAT + "</td></tr>"
            + "         </table> <!-- end of table id='my_tbl_21' -->  "
            + "     </td> <!-- end of td style='width:55%;'> -->  "
            + "     <td style='width:45%;'>  "
            + "         <table id='tbl_22' style='width:100%;' border=0 bordercolor='black' cellspacing=0>  "
                + " <tr><td >混合時間<br>Mixing time:</td><td>" + Tmp_MIXTM + "</td></tr> "
                + " <tr><td >混合比例<br>Mixing Rate:</td><td>" + Tmp_MIXRATE + "</td></tr> "
                + " <tr><td >工作時限<br>Working time limiaation:</td><td>" + Tmp_WKTIMELIM + "</td></tr>"
                + " <tr><td >調合人員(簽章<br>Mixer(Stamp):</td><td>" + Tmp_MIXID + "<br>" + Tmp_MIXID_ + "</td></tr>"
            + "<tr><td><br></td></tr>"
            + "<tr><td><br></td></tr>"
            + "<tr><td><br></td></tr>"
            + "         </table> <!-- end of table id='tbl_22' --> "
            + "       </td> <!-- end of td style='width:45%;'> --> "
            + "      </tr> "
            + "  </table>  <!-- end of table id='tbl_2' -->  "
            + "  </div>  <!-- <div id = 'div_data' -->"
                + "   <div   id='div_break_page' style='break-after:page;width:100%;height:2%;'>  "
                + "   </div>   <!-- < div id = 'div_break_page' --> "
            + "</div>  <!-- end of   <div id='div_print_area' style='border: 5px solid black;'> -->  ";
            $("#div_print_area").remove();
            var Tmp_sub_panel4 = $('#sub_panel4');            
            Tmp_sub_panel4.append(pub_print_area_Str1);  

            // include print_V60202P.css  - 設定橫向列印  
            //- $('head').append(Tmp_Str)  --> 子畫面.header , 非預覽列印.視窗
            //必需用 printThis(loadCSS:) --> 才是預覽列印時.視窗 css
            //var Tmp_header_Str = "<link type='text/css' rel='stylesheet' href='../JsFunction/print_V60202P.css?v=@date' "
                //+ " media='print'>"
                ;
            //$('head').append(Tmp_Str);
            var Tmp_prn_div_Str = "#div_print_area";
            $(Tmp_prn_div_Str).printThis({

                //importCSS: false, // import parent page css  
                //importStyle: false, // import style tags        
               loadCSS: "../JsFunction/print_V60202P.css?v=@date", 
            });
               
        }  // end of try
        catch (e) {
            var Tmp_Str = "膠漆料管制標籤-查詢失敗!!<br>"
                + "件號(" + Tmp_MATNR + ")<br>"
                + "膠漆料申請調配序號(" + Tmp_PRNNO+")<br>"
                +"錯誤訊息:"+ e.message;
            mywarnalert(Tmp_Str);        
        }   //膠漆料管制標籤-查詢失敗
    }  //end of V60202P_OK


            


沒有留言:

張貼留言