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.
This commit is contained in:
parent
d712732dd4
commit
232b777f6c
@ -4,7 +4,204 @@
|
||||
|
||||
@section('content')
|
||||
<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 {
|
||||
display: none;
|
||||
}
|
||||
@ -12,33 +209,35 @@
|
||||
.mobile-patient-card {
|
||||
background: var(--color-bg-card);
|
||||
border: 1px solid var(--color-border);
|
||||
border-radius: 12px;
|
||||
border-radius: 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 {
|
||||
display: flex;
|
||||
align-items: center;
|
||||
align-items: flex-start;
|
||||
justify-content: space-between;
|
||||
margin-bottom: 12px;
|
||||
margin-bottom: 16px;
|
||||
}
|
||||
|
||||
.mobile-patient-info {
|
||||
display: flex;
|
||||
align-items: center;
|
||||
gap: 12px;
|
||||
gap: 14px;
|
||||
}
|
||||
|
||||
.mobile-patient-avatar {
|
||||
width: 44px;
|
||||
height: 44px;
|
||||
width: 50px;
|
||||
height: 50px;
|
||||
border-radius: 50%;
|
||||
display: flex;
|
||||
align-items: center;
|
||||
justify-content: center;
|
||||
font-weight: 600;
|
||||
font-size: 16px;
|
||||
font-size: 18px;
|
||||
color: white;
|
||||
flex-shrink: 0;
|
||||
}
|
||||
@ -53,13 +252,13 @@
|
||||
|
||||
.mobile-patient-name {
|
||||
font-weight: 600;
|
||||
font-size: 16px;
|
||||
font-size: 17px;
|
||||
color: var(--color-text);
|
||||
margin-bottom: 2px;
|
||||
margin-bottom: 4px;
|
||||
}
|
||||
|
||||
.mobile-patient-meta {
|
||||
font-size: 13px;
|
||||
font-size: 14px;
|
||||
color: var(--color-text-secondary);
|
||||
}
|
||||
|
||||
@ -67,105 +266,132 @@
|
||||
display: grid;
|
||||
grid-template-columns: 1fr 1fr;
|
||||
gap: 10px;
|
||||
margin-bottom: 12px;
|
||||
padding: 12px;
|
||||
background: var(--color-bg);
|
||||
border-radius: 8px;
|
||||
margin-bottom: 16px;
|
||||
padding: 12px 14px;
|
||||
background: linear-gradient(135deg, #f8fafc 0%, #f1f5f9 100%);
|
||||
border-radius: 12px;
|
||||
overflow: hidden;
|
||||
}
|
||||
|
||||
.mobile-info-item {
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
gap: 2px;
|
||||
gap: 4px;
|
||||
}
|
||||
|
||||
.mobile-info-label {
|
||||
font-size: 11px;
|
||||
font-size: 12px;
|
||||
color: var(--color-text-muted);
|
||||
text-transform: uppercase;
|
||||
letter-spacing: 0.5px;
|
||||
}
|
||||
|
||||
.mobile-info-value {
|
||||
font-size: 13px;
|
||||
font-size: 14px;
|
||||
color: var(--color-text);
|
||||
font-weight: 500;
|
||||
word-break: break-all;
|
||||
overflow-wrap: break-word;
|
||||
}
|
||||
|
||||
.mobile-info-value a {
|
||||
color: var(--color-primary);
|
||||
text-decoration: none;
|
||||
word-break: break-all;
|
||||
}
|
||||
|
||||
.mobile-patient-progress {
|
||||
margin-bottom: 12px;
|
||||
margin-bottom: 16px;
|
||||
}
|
||||
|
||||
.mobile-progress-header {
|
||||
display: flex;
|
||||
justify-content: space-between;
|
||||
align-items: center;
|
||||
margin-bottom: 6px;
|
||||
margin-bottom: 8px;
|
||||
}
|
||||
|
||||
.mobile-progress-label {
|
||||
font-size: 12px;
|
||||
font-size: 13px;
|
||||
color: var(--color-text-secondary);
|
||||
}
|
||||
|
||||
.mobile-progress-value {
|
||||
font-size: 12px;
|
||||
font-size: 13px;
|
||||
font-weight: 600;
|
||||
color: var(--color-text);
|
||||
}
|
||||
|
||||
.mobile-progress-bar {
|
||||
height: 6px;
|
||||
height: 8px;
|
||||
background: var(--color-border);
|
||||
border-radius: 3px;
|
||||
border-radius: 4px;
|
||||
overflow: hidden;
|
||||
}
|
||||
|
||||
.mobile-progress-fill {
|
||||
height: 100%;
|
||||
background: linear-gradient(90deg, var(--color-success), #34d399);
|
||||
border-radius: 3px;
|
||||
border-radius: 4px;
|
||||
transition: width 0.3s ease;
|
||||
}
|
||||
|
||||
.mobile-patient-remark {
|
||||
padding: 10px 12px;
|
||||
background: var(--color-warning-light);
|
||||
display: flex;
|
||||
align-items: center;
|
||||
gap: 8px;
|
||||
padding: 12px 14px;
|
||||
background: linear-gradient(135deg, #fffbeb 0%, #fef3c7 100%);
|
||||
border-left: 3px solid var(--color-warning);
|
||||
border-radius: 6px;
|
||||
margin-bottom: 12px;
|
||||
font-size: 13px;
|
||||
color: var(--color-warning);
|
||||
border-radius: 8px;
|
||||
margin-bottom: 16px;
|
||||
font-size: 14px;
|
||||
color: #b45309;
|
||||
font-weight: 500;
|
||||
}
|
||||
|
||||
.mobile-patient-actions {
|
||||
display: flex;
|
||||
gap: 10px;
|
||||
gap: 8px;
|
||||
}
|
||||
|
||||
.mobile-patient-actions .btn {
|
||||
flex: 1;
|
||||
justify-content: center;
|
||||
padding: 10px 12px;
|
||||
font-size: 13px;
|
||||
border-radius: 10px;
|
||||
min-width: 0;
|
||||
white-space: nowrap;
|
||||
}
|
||||
|
||||
.mobile-patient-actions form {
|
||||
flex: 1;
|
||||
display: flex;
|
||||
min-width: 0;
|
||||
}
|
||||
|
||||
.mobile-patient-actions form .btn {
|
||||
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 {
|
||||
display: none !important;
|
||||
}
|
||||
@ -233,96 +459,101 @@
|
||||
</div>
|
||||
</div>
|
||||
@else
|
||||
<!-- 桌面端表格 -->
|
||||
<!-- PC端表格 -->
|
||||
<div class="table-container">
|
||||
<table>
|
||||
<table class="patient-table">
|
||||
<thead>
|
||||
<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 style="text-align: right;">操作</th>
|
||||
</tr>
|
||||
</thead>
|
||||
<tbody>
|
||||
@foreach($patients as $patient)
|
||||
<tr>
|
||||
<td>
|
||||
<strong>{{ $patient->name }}</strong>
|
||||
</td>
|
||||
<td>{{ $patient->gender }}</td>
|
||||
<td>{{ $patient->age }}岁</td>
|
||||
<td>{{ $patient->getDiagnosisType() }}</td>
|
||||
<td>{{ $patient->discharge_date->format('Y-m-d') }}</td>
|
||||
<td>
|
||||
@php
|
||||
$total = count($patient->getFollowUpSchedule());
|
||||
$completed = $patient->follow_up_count;
|
||||
$status = $patient->getFollowUpStatus();
|
||||
@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>
|
||||
<tr>
|
||||
<td>
|
||||
<div class="patient-cell">
|
||||
<div class="patient-cell-avatar {{ $patient->gender == '女' ? 'female' : 'male' }}">
|
||||
{{ mb_substr($patient->name, 0, 1) }}
|
||||
</div>
|
||||
<div class="patient-cell-info">
|
||||
<span class="patient-cell-name">{{ $patient->name }}</span>
|
||||
<span class="patient-cell-meta">{{ $patient->gender }} · {{ $patient->age }}岁</span>
|
||||
</div>
|
||||
<span style="font-size: 13px; color: var(--color-text-secondary);">{{ $completed }}/{{ $total }}</span>
|
||||
</div>
|
||||
</td>
|
||||
<td>
|
||||
@php
|
||||
$status = $patient->getFollowUpStatus();
|
||||
$nextDate = $patient->getNextFollowUpDate();
|
||||
@endphp
|
||||
<span class="diagnosis-cell">{{ $patient->getDiagnosisType() }}</span>
|
||||
</td>
|
||||
<td>{{ $patient->discharge_date->format('Y-m-d') }}</td>
|
||||
<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())
|
||||
<span class="badge badge-success">已完成</span>
|
||||
@elseif(str_contains($status, '过期'))
|
||||
<span class="badge badge-danger">{{ $status }}</span>
|
||||
@elseif(str_contains($status, '今日'))
|
||||
<span class="badge badge-warning">{{ $status }}</span>
|
||||
@elseif(str_contains($status, '即将'))
|
||||
<span class="badge badge-info">{{ $status }}</span>
|
||||
@else
|
||||
<span class="badge badge-info">{{ $status }}</span>
|
||||
@endif
|
||||
</td>
|
||||
<td>
|
||||
@if($patient->phone)
|
||||
<a href="tel:{{ $patient->phone }}" style="color: var(--color-primary); text-decoration: none;">
|
||||
{{ $patient->phone }}
|
||||
</a>
|
||||
<a href="tel:{{ $patient->phone }}" class="phone-link">{{ $patient->phone }}</a>
|
||||
@else
|
||||
<span style="color: var(--color-text-muted);">-</span>
|
||||
@endif
|
||||
</td>
|
||||
<td>
|
||||
@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
|
||||
<span style="color: var(--color-text-muted);">-</span>
|
||||
@endif
|
||||
</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())
|
||||
<form action="{{ route('patients.follow-up', $patient) }}" method="POST" style="display: inline;">
|
||||
@csrf
|
||||
<button type="submit" class="btn btn-outline btn-sm" onclick="return confirm('确认标记 {{ $patient->name }} 完成第{{ $patient->getNextFollowUpNumber() }}次随访?')">
|
||||
<svg viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" width="14" height="14">
|
||||
<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">
|
||||
<polyline points="20 6 9 17 4 12"/>
|
||||
</svg>
|
||||
随访
|
||||
</button>
|
||||
</form>
|
||||
@endif
|
||||
<form action="{{ route('patients.destroy', $patient) }}" method="POST" style="display: inline;">
|
||||
@csrf
|
||||
@method('DELETE')
|
||||
<button type="submit" class="btn btn-outline btn-sm" style="color: var(--color-danger);" onclick="return confirm('确认删除患者 {{ $patient->name }}?此操作不可恢复。')">
|
||||
<svg viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" width="14" height="14">
|
||||
<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">
|
||||
<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"/>
|
||||
</svg>
|
||||
@ -352,7 +583,7 @@
|
||||
</div>
|
||||
<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>
|
||||
@if($patient->isCompleted())
|
||||
@ -367,10 +598,6 @@
|
||||
</div>
|
||||
|
||||
<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">
|
||||
<span class="mobile-info-label">转诊日期</span>
|
||||
<span class="mobile-info-value">{{ $patient->discharge_date->format('Y-m-d') }}</span>
|
||||
@ -385,7 +612,7 @@
|
||||
@endif
|
||||
</span>
|
||||
</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-value">{{ $patient->address ?: '-' }}</span>
|
||||
</div>
|
||||
@ -393,14 +620,15 @@
|
||||
|
||||
@if($patient->remark)
|
||||
<div class="mobile-patient-remark">
|
||||
📝 {{ $patient->remark }}
|
||||
<span>📝</span>
|
||||
<span>{{ $patient->remark }}</span>
|
||||
</div>
|
||||
@endif
|
||||
|
||||
<div class="mobile-patient-progress">
|
||||
<div class="mobile-progress-header">
|
||||
<span class="mobile-progress-label">随访进度</span>
|
||||
<span class="mobile-progress-value">{{ $completed }}/{{ $total }}</span>
|
||||
<span class="mobile-progress-value">{{ $completed }}/{{ $total }} 次</span>
|
||||
</div>
|
||||
<div class="mobile-progress-bar">
|
||||
<div class="mobile-progress-fill" style="width: {{ ($completed / $total) * 100 }}%"></div>
|
||||
@ -409,29 +637,35 @@
|
||||
|
||||
<div class="mobile-patient-actions">
|
||||
@if($patient->phone)
|
||||
<a href="tel:{{ $patient->phone }}" class="btn btn-outline btn-sm">
|
||||
<svg viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" width="16" height="16">
|
||||
<a href="tel:{{ $patient->phone }}" class="btn btn-outline">
|
||||
<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"/>
|
||||
</svg>
|
||||
拨打电话
|
||||
电话
|
||||
</a>
|
||||
@else
|
||||
<div></div>
|
||||
@endif
|
||||
|
||||
@if(!$patient->isCompleted())
|
||||
<form action="{{ route('patients.follow-up', $patient) }}" method="POST">
|
||||
@csrf
|
||||
<button type="submit" class="btn btn-primary btn-sm" onclick="return confirm('确认标记 {{ $patient->name }} 完成第{{ $patient->getNextFollowUpNumber() }}次随访?')">
|
||||
<svg viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" width="16" height="16">
|
||||
<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="18" height="18">
|
||||
<polyline points="20 6 9 17 4 12"/>
|
||||
</svg>
|
||||
已随访
|
||||
</button>
|
||||
</form>
|
||||
@else
|
||||
<div></div>
|
||||
@endif
|
||||
|
||||
<form action="{{ route('patients.destroy', $patient) }}" method="POST">
|
||||
@csrf
|
||||
@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 }}?')">
|
||||
<svg viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" width="16" height="16">
|
||||
<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="18" height="18">
|
||||
<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"/>
|
||||
</svg>
|
||||
@ -449,7 +683,6 @@
|
||||
显示 {{ $patients->firstItem() }} - {{ $patients->lastItem() }} 条,共 {{ $patients->total() }} 条
|
||||
</div>
|
||||
<div class="pagination-links">
|
||||
{{-- 上一页 --}}
|
||||
@if($patients->onFirstPage())
|
||||
<span class="pagination-btn disabled">
|
||||
<svg viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" width="16" height="16">
|
||||
@ -464,7 +697,6 @@
|
||||
</a>
|
||||
@endif
|
||||
|
||||
{{-- 页码 --}}
|
||||
@foreach($patients->getUrlRange(1, $patients->lastPage()) as $page => $url)
|
||||
@if($page == $patients->currentPage())
|
||||
<span class="pagination-btn active">{{ $page }}</span>
|
||||
@ -473,7 +705,6 @@
|
||||
@endif
|
||||
@endforeach
|
||||
|
||||
{{-- 下一页 --}}
|
||||
@if($patients->hasMorePages())
|
||||
<a href="{{ $patients->nextPageUrl() }}" class="pagination-btn">
|
||||
<svg viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" width="16" height="16">
|
||||
|
||||
Loading…
Reference in New Issue
Block a user