@extends('companyuser::layouts.master')
@section('title', __('reports::reports.asset_report.Asset Detailed Report'))
@section('extra_styles')
    <script src="{{ asset('/js/app.js') }}" defer></script>
@endsection
@section('breadcrumb')
    <div class="row breadcrumbs-top">
        <div class="breadcrumb-wrapper col-xs-12">
            <ol class="breadcrumb">
                <li class="breadcrumb-item">
                    <a href="{{ route('company.reports.index', $subdomain) }}">@lang('companyuser::sidebar.Reports')</a>
                </li>
                <li class="breadcrumb-item active">
                    <a href="#">@lang('reports::reports.asset_report.Asset Detailed Report')</a>
                </li>
            </ol>
        </div>
    </div>
@endsection
@section('content')
    {{-- Vue chain (v2):
         1) <asset-report-page> orchestrates report-level props and slots.
         2) <report-async-filter-layout> handles filter submit/reset and async fetch.
         3) Toolbar slot renders <action-buttons> for print/pdf/excel/back actions.
         4) Default slot renders <asset-report-data> to display KPI/meta/transactions.
         5) Asset dropdown is delegated to <assets-dropdown-component> via generic filter card.
    --}}
    <div class="container-fluid px-2 pt-0 pb-3">
        @include('companyuser::errors.all')
        @include('companyuser::errors.lists')

        <asset-report-page
            :filter-dropdowns="@js($filterDropdowns)"
            :chart-account-show-url-template='@json(route("company.chart-of-accounts.show", ["subdomain" => $subdomain, "account" => 999888777001]))'
            data-url="{{ route('company.reports.asset-details.data', $subdomain) }}"
            form-action="#"
            form-method="get"
            filter-title="{{ __('Filter') }}"
            filter-subtitle="{{ __('reports::reports.report_filter_card_subtitle') }}"
            submitting-label="{{ __('reports::reports.report_filter_submitting') }}"
            lang="{{ app()->getLocale() }}"
            dropdown-component="assets-dropdown-component"
            :dropdown-translations="@js([
                'placeholder' => __('reports::reports.assets_dropdown_translations.select_placeholder'),
                'searchPlaceholder' => __('reports::reports.assets_dropdown_translations.search_assets'),
                'noResultsText' => __('reports::reports.assets_dropdown_translations.no_assets_found'),
                'loadMoreHint' => __('reports::reports.assets_dropdown_translations.load_more_assets'),
            ])"
            :columns="1"
            submit-label="{{ __('reports::reports.filter_report') }}"
            reset-label="{{ __('reports::reports.reset_filters') }}"
            :initial-asset-id='@json(request("asset_id") ? (int) request("asset_id") : null)'
            :currency-code='@json($reportCurrencyCode ?? "SAR")'
            :report-module='@json($assetReportModule ?? "reports/assets")'
            :back-route='@json($assetReportBackUrl ?? "")'
            :export-urls="@js($assetReportExportUrls ?? [])"
            :can-export="@json($assetReportCanExport ?? false)"
        />
    </div>
@endsection