refactor(dashboard): reuse mini bar row component for ops governance/risk

resources/views/admin/dashboard.blade.php

@@ -622,29 +622,41 @@
             <div class="muted"><strong>待处理治理（Top3）</strong></div>
             <div class="muted muted-xs mt-6">用于快速判断治理积压：优先清空“能直接处理”的集合。</div>
 
-            <a class="adm-mini-bar-row adm-mini-bar-row-link mt-6" data-role="ops-govern-bmpa-row" href="{!! $platformOrdersQuickLinks['unpaid_pending'] !!}" aria-label="进入可BMPA处理订单集合">
-                <div class="adm-mini-bar-label">可BMPA</div>
-                <div class="adm-mini-bar" data-role="ops-govern-bmpa-bar" title="{{ $goBmpa }} / {{ $poTotalForOps }}（{{ $pctGoBmpa }}%）">
-                    <span class="adm-mini-bar-fill" style="width: {{ $pctGoBmpa }}%"></span>
-                </div>
-                <div class="adm-mini-bar-value">{{ $pctGoBmpa }}%（{{ $goBmpa }}）</div>
-            </a>
+            @include('admin.components.mini_bar_row', [
+                'class' => 'mt-6',
+                'rowRole' => 'ops-govern-bmpa-row',
+                'barRole' => 'ops-govern-bmpa-bar',
+                'href' => $platformOrdersQuickLinks['unpaid_pending'],
+                'ariaLabel' => '进入可BMPA处理订单集合',
+                'label' => '可BMPA',
+                'pct' => $pctGoBmpa,
+                'title' => $goBmpa . ' / ' . $poTotalForOps . '（' . $pctGoBmpa . '%）',
+                'value' => $pctGoBmpa . '%（' . $goBmpa . '）',
+            ])
 
-            <a class="adm-mini-bar-row adm-mini-bar-row-link mt-6" data-role="ops-govern-syncable-row" href="{!! $platformOrdersQuickLinks['syncable_only'] !!}" aria-label="进入可同步订单集合">
-                <div class="adm-mini-bar-label">可同步</div>
-                <div class="adm-mini-bar" data-role="ops-govern-syncable-bar" title="{{ $goSyncable }} / {{ $poTotalForOps }}（{{ $pctGoSyncable }}%）">
-                    <span class="adm-mini-bar-fill" style="width: {{ $pctGoSyncable }}%"></span>
-                </div>
-                <div class="adm-mini-bar-value">{{ $pctGoSyncable }}%（{{ $goSyncable }}）</div>
-            </a>
+            @include('admin.components.mini_bar_row', [
+                'class' => 'mt-6',
+                'rowRole' => 'ops-govern-syncable-row',
+                'barRole' => 'ops-govern-syncable-bar',
+                'href' => $platformOrdersQuickLinks['syncable_only'],
+                'ariaLabel' => '进入可同步订单集合',
+                'label' => '可同步',
+                'pct' => $pctGoSyncable,
+                'title' => $goSyncable . ' / ' . $poTotalForOps . '（' . $pctGoSyncable . '%）',
+                'value' => $pctGoSyncable . '%（' . $goSyncable . '）',
+            ])
 
-            <a class="adm-mini-bar-row adm-mini-bar-row-link mt-6" data-role="ops-govern-sync-failed-row" href="{!! $platformOrdersQuickLinks['sync_failed'] !!}" aria-label="进入同步失败订单集合">
-                <div class="adm-mini-bar-label">同步失败</div>
-                <div class="adm-mini-bar" data-role="ops-govern-sync-failed-bar" title="{{ $goSyncFailed }} / {{ $poTotalForOps }}（{{ $pctGoSyncFailed }}%）">
-                    <span class="adm-mini-bar-fill" style="width: {{ $pctGoSyncFailed }}%"></span>
-                </div>
-                <div class="adm-mini-bar-value">{{ $pctGoSyncFailed }}%（{{ $goSyncFailed }}）</div>
-            </a>
+            @include('admin.components.mini_bar_row', [
+                'class' => 'mt-6',
+                'rowRole' => 'ops-govern-sync-failed-row',
+                'barRole' => 'ops-govern-sync-failed-bar',
+                'href' => $platformOrdersQuickLinks['sync_failed'],
+                'ariaLabel' => '进入同步失败订单集合',
+                'label' => '同步失败',
+                'pct' => $pctGoSyncFailed,
+                'title' => $goSyncFailed . ' / ' . $poTotalForOps . '（' . $pctGoSyncFailed . '%）',
+                'value' => $pctGoSyncFailed . '%（' . $goSyncFailed . '）',
+            ])
 
             <div class="muted muted-xs mt-6">分母：平台订单总量 {{ $poTotalForOps }}（用于规模感，不作为经营口径）。</div>
         </div>
@@ -670,29 +682,41 @@
             <div class="muted"><strong>平台健康预警（Top3）</strong></div>
             <div class="muted muted-xs mt-6">原因型风险：补回执 / 对账 / 核对退款。</div>
 
-            <a class="adm-mini-bar-row adm-mini-bar-row-link mt-6" data-role="ops-risk-no-receipt-row" href="{!! $platformOrdersQuickLinks['paid_no_receipt'] !!}" aria-label="进入无回执订单集合">
-                <div class="adm-mini-bar-label">无回执</div>
-                <div class="adm-mini-bar" data-role="ops-risk-no-receipt-bar" title="{{ $riskNoReceipt }} / {{ $poTotalForOps }}（{{ $pctRiskNoReceipt }}%）">
-                    <span class="adm-mini-bar-fill" style="width: {{ $pctRiskNoReceipt }}%"></span>
-                </div>
-                <div class="adm-mini-bar-value">{{ $pctRiskNoReceipt }}%（{{ $riskNoReceipt }}）</div>
-            </a>
+            @include('admin.components.mini_bar_row', [
+                'class' => 'mt-6',
+                'rowRole' => 'ops-risk-no-receipt-row',
+                'barRole' => 'ops-risk-no-receipt-bar',
+                'href' => $platformOrdersQuickLinks['paid_no_receipt'],
+                'ariaLabel' => '进入无回执订单集合',
+                'label' => '无回执',
+                'pct' => $pctRiskNoReceipt,
+                'title' => $riskNoReceipt . ' / ' . $poTotalForOps . '（' . $pctRiskNoReceipt . '%）',
+                'value' => $pctRiskNoReceipt . '%（' . $riskNoReceipt . '）',
+            ])
 
-            <a class="adm-mini-bar-row adm-mini-bar-row-link mt-6" data-role="ops-risk-reconcile-mismatch-row" href="{!! $platformOrdersQuickLinks['reconcile_mismatch'] !!}" aria-label="进入对账不一致订单集合">
-                <div class="adm-mini-bar-label">对账不一致</div>
-                <div class="adm-mini-bar" data-role="ops-risk-reconcile-mismatch-bar" title="{{ $riskReconcileMismatch }} / {{ $poTotalForOps }}（{{ $pctRiskReconcileMismatch }}%）">
-                    <span class="adm-mini-bar-fill" style="width: {{ $pctRiskReconcileMismatch }}%"></span>
-                </div>
-                <div class="adm-mini-bar-value">{{ $pctRiskReconcileMismatch }}%（{{ $riskReconcileMismatch }}）</div>
-            </a>
+            @include('admin.components.mini_bar_row', [
+                'class' => 'mt-6',
+                'rowRole' => 'ops-risk-reconcile-mismatch-row',
+                'barRole' => 'ops-risk-reconcile-mismatch-bar',
+                'href' => $platformOrdersQuickLinks['reconcile_mismatch'],
+                'ariaLabel' => '进入对账不一致订单集合',
+                'label' => '对账不一致',
+                'pct' => $pctRiskReconcileMismatch,
+                'title' => $riskReconcileMismatch . ' / ' . $poTotalForOps . '（' . $pctRiskReconcileMismatch . '%）',
+                'value' => $pctRiskReconcileMismatch . '%（' . $riskReconcileMismatch . '）',
+            ])
 
-            <a class="adm-mini-bar-row adm-mini-bar-row-link mt-6" data-role="ops-risk-refund-inconsistent-row" href="{!! $platformOrdersQuickLinks['refund_inconsistent'] !!}" aria-label="进入退款不一致订单集合">
-                <div class="adm-mini-bar-label">退款不一致</div>
-                <div class="adm-mini-bar" data-role="ops-risk-refund-inconsistent-bar" title="{{ $riskRefundInconsistent }} / {{ $poTotalForOps }}（{{ $pctRiskRefundInconsistent }}%）">
-                    <span class="adm-mini-bar-fill" style="width: {{ $pctRiskRefundInconsistent }}%"></span>
-                </div>
-                <div class="adm-mini-bar-value">{{ $pctRiskRefundInconsistent }}%（{{ $riskRefundInconsistent }}）</div>
-            </a>
+            @include('admin.components.mini_bar_row', [
+                'class' => 'mt-6',
+                'rowRole' => 'ops-risk-refund-inconsistent-row',
+                'barRole' => 'ops-risk-refund-inconsistent-bar',
+                'href' => $platformOrdersQuickLinks['refund_inconsistent'],
+                'ariaLabel' => '进入退款不一致订单集合',
+                'label' => '退款不一致',
+                'pct' => $pctRiskRefundInconsistent,
+                'title' => $riskRefundInconsistent . ' / ' . $poTotalForOps . '（' . $pctRiskRefundInconsistent . '%）',
+                'value' => $pctRiskRefundInconsistent . '%（' . $riskRefundInconsistent . '）',
+            ])
         </div>
 
         <details class="mt-10" data-role="platform-ops-exception-bars" data-storage-key="admin.dashboard.platform_ops_exception_bars">