spota-dev/konsultasi/mahasiswa/layout/_konsultasi.php

<div class="ui container" name="tabContent" id="konsultasi">
  <h3 class="ui blue header">Tugas Akhir Saya</h3>
  <table class="ui blue table" id="tabelTugasAkhir">
    <thead>
      <th>No.</th>
      <th>Judul</th>
      <th>Semester</th>
      <th>Detail</th>
    </thead>
    <tbody></tbody>
  </table>
</div>

<div class="ui small modal" id="konsultasiModal">
  <i class="close icon"></i>
  <div class="header" id="judulFormKonsultasi">
    -
  </div>
  <div class="scrolling content">
    <div class="ui form" id="formKonsultasi">
        <div class="field">
            <label>Tanggal</label>
            <div class="ui calendar" id="dateKonsultasiCalendar">
              <div class="ui input left icon">
                <i class="calendar icon"></i>
                <input
                  type="text"
                  placeholder="Tanggal"
                  name="dateKonsultasiField"
                  id="dateKonsultasiField"
                  onkeydown="return false; return false;"
                  autocomplete="off"
                />
              </div>
            </div>
        </div>
      <div class="field">
        <label for="topikField">Topik</label>
        <textarea name="topikField" rows="2"></textarea>
      </div>
    </div>
  </div>
  <div class="actions">
    <div class="ui cancel button">BATAL</div>
    <div class="ui positive button">SIMPAN</div>
  </div>
</div>

<div class="ui fullscreen modal" id="detailKonsultasiModal">
  <i class="close icon"></i>
  <div class="header">
    Detail Konsultasi
  </div>
  <div class="content">
    <div class="ui form">
      <div class="two fields">
        <div class="field">
          <label>Konsultasi ke-</label>
          <span id="detailKonsulKe"></span>
        </div>
        <div class="field">
          <label>Topik</label>
          <div id="detailKonsulTopik" style="white-space:pre-wrap;"></div>
        </div>
      </div>
      <div class="two fields">
        <div class="field">
          <label>Pembimbing 1</label>
          <span id="detailKonsulPemb1"></span>
          <label for="">Catatan</label>
          <span id="catatanPemb1"></span>
        </div>
        <div class="field">
          <label>Pembimbing 2</label>
          <span id="detailKonsulPemb2"></span>
          <label for="">Catatan</label>
          <span id="catatanPemb2"></span>
        </div>
      </div>
    </div>
  </div>
</div>

<div class="ui fullscreen modal" id="detailTugasAkhirModal">
  <i class="close icon"></i>
  <div class="header">
    Detail Tugas Akhir
  </div>
  <div class="scrolling content">
    <div class="ui stackable grid">
      <div class="eight wide column">
        <div class="ui form">
          <div class="field">
            <label for="judulTugasAkhir">Judul</label>
            <span id="judulTugasAkhir"></span>
          </div>
          <div class="two fields">
            <div class="field">
              <label for="semTATugasAkhir">Semester/Tahun Ajaran</label>
              <span id="semTATugasAkhir"></span>
            </div>
            <div class="field">
              <label for="waktuKepTugasAkhir">Tanggal Keputusan</label>
              <span id="waktuKepTugasAkhir"></span>
            </div>
          </div>
          <div class="two fields">
            <div class="field">
              <label for="pemb1TugasAkhir">Pembimbing 1</label>
              <span id="pemb1TugasAkhir"></span>
            </div>
            <div class="field">
              <label for="pemb2TugasAkhir">Pembimbing 2</label>
              <span id="pemb2TugasAkhir"></span>
            </div>
          </div>
          <div class="two fields">
            <div class="field">
              <label for="peng1TugasAkhir">Penguji 1</label>
              <span id="peng1TugasAkhir"></span>
            </div>
            <div class="field">
              <label for="peng2TugasAkhir">Penguji 2</label>
              <span id="peng2TugasAkhir"></span>
            </div>
          </div>
        </div>
      </div>
      <div class="eight wide column">
      <div class="ui secondary menu">
        <div class="item">
          <h4 class="ui blue header">Konsultasi</h4>
        </div>
        <div class="right menu">
          <div class="item">
            <button class="ui orange icon button" title="Cetak File B4" onClick="cetakB4()" style="margin-right:1rem"><i class="ui file icon"></i> B4</button>    
            <button class="ui blue icon button" title="Tambah Data Konsultasi" onClick="showTambahKonsultasiModal()"><i class="ui plus icon"></i></button>
          </div>
        </div>
      </div>
        <table class="ui blue selectable definition celled table" id="tabelListKonsultasi">
          <thead>
            <tr>
              <th>Ke-</th>
              <th>Tanggal</th>
              <th>Topik</th>
              <th>Pemb. 1</th>
              <th>Pemb. 2</th>
              <th>Aksi</th>
            </tr>
          </thead>
          <tbody></tbody>
        </table>
      </div>
    </div>
  </div>
</div>