@extends('cms.layouts.frame')

@section('scripts')
{{--    @vite(['resources/js/cms/eventRecap/create.js'])--}}
    @vite(['resources/js/cms/eventRecapCategory/create.js'])
@endsection

@section('content')
    <main>
        <nav>
            <div class="nav nav-tabs" id="nav-tab" role="tablist">
                <button class="nav-link active" id="nav-edit-tab" data-bs-toggle="tab"
                        data-bs-target="#nav-create" type="button" role="tab" aria-controls="nav-create"
                        aria-selected="true">新增
                </button>
            </div>
        </nav>
        <div class="tab-content pt-3" id="nav-tabContent">
            {{-- 新增 --}}
            <div class="tab-pane fade show active" id="nav-home" role="tabpanel"
                 aria-labelledby="nav-edit-tab" tabindex="0">
                <form method="post" enctype="multipart/form-data" action="{{ route("cms.eventRecapCategory.store") }}">
                    @csrf

                    <input type="hidden" name="parentId" value="300">

                    <div class="mb-3">
                        <label for="name" class="form-label fw-bolder">分類名稱</label>
                        <input type="text" class="form-control" id="title" name="title" aria-describedby="emailHelp"
                               maxlength="6">
                    </div>

                    <div class="mb-3">
                        <label for="inputCover" class="form-label fw-bolder">封面</label>
                        <div class="previewCover" style="
                            width: 200px;
                            height: 200px;
                            background-color: #dedede;
                            background-position: center;
                            background-size: contain;
                            background-repeat: no-repeat;
                            border-radius: 0.3em;
                            cursor: pointer;
                            ">
                        </div>
                        <input type="file" class="form-control cover" id="inputCover" name="cover" hidden>
                    </div>

                    <div class="mb-3">
                        <label for="name" class="form-label fw-bolder">副標題</label>
                        <input type="text" class="form-control" id="categorySubTitle" name="categorySubTitle"
                               aria-describedby="categorySubTitle">
                    </div>
                    <div class="mb-3">
                        <label for="name" class="form-label fw-bolder">內容</label>
                        <input type="text" class="form-control" id="categoryContent" name="categoryContent"
                               aria-describedby="categoryContent">
                    </div>
                    <button type="submit" class="btn btn-primary">儲存</button>
                    <button type="button" class="btn btn-secondary"
                            onclick="location.href='{{ route("cms.eventRecapCategory.index") }}'">取消
                    </button>
                </form>
            </div>
        </div>
    </main>
@endsection