sunrise-cms/views/admin-tables.ejs

<%- include('_header'); -%>

<div class="columns is-mobile">
  <div class="column is-2-desktop is-narrow-touch is-hidden-print">
    <%- include('_menu-admin'); -%>
  </div>
  <div class="column">
    <nav class="breadcrumb">
      <ul>
        <li><a href="<%= urlPrefix %>/dashboard">Home</a></li>
        <li>
          <a href="#">
            <span class="icon is-small"><i class="fas fa-cog" aria-hidden="true"></i></span>
            <span>Administrator Tools</span>
          </a>
        </li>
        <li class="is-active">
          <a href="#" aria-current="page">
            Config Table Management
          </a>
        </li>
      </ul>
    </nav>
    
    <h1 class="title is-1">
      Config Table Management
    </h1>

    <div class="message is-warning">
      <div class="message-body">
        <strong>Never change the meaning of the values in these tables.</strong><br />
        When in doubt, create a new value instead of changing an existing one.
      </div>
    </div>
    
    <div class="panel">
      <div class="panel-heading">
        <div class="level is-mobile">
          <div class="level-left">
            <div class="level-item">
              <button class="button is-small is-toggle-button" data-tooltip="Toggle Work Order Types" type="button" aria-label="Toggle Work Order Types">
                <span class="icon">
                  <i class="fas fa-plus" aria-hidden="true"></i>
                </span>
              </button>
            </div>
            <div class="level-item">
              <h2 class="title is-5 has-text-white">Work Order Types</h2>
            </div>
          </div>
        </div>
      </div>
      <div class="panel-block is-hidden">
        <table class="table is-striped is-hoverable has-sticky-header">
          <thead>
            <tr>
              <th>Work Order Type</th>
              <th class="has-text-centered has-width-1">Options</th>
            </tr>
          </thead>
          <tbody>
            <tr>
              <td colspan="2">
                <form id="form--addWorkOrderType">
                  <div class="field has-addons">
                    <div class="control is-expanded">
                      <input class="input" name="workOrderType" type="text" maxlength="100" placeholder="New Work Order Type" required />
                    </div>
                    <div class="control">
                      <button class="button is-success has-tooltip-bottom" data-tooltip="Add Work Order Type" type="submit" aria-label="Add Work Order Type">
                        <span class="icon"><i class="fas fa-plus" aria-hidden="true"></i></span>
                      </button>
                    </div>
                  </div>
                </form>
              </td>
            </tr>
          </tbody>
          <tbody id="container--workOrderTypes"></tbody>
        </table>
      </div>
    </div>

    <div class="panel">
      <div class="panel-heading">
        <div class="level is-mobile">
          <div class="level-left">
            <div class="level-item">
              <button class="button is-small is-toggle-button" data-tooltip="Toggle Work Order Milestone Types" type="button" aria-label="Toggle Work Order Milestone Types">
                <span class="icon">
                  <i class="fas fa-plus" aria-hidden="true"></i>
                </span>
              </button>
            </div>
            <div class="level-item">
              <h2 class="title is-5 has-text-white">Work Order Milestone Types</h2>
            </div>
          </div>
        </div>
      </div>
      <div class="panel-block is-block is-hidden">
        <table class="table is-striped is-hoverable has-sticky-header">
          <thead>
            <tr>
              <th>Work Order Milestone Type</th>
              <th class="has-text-centered has-width-1">Options</th>
            </tr>
          </thead>
          <tbody>
            <tr>
              <td colspan="2">
                <form id="form--addWorkOrderMilestoneType">
                  <div class="field has-addons">
                    <div class="control is-expanded">
                      <input class="input" name="workOrderMilestoneType" type="text" maxlength="100" placeholder="New Milestone Type" required />
                    </div>
                    <div class="control">
                      <button class="button is-success has-tooltip-bottom" data-tooltip="Add Work Order Milestone Type" type="submit" aria-label="Add Work Order Milestone Type">
                        <span class="icon"><i class="fas fa-plus" aria-hidden="true"></i></span>
                      </button>
                    </div>
                  </div>
                </form>
              </td>
            </tr>
          </tbody>
          <tbody id="container--workOrderMilestoneTypes"></tbody>
        </table>
      </div>
    </div>

    <div class="panel">
      <div class="panel-heading">
        <div class="level is-mobile">
          <div class="level-left">
            <div class="level-item">
              <button class="button is-small is-toggle-button" data-tooltip="Toggle Burial Site Statuses" type="button" aria-label="Toggle Burial Site Statuses">
                <span class="icon">
                  <i class="fas fa-plus" aria-hidden="true"></i>
                </span>
              </button>
            </div>
            <div class="level-item">
              <h2 class="title is-5 has-text-white">Burial Site Statuses</h2>
            </div>
          </div>
        </div>
      </div>
      <div class="panel-block is-block is-hidden">
        <table class="table is-striped is-hoverable has-sticky-header">
          <thead>
            <tr>
              <th>Burial Site Status</th>
              <th class="has-text-centered has-width-1">Options</th>
            </tr>
          </thead>
          <tbody>
            <tr>
              <td colspan="2">
                <form id="form--addBurialSiteStatus">
                  <div class="field has-addons">
                    <div class="control is-expanded">
                      <input class="input" name="burialSiteStatus" type="text" maxlength="100" placeholder="New Burial Site Status" required />
                    </div>
                    <div class="control">
                      <button class="button is-success has-tooltip-bottom" data-tooltip="Add Status" type="submit" aria-label="Add Status">
                        <span class="icon"><i class="fas fa-plus" aria-hidden="true"></i></span>
                      </button>
                    </div>
                  </div>
                </form>
              </td>
            </tr>
          </tbody>
          <tbody id="container--burialSiteStatuses"></tbody>
        </table>
      </div>
    </div>
  </div>
</div>

<%- include('_footerA'); -%>

<script>
  exports.workOrderTypes = <%- JSON.stringify(workOrderTypes) %>;
  exports.workOrderMilestoneTypes = <%- JSON.stringify(workOrderMilestoneTypes) %>;
  exports.burialSiteStatuses = <%- JSON.stringify(burialSiteStatuses) %>;
</script>

<script src="<%= urlPrefix %>/javascripts/tables.admin.js"></script>

<script src="<%= urlPrefix %>/javascripts/burialSiteStatuses.admin.js"></script>
<script src="<%= urlPrefix %>/javascripts/workOrderMilestoneTypes.admin.js"></script>
<script src="<%= urlPrefix %>/javascripts/workOrderTypes.admin.js"></script>

<%- include('_footerB'); -%>