ethanfly/reminder
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

Enhance patient index view with responsive design and improved styling. Added new CSS for patient table, mobile card layout, and optimized elements for better user experience. Updated HTML structure for patient information display and action buttons.

Browse Source
This commit is contained in:
Ethanfly 2026-01-12 12:46:12 +08:00
parent d712732dd4
commit 232b777f6c
1 changed files with 323 additions and 92 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

415
resources/views/patients/index.blade.php
View File

@ -4,7 +4,204 @@
@section('content') @section('content')
<style> <style>
/* 移动端卡片列表 */ /* 防止横向滚动 */
.card {
overflow-x: hidden;
}
/* ==================== PC端表格优化 ==================== */
.patient-table {
width: 100%;
border-collapse: collapse;
}
.patient-table thead {
background: linear-gradient(135deg, #f8fafc 0%, #f1f5f9 100%);
}
.patient-table th {
padding: 14px 12px;
text-align: left;
font-weight: 600;
font-size: 13px;
color: var(--color-text-secondary);
border-bottom: 2px solid var(--color-border);
white-space: nowrap;
}
.patient-table td {
padding: 16px 12px;
border-bottom: 1px solid var(--color-border-light);
vertical-align: middle;
}
.patient-table tbody tr:hover {
background: var(--color-bg-hover);
}
.patient-table tbody tr:last-child td {
border-bottom: none;
}
/* 患者信息单元格 */
.patient-cell {
display: flex;
align-items: center;
gap: 12px;
min-width: 140px;
}
.patient-cell-avatar {
width: 38px;
height: 38px;
border-radius: 50%;
display: flex;
align-items: center;
justify-content: center;
font-weight: 600;
font-size: 14px;
color: white;
flex-shrink: 0;
}
.patient-cell-avatar.male {
background: linear-gradient(135deg, #6366f1 0%, #8b5cf6 100%);
}
.patient-cell-avatar.female {
background: linear-gradient(135deg, #ec4899 0%, #f472b6 100%);
}
.patient-cell-info {
display: flex;
flex-direction: column;
gap: 2px;
}
.patient-cell-name {
font-weight: 600;
color: var(--color-text);
font-size: 14px;
}
.patient-cell-meta {
font-size: 12px;
color: var(--color-text-muted);
}
/* 诊断标签 */
.diagnosis-cell {
display: inline-flex;
align-items: center;
padding: 4px 10px;
background: var(--color-primary-light);
color: var(--color-primary);
border-radius: 6px;
font-size: 12px;
font-weight: 500;
}
/* 进度条 */
.progress-cell {
display: flex;
align-items: center;
gap: 10px;
min-width: 100px;
}
.progress-bar-mini {
flex: 1;
height: 6px;
background: var(--color-border);
border-radius: 3px;
overflow: hidden;
min-width: 50px;
}
.progress-bar-mini-fill {
height: 100%;
background: linear-gradient(90deg, var(--color-success), #34d399);
border-radius: 3px;
}
.progress-text {
font-size: 13px;
color: var(--color-text-secondary);
font-weight: 500;
white-space: nowrap;
}
/* 电话链接 */
.phone-link {
color: var(--color-primary);
text-decoration: none;
font-weight: 500;
white-space: nowrap;
}
.phone-link:hover {
text-decoration: underline;
}
/* 备注 */
.remark-cell {
max-width: 120px;
overflow: hidden;
text-overflow: ellipsis;
white-space: nowrap;
color: var(--color-warning);
font-weight: 500;
}
/* 操作按钮组 */
.table-actions {
display: flex;
gap: 8px;
justify-content: flex-end;
}
.table-actions .btn-icon {
width: 34px;
height: 34px;
padding: 0;
display: flex;
align-items: center;
justify-content: center;
border-radius: 8px;
border: 1px solid var(--color-border);
background: var(--color-bg-card);
cursor: pointer;
transition: all 0.2s;
}
.table-actions .btn-icon:hover {
background: var(--color-bg-hover);
}
.table-actions .btn-icon.success {
color: var(--color-success);
border-color: var(--color-success);
}
.table-actions .btn-icon.success:hover {
background: var(--color-success-light);
}
.table-actions .btn-icon.danger {
color: var(--color-danger);
border-color: var(--color-danger);
}
.table-actions .btn-icon.danger:hover {
background: var(--color-danger-light);
}
.table-actions .btn-icon svg {
width: 16px;
height: 16px;
}
/* ==================== 移动端卡片优化 ==================== */
.mobile-patient-list { .mobile-patient-list {
display: none; display: none;
} }
@ -12,33 +209,35 @@
.mobile-patient-card { .mobile-patient-card {
background: var(--color-bg-card); background: var(--color-bg-card);
border: 1px solid var(--color-border); border: 1px solid var(--color-border);
border-radius: 12px; border-radius: 16px;
padding: 16px; padding: 16px;
margin-bottom: 12px; margin-bottom: 16px;
box-shadow: 0 2px 8px rgba(0,0,0,0.04);
overflow: hidden;
} }
.mobile-patient-header { .mobile-patient-header {
display: flex; display: flex;
align-items: center; align-items: flex-start;
justify-content: space-between; justify-content: space-between;
margin-bottom: 12px; margin-bottom: 16px;
} }
.mobile-patient-info { .mobile-patient-info {
display: flex; display: flex;
align-items: center; align-items: center;
gap: 12px; gap: 14px;
} }
.mobile-patient-avatar { .mobile-patient-avatar {
width: 44px; width: 50px;
height: 44px; height: 50px;
border-radius: 50%; border-radius: 50%;
display: flex; display: flex;
align-items: center; align-items: center;
justify-content: center; justify-content: center;
font-weight: 600; font-weight: 600;
font-size: 16px; font-size: 18px;
color: white; color: white;
flex-shrink: 0; flex-shrink: 0;
} }
@ -53,13 +252,13 @@
.mobile-patient-name { .mobile-patient-name {
font-weight: 600; font-weight: 600;
font-size: 16px; font-size: 17px;
color: var(--color-text); color: var(--color-text);
margin-bottom: 2px; margin-bottom: 4px;
} }
.mobile-patient-meta { .mobile-patient-meta {
font-size: 13px; font-size: 14px;
color: var(--color-text-secondary); color: var(--color-text-secondary);
} }
@ -67,105 +266,132 @@
display: grid; display: grid;
grid-template-columns: 1fr 1fr; grid-template-columns: 1fr 1fr;
gap: 10px; gap: 10px;
margin-bottom: 12px; margin-bottom: 16px;
padding: 12px; padding: 12px 14px;
background: var(--color-bg); background: linear-gradient(135deg, #f8fafc 0%, #f1f5f9 100%);
border-radius: 8px; border-radius: 12px;
overflow: hidden;
} }
.mobile-info-item { .mobile-info-item {
display: flex; display: flex;
flex-direction: column; flex-direction: column;
gap: 2px; gap: 4px;
} }
.mobile-info-label { .mobile-info-label {
font-size: 11px; font-size: 12px;
color: var(--color-text-muted); color: var(--color-text-muted);
text-transform: uppercase;
letter-spacing: 0.5px;
} }
.mobile-info-value { .mobile-info-value {
font-size: 13px; font-size: 14px;
color: var(--color-text); color: var(--color-text);
font-weight: 500; font-weight: 500;
word-break: break-all;
overflow-wrap: break-word;
} }
.mobile-info-value a { .mobile-info-value a {
color: var(--color-primary); color: var(--color-primary);
text-decoration: none; text-decoration: none;
word-break: break-all;
} }
.mobile-patient-progress { .mobile-patient-progress {
margin-bottom: 12px; margin-bottom: 16px;
} }
.mobile-progress-header { .mobile-progress-header {
display: flex; display: flex;
justify-content: space-between; justify-content: space-between;
align-items: center; align-items: center;
margin-bottom: 6px; margin-bottom: 8px;
} }
.mobile-progress-label { .mobile-progress-label {
font-size: 12px; font-size: 13px;
color: var(--color-text-secondary); color: var(--color-text-secondary);
} }
.mobile-progress-value { .mobile-progress-value {
font-size: 12px; font-size: 13px;
font-weight: 600; font-weight: 600;
color: var(--color-text); color: var(--color-text);
} }
.mobile-progress-bar { .mobile-progress-bar {
height: 6px; height: 8px;
background: var(--color-border); background: var(--color-border);
border-radius: 3px; border-radius: 4px;
overflow: hidden; overflow: hidden;
} }
.mobile-progress-fill { .mobile-progress-fill {
height: 100%; height: 100%;
background: linear-gradient(90deg, var(--color-success), #34d399); background: linear-gradient(90deg, var(--color-success), #34d399);
border-radius: 3px; border-radius: 4px;
transition: width 0.3s ease; transition: width 0.3s ease;
} }
.mobile-patient-remark { .mobile-patient-remark {
padding: 10px 12px; display: flex;
background: var(--color-warning-light); align-items: center;
gap: 8px;
padding: 12px 14px;
background: linear-gradient(135deg, #fffbeb 0%, #fef3c7 100%);
border-left: 3px solid var(--color-warning); border-left: 3px solid var(--color-warning);
border-radius: 6px; border-radius: 8px;
margin-bottom: 12px; margin-bottom: 16px;
font-size: 13px; font-size: 14px;
color: var(--color-warning); color: #b45309;
font-weight: 500; font-weight: 500;
} }
.mobile-patient-actions { .mobile-patient-actions {
display: flex; display: flex;
gap: 10px; gap: 8px;
} }
.mobile-patient-actions .btn { .mobile-patient-actions .btn {
flex: 1; flex: 1;
justify-content: center; justify-content: center;
padding: 10px 12px; padding: 10px 12px;
font-size: 13px;
border-radius: 10px;
min-width: 0;
white-space: nowrap;
} }
.mobile-patient-actions form { .mobile-patient-actions form {
flex: 1; flex: 1;
display: flex; display: flex;
min-width: 0;
} }
.mobile-patient-actions form .btn { .mobile-patient-actions form .btn {
width: 100%; width: 100%;
} }
.mobile-action-delete {
flex: 0 0 44px !important;
width: 44px !important;
height: 44px;
padding: 0 !important;
display: flex;
align-items: center;
justify-content: center;
border: 1px solid var(--color-danger) !important;
color: var(--color-danger) !important;
background: transparent !important;
}
.mobile-action-delete form {
flex: 0 0 auto !important;
}
/* 移动端显示控制 */ /* 移动端显示控制 */
@media (max-width: 768px) { @media (max-width: 900px) {
.table-container { .table-container {
display: none !important; display: none !important;
} }
@ -233,96 +459,101 @@
</div> </div>
</div> </div>
@else @else
<!-- 桌面端表格 --> <!-- PC端表格 -->
<div class="table-container"> <div class="table-container">
<table> <table class="patient-table">
<thead> <thead>
<tr> <tr>
<th>姓名</th> <th>患者信息</th>
<th>性别</th> <th>诊断</th>
<th>年龄</th>
<th>出院诊断</th>
<th>转诊日期</th> <th>转诊日期</th>
<th>随访进度</th> <th>随访进度</th>
<th>状态</th> <th>状态</th>
<th>联系方式</th> <th>联系方式</th>
<th>备注</th> <th>备注</th>
<th>操作</th> <th style="text-align: right;">操作</th>
</tr> </tr>
</thead> </thead>
<tbody> <tbody>
@foreach($patients as $patient) @foreach($patients as $patient)
@php
$total = count($patient->getFollowUpSchedule());
$completed = $patient->follow_up_count;
$status = $patient->getFollowUpStatus();
@endphp
<tr> <tr>
<td> <td>
<strong>{{ $patient->name }}</strong> <div class="patient-cell">
</td> <div class="patient-cell-avatar {{ $patient->gender == '女' ? 'female' : 'male' }}">
<td>{{ $patient->gender }}</td> {{ mb_substr($patient->name, 0, 1) }}
<td>{{ $patient->age }}岁</td> </div>
<td>{{ $patient->getDiagnosisType() }}</td> <div class="patient-cell-info">
<td>{{ $patient->discharge_date->format('Y-m-d') }}</td> <span class="patient-cell-name">{{ $patient->name }}</span>
<td> <span class="patient-cell-meta">{{ $patient->gender }} · {{ $patient->age }}岁</span>
@php
$total = count($patient->getFollowUpSchedule());
$completed = $patient->follow_up_count;
@endphp
<div style="display: flex; align-items: center; gap: 8px;">
<div style="width: 60px; height: 6px; background: var(--color-border); border-radius: 3px; overflow: hidden;">
<div style="width: {{ ($completed / $total) * 100 }}%; height: 100%; background: var(--color-success); border-radius: 3px;"></div>
</div> </div>
<span style="font-size: 13px; color: var(--color-text-secondary);">{{ $completed }}/{{ $total }}</span>
</div> </div>
</td> </td>
<td> <td>
@php <span class="diagnosis-cell">{{ $patient->getDiagnosisType() }}</span>
$status = $patient->getFollowUpStatus(); </td>
$nextDate = $patient->getNextFollowUpDate(); <td>{{ $patient->discharge_date->format('Y-m-d') }}</td>
@endphp <td>
<div class="progress-cell">
<div class="progress-bar-mini">
<div class="progress-bar-mini-fill" style="width: {{ ($completed / $total) * 100 }}%"></div>
</div>
<span class="progress-text">{{ $completed }}/{{ $total }}</span>
</div>
</td>
<td>
@if($patient->isCompleted()) @if($patient->isCompleted())
<span class="badge badge-success">已完成</span> <span class="badge badge-success">已完成</span>
@elseif(str_contains($status, '过期')) @elseif(str_contains($status, '过期'))
<span class="badge badge-danger">{{ $status }}</span> <span class="badge badge-danger">{{ $status }}</span>
@elseif(str_contains($status, '今日')) @elseif(str_contains($status, '今日'))
<span class="badge badge-warning">{{ $status }}</span> <span class="badge badge-warning">{{ $status }}</span>
@elseif(str_contains($status, '即将'))
<span class="badge badge-info">{{ $status }}</span>
@else @else
<span class="badge badge-info">{{ $status }}</span> <span class="badge badge-info">{{ $status }}</span>
@endif @endif
</td> </td>
<td> <td>
@if($patient->phone) @if($patient->phone)
<a href="tel:{{ $patient->phone }}" style="color: var(--color-primary); text-decoration: none;"> <a href="tel:{{ $patient->phone }}" class="phone-link">{{ $patient->phone }}</a>
{{ $patient->phone }}
</a>
@else @else
<span style="color: var(--color-text-muted);">-</span> <span style="color: var(--color-text-muted);">-</span>
@endif @endif
</td> </td>
<td> <td>
@if($patient->remark) @if($patient->remark)
<span style="color: var(--color-warning); font-weight: 500;">{{ $patient->remark }}</span> <span class="remark-cell" title="{{ $patient->remark }}">{{ $patient->remark }}</span>
@else @else
<span style="color: var(--color-text-muted);">-</span> <span style="color: var(--color-text-muted);">-</span>
@endif @endif
</td> </td>
<td> <td>
<div class="action-buttons"> <div class="table-actions">
@if($patient->phone)
<a href="tel:{{ $patient->phone }}" class="btn-icon" title="拨打电话">
<svg viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2">
<path d="M22 16.92v3a2 2 0 0 1-2.18 2 19.79 19.79 0 0 1-8.63-3.07 19.5 19.5 0 0 1-6-6 19.79 19.79 0 0 1-3.07-8.67A2 2 0 0 1 4.11 2h3a2 2 0 0 1 2 1.72 12.84 12.84 0 0 0 .7 2.81 2 2 0 0 1-.45 2.11L8.09 9.91a16 16 0 0 0 6 6l1.27-1.27a2 2 0 0 1 2.11-.45 12.84 12.84 0 0 0 2.81.7A2 2 0 0 1 22 16.92z"/>
</svg>
</a>
@endif
@if(!$patient->isCompleted()) @if(!$patient->isCompleted())
<form action="{{ route('patients.follow-up', $patient) }}" method="POST" style="display: inline;"> <form action="{{ route('patients.follow-up', $patient) }}" method="POST" style="display: inline;">
@csrf @csrf
<button type="submit" class="btn btn-outline btn-sm" onclick="return confirm('确认标记 {{ $patient->name }} 完成第{{ $patient->getNextFollowUpNumber() }}次随访？')"> <button type="submit" class="btn-icon success" title="标记已随访" onclick="return confirm('确认标记 {{ $patient->name }} 完成第{{ $patient->getNextFollowUpNumber() }}次随访？')">
<svg viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" width="14" height="14"> <svg viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2">
<polyline points="20 6 9 17 4 12"/> <polyline points="20 6 9 17 4 12"/>
</svg> </svg>
随访
</button> </button>
</form> </form>
@endif @endif
<form action="{{ route('patients.destroy', $patient) }}" method="POST" style="display: inline;"> <form action="{{ route('patients.destroy', $patient) }}" method="POST" style="display: inline;">
@csrf @csrf
@method('DELETE') @method('DELETE')
<button type="submit" class="btn btn-outline btn-sm" style="color: var(--color-danger);" onclick="return confirm('确认删除患者 {{ $patient->name }}？此操作不可恢复。')"> <button type="submit" class="btn-icon danger" title="删除" onclick="return confirm('确认删除患者 {{ $patient->name }}？')">
<svg viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" width="14" height="14"> <svg viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2">
<polyline points="3 6 5 6 21 6"/> <polyline points="3 6 5 6 21 6"/>
<path d="M19 6v14a2 2 0 0 1-2 2H7a2 2 0 0 1-2-2V6m3 0V4a2 2 0 0 1 2-2h4a2 2 0 0 1 2 2v2"/> <path d="M19 6v14a2 2 0 0 1-2 2H7a2 2 0 0 1-2-2V6m3 0V4a2 2 0 0 1 2-2h4a2 2 0 0 1 2 2v2"/>
</svg> </svg>
@ -352,7 +583,7 @@
</div> </div>
<div> <div>
<div class="mobile-patient-name">{{ $patient->name }}</div> <div class="mobile-patient-name">{{ $patient->name }}</div>
<div class="mobile-patient-meta">{{ $patient->gender }} · {{ $patient->age }}岁</div> <div class="mobile-patient-meta">{{ $patient->gender }} · {{ $patient->age }}岁 · {{ $patient->getDiagnosisType() }}</div>
</div> </div>
</div> </div>
@if($patient->isCompleted()) @if($patient->isCompleted())
@ -367,10 +598,6 @@
</div> </div>
<div class="mobile-patient-body"> <div class="mobile-patient-body">
<div class="mobile-info-item">
<span class="mobile-info-label">诊断</span>
<span class="mobile-info-value">{{ $patient->getDiagnosisType() }}</span>
</div>
<div class="mobile-info-item"> <div class="mobile-info-item">
<span class="mobile-info-label">转诊日期</span> <span class="mobile-info-label">转诊日期</span>
<span class="mobile-info-value">{{ $patient->discharge_date->format('Y-m-d') }}</span> <span class="mobile-info-value">{{ $patient->discharge_date->format('Y-m-d') }}</span>
@ -385,7 +612,7 @@
@endif @endif
</span> </span>
</div> </div>
<div class="mobile-info-item"> <div class="mobile-info-item" style="grid-column: span 2;">
<span class="mobile-info-label">地址</span> <span class="mobile-info-label">地址</span>
<span class="mobile-info-value">{{ $patient->address ?: '-' }}</span> <span class="mobile-info-value">{{ $patient->address ?: '-' }}</span>
</div> </div>
@ -393,14 +620,15 @@
@if($patient->remark) @if($patient->remark)
<div class="mobile-patient-remark"> <div class="mobile-patient-remark">
📝 {{ $patient->remark }} <span>📝</span>
<span>{{ $patient->remark }}</span>
</div> </div>
@endif @endif
<div class="mobile-patient-progress"> <div class="mobile-patient-progress">
<div class="mobile-progress-header"> <div class="mobile-progress-header">
<span class="mobile-progress-label">随访进度</span> <span class="mobile-progress-label">随访进度</span>
<span class="mobile-progress-value">{{ $completed }}/{{ $total }}</span> <span class="mobile-progress-value">{{ $completed }}/{{ $total }} 次</span>
</div> </div>
<div class="mobile-progress-bar"> <div class="mobile-progress-bar">
<div class="mobile-progress-fill" style="width: {{ ($completed / $total) * 100 }}%"></div> <div class="mobile-progress-fill" style="width: {{ ($completed / $total) * 100 }}%"></div>
@ -409,29 +637,35 @@
<div class="mobile-patient-actions"> <div class="mobile-patient-actions">
@if($patient->phone) @if($patient->phone)
<a href="tel:{{ $patient->phone }}" class="btn btn-outline btn-sm"> <a href="tel:{{ $patient->phone }}" class="btn btn-outline">
<svg viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" width="16" height="16"> <svg viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" width="18" height="18">
<path d="M22 16.92v3a2 2 0 0 1-2.18 2 19.79 19.79 0 0 1-8.63-3.07 19.5 19.5 0 0 1-6-6 19.79 19.79 0 0 1-3.07-8.67A2 2 0 0 1 4.11 2h3a2 2 0 0 1 2 1.72 12.84 12.84 0 0 0 .7 2.81 2 2 0 0 1-.45 2.11L8.09 9.91a16 16 0 0 0 6 6l1.27-1.27a2 2 0 0 1 2.11-.45 12.84 12.84 0 0 0 2.81.7A2 2 0 0 1 22 16.92z"/> <path d="M22 16.92v3a2 2 0 0 1-2.18 2 19.79 19.79 0 0 1-8.63-3.07 19.5 19.5 0 0 1-6-6 19.79 19.79 0 0 1-3.07-8.67A2 2 0 0 1 4.11 2h3a2 2 0 0 1 2 1.72 12.84 12.84 0 0 0 .7 2.81 2 2 0 0 1-.45 2.11L8.09 9.91a16 16 0 0 0 6 6l1.27-1.27a2 2 0 0 1 2.11-.45 12.84 12.84 0 0 0 2.81.7A2 2 0 0 1 22 16.92z"/>
</svg> </svg>
拨打电话 电话
</a> </a>
@else
<div></div>
@endif @endif
@if(!$patient->isCompleted()) @if(!$patient->isCompleted())
<form action="{{ route('patients.follow-up', $patient) }}" method="POST"> <form action="{{ route('patients.follow-up', $patient) }}" method="POST">
@csrf @csrf
<button type="submit" class="btn btn-primary btn-sm" onclick="return confirm('确认标记 {{ $patient->name }} 完成第{{ $patient->getNextFollowUpNumber() }}次随访？')"> <button type="submit" class="btn btn-primary" onclick="return confirm('确认标记 {{ $patient->name }} 完成第{{ $patient->getNextFollowUpNumber() }}次随访？')">
<svg viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" width="16" height="16"> <svg viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" width="18" height="18">
<polyline points="20 6 9 17 4 12"/> <polyline points="20 6 9 17 4 12"/>
</svg> </svg>
已随访 已随访
</button> </button>
</form> </form>
@else
<div></div>
@endif @endif
<form action="{{ route('patients.destroy', $patient) }}" method="POST"> <form action="{{ route('patients.destroy', $patient) }}" method="POST">
@csrf @csrf
@method('DELETE') @method('DELETE')
<button type="submit" class="btn btn-outline btn-sm" style="color: var(--color-danger); border-color: var(--color-danger);" onclick="return confirm('确认删除患者 {{ $patient->name }}？')"> <button type="submit" class="btn btn-outline mobile-action-delete" onclick="return confirm('确认删除患者 {{ $patient->name }}？')">
<svg viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" width="16" height="16"> <svg viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" width="18" height="18">
<polyline points="3 6 5 6 21 6"/> <polyline points="3 6 5 6 21 6"/>
<path d="M19 6v14a2 2 0 0 1-2 2H7a2 2 0 0 1-2-2V6m3 0V4a2 2 0 0 1 2-2h4a2 2 0 0 1 2 2v2"/> <path d="M19 6v14a2 2 0 0 1-2 2H7a2 2 0 0 1-2-2V6m3 0V4a2 2 0 0 1 2-2h4a2 2 0 0 1 2 2v2"/>
</svg> </svg>
@ -449,7 +683,6 @@
显示 {{ $patients->firstItem() }} - {{ $patients->lastItem() }} 条，共 {{ $patients->total() }} 条 显示 {{ $patients->firstItem() }} - {{ $patients->lastItem() }} 条，共 {{ $patients->total() }} 条
</div> </div>
<div class="pagination-links"> <div class="pagination-links">
{{-- 上一页 --}}
@if($patients->onFirstPage()) @if($patients->onFirstPage())
<span class="pagination-btn disabled"> <span class="pagination-btn disabled">
<svg viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" width="16" height="16"> <svg viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" width="16" height="16">
@ -464,7 +697,6 @@
</a> </a>
@endif @endif
{{-- 页码 --}}
@foreach($patients->getUrlRange(1, $patients->lastPage()) as $page => $url) @foreach($patients->getUrlRange(1, $patients->lastPage()) as $page => $url)
@if($page == $patients->currentPage()) @if($page == $patients->currentPage())
<span class="pagination-btn active">{{ $page }}</span> <span class="pagination-btn active">{{ $page }}</span>
@ -473,7 +705,6 @@
@endif @endif
@endforeach @endforeach
{{-- 下一页 --}}
@if($patients->hasMorePages()) @if($patients->hasMorePages())
<a href="{{ $patients->nextPageUrl() }}" class="pagination-btn"> <a href="{{ $patients->nextPageUrl() }}" class="pagination-btn">
<svg viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" width="16" height="16"> <svg viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" width="16" height="16">