@page
@model JobsMedical.Web.Pages.Jobs.IndexModel
@{
    ViewData["Title"] = "موقعیت‌های استخدامی";
}

<div class="page-head">
    <div class="container">
        <h1>موقعیت‌های استخدامی</h1>
        <p class="muted">
            @JalaliDate.ToPersianDigits(Model.Results.Count.ToString()) موقعیت شغلی پیدا شد
            @if (Model.NearMeActive)
            {
                <span> — مرتب‌شده بر اساس نزدیک‌ترین به شما 📍</span>
            }
        </p>
    </div>
</div>

<div class="container section">
    <div class="layout-2">
        <aside class="card card-pad filter-card">
            <h3>فیلترها</h3>
            <form method="get" id="filterForm">
                <input type="hidden" name="Lat" value="@Model.Lat" />
                <input type="hidden" name="Lng" value="@Model.Lng" />
                <div class="filter-group">
                    @if (Model.NearMeActive)
                    {
                        <a asp-page="/Jobs/Index" asp-route-CityId="@Model.CityId" asp-route-RoleId="@Model.RoleId"
                           class="btn btn-accent btn-block">✓ نزدیک‌ترین‌ها — حذف</a>
                    }
                    else
                    {
                        <button type="button" id="nearMeBtn" class="btn btn-outline btn-block">📍 نزدیک من</button>
                    }
                </div>
                <div class="filter-group">
                    <label>شهر</label>
                    <select name="CityId" onchange="this.form.submit()">
                        <option value="">همه شهرها</option>
                        @foreach (var c in Model.Cities)
                        {
                            <option value="@c.Id" selected="@(Model.CityId == c.Id)">@c.Name</option>
                        }
                    </select>
                </div>
                <div class="filter-group">
                    <label>محله / منطقه</label>
                    <select name="DistrictId" onchange="this.form.submit()">
                        <option value="">همه محله‌ها</option>
                        @foreach (var d in Model.Districts)
                        {
                            <option value="@d.Id" selected="@(Model.DistrictId == d.Id)">@d.Name</option>
                        }
                    </select>
                </div>
                <div class="filter-group">
                    <label>نقش / رشته</label>
                    <select name="RoleId" onchange="this.form.submit()">
                        <option value="">همه نقش‌ها</option>
                        @foreach (var r in Model.Roles)
                        {
                            <option value="@r.Id" selected="@(Model.RoleId == r.Id)">@r.Name</option>
                        }
                    </select>
                </div>
                <div class="filter-group">
                    <label>جنسیت</label>
                    <select name="GenderFilter" onchange="this.form.submit()">
                        <option value="">فرقی نمی‌کند</option>
                        <option value="1" selected="@(Model.GenderFilter == JobsMedical.Web.Models.Gender.Male)">آقا</option>
                        <option value="2" selected="@(Model.GenderFilter == JobsMedical.Web.Models.Gender.Female)">خانم</option>
                    </select>
                </div>
                <div class="filter-group">
                    <label>نوع همکاری</label>
                    <select name="EmploymentType" onchange="this.form.submit()">
                        <option value="">همه</option>
                        <option value="0" selected="@(Model.EmploymentType == JobsMedical.Web.Models.EmploymentType.FullTime)">تمام‌وقت</option>
                        <option value="1" selected="@(Model.EmploymentType == JobsMedical.Web.Models.EmploymentType.PartTime)">پاره‌وقت</option>
                        <option value="2" selected="@(Model.EmploymentType == JobsMedical.Web.Models.EmploymentType.Contract)">قراردادی</option>
                        <option value="3" selected="@(Model.EmploymentType == JobsMedical.Web.Models.EmploymentType.Plan)">طرح</option>
                    </select>
                </div>
                <a asp-page="/Jobs/Index" class="btn btn-outline btn-block">حذف فیلترها</a>
            </form>
        </aside>

        <div>
            @if (Model.Results.Count == 0)
            {
                <div class="card empty-state">موقعیتی با این فیلترها پیدا نشد.</div>
            }
            else
            {
                <div class="grid grid-3">
                    @foreach (var j in Model.Results)
                    {
                        <partial name="_JobCard" model="j" />
                    }
                </div>
            }
        </div>
    </div>
</div>

@section Scripts {
    <script>
        var btn = document.getElementById('nearMeBtn');
        if (btn) {
            btn.addEventListener('click', function () {
                if (!navigator.geolocation) { alert('مرورگر شما از موقعیت‌یابی پشتیبانی نمی‌کند.'); return; }
                btn.textContent = 'در حال یافتن موقعیت شما...'; btn.disabled = true;
                navigator.geolocation.getCurrentPosition(function (pos) {
                    var form = document.getElementById('filterForm');
                    form.querySelector('[name=Lat]').value = pos.coords.latitude;
                    form.querySelector('[name=Lng]').value = pos.coords.longitude;
                    form.submit();
                }, function () {
                    alert('دسترسی به موقعیت داده نشد.'); btn.textContent = '📍 نزدیک من'; btn.disabled = false;
                });
            });
        }
    </script>
}
