<?php defined('BASEPATH') or exit('No direct script access allowed'); ?>

<!DOCTYPE html>
<html lang="en">

<head>
  <meta charset="utf-8">
  <title>Welcome to CodeIgniter</title>
  <link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.7/css/bootstrap.min.css" integrity="sha384-BVYiiSIFeK1dGmJRAkycuHAHRg32OmUcww7on3RYdg4Va+PmSTsz/K68vbdEjh4u" crossorigin="anonymous">
  <link rel="stylesheet" type="text/css" href="<?php echo base_url(); ?>css/calendar.css">
  <style type="text/css">
    .page-container {
      background: #e0e0e07d;
    }

    /* Ad-hoc fix of schedule-calendar, slim-scroll does not work properly */
    .slimScrollDiv,
    #schedule-calendar {
      height: auto !important;
    }
  </style>
</head>

<body>
  <div id="page-schedule-calendar" class="page-body">
    <div class="widget">
      <div class="widget-body" style="height: auto;" <?php if (isset($_data_action)) echo 'data-action="' . $_data_action . '"'; ?>>
      <div class="ul-table-toolbar-container">
        <a class="btn-filter-expand" style="display: inline-block; height: 33px; width: 33px; text-align: center; position: absolute; top: 6px; right: 20px; z-index: 20;">
          <i class="glyphicon glyphicon-chevron-down" style="font-size: 15px;display: inline-block;margin: auto;line-height: 33px;"></i>
        </a>
        <ul class="table-toolbar table-toolbar-1 calendar-toolbar nobackground noborder">
          <li>
            <span>時間模式1：</span>
            <select class="schedule-calendar-mode select2-mode no-search-bar" data-mode="display">
              <option value="d" selected=""> 日 </option>
              <option value="w"> 星期 </option>
              <option value="m"> 月</option>
            </select>
          </li>
          <li>
            <span>顯示模式：</span>
            <select class="schedule-calendar-mode select2-mode no-search-bar" data-mode="display-resource">
              <option value="pic"> 美容師 </option>
              <option value="room"> 房間 </option>
            </select>
          </li>
          <li>
            <div class="vertical-spinbox">
              <a class="btn-value-left"><i class="glyphicon glyphicon-triangle-left"></i></a>
              <div class="input-box">
                <span>日期：</span>
                <div class="input-group">
                  <input class="form-control date-picker" type="text" data-date-format="yyyy-mm-dd">
                </div>
              </div>
              <a class="btn-value-right"><i class="glyphicon glyphicon-triangle-right"></i></a>
            </div>

          </li>
          <li>
            <span>客戶：</span>
            <div class="input-group no-icon">
              <input class="form-control schedule-calendar-mode" type="text" data-mode="student">
            </div>
          </li>
          <li>
            <span>星期日：</span>
            <input class="schedule-calendar-mode" type="checkbox" data-mode="sundays">
          </li>
        </ul>
      </div>
        <div id="schedule-calendar">
          <table class="schedule-calendar"></table>
        </div>
      </div>
    </div>
  </div>

  <script>
    <?php if (isset($_json)) : ?>
      const _json = <?php echo $_json; ?>;
    <?php endif; ?>
    <?php if (isset($_events)) : ?>
      const _events = <?php echo $_events; ?>;
    <?php endif; ?>
    <?php if (isset($_resources)) : ?>
      const _resources = <?php echo $_resources; ?>;
    <?php endif; ?>
  </script>

  <script src="https://cdn.jsdelivr.net/npm/jquery@3.3.1/dist/jquery.min.js"></script>
  <script src="https://cdn.jsdelivr.net/npm/bootstrap@3.3.7/dist/js/bootstrap.min.js"></script>
  <script src="https://cdnjs.cloudflare.com/ajax/libs/moment.js/2.24.0/moment.min.js"></script>
  <script src="https://cdn.jsdelivr.net/npm/moment@2.22.1/min/moment-with-locales.min.js"></script>
  <script src="https://cdnjs.cloudflare.com/ajax/libs/jQuery-slimScroll/1.3.8/jquery.slimscroll.min.js"></script>
  <script type='text/javascript' src="<?php echo base_url(); ?>js/vendors/bootstrap-datepicker.js"></script>
  <script type='text/javascript' src="<?php echo base_url(); ?>js/calendar.js"></script>
</body>

</html>