244 lines
12 KiB
PHP
244 lines
12 KiB
PHP
@extends('admin.layouts.app')
|
||
@section('title', 'Bildirimler')
|
||
@section('page-title', 'Bildirim Yönetimi')
|
||
|
||
@section('content')
|
||
|
||
{{-- Stats --}}
|
||
<div class="row g-3 mb-4">
|
||
<div class="col-6 col-md-3">
|
||
<div class="stat-card">
|
||
<div class="stat-card-top">
|
||
<div>
|
||
<div class="stat-value">{{ number_format($stats['total']) }}</div>
|
||
<div class="stat-label mt-1">Toplam Bildirim</div>
|
||
</div>
|
||
<div class="stat-icon violet"><i class="bi bi-bell-fill"></i></div>
|
||
</div>
|
||
</div>
|
||
</div>
|
||
<div class="col-6 col-md-3">
|
||
<div class="stat-card">
|
||
<div class="stat-card-top">
|
||
<div>
|
||
<div class="stat-value">{{ number_format($stats['unread']) }}</div>
|
||
<div class="stat-label mt-1">Okunmamış</div>
|
||
</div>
|
||
<div class="stat-icon orange"><i class="bi bi-eye-slash-fill"></i></div>
|
||
</div>
|
||
</div>
|
||
</div>
|
||
<div class="col-6 col-md-3">
|
||
<div class="stat-card">
|
||
<div class="stat-card-top">
|
||
<div>
|
||
<div class="stat-value">{{ number_format($stats['users']) }}</div>
|
||
<div class="stat-label mt-1">Kullanıcı</div>
|
||
</div>
|
||
<div class="stat-icon green"><i class="bi bi-people-fill"></i></div>
|
||
</div>
|
||
</div>
|
||
</div>
|
||
<div class="col-6 col-md-3">
|
||
<div class="stat-card">
|
||
<div class="stat-card-top">
|
||
<div>
|
||
<div class="stat-value">{{ number_format($stats['today']) }}</div>
|
||
<div class="stat-label mt-1">Bugün Gönderildi</div>
|
||
</div>
|
||
<div class="stat-icon cyan"><i class="bi bi-send-fill"></i></div>
|
||
</div>
|
||
</div>
|
||
</div>
|
||
</div>
|
||
|
||
<div class="row g-4">
|
||
|
||
{{-- ── Sol: Gönder ── --}}
|
||
<div class="col-lg-5">
|
||
<div class="card">
|
||
<div class="card-header">
|
||
<i class="bi bi-send" style="color:var(--accent-lt)"></i>
|
||
<h6>Bildirim Gönder</h6>
|
||
</div>
|
||
<div class="card-body">
|
||
<form method="POST" action="{{ route('admin.notifications.send') }}">
|
||
@csrf
|
||
|
||
<div class="mb-3">
|
||
<label class="form-label">Başlık <span style="color:var(--danger)">*</span></label>
|
||
<input type="text" name="title" class="form-control"
|
||
value="{{ old('title') }}" placeholder="Yeni Bölüm Yüklendi!" maxlength="100" required>
|
||
</div>
|
||
|
||
<div class="mb-3">
|
||
<label class="form-label">Mesaj <span style="color:var(--danger)">*</span></label>
|
||
<textarea name="body" id="notif-body" class="form-control" rows="3"
|
||
placeholder="Yeni bölümler yayında, hemen izle!" maxlength="500" required>{{ old('body') }}</textarea>
|
||
<div class="form-text">
|
||
<span id="bodyCount">{{ strlen(old('body','')) }}</span>/500 karakter
|
||
</div>
|
||
</div>
|
||
|
||
<div class="mb-3">
|
||
<label class="form-label">
|
||
Link <span style="color:var(--text2);font-size:11px">(opsiyonel)</span>
|
||
</label>
|
||
<input type="url" name="url" class="form-control"
|
||
value="{{ old('url') }}" placeholder="https://...">
|
||
</div>
|
||
|
||
<div class="mb-3">
|
||
<label class="form-label">İkon</label>
|
||
<div class="input-group">
|
||
<span class="input-group-text" style="min-width:42px;justify-content:center">
|
||
<i id="iconPreview" class="bi bi-megaphone-fill" style="color:var(--accent-lt)"></i>
|
||
</span>
|
||
<input type="text" name="icon" id="iconInput" class="form-control"
|
||
value="{{ old('icon','bi-megaphone-fill') }}" placeholder="bi-megaphone-fill">
|
||
</div>
|
||
<div class="d-flex gap-2 flex-wrap mt-2">
|
||
@foreach(['bi-megaphone-fill','bi-star-fill','bi-bell-fill','bi-gift-fill','bi-play-circle-fill','bi-trophy-fill','bi-info-circle-fill','bi-exclamation-triangle-fill'] as $ic)
|
||
<button type="button" class="icon-preset"
|
||
style="width:32px;height:32px;border-radius:8px;border:1px solid var(--border2);background:var(--surface2);color:var(--text2);cursor:pointer;display:flex;align-items:center;justify-content:center;font-size:14px;transition:all .12s"
|
||
data-icon="{{ $ic }}" title="{{ $ic }}">
|
||
<i class="bi {{ $ic }}"></i>
|
||
</button>
|
||
@endforeach
|
||
</div>
|
||
</div>
|
||
|
||
<div class="mb-4">
|
||
<label class="form-label">Hedef Kitle <span style="color:var(--danger)">*</span></label>
|
||
<select name="target" class="form-select" required>
|
||
<option value="all" {{ old('target','all')==='all' ?'selected':'' }}>
|
||
Tüm Kullanıcılar ({{ number_format($stats['users']) }})
|
||
</option>
|
||
<option value="premium" {{ old('target')==='premium' ?'selected':'' }}>Sadece Premium Üyeler</option>
|
||
<option value="free" {{ old('target')==='free' ?'selected':'' }}>Sadece Ücretsiz Üyeler</option>
|
||
</select>
|
||
</div>
|
||
|
||
<button type="submit" class="btn btn-primary w-100"
|
||
onclick="return confirm('Bildirim gönderilsin mi?')">
|
||
<i class="bi bi-send"></i> Bildirimi Gönder
|
||
</button>
|
||
</form>
|
||
</div>
|
||
</div>
|
||
</div>
|
||
|
||
{{-- ── Sağ: Son Bildirimler ── --}}
|
||
<div class="col-lg-7">
|
||
<div class="card">
|
||
<div class="card-header">
|
||
<i class="bi bi-clock-history" style="color:var(--info)"></i>
|
||
<h6>Son Bildirimler</h6>
|
||
<span style="font-size:12px;color:var(--text2);margin-left:4px">Son 50</span>
|
||
</div>
|
||
<div class="table-responsive">
|
||
<table class="table">
|
||
<thead>
|
||
<tr>
|
||
<th style="padding-left:20px">Kullanıcı</th>
|
||
<th>Tür</th>
|
||
<th>İçerik</th>
|
||
<th style="text-align:center">Durum</th>
|
||
<th>Tarih</th>
|
||
</tr>
|
||
</thead>
|
||
<tbody>
|
||
@forelse($recent as $n)
|
||
@php $d = $n->data; @endphp
|
||
<tr>
|
||
<td style="padding-left:20px;font-size:13px;font-weight:600;color:var(--text)">
|
||
{{ $n->user?->name ?? '—' }}
|
||
@if($n->user?->username)
|
||
<div style="font-size:11.5px;font-weight:400;color:var(--text2)">@{{ $n->user->username }}</div>
|
||
@endif
|
||
</td>
|
||
<td>
|
||
@if($n->type === 'admin')
|
||
<span class="badge" style="background:var(--accent-dim);color:var(--accent-lt)">Admin</span>
|
||
@elseif($n->type === 'episode')
|
||
<span class="badge bg-success">Bölüm</span>
|
||
@else
|
||
<span class="badge bg-secondary">{{ $n->type }}</span>
|
||
@endif
|
||
</td>
|
||
<td style="max-width:180px">
|
||
@if($n->type === 'admin')
|
||
<div style="font-size:13px;font-weight:600;color:var(--text)">{{ $d['title'] ?? '' }}</div>
|
||
@if(!empty($d['body']))
|
||
<div style="font-size:12px;color:var(--text2)">{{ Str::limit($d['body'],55) }}</div>
|
||
@endif
|
||
@elseif($n->type === 'episode')
|
||
<div style="font-size:12.5px;color:var(--info);font-weight:600">{{ $d['anime_title'] ?? '' }}</div>
|
||
<div style="font-size:12px;color:var(--text2)">{{ $d['episode_number'] ?? '' }}. Bölüm</div>
|
||
@endif
|
||
</td>
|
||
<td style="text-align:center">
|
||
@if($n->read_at)
|
||
<span style="font-size:12px;color:var(--text3);display:inline-flex;align-items:center;gap:3px">
|
||
<i class="bi bi-check2-all" style="font-size:11px"></i> Okundu
|
||
</span>
|
||
@else
|
||
<span style="font-size:12px;color:var(--warning);display:inline-flex;align-items:center;gap:4px">
|
||
<i class="bi bi-circle-fill" style="font-size:6px"></i> Yeni
|
||
</span>
|
||
@endif
|
||
</td>
|
||
<td style="font-size:12px;color:var(--text2)">{{ $n->created_at->format('d.m H:i') }}</td>
|
||
</tr>
|
||
@empty
|
||
<tr>
|
||
<td colspan="5">
|
||
<div class="empty-state py-4">
|
||
<i class="bi bi-bell"></i>
|
||
<p>Henüz bildirim gönderilmemiş.</p>
|
||
</div>
|
||
</td>
|
||
</tr>
|
||
@endforelse
|
||
</tbody>
|
||
</table>
|
||
</div>
|
||
</div>
|
||
</div>
|
||
|
||
</div>
|
||
@endsection
|
||
|
||
@push('scripts')
|
||
<script>
|
||
// Karakter sayacı
|
||
const bodyTa = document.getElementById('notif-body');
|
||
const bodyCount = document.getElementById('bodyCount');
|
||
if (bodyTa && bodyCount) {
|
||
bodyTa.addEventListener('input', () => {
|
||
bodyCount.textContent = bodyTa.value.length;
|
||
bodyCount.style.color = bodyTa.value.length > 450 ? 'var(--danger)' : '';
|
||
});
|
||
}
|
||
// İkon preview
|
||
const iconInput = document.getElementById('iconInput');
|
||
const iconPreview = document.getElementById('iconPreview');
|
||
if (iconInput) {
|
||
iconInput.addEventListener('input', () => {
|
||
iconPreview.className = 'bi ' + iconInput.value.trim();
|
||
});
|
||
}
|
||
document.querySelectorAll('.icon-preset').forEach(btn => {
|
||
btn.addEventListener('click', () => {
|
||
const ic = btn.dataset.icon;
|
||
if (iconInput) { iconInput.value = ic; }
|
||
if (iconPreview) { iconPreview.className = 'bi ' + ic; }
|
||
document.querySelectorAll('.icon-preset').forEach(b => b.style.borderColor = '');
|
||
btn.style.borderColor = 'var(--accent)';
|
||
btn.style.background = 'var(--accent-dim)';
|
||
btn.style.color = 'var(--accent-lt)';
|
||
});
|
||
});
|
||
</script>
|
||
@endpush
|