Fix: dashboard recent platform orders table overflow
This commit is contained in:
@@ -758,13 +758,43 @@
|
|||||||
margin-right:4px;
|
margin-right:4px;
|
||||||
}
|
}
|
||||||
|
|
||||||
|
/* 仪表盘最近订单:避免内容把表格/卡片撑破导致横向溢出 */
|
||||||
|
[data-page="admin.dashboard"] [data-role="recent-platform-orders-table"]{
|
||||||
|
table-layout:fixed;
|
||||||
|
}
|
||||||
|
|
||||||
|
[data-page="admin.dashboard"] [data-role="recent-platform-orders-table"] th:nth-child(1),
|
||||||
|
[data-page="admin.dashboard"] [data-role="recent-platform-orders-table"] td:nth-child(1){
|
||||||
|
width:140px;
|
||||||
|
}
|
||||||
|
|
||||||
|
[data-page="admin.dashboard"] [data-role="recent-platform-orders-table"] th:nth-child(3),
|
||||||
|
[data-page="admin.dashboard"] [data-role="recent-platform-orders-table"] td:nth-child(3){
|
||||||
|
width:110px;
|
||||||
|
white-space:nowrap;
|
||||||
|
}
|
||||||
|
|
||||||
/* 仪表盘最近订单:避免「支付」表头在窄宽下被拆成竖排(CJK 可在任意字间断行) */
|
/* 仪表盘最近订单:避免「支付」表头在窄宽下被拆成竖排(CJK 可在任意字间断行) */
|
||||||
[data-page="admin.dashboard"] [data-role="recent-platform-orders-table"] th:nth-child(4),
|
[data-page="admin.dashboard"] [data-role="recent-platform-orders-table"] th:nth-child(4),
|
||||||
[data-page="admin.dashboard"] [data-role="recent-platform-orders-table"] td:nth-child(4){
|
[data-page="admin.dashboard"] [data-role="recent-platform-orders-table"] td:nth-child(4){
|
||||||
|
width:86px;
|
||||||
white-space:nowrap;
|
white-space:nowrap;
|
||||||
min-width:56px;
|
min-width:56px;
|
||||||
}
|
}
|
||||||
|
|
||||||
|
[data-page="admin.dashboard"] [data-role="recent-platform-orders-table"] th:nth-child(5),
|
||||||
|
[data-page="admin.dashboard"] [data-role="recent-platform-orders-table"] td:nth-child(5){
|
||||||
|
width:140px;
|
||||||
|
}
|
||||||
|
|
||||||
|
[data-page="admin.dashboard"] [data-role="recent-platform-orders-table"] td:nth-child(1) a.link{
|
||||||
|
display:block;
|
||||||
|
max-width:100%;
|
||||||
|
overflow:hidden;
|
||||||
|
text-overflow:ellipsis;
|
||||||
|
white-space:nowrap;
|
||||||
|
}
|
||||||
|
|
||||||
/* 仪表盘最近订单:扫描信息行(用于快速判断治理状态,不替代下方治理提示入口) */
|
/* 仪表盘最近订单:扫描信息行(用于快速判断治理状态,不替代下方治理提示入口) */
|
||||||
[data-page="admin.dashboard"] .adm-order-scanline{
|
[data-page="admin.dashboard"] .adm-order-scanline{
|
||||||
margin-top:3px;
|
margin-top:3px;
|
||||||
|
|||||||
@@ -0,0 +1,38 @@
|
|||||||
|
<?php
|
||||||
|
|
||||||
|
namespace Tests\Feature;
|
||||||
|
|
||||||
|
use Illuminate\Foundation\Testing\RefreshDatabase;
|
||||||
|
use Tests\TestCase;
|
||||||
|
|
||||||
|
class AdminDashboardRecentPlatformOrdersTableLayoutShouldBeFixedToPreventOverflowTest extends TestCase
|
||||||
|
{
|
||||||
|
use RefreshDatabase;
|
||||||
|
|
||||||
|
protected function loginAsPlatformAdmin(): void
|
||||||
|
{
|
||||||
|
$this->seed();
|
||||||
|
|
||||||
|
$this->post('/admin/login', [
|
||||||
|
'email' => 'platform.admin@demo.local',
|
||||||
|
'password' => 'Platform@123456',
|
||||||
|
])->assertRedirect('/admin');
|
||||||
|
}
|
||||||
|
|
||||||
|
public function test_recent_platform_orders_table_should_have_fixed_layout_guard(): void
|
||||||
|
{
|
||||||
|
$this->loginAsPlatformAdmin();
|
||||||
|
|
||||||
|
$res = $this->get('/admin');
|
||||||
|
$res->assertOk();
|
||||||
|
|
||||||
|
// 结构护栏:最近平台订单 table 必须可被稳定选择
|
||||||
|
$res->assertSee('data-role="recent-platform-orders-table"', false);
|
||||||
|
|
||||||
|
$css = (string) file_get_contents(public_path('css/admin-components.css'));
|
||||||
|
|
||||||
|
// CSS 护栏:必须启用 table-layout:fixed,避免长内容把列宽撑破导致横向溢出。
|
||||||
|
$this->assertStringContainsString('[data-role="recent-platform-orders-table"]{', $css);
|
||||||
|
$this->assertStringContainsString('table-layout:fixed', $css);
|
||||||
|
}
|
||||||
|
}
|
||||||
Reference in New Issue
Block a user