API tools faq
paste
Advertisement
arijulianto

Calendar

arijulianto
Sep 20th, 2017
240
0
Never
Add comment
Not a member of Pastebin yet? Sign Up, it unlocks many cool features!
HTML 5 58.50 KB | None | 0 0
raw download clone embed print report
  1.  
  2. <!DOCTYPE html>
  3. <html lang="id">
  4. <head>
  5. <title>Bantal Guling Guest House</title>
  6. <meta charset="utf-8" />
  7. <meta http-equiv="X-UA-Compatible" content="IE=edge" />
  8. <meta name="viewport" content="width=device-width, initial-scale=1.0" />
  9. <link rel="shortcut icon" href="/hotel/favicon.png" />
  10. <script src="/hotel/js/jquery-1.8.3.min.js"></script>
  11. <script src="/hotel/js/plugins.validInput.js"></script>
  12.  <meta content="width=device-width, initial-scale=1, maximum-scale=1, user-scalable=no" name="viewport">
  13.   <link rel="stylesheet" href="http://192.168.1.132/hotel/css/bootstrap.min.css">
  14.   <link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/font-awesome/4.5.0/css/font-awesome.min.css">
  15.   <link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/ionicons/2.0.1/css/ionicons.min.css">
  16.   <link rel="stylesheet" href="http://192.168.1.132/hotel/css/AdminLTE.min.css">
  17.   <link rel="stylesheet" href="http://192.168.1.132/hotel/css/skins/_all-skins.min.css">
  18.   <link rel="stylesheet" href="http://192.168.1.132/hotel/css/datepicker3.css">
  19. <link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/jqueryui/1.12.1/jquery-ui.css">
  20.   <!-- HTML5 Shim and Respond.js IE8 support of HTML5 elements and media queries -->
  21.   <!-- WARNING: Respond.js doesn't work if you view the page via file:// -->
  22.   <!--[if lt IE 9]>
  23.  <script src="https://oss.maxcdn.com/html5shiv/3.7.3/html5shiv.min.js"></script>
  24.  <script src="https://oss.maxcdn.com/respond/1.4.2/respond.min.js"></script>
  25.  <![endif]-->
  26.   <link rel="stylesheet" href="https://fonts.googleapis.com/css?family=Source+Sans+Pro:300,400,600,700,300italic,400italic,600italic">
  27.   <script type="text/javascript">
  28.     $('.add-group').live('click',function(){
  29.   var idx = $(this).parents('.group').index();
  30.   var pidcol = $(this).parents('td').find('td').find('.parentidcol').val();
  31.   var cloneGroup = $(this).parents('.group').clone();
  32.   var cloneCount = 1;
  33.   cloneGroup.find('input:text,input:hidden,input[type="number"],select,textarea').val('');
  34.   cloneGroup.find('input:radio,input:checkbox').attr('checked',false);
  35.   cloneGroup.find('[name][data-name]').each(function(i, elem){
  36.   var newName = $(this).attr('data-name');
  37.   if ($.browser.msie === true){
  38.     $(elem).replaceWith(document.createElement(
  39.         this.outerHTML.replace(/name=\w+/ig, 'name='+newName)
  40.     ));
  41.   } else {
  42.     $(elem).attr('name',newName);
  43.   }
  44.   });
  45.  
  46.   //cloneGroup.find('.item').parents('.item-wrap').find('.item').not(':last').remove();
  47.   $(this).parents('.group-wrap').append(cloneGroup);
  48.   $(this).removeClass('add-group').addClass('remove-group').text(' [x] Hapus');
  49.  
  50.   //$(this).parents('.group-wrap').find('.group:last').find('.item-wrap').find('.item').not(':last').remove();
  51.   // remove multiple item
  52.   $.each($(this).parents('.group-wrap').find('.group:last').find('.item-wrap'), function(a,b){
  53.     $(b).find('.item').not(':last').remove();
  54.     //$(this).attr('value',$(this).attr('data-value-'+lang));
  55.     /*$.each($(b).find('.item'), function(c,d){
  56.       alert($(d).html());
  57.     });*/
  58.   });
  59. });
  60.  
  61. $('.remove-group').live('click',function(){
  62.   var tanya = confirm('Are you sure to remove this group item now?');
  63.   if(tanya)
  64.   $(this).parents('.group').remove();
  65. });
  66.   </script>
  67.   <style type="text/css" media="screen">
  68. .tgl{font-weight:600;float: left;
  69.         border-left: 1px solid;
  70.     border-bottom: 1px solid;
  71.     border-top: 1px solid;
  72.     min-height: 35px;
  73.     padding: 7px 0;
  74.     text-align: center;border:0;}  
  75. </style>
  76. </head>
  77. <body class="hold-transition fixed skin-blue sidebar-mini">
  78. <div class="wrapper">
  79.   <header class="main-header">
  80.     <a href="http://192.168.1.132/hotel/" class="logo">
  81.       <span class="logo-mini"><b>B</b>G</span>
  82.       <span>
  83. <img src="/hotel/images/logo.png" alt="User Image" style="
  84.    width: 85px;
  85. ">
  86. </span>
  87.     </a>
  88.     <nav class="navbar navbar-static-top">
  89.       <a href="#" class="sidebar-toggle" data-toggle="push-menu" role="button">
  90.         <span class="sr-only">Toggle navigation</span>
  91.       </a>
  92.       <div class="navbar-custom-menu">
  93.         <ul class="nav navbar-nav">
  94.           <li class="dropdown user user-menu">
  95.             <a href="#" class="dropdown-toggle" data-toggle="dropdown">
  96.               <span><i class="fa fa-user"></i> Admin1</span>
  97.             </a>
  98.             <ul class="dropdown-menu">
  99.               <li class="user-header">
  100.                 <img src="/hotel/images/favicon.png" class="img-circle" alt="Logo">
  101.               </li>
  102.               <li class="user-footer">
  103.                 <div class="pull-right">
  104.                   <a href="http://192.168.1.132/hotel/logout " class="btn btn-default btn-flat"><i class="fa fa-sign-out"></i> Sign out</a>
  105.                 </div>
  106.               </li>
  107.             </ul>
  108.           </li>
  109.         </ul>
  110.       </div>
  111.     </nav>
  112.   </header>
  113.   <aside class="main-sidebar">
  114.     <section class="sidebar">
  115.       <div class="user-panel">
  116.         <div class="pull-left info">
  117.           <p>Property : </p>
  118.         </div>
  119.       </div>
  120.       <ul class="sidebar-menu" data-widget="tree">
  121.         <li class="header">MAIN NAVIGATION</li>
  122.         <li class='active'>
  123.           <a href="/hotel/calendar">
  124.             <i class="fa fa-calendar"></i> <span>Calender</span>
  125.           </a>
  126.         </li>
  127.         <li >
  128.           <a href="/hotel/reservations">
  129.             <i class="fa fa-table"></i> <span>Reservations</span>
  130.           </a>
  131.         </li>
  132.         <li >
  133.           <a href="/hotel/inventory">
  134.             <i class="fa fa-table"></i> <span>Inventory</span>
  135.           </a>
  136.         </li>
  137.         <li class="treeview">
  138.           <a href="#">
  139.             <i class="fa fa-cogs"></i> <span>Setup</span>
  140.             <span class="pull-right-container">
  141.               <i class="fa fa-angle-left pull-right"></i>
  142.             </span>
  143.           </a>
  144.           <ul class="treeview-menu"">
  145.             <li ><a href="/hotel/room-group"><i class="fa fa-circle-o"></i> Room Group</a></li>
  146.             <li ><a href="/hotel/rate-plan"><i class="fa fa-circle-o"></i> Rate Plan</a></li>
  147.             <li ><a href="/hotel/room"><i class="fa fa-circle-o"></i> Room</a></li>
  148.             <li ><a href="/hotel/property"><i class="fa fa-circle-o"></i> Property</a></li>
  149.             <li ><a href="/hotel/extra"><i class="fa fa-circle-o"></i> Extra</a></li>
  150.             <li ><a href="/hotel/referal"><i class="fa fa-circle-o"></i> Referal</a></li>
  151.             <li ><a href="/hotel/user"><i class="fa fa-circle-o"></i> User</a></li>
  152.           </ul>
  153.         </li>
  154.         <li class="treeview">
  155.           <a href="#">
  156.             <i class="fa fa-file-archive-o"></i> <span>Report</span>
  157.             <span class="pull-right-container">
  158.               <i class="fa fa-angle-left pull-right"></i>
  159.             </span>
  160.           </a>
  161.           <ul class="treeview-menu">
  162.             <li><a href="/hotel/report/revenue-summry"><i class="fa fa-circle-o"></i> Revenue Summry</a></li>
  163.             <li><a href="/hotel/report/revenue-breakdown"><i class="fa fa-circle-o"></i> Revenue Breakdown</a></li>
  164.             <li><a href="/hotel/report/checkin"><i class="fa fa-circle-o"></i> Check In</a></li>
  165.             <li><a href="/hotel/report/payments"><i class="fa fa-circle-o"></i> Payments</a></li>
  166.             <li><a href="/hotel/report/extras"><i class="fa fa-circle-o"></i> Extras</a></li>
  167.             <li><a href="/hotel/report/house-keeping"><i class="fa fa-circle-o"></i> House Keeping</a></li>
  168.             <li><a href="/hotel/report/statistics"><i class="fa fa-circle-o"></i> Statistics</a></li>
  169.             <li><a href="/hotel/report/daily-transactions"><i class="fa fa-circle-o"></i> Daily Transactions</a></li>
  170.             <li><a href="/hotel/report/guests"><i class="fa fa-circle-o"></i> Guest</a></li>
  171.           </ul>
  172.         </li>
  173.       </ul>
  174.     </section>
  175.   </aside>
  176.   <div class="content-wrapper">
  177.     <section class="content-header">
  178.       <h1>Calendar</h1>
  179.       <ol class="breadcrumb">
  180.         <li><a href="#"><i class="fa fa-dashboard"></i> Home</a></li>
  181.         <li class="active">Calendar</li>
  182.       </ol>
  183.     </section>
  184.     <section class="content">
  185.       <div class="row">
  186.         <div class="col-xs-12">
  187.           <div class="box">
  188.             <div class="box-header">
  189.               <div class="box-title">
  190.                
  191.               </div>
  192.               <div class="box-header">
  193.         <div class="table-responsive">
  194.         <table class="table table-bordered table-stripped" style="width:auto;min-width:auto">
  195.         <thead>
  196.             <tr>
  197.                 <th colspan="33" style="border:1px solid #fff">
  198.                 <!-- September
  199. 2017 -->
  200.                     <div class="row">
  201.                     <div class="col-md-6">
  202.                         <a class="btn open-AddBookDialog btn-cere" data-backdrop="static" data-keyboard="false" data-toggle="modal" href="#addBookDialog"><i class="fa fa-briefcase"></i> Create Reservation</a>
  203.                     </div>
  204.                     <div class="col-md-6">
  205.                 <div class="row">
  206.                     <a href="#" class="pull-left" style="border-radius:0;border-right:1px solid #ccc"><button class="btn btn-fida"><i class="fa fa-backward"></i> Week</button></a>
  207.                     <a href="#" class="pull-left" style="margin-right:5px"><button class="btn btn-fida"><i class="fa fa-caret-left"></i> Day</button></a>
  208.                     <div class="input-group col-md-5 pull-left" style="margin-right:5px">
  209.                         <input type="text" class="form-control datepicker" value="09/20/2017">
  210.                         <span class="input-group-addon"><i class="fa fa-calendar"></i></span>
  211.                     </div>
  212.                     <a href="#" class="pull-left" style="border-radius:0;border-right:1px solid #ccc"><button class="btn btn-fida">Day <i class="fa fa-caret-right"></i></button></a>
  213.                     <a href="#" class="pull-left"><button class="btn btn-fida">Week <i class="fa fa-forward"></i></button></a>
  214.                     <!--<a href="" class="btn bg-navy pull-left col-md-2" style="margin-right:2px"><i class="fa fa-backward"></i> Week</a>
  215.                         <a href="" class="btn bg-navy pull-left col-md-2" style="margin-right:2px"><i class="fa fa-caret-left"></i> Day</a>
  216.                         <a href="" class="btn bg-navy pull-left col-md-2" style="margin-right:2px"><i class="fa fa-caret-right"></i> Day</a>
  217.                         <a href="" class="btn bg-navy pull-left col-md-2" style="margin-right:2px"><i class="fa fa-forward"></i> Week</a> -->
  218.                     </div>
  219.                     </div>
  220.               </div>
  221.                 </th>
  222.             </tr>
  223.             <tr class="tr-cal">
  224.                 <th style="border:0;vertical-align:middle">Room</th>
  225.                 <th style="border:0;vertical-align:middle">Capacity</th>
  226.                                             <th class="tgl text-center" style="border:0;width:30px;">
  227. <p style="line-height:15px">
  228.     <font style="font-weight:600">Fri
  229.     </font><br/>
  230.     <font style="font-size:18px">1
  231.     </font><br/>
  232.     <font style="font-weight:100">Sep</font>
  233. </p>                        </th>
  234.                                             <th class="tgl text-center" style="border:0;width:30px;">
  235. <p style="line-height:15px">
  236.     <font style="font-weight:600">Sat
  237.     </font><br/>
  238.     <font style="font-size:18px">2
  239.     </font><br/>
  240.     <font style="font-weight:100">Sep</font>
  241. </p>                        </th>
  242.                                             <th class="tgl text-center" style="border:0;width:30px;">
  243. <p style="line-height:15px">
  244.     <font style="font-weight:600">Sun
  245.     </font><br/>
  246.     <font style="font-size:18px">3
  247.     </font><br/>
  248.     <font style="font-weight:100">Sep</font>
  249. </p>                        </th>
  250.                                             <th class="tgl text-center" style="border:0;width:30px;">
  251. <p style="line-height:15px">
  252.     <font style="font-weight:600">Mon
  253.     </font><br/>
  254.     <font style="font-size:18px">4
  255.     </font><br/>
  256.     <font style="font-weight:100">Sep</font>
  257. </p>                        </th>
  258.                                             <th class="tgl text-center" style="border:0;width:30px;">
  259. <p style="line-height:15px">
  260.     <font style="font-weight:600">Tue
  261.     </font><br/>
  262.     <font style="font-size:18px">5
  263.     </font><br/>
  264.     <font style="font-weight:100">Sep</font>
  265. </p>                        </th>
  266.                                             <th class="tgl text-center" style="border:0;width:30px;">
  267. <p style="line-height:15px">
  268.     <font style="font-weight:600">Wed
  269.     </font><br/>
  270.     <font style="font-size:18px">6
  271.     </font><br/>
  272.     <font style="font-weight:100">Sep</font>
  273. </p>                        </th>
  274.                                             <th class="tgl text-center" style="border:0;width:30px;">
  275. <p style="line-height:15px">
  276.     <font style="font-weight:600">Thu
  277.     </font><br/>
  278.     <font style="font-size:18px">7
  279.     </font><br/>
  280.     <font style="font-weight:100">Sep</font>
  281. </p>                        </th>
  282.                                             <th class="tgl text-center" style="border:0;width:30px;">
  283. <p style="line-height:15px">
  284.     <font style="font-weight:600">Fri
  285.     </font><br/>
  286.     <font style="font-size:18px">8
  287.     </font><br/>
  288.     <font style="font-weight:100">Sep</font>
  289. </p>                        </th>
  290.                                             <th class="tgl text-center" style="border:0;width:30px;">
  291. <p style="line-height:15px">
  292.     <font style="font-weight:600">Sat
  293.     </font><br/>
  294.     <font style="font-size:18px">9
  295.     </font><br/>
  296.     <font style="font-weight:100">Sep</font>
  297. </p>                        </th>
  298.                                             <th class="tgl text-center" style="border:0;width:30px;">
  299. <p style="line-height:15px">
  300.     <font style="font-weight:600">Sun
  301.     </font><br/>
  302.     <font style="font-size:18px">10
  303.     </font><br/>
  304.     <font style="font-weight:100">Sep</font>
  305. </p>                        </th>
  306.                                             <th class="tgl text-center" style="border:0;width:30px;">
  307. <p style="line-height:15px">
  308.     <font style="font-weight:600">Mon
  309.     </font><br/>
  310.     <font style="font-size:18px">11
  311.     </font><br/>
  312.     <font style="font-weight:100">Sep</font>
  313. </p>                        </th>
  314.                                             <th class="tgl text-center" style="border:0;width:30px;">
  315. <p style="line-height:15px">
  316.     <font style="font-weight:600">Tue
  317.     </font><br/>
  318.     <font style="font-size:18px">12
  319.     </font><br/>
  320.     <font style="font-weight:100">Sep</font>
  321. </p>                        </th>
  322.                                             <th class="tgl text-center" style="border:0;width:30px;">
  323. <p style="line-height:15px">
  324.     <font style="font-weight:600">Wed
  325.     </font><br/>
  326.     <font style="font-size:18px">13
  327.     </font><br/>
  328.     <font style="font-weight:100">Sep</font>
  329. </p>                        </th>
  330.                                             <th class="tgl text-center" style="border:0;width:30px;">
  331. <p style="line-height:15px">
  332.     <font style="font-weight:600">Thu
  333.     </font><br/>
  334.     <font style="font-size:18px">14
  335.     </font><br/>
  336.     <font style="font-weight:100">Sep</font>
  337. </p>                        </th>
  338.                                             <th class="tgl text-center" style="border:0;width:30px;">
  339. <p style="line-height:15px">
  340.     <font style="font-weight:600">Fri
  341.     </font><br/>
  342.     <font style="font-size:18px">15
  343.     </font><br/>
  344.     <font style="font-weight:100">Sep</font>
  345. </p>                        </th>
  346.                                             <th class="tgl text-center" style="border:0;width:30px;">
  347. <p style="line-height:15px">
  348.     <font style="font-weight:600">Sat
  349.     </font><br/>
  350.     <font style="font-size:18px">16
  351.     </font><br/>
  352.     <font style="font-weight:100">Sep</font>
  353. </p>                        </th>
  354.                                             <th class="tgl text-center" style="border:0;width:30px;">
  355. <p style="line-height:15px">
  356.     <font style="font-weight:600">Sun
  357.     </font><br/>
  358.     <font style="font-size:18px">17
  359.     </font><br/>
  360.     <font style="font-weight:100">Sep</font>
  361. </p>                        </th>
  362.                                             <th class="tgl text-center" style="border:0;width:30px;">
  363. <p style="line-height:15px">
  364.     <font style="font-weight:600">Mon
  365.     </font><br/>
  366.     <font style="font-size:18px">18
  367.     </font><br/>
  368.     <font style="font-weight:100">Sep</font>
  369. </p>                        </th>
  370.                                             <th class="tgl text-center" style="border:0;width:30px;">
  371. <p style="line-height:15px">
  372.     <font style="font-weight:600">Tue
  373.     </font><br/>
  374.     <font style="font-size:18px">19
  375.     </font><br/>
  376.     <font style="font-weight:100">Sep</font>
  377. </p>                        </th>
  378.                                             <th class="tgl text-center" style="border:0;width:30px;">
  379. <p style="line-height:15px">
  380.     <font style="font-weight:600">Wed
  381.     </font><br/>
  382.     <font style="font-size:18px">20
  383.     </font><br/>
  384.     <font style="font-weight:100">Sep</font>
  385. </p>                        </th>
  386.                                             <th class="tgl text-center" style="border:0;width:30px;">
  387. <p style="line-height:15px">
  388.     <font style="font-weight:600">Thu
  389.     </font><br/>
  390.     <font style="font-size:18px">21
  391.     </font><br/>
  392.     <font style="font-weight:100">Sep</font>
  393. </p>                        </th>
  394.                                             <th class="tgl text-center" style="border:0;width:30px;">
  395. <p style="line-height:15px">
  396.     <font style="font-weight:600">Fri
  397.     </font><br/>
  398.     <font style="font-size:18px">22
  399.     </font><br/>
  400.     <font style="font-weight:100">Sep</font>
  401. </p>                        </th>
  402.                                             <th class="tgl text-center" style="border:0;width:30px;">
  403. <p style="line-height:15px">
  404.     <font style="font-weight:600">Sat
  405.     </font><br/>
  406.     <font style="font-size:18px">23
  407.     </font><br/>
  408.     <font style="font-weight:100">Sep</font>
  409. </p>                        </th>
  410.                                             <th class="tgl text-center" style="border:0;width:30px;">
  411. <p style="line-height:15px">
  412.     <font style="font-weight:600">Sun
  413.     </font><br/>
  414.     <font style="font-size:18px">24
  415.     </font><br/>
  416.     <font style="font-weight:100">Sep</font>
  417. </p>                        </th>
  418.                                             <th class="tgl text-center" style="border:0;width:30px;">
  419. <p style="line-height:15px">
  420.     <font style="font-weight:600">Mon
  421.     </font><br/>
  422.     <font style="font-size:18px">25
  423.     </font><br/>
  424.     <font style="font-weight:100">Sep</font>
  425. </p>                        </th>
  426.                                             <th class="tgl text-center" style="border:0;width:30px;">
  427. <p style="line-height:15px">
  428.     <font style="font-weight:600">Tue
  429.     </font><br/>
  430.     <font style="font-size:18px">26
  431.     </font><br/>
  432.     <font style="font-weight:100">Sep</font>
  433. </p>                        </th>
  434.                                             <th class="tgl text-center" style="border:0;width:30px;">
  435. <p style="line-height:15px">
  436.     <font style="font-weight:600">Wed
  437.     </font><br/>
  438.     <font style="font-size:18px">27
  439.     </font><br/>
  440.     <font style="font-weight:100">Sep</font>
  441. </p>                        </th>
  442.                                             <th class="tgl text-center" style="border:0;width:30px;">
  443. <p style="line-height:15px">
  444.     <font style="font-weight:600">Thu
  445.     </font><br/>
  446.     <font style="font-size:18px">28
  447.     </font><br/>
  448.     <font style="font-weight:100">Sep</font>
  449. </p>                        </th>
  450.                                             <th class="tgl text-center" style="border:0;width:30px;">
  451. <p style="line-height:15px">
  452.     <font style="font-weight:600">Fri
  453.     </font><br/>
  454.     <font style="font-size:18px">29
  455.     </font><br/>
  456.     <font style="font-weight:100">Sep</font>
  457. </p>                        </th>
  458.                                             <th class="tgl text-center" style="border:0;width:30px;">
  459. <p style="line-height:15px">
  460.     <font style="font-weight:600">Sat
  461.     </font><br/>
  462.     <font style="font-size:18px">30
  463.     </font><br/>
  464.     <font style="font-weight:100">Sep</font>
  465. </p>                        </th>
  466.                                 </tr>
  467.         </thead>
  468.         <tbody class="tahu">
  469.                                 <tr>
  470.                     <td colspan="30" style="padding:0 5px;font-weight:600;background:#e9ebee;border-bottom:2px solid orange;border-top:2px solid #aaa;" class="">Delux</td>
  471.                 </tr>
  472.                                 <tr>
  473.                     <td class="room" style="min-height:35px;padding:0 5px;vertical-align:middle">Diamon A</td>
  474.                     <td class="capacity" style="min-height:35px;padding:0 5px;vertical-align:middle">2 Beds</td>
  475.                                                     <td style="width:30px;cursor:pointer;float:left;height:35px;padding:0 0 0 8px" data-room="Booking Room " data-date="01-09-2017" data-date2="02-09-2017" data-id="checkin8" data-id2="checkout1" data-toggle="modal" data-backdrop="static" data-keyboard="false"  href="#addBookDialog" class="book_tgl open-AddBookDialog auto_grid">
  476.                                                             </td>
  477.                                                     <td style="width:30px;cursor:pointer;float:left;height:35px;padding:0 0 0 8px" data-room="Booking Room " data-date="02-09-2017" data-date2="03-09-2017" data-id="checkin8" data-id2="checkout2" data-toggle="modal" data-backdrop="static" data-keyboard="false"  href="#addBookDialog" class="book_tgl open-AddBookDialog auto_grid">
  478.                                                             </td>
  479.                                                     <td style="width:30px;cursor:pointer;float:left;height:35px;padding:0 0 0 8px" data-room="Booking Room " data-date="03-09-2017" data-date2="04-09-2017" data-id="checkin8" data-id2="checkout3" data-toggle="modal" data-backdrop="static" data-keyboard="false"  href="#addBookDialog" class="book_tgl open-AddBookDialog auto_grid">
  480.                                                             </td>
  481.                                                     <td style="width:30px;cursor:pointer;float:left;height:35px;padding:0 0 0 8px" data-room="Booking Room " data-date="04-09-2017" data-date2="05-09-2017" data-id="checkin8" data-id2="checkout4" data-toggle="modal" data-backdrop="static" data-keyboard="false"  href="#addBookDialog" class="book_tgl open-AddBookDialog auto_grid">
  482.                                                             </td>
  483.                                                     <td style="width:30px;cursor:pointer;float:left;height:35px;padding:0 0 0 8px" data-room="Booking Room " data-date="05-09-2017" data-date2="06-09-2017" data-id="checkin8" data-id2="checkout5" data-toggle="modal" data-backdrop="static" data-keyboard="false"  href="#addBookDialog" class="book_tgl open-AddBookDialog auto_grid">
  484.                                                             </td>
  485.                                                     <td style="width:30px;cursor:pointer;float:left;height:35px;padding:0 0 0 8px" data-room="Booking Room " data-date="06-09-2017" data-date2="07-09-2017" data-id="checkin8" data-id2="checkout6" data-toggle="modal" data-backdrop="static" data-keyboard="false"  href="#addBookDialog" class="book_tgl open-AddBookDialog auto_grid">
  486.                                                             </td>
  487.                                                     <td style="width:30px;cursor:pointer;float:left;height:35px;padding:0 0 0 8px" data-room="Booking Room " data-date="07-09-2017" data-date2="08-09-2017" data-id="checkin8" data-id2="checkout7" data-toggle="modal" data-backdrop="static" data-keyboard="false"  href="#addBookDialog" class="book_tgl open-AddBookDialog auto_grid">
  488.                                                             </td>
  489.                                                     <td style="width:30px;cursor:pointer;float:left;height:35px;padding:0 0 0 8px" data-room="Booking Room " data-date="08-09-2017" data-date2="09-09-2017" data-id="checkin8" data-id2="checkout8" data-toggle="modal" data-backdrop="static" data-keyboard="false"  href="#addBookDialog" class="book_tgl open-AddBookDialog auto_grid">
  490.                                                             </td>
  491.                                                     <td style="width:30px;cursor:pointer;float:left;height:35px;padding:0 0 0 8px" data-room="Booking Room " data-date="09-09-2017" data-date2="10-09-2017" data-id="checkin8" data-id2="checkout9" data-toggle="modal" data-backdrop="static" data-keyboard="false"  href="#addBookDialog" class="book_tgl open-AddBookDialog auto_grid">
  492.                                                             </td>
  493.                                                     <td style="width:30px;cursor:pointer;float:left;height:35px;padding:0 0 0 8px" data-room="Booking Room " data-date="10-09-2017" data-date2="11-09-2017" data-id="checkin8" data-id2="checkout10" data-toggle="modal" data-backdrop="static" data-keyboard="false"  href="#addBookDialog" class="book_tgl open-AddBookDialog auto_grid">
  494.                                                             </td>
  495.                                                     <td style="width:30px;cursor:pointer;float:left;height:35px;padding:0 0 0 8px" data-room="Booking Room " data-date="11-09-2017" data-date2="12-09-2017" data-id="checkin8" data-id2="checkout11" data-toggle="modal" data-backdrop="static" data-keyboard="false"  href="#addBookDialog" class="book_tgl open-AddBookDialog auto_grid">
  496.                                                             </td>
  497.                                                     <td style="width:30px;cursor:pointer;float:left;height:35px;padding:0 0 0 8px" data-room="Booking Room " data-date="12-09-2017" data-date2="13-09-2017" data-id="checkin8" data-id2="checkout12" data-toggle="modal" data-backdrop="static" data-keyboard="false"  href="#addBookDialog" class="book_tgl open-AddBookDialog auto_grid">
  498.                                                             </td>
  499.                                                     <td style="width:30px;cursor:pointer;float:left;height:35px;padding:0 0 0 8px" data-room="Booking Room " data-date="13-09-2017" data-date2="14-09-2017" data-id="checkin8" data-id2="checkout13" data-toggle="modal" data-backdrop="static" data-keyboard="false"  href="#addBookDialog" class="book_tgl open-AddBookDialog auto_grid">
  500.                                                             </td>
  501.                                                     <td style="width:30px;cursor:pointer;float:left;height:35px;padding:0 0 0 8px" data-room="Booking Room " data-date="14-09-2017" data-date2="15-09-2017" data-id="checkin8" data-id2="checkout14" data-toggle="modal" data-backdrop="static" data-keyboard="false"  href="#addBookDialog" class="book_tgl open-AddBookDialog auto_grid">
  502.                                                             </td>
  503.                                                     <td style="width:30px;cursor:pointer;float:left;height:35px;padding:0 0 0 8px" data-room="Booking Room " data-date="15-09-2017" data-date2="16-09-2017" data-id="checkin8" data-id2="checkout15" data-toggle="modal" data-backdrop="static" data-keyboard="false"  href="#addBookDialog" class="book_tgl open-AddBookDialog auto_grid">
  504.                                                             </td>
  505.                                                     <td style="width:30px;cursor:pointer;float:left;height:35px;padding:0 0 0 8px" data-room="Booking Room " data-date="16-09-2017" data-date2="17-09-2017" data-id="checkin8" data-id2="checkout16" data-toggle="modal" data-backdrop="static" data-keyboard="false"  href="#addBookDialog" class="book_tgl open-AddBookDialog auto_grid">
  506.                                                             </td>
  507.                                                     <td style="width:30px;cursor:pointer;float:left;height:35px;padding:0 0 0 8px" data-room="Booking Room " data-date="17-09-2017" data-date2="18-09-2017" data-id="checkin8" data-id2="checkout17" data-toggle="modal" data-backdrop="static" data-keyboard="false"  href="#addBookDialog" class="book_tgl open-AddBookDialog auto_grid">
  508.                                                             </td>
  509.                                                     <td style="width:30px;cursor:pointer;float:left;height:35px;padding:0 0 0 8px" data-room="Booking Room " data-date="18-09-2017" data-date2="19-09-2017" data-id="checkin8" data-id2="checkout18" data-toggle="modal" data-backdrop="static" data-keyboard="false"  href="#addBookDialog" class="book_tgl open-AddBookDialog auto_grid">
  510.                                                             </td>
  511.                                                     <td style="width:30px;cursor:pointer;float:left;height:35px;padding:0 0 0 8px" data-room="Booking Room " data-date="19-09-2017" data-date2="20-09-2017" data-id="checkin8" data-id2="checkout19" data-toggle="modal" data-backdrop="static" data-keyboard="false"  href="#addBookDialog" class="book_tgl open-AddBookDialog auto_grid">
  512.                                                             </td>
  513.                                                     <td style="width:30px;cursor:pointer;float:left;height:35px;padding:0 0 0 8px" data-room="Booking Room " data-date="20-09-2017" data-date2="21-09-2017" data-id="checkin8" data-id2="checkout20" data-toggle="modal" data-backdrop="static" data-keyboard="false"  href="#addBookDialog" class="book_tgl open-AddBookDialog auto_grid">
  514.                                                             </td>
  515.                                                     <td style="width:30px;cursor:pointer;float:left;height:35px;padding:0 0 0 8px" data-room="Booking Room " data-date="21-09-2017" data-date2="22-09-2017" data-id="checkin8" data-id2="checkout21" data-toggle="modal" data-backdrop="static" data-keyboard="false"  href="#addBookDialog" class="book_tgl open-AddBookDialog auto_grid">
  516.                                                             </td>
  517.                                                     <td style="width:30px;cursor:pointer;float:left;height:35px;padding:0 0 0 8px" data-room="Booking Room " data-date="22-09-2017" data-date2="23-09-2017" data-id="checkin8" data-id2="checkout22" data-toggle="modal" data-backdrop="static" data-keyboard="false"  href="#addBookDialog" class="book_tgl open-AddBookDialog auto_grid">
  518.                                         <div class="btn btn-danger draggable resizable kk" style="overflow:hidden;width:55px;border-radius:0;z-index:999;color:#333;font-weight:600;margin-left:-7px;min-height:34px;max-height:34px" title="">
  519. <i style="
  520.    float: right;
  521.    position: absolute;
  522.    top: 0;
  523.    right: 0;
  524.    background:linear-gradient(to bottom left, #f00 0%, #f00 50%, transparent 55%);
  525.    width:10px;
  526.    height:10px;
  527. "></i> ari yulianto</div>
  528.                                 </td>
  529.                                                     <td style="width:30px;cursor:pointer;float:left;height:35px;padding:0 0 0 8px" data-room="Booking Room " data-date="23-09-2017" data-date2="24-09-2017" data-id="checkin8" data-id2="checkout23" data-toggle="modal" data-backdrop="static" data-keyboard="false"  href="#addBookDialog" class="book_tgl open-AddBookDialog auto_grid">
  530.                                                             </td>
  531.                                                     <td style="width:30px;cursor:pointer;float:left;height:35px;padding:0 0 0 8px" data-room="Booking Room " data-date="24-09-2017" data-date2="25-09-2017" data-id="checkin8" data-id2="checkout24" data-toggle="modal" data-backdrop="static" data-keyboard="false"  href="#addBookDialog" class="book_tgl open-AddBookDialog auto_grid">
  532.                                                             </td>
  533.                                                     <td style="width:30px;cursor:pointer;float:left;height:35px;padding:0 0 0 8px" data-room="Booking Room " data-date="25-09-2017" data-date2="26-09-2017" data-id="checkin8" data-id2="checkout25" data-toggle="modal" data-backdrop="static" data-keyboard="false"  href="#addBookDialog" class="book_tgl open-AddBookDialog auto_grid">
  534.                                         <div class="btn btn-success draggable resizable kk" style="overflow:hidden;width:55px;border-radius:0;z-index:999;color:#333;font-weight:600;margin-left:-7px;min-height:34px;max-height:34px" title="">
  535. <i style="
  536.    float: right;
  537.    position: absolute;
  538.    top: 0;
  539.    right: 0;
  540.    background:linear-gradient(to bottom left, #f00 0%, #f00 50%, transparent 55%);
  541.    width:10px;
  542.    height:10px;
  543. "></i> Rizka Noviana</div>
  544.                                 </td>
  545.                                                     <td style="width:30px;cursor:pointer;float:left;height:35px;padding:0 0 0 8px" data-room="Booking Room " data-date="26-09-2017" data-date2="27-09-2017" data-id="checkin8" data-id2="checkout26" data-toggle="modal" data-backdrop="static" data-keyboard="false"  href="#addBookDialog" class="book_tgl open-AddBookDialog auto_grid">
  546.                                                             </td>
  547.                                                     <td style="width:30px;cursor:pointer;float:left;height:35px;padding:0 0 0 8px" data-room="Booking Room " data-date="27-09-2017" data-date2="28-09-2017" data-id="checkin8" data-id2="checkout27" data-toggle="modal" data-backdrop="static" data-keyboard="false"  href="#addBookDialog" class="book_tgl open-AddBookDialog auto_grid">
  548.                                                             </td>
  549.                                                     <td style="width:30px;cursor:pointer;float:left;height:35px;padding:0 0 0 8px" data-room="Booking Room " data-date="28-09-2017" data-date2="29-09-2017" data-id="checkin8" data-id2="checkout28" data-toggle="modal" data-backdrop="static" data-keyboard="false"  href="#addBookDialog" class="book_tgl open-AddBookDialog auto_grid">
  550.                                                             </td>
  551.                                                     <td style="width:30px;cursor:pointer;float:left;height:35px;padding:0 0 0 8px" data-room="Booking Room " data-date="29-09-2017" data-date2="30-09-2017" data-id="checkin8" data-id2="checkout29" data-toggle="modal" data-backdrop="static" data-keyboard="false"  href="#addBookDialog" class="book_tgl open-AddBookDialog auto_grid">
  552.                                                             </td>
  553.                                                     <td style="width:30px;border-right:1px solid;cursor:pointer;float:left;height:35px;padding:0 0 0 8px" data-room="Booking Room " data-date="30-09-2017" data-date2="01-10-2017" data-id="checkin8" data-id2="checkout30" data-toggle="modal" data-backdrop="static" data-keyboard="false"  href="#addBookDialog" class="book_tgl open-AddBookDialog auto_grid">
  554.                                                             </td>
  555.                                         </tr>
  556.                             <tr>
  557.                     <td colspan="30" style="padding:0 5px;font-weight:600;background:#e9ebee;border-bottom:2px solid orange;border-top:2px solid #aaa;" class="">Primary</td>
  558.                 </tr>
  559.                                 <tr>
  560.                     <td class="room" style="min-height:35px;padding:0 5px;vertical-align:middle">Room H</td>
  561.                     <td class="capacity" style="min-height:35px;padding:0 5px;vertical-align:middle">2 Beds</td>
  562.                                                     <td style="width:30px;cursor:pointer;float:left;height:35px;padding:0 0 0 8px" data-room="Booking Room " data-date="01-09-2017" data-date2="02-09-2017" data-id="checkin10" data-id2="checkout1" data-toggle="modal" data-backdrop="static" data-keyboard="false"  href="#addBookDialog" class="book_tgl open-AddBookDialog auto_grid">
  563.                                                             </td>
  564.                                                     <td style="width:30px;cursor:pointer;float:left;height:35px;padding:0 0 0 8px" data-room="Booking Room " data-date="02-09-2017" data-date2="03-09-2017" data-id="checkin10" data-id2="checkout2" data-toggle="modal" data-backdrop="static" data-keyboard="false"  href="#addBookDialog" class="book_tgl open-AddBookDialog auto_grid">
  565.                                                             </td>
  566.                                                     <td style="width:30px;cursor:pointer;float:left;height:35px;padding:0 0 0 8px" data-room="Booking Room " data-date="03-09-2017" data-date2="04-09-2017" data-id="checkin10" data-id2="checkout3" data-toggle="modal" data-backdrop="static" data-keyboard="false"  href="#addBookDialog" class="book_tgl open-AddBookDialog auto_grid">
  567.                                                             </td>
  568.                                                     <td style="width:30px;cursor:pointer;float:left;height:35px;padding:0 0 0 8px" data-room="Booking Room " data-date="04-09-2017" data-date2="05-09-2017" data-id="checkin10" data-id2="checkout4" data-toggle="modal" data-backdrop="static" data-keyboard="false"  href="#addBookDialog" class="book_tgl open-AddBookDialog auto_grid">
  569.                                                             </td>
  570.                                                     <td style="width:30px;cursor:pointer;float:left;height:35px;padding:0 0 0 8px" data-room="Booking Room " data-date="05-09-2017" data-date2="06-09-2017" data-id="checkin10" data-id2="checkout5" data-toggle="modal" data-backdrop="static" data-keyboard="false"  href="#addBookDialog" class="book_tgl open-AddBookDialog auto_grid">
  571.                                                             </td>
  572.                                                     <td style="width:30px;cursor:pointer;float:left;height:35px;padding:0 0 0 8px" data-room="Booking Room " data-date="06-09-2017" data-date2="07-09-2017" data-id="checkin10" data-id2="checkout6" data-toggle="modal" data-backdrop="static" data-keyboard="false"  href="#addBookDialog" class="book_tgl open-AddBookDialog auto_grid">
  573.                                                             </td>
  574.                                                     <td style="width:30px;cursor:pointer;float:left;height:35px;padding:0 0 0 8px" data-room="Booking Room " data-date="07-09-2017" data-date2="08-09-2017" data-id="checkin10" data-id2="checkout7" data-toggle="modal" data-backdrop="static" data-keyboard="false"  href="#addBookDialog" class="book_tgl open-AddBookDialog auto_grid">
  575.                                                             </td>
  576.                                                     <td style="width:30px;cursor:pointer;float:left;height:35px;padding:0 0 0 8px" data-room="Booking Room " data-date="08-09-2017" data-date2="09-09-2017" data-id="checkin10" data-id2="checkout8" data-toggle="modal" data-backdrop="static" data-keyboard="false"  href="#addBookDialog" class="book_tgl open-AddBookDialog auto_grid">
  577.                                                             </td>
  578.                                                     <td style="width:30px;cursor:pointer;float:left;height:35px;padding:0 0 0 8px" data-room="Booking Room " data-date="09-09-2017" data-date2="10-09-2017" data-id="checkin10" data-id2="checkout9" data-toggle="modal" data-backdrop="static" data-keyboard="false"  href="#addBookDialog" class="book_tgl open-AddBookDialog auto_grid">
  579.                                                             </td>
  580.                                                     <td style="width:30px;cursor:pointer;float:left;height:35px;padding:0 0 0 8px" data-room="Booking Room " data-date="10-09-2017" data-date2="11-09-2017" data-id="checkin10" data-id2="checkout10" data-toggle="modal" data-backdrop="static" data-keyboard="false"  href="#addBookDialog" class="book_tgl open-AddBookDialog auto_grid">
  581.                                                             </td>
  582.                                                     <td style="width:30px;cursor:pointer;float:left;height:35px;padding:0 0 0 8px" data-room="Booking Room " data-date="11-09-2017" data-date2="12-09-2017" data-id="checkin10" data-id2="checkout11" data-toggle="modal" data-backdrop="static" data-keyboard="false"  href="#addBookDialog" class="book_tgl open-AddBookDialog auto_grid">
  583.                                                             </td>
  584.                                                     <td style="width:30px;cursor:pointer;float:left;height:35px;padding:0 0 0 8px" data-room="Booking Room " data-date="12-09-2017" data-date2="13-09-2017" data-id="checkin10" data-id2="checkout12" data-toggle="modal" data-backdrop="static" data-keyboard="false"  href="#addBookDialog" class="book_tgl open-AddBookDialog auto_grid">
  585.                                                             </td>
  586.                                                     <td style="width:30px;cursor:pointer;float:left;height:35px;padding:0 0 0 8px" data-room="Booking Room " data-date="13-09-2017" data-date2="14-09-2017" data-id="checkin10" data-id2="checkout13" data-toggle="modal" data-backdrop="static" data-keyboard="false"  href="#addBookDialog" class="book_tgl open-AddBookDialog auto_grid">
  587.                                                             </td>
  588.                                                     <td style="width:30px;cursor:pointer;float:left;height:35px;padding:0 0 0 8px" data-room="Booking Room " data-date="14-09-2017" data-date2="15-09-2017" data-id="checkin10" data-id2="checkout14" data-toggle="modal" data-backdrop="static" data-keyboard="false"  href="#addBookDialog" class="book_tgl open-AddBookDialog auto_grid">
  589.                                                             </td>
  590.                                                     <td style="width:30px;cursor:pointer;float:left;height:35px;padding:0 0 0 8px" data-room="Booking Room " data-date="15-09-2017" data-date2="16-09-2017" data-id="checkin10" data-id2="checkout15" data-toggle="modal" data-backdrop="static" data-keyboard="false"  href="#addBookDialog" class="book_tgl open-AddBookDialog auto_grid">
  591.                                                             </td>
  592.                                                     <td style="width:30px;cursor:pointer;float:left;height:35px;padding:0 0 0 8px" data-room="Booking Room " data-date="16-09-2017" data-date2="17-09-2017" data-id="checkin10" data-id2="checkout16" data-toggle="modal" data-backdrop="static" data-keyboard="false"  href="#addBookDialog" class="book_tgl open-AddBookDialog auto_grid">
  593.                                                             </td>
  594.                                                     <td style="width:30px;cursor:pointer;float:left;height:35px;padding:0 0 0 8px" data-room="Booking Room " data-date="17-09-2017" data-date2="18-09-2017" data-id="checkin10" data-id2="checkout17" data-toggle="modal" data-backdrop="static" data-keyboard="false"  href="#addBookDialog" class="book_tgl open-AddBookDialog auto_grid">
  595.                                                             </td>
  596.                                                     <td style="width:30px;cursor:pointer;float:left;height:35px;padding:0 0 0 8px" data-room="Booking Room " data-date="18-09-2017" data-date2="19-09-2017" data-id="checkin10" data-id2="checkout18" data-toggle="modal" data-backdrop="static" data-keyboard="false"  href="#addBookDialog" class="book_tgl open-AddBookDialog auto_grid">
  597.                                                             </td>
  598.                                                     <td style="width:30px;cursor:pointer;float:left;height:35px;padding:0 0 0 8px" data-room="Booking Room " data-date="19-09-2017" data-date2="20-09-2017" data-id="checkin10" data-id2="checkout19" data-toggle="modal" data-backdrop="static" data-keyboard="false"  href="#addBookDialog" class="book_tgl open-AddBookDialog auto_grid">
  599.                                                             </td>
  600.                                                     <td style="width:30px;cursor:pointer;float:left;height:35px;padding:0 0 0 8px" data-room="Booking Room " data-date="20-09-2017" data-date2="21-09-2017" data-id="checkin10" data-id2="checkout20" data-toggle="modal" data-backdrop="static" data-keyboard="false"  href="#addBookDialog" class="book_tgl open-AddBookDialog auto_grid">
  601.                                                             </td>
  602.                                                     <td style="width:30px;cursor:pointer;float:left;height:35px;padding:0 0 0 8px" data-room="Booking Room " data-date="21-09-2017" data-date2="22-09-2017" data-id="checkin10" data-id2="checkout21" data-toggle="modal" data-backdrop="static" data-keyboard="false"  href="#addBookDialog" class="book_tgl open-AddBookDialog auto_grid">
  603.                                                             </td>
  604.                                                     <td style="width:30px;cursor:pointer;float:left;height:35px;padding:0 0 0 8px" data-room="Booking Room " data-date="22-09-2017" data-date2="23-09-2017" data-id="checkin10" data-id2="checkout22" data-toggle="modal" data-backdrop="static" data-keyboard="false"  href="#addBookDialog" class="book_tgl open-AddBookDialog auto_grid">
  605.                                                             </td>
  606.                                                     <td style="width:30px;cursor:pointer;float:left;height:35px;padding:0 0 0 8px" data-room="Booking Room " data-date="23-09-2017" data-date2="24-09-2017" data-id="checkin10" data-id2="checkout23" data-toggle="modal" data-backdrop="static" data-keyboard="false"  href="#addBookDialog" class="book_tgl open-AddBookDialog auto_grid">
  607.                                                             </td>
  608.                                                     <td style="width:30px;cursor:pointer;float:left;height:35px;padding:0 0 0 8px" data-room="Booking Room " data-date="24-09-2017" data-date2="25-09-2017" data-id="checkin10" data-id2="checkout24" data-toggle="modal" data-backdrop="static" data-keyboard="false"  href="#addBookDialog" class="book_tgl open-AddBookDialog auto_grid">
  609.                                                             </td>
  610.                                                     <td style="width:30px;cursor:pointer;float:left;height:35px;padding:0 0 0 8px" data-room="Booking Room " data-date="25-09-2017" data-date2="26-09-2017" data-id="checkin10" data-id2="checkout25" data-toggle="modal" data-backdrop="static" data-keyboard="false"  href="#addBookDialog" class="book_tgl open-AddBookDialog auto_grid">
  611.                                         <div class="btn btn-success draggable resizable kk" style="overflow:hidden;width:25px;border-radius:0;z-index:999;color:#333;font-weight:600;margin-left:-7px;min-height:34px;max-height:34px" title="">
  612. <i style="
  613.    float: right;
  614.    position: absolute;
  615.    top: 0;
  616.    right: 0;
  617.    background:linear-gradient(to bottom left, #f00 0%, #f00 50%, transparent 55%);
  618.    width:10px;
  619.    height:10px;
  620. "></i> Rizka Noviana</div>
  621.                                 </td>
  622.                                                     <td style="width:30px;cursor:pointer;float:left;height:35px;padding:0 0 0 8px" data-room="Booking Room " data-date="26-09-2017" data-date2="27-09-2017" data-id="checkin10" data-id2="checkout26" data-toggle="modal" data-backdrop="static" data-keyboard="false"  href="#addBookDialog" class="book_tgl open-AddBookDialog auto_grid">
  623.                                                             </td>
  624.                                                     <td style="width:30px;cursor:pointer;float:left;height:35px;padding:0 0 0 8px" data-room="Booking Room " data-date="27-09-2017" data-date2="28-09-2017" data-id="checkin10" data-id2="checkout27" data-toggle="modal" data-backdrop="static" data-keyboard="false"  href="#addBookDialog" class="book_tgl open-AddBookDialog auto_grid">
  625.                                                             </td>
  626.                                                     <td style="width:30px;cursor:pointer;float:left;height:35px;padding:0 0 0 8px" data-room="Booking Room " data-date="28-09-2017" data-date2="29-09-2017" data-id="checkin10" data-id2="checkout28" data-toggle="modal" data-backdrop="static" data-keyboard="false"  href="#addBookDialog" class="book_tgl open-AddBookDialog auto_grid">
  627.                                                             </td>
  628.                                                     <td style="width:30px;cursor:pointer;float:left;height:35px;padding:0 0 0 8px" data-room="Booking Room " data-date="29-09-2017" data-date2="30-09-2017" data-id="checkin10" data-id2="checkout29" data-toggle="modal" data-backdrop="static" data-keyboard="false"  href="#addBookDialog" class="book_tgl open-AddBookDialog auto_grid">
  629.                                         <div class="btn btn-danger draggable resizable kk" style="overflow:hidden;width:25px;border-radius:0;z-index:999;color:#333;font-weight:600;margin-left:-7px;min-height:34px;max-height:34px" title="">
  630. <i style="
  631.    float: right;
  632.    position: absolute;
  633.    top: 0;
  634.    right: 0;
  635.    background:linear-gradient(to bottom left, #f00 0%, #f00 50%, transparent 55%);
  636.    width:10px;
  637.    height:10px;
  638. "></i> Rizka Noviana</div>
  639.                                 </td>
  640.                                                     <td style="width:30px;border-right:1px solid;cursor:pointer;float:left;height:35px;padding:0 0 0 8px" data-room="Booking Room " data-date="30-09-2017" data-date2="01-10-2017" data-id="checkin10" data-id2="checkout30" data-toggle="modal" data-backdrop="static" data-keyboard="false"  href="#addBookDialog" class="book_tgl open-AddBookDialog auto_grid">
  641.                                                             </td>
  642.                                         </tr>
  643.                         </tbody>
  644.         </table>
  645.         <div id="result"></div>
  646.     </div>
  647.     </div>
  648. </div></div>
  649. </div>
  650. </div>
  651. </section>
  652. </div>
  653. <div class="modal fade" tabindex="-1" role="dialog" id="addBookDialog">
  654.   <div class="modal-dialog" role="document" style="width:90%">
  655.     <div class="modal-content">
  656.         <form method="post" action="">
  657.             <div class="modal-header">
  658.                 <button type="button" class="close" data-dismiss="modal" aria-label="Close"><span aria-hidden="true">&times;</span></button>
  659.                 <h4 class="modal-title"><strong id="book_name"></strong></h4>
  660.             </div>
  661.             <div class="modal-body box box-primary">
  662.             <div class="row" style="padding:0 15px">
  663.                     <div class="col-sm-12">
  664.                         <div class="row">
  665.                             <div class="col-sm-2">
  666.                                 <div class="form-group">
  667.                                     <label>Checkin</label>
  668.                                     <input type="text" name="checkin" class="form-control datepicker" id="book_date" value="" readonly required>
  669.                                 </div>
  670.                             </div>
  671.                             <div class="col-sm-2">
  672.                                 <div class="form-group">
  673.                                     <label>Checkout</label>
  674.                                     <input type="text" name="checkout" class="form-control datepicker2" id="book_date2" value="" required>
  675.                                 </div>
  676.                             </div>
  677.                         </div>
  678.                     </div>
  679.                 </div>
  680.                 <div class="row" style="padding:0 15px">
  681.                     <div class="col-sm-12">
  682.                         <div class="row">
  683.                             <div class="col-sm-2">
  684.                                 <div class="form-group">
  685.                                     <label>Room Type</label>
  686.                                     <select class="form-control" name="rtype" onChange="getRoom(this.value);" required>
  687.                                         <option value="" disabled readonly selected>-- Room Type --</option>
  688.                                         <option value="1">Delux</option><option value="2">Primary</option>                                  </select>
  689.                                 </div>
  690.                             </div>
  691.                             <div class="col-sm-2">
  692.                                 <div class="form-group">
  693.                                     <label>Room</label>
  694.                                     <select class="form-control" id="rroom" name="room" required>
  695.                                         <option value="" selected disabled readonly>-- Room --</option>
  696.                                     </select>
  697.                                 </div>
  698.                             </div>
  699.                             <div class="col-sm-2">
  700.                                 <div class="form-group">
  701.                                     <label>Rate Plan</label>
  702.                                     <div class="rplan">
  703.                                     <select class="form-control" id="rplan" name="rplan" required>
  704.                                         <option value="" selected disabled readonly>-- Rate plan --</option>
  705.                                     </select>
  706.                                 </div>
  707.                                 </div>
  708.                             </div>
  709.                             <div class="col-sm-2">
  710.                                 <div class="form-group">
  711.                                     <label>Adult</label>
  712.                                     <select name="dewasa" class="form-control" required>
  713.                                         <option value="0" selected readonly>- Adult -</option>
  714.                                         <option value="1">1 Adult</option>
  715.                                         <option value="2">2 Adult</option>
  716.                                         <option value="2">3 Adult</option>
  717.                                         <option value="2">4 Adult</option>
  718.                                         <option value="2">5 Adult</option>
  719.                                     </select>
  720.                                 </div>
  721.                             </div><div class="col-sm-2">
  722.                                 <div class="form-group">
  723.                                     <label>Children</label>
  724.                                     <select name="jumlah_anak" class="form-control">
  725.                                         <option value="0" selected readonly>- Children  -</option>
  726.                                         <option value="1">1 Children</option>
  727.                                         <option value="2">2 Children</option>
  728.                                         <option value="3">3 Children</option>
  729.                                         <option value="4">4 Children</option>
  730.                                         <option value="5">5 Children</option>
  731.                                     </select>
  732.                                 </div>
  733.                             </div><div class="col-sm-2">
  734.                                 <div class="form-group">
  735.                                     <label>Infants</label>
  736.                                     <select name="bayi" class="form-control">
  737.                                         <option value="0" selected readonly>- Infants -</option>
  738.                                         <option value="1">1 Infants</option>
  739.                                         <option value="2">2 Infants</option>
  740.                                         <option value="3">3 Infants</option>
  741.                                         <option value="4">4 Infants</option>
  742.                                         <option value="5">5 Infants</option>
  743.                                     </select>
  744.                                 </div>
  745.                             </div>
  746.                         </div>
  747.                     </div>
  748.                 </div>
  749.                 <div class="row" style="padding:0 15px">
  750.                     <div class="col-sm-3">
  751.                         <div class="form-group">
  752.                             <label>First Name</label>
  753.                             <input class="form-control" placeholder="First Name..." name="nama_depan" value="" required>
  754.                         </div>
  755.                     </div>
  756.                     <div class="col-sm-3">
  757.                         <div class="form-group">
  758.                             <label>Last Name</label>
  759.                             <input class="form-control" placeholder="Last Name..." name="nama_akhir" value="" required>
  760.                         </div>
  761.                     </div> 
  762.                     <div class="col-sm-3">
  763.                                 <div class="form-group">
  764.                                     <label>Phone</label>
  765.                                     <input type="number" placeholder="Phone..." name="telepon" class="form-control" required>
  766.                                 </div>
  767.                             </div>
  768.                                 <div class="col-sm-3">
  769.                                 <div class="form-group">
  770.                                     <label>Email</label>
  771.                                     <input type="email" placeholder="Email..." name="email" class="form-control" required>
  772.                                 </div>
  773.                             </div>
  774.                     </div>
  775.                 <div class="row" style="padding:0 15px">
  776.                     <div class="col-sm-12">
  777.                         <div class="form-group"><label>Source</label>
  778.                             <div class="row">
  779.                                 <div class="col-sm-2">
  780.                                     <select name="bookingsource" class="form-control" required>
  781.                                         <option value="" selected disabled readonly>- Source -</option>
  782.                                         <option value="1">Walk-in</option><option value="2">Pegi-pegi</option><option value="3">Agoda</option><option value="4">Traveloka</option><option value="5">Airyroom</option><option value="6">Jinggacloud</option>                                 </select>
  783.                                 </div>
  784.                             </div>
  785.                         </div>
  786.                     </div>
  787.                 </div>
  788.                 <div class="row" style="padding:0 15px">
  789.                     <div class="col-sm-12">
  790.                         <div class="form-group"><label>Guest Comment</label>
  791.                             <div class="row">
  792.                                 <div class="col-sm-12">
  793.                                     <textarea class="form-control" placeholder="Guest Comment" name="guestcomment" style="resize:none"></textarea>
  794.                                 </div>
  795.                             </div>
  796.                         </div>
  797.                     </div>
  798.                     <div class="col-sm-12">
  799.                         <div class="form-group"><label>Notes</label>
  800.                             <div class="row">
  801.                                 <div class="col-sm-12">
  802.                                     <textarea class="form-control" placeholder="Notess" name="notes" style="resize:none"></textarea>
  803.                                 </div>
  804.                             </div>
  805.                         </div>
  806.                     </div>
  807.                 </div>
  808.             </div>
  809.             <div class="modal-footer">
  810.                 <input type="hidden" name="id" readonly id="book_id" value="" required>
  811.                 <input type="submit" class="btn btn-primary" name="btn_book" value="Booking">
  812.             </div>
  813.         </form>
  814.     </div>
  815.   </div>
  816. </div><footer class="main-footer">
  817.     <div class="pull-right hidden-xs">
  818.      
  819.     </div>
  820.     <strong>Copyright &copy; 2017 <a href="http://192.168.1.132/hotel/" target="_blank">Bantal Guling Guest House</a>.</strong> All rights
  821.     reserved.
  822. </footer>
  823.  
  824. <script src="plugins/jQuery/jquery-3.1.1.min.js"></script>
  825. <script src="http://192.168.1.132/hotel/js/bootstrap.min.js"></script>
  826. <script src="http://192.168.1.132/hotel/js/adminlte.js"></script>
  827. <script src="http://192.168.1.132/hotel/js/demo.js"></script>
  828. <script src="http://192.168.1.132/hotel/js/bootstrap-datepicker.js"></script>
  829. <script src="http://code.jquery.com/ui/1.12.1/jquery-ui.min.js"></script>
  830. <script type="text/javascript">
  831. function myFunction(){var t=$(".clonedInput").length,a=document.getElementById("chanx_"+t).value.split("|");a[1]?(document.getElementById("name2_"+t).readOnly=!0,document.getElementById("name2_"+t).value=a[1],$(".otherz_"+t).hide()):(document.getElementById("name2_"+t).readOnly=!1,document.getElementById("name2_"+t).value="0",$(".otherz_"+t).show())}function myFunction1(){var t=$(".incl_clone").length;document.getElementById("incl_input1_"+t).value>0?$(".text").hide():$(".text").show()}function getRoom(t){$.ajax({type:"POST",url:"/hotel/calendar/getroom.json",data:"rtype="+t,success:function(a){$("#rroom").html(""),$.each(a,function(t,a){$("#rroom").append('<option value="'+t+'">'+a+"</option>")}),$.ajax({type:"POST",url:"/hotel/calendar/getplan.json",data:"rtype="+t,success:function(t){$("#rplan").html(""),$.each(t,function(t,a){$("#rplan").append('<option value="'+t+'">'+a+"</option>")})}})}})}$(document).on("click",".open-AddBookDialog",function(){var t=$(this).data("date"),a=$(this).data("date2"),o=$(this).data("room"),e=$(this).data("id");t?$(".modal-body #book_date").val(t):$(".modal-body #book_date").attr("readonly",!1),$(".modal-body #book_date2").val(a),o?$(".modal-header #book_name").html(o):$(".modal-header #book_name").html("<i class='fa fa-briefcase'></i> Create Reservation"),$(".modal-footer #book_id").val(e)}),$(document).on("click",".updates",function(){var t=$(this).data("date"),a=$(this).data("date2"),o=$(this).data("room"),e=$(this).data("id");for(mydewasa=$(this).data("dewasa"),myanak=$(this).data("anak"),mybayi=$(this).data("bayi"),mydepan=$(this).data("depan"),myakhir=$(this).data("akhir"),mytelepon=$(this).data("telepon"),myemail=$(this).data("email"),myCard=$(this).data("card"),mySur=$(this).data("sur"),idroom=$(this).data("idroom"),idgrouproom=$(this).data("idgrouproom"),idrate=$(this).data("idrate"),invoice=$(this).data("invoice"),mystatus=$(this).data("status"),mytotalroom=$(this).data("totalroom"),myidpayment=$(this).data("idpayment"),mytotalextra=$(this).data("idpayment_extra"),mytotalpayment=$(this).data("totalpayment"),mypercentaxes=$(this).data("percentaxes"),myguestcomment=$(this).data("guestcomment"),mynotes=$(this).data("notes"),bookingsource=$(this).data("source"),count_extra=$(this).data("count_extra"),ci=1;ci<=count_extra;ci++)$("#extra #extra_show").show(),$("#extra_show #extra_data").append("<tr><td>"+ci+'</td><td><input type="text" value="'+$(this).data("extra_name"+ci)+'" class="form-control" disabled readonly></td><td><input type="text" value="'+$(this).data("extra_qty"+ci)+'" class="form-control" disabled readonly></td><td><input type="text" value="'+$(this).data("extra_total"+ci)+'" class="form-control" disabled readonly></td><td><i class="fa fa-trash-o"></i></td></tr>');for(countGuest=mydewasa+myanak+mybayi,cg=1;cg<=countGuest;cg++)$(".modal-body #cg"+cg).show(),$("#cg"+cg+" #gln"+cg).val($(this).data("guest_firstname"+cg)),$("#cg"+cg+" #gfn"+cg).val($(this).data("guest_lastname"+cg)),$("#cg"+cg+" #gem"+cg).val($(this).data("guest_email"+cg)),$("#cg"+cg+" #gph"+cg).val($(this).data("guest_phone"+cg));2==myCard?$(".modal-body #surcharges2").show():$(".modal-body #surcharges2").hide(),0==myCard?($(".modal-body #payment_card").html("Cash"),$(".modal-body #payment_submit").hide()):1==myCard?($(".modal-body #payment_card").html("Direct Bank Transfer"),$(".modal-body #payment_submit").hide()):($(".modal-body #payment_card").html('<select class="form-control" name="card_type" required><option disabled selected>-- Select Payment Type --</option><option value="0">Cash</option><option value="1">Direct Bank Transfer</option><option value="2">Credit Card</option><option value="3">OTA</option></select>'),$(".modal-body #payment_submit").show()),$(".modal-body .payment_amount").html("Rp "+mytotalpayment),$(".modal-body .payment_bid").val(e),$(".modal-body #payment_sur").html("Rp "+mySur),$(".modal-body #book_date").val(t),$(".modal-body #book_date2").val(a),$(".modal-body #book_adult").val(mydewasa),myanak>0?$(".modal-body #book_anak").val(myanak):$(".modal-body #book_anak").val(),mybayi>0?$(".modal-body #book_bayi").val(mybayi):$(".modal-body #book_bayi").val(),$(".modal-body #book_depan").val(mydepan),$(".modal-body #book_akhir").val(myakhir),$(".modal-body #book_telepon").val(mytelepon),$(".modal-body #book_email").val(myemail),myguestcomment?$(".modal-body .guestcomment").val(myguestcomment):$(".modal-body .guestcomment").val("No guest comment."),mynotes?$(".modal-body .notes").val(mynotes):$(".modal-body .notes").val("No note."),$(".modal-body #bookingsource").val(bookingsource),$(".modal-body .idroom").val(idroom),$(".modal-body #idgrouproom").val(idgrouproom),$(".modal-body .idrate").val(idrate),$(".modal-header #book_name").html(o),$(".modal-footer #book_id").val(e),$(".modal-footer #guest_book_id").val(e),$(".modal-body #book_id2").val(e),$(".modal-footer #book_status").val(mystatus),$("#fact #totalroom").html("Rp "+mytotalroom),$("#fact #totalroominput").val(mytotalroom),$("#fact #totalextra").html("Rp "+mytotalextra),$("#fact #totalextrainput").val(mytotalextra),$("#fact #totalpayment").html("Rp "+mytotalpayment),$("#fact #totalpaymentinput").val(mytotalpayment),$("#fact #percentaxes").html("Rp "+mypercentaxes),$("#fact #percentaxesinput").val(mypercentaxes),$("#fact #idpayment").val(myidpayment),$(".modal-footer .payment_extras").val(myidpayment),invoice?($(".modal-body #invoice").html('<strong style="font-size:18pt">'+invoice+"</strong>"),$(".modal-body #invoice_info").html("Invoice number is ready")):($(".modal-body #invoice").html('<input type="submit" name="btn_generate" class="btn btn-primary" value="Generate Invoice">'),$(".modal-body #invoice_info").html("You have not generated an invoice yet."))}),$(function(){$(".draggable").draggable({containment:".tahu",cursor:"move",snap:".auto_grid",snapMode:"inner"}).resizable({snap:".auto_grid",snapMode:"inner",grid:[30,10],helper:"ui-resizable-helper",animate:!0,animateEasing:"easeOutBounce",handles:"e",containment:".tahu",stop:function(t,a){console.log("Simpan hasil resize ?")}}),$(".tahu").droppable({accept:".draggable",drop:function(t,a){alert("Simpan di sini ?"),console.log("Simpan hasil drop")},tolerance:"pointer"})}),$(function(){$(".draggable").droppable({tolerance:"touch",hoverClass:"DropTargetValid",drop:function(t,a){alert("Data sudah ada, cari room dan tanggal yang kosong ?");$(this).data("id");a.draggable.draggable("option","revert",!0),a.helper.data("dropped",!0),console.log($(this).data("id"))}}),$("#tahu").click(function(){$("#tahu").scroll()}),$(".alert-notif").fadeTo(3e3,500).slideUp(500,function(){$(".alert-notif").slideUp(500)}),$(window).on("load",function(){$("#modal").modal("show")})}),$(document).click(function(){$("#w").hide("fast")}),$("#w").click(function(t){t.stopPropagation()}),$(document).ready(function(){1==$(".incl_clone").length&&$("#incl_btnDel").attr("disabled","disabled"),$("#incl_btnAdd").click(function(){var t=$(".incl_clone").length,a=t+1,o=$("#incl_clone1").clone().attr("id","incl_clone"+a);o.find("#incl_sel_1 select").attr("id","incl_input1_"+a).attr("id","chanx_"+a).attr("data-id",a),o.find("#incl_it_1 input").attr("id","incl_input2_"+a).val("1"),o.find("#incl_qty_1 input").attr("id","incl_input3_"+a).val("1"),o.find("#incl_tot_1 input").attr("id","incl_input4_"+a).val("0"),o.find(".text #incl_input5_"+a).attr("id","incl_input5_"+a),$("#incl_clone"+t).after(o),$("#incl_btnDel").attr("disabled",!1),5==a&&$("#incl_btnAdd").attr("disabled","disabled")}),$("#incl_btnDel").click(function(){var t=$(".incl_clone").length;$("#incl_clone"+t).remove(),$("#incl_btnAdd").attr("disabled",!1),t-1==1&&$("#incl_btnDel").attr("disabled","disabled")}),1==$(".clonedInput").length&&$("#btnDel").attr("disabled","disabled"),$("#btnAdd").click(function(){var t=$(".clonedInput").length,a=t+1,o=$("#input1").clone().attr("id","input"+a);o.find("#input_sel_1 select").attr("id","name1_"+a).attr("id","chanx_"+a).attr("data-id",a),o.find("#input_it_1 input").attr("id","name2_"+a).val("1"),o.find("#input_qty_1 input").attr("id","name3_"+a).val("1"),o.find("#input_tot_1 input").attr("id","name4_"+a).val("0"),o.find(".otherz_1 #name5_"+a).attr("id","name5_"+a),$("#input"+t).after(o),$("#btnDel").attr("disabled",!1),5==a&&$("#btnAdd").attr("disabled","disabled")}),$("#btnDel").click(function(){var t=$(".clonedInput").length;$("#input"+t).remove(),$("#btnAdd").attr("disabled",!1),t-1==1&&$("#btnDel").attr("disabled","disabled")})}),$(".datepicker").datepicker({autoclose:!0}),$(".datepicker2").datepicker({autoclose:!0}),$("#updates").on("hidden.bs.modal",function(){location.reload()});/*$("form").submit(function(event){event.preventDefault();});$('#updates').on('show.bs.modal', function(){backdrop:'static',keyboard:false,})$('#addBookDialog').on('hidden.bs.modal',function(){location.reload();})*/
  832. </script>
  833. </body>
  834. </html>
Advertisement
Add Comment
Please, Sign In to add comment
Advertisement
Public Pastes
Advertisement
We use cookies for various purposes including analytics. By continuing to use Pastebin, you agree to our use of cookies as described in the Cookies Policy.  OK, I Understand
Not a member of Pastebin yet?
Sign Up, it unlocks many cool features!