@extends('panel.master')

@section('title', 'مدیریت شکایات')

@section('content')
<div class="content-wrapper">
    <div class="content-header">
        <div class="container-fluid">
            <div class="row mb-2">
                <div class="col-sm-6">
                    <h1 class="m-0 text-dark">مدیریت شکایات</h1>
                </div>
            </div>
        </div>
    </div>

    <section class="content">
        <div class="container-fluid">
            <div class="row">
                <div class="col-md-12">
                    <div class="card">
                        <div class="card-header">
                            <h3 class="card-title">لیست شکایات</h3>
                            <div class="card-tools">
                                <div class="input-group input-group-sm">
                                    <input type="text" class="form-control" placeholder="جستجو...">
                                    <div class="input-group-append">
                                        <button class="btn btn-primary">
                                            <i class="fas fa-search"></i>
                                        </button>
                                    </div>
                                </div>
                            </div>
                        </div>
                        <div class="card-body p-0">
                            <div class="table-responsive">
                                <table class="table table-hover">
                                    <thead>
                                        <tr>
                                            <th style="width: 5%">#</th>
                                            <th style="width: 15%">نام مشتری</th>
                                            <th style="width: 12%">شماره موبایل</th>
                                            <th style="width: 10%">شماره فاکتور</th>
                                            <th style="width: 10%">نوع شکایت</th>
                                            <th style="width: 12%">تاریخ ثبت</th>
                                            <th style="width: 15%">وضعیت</th>
                                            <th style="width: 21%">عملیات</th>
                                        </tr>
                                    </thead>
                                    <tbody>
                                        @foreach($complaints as $complaint)
                                        <tr>
                                            <td>{{ $loop->iteration }}</td>
                                            <td>{{ $complaint->fullname }}</td>
                                            <td>{{ $complaint->phone }}</td>
                                            <td>{{ $complaint->invoice_number }}</td>
                                            <td>
                                                @switch($complaint->type)
                                                    @case('general') عمومی @break
                                                    @case('broken') شکستنی @break
                                                    @case('service') خدمات @break
                                                    @case('other') سایر @break
                                                @endswitch
                                            </td>
                                            <td>{{ jdate($complaint->created_at)->format('Y/m/d H:i') }}</td>
                                            <td>
                                                <div class="dropdown">
                                                    <button class="btn btn-sm btn-block dropdown-toggle 
                                                        @if($complaint->status == 'new') btn-primary
                                                        @elseif($complaint->status == 'in_progress') btn-warning
                                                        @else btn-success @endif"
                                                        type="button" id="statusDropdown{{ $complaint->id }}" 
                                                        data-toggle="dropdown">
                                                        @if($complaint->status == 'new') جدید
                                                        @elseif($complaint->status == 'in_progress') در حال بررسی
                                                        @else تکمیل شده @endif
                                                    </button>
                                                    <div class="dropdown-menu" aria-labelledby="statusDropdown{{ $complaint->id }}">
                                                        <form action="{{ route('complaints.update-status', $complaint->id) }}" method="POST">
                                                            @csrf
                                                            @method('PATCH')
                                                            <button type="submit" name="status" value="new" 
                                                                class="dropdown-item @if($complaint->status == 'new') active @endif">
                                                                <i class="fas fa-circle text-primary mr-2"></i> جدید
                                                            </button>
                                                            <button type="submit" name="status" value="in_progress" 
                                                                class="dropdown-item @if($complaint->status == 'in_progress') active @endif">
                                                                <i class="fas fa-circle text-warning mr-2"></i> در حال بررسی
                                                            </button>
                                                            <button type="submit" name="status" value="resolved" 
                                                                class="dropdown-item @if($complaint->status == 'resolved') active @endif">
                                                                <i class="fas fa-circle text-success mr-2"></i> تکمیل شده
                                                            </button>
                                                        </form>
                                                    </div>
                                                </div>
                                            </td>
                                            <td>
                                                <div class="btn-group">
                                                    <button class="btn btn-sm btn-info" data-toggle="modal" 
                                                        data-target="#detailModal{{ $complaint->id }}">
                                                        <i class="fas fa-eye"></i> مشاهده
                                                    </button>
                                                        <form action="{{ route('complaints.destroy', $complaint->id) }}" method="POST">
                                                        @csrf
                                                        @method('DELETE')
                                                        <button type="submit" class="btn btn-sm btn-danger" 
                                                            onclick="return confirm('آیا مطمئن هستید؟')">
                                                            <i class="fas fa-trash"></i> حذف
                                                        </button>
                                                    </form>
                                                   
                                                </div>
                                            </td>
                                        </tr>
                                        @endforeach
                                    </tbody>
                                </table>
                            </div>
                        </div>
                        <div class="card-footer clearfix">
                            {{ $complaints->links() }}
                        </div>
                    </div>
                </div>
            </div>
        </div>
    </section>
</div>

<!-- مودال جزئیات -->
@foreach($complaints as $complaint)
<div class="modal fade" id="detailModal{{ $complaint->id }}" tabindex="-1" role="dialog">
    <div class="modal-dialog modal-lg" role="document">
        <div class="modal-content">
            <div class="modal-header">
                <h5 class="modal-title">جزئیات شکایت #{{ $complaint->id }}</h5>
                <button type="button" class="close" data-dismiss="modal">
                    <span>&times;</span>
                </button>
            </div>
            <div class="modal-body">
                <div class="row">
                    <div class="col-md-6">
                        <div class="form-group">
                            <label>نام مشتری:</label>
                            <p class="form-control-static">{{ $complaint->fullname }}</p>
                        </div>
                        <div class="form-group">
                            <label>شماره موبایل:</label>
                            <p class="form-control-static">{{ $complaint->phone }}</p>
                        </div>
                        <div class="form-group">
                            <label>شماره فاکتور:</label>
                            <p class="form-control-static">{{ $complaint->invoice_number }}</p>
                        </div>
                    </div>
                    <div class="col-md-6">
                        <div class="form-group">
                            <label>نوع شکایت:</label>
                            <p class="form-control-static">
                                @switch($complaint->type)
                                    @case('general') عمومی @break
                                    @case('broken') شکستنی @break
                                    @case('service') خدمات @break
                                    @case('other') سایر @break
                                @endswitch
                            </p>
                        </div>
                        <div class="form-group">
                            <label>تاریخ ثبت:</label>
                            <p class="form-control-static">{{ jdate($complaint->created_at)->format('Y/m/d H:i') }}</p>
                        </div>
                        <div class="form-group">
                            <label>وضعیت:</label>
                            <p class="form-control-static">
                                <span class="badge 
                                    @if($complaint->status == 'new') badge-primary
                                    @elseif($complaint->status == 'in_progress') badge-warning
                                    @else badge-success @endif">
                                    @if($complaint->status == 'new') جدید
                                    @elseif($complaint->status == 'in_progress') در حال بررسی
                                    @else تکمیل شده @endif
                                </span>
                            </p>
                        </div>
                    </div>
                </div>
                <div class="row">
                    <div class="col-md-12">
                        <div class="form-group">
                            <label>توضیحات شکایت:</label>
                            <div class="border p-2 rounded bg-light">
                                {{ $complaint->description }}
                            </div>
                        </div>
                    </div>
                </div>
                @if($complaint->image_path)
                <div class="row">
                    <div class="col-md-12">
                        <div class="form-group">
                            <label>تصویر ضمیمه:</label>
                            <div class="text-center">
                                <img src="{{ asset('storage/' . $complaint->image_path) }}" 
                                     class="img-fluid rounded shadow" 
                                     style="max-height: 300px;">
                            </div>
                        </div>
                    </div>
                </div>
                @endif
            </div>
            <div class="modal-footer">
                <button type="button" class="btn btn-secondary" data-dismiss="modal">بستن</button>
            </div>
        </div>
    </div>
</div>
@endforeach
@endsection

@section('extrajs')
<script>
    $(document).ready(function() {
        // نمایش پیام پس از تغییر وضعیت
        @if(session('status'))
            toastr.success('{{ session('status') }}');
        @endif
    });
</script>
@endsection
@section('extraCss')
 <style>
/* در بخش extraCss */
.dropdown-menu {
    min-width: 10rem;
}

.dropdown-item.active {
    background-color: #f8f9fa;
    color: #495057;
    font-weight: bold;
}

.dropdown-item i {
    width: 20px;
    text-align: center;
}

.btn-group .btn {
    margin: 0 3px;
}

.table-responsive {
    min-height: 300px;
}

.img-fluid {
    max-width: 100%;
    height: auto;
}
 </style>
@endsection