@extends('cms.layouts.frame')


@section('scripts')
    @viteIfExist(['resources/js/cms/product-category/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 enctype="multipart/form-data" method="post" action="{{ route("cms.productCategory.store") }}">
                    @csrf

                    <input type="hidden" name="parentId" value="{{ $parentId }}">
                    <input type="hidden" name="redirect" value="{{ $redirect }}">

                    <div class="mb-3">
                        @if($isSubCategory)
                            <label for="name" class="form-label fw-bolder">
                                添加分類名稱到：『{{ $parentProductCategoryTitle }}』底下
                            </label>
                        @else
                            <label for="name" class="form-label fw-bolder">分類名稱</label>
                        @endif

                        <input type="text" class="form-control" id="title" name="title" aria-describedby="emailHelp"
                               autofocus>
                    </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>

                    <button type="submit" class="btn btn-primary">儲存</button>
                    <button type="button" class="btn btn-secondary"
                            onclick="location.href='{{ $redirect }}'">取消
                    </button>
                </form>
            </div>
        </div>
    </main>
@endsection