Rafi
/
SAFIRA


			
							123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141142143144145146147148149150151152153154155156157158159160161162163164165166167168169170171172173174175176177178179180181182183184185186187188189190191192193194195196197198199200201202203204205206207208209210211212213214215216217218219220221222223224225226227228229230231232233234235236237238239240241242243244245246247248249250251252253254255256257258259260261262263264265266267268269270271272273274275276277278279280281282283284285286287288289290291292293294295296297298299300301302303304305306307308309310311312313314315316317318319320321322323324325326327328329330331332333334335336337338339340341342343344345346347348349350351352353354355356357358359360361362363364365366367368369370371372373374375376377378379380381382383384385386387388389390391392393394395396397398399400401402403404405406407408409410411412413414415416417418419420421422423424425426427428429430431432433434435436437438439440
							<!doctype html>

<html
  lang="en"
  class="light-style layout-navbar-fixed layout-menu-fixed layout-compact"
  dir="ltr"
  data-theme="theme-default"
  data-assets-path="../../assets/"
  data-template="vertical-menu-template">
  <head>
    <meta charset="utf-8" />
    <meta
      name="viewport"
      content="width=device-width, initial-scale=1.0, user-scalable=no, minimum-scale=1.0, maximum-scale=1.0" />

    <title>SAFIRA</title>

    <meta name="description" content="" />

    <!-- Favicon -->
    <link rel="icon" type="image/x-icon" href="../../assets/img/favicon/favicon.ico" />

    <!-- Fonts -->
    <link rel="preconnect" href="https://fonts.googleapis.com" />
    <link rel="preconnect" href="https://fonts.gstatic.com" crossorigin />
    <link
      href="https://fonts.googleapis.com/css2?family=Public+Sans:ital,wght@0,300;0,400;0,500;0,600;0,700;1,300;1,400;1,500;1,600;1,700&ampdisplay=swap"
      rel="stylesheet" />
      <link rel="stylesheet" href="https://stackpath.bootstrapcdn.com/bootstrap/4.4.0/css/bootstrap.min.css" integrity="sha384-SI27wrMjH3ZZ89r4o+fGIJtnzkAnFs3E4qz9DIYioCQ5l9Rd/7UAa8DHcaL8jkWt" crossorigin="anonymous">
      <link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/rateYo/2.3.2/jquery.rateyo.min.css">

    <!-- Icons -->
    <link rel="stylesheet" href="../../assets/vendor/fonts/fontawesome.css" />
    <link rel="stylesheet" href="../../assets/vendor/fonts/tabler-icons.css" />
    <link href='https://unpkg.com/css.gg@2.0.0/icons/css/menu-grid-o.css' rel='stylesheet'>
    <script src='https://kit.fontawesome.com/a076d05399.js' crossorigin='anonymous'></script>

    <!-- Core CSS -->
    <link rel="stylesheet" href="../../assets/vendor/css/rtl/core.css" class="template-customizer-core-css" />
    <link rel="stylesheet" href="../../assets/vendor/css/rtl/theme-default.css" class="template-customizer-theme-css" />
    <link rel="stylesheet" href="../../assets/css/demo.css" />
>
    <link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/font-awesome/5.15.4/css/all.min.css">
    <script src="https://cdn.jsdelivr.net/npm/chart.js"></script>
    <script src="https://cdn.jsdelivr.net/npm/chart.js@4.4.2/dist/chart.umd.min.js"></script>


    <!-- Helpers -->
    <script src="../../assets/vendor/js/helpers.js"></script>

    <script src="../../assets/vendor/js/template-customizer.js"></script>
    <!--? Config:  Mandatory theme config file contain global vars & default theme options, Set your preferred theme option in this file.  -->
    <script src="../../assets/js/config.js"></script>
    <script src="https://cdn.jsdelivr.net/npm/sweetalert2@11"></script>

  </head>

  <body>
    <!-- Layout wrapper -->
    <div class="layout-wrapper layout-content-navbar">
      <div class="layout-container">
        <!-- Menu -->

        <aside id="layout-menu" class="layout-menu menu-vertical menu bg-menu-theme">
          <div class="app-brand demo">
            <a href="#" class="app-brand-link">
                <span class="app-brand-logo demo" style="display: block; width: 60px; height: 60px;">
                    <img src="{{ asset('assets/img/icons/logo.png') }}" alt="icon" style="width: 100%; height: 100%;" />
                </span>

              <span class="app-brand-text demo menu-text fw-bold" style="font-size: 180%; margin-right:0%;">SAFIRA</span>
            </a>

            <a href="javascript:void(0);" class="layout-menu-toggle menu-link text-large ms-auto">
              <i class="ti menu-toggle-icon d-none d-xl-block ti-sm align-middle"></i>
              <i class="ti ti-x d-block d-xl-none ti-sm align-middle"></i>
            </a>
          </div>

          <div class="menu-inner-shadow"></div>
          <hr style="border-top: 1px solid black; width: 100%;"> <!-- Garis panjang hitam akan ditampilkan di sini -->

          <ul class="menu-inner py-1">
            <!-- Dashboards -->
            @if(Auth::user()->role === 'admin')
              <li class="menu-item {{ Request::is('dashboards*') ? ' active' : '' }}">
                  <a href="{{ route('admin.dashboards') }}" class="menu-link">
                      <i class="menu-icon tf-icons fa fa-home" style="font-size: 18px;"></i>
                      <div data-i18n="Dashboard">Dashboard</div>
                      <div class="badge bg-primary rounded-pill ms-auto"></div>
                  </a>
              </li>
              <li class="menu-item {{ Request::is('tindakan*') ? 'active' : '' }}">
                  <a href="{{ route('tindakan.index') }}" class="menu-link">
                      <i class="menu-icon tf-icons fas fa-tools" style="font-size: 18px;"></i>
                      <div data-i18n="Tindak Lanjut">Tindak Lanjut</div>
                      <div class="badge bg-primary rounded-pill ms-auto"></div>
                  </a>
              </li>
              <li class="menu-item {{ Request::is('apresiasi*') ? 'active' : '' }}">
                <a href="{{ route('apresiasi.adminIndex') }}" class="menu-link">
                    <i class="menu-icon tf-icons fa fa-thumbs-up" style="font-size: 18px;"></i>
                    <div data-i18n="Apresiasi">Pelaporan Apresiasi</div>
                    <div class="badge bg-primary rounded-pill ms-auto"></div>
                </a>
            </li>
              <li class="menu-item {{ Request::is('informasi*') ? 'active' : '' }}">
                <a href="{{ route('informasi.adminIndex') }}" class="menu-link">
                    <i class="menu-icon tf-icons fa fa-info-circle" style="font-size: 18px;"></i>
                    <div data-i18n="Informasi">Informasi</div>
                    <div class="badge bg-primary rounded-pill ms-auto"></div>
                </a>
              </li>
              <li class="menu-item {{ Request::is('user*') ? 'active' : '' }}">
                  <a href="{{ route('user.index') }}" class="menu-link">
                      <i class="menu-icon tf-icons fa fa-user" style="font-size: 18px;"></i>
                      <div data-i18n="Kelola User">Kelola User</div>
                      <div class="badge bg-primary rounded-pill ms-auto"></div>
                  </a>
              </li>
          @else
              <li class="menu-item {{ Request::is('dashboard*') ? ' active' : '' }}">
                  <a href="{{ route('users.dashboard') }}" class="menu-link">
                      <i class="menu-icon tf-icons fa fa-home" style="font-size: 18px;"></i>
                      <div data-i18n="Dashboard">Dashboard</div>
                      <div class="badge bg-primary rounded-pill ms-auto"></div>
                  </a>
              </li>
              <li class="menu-item {{ Request::is('pelaporan*') ? 'active' : '' }}">
                  <a href="{{ route('pelaporan.index') }}" class="menu-link">
                      <i class="menu-icon tf-icons fa fa-exclamation-triangle" style="font-size: 18px;"></i>
                      <div data-i18n="Pelaporan">Pelaporan Bahaya</div>
                      <div class="badge bg-primary rounded-pill ms-auto"></div>
                  </a>
              </li>
              <li class="menu-item {{ Request::is('apresiasi*') ? 'active' : '' }}">
                <a href="{{ route('apresiasi.userIndex') }}" class="menu-link">
                    <i class="menu-icon tf-icons fa fa-thumbs-up" style="font-size: 18px;"></i>
                    <div data-i18n="Apresiasi">Pelaporan Apresiasi</div>
                    <div class="badge bg-primary rounded-pill ms-auto"></div>
                </a>
            </li>
              <li class="menu-item {{ Request::is('informasi*') ? 'active' : '' }}">
                <a href="{{ route('informasi.userIndex') }}" class="menu-link">
                    <i class="menu-icon tf-icons fa fa-info-circle" style="font-size: 18px;"></i>
                    <div data-i18n="Informasi">Informasi</div>
                    <div class="badge bg-primary rounded-pill ms-auto"></div>
                </a>
            </li>
          @endif
        <li class="menu-item {{ Request::is('riwayat*') ? 'active' : '' }}">
            <a href="{{ route('riwayat.index') }}" class="menu-link">
                <i class="menu-icon tf-icons fa fa-receipt" style="font-size: 18px;"></i>
                <div data-i18n="Riwayat Pelaporan">Riwayat Pelaporan</div>
                <div class="badge bg-primary rounded-pill ms-auto"></div>
            </a>
        </li>
        <li class="menu-item {{ Request::is('panduan*') ? 'active' : '' }}">
            <a href="{{ route('panduan.index') }}" class="menu-link">
                <i class="menu-icon tf-icons fa fa-question-circle" style="font-size: 18px;"></i>
                <div data-i18n="Panduan">Panduan</div>
                <div class="badge bg-primary rounded-pill ms-auto"></div>
            </a>
        </li>
          </ul>
        </aside>
        <!-- / Menu -->

        <!-- Layout container -->
        <div class="layout-page">
          <!-- Navbar -->

          <nav
            class="layout-navbar container-xxl navbar navbar-expand-xl navbar-detached align-items-center bg-navbar-theme"
            id="layout-navbar">
            <div class="layout-menu-toggle navbar-nav align-items-xl-center me-3 me-xl-0 d-xl-none">
              <a class="nav-item nav-link px-0 me-xl-4" href="javascript:void(0)">
                <i class="ti ti-menu-2 ti-sm"></i>
              </a>
            </div>

            <div class="navbar-nav-right d-flex align-items-center" id="navbar-collapse">
              <!-- Search -->
              <div class="navbar-nav align-items-center">
                <div class="nav-item navbar-search-wrapper mb-0">
                  <a class="nav-item nav-link search-toggler d-flex align-items-center px-0" href="javascript:void(0);">
                    <i class="ti ti-search ti-md me-2"></i>
                    <span class="d-none d-md-inline-block text-muted">Search (Ctrl+/)</span>
                  </a>
                </div>
              </div>
              <!-- /Search -->

              <ul class="navbar-nav flex-row align-items-center ms-auto">

                <!-- Style Switcher -->
                <li class="nav-item dropdown-style-switcher dropdown me-2 me-xl-0">
                  <a class="nav-link dropdown-toggle hide-arrow" href="javascript:void(0);" data-bs-toggle="dropdown">
                    <i class="ti ti-md"></i>
                  </a>
                  <ul class="dropdown-menu dropdown-menu-end dropdown-styles">
                    <li>
                      <a class="dropdown-item" href="javascript:void(0);" data-theme="light">
                        <span class="align-middle"><i class="ti ti-sun me-2"></i>Light</span>
                      </a>
                    </li>
                    <li>
                      <a class="dropdown-item" href="javascript:void(0);" data-theme="dark">
                        <span class="align-middle"><i class="ti ti-moon me-2"></i>Dark</span>
                      </a>
                    </li>
                    <li>
                      <a class="dropdown-item" href="javascript:void(0);" data-theme="system">
                        <span class="align-middle"><i class="ti ti-device-desktop me-2"></i>System</span>
                      </a>
                    </li>
                  </ul>
                </li>
                <!-- / Style Switcher-->
                <!-- Notification -->
                    <li class="nav-item dropdown-notifications navbar-dropdown dropdown me-3 me-xl-1">
                        @php
                            $count = $laporan->count();
                        @endphp
                        <a
                            class="nav-link dropdown-toggle hide-arrow"
                            href="javascript:void(0);"
                            data-bs-toggle="dropdown"
                            data-bs-auto-close="outside"
                            aria-expanded="false">
                            <i class="ti ti-bell ti-md"></i>
                            <span class="badge bg-danger rounded-pill badge-notifications">{{$count}}</span>
                        </a>
                        <ul class="dropdown-menu dropdown-menu-end py-0">
                            <li class="dropdown-menu-header border-bottom">
                            <div class="dropdown-header d-flex align-items-center py-3">
                                <h5 class="text-body mb-0 me-auto">Notification</h5>
                                <a
                                href="javascript:void(0)"
                                class="dropdown-notifications-all text-body"
                                data-bs-toggle="tooltip"
                                data-bs-placement="top"
                                title="Mark all as read"
                                ><i class="ti ti-mail-opened fs-4"></i
                                ></a>
                            </div>
                            </li>
                            @if(Auth::user()->role === 'admin')
                                <li class="dropdown-notifications-list scrollable-container">
                                    <div style="max-height: 300px; overflow-y: scroll;">
                                            @foreach ($laporan as $laporan)
                                                <ul class="list-group list-group-flush">
                                                    <li class="list-group-item list-group-item-action dropdown-notifications-item">
                                                        <div class="d-flex">
                                                            <div class="flex-shrink-0 me-3">
                                                                <div class="avatar">
                                                                    <img src="{{Auth::user()->foto}}" alt class="h-auto rounded-circle" />
                                                                </div>
                                                            </div>
                                                            <div class="flex-grow-1">
                                                                <h6 class="mb-1"><b>Laporan Baru</b></h6>
                                                                <p class="mb-0">Laporan baru masuk mengenai {{$laporan->judul}} dari {{$laporan->user_id}} di lokasi {{$laporan->lokasi}} dengan rentan bahaya {{$laporan->status}}</p>
                                                                <small class="text-muted">{{$laporan->tanggal}}</small>
                                                            </div>

                                                                <div class="flex-shrink-0 dropdown-notifications-actions">
                                                                    <a href="javascript:void(0)" class="dropdown-notifications-read"><span class="badge badge-dot"></span></a>
                                                                    <a href="javascript:void(0)" class="dropdown-notifications-archive"><span class="ti ti-x"></span></a>
                                                                </div>
                                                        </div>
                                                    </li>
                                                </ul>
                                            @endforeach
                                    </div>
                                </li>
                                <li class="dropdown-menu-footer border-top">
                                    <a
                                        href="{{route('tindakan.index')}}"
                                        class="dropdown-item d-flex justify-content-center text-primary p-2 h-px-40 mb-1 align-items-center">
                                        View all notifications
                                    </a>
                                </li>

                            @elseif (Auth::user()->role === 'user')
                            <li class="dropdown-notifications-list scrollable-container">
                                <div style="max-height: 300px; overflow-y: scroll;">
                                        @foreach ($laporan as $laporan)
                                            <ul class="list-group list-group-flush">
                                                <li class="list-group-item list-group-item-action dropdown-notifications-item">
                                                    <div class="d-flex">
                                                        <div class="flex-shrink-0 me-3">
                                                            <div class="avatar">
                                                                <img src="{{Auth::user()->foto}}" alt class="h-auto rounded-circle" />
                                                            </div>
                                                        </div>
                                                        <div class="flex-grow-1">
                                                            <h6 class="mb-1"><b>Tanggarapn Laporan</b></h6>
                                                            <p class="mb-0">Laporan kamu mengenai {{$laporan->judul}} di lokasi {{$laporan->lokasi}} dengan rentan bahaya {{$laporan->status}} masuk fase {{$laporan->tindakan->statusTindakan}}</p>
                                                            <small class="text-muted">{{$laporan->tanggal}}</small>
                                                        </div>

                                                            <div class="flex-shrink-0 dropdown-notifications-actions">
                                                                <a href="javascript:void(0)" class="dropdown-notifications-read"><span class="badge badge-dot"></span></a>
                                                                <a href="javascript:void(0)" class="dropdown-notifications-archive"><span class="ti ti-x"></span></a>
                                                            </div>
                                                    </div>
                                                </li>
                                            </ul>
                                        @endforeach
                                </div>
                            </li>
                            <li class="dropdown-menu-footer border-top">
                                <a
                                    href="{{route('pelaporan.index')}}"
                                    class="dropdown-item d-flex justify-content-center text-primary p-2 h-px-40 mb-1 align-items-center">
                                    View all notifications
                                </a>
                            </li>
                            @endif
                        </ul>
                    </li>
                <!--/ Notification -->

                <!-- User -->
                <li class="nav-item navbar-dropdown dropdown-user dropdown">
                  <a class="nav-link dropdown-toggle hide-arrow" href="javascript:void(0);" data-bs-toggle="dropdown">
                    <div class="avatar avatar-online">
                      <img src="{{Auth::user()->foto}}" alt class="h-auto rounded-circle" />
                    </div>
                  </a>
                  <ul class="dropdown-menu dropdown-menu-end">
                    <li>
                      <a class="dropdown-item" href="pages-account-settings-account.html">
                        <div class="d-flex">
                          <div class="flex-shrink-0 me-3">
                            <div class="avatar avatar-online">
                              <img src="{{Auth::user()->foto}}" alt class="h-auto rounded-circle" />
                            </div>
                          </div>
                          <div class="flex-grow-1">
                            <span class="fw-medium d-block">{{Auth::user()->name}}</span>
                            <small class="text-muted">{{Auth::user()->role}}</small>
                          </div>
                        </div>
                      </a>
                    </li>
                    <li>
                      <div class="dropdown-divider"></div>
                    </li>
                    <li>
                        <a class="dropdown-item" href="{{ route('profile.index') }}">
                            <i class="ti ti-user me-2 ti-sm"></i>
                            <span class="align-middle">Profile</span>
                        </a>

                      </li>
                    <li>
                      <a class="dropdown-item" href="{{ route('logout') }}">
                        <i class="ti ti-logout me-2 ti-sm"></i>
                        <span class="align-middle">Log Out</span>
                      </a>
                    </li>
                  </ul>
                </li>
                <!--/ User -->
              </ul>
            </div>

            <!-- Search Small Screens -->
            <div class="navbar-search-wrapper search-input-wrapper d-none">
              <input
                type="text"
                class="form-control search-input container-xxl border-0"
                placeholder="Search..."
                aria-label="Search..." />
              <i class="ti ti-x ti-sm search-toggler cursor-pointer"></i>
            </div>
          </nav>

          <!-- / Navbar -->

          <!-- Content wrapper -->
          <div class="content-wrapper">
            <!-- Content -->

            <div class="container-xxl flex-grow-1 container-p-y">
              @yield("content")
            </div>
            <!-- / Content -->

            <!-- Footer -->
            <footer class="content-footer footer bg-footer-theme">
              <div class="container-xxl">
                <div
                  class="footer-container d-flex align-items-center justify-content-between py-2 flex-md-row flex-column">
                  <div>
                    ©
                    <script>
                      document.write(new Date().getFullYear());
                    </script>
                  </div>
                </div>
              </div>
            </footer>
            <!-- / Footer -->

            <div class="content-backdrop fade"></div>
          </div>
          <!-- Content wrapper -->
        </div>
        <!-- / Layout page -->
      </div>

      <!-- Overlay -->
      <div class="layout-overlay layout-menu-toggle"></div>

      <!-- Drag Target Area To SlideIn Menu On Small Screens -->
      <div class="drag-target"></div>
    </div>
    <!-- / Layout wrapper -->

    <!-- Core JS -->
    <!-- build:js assets/vendor/js/core.js -->

    <script src="../../assets/vendor/libs/jquery/jquery.js"></script>
    <script src="../../assets/vendor/js/bootstrap.js"></script>
    <script src="../../assets/vendor/js/menu.js"></script>

    <!-- endbuild -->

    <!-- Main JS -->
    <script src="../../assets/js/main.js"></script>
    <link href="https://cdnjs.cloudflare.com/ajax/libs/select2/4.0.13/css/select2.min.css" rel="stylesheet">
    <script src="https://cdnjs.cloudflare.com/ajax/libs/select2/4.0.13/js/select2.min.js"></script>
    @include('sweetalert::alert')
    <!-- Page JS -->
    <script src="../../assets/js/dashboards-analytics.js"></script>
  </body>
</html>