From 1e5286d36b0755615fd4a4784d4d650f3f5fecf4 Mon Sep 17 00:00:00 2001
From: unknown <kate522@88.com>
Date: Thu, 17 Sep 2026 12:28:09 +0800
Subject: [PATCH] =?UTF-8?q?fix(payment):=20=E5=AF=BC=E5=85=A5=E6=8F=90?=
 =?UTF-8?q?=E7=A4=BA=E7=9A=84=E6=9D=A1=E7=9B=AE=E5=88=97=E8=A1=A8=E6=94=B9?=
 =?UTF-8?q?=E7=94=A8=20<ul>=20=E6=89=BF=E8=BD=BD=EF=BC=8C=E5=9C=86?=
 =?UTF-8?q?=E7=82=B9=E4=B8=8D=E5=86=8D=E8=B6=8A=E5=87=BA=E6=96=87=E5=AD=97?=
 =?UTF-8?q?=E8=BE=B9=E7=95=8C?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

四条导入提示里的 <li> 原先裸挂在 <div class="aksrt-submsg"> 下，没有列表容器：
list-style-position 默认 outside，圆点画在内容盒左侧的 padding 区里，而 <li>
自身没有 padding，于是圆点溢出到提示块的文字边界之外（真实后台 CSS 下实测 −8px，
视觉上紧贴提示块左侧色条）。

改动：
- 四条提示的 <li> 各用一个 <ul class="aksrt-submsg-list"> 包起来（同时修掉
  <li> 缺少列表父元素的非法标记）。
- .aksrt-submsg-list 显式声明 margin / padding-left / list-style，不依赖 UA
  或后台对 ul 的默认值，避免别处的重置再次把圆点挤出去。
- 新增契约用例：提示内的 <li> 必须在 <ul class="aksrt-submsg-list"> 中、标签成对、
  每条提示只有一个列表容器，且该类的 CSS 必须带 padding-left 与 list-style。

实测（真实 Chrome + 真实后台 common/forms/list-tables CSS）：圆点左缘由
「文字边界 −8px（溢出）」变为「文字边界 +12px（界内）」，条目文字缩进 20px。
---
 src/Admin/Native/PayChargeCards.php          | 12 +++++++++
 tests/admin/charge-cards-dependency.test.cjs | 27 ++++++++++++++++++++
 2 files changed, 39 insertions(+)

diff --git a/src/Admin/Native/PayChargeCards.php b/src/Admin/Native/PayChargeCards.php
index 05b9e97e..c3d66250 100644
--- a/src/Admin/Native/PayChargeCards.php
+++ b/src/Admin/Native/PayChargeCards.php
@@ -415,9 +415,11 @@ class PayChargeCards {
                         ['key' => 'type', 'op' => 'any', 'val' => 'balance,credits'],
                     ],
                     '<p><b>' . esc_html__('导入卡密', 'aksrt') . '</b></p>
+                    <ul class="aksrt-submsg-list">
                     <li>' . esc_html__('一行一个卡密，单行格式为：', 'aksrt') . '<code>' . esc_html__('卡号 密码 面额 标识', 'aksrt') . '</code></li>
                     <li>' . esc_html__('卡号、密码、面额、标识默认使用空格分割，您可以在下方自定义分割符号，与您的数据对应即可', 'aksrt') . '</li>
                     <li>' . esc_html__('单次导入数量太多可能会对服务器性能造成影响', 'aksrt') . '</li><li>' . esc_html__('如果使用的是单密码模式，卡号部分随便填什么都行，但不能留空', 'aksrt') . '</li>
+                    </ul>
                     <p><b>' . esc_html__('数据示例', 'aksrt') . '</b></p>
                     <div>4849977843617 3w20V4Qe7dRhAIoPYum6KSA 50 ' . sprintf(esc_html__('%1$s余额', 'aksrt'), esc_html('50' . $this->currency_unit())) . '</div>
                     <div>6484027668705 SkdJZ5vWcpqPxrbs3pqPcpq 100 ' . sprintf(esc_html__('%1$s余额', 'aksrt'), esc_html('100' . $this->currency_unit())) . '</div>'
@@ -428,11 +430,13 @@ class PayChargeCards {
                         ['key' => 'type', 'op' => '==', 'val' => 'vip'],
                     ],
                     '<p><b>' . esc_html__('导入会员兑换卡密', 'aksrt') . '</b></p>
+                    <ul class="aksrt-submsg-list">
                     <li>' . esc_html__('一行一个卡密，单行格式为：', 'aksrt') . '<code>' . esc_html__('卡号 密码 会员参数 标识', 'aksrt') . '</code></li>
                     <li>' . esc_html__('卡号、密码、面额、标识默认使用空格分割，您可以在下方自定义分割符号，与您的数据对应即可', 'aksrt') . '</li>
                     <li>' . esc_html__('会员参数格式为：', 'aksrt') . '<code>level=1&time=5&unit=day</code></li>
                     <li>' . esc_html__('参数说明：level为等级，只能为1或2。time为时长，填Permanent或数字。unit为时长单位，只能填day(天)或者month(月)', 'aksrt') . '</li>
                     <li>' . esc_html__('单次导入数量太多可能会对服务器性能造成影响', 'aksrt') . '</li><li>' . esc_html__('如果使用的是单密码模式，卡号部分随便填什么都行，但不能留空', 'aksrt') . '</li>
+                    </ul>
                     <p><b>' . esc_html__('数据示例', 'aksrt') . '</b></p>
                     <div>4849977843617 3w20V4Qe7dRhAIoPYum6KSA level=1&time=5&unit=day ' . esc_html__('5天一级会员', 'aksrt') . '</div>
                     <div>6484027668705 SkdJZ5vWcpqPxrbs3pqPcpq level=2&time=Permanent ' . esc_html__('永久2级会员', 'aksrt') . '</div>
@@ -445,10 +449,12 @@ class PayChargeCards {
                         ['key' => 'only_pass_s', 'op' => 'unchecked'],
                     ],
                     '<p><b>' . esc_html__('自定义卡密导入', 'aksrt') . '</b></p>
+                    <ul class="aksrt-submsg-list">
                     <li>' . esc_html__('一行一个卡密，单行格式为：', 'aksrt') . '<code>' . esc_html__('卡号 密码 标识 自定义参数', 'aksrt') . '</code></li>
                     <li>' . esc_html__('默认使用空格分割，您可以在下方自定义分割符号，与您的数据对应即可', 'aksrt') . '</li>
                     <li>' . esc_html__('自定义参数格式为：', 'aksrt') . '<code>card_name=授权号&password_name=授权密码</code>,' . esc_html__('card_name为卡号的显示名称，password_name为卡密的显示名称，可以留空', 'aksrt') . '</li>
                     <li>' . esc_html__('单次导入数量太多可能会对服务器性能造成影响', 'aksrt') . '</li>
+                    </ul>
                     <p><b>' . esc_html__('数据示例', 'aksrt') . '</b></p>
                     <div>4849977843617 3w20V4Qe7dRhAIoPYum6KSA ' . esc_html__('平台卡密01', 'aksrt') . ' card_name=' . esc_html__('授权号', 'aksrt') . '&password_name=' . esc_html__('授权码', 'aksrt') . '</div>
                     <div>6484027668705 SkdJZ5vWcpqPxrbs3pqPcpq ' . esc_html__('平台卡密01', 'aksrt') . ' card_name=' . esc_html__('授权号', 'aksrt') . '&password_name=' . esc_html__('授权码', 'aksrt') . '</div>
@@ -461,10 +467,12 @@ class PayChargeCards {
                         ['key' => 'only_pass_s', 'op' => 'checked'],
                     ],
                     '<p><b>' . esc_html__('自定义卡密导入（单密码模式）', 'aksrt') . '</b></p>
+                    <ul class="aksrt-submsg-list">
                     <li>' . esc_html__('一行一个卡密，单行格式为：', 'aksrt') . '<code>' . esc_html__('密码 标识 自定义参数', 'aksrt') . '</code></li>
                     <li>' . esc_html__('默认使用空格分割，您可以在下方自定义分割符号，与您的数据对应即可', 'aksrt') . '</li>
                     <li>' . esc_html__('单次导入数量太多可能会对服务器性能造成影响', 'aksrt') . '</li>
                     <li>' . esc_html__('自定义参数格式为：', 'aksrt') . '<code>password_name=授权密码</code>，' . esc_html__('password_name为卡密的显示名称，可以留空', 'aksrt') . '</li>
+                    </ul>
                     <p><b>' . esc_html__('数据示例', 'aksrt') . '</b></p>
                     <div>3w20V4Qe7dRhAIoPYum6KSA ' . esc_html__('平台卡密01', 'aksrt') . ' password_name=' . esc_html__('授权码', 'aksrt') . '</div>
                     <div>SkdJZ5vWcpqPxrbs3pqPcpq ' . esc_html__('平台卡密01', 'aksrt') . ' password_name=' . esc_html__('授权码', 'aksrt') . '</div>'
@@ -1060,6 +1068,10 @@ class PayChargeCards {
             /* 导入提示：复刻后台 notice-warning 的外观，但**不用** .notice 类 —— 见 submessage_row()
                的说明，带 .notice 会被 wp-admin/js/common.js 搬到页面顶部。改这里请连带改那里。 */
             .aksrt-submsg { margin: 6px 0; padding: 6px 12px; background: #fef8ee; border-left: 4px solid #f0b849; }
+            /* 提示内的条目列表必须有 <ul> 承载：list-style-position 默认 outside，
+               圆点落在内容盒左侧的 padding 区里；若 <li> 没有列表容器提供缩进，
+               圆点就会溢出到提示块的文字边界之外。这里显式给出缩进，避免依赖 UA/后台的 ul 默认值。 */
+            .aksrt-submsg-list { margin: 6px 0; padding-left: 20px; list-style: disc; }
             .aksrt-copy-tip { margin-left: 6px; color: #00a32a; font-size: 12px; white-space: nowrap; }
         </style>
         <script>
diff --git a/tests/admin/charge-cards-dependency.test.cjs b/tests/admin/charge-cards-dependency.test.cjs
index e6256cd4..f5f4d7ed 100644
--- a/tests/admin/charge-cards-dependency.test.cjs
+++ b/tests/admin/charge-cards-dependency.test.cjs
@@ -239,6 +239,33 @@ test('导入提示不得使用 WP 的 .notice 类（否则被 common.js 搬到
   assert.match(page, /class="notice notice-error"/, '页面级错误通知仍应使用 notice');
 });
 
+test('导入提示的条目列表由 <ul> 承载，圆点不越出文字边界', () => {
+  // list-style-position 默认 outside：圆点画在内容盒左侧的 padding 区里。
+  // <li> 若没有列表容器提供缩进（历史上的写法是裸 <li> 直接挂在 div 下），
+  // padding 区为空，圆点就会溢出到提示块的文字边界之外。
+  const calls = extractCalls(page, '->submessage_row(');
+  assert.ok(calls.length >= 4, '未解析到足够的 submessage_row 调用：' + calls.length);
+
+  let checked = 0;
+  for (const call of calls) {
+    const opens = [...call.text.matchAll(/<li>/g)].length;
+    if (!opens) continue;
+    checked++;
+    assert.match(
+      call.text,
+      /<ul class="aksrt-submsg-list">/,
+      '提示内的 <li> 必须包在 <ul class="aksrt-submsg-list"> 中'
+    );
+    assert.equal([...call.text.matchAll(/<ul class="aksrt-submsg-list">/g)].length, 1, '每条提示只应有一个条目列表');
+    assert.equal(opens, [...call.text.matchAll(/<\/li>/g)].length, '<li> 标签必须成对');
+    assert.equal([...call.text.matchAll(/<\/ul>/g)].length, 1, '</ul> 必须成对');
+  }
+  assert.equal(checked, 4, '四条导入提示都应带条目列表');
+
+  assert.match(page, /\.aksrt-submsg-list \{[^}]*padding-left:/, '.aksrt-submsg-list 必须给出 padding-left，圆点才有落点');
+  assert.match(page, /\.aksrt-submsg-list \{[^}]*list-style:\s*disc/, '.aksrt-submsg-list 应显式声明圆点样式，不依赖 UA 默认值');
+});
+
 test('行内脚本不再保留解析期的空操作求值（死代码）', () => {
   assert.doesNotMatch(script, /evalDeps\(\);\s*\}\)\(\);/);
   assert.match(script, /document\.addEventListener\('change'/);