@extends('admin.layouts.app')
@section('title', get_setting('site_name').' | '.__('Asset categories'))
@include('admin.asset.partials.page_styles')
@section('content')
<div class="row asset-admin-page asset-category-page">
    <div class="col-xl-11 mx-auto mt-3 mb-4">
        <div class="d-flex flex-wrap justify-content-between align-items-center mb-3">
            <div>
                <h4 class="mb-1">{{ __('Asset categories') }}</h4>
                <p class="text-muted small mb-0">{{ __('Top-level types and sub-categories used across the enterprise asset registry.') }}</p>
            </div>
            <div class="d-flex flex-wrap align-items-center" style="gap: 8px;">
                <span class="badge badge-light border px-3 py-2">
                    {{ __('Total') }}: <strong>{{ $stats['total'] ?? 0 }}</strong>
                </span>
                <span class="badge badge-light border px-3 py-2">
                    {{ __('Top-level') }}: <strong>{{ $stats['top_level'] ?? 0 }}</strong>
                </span>
                <span class="badge badge-light border px-3 py-2">
                    {{ __('Sub-types') }}: <strong>{{ $stats['sub'] ?? 0 }}</strong>
                </span>
            </div>
        </div>

        <div class="row">
            <div class="col-lg-8 mb-4 mb-lg-0">
                <div class="card asset-card h-100">
                    <div class="card-header d-flex flex-wrap justify-content-between align-items-center">
                        <h5 class="mb-0"><i class="mdi mdi-folder-outline text-muted mr-1"></i> {{ __('Category registry') }}</h5>
                        @if(($stats['filtered'] ?? 0) > 0)
                            <span class="small text-muted">
                                {{ __('Showing') }} {{ $categories_2->firstItem() }}–{{ $categories_2->lastItem() }} {{ __('of') }} {{ $categories_2->total() }}
                            </span>
                        @endif
                    </div>
                    <div class="card-body">
                        <ul class="nav nav-pills asset-cat-tabs mb-3">
                            <li class="nav-item">
                                <a class="nav-link {{ !request('level') || request('level') === 'all' ? 'active' : '' }}"
                                   href="{{ request()->fullUrlWithQuery(['level' => 'all', 'page' => 1]) }}">
                                    {{ __('All') }}
                                </a>
                            </li>
                            <li class="nav-item">
                                <a class="nav-link {{ request('level') === 'top' ? 'active' : '' }}"
                                   href="{{ request()->fullUrlWithQuery(['level' => 'top', 'page' => 1]) }}">
                                    {{ __('Top-level') }}
                                </a>
                            </li>
                            <li class="nav-item">
                                <a class="nav-link {{ request('level') === 'sub' ? 'active' : '' }}"
                                   href="{{ request()->fullUrlWithQuery(['level' => 'sub', 'page' => 1]) }}">
                                    {{ __('Sub-types') }}
                                </a>
                            </li>
                        </ul>

                        <form method="get" class="asset-filters mb-3">
                            @if(request()->filled('level'))
                                <input type="hidden" name="level" value="{{ request('level') }}">
                            @endif
                            <div class="form-row align-items-end asset-filter-row">
                                <div class="form-group col-sm-6 col-lg-3 mb-2 mb-lg-0">
                                    <label class="form-label-asset">{{ __('Search name') }}</label>
                                    <input type="text" class="form-control" name="q" value="{{ request('q') }}" placeholder="{{ __('Type to search…') }}">
                                </div>
                                <div class="form-group col-sm-6 col-lg-3 mb-2 mb-lg-0">
                                    <label class="form-label-asset">{{ __('Parent category') }}</label>
                                    <select class="form-control select2" name="parent_id" data-placeholder="{{ __('All parents') }}">
                                        <option value="">{{ __('All parents') }}</option>
                                        @foreach($categories as $category)
                                            <option value="{{ $category->id }}" @selected((string) request('parent_id') === (string) $category->id)>
                                                {{ $category->name }}
                                            </option>
                                        @endforeach
                                    </select>
                                </div>
                                <div class="form-group col-sm-6 col-lg-3 mb-2 mb-lg-0">
                                    <label class="form-label-asset">{{ __('Enterprise type') }}</label>
                                    <select class="form-control select2" name="asset_type" data-placeholder="{{ __('All types') }}">
                                        <option value="">{{ __('All types') }}</option>
                                        @foreach(\App\Support\Asset\AssetType::options() as $val => $label)
                                            <option value="{{ $val }}" @selected(request('asset_type') === $val)>{{ $label }}</option>
                                        @endforeach
                                    </select>
                                </div>
                                <div class="form-group col-sm-6 col-lg-auto mb-0 asset-filter-actions-col">
                                    <label class="form-label-asset asset-filter-btn-label" aria-hidden="true">&nbsp;</label>
                                    <div class="asset-filter-actions">
                                        <button type="submit" class="btn btn-primary btn-sm">
                                            <i class="fas fa-filter mr-1"></i> {{ __('Filter') }}
                                        </button>
                                        @if(request()->hasAny(['q', 'parent_id', 'asset_type']))
                                            <a href="{{ route('asset.category', request()->only('level')) }}" class="btn btn-outline-secondary btn-sm">{{ __('Reset') }}</a>
                                        @endif
                                    </div>
                                </div>
                            </div>
                        </form>

                        <div class="table-responsive">
                            <table class="table table-hover mb-0 asset-category-table">
                                <thead class="thead-light">
                                <tr>
                                    <th>{{ __('Name') }}</th>
                                    <th>{{ __('Level') }}</th>
                                    <th>{{ __('Parent') }}</th>
                                    <th>{{ __('Enterprise type') }}</th>
                                    <th class="text-center">{{ __('Depr. %') }}</th>
                                    <th>{{ __('Depr. method') }}</th>
                                    <th class="text-center">{{ __('Sub-types') }}</th>
                                    <th class="text-right text-nowrap" style="width: 100px;">{{ __('Action') }}</th>
                                </tr>
                                </thead>
                                <tbody>
                                @forelse($categories_2 as $cate)
                                    @php $parent = $cate->parentCategory; @endphp
                                    <tr>
                                        <td>
                                            <div class="d-flex align-items-center">
                                                @if($parent)
                                                    <i class="mdi mdi-subdirectory-arrow-right text-muted mr-2"></i>
                                                @else
                                                    <i class="mdi mdi-folder text-primary mr-2"></i>
                                                @endif
                                                <span class="font-weight-medium">{{ $cate->name }}</span>
                                            </div>
                                        </td>
                                        <td>
                                            @if($parent)
                                                <span class="badge badge-light border asset-cat-level-badge">{{ __('Sub-type') }}</span>
                                            @else
                                                <span class="badge badge-primary asset-cat-level-badge">{{ __('Top-level') }}</span>
                                            @endif
                                        </td>
                                        <td>
                                            @if($parent)
                                                <span class="badge badge-light border">{{ $parent->name }}</span>
                                            @else
                                                <span class="text-muted">—</span>
                                            @endif
                                        </td>
                                        <td>
                                            <span class="badge badge-light border asset-type-badge">{{ $cate->typeLabel() }}</span>
                                        </td>
                                        <td class="text-center">
                                            @if($cate->depreciation_rate !== null)
                                                {{ number_format((float) $cate->depreciation_rate, 2) }}%
                                            @else
                                                <span class="text-muted">—</span>
                                            @endif
                                        </td>
                                        <td>
                                            @if($cate->depreciation_method)
                                                <span class="badge badge-light border">{{ \App\Support\Asset\DepreciationMethod::label($cate->depreciation_method) }}</span>
                                            @else
                                                <span class="text-muted">—</span>
                                            @endif
                                        </td>
                                        <td class="text-center">
                                            @if((int) $cate->children_count > 0)
                                                <span class="badge badge-secondary">{{ $cate->children_count }}</span>
                                            @else
                                                <span class="text-muted">0</span>
                                            @endif
                                        </td>
                                        <td class="text-right text-nowrap">
                                            <button type="button"
                                                    class="btn btn-outline-primary btn-sm btn-edit-category"
                                                    title="{{ __('Edit') }}"
                                                    data-id="{{ $cate->id }}"
                                                    data-name="{{ $cate->name }}"
                                                    data-parent="{{ $parent?->id }}"
                                                    data-asset-type="{{ $cate->asset_type ?? 'fixed' }}"
                                                    data-depreciation-rate="{{ $cate->depreciation_rate !== null ? $cate->depreciation_rate : '' }}"
                                                    data-depreciation-method="{{ $cate->depreciation_method ?? '' }}">
                                                <i class="fas fa-edit"></i>
                                            </button>
                                            <a href="javascript:void(0)"
                                               data-href="{{ route('asset.category.destroy', $cate->id) }}"
                                               class="btn btn-outline-danger btn-sm delete_modal"
                                               title="{{ __('Delete') }}">
                                                <i class="fas fa-trash"></i>
                                            </a>
                                        </td>
                                    </tr>
                                @empty
                                    <tr>
                                        <td colspan="8" class="text-center text-muted py-4">
                                            <i class="mdi mdi-folder-off-outline d-block mb-2" style="font-size: 1.75rem;"></i>
                                            {{ __('No asset categories found.') }}
                                        </td>
                                    </tr>
                                @endforelse
                                </tbody>
                            </table>
                        </div>

                        @if($categories_2->hasPages())
                            <div class="mt-3">{{ $categories_2->links() }}</div>
                        @endif
                    </div>
                </div>
            </div>

            <div class="col-lg-4">
                <div class="card asset-card asset-category-create-card">
                    <div class="card-header">
                        <h5 class="mb-0"><i class="mdi mdi-plus-circle-outline text-muted mr-1"></i> {{ __('Add category') }}</h5>
                    </div>
                    <div class="card-body">
                        <form action="{{ route('asset.category.store') }}" method="POST" id="asset_category_create_form">
                            @csrf
                            <div class="form-group">
                                <label class="form-label-asset">{{ __('Name') }} <span class="text-danger">*</span></label>
                                <input class="form-control" type="text" name="name" value="{{ old('name') }}" required placeholder="{{ __('e.g. IT Equipment') }}">
                            </div>
                            <div class="form-group">
                                <label class="form-label-asset">{{ __('Parent category') }}</label>
                                <select class="form-control select2" name="parent" data-placeholder="{{ __('Top-level type') }}">
                                    <option value="">{{ __('Top-level type') }}</option>
                                    @foreach($categories as $category)
                                        <option value="{{ $category->id }}" @selected(old('parent') == $category->id)>
                                            {{ $category->name }}
                                        </option>
                                    @endforeach
                                </select>
                                <small class="text-muted">{{ __('Leave empty to create a top-level category.') }}</small>
                            </div>
                            <div class="form-group">
                                <label class="form-label-asset">{{ __('Default enterprise type') }}</label>
                                <select class="form-control select2 asset-type-select" name="asset_type" id="create_asset_type" data-prefix="create">
                                    @foreach(\App\Support\Asset\AssetType::options() as $val => $label)
                                        <option value="{{ $val }}" @selected(old('asset_type', 'fixed') === $val)>{{ $label }}</option>
                                    @endforeach
                                </select>
                                <small class="text-muted d-block mt-1" id="create_type_hint"></small>
                            </div>
                            <div class="form-group">
                                <label class="form-label-asset">{{ __('Default depreciation method') }}</label>
                                <select class="form-control select2" name="depreciation_method" data-placeholder="{{ __('None') }}">
                                    <option value="">{{ __('None') }}</option>
                                    @foreach(\App\Support\Asset\DepreciationMethod::options() as $val => $label)
                                        <option value="{{ $val }}" @selected(old('depreciation_method') === $val)>{{ $label }}</option>
                                    @endforeach
                                </select>
                                <small class="text-muted">{{ __('Auto-fills when registering assets in this category (overridable).') }}</small>
                            </div>
                            <div class="form-group">
                                <label class="form-label-asset">{{ __('Default depreciation %') }}</label>
                                <input class="form-control" type="number" step="0.01" min="0" max="100" name="depreciation_rate"
                                       value="{{ old('depreciation_rate') }}" placeholder="e.g. 10">
                                <small class="text-muted">{{ __('Used mainly for reducing-balance; still auto-fills and can be overridden.') }}</small>
                            </div>
                            <button type="submit" class="btn btn-primary btn-block">
                                <i class="fas fa-save mr-1"></i> {{ __('Save category') }}
                            </button>
                        </form>
                    </div>
                </div>
            </div>
        </div>
    </div>
</div>
@endsection

@section('modal')
<div class="modal fade asset-admin-modal" id="category_update_modal" tabindex="-1">
    <form action="{{ route('asset.category.update') }}" method="POST">
        @csrf
        <div class="modal-dialog modal-dialog-scrollable">
            <div class="modal-content">
                <div class="modal-header">
                    <h5 class="modal-title">{{ __('Update category') }}</h5>
                    <button type="button" class="close" data-dismiss="modal" aria-label="Close">
                        <span aria-hidden="true">&times;</span>
                    </button>
                </div>
                <div class="modal-body">
                    <input type="hidden" name="id" id="cat_id">
                    <div class="form-group">
                        <label class="form-label-asset">{{ __('Name') }} <span class="text-danger">*</span></label>
                        <input class="form-control" name="name" id="cat_name" required>
                    </div>
                    <div class="form-group">
                        <label class="form-label-asset">{{ __('Parent category') }}</label>
                        <select class="form-control select2" name="parent" id="cat_parent" data-placeholder="{{ __('Top-level') }}">
                            <option value="">{{ __('Top-level') }}</option>
                            @foreach($categories as $category)
                                <option value="{{ $category->id }}">{{ $category->name }}</option>
                            @endforeach
                        </select>
                    </div>
                    <div class="form-group mb-0">
                        <label class="form-label-asset">{{ __('Enterprise type') }}</label>
                        <select class="form-control select2 asset-type-select" name="asset_type" id="cat_asset_type" data-prefix="edit">
                            @foreach(\App\Support\Asset\AssetType::options() as $val => $label)
                                <option value="{{ $val }}">{{ $label }}</option>
                            @endforeach
                        </select>
                        <small class="text-muted d-block mt-1" id="edit_type_hint"></small>
                    </div>
                    <div class="form-group mb-0 mt-3">
                        <label class="form-label-asset">{{ __('Default depreciation method') }}</label>
                        <select class="form-control select2" name="depreciation_method" id="cat_depreciation_method" data-placeholder="{{ __('None') }}">
                            <option value="">{{ __('None') }}</option>
                            @foreach(\App\Support\Asset\DepreciationMethod::options() as $val => $label)
                                <option value="{{ $val }}">{{ $label }}</option>
                            @endforeach
                        </select>
                        <small class="text-muted">{{ __('Auto-fills on asset register; can be overridden per asset.') }}</small>
                    </div>
                    <div class="form-group mb-0 mt-3">
                        <label class="form-label-asset">{{ __('Default depreciation %') }}</label>
                        <input class="form-control" type="number" step="0.01" min="0" max="100" name="depreciation_rate" id="cat_depreciation_rate" placeholder="e.g. 10">
                        <small class="text-muted">{{ __('Used mainly for reducing-balance; still auto-fills and can be overridden.') }}</small>
                    </div>
                </div>
                <div class="modal-footer">
                    <button type="button" class="btn btn-light" data-dismiss="modal">{{ __('Cancel') }}</button>
                    <button type="submit" class="btn btn-primary">{{ __('Update') }}</button>
                </div>
            </div>
        </div>
    </form>
</div>
@endsection

@push('css')
<style>
    .asset-category-page .asset-category-table thead th {
        font-size: 11px;
        text-transform: uppercase;
        letter-spacing: .04em;
        white-space: nowrap;
    }
    .asset-category-page .asset-cat-tabs .nav-link {
        font-size: 12px;
        font-weight: 700;
        text-transform: uppercase;
        letter-spacing: .04em;
        color: #64748b;
        border-radius: 999px;
        padding: 0.35rem 0.85rem;
    }
    .asset-category-page .asset-cat-tabs .nav-link.active {
        background: rgba(96, 93, 175, .12);
        color: #4f46a5;
    }
    .asset-category-page .asset-cat-level-badge {
        font-size: 10px;
        font-weight: 700;
        text-transform: uppercase;
        letter-spacing: .04em;
    }
    .asset-category-page .asset-category-create-card {
        position: sticky;
        top: 1rem;
    }
    .asset-category-page .asset-filter-btn-label {
        visibility: hidden;
        display: block;
    }
    .asset-category-page .asset-filter-actions {
        display: flex;
        flex-wrap: wrap;
        align-items: center;
        gap: 6px;
        min-height: 38px;
    }
    .asset-category-page .asset-filter-actions .btn {
        display: inline-flex;
        align-items: center;
        height: 38px;
        white-space: nowrap;
    }
    @media (max-width: 991.98px) {
        .asset-category-page .asset-category-create-card {
            position: static;
        }
    }
</style>
@endpush

@section('script')
@include('admin.asset.partials.scripts')
<script>
    function categorySyncTypeHint(prefix) {
        var type = $('#' + prefix + '_asset_type').val() || 'fixed';
        var hint = (window.assetTypeHints && window.assetTypeHints[type]) ? window.assetTypeHints[type] : '';
        $('#' + prefix + '_type_hint').text(hint);
    }

    $(function () {
        assetInitSelect2('.asset-category-page');

        $('#category_update_modal').on('shown.bs.modal', function () {
            assetInitSelect2('#category_update_modal');
        });

        $('#create_asset_type, #cat_asset_type').on('change', function () {
            categorySyncTypeHint($(this).data('prefix'));
        });
        categorySyncTypeHint('create');

        $(document).on('click', '.btn-edit-category', function () {
            var $btn = $(this);
            $('#cat_id').val($btn.data('id'));
            $('#cat_name').val($btn.data('name') || '');
            $('#cat_parent').val($btn.data('parent') || '').trigger('change');
            $('#cat_asset_type').val($btn.data('asset-type') || 'fixed').trigger('change');
            var rate = $btn.attr('data-depreciation-rate');
            $('#cat_depreciation_rate').val(rate !== undefined && rate !== null ? rate : '');
            var method = $btn.attr('data-depreciation-method') || '';
            $('#cat_depreciation_method').val(method).trigger('change');
            categorySyncTypeHint('edit');
            $('#category_update_modal').modal('show');
        });
    });
</script>
@endsection