@extends('layouts.app', ['title' => __('Customer Management')])
@section('content')
@include('restorants.partials.header', ['title' => $title])
<style>
    .select2 {
        width: 100% !important;
    }
</style>
<div class="container-fluid mt--7">
    <div class="row">
        <div class="col-xl-12 order-xl-1">
            <div class="card bg-secondary shadow">
                <div class="card-header bg-white border-0">
                    <div class="row align-items-center">
                        <div class="col-8">
                            <h3 class="mb-0">{{ __('Floor Plan Template Management') }}</h3>
                        </div>
                        <div class="col-4 text-right">
                            <a href="{{ route('admin.templates.index') }}"
                                class="btn btn-sm btn-primary">{{ __('Back to list') }}</a>
                        </div>
                    </div>
                </div>
                <div class="card-body">
                    <h6 class="heading-small text-muted mb-4">{{ __('Template information') }}</h6>
                    <div class="pl-lg-4">
                        <form method="post" action="{{ route('superadmin.template.store') }}" enctype="multipart/form-data">
    @csrf
    <input type="hidden" name="customer_id" id="customer_id"
        value="{{ isset($template) ? $template->id : '' }}">

    <div class="row mb-3">
        <div class="col-md-6">
            <label class="form-control-label" for="name">{{ __('Template Name') }}</label>
            <input type="text" name="name" id="name"
                class="form-control{{ $errors->has('name') ? ' is-invalid' : '' }}"
                placeholder="Template Name here ..."
                value="{{ isset($template) ? $template->name : '' }}" required>
        </div>

        <div class="col-md-6">
            <label class="form-control-label">{{ __('Status') }}</label>
            <select name="active" class="form-control" required>
                <option value="" disabled>Select Status</option>
                <option value="1" {{ old('active', $template->active ?? '') == 1 ? 'selected' : '' }}>
                    Active
                </option>
                <option value="0" {{ old('active', $template->active ?? '') == 0 ? 'selected' : '' }}>
                    Inactive
                </option>
            </select>
        </div>
    </div>

    {{-- Image Upload --}}
    <div class="row mb-3">
        <div class="col-md-12">
            <label class="form-control-label">Template Image</label>
            <input type="file" name="image" class="form-control">
            
            {{-- For Edit Case – Show Existing Image --}}
            @if(isset($template) && $template->image)
                <img src="{{ asset('images/' . $template->image) }}" 
                     class="img-thumbnail mt-2" width="150">
            @endif
        </div>
    </div>

    {{-- Hidden cloneWith --}}
    @if (isset($_GET['cloneWith']))
        <input type="hidden" id="cloneWith" name="cloneWith" value="{{ $_GET['cloneWith'] }}" />
    @endif

    <div class="text-end" style="text-align:end">
        <button type="submit" class="btn btn-primary mt-4">Save</button>
    </div>
</form>
 @include('layouts.footers.auth')
                    </div>
                </div>
            </div>
        </div>
    </div>
</div>

<link href="https://cdn.jsdelivr.net/npm/select2-bootstrap-5-theme@1.3.0/dist/select2-bootstrap-5-theme.min.css" rel="stylesheet" />

<script>
    $('#active').select2('destroy'); // Removes Select2 styling

    $('#active').select2({
        theme: 'bootstrap-5',
        minimumResultsForSearch: Infinity // hides search bar for 2 options
    });
</script>
@include('layouts.footers.auth')

</div>
@endsection