@extends('template')
 @section('title', 'Data Isi Menu')
 @section('konten')
     <div class="main-panel">
         <div class="content">
             <div class="page-inner">
                 <div class="page-header">
                     <h4 class="page-title">Data Isi Menu</h4>
                     <ul class="breadcrumbs">
                         <li class="nav-home">
                             <a href="/dashboard">
                                 <i class="flaticon-home"></i>
                             </a>
                         </li>
                         <li class="separator">
                             <i class="flaticon-right-arrow"></i>
                         </li>
                         <li class="nav-item">
                             Data Isi Menu
                         </li>
                     </ul>
                 </div>
                 <div class="row">
                     <div class="col-md-12">
                         <div class="card">
                             <div class="card-header">
                                 <div class="card-title">Tambah Isi Menu</div>
                             </div>
                             <div class="card-body">
                                 <form method="POST" action="/insert_isi" enctype="multipart/form-data">
                                     @csrf
                                     <div class="modal-body">
                                         <div class="row">
                                             <div class="col-sm-12">
                                                 <div class="form-group">
                                                     <label>Judul Konten</label>
                                                     <input id="addName" name="judul_isi" type="text" class="form-control" placeholder="Judul Isi" required>
                                                 </div>
                                                 <div class="form-group">
                                                     <label>Kategori</label>
                                                     <select name="id_kategori" class="form-control" required>
                                                        <option value="">Pilih</option>
                                                        @foreach ($datakategori as $item)
                                                        <option value="{{$item->id_kategori}}">{{$item->nama_kategori}}</option>
                                                        @endforeach
                                                     </select>
                                                 </div>
                                                 <div class="form-group">
                                                     <label>Status</label>
                                                     <select name="status_menu" id="status_menu" onchange="status()" class="form-control" required>
                                                        <option value="">Pilih</option>
                                                        <option value="menu">Menu</option>
                                                        <option value="submenu">Submenu</option>
                                                     </select>
                                                 </div>
                                                 @foreach ($dataisi as $item)
                                                 @if ($item->status_menu=="menu")
                                                 <div class="form-group" style="display: none" id="form_kontenmenu">
                                                 <label>Pilih Menu</label>
                                                     <select name="id_menu" class="form-control" required>
                                                        <option value="">Pilih</option>
                                                        @foreach ($dataisi as $item)
                                                        <option value="{{$item->id_menu}}">{{$item->judul_menu}}</option>
                                                         @endforeach
                                                     </select>
                                                     <label>Konten</label>
                                                     <textarea class="form-control description" name="konten_menu"></textarea>
                                                 </div>
                                                 @else
                                                 <div class="form-group" style="display: none" id="form_judulsubmenu">
                                                 <label>Pilih SubMenu</label>
                                                     <select name="id_submenu" class="form-control" required>
                                                        <option value="">Pilih</option>
                                                        @foreach ($dataisi as $item)
                                                        <option value="{{$item->id_submenu}}">{{$item->judul_submenu}}</option>
                                                         @endforeach
                                                     </select>
                                                     <label>Judul Submenu</label>
                                                     <input name="judul_submenu" type="text" class="form-control" placeholder="Judul submenu">
                                                 </div>
                                                 <div class="form-group" style="display: none" id="form_kontensubmenu">
                                                     <label>Konten Submenu</label>
                                                     <textarea class="form-control description1" name="konten_submenu"></textarea>
                                                 </div>  @endif
                                                 @endforeach
                                             </div>
                                         </div>
                                     </div>
                                     <hr>
                                     <div class="modal-footer no-bd">
                                         <button type="submit" class="btn btn-primary btn-round">Simpan</button>
                                         <a href="/data_menu" class="btn btn-danger btn-round"
                                             data-dismiss="modal">Kembali</a>
                                     </div>
                                 </form>
                             </div>
                         </div>
                     </div>
                 </div>
             </div>
         </div>
         <footer class="footer">
             <div class="container-fluid">
                 <nav class="pull-left">
                     <ul class="nav">

                     </ul>
                 </nav>
                 <div class="copyright ml-auto">
                     &copycopyright 2026 - Perumda Air Minum Tirta Bahari
                 </div>
             </div>
         </footer>
     </div>
     <script src="{{ asset('assetsadmin') }}/js/tinymce.min.js"></script>
     <script>
         tinymce.init({
             selector: 'textarea.description',
             height: 300
         });
          tinymce.init({
             selector: 'textarea.description1',
             height: 300
         });
         function status() {
            var status=$("#status_menu").val();
            if(status=='menu'){
                $("#form_kontenmenu").css("display", "block");
                $("#form_judulsubmenu").css("display", "none");
                $("#form_kontensubmenu").css("display", "none");
                $('#konten_menu').prop('required',true);
                $('#judul_submenu').prop('required',false);
                $('#konten_submenu').prop('required',false);
            }else if(status=="submenu"){
                $("#form_kontenmenu").css("display", "none");
                $("#form_judulsubmenu").css("display", "block");
                $("#form_kontensubmenu").css("display", "block");
                $('#konten_menu').prop('required',false);
                $('#judul_submenu').prop('required',true);
                $('#konten_submenu').prop('required',true);
            }else{
                $("#form_kontenmenu").css("display", "none");
                $("#form_judulsubmenu").css("display", "none");
                $("#form_kontensubmenu").css("display", "none");
                $('#konten_menu').prop('required',false);
                $('#judul_submenu').prop('required',false);
                $('#konten_submenu').prop('required',false);
            }
         }
     </script>
 @endsection