@extends('admin.layouts.app')

@push('styles')
    <link href="{{ asset('assets/plugins/custom/datatables/datatables.bundle.css') }}" rel="stylesheet" type="text/css" />
@endpush

@section('content')
    @include('admin.layouts.partial.toolbar', ['breadcrumb' => 'Create Branch'])

    <!--begin::Content-->
    <div id="kt_app_content" class="app-content flex-column-fluid">
        <!--begin::Content container-->
        <div id="kt_app_content_container" class="app-container container-xxl">
            <!--begin::Layout-->
            <div class="d-flex flex-column flex-lg-row">
                <!--begin::Content-->
                <div class="flex-lg-row-fluid me-lg-15 order-2 order-lg-1 mb-10 mb-lg-0">
                    <!--begin::Form-->
                    <form class="form" action="{{ route('admin.branch.store') }}" method="POST" id="kt_branch_create_form">
                        @csrf
                        <!--begin::Card-->
                        <div class="card card-flush pt-3 mb-5 mb-lg-10">
                            <!--begin::Card body-->
                            <div class="card-body pt-0">
                                <!--begin::Custom fields-->
                                <div class="d-flex flex-column my-15 fv-row">
                                    <!--begin::Table wrapper-->
                                    <div class="table-responsive">
                                        <!--begin::Table-->
                                        <table id="kt_create_new_custom_fields"
                                            class="table align-middle table-row-dashed fw-semibold fs-6 gy-5">
                                            <!--begin::Table head-->
                                            <thead>
                                                <tr class="text-start text-muted fw-bold fs-7 text-uppercase gs-0">
                                                    <th class="pt-0">Branch ID</th>
                                                    <th class="pt-0">Branch Name</th>
                                                    <th class="pt-0 text-end"></th>
                                                </tr>
                                            </thead>
                                            <!--end::Table head-->
                                            <!--begin::Table body-->
                                            <tbody>
                                                <tr>
                                                    <td>
                                                        <input type="text" class="form-control form-control-solid"
                                                            name="" value="" placeholder="Branch ID" required/>
                                                    </td>
                                                    <td>
                                                        <input type="text" class="form-control form-control-solid"
                                                            name="" value="" placeholder="Branch Name" required/>
                                                    </td>
                                                    <td class="text-end">
                                                        <button type="button"
                                                            class="btn btn-icon btn-flex btn-active-light-primary w-30px h-30px me-3"
                                                            data-kt-action="field_remove">
                                                            <i class="ki-duotone ki-trash fs-3">
                                                                <span class="path1"></span>
                                                                <span class="path2"></span>
                                                                <span class="path3"></span>
                                                                <span class="path4"></span>
                                                                <span class="path5"></span>
                                                            </i>
                                                        </button>
                                                    </td>
                                                </tr>
                                            </tbody>
                                            <!--end::Table body-->
                                        </table>
                                        <!--end:Table-->
                                    </div>
                                    <!--end::Table wrapper-->
                                    <!--begin::Add custom field-->
                                    <button type="button" class="btn btn-light-primary me-auto"
                                        id="kt_create_new_custom_fields_add">Add Branch</button>
                                    <!--end::Add custom field-->
                                </div>
                                <!--end::Custom fields-->
                            </div>
                            <!--end::Card body-->
                            <div class="card-footer">
                                <div class="flex-center">
                                    <button type="submit" id="kt_branch_submit" class="btn btn-primary me-auto">
                                        <!--begin::Indicator label-->
                                        <span class="indicator-label">Save</span>
                                        <!--end::Indicator label-->
                                        <!--begin::Indicator progress-->
                                        <span class="indicator-progress">Please wait...
                                            <span class="spinner-border spinner-border-sm align-middle ms-2"></span></span>
                                        <!--end::Indicator progress-->
                                    </button>
                                    <a class="btn btn-secondary btn-bg-secondary" href="{{ route('admin.branch.list') }}">Back</a>
                                </div>
                            </div>
                        </div>
                        <!--end::Card-->
                    </form>
                    <!--end::Form-->
                </div>
                <!--end::Content-->
            </div>
            <!--end::Layout-->
        </div>
        <!--end::Content container-->
    </div>
    <!--end::Content-->
@endsection

@push('scripts')
    <script src="{{ asset('assets/plugins/custom/datatables/datatables.bundle.js') }}"></script>
    <script src="{{ asset('assets/js/custom/admin/branch/advanced.js') }}"></script>
@endpush