WuYongJie/CaiWuXiTong
1
0
Fork 0
Code Issues Pull Requests 8 Packages Projects Releases Wiki Activity

fix: 修复系统化待办长文本跨行重叠 #678

Merged
yueyang merged 1 commits from fix/yueyang-systemization-todo-row-overlap into main 2026-10-27 11:42:58 +08:00
Conversation 0 Commits 1 Files Changed 2 +65 -21
2 changed files with 65 additions and 21 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

44
resources/views/business/pages/systemization-todos.blade.php
View File

@ -41,8 +41,7 @@
.sys-todo-table { width:108rem; min-width:108rem; table-layout:fixed; border-collapse:separate; border-spacing:0; font-size:.75rem; }
.sys-todo-table th { position:sticky; top:0; z-index:4; padding:.55rem .7rem; border-bottom:1px solid var(--sys-border); background:#f3ece0; color:#3d3a35; text-align:left; white-space:nowrap; }
.sys-todo-table th:first-child { left:0; z-index:8; width:var(--sys-todo-type-width,5.4rem); text-align:center; box-shadow:1px 0 0 #e5ddcf; }
.sys-todo-table td { height:3.5rem; padding:.72rem .7rem; border-bottom:1px solid #eee7da; background:#fff; color:#2f2a23; line-height:1.5; vertical-align:middle; }
.sys-todo-table tbody tr { height:3.5rem; }
.sys-todo-table td { padding:.72rem .7rem; border-bottom:1px solid #eee7da; background:#fff; color:#2f2a23; line-height:1.5; vertical-align:top; overflow-wrap:anywhere; }
.sys-todo-table tbody tr:hover td { background:#fdfbf6; }
.sys-todo-table tbody tr.is-highlighted td { background:#fff4cf !important; }
.sys-todo-table [data-sys-todo-row-edit], .sys-todo-table [data-sys-todo-group-edit] { cursor:pointer; }
@ -61,16 +60,17 @@
.sys-todo-table__level { display:inline-flex; flex:0 0 auto; align-items:center; justify-content:center; min-width:1.35rem; height:1.35rem; margin-top:.05rem; border:1px solid #d8c9aa; border-radius:999px; background:#fffaf0; color:var(--sys-gold); font-size:.68rem; font-weight:700; font-variant-numeric:tabular-nums; }
.sys-todo-table__type { position:sticky; left:0; z-index:3; width:var(--sys-todo-type-width,5.4rem); text-align:center; white-space:normal; box-shadow:1px 0 0 #e5ddcf; }
.sys-todo-table__type .sys-todo-table__group-text { white-space:normal; }
.sys-todo-table__title, .sys-todo-table__progress-notes { line-height:1.5; white-space:pre-line; overflow-wrap:anywhere; }
.sys-todo-table__title { font-weight:600; }
.sys-todo-table__title { font-weight:600; line-height:1.5; white-space:pre-line; overflow-wrap:anywhere; }
.sys-todo-table__inline-add { display:inline-flex; align-items:center; justify-content:center; gap:.15rem; min-height:1.65rem; margin-top:.45rem; padding:0 .45rem; border:1px solid #d8c9aa; border-radius:999px; background:#fffaf0; color:#6d5630; font:inherit; font-size:.68rem; font-weight:500; white-space:nowrap; cursor:pointer; }
.sys-todo-table__inline-add:hover { border-color:var(--sys-gold); background:var(--sys-gold-soft); color:#6a5129; }
.sys-todo-table__inline-add:focus-visible { outline:2px solid var(--sys-gold); outline-offset:2px; }
.sys-todo-table__inline-actions { display:flex; flex-wrap:wrap; justify-content:center; gap:.25rem; }
.sys-todo-table__inline-actions .sys-todo-table__inline-add { margin-top:.3rem; }
.sys-todo-table__progress-notes { display:grid; gap:.35rem; }
.sys-todo-table__detail { display:grid; gap:.15rem; }
.sys-todo-table__progress-notes { white-space:normal; }
.sys-todo-table__progress-notes-content { display:flex; min-width:0; flex-direction:column; gap:.35rem; }
.sys-todo-table__detail { display:grid; min-width:0; gap:.15rem; }
.sys-todo-table__detail-label { color:#856632; font-size:.66rem; font-weight:600; }
.sys-todo-table__detail-text { display:block; min-width:0; white-space:pre-line; overflow-wrap:anywhere; line-height:1.6; }
.sys-todo-table__reminder { display:inline-flex; align-items:center; padding:.1rem .45rem; border:1px solid #dfd6c5; border-radius:999px; background:#faf6ee; color:#51483c; white-space:nowrap; }
.sys-todo-table__reminder.is-danger { border-color:#e7c3c3; background:#fff3f3; color:#b80000; }
.sys-todo-table__reminder.is-warning { border-color:#e5c98f; background:#fff8e8; color:#935f07; }
@ -514,22 +514,24 @@
<td><span class="sys-todo-table__reminder is-{{ $item->reminder_tone }}">{{ $item->reminder_label }}</span></td>
<td><span class="sys-todo-badge {{ $statusClass }}">{{ $item->status_label }}</span></td>
<td class="sys-todo-table__progress-notes">
@if ($displayProgress !== '' || $displayNotes !== '')
@if ($displayProgress !== '')
<div class="sys-todo-table__detail">
<span class="sys-todo-table__detail-label">完成情况</span>
<span>{{ $displayProgress }}</span>
</div>
<div class="sys-todo-table__progress-notes-content">
@if ($displayProgress !== '' || $displayNotes !== '')
@if ($displayProgress !== '')
<div class="sys-todo-table__detail">
<span class="sys-todo-table__detail-label">完成情况</span>
<span class="sys-todo-table__detail-text">{{ $displayProgress }}</span>
</div>
@endif
@if ($displayNotes !== '')
<div class="sys-todo-table__detail">
<span class="sys-todo-table__detail-label">备注</span>
<span class="sys-todo-table__detail-text">{{ $displayNotes }}</span>
</div>
@endif
@else
<span>—</span>
@endif
@if ($displayNotes !== '')
<div class="sys-todo-table__detail">
<span class="sys-todo-table__detail-label">备注</span>
<span>{{ $displayNotes }}</span>
</div>
@endif
@else
—
@endif
</div>
</td>
</tr>
@empty

42
tests/Feature/Business/SystemizationTodosTest.php
View File

@ -157,6 +157,48 @@ class SystemizationTodosTest extends FeatureTestCase
$this->assertSoftDeleted('business_systemization_todos', ['id' => $todo->id]);
}
public function test_long_progress_and_notes_keep_the_standard_table_row_layout(): void
{
$this->loginAs();
$progress = str_repeat(
'得物的安装费，是否在货款里；收款方式包括线下支付宝、京东、天猫、淘宝、拼多多及得物二维码。',
8,
);
$notes = str_repeat('已核对订单号 116212206747637437，货款流水与账单均已留档。', 5);
$this->createTodo(
'费用',
'平台费用核对',
'核对安装费与货款',
'2026-10-30',
1,
)->update([
'progress' => $progress,
'notes' => $notes,
]);
$response = $this->get(route('business.pages.show', [
'section' => 'other',
'page' => 'systemization-todos',
]))->assertOk();
$html = (string) $response->getContent();
$response
->assertSee('<div class="sys-todo-table__progress-notes-content">', false)
->assertSee('<span class="sys-todo-table__detail-text">' . e($progress) . '</span>', false)
->assertSee('<span class="sys-todo-table__detail-text">' . e($notes) . '</span>', false);
$this->assertStringNotContainsString('.sys-todo-table__progress-notes { display:grid;', $html);
$this->assertStringNotContainsString('.sys-todo-table td { height:3.5rem;', $html);
$this->assertStringNotContainsString('.sys-todo-table tbody tr { height:3.5rem; }', $html);
$this->assertMatchesRegularExpression(
'/<td class="sys-todo-table__progress-notes">\s*<div class="sys-todo-table__progress-notes-content">.*?'
. preg_quote(e($progress), '/')
. '.*?' . preg_quote(e($notes), '/')
. '.*?<\/div>\s*<\/td>/s',
$html,
);
}
public function test_can_insert_a_todo_at_a_selected_sequence_and_shift_existing_items(): void
{
$this->loginAs();