@extends('layouts.admin')

@section('page_title')
    @parent
    ربات ورود محصول
@endsection

@section('main')

<style>
/* --- صفحه ربات محصول : طراحی اختصاصی --- */

.robot-header{
    background:#f7f9fc;
    border-radius:12px;
    padding:20px 25px;
    margin-bottom:25px;
    box-shadow:0 4px 10px rgba(0,0,0,.05);
    border:1px solid #eef1f5;
    direction:rtl;
}

.robot-header h2{
    margin:0;
    font-size:22px;
    font-weight:700;
}

.panel-modern{
    background:#fff;
    border-radius:12px;
    border:1px solid #e6e6e6;
    box-shadow:0 3px 10px rgba(0,0,0,0.05);
    overflow:hidden;
    margin-bottom:20px;
}

.panel-modern .panel-header{
    padding:12px 18px;
    font-size:15px;
    font-weight:600;
    direction:rtl;
}

.panel-modern .panel-body{
    padding:18px;
    direction:rtl;
}

/* --- کارت وضعیت لایسنس --- */
.license-wrapper{
    max-width:100%;
    margin:0 auto 30px auto;
    direction:rtl;
}

.license-card{
    display:flex;
    justify-content:space-between;
    align-items:center;
    background:#000eb8;
    border-radius:14px;
    padding:20px 25px;
    border:1px solid #e6e6e6;
    box-shadow:0 5px 18px rgba(0,0,0,.06);
    transition:.3s;
}

.license-card:hover{
    transform:translateY(-3px);
    box-shadow:0 8px 20px rgba(0,0,0,.1);
}

.license-status{
    display:flex;
    align-items:center;
}

.license-dot{
    width:15px;
    height:15px;
    border-radius:50%;
    margin-left:10px;
}

.license-dot.active{background:#28a745;}
.license-dot.inactive{background:#dc3545;}

.license-icon{
    font-size:26px;
    margin-left:10px;
}
.license-icon.icon-check{color:#28a745;}
.license-icon.icon-close{color:#dc3545;}

.license-text{
    display:flex;
    flex-direction:column;
}

.license-text .title{
    font-size:16px;
    font-weight:700;
    color:#fff;
}

.license-text .desc{
    font-size:13px;
    color:#e2e2e2;
}

/* شارژ محصول */
.charge-box{
    text-align:center;
}

.charge-box span{
    display:block;
}

.charge-title{
    font-size:14px;
    color:#fff;
    margin-bottom:4px;
}

.charge-value{
    font-size:20px;
    font-weight:700;
    color:#fff;
    margin-bottom:8px;
}

.charge-btn{
    display:inline-flex;
    align-items:center;
    padding:7px 14px;
    background:#007bff;
    color:#fff;
    font-size:13px;
    border-radius:6px;
    text-decoration:none;
}

.charge-btn i{margin-right:6px;}
.charge-btn:hover{background:#005fcc;}

/* جدول مدرن */
.table-modern thead{
    background:#f2f5f8;
}
.table-modern th{
    font-weight:600;
}
.mt-3 { margin-top: 12px !important; }
.mt-4 { margin-top: 16px !important; }
</style>


<div class="robot-header">
    <h2>🤖 ربات ورود محصول</h2>
    @include('admin.error')
</div>


{{-- وضعیت لایسنس --}}
<div class="license-wrapper">
    <div class="license-card">

        <div class="license-status">
            @php
                $ok = (!empty($license_status['status']) && $license_status['status']==='success' && !empty($license_status['data']['success']));
            @endphp

            <span class="license-dot {{ $ok ? 'active' : 'inactive' }}"></span>
            <i class="{{ $ok ? 'icon-check' : 'icon-close' }} license-icon"></i>

            <div class="license-text">
                <span class="title">
                    {{ $ok ? 'سامانه فعال است' : 'سامانه غیرفعال است' }}
                </span>
                <span class="desc">
                    {{ $ok ? 'تعداد محصول قابل ورود: '.$license_status['data']['remaining_products'] : 'اتصال برقرار نیست یا اعتبار نامعتبر است.' }}
                </span>
            </div>
        </div>

        <div class="charge-box">
            <span class="charge-title">میزان شارژ محصول</span>
            <span class="charge-value">
                {{ $license_status['data']['remaining_products'] ?? 0 }}
            </span>
            <a href="https://mirsoft.org" target="_blank" class="charge-btn">
                شارژ محصول <i class="icon-arrow-right"></i>
            </a>
        </div>
    </div>
</div>


<div class="row">

    {{-- آپلود اکسل --}}
    <div class="col-md-6">
        <div class="panel-modern">
            <div class="panel-header bg-primary text-white">
                بارگذاری فایل محصولات
            </div>
            <div class="panel-body">
                <form action="{{ asset('/admin/products/robot-import-product') }}" method="POST" enctype="multipart/form-data">
                    @csrf
                    <label><strong>انتخاب فایل اکسل</strong></label>
                    {!! Form::file('upload', ['class' => 'form-control']) !!}
                    {!! $errors->first('upload', '<p class="alert alert-danger mt-2">:message</p>') !!}

                    <button class="btn btn-success btn-block mt-3">
                        <i class="fa fa-upload"></i> بارگذاری و ورود دسته‌ای
                    </button>
                </form>
                <p><strong>نکته مهم:</strong> فایل اکسل دارای یک شیت و همچنین دو ستون ستون اول title عنوان دقیق محصول و ستون دوم code محصول باشد</p>
            </div>
        </div>
    </div>

    {{-- صف محصولات --}}
    <div class="col-md-6">
        <div class="panel-modern">
            <div class="panel-header bg-info text-white d-flex justify-content-between">
                <span>صف ورود محصولات</span>
                <span class="badge badge-light text-dark">{{ $total ?? 0 }} محصول</span>
            </div>

            <div class="panel-body p-0">
                @if(isset($imports) && $imports->count())
                    <table class="table table-modern table-striped table-sm mb-0">
                        <thead>
                            <tr>
                                <th>#</th>
                                <th>عنوان محصول</th>
                                <th>کد</th>
                                <th>وضعیت</th>
                            </tr>
                        </thead>
                        <tbody>
                            @foreach($imports as $key => $imp)
                            <tr>
                                <td>{{ $key + 1 }}</td>
                                <td>{{ $imp->title }}</td>
                                <td>{{ $imp->code }}</td>
                                <td><span class="badge badge-warning">در صف</span></td>
                            </tr>
                            @endforeach
                        </tbody>
                    </table>
                @else
                    <div class="p-3 text-center text-muted">هیچ محصولی در صف نیست.</div>
                @endif
            </div>
        </div>
    </div>
</div>

{{-- ورود تکی محصول --}}
<div class="panel-modern mt-4">
    <div class="panel-header bg-secondary text-white">
        ورود تکی محصول
    </div>

    <div class="panel-body">
        <form action="{{ asset('/admin/products/robot-import-product') }}" method="POST">
            @csrf

            <label><strong>عنوان محصول</strong></label>
            <input type="text" name="title" class="form-control mb-3" placeholder="مثال: شامپو ضد ریزش XYZ">

            <label><strong>کد محصول</strong></label>
            <input type="text" name="product_code" class="form-control mb-3" placeholder="کد محصول">

            <button class="btn btn-primary mt-3">
                <i class="fa fa-plus-circle"></i> ورود تکی
            </button>
        </form>
    </div>
</div>

@endsection