@extends('layouts.panel.index')
@section('title','Tambah Berita')
@include('admin.news._js.create')

@push('style')
    <style>
        #judul-editor {
            border-radius: 0px !important;
        }

        #uraian-editor {
            border-radius: 0px !important;
        }

        .select2-selection__clear {
            display: none !important;
        }
    </style>
@endpush

@section('content')

<div class="clearfix mb-2">
    <div class="float-start">
        <a href="{{ route('admin.news')}}" class="text-primary btn-sm"><i class="fa-solid fa-arrow-left"></i><b> Kembali </b></a>
    </div>
    <div class="float-end">
        <h5><b>Tambah Berita</b></h5>
    </div>
</div>

<div class="card border-0">
    <div class="card-body">
        <div class="row mb-3">
            <div class="col-12">
                <div class="mb-3">
                    <label class="form-label" for="" class="mb-1 fw-semibold">Kategori Berita <span class="text-danger">*</span></label>
                    <select class="form-select" name="category" id="category">
                        <option value="" disabled selected>Pilih kategori</option>
                    </select>
                </div>
            </div>
            <div class="col-md-6">
                <div class="mb-3">
                    <label for="" class="mb-1 fw-semibold">Sampul <span class="text-danger">*</span></label>
                    <div id="upload-cover"></div>
                </div>
            </div>
            <div class="col-md-6">
                <div class="mb-3">
                    <label for="" class="mb-1 fw-semibold">Judul <span class="text-danger">*</span></label>
                    <!-- <div id="judul-editor"></div> -->
                    <textarea name="judul" id="" rows="3" class="form-control"></textarea>
                </div>
            </div>
            <div class="col-md-12">
                <div class="mb-3">
                    <label for="" class="mb-1 fw-semibold">Uraian <span class="text-danger">*</span></label>
                    <div id="uraian-editor"></div>
                </div>
            </div>
        </div>
        <div class="text-end">
            <button class="btn btn-primary rounded btn-sm btn-confirm"><i class="fa-solid fa-paper-plane"></i> Publikasikan</button>
            <a href="{{ route('admin.news')}}" class="btn btn-danger rounded btn-sm"><i class="fa-solid fa-xmark"></i> Batalkan</a>
        </div>
    </div>
</div>

<div class="modal fade" id="publish" tabindex="-1">
    <div class="modal-dialog modal-dialog-centered">
        <div class="modal-content">
            <div class="modal-header bg-primary text-white">
                <h1 class="modal-title fs-5" id="exampleModalLabel">Publikasikan Berita</h1>
                <button type="button" class="btn-close text-white" data-bs-dismiss="modal" aria-label="Close"></button>
            </div>
            <div class="modal-body">
                <div class="alert alert-success alert-outline alert-outline-coloured alert-dismissible user-select-none" role="alert">
                    <div class="alert-icon">
                        <svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" class="feather feather-bell"><path d="M18 8A6 6 0 0 0 6 8c0 7-3 9-3 9h18s-3-2-3-9"></path><path d="M13.73 21a2 2 0 0 1-3.46 0"></path></svg>
                    </div>
                    <div class="alert-message">
                        <h6 class="mb-0"> Apakah anda yakin ingin mempublikasikan berita ini ?</h6>
                        <small>Berita yang sudah dipublikasikan akan tampil pada halaman utama</small>
                    </div>
                </div>
                <div class="text-end">
                    <button type="button" class="btn btn-sm rounded btn-danger" data-bs-dismiss="modal"><i class="fa-solid fa-xmark"></i>   Batal</button>
                    <button type="button" class="btn btn-sm rounded btn-primary"><i class="fa-solid fa-paper-plane"></i> Publikasikan</button>
                </div>
            </div>
        </div>
    </div>
</div>

@endsection
@push('script')
<script src="{{ asset('vendor/file-upload/file-upload.min.js') }}"></script>
@endpush