@extends('admin/institute-management/institute-profile/index')

@section('main-content-tab')
<form action="{{route('institute.profile.department.store', $slug)}}" class="form mb-15" name="institute" method="POST" id="kt_contact_form" enctype="multipart/form-data">
    @csrf

    @php
        if($institute->instituteBasic->institute_type == 2){
            echo '<h1 class="fw-bolder text-dark mb-9">Add Course</h1>';
        } else {

            echo '<h1 class="fw-bolder text-dark mb-9">Add Department</h1>';
        }
    @endphp

    <!--begin::Input group-->
    <div class="row mb-3">
    <!--begin::Col-->
        <div class="col-md-6 pe-lg-10">
            <!--begin::Form-->
            <div class="ui-widget">
            </div>
            <div class="d-flex flex-column mb-5 fv-row">
                <!--begin::Label-->
                <label class="required fs-5 fw-bold mb-2">Title (EN)</label>
                <!--end::Label-->
                <!--begin::Input-->
                {{-- <input value="{{old('title')}}" type="text" class="form-control form-control-solid" placeholder="Enter Department Name (EN)" name="title" autocomplete="off"/> --}}
                <input id="prev_dept" name="prev_dept" type="hidden">
                <input name="title" id="tags" class="form-control form-control-solid" placeholder="Enter Title (EN)"  autocomplete="off">
                @if($errors->has('title'))
                    <span class="text-danger">{{ $errors->first('title') }}</span>
                @endif
                <!--end::Input-->
            </div>
            <div class="d-flex flex-column mb-5 fv-row">
                <!--begin::Label-->
                <label class="fs-5 fw-bold mb-2">Title (BN)</label>
                <!--end::Label-->
                <!--begin::Input-->
                <input value="{{old('title_bn')}}" type="text" class="form-control form-control-solid" placeholder="Enter Title (BN)" name="title_bn" autocomplete="off"/>
                @if($errors->has('title_bn'))
                    <span class="text-danger">{{ $errors->first('title_bn') }}</span>
                @endif

                <!--end::Input-->
            </div>
            <div class="d-flex flex-column mb-5 fv-row">
                <!--begin::Label-->
                <label class="required fs-5 fw-bold mb-2">Course Name (EN)</label>
                <!--end::Label-->
                <!--begin::Input-->
                <input value="{{old('course_name')}}" type="text" class="form-control form-control-solid" placeholder="Enter course name (EN)" name="course_name" autocomplete="off"/>
                @if($errors->has('course_name'))
                    <span class="text-danger">{{ $errors->first('course_name') }}</span>
                @endif

                <!--end::Input-->
            </div>
            <div class="d-flex flex-column mb-5 fv-row">
                <!--begin::Label-->
                <label class="fs-5 fw-bold mb-2">Course Name (BN)</label>
                <!--end::Label-->
                <!--begin::Input-->
                <input value="{{old('course_name_bn')}}" type="text" class="form-control form-control-solid" placeholder="Enter course name (BN)" name="course_name_bn" autocomplete="off"/>
                @if($errors->has('course_name_bn'))
                    <span class="text-danger">{{ $errors->first('course_name_bn') }}</span>
                @endif

                <!--end::Input-->
            </div>
            <div class="d-flex flex-column mb-5 fv-row">
                <label class="fs-5 fw-bold mb-2">Description (EN)</label>
                <textarea name="description" id="description" class="summernote form-control form-control-solid" placeholder="Enter Description (EN)" autocomplete="off">{{old('description', '')}}</textarea>
                @if($errors->has('description'))
                    <span class="text-danger">{{ $errors->first('description') }}</span>
                @endif
            </div>
            <div class="d-flex flex-column mb-5 fv-row">
                <label class="fs-5 fw-bold mb-2">Description (BN)</label>
                <textarea name="description_bn" id="description_bn" class="summernote form-control form-control-solid" placeholder="Enter Description (BN)" autocomplete="off">{{old('description_bn', '')}}</textarea>
                @if($errors->has('description_bn'))
                    <span class="text-danger">{{ $errors->first('description_bn') }}</span>
                @endif
            </div>
            <div class="d-flex mb-5 fv-row">
                <label class="form-check form-switch form-check-custom form-check-solid">
                    <span class="required form-check-label fw-bold text-muted" style="margin-right: 10px;margin-left: 0px;">Status</span>
                    <input class="form-check-input radio-btn" name="status" type="checkbox" value="1" checked="checked" />
                </label>
                <!--end::Switch-->
            </div>
            <div class="d-flex">
                <a style="margin-right:5px;" href="{{route('institute.profile.department', $slug)}}" class="btn btn-secondary">Back</a>
                <button type="submit" class="btn btn-primary" id="kt_contact_submit_button">
                    <!--begin::Indicator-->
                    <span class="indicator-label">Add</span>
                </button>
            </div>
            <!--end::Form-->
        </div>
    </div>

    <!--end::Submit-->
</form>
@endsection

@section('extra-extra-css')
    <link rel="stylesheet" href="{{ asset('summernote/summernote.css') }}">
    <link rel="stylesheet" href="{{ asset('css/dropify.min.css') }}">
@endsection

@section('extra-extra-script')
<link rel="stylesheet" href="//code.jquery.com/ui/1.13.2/themes/base/jquery-ui.css">
  <link rel="stylesheet" href="/resources/demos/style.css">
  <script src="https://code.jquery.com/jquery-3.6.0.js"></script>
  <script src="https://code.jquery.com/ui/1.13.2/jquery-ui.js"></script>

    <script src="{{ asset('js/jquery.validate.js') }}"></script>
    <script src="{{ asset('js/dropify.min.js') }}"></script>
    <script src="{{ asset('summernote/summernote.min.js') }}"></script>
    <script src="{{ asset('js/popper.min.js') }}"></script>
    <script>
        var departments = {!! json_encode($department) !!};
        // console.log('department', sites)

        $( function() {
            var availableTags = []
            departments.map((value)=>{
                availableTags.push(
                    {
                        value: value.title,
                        label: value.title,
                        id: value.id,
                    },
                )
            })
            $( "#tags" ).autocomplete({
                source: availableTags,
                select: function( event, ui ) {
                    $( "#prev_dept" ).val(ui.item.id)
                }
            });
        } );
    </script>
    //validate form
    <script>
        $(function() {
            $("form[name='institute']").validate({
                ignore: ".note-editable.panel-body",
                rules: {
                    course_name:'required',
                    title:'required',
                },
                messages: {
                    course_name: "Course Name is required.",
                    title: "Department Name is required.",
                },
                submitHandler: function(form) {
                form.submit();
                }
            });
        });
    </script>
    <script type="text/javascript">
        $(document).ready(function() {
            $('.summernote').summernote({
                height: 200,
                popover: {
                    image: [],
                    link: [],
                    air: []
                }
            });
        });
    </script>
    <script>
        $(document).ready(function(){
            $('.institute-profile-tab-department').addClass('active');
        });
    </script>
@endsection