@extends('admin.layouts.admin')
@section('content')
    <div class="dash-content">
        <div class="container-fluid">
            <div class="row">
                <div class="col-md-12">
                    <div class="invoice-panel">
                        <div class="act-title d-flex justify-content-between">
                            <h5>{{ isset($section) ? 'Edit Section' : 'Create Section' }}</h5><br>
                            <a href="{{ route('sections.index') }}" class="btn btn-primary v3">{{ trans('Section List') }}</a>
                        </div>

                        <div class="invoice-body">
                            <form
                                action="{{ isset($section) ? route('sections.update', $section->id) : route('sections.store') }}"
                                method="post" enctype="multipart/form-data">
                                @csrf
                                @if (isset($section))
                                    @method('PUT')
                                @endif

                                @php
                                    $settings = isset($section) ? json_decode($section->settings ?? '{}') : null;
                                @endphp

                                <div class="row">
                                    <div class="col-md-4">
                                        <div class="form-group">
                                            <label for="file_name">{{ trans('File Name') }}</label>
                                            <select name="file_name" class="form-control" required>
                                                <option value="">Select a Section</option>
                                                @foreach ($fileNames as $file)
                                                    <option value="{{ $file }}"
                                                        {{ old('file_name', $section->file_name ?? '') == $file ? 'selected' : '' }}>
                                                        {{ ucfirst($file) }}
                                                    </option>
                                                @endforeach
                                            </select>
                                        </div>
                                    </div>

                                    <div class="col-md-4">
                                        <div class="form-group">
                                            <label for="display_name">{{ trans('Display Name') }}</label>
                                            <input type="text" name="display_name" class="form-control"
                                                placeholder="Enter a Display Name" required
                                                value="{{ old('display_name', $section->display_name ?? '') }}">
                                        </div>
                                    </div>

                                    <div class="col-md-4">
                                        <div class="form-group">
                                            <label for="section_demo">{{ trans('Section Demo') }}</label>
                                            <input type="file" name="section_demo" class="form-control">
                                            @if (isset($section) && $section->image)
                                                <img src="{{ asset($section->image) }}" alt="">
                                            @endif
                                        </div>
                                    </div>

                                    <div class="col-md-12">
                                        <div class="form-group">
                                            <label for="note">{{ trans('Note') }}</label>
                                            <textarea name="note" cols="30" rows="3" class="form-control">{{ old('note', $section->note ?? '') }}</textarea>
                                        </div>
                                    </div>

                                    <div class="col-md-12">
                                        <div class="form-group form-check">
                                            <input type="checkbox" name="status" class="form-check-input" id="status"
                                                {{ old('status', $section->status ?? false) ? 'checked' : '' }}>
                                            <label class="form-check-label" for="status">{{ trans('Status') }}</label>
                                        </div>
                                    </div>

                                    <div class="col-md-12">
                                        <div class="form-group form-check">
                                            <input type="checkbox" name="is_header" class="form-check-input" id="is_header"
                                                {{ old('is_header', $settings->is_header ?? false) ? 'checked' : '' }}>
                                            <label class="form-check-label" for="is_header">{{ trans('Is Header') }}</label>
                                        </div>
                                    </div>


                                    <div class="col-md-12">
                                        <div class="form-group form-check">
                                            <input type="checkbox" name="is_footer" class="form-check-input" id="is_footer"
                                                {{ old('is_footer', $settings->is_footer ?? false) ? 'checked' : '' }}>
                                            <label class="form-check-label" for="is_footer">{{ trans('Is Footer') }}</label>
                                        </div>
                                    </div>


                                    <div class="col-md-12">
                                        <div class="form-group form-check">
                                            <input type="checkbox" name="is_lead_news" class="form-check-input" id="is_lead_news"
                                                {{ old('is_lead_news', $settings->is_lead_news ?? false) ? 'checked' : '' }}>
                                            <label class="form-check-label" for="is_lead_news">{{ trans('Is Lead News') }}</label>
                                        </div>
                                    </div>

                                    <div class="col-md-12">
                                        <div class="form-group form-check">
                                            <input type="checkbox" name="is_main_news" class="form-check-input" id="is_main_news"
                                                {{ old('is_main_news', $settings->is_main_news ?? false) ? 'checked' : '' }}>
                                            <label class="form-check-label" for="is_main_news">{{ trans('Is Main News') }}</label>
                                        </div>
                                    </div>

                                    {{-- Widgets --}}
                                    <div class="col-md-12">
                                        <div class="form-group form-check">
                                            <input type="checkbox" name="widgets" class="form-check-input" id="widgets"
                                                {{ old('widgets', $settings->widgets ?? false) ? 'checked' : '' }}>
                                            <label class="form-check-label" for="widgets">{{ trans('Widgets') }}</label>
                                        </div>
                                    </div>

                                    <div class="col-md-4" id="total_widgets_field" style="display:none;">
                                        <div class="form-group">
                                            <label for="total_widgets">{{ trans('Total Widgets') }}</label>
                                            <input type="number" name="total_widgets" class="form-control"
                                                value="{{ old('total_widgets', $settings->total_widgets ?? '') }}">
                                        </div>
                                    </div>

                                    {{-- Category --}}
                                    <div class="col-md-12" id="category_section">
                                        <div class="form-group form-check">
                                            <input type="checkbox" name="category" class="form-check-input" id="category"
                                                {{ old('category', $settings->category ?? false) ? 'checked' : '' }}>
                                            <label class="form-check-label" for="category">{{ trans('Category') }}</label>
                                        </div>
                                    </div>

                                    <div class="col-md-4" id="total_category_field" style="display:none;">
                                        <div class="form-group">
                                            <label for="total_category">{{ trans('Total Category') }}</label>
                                            <input type="number" name="total_category" id="total_category" class="form-control"
                                                value="{{ old('total_category', $settings->total_category ?? '') }}">
                                        </div>
                                    </div>

                                    <div class="col-md-12">
                                        <div class="form-group">
                                            <button type="submit"
                                                class="btn btn-info">{{ isset($section) ? 'Update' : 'Save' }}</button>
                                        </div>
                                    </div>
                                </div>
                            </form>
                        </div>

                    </div>
                </div>
            </div>
        </div>
    </div>
@endsection

@section('js')
<script src="https://code.jquery.com/jquery-3.6.0.min.js"></script>
<script>
$(document).ready(function(){

    // Initial load check
    if($("#widgets").is(":checked")){
        $("#total_widgets_field").show();
    }
    if($("#category").is(":checked")){
        $("#total_category_field").show();
    }

    // 🔹 Initial load: if main/lead news checked → hide category section
    if($("#is_main_news").is(":checked") || $("#is_lead_news").is(":checked")){
        $("#category_section").hide();
        $("#category").prop("checked", false);
        $("#total_category_field").hide();
        $("#total_category").val('');
    }

    // Widgets checkbox toggle
    $("#widgets").change(function(){
        if($(this).is(":checked")){
            $("#total_widgets_field").slideDown();
        } else {
            $("#total_widgets_field").slideUp();
        }
    });

    // Category checkbox toggle
    $("#category").change(function(){
        if($(this).is(":checked")){
            $("#total_category_field").slideDown();
        } else {
            $("#total_category_field").slideUp();
        }
    });

    // Main News / Lead News logic
    $("#is_main_news, #is_lead_news").change(function(){
        if($("#is_main_news").is(":checked") || $("#is_lead_news").is(":checked")){
            $("#category_section").hide();
            $("#category").prop("checked", false);
            $("#total_category_field").slideUp();
            $("#total_category").val('');
        } else {
            $("#category_section").show();
        }
    });

});
</script>
@endsection