home *** CD-ROM | disk | FTP | other *** search
/ 61.19.244.139 / 61.19.244.139.zip / 61.19.244.139 / 2015-03-03 / views / comm-agent-setup.jsp < prev    next >
Text File  |  2015-03-03  |  12KB  |  391 lines

  1.  
  2. <%@ taglib uri="http://tiles.apache.org/tags-tiles" prefix="tiles"%>
  3.  
  4. <tiles:insertDefinition name="defaultTemplate">
  5.     <tiles:putAttribute name="body">
  6.         <ul class="breadcrumb">
  7.             <li><a href="#">α╕½α╕Öα╣ëα╕▓α╕½α╕Ñα╕▒α╕ü</a><span class="divider">»</span></li>
  8.             <li class="active">α╕üα╕│α╕½α╕Öα╕öα╕úα╕▓α╕óα╕Ñα╕░α╣Çα╕¡α╕╡α╕óα╕öα╕üα╕│α╣Çα╕½α╕Öα╣çα╕ê</li>
  9.         </ul>
  10.  
  11.  
  12.  
  13.         <div class="row-fluid">
  14.  
  15.              <div class="span12 ">
  16.                     <div class=" widget-block">
  17.                         <div class="widget-head">
  18.                             <h5>
  19.                                 <i class="black-icons  documents"></i>  α╕òα╕▒α╕ºα╣üα╕ùα╕Öα╕Öα╕▓α╕óα╕½α╕Öα╣ëα╕▓
  20.                             </h5>
  21.                         </div>
  22.                         <div class="widget-content">
  23.  
  24.                             <div class="widget-searchbox">
  25.  
  26.                                 <ul>
  27.                                     <li class="row-counts"><a class="btn btn-success" id="addBtn" href="#frm-box"> <i class="icon-plus icon-white"></i> α╣Çα╕₧α╕┤α╣êα╕í
  28.                                     </a> <a class="btn btn-primary" id="editBtn"> <i class="icon-pencil icon-white"></i> α╣üα╕üα╣ëα╣äα╕é
  29.                                     </a> <a class="btn  btn-danger" id="delBtn"> <i class="icon-trash icon-white"></i> α╕Ñα╕Ü
  30.                                     </a></li>
  31.                                     <li class="right">
  32.                                         <form>
  33.                                             <fieldset>
  34.  
  35.                                                 <div class="control-group">
  36.                                                     <div class="controls">
  37.                                                         <input class="input-small" type="text" id="agentIdStart" name="agentIdStart" placeholder="α╕úα╕½α╕▒α╕¬ α╕òα╕▒α╕ºα╣üα╕ùα╕Ö"> - <input id="agentIdEnd" name="agentIdEnd" class="input-small"
  38.                                                             type="text" placeholder="α╕úα╕½α╕▒α╕¬ α╕òα╕▒α╕ºα╣üα╕ùα╕Ö"> <a class="btn btn-info" id="btSearch"  > <i class="icon-search icon-white"></i> α╕äα╣ëα╕Öα╕½α╕▓
  39.                                                         </a>
  40.                                                     </div>
  41.                                                 </div>
  42.  
  43.                                             </fieldset>
  44.                                         </form>
  45.                                     </li>
  46.                                 </ul>
  47.                             </div>
  48.                             <div class="widget-box">
  49.                                 <div align="center" id='jqgrid'>
  50.                                     <table id='grid'></table>
  51.                                     <div id='pager'></div>
  52.                                 </div>
  53.  
  54.  
  55.                             </div>
  56.  
  57.                         </div>
  58.                     </div>
  59.                 </div>
  60.             </div>
  61.  
  62. <div id="frm-box" class="frm-popup span8">
  63.             <a href="#" class="close"><img src="img/close_pop.png" class="btn_close" title="Close Window" alt="Close" /></a>
  64.             <form class="form-horizontal well">
  65. <div class="row-fluid">
  66.             <div class="span12">
  67.                 <div class="nonboxy-widget">
  68.  
  69.                     <div class="widget-head">
  70.                         <h5>α╕üα╕│α╕½α╕Öα╕öα╕úα╕▓α╕óα╕Ñα╕░α╣Çα╕¡α╕╡α╕óα╕öα╕òα╕▒α╕ºα╣üα╕ùα╕Ö</h5>
  71.                     </div>
  72.  
  73.                     <div class="widget-content">
  74.                         <div class="widget-box">
  75.                             
  76.                                 <fieldset>
  77.  
  78.                                     <div class="box-tab">
  79.                                         <div class="tabbable">
  80.                                             <ul class="nav nav-tabs">
  81.                                                 <li class="active"><a data-toggle="tab" href="#tab1"><i
  82.                                                         class="black-icons blocks_images"></i> α╕úα╕▓α╕▓α╕óα╕Ñα╕░α╣Çα╕¡α╕╡α╕óα╕öα╕òα╕▒α╕ºα╣üα╕ùα╕Ö</a></li>
  83.                                                 <li><a data-toggle="tab" href="#tab2"><i
  84.                                                         class="black-icons blocks_images"></i> PACKAGES</a></li>
  85.                                                 <li class=""><a data-toggle="tab" href="#tab3"><i
  86.                                                         class="black-icons abacus"></i> α╕úα╕½α╕▒α╕¬α╕úα╕ûα╕óα╕Öα╕òα╣î</a></li>
  87.  
  88.  
  89.                                             </ul>
  90.  
  91.                                             <div class="tab-content">
  92.  
  93.                                                 <!-- Tab1 -->
  94.                                                 <div id="tab1" class="tab-pane active">
  95.                                                     <div class=" row-fluid">
  96.  
  97.                                                         <div class="control-group">
  98.                                                             <label class="control-label" for="input01">α╕òα╕▒α╕ºα╣üα╕ùα╕Ö</label>
  99.                                                             <div class="controls">
  100.                                                                 <input class="input-small" type="text"
  101.                                                                     placeholder="α╕úα╕½α╕▒α╕¬α╕òα╕▒α╕ºα╣üα╕ùα╕Ö"> <input
  102.                                                                     class="input-xlarge" type="text"
  103.                                                                     placeholder="α╕èα╕╖α╣êα╕¡α╕òα╕▒α╕ºα╣üα╕ùα╕Ö">
  104.                                                             </div>
  105.                                                         </div>
  106.  
  107.  
  108.  
  109.  
  110.                                                         <div class="control-group">
  111.                                                             <label class="control-label" for="input02">α╕¢α╕úα╕░α╕üα╕▒α╕Öα╕áα╕▒α╕ó</label>
  112.                                                             <div class="controls multiline-input">
  113.  
  114.  
  115.                                                                 <select class="span2">
  116.                                                                     <option>1</option>
  117.                                                                     <option>2</option>
  118.                                                                     <option>3</option>
  119.                                                                     <option>4</option>
  120.                                                                     <option>5</option>
  121.                                                                 </select>
  122.  
  123.                                                             </div>
  124.  
  125.                                                         </div>
  126.                                                         <div class="control-group">
  127.                                                             <label class="control-label" for="input02">α╕¡α╕▒α╕òα╕úα╕▓α╕äα╣êα╕▓α╕Öα╕▓α╕óα╕½α╕Öα╣ëα╕▓α╕ùα╕╡α╣êα╣äα╕öα╣ëα╕úα╕▒α╕Ü</label>
  128.                                                             <div class="controls">
  129.  
  130.                                                                 <input class="input-small" type="text"
  131.                                                                     placeholder="α╕ùα╕╡α╣êα╣äα╕öα╣ëα╕úα╕▒α╕Ü">
  132.                                                             </div>
  133.                                                         </div>
  134.                                                         <div class="control-group">
  135.  
  136.                                                             <label class="control-label" for="input02">α╕¡α╕▒α╕òα╕úα╕▓α╕äα╣êα╕▓α╕Öα╕▓α╕óα╕½α╕Öα╣ëα╕▓α╣âα╕½α╣ëα╕½α╕▒α╕ºα╕½α╕Öα╣ëα╕▓</label>
  137.                                                             <div class="controls">
  138.  
  139.                                                                 <input class="input-small" type="text"
  140.                                                                     placeholder="α╣âα╕½α╣ëα╕½α╕Öα╕▒α╕ºα╕½α╕Öα╣ëα╕▓α╕ùα╕╡α╕í">
  141.                                                             </div>
  142.                                                         </div>
  143.  
  144.  
  145.  
  146.  
  147.  
  148.                                                     </div>
  149.  
  150.                                                 </div>
  151.                                                 <!-- end tab1 -->
  152.  
  153.  
  154.                                                 <div id="tab2" class="tab-pane">
  155.                                                     <div class=" row-fluid">
  156.  
  157.                                                         <div role="grid" class="dataTables_wrapper">
  158.                                                             <div class="table_top clearfix"></div>
  159.  
  160.                                                             <div class="table_content">
  161.  
  162.                                                                 <table
  163.                                                                     class="data-tbl-striped table table-striped table-bordered dataTable">
  164.                                                                     <thead>
  165.                                                                         <tr role="row">
  166.                                                                             <th class="sorting_disabled" role="columnheader"
  167.                                                                                 rowspan="1" colspan="1" style="width: 100px;">
  168.                                                                                 PACKAGE</th>
  169.  
  170.                                                                             <th class="   " role="columnheader" rowspan="1"
  171.                                                                                 colspan="1" style="width: 87px;">α╕éα╕Öα╕▓α╕öα╕úα╕ûα╕óα╕Öα╕òα╣î</th>
  172.                                                                             <th class="   " role="columnheader" rowspan="1"
  173.                                                                                 colspan="1" style="width: 87px;">
  174.                                                                                 α╕¡α╕▒α╕òα╕úα╕▓α╕äα╣êα╕▓α╕Öα╕▓α╕óα╕½α╕Öα╣ëα╕▓</th>
  175.                                                                             <th class="   " role="columnheader" rowspan="1"
  176.                                                                                 colspan="1" style="width: 153px;">α╕¡α╕▒α╕òα╕úα╕▓α╕äα╣êα╕▓α╕Öα╕▓α╕óα╕½α╕Öα╣ëα╕▓α╕½α╕▒α╕ºα╕½α╕Öα╣ëα╕▓α╕ùα╕╡α╕í</th>
  177.  
  178.  
  179.                                                                         </tr>
  180.                                                                     </thead>
  181.  
  182.  
  183.                                                                     <tbody role="alert" aria-live="polite"
  184.                                                                         aria-relevant="all">
  185.                                                                         <tr class="odd">
  186.  
  187.                                                                             <td class="  sorting_1"><input type="checkbox" /></td>
  188.                                                                             <td class=" ">PACKAGE 1</td>
  189.                                                                             <td class="center ">xxx</td>
  190.                                                                             <td class="center ">xxx</td>
  191.  
  192.  
  193.                                                                         </tr>
  194.                                                                         <tr class="odd">
  195.  
  196.                                                                             <td class="  sorting_1"><input type="checkbox" /></td>
  197.                                                                             <td class=" ">PACKAGE 2</td>
  198.                                                                             <td class="center ">xxx</td>
  199.                                                                             <td class="center ">xxx</td>
  200.  
  201.  
  202.                                                                         </tr>
  203.                                                                     </tbody>
  204.                                                                 </table>
  205.  
  206.                                                             </div>
  207.                                                         </div>
  208.  
  209.                                                     </div>
  210.  
  211.                                                 </div>
  212.                                                 <!-- end Tab  2 -->
  213.  
  214.                                                 <div id="tab3" class="tab-pane">
  215.                                                     <div class=" row-fluid">
  216.  
  217.  
  218.                                                         <div role="grid" class="dataTables_wrapper">
  219.                                                             <div class="table_top clearfix"></div>
  220.  
  221.                                                             <div class="table_content">
  222.  
  223.                                                                 <table
  224.                                                                     class="data-tbl-striped table table-striped table-bordered dataTable">
  225.                                                                     <thead>
  226.                                                                         <tr role="row">
  227.                                                                             <th class="sorting_disabled" role="columnheader"
  228.                                                                                 rowspan="1" colspan="1" style="width: 100px;">
  229.                                                                                 α╣Çα╕Ñα╕╖α╕¡α╕ü</th>
  230.                                                                             <th class=" " role="columnheader" rowspan="1"
  231.                                                                                 colspan="1" style="width: 87px;">α╕úα╕½α╕▒α╕¬α╕úα╕ûα╕óα╕Öα╕òα╣î</th>
  232.                                                                             <th class="   " role="columnheader" rowspan="1"
  233.                                                                                 colspan="1" style="width: 87px;">α╕éα╕Öα╕▓α╕öα╕úα╕ûα╕óα╕Öα╕òα╣î</th>
  234.                                                                             <th class="   " role="columnheader" rowspan="1"
  235.                                                                                 colspan="1" style="width: 87px;">
  236.                                                                                 α╕¡α╕▒α╕òα╕úα╕▓α╕äα╣êα╕▓α╕Öα╕▓α╕óα╕½α╕Öα╣ëα╕▓</th>
  237.                                                                             <th class="   " role="columnheader" rowspan="1"
  238.                                                                                 colspan="1" style="width: 153px;">α╕¡α╕▒α╕òα╕úα╕▓α╕äα╣êα╕▓α╕Öα╕▓α╕óα╕½α╕Öα╣ëα╕▓α╕½α╕▒α╕ºα╕½α╕Öα╣ëα╕▓α╕ùα╕╡α╕í</th>
  239.  
  240.  
  241.                                                                         </tr>
  242.                                                                     </thead>
  243.  
  244.  
  245.                                                                     <tbody role="alert" aria-live="polite"
  246.                                                                         aria-relevant="all">
  247.                                                                         <tr class="odd">
  248.  
  249.                                                                             <td class="  sorting_1"><input type="checkbox" /></td>
  250.                                                                             <td class=" ">100</td>
  251.                                                                             <td class="center ">xxx</td>
  252.                                                                             <td class="center ">xxx</td>
  253.                                                                             <td class="center ">xxx</td>
  254.  
  255.  
  256.                                                                         </tr>
  257.                                                                         <tr class="odd">
  258.  
  259.                                                                             <td class="  sorting_1"><input type="checkbox" /></td>
  260.                                                                             <td class=" ">101</td>
  261.                                                                             <td class="center ">xxx</td>
  262.                                                                             <td class="center ">xxx</td>
  263.                                                                             <td class="center ">xxx</td>
  264.  
  265.  
  266.                                                                         </tr>
  267.                                                                     </tbody>
  268.                                                                 </table>
  269.  
  270.                                                             </div>
  271.                                                         </div>
  272.  
  273.  
  274.                                                     </div>
  275.  
  276.                                                 </div>
  277.                                                 <!-- end Tab  3 -->
  278.  
  279.  
  280.                                             </div>
  281.  
  282.                                         </div>
  283.                                     </div>
  284.                                     <!-- Eng Tab box -->
  285.  
  286.                                     <button class="btn btn-success">α╕Üα╕▒α╕Öα╕ùα╕╢α╕ü</button>
  287.                                     <button class="btn">α╕óα╕üα╣Çα╕Ñα╕┤α╕ü</button>
  288.  
  289.  
  290.                                 </fieldset>
  291.                             
  292.                         </div>
  293.                     </div>
  294.                 </div>
  295.             </div>
  296.         </div></form></div>
  297.  
  298.  
  299.     </tiles:putAttribute>
  300.     
  301.     <tiles:putAttribute name="customScript">
  302.         <script>
  303.         $(function() {
  304.         
  305.         
  306.     $('#btSearch').click(function() {
  307.                 // alert( $('#agentIdStart').val() +'-'+$('#agentIdEnd').val());
  308.  
  309.                 var f = {
  310.                     groupOp : "AND",
  311.                     rules : []
  312.                 };
  313.                 f.rules.push({
  314.                     field : "agentIdStart",
  315.                     op : "cn",
  316.                     data : $('#agentIdStart').val()
  317.                 });
  318.                 f.rules.push({
  319.                     field : "agentIdEnd",
  320.                     op : "cn",
  321.                     data : $('#agentIdEnd').val()
  322.                 });
  323.                 var grid = $('#grid');
  324.                 grid[0].p.search = f.rules.length > 0;
  325.                 $.extend(grid[0].p.postData, {
  326.                     filters : JSON.stringify(f)
  327.                 });
  328.                 grid.trigger("reloadGrid", [ {
  329.                     page : 1
  330.                 } ]);
  331.             });
  332.  
  333.     
  334.     
  335.         }); 
  336.  
  337.     
  338.         //box
  339.         $(document).ready(function() {
  340.  
  341.             var enforceModalFocusFn = $.fn.modal.Constructor.prototype.enforceFocus;
  342.             $.fn.modal.Constructor.prototype.enforceFocus = function() {
  343.             };
  344.  
  345.             $('#addBtn').click(function() {
  346.  
  347.                 //Getting the variable's value from a link 
  348.                 var frmBox = $(this).attr('href');
  349.  
  350.                 //Fade in the Popup
  351.                 $(frmBox).fadeIn(300);
  352.  
  353.                 //Set the center alignment padding + border see css style
  354.                 var popMargTop = ($(frmBox).height() + 5) / 2;
  355.                 var popMargLeft = ($(frmBox).width() + 5) / 2;
  356.  
  357.                 $(frmBox).css({
  358.                     'margin-top' : -popMargTop,
  359.                     'margin-left' : -popMargLeft
  360.                 });
  361.  
  362.                 // Add the mask to body
  363.                 $('body').append('<div id="mask"></div>');
  364.                 $('#mask').fadeIn(100);
  365.                 return false;
  366.             });
  367.  
  368.             $('#delBtn').click(function() {
  369.                 var selr = $("#grid").jqGrid('getGridParam', 'selrow');
  370.                 if (selr && confirm("α╕óα╕╖α╕Öα╕óα╕▒α╕Öα╕üα╕▓α╕úα╕Ñα╕Üα╕éα╣ëα╕¡α╕íα╕╣α╕Ñ Package α╕úα╕½α╕▒α╕¬ " + selr))
  371.                     alert(selr);
  372.  
  373.             });
  374.  
  375.             // When clicking on the button close or the mask layer the popup closed
  376.             $('a.close, #mask').live('click', function() {
  377.                 $('#mask , .frm-popup').fadeOut(300, function() {
  378.                     $('#mask').remove();
  379.                 });
  380.                 $.fn.modal.Constructor.prototype.enforceFocus = enforceModalFocusFn;
  381.                 return false;
  382.             });});
  383.             function codeFormat(cellvalue, options, rowObject) {
  384.                 return '<span class="label label-success">' + cellvalue + '</span>';
  385.             }
  386.         
  387.             </script>
  388.     </tiles:putAttribute>
  389.     
  390.     
  391. </tiles:insertDefinition>