@extends('layout',['heading'=>__('ui.clinics_subscriptions')]) @section('content')<div class="flex flex-wrap items-center justify-between gap-3 mb-5"><div><h2 class="text-xl font-bold">{{ __('ui.clinics_subscriptions') }}</h2><p class="text-slate-500">{{ __('ui.clinics_page_intro') }}</p></div><div class="flex gap-2"><a class="btn" href="/admin/clinics/reset-password">{{ __('ui.reset_clinic_password') }}</a><button class="btn" onclick="openModal('newClinicModal')">+ {{ __('ui.add_new_clinic') }}</button></div></div>@if(session('ok'))<div class="bg-green-50 text-green-700 rounded-lg p-3 mb-4">{{ session('ok') }}</div>@endif @if($errors->any())<div class="bg-red-50 text-red-700 rounded-lg p-3 mb-4">{{ $errors->first() }}</div>@endif<div class="card p-5 overflow-x-auto"><table class="w-full text-right"><thead class="border-b text-slate-500"><tr><th class="p-3">{{ __('ui.code') }}</th><th class="p-3">{{ __('ui.clinic') }}</th><th class="p-3">{{ __('ui.clinic_login_link') }}</th><th class="p-3">{{ __('ui.activation_status') }}</th><th class="p-3">{{ __('ui.type') }}</th><th class="p-3">{{ __('ui.subscription_start') }}</th><th class="p-3">{{ __('ui.subscription_end') }}</th><th class="p-3">{{ __('ui.current_subscription_value') }}</th><th class="p-3">{{ __('ui.last_payment_date') }}</th><th class="p-3">{{ __('ui.amount') }}</th><th class="p-3">{{ __('ui.payment_method') }}</th><th class="p-3">{{ __('ui.action') }}</th></tr></thead><tbody>@forelse($clinics as $c)<tr class="border-b"><td class="p-3 font-bold text-cyan-700">{{ $c->code }}</td><td class="p-3"><b>{{ $c->name }}</b><div class="text-xs text-slate-500">{{ __('ui.login_label') }}: {{ $c->login_name }}</div></td><td class="p-3"><a class="btn text-xs inline-block" target="_blank" rel="noopener" href="{{ url('/clinic/'.$c->code.'/login') }}">{{ __('ui.open_clinic_login') }}</a><div class="text-xs text-slate-500 mt-1 break-all">{{ url('/clinic/'.$c->code.'/login') }}</div></td><td class="p-3"><span class="inline-block rounded-full px-2 py-1 text-xs {{ $c->is_active ? 'bg-emerald-100 text-emerald-700' : 'bg-red-100 text-red-700' }}">{{ $c->is_active ? __('ui.active') : __('ui.inactive') }}</span><form method="post" action="/admin/clinics/{{ $c->id }}/toggle-status" class="mt-2" onsubmit="return confirm(@js($c->is_active ? __('ui.confirm_deactivate_clinic') : __('ui.confirm_activate_clinic')))">@csrf<button class="btn text-xs" type="submit">{{ $c->is_active ? __('ui.deactivate_clinic') : __('ui.activate_clinic') }}</button></form></td><td class="p-3">{{ ['normal'=>__('ui.normal_clinic'),'multi_branch'=>__('ui.multi_branch'),'multi_specialty'=>__('ui.multi_specialty'),'multi_branch_specialty'=>__('ui.multi_branch_specialty')][$c->clinic_type] ?? $c->clinic_type }}</td><td class="p-3">{{ $c->subscription_started_at }}</td><td class="p-3">{{ $c->subscription_expires_at }}</td><td class="p-3">{{ number_format($c->subscription_amount ?? 0,2) }} {{ __('ui.currency') }}</td><td class="p-3">{{ $c->last_payment_at ?: ($c->latest_payment_date ?? '—') }}</td><td class="p-3">{{ number_format($c->paid_total,2) }} {{ __('ui.currency') }}</td><td class="p-3"><span class="inline-block rounded-full px-2 py-1 text-xs {{ $c->latest_payment_method==='instapay'?'bg-blue-100 text-blue-700':'bg-emerald-100 text-emerald-700' }}">{{ $c->latest_payment_method==='instapay' ? __('ui.instapay') : __('ui.cash') }}</span><div class="text-xs text-slate-500">{{ $c->latest_payment_date }}</div></td><td class="p-3"><a class="btn text-sm" href="/admin/clinics/{{ $c->id }}/edit">{{ __('ui.edit_clinic') }}</a><button class="btn text-sm" onclick="openRenew({{ $c->id }},'{{ addslashes($c->name) }}','{{ $c->subscription_expires_at }}')">{{ __('ui.renew_subscription') }}</button></td></tr>@empty<tr><td colspan="12" class="p-6 text-center text-slate-500">{{ __('ui.no_registered_clinics') }}</td></tr>@endforelse</tbody></table></div><div id="newClinicModal" class="modal hidden"><div class="modal-panel"><div class="flex justify-between items-center mb-4"><h2 class="text-xl font-bold">{{ __('ui.add_new_clinic') }}</h2><button type="button" class="close" onclick="closeModal('newClinicModal')">×</button></div><form method="post" id="clinicForm" class="grid md:grid-cols-2 gap-3">@csrf<input class="input" name="name" required placeholder="{{ __('ui.clinic_name') }}"><input class="input" name="login_name" required pattern="[A-Za-z0-9_-]+" placeholder="{{ __('ui.login_name') }}"><input class="input" type="password" name="clinic_password" required minlength="6" placeholder="{{ __('ui.password') }}"><select class="input" name="clinic_type" id="clinicType" required><option value="normal">{{ __('ui.normal_clinic') }}</option><option value="multi_branch">{{ __('ui.multi_branch') }}</option><option value="multi_specialty">{{ __('ui.multi_specialty') }}</option><option value="multi_branch_specialty">{{ __('ui.multi_branch_specialty') }}</option></select><div id="mainSpecialty"><select class="input" name="specialty"><option value="">{{ __('ui.choose_main_specialty') }}</option>@foreach([__('ui.internal_medicine'),__('ui.chest'),__('ui.dermatology'),__('ui.dental'),__('ui.ophthalmology'),__('ui.pediatrics'),__('ui.obstetrics_gynecology'),__('ui.orthopedics'),__('ui.ent'),__('ui.cardiology')] as $s)<option>{{ $s }}</option>@endforeach</select></div><div id="branchBox" class="hidden md:col-span-2"><label>{{ __('ui.branch_count') }}<input class="input" type="number" min="1" name="branch_count" id="branchCount" value="1" placeholder="{{ __('ui.branch_count') }}"></label><div id="branchDoctorsBox" class="grid md:grid-cols-2 gap-2 mt-2"></div></div><div id="specialtyBox" class="hidden md:col-span-2"><label>{{ __('ui.specialties_doctors_count') }}</label><div class="grid md:grid-cols-2 gap-2 border rounded p-3">@foreach([__('ui.internal_medicine'),__('ui.chest'),__('ui.dermatology'),__('ui.dental'),__('ui.ophthalmology'),__('ui.pediatrics'),__('ui.obstetrics_gynecology'),__('ui.orthopedics'),__('ui.ent'),__('ui.cardiology')] as $sp)<label class="flex items-center gap-2"><input type="checkbox" class="specialty-check" value="{{ $sp }}"><span class="flex-1">{{ $sp }}</span><input type="number" min="1" value="1" class="doctor-count hidden w-16 border rounded p-1" placeholder="{{ __('ui.doctors') }}"><input type="text" class="requirement hidden flex-1 border rounded p-1" placeholder="{{ __('ui.requirements') }} {{ $sp }}"></label>@endforeach</div><input type="hidden" name="specialties_config" id="specialtiesConfig"></div><select class="input" name="subscription_type" id="subscriptionType"><option value="monthly">{{ __('ui.monthly_subscription') }}</option><option value="quarterly">{{ __('ui.quarterly_subscription') }}</option><option value="semiannual">{{ __('ui.semiannual_subscription') }}</option><option value="annual">{{ __('ui.annual_subscription') }}</option></select><label>{{ __('ui.payment_start_date') }}<input class="input" type="date" name="subscription_started_at" id="startDate" required></label><label class="date-field">{{ __('ui.subscription_end') }}<input class="input" type="date" name="subscription_expires_at" id="endDate" readonly></label><input class="input" type="number" min="0" step=".01" name="base_subscription_amount" id="baseAmount" value="{{ $pricing->base_monthly_price ?? 0 }}" required placeholder="{{ __('ui.base_price_egp') }}"><label id="branchPriceField" class="conditional-pricing-field hidden">{{ __('ui.additional_branch_price') }}<input class="input" type="number" min="0" step=".01" name="branch_unit_price" id="branchUnitPrice" value="{{ $pricing->branch_monthly_price ?? 0 }}" placeholder="{{ __('ui.price_per_branch') }}"></label><label id="doctorPriceField" class="conditional-pricing-field hidden">{{ __('ui.additional_doctor_price') }}<input class="input" type="number" min="0" step=".01" name="doctor_unit_price" id="doctorUnitPrice" value="{{ $pricing->doctor_monthly_price ?? 0 }}" placeholder="{{ __('ui.price_per_doctor') }}"></label><input type="hidden" name="subscription_amount" id="calculatedAmount" value="0"><div class="md:col-span-2 rounded-xl bg-teal-50 text-teal-800 p-3">{{ __('ui.calculated_subscription_total') }}: <strong id="calculatedAmountLabel">0.00 {{ __('ui.currency') }}</strong></div><select class="input" name="payment_method" required><option value="cash">{{ __('ui.cash') }}</option><option value="instapay">{{ __('ui.instapay_transfer') }}</option></select><div class="md:col-span-2 flex justify-end gap-2"><button type="button" class="btn bg-slate-400" onclick="closeModal('newClinicModal')">{{ __('ui.cancel') }}</button><button class="btn">{{ __('ui.create_clinic') }}</button></div></form></div></div><div id="renewModal" class="modal hidden"><div class="modal-panel max-w-lg"><div class="flex justify-between items-center mb-4"><h2 class="text-xl font-bold">{{ __('ui.renew_clinic_subscription') }}</h2><button type="button" class="close" onclick="closeModal('renewModal')">×</button></div><p id="renewClinicName" class="text-cyan-700 font-bold mb-3"></p><form method="post" id="renewForm" class="grid md:grid-cols-2 gap-3">@csrf<select class="input" name="subscription_type" id="renewSubscriptionType" required><option value="monthly">{{ __('ui.monthly_subscription_short') }}</option><option value="quarterly">{{ __('ui.quarterly_subscription') }}</option><option value="semiannual">{{ __('ui.semiannual_subscription') }}</option><option value="annual">{{ __('ui.annual_subscription') }}</option></select><input class="input" type="number" min="0" step=".01" name="amount" required placeholder="{{ __('ui.paid_amount_egp') }}"><label>{{ __('ui.payment_date') }}<input class="input" type="date" name="payment_date" id="renewPayment" required></label><label>{{ __('ui.subscription_start') }}<input class="input" type="date" name="period_started_at" id="renewStart" required></label><label>{{ __('ui.subscription_end') }}<input class="input" type="date" name="period_ends_at" id="renewEnd" required readonly></label><select class="input" name="payment_method" required><option value="cash">{{ __('ui.cash') }}</option><option value="instapay">{{ __('ui.instapay_transfer') }}</option></select><div class="md:col-span-2 flex justify-end"><button class="btn">{{ __('ui.save_renewal') }}</button></div></form></div></div><style>.modal{position:fixed;inset:0;background:rgba(15,23,42,.65);z-index:50;display:flex;align-items:center;justify-content:center;padding:.5rem;font-size:13px}.modal.hidden{display:none}.modal-panel{background:white;border-radius:.8rem;padding:1rem;width:min(900px,100%);max-height:94vh;overflow-y:auto;box-shadow:0 20px 60px #0004}.modal-panel h2{font-size:1.1rem}.modal-panel label{font-size:12px}.close{font-size:1.6rem;color:#64748b}.btn{background:#0e7490;color:white;border-radius:.5rem;padding:.5rem .75rem;font-size:13px}.input{border:1px solid #cbd5e1;border-radius:.5rem;padding:.45rem .55rem;width:100%;font-size:13px}.modal-panel form{gap:.5rem}</style><script>function openModal(id){document.getElementById(id).classList.remove('hidden')}function closeModal(id){document.getElementById(id).classList.add('hidden')}function dateValue(date){return date.toISOString().slice(0,10)}function addMonthsNoOverflow(value,months){if(!value)return '';const parts=value.split('-').map(Number),year=parts[0],month=parts[1],day=parts[2];const targetMonth=month-1+months,targetYear=year+Math.floor(targetMonth/12),targetMonthIndex=((targetMonth%12)+12)%12;const lastDay=new Date(targetYear,targetMonthIndex+1,0).getDate();return dateValue(new Date(targetYear,targetMonthIndex,Math.min(day,lastDay)))}function updateEndDate(startId,typeId,endId){const start=document.getElementById(startId).value;const typeValue=document.getElementById(typeId).value;const months={monthly:1,quarterly:3,semiannual:6,annual:12}[typeValue];if(start&&months)document.getElementById(endId).value=addMonthsNoOverflow(start,months);else document.getElementById(endId).value=''}function openRenew(id,name,expiry){document.getElementById('renewForm').action='/admin/clinics/'+id+'/renew';document.getElementById('renewClinicName').textContent=name;document.getElementById('renewStart').value=expiry||dateValue(new Date());document.getElementById('renewPayment').value=dateValue(new Date());document.getElementById('renewSubscriptionType').value='monthly';updateEndDate('renewStart','renewSubscriptionType','renewEnd');openModal('renewModal')}const type=document.getElementById('clinicType'),branchBox=document.getElementById('branchBox'),specialtyBox=document.getElementById('specialtyBox'),mainSpecialty=document.getElementById('mainSpecialty');function refreshType(){const v=type.value,hasBranches=v==='multi_branch'||v==='multi_branch_specialty',hasSpecs=v==='multi_specialty'||v==='multi_branch_specialty';branchBox.classList.toggle('hidden',!hasBranches);document.getElementById('branchCount').required=hasBranches;specialtyBox.classList.toggle('hidden',!hasSpecs);mainSpecialty.classList.toggle('hidden',hasSpecs);document.getElementById('branchPriceField').classList.toggle('hidden',!hasBranches);document.getElementById('doctorPriceField').classList.toggle('hidden',!hasBranches);if(hasBranches)refreshBranchDoctors();else document.getElementById('branchDoctorsBox').innerHTML='';calculateSubscription()}function refreshBranchDoctors(){const n=Number(document.getElementById('branchCount').value||0),box=document.getElementById('branchDoctorsBox');box.innerHTML='';for(let i=1;i<=n;i++)box.insertAdjacentHTML('beforeend','<label>{{ __('ui.doctors_in_branch') }} '+i+'<input class="input branch-doctor-count" type="number" min="0" max="1000" value="0" name="branch_doctors[]"></label>');calculateSubscription()}function calculateSubscription(){const base=Number(document.getElementById('baseAmount')?.value||0),hasBranches=document.getElementById('clinicType').value==='multi_branch'||document.getElementById('clinicType').value==='multi_branch_specialty',branchPrice=hasBranches?Number(document.getElementById('branchUnitPrice')?.value||0):0,doctorPrice=hasBranches?Number(document.getElementById('doctorUnitPrice')?.value||0):0,branches=hasBranches?Number(document.getElementById('branchCount')?.value||0):0,doctors=[...document.querySelectorAll('.branch-doctor-count')].reduce((sum,input)=>sum+Number(input.value||0),0),total=base+branchPrice*branches+doctorPrice*doctors;document.getElementById('calculatedAmount').value=total.toFixed(2);document.getElementById('calculatedAmountLabel').textContent=total.toFixed(2)+' '+@json(__('ui.currency'));}type.addEventListener('change',refreshType);document.getElementById('branchCount').addEventListener('input',refreshBranchDoctors);['baseAmount','branchUnitPrice','doctorUnitPrice'].forEach(id=>document.getElementById(id)?.addEventListener('input',calculateSubscription));document.getElementById('branchDoctorsBox').addEventListener('input',calculateSubscription);document.getElementById('startDate').addEventListener('change',()=>updateEndDate('startDate','subscriptionType','endDate'));document.getElementById('subscriptionType').addEventListener('change',()=>updateEndDate('startDate','subscriptionType','endDate'));document.getElementById('renewStart').addEventListener('change',()=>updateEndDate('renewStart','renewSubscriptionType','renewEnd'));document.getElementById('renewSubscriptionType').addEventListener('change',()=>updateEndDate('renewStart','renewSubscriptionType','renewEnd'));function syncSpecialties(){const list=[];document.querySelectorAll('.specialty-check:checked').forEach(x=>{const rr=x.closest('label');list.push({specialty:x.value,doctors:Math.max(1,+rr.querySelector('.doctor-count').value||1),requirements:rr.querySelector('.requirement').value||null})});document.getElementById('specialtiesConfig').value=JSON.stringify(list)}document.querySelectorAll('.specialty-check').forEach(c=>{c.addEventListener('change',()=>{const r=c.closest('label');r.querySelector('.doctor-count').classList.toggle('hidden',!c.checked);r.querySelector('.requirement').classList.toggle('hidden',!c.checked);syncSpecialties();calculateSubscription()});const r=c.closest('label');r.querySelector('.doctor-count').addEventListener('input',()=>{syncSpecialties();calculateSubscription()});r.querySelector('.requirement').addEventListener('input',syncSpecialties)});refreshType();</script>@endsection