@extends('layouts.app')
@section('title', __('professionalproject::lang.module_name'))

@section('content')
@include('professionalproject::layouts.nav')
<section class="content-header">
    <h1>
        @lang('professionalproject::lang.projects')
        @if(!empty($active_category))
            <small>{{ $active_category->name }}</small>
        @elseif(!empty($filter_category) && $filter_category === 'uncategorized')
            <small>@lang('professionalproject::lang.uncategorized_projects')</small>
        @else
            <small>@lang('professionalproject::lang.all_projects')</small>
        @endif
    </h1>
</section>
<section class="content pp-page-shell pp-modern">
    <div class="pp-hero">
        <h3>@lang('professionalproject::lang.module_name')</h3>
        <p>مدیریت پروژه، وظایف، کانبان و گانت با تجربه کاربری یکپارچه و حرفه‌ای.</p>
    </div>
    @if(!empty($category_breadcrumb) && $category_breadcrumb->count())
    @include('professionalproject::category.partials.breadcrumb', ['breadcrumb' => $category_breadcrumb, 'link_mode' => 'pp'])
    @endif
    @if(!empty($root_categories) && $root_categories->count())
    <div class="box box-solid" style="margin-bottom:16px;">
        <div class="box-body" style="padding:12px 15px;">
            <div class="pp-category-chips" style="display:flex;flex-wrap:wrap;gap:8px;direction:rtl;">
                <a href="{{ action([\Modules\ProfessionalProject\Http\Controllers\ProjectController::class, 'index']) }}?view={{ $view }}"
                   class="btn btn-sm @if(empty($filter_category)) btn-primary @else btn-default @endif">
                    @lang('professionalproject::lang.all_projects')
                </a>
                @foreach($root_categories as $cat)
                <a href="{{ action([\Modules\ProfessionalProject\Http\Controllers\ProjectController::class, 'index']) }}?view={{ $view }}&filter_category={{ $cat->id }}"
                   class="btn btn-sm @if((string)($filter_category ?? '') === (string)$cat->id) btn-primary @else btn-default @endif">
                    @if($cat->icon)<i class="{{ $cat->icon }}"></i> @endif
                    {{ $cat->name }}
                </a>
                @endforeach
            </div>
        </div>
    </div>
    @endif
    <div class="box box-solid">
        <div class="box-header with-border">
            <h3 class="box-title">@lang('professionalproject::lang.projects')</h3>
            <div class="box-tools pull-right">
                <div class="btn-group btn-group-toggle" data-toggle="buttons">
                    <label class="btn btn-info btn-sm @if($view == 'list') active @endif">
                        <input type="radio" name="pp_view" value="list" class="pp_view_toggle" checked> @lang('professionalproject::lang.list_view')
                    </label>
                    <label class="btn btn-info btn-sm @if($view == 'kanban') active @endif">
                        <input type="radio" name="pp_view" value="kanban" class="pp_view_toggle"> @lang('professionalproject::lang.kanban_board')
                    </label>
                </div>
                @can('professionalproject.create_project')
                <a href="{{ action([\Modules\ProfessionalProject\Http\Controllers\ProjectController::class, 'create']) }}" class="btn btn-primary btn-sm">
                    <i class="fa fa-plus"></i> @lang('professionalproject::lang.new_project')
                </a>
                @endcan
            </div>
        </div>
        <div class="box-body">
            <div class="row">
                <div class="col-md-3">
                    <div class="form-group">
                        {!! Form::label('status_filter', __('sale.status') . ':') !!}
                        {!! Form::select('status_filter', $statuses, null, ['class' => 'form-control select2', 'placeholder' => __('messages.all'), 'style' => 'width:100%']) !!}
                    </div>
                </div>
            </div>
            <div id="pp_projects_container"></div>
        </div>
    </div>
</section>
@endsection

@section('css')
@include('professionalproject::layouts.professional_style')
<style>
    .pp-page-shell .box {
        border-top: 3px solid #3c8dbc;
        border-radius: 10px;
        box-shadow: 0 2px 12px rgba(0, 0, 0, 0.06);
    }
    .pp-page-shell .box-header {
        padding: 14px 15px;
    }
    .pp-page-shell .box-title {
        font-weight: 700;
    }
    .pp-page-shell .btn-group-toggle .btn {
        border-radius: 6px;
        margin-left: 4px;
    }
    .pp-page-shell .box-tools .btn-primary {
        border-radius: 6px;
    }
</style>
@endsection

@section('javascript')
<script>
$(document).ready(function() {
    var currentView = '{{ $view }}';
    var filterCategory = @json($filter_category ?? null);

    function loadProjects() {
        $.ajax({
            url: '{{ action([\Modules\ProfessionalProject\Http\Controllers\ProjectController::class, "index"]) }}',
            data: {
                view: currentView,
                status: $('#status_filter').val(),
                filter_category: filterCategory
            },
            success: function(html) { $('#pp_projects_container').html(html); }
        });
    }

    loadProjects();
    $('#status_filter').change(loadProjects);

    $('.pp_view_toggle').change(function() {
        currentView = $(this).val();
        loadProjects();
    });

    $(document).on('click', '.delete_pp_project', function(e) {
        e.preventDefault();
        var url = $(this).data('href');
        swal({ title: LANG.sure, icon: 'warning', buttons: true, dangerMode: true }).then(function(willDelete) {
            if (willDelete) {
                $.ajax({ method: 'DELETE', url: url, dataType: 'json', success: function(r) {
                    if (r.success) { toastr.success(r.msg); loadProjects(); } else { toastr.error(r.msg); }
                }});
            }
        });
    });
});
</script>
@endsection