@yaoxiu/marketing-dsl 2.6.0 → 2.7.0

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
@@ -166,23 +166,45 @@ countdown_end // \u5012\u8BA1\u65F6\u5F52\u96F6`
166
166
  tone: "info",
167
167
  text: "`close` \u7684 `reason` \u4F1A\u4E00\u8D77\u4F20\u7ED9\u5BBF\u4E3B\uFF0C\u5BBF\u4E3B\u636E\u6B64\u51B3\u5B9A\u540E\u7EED\u884C\u4E3A\uFF0C\u5E76\u539F\u6837\u4E0A\u62A5\u7ED9\u540E\u7AEF\u3002\u4E0D\u5199 `reason` \u9ED8\u8BA4\u662F `action`\u3002"
168
168
  },
169
- { t: "h3", text: "\u300C\u4E0D\u518D\u63D0\u9192\u300D\u5C31\u5199 close \u7684 reason\uFF0C\u4E0D\u8981\u914D call" },
169
+ { t: "h3", text: "\u300C\u4ECA\u65E5\u4E0D\u518D\u63D0\u793A\u300D/\u300C\u4E0D\u518D\u63D0\u793A\u300D\uFF1AdismissToday / dismissForever" },
170
170
  {
171
171
  t: "p",
172
- text: "\u60F3\u8BA9\u7269\u6599\u300C\u5173\u4E86\u5C31\u522B\u518D\u51FA\u73B0\u300D\uFF0C\u4E00\u6761 `close` \u5C31\u591F\u4E86\uFF0C\u628A\u7528\u6237\u7684\u610F\u56FE\u5199\u8FDB `reason`\uFF1A"
172
+ text: "\u5BBF\u4E3B\u6CE8\u518C\u4E86\u4E24\u4E2A\u73B0\u6210\u7684\u65B9\u6CD5\uFF0C\u7528 `call` \u8C03\u5373\u53EF\uFF0C\u4E0D\u9700\u8981\u65B0\u7684\u52A8\u4F5C\u7C7B\u578B\uFF1A`dismissToday`\uFF08\u4ECA\u5929\u4E4B\u5185\u4E0D\u518D\u5C55\u793A\u8FD9\u6761\u7269\u6599\uFF09\u3001`dismissForever`\uFF08\u6C38\u4E45\u4E0D\u518D\u5C55\u793A\uFF09\u3002"
173
173
  },
174
174
  {
175
175
  t: "code",
176
- code: `{ "type": "close", "reason": "user-dismiss" }`
176
+ code: `// \u300C\u4ECA\u65E5\u4E0D\u518D\u63D0\u793A\u300D\u6309\u94AE\uFF1A\u5148\u5199\u6807\u8BB0\uFF0C\u518D\u5173\u6389\u8FD9\u4E00\u5C42
177
+ "action": {
178
+ "type": "sequence",
179
+ "actions": [
180
+ { "type": "call", "name": "dismissToday" },
181
+ { "type": "close", "reason": "dismiss-today" }
182
+ ]
183
+ }
184
+
185
+ // \u300C\u4E0D\u518D\u63D0\u793A\u300D\u6309\u94AE\uFF1A\u540C\u6837\u4E24\u6B65
186
+ "action": {
187
+ "type": "sequence",
188
+ "actions": [
189
+ { "type": "call", "name": "dismissForever" },
190
+ { "type": "close", "reason": "dismiss-forever" }
191
+ ]
192
+ }`
177
193
  },
178
194
  {
179
- t: "p",
180
- text: '\u4E0A\u62A5\u51FA\u53BB\u5C31\u662F `{ "id": "...", "event": "close", "reason": "user-dismiss" }`\uFF0C\u540E\u7AEF\u770B\u5230\u8FD9\u4E2A `reason` \u5C31\u6C38\u4E45\u538B\u5236\u8FD9\u6761\u7269\u6599\u3002\u8FD9\u4E2A\u4FE1\u606F\u8D70 `close` \u7684 `reason`\uFF0C\u4E0D\u8D70 `extra`\u2014\u2014`extra` \u53EA\u5C5E\u4E8E `click`\u3002'
195
+ t: "note",
196
+ tone: "warn",
197
+ text: "**\u6807\u8BB0\u548C\u5173\u95ED\u662F\u4E24\u56DE\u4E8B\uFF0C`close` \u5FC5\u987B\u81EA\u5DF1\u914D\u3002** \u8FD9\u4E24\u4E2A\u65B9\u6CD5\u53EA\u5199\u4E00\u6761\u300C\u4EE5\u540E\u522B\u518D\u5C55\u793A\u300D\u7684\u8BB0\u5F55\uFF0C\u4E0D\u4F1A\u987A\u624B\u628A\u5F53\u524D\u8FD9\u5C42\u5173\u6389\u2014\u2014\u7559\u51FA\u300C\u5148\u52FE\u4E00\u4E2A\u590D\u9009\u6846\u3001\u7A0D\u540E\u518D\u70B9\u5173\u95ED\u300D\u8FD9\u7C7B\u4EA4\u4E92\u7684\u4F59\u5730\u3002\u53EA\u5199 `call` \u4E0D\u5199 `close`\uFF0C\u7528\u6237\u70B9\u5B8C\u6309\u94AE\u5F39\u7A97\u8FD8\u6775\u5728\u90A3\u513F\u3002"
181
198
  },
182
199
  {
183
200
  t: "note",
184
201
  tone: "warn",
185
- text: "**\u4E0D\u8981**\u518D\u914D\u4E00\u6761 `call` \u8BA9\u5BBF\u4E3B\u5199 `localStorage` \u8BB0\u4F4F\u3002\u9891\u63A7\u7531\u540E\u7AEF\u7B97\uFF0C\u524D\u7AEF\u5B58\u4E00\u4EFD\u540E\u7AEF\u770B\u4E0D\u89C1\u7684\u4F9D\u636E\uFF0C\u4E24\u8FB9\u5C31\u5BF9\u4E0D\u4E0A\uFF1B\u800C\u4E14\u6362\u8BBE\u5907\u3001\u6E05\u7F13\u5B58\u5C31\u5931\u6548\u2014\u2014\u7528\u6237\u7684\u957F\u671F\u610F\u56FE\u8BE5\u8DDF\u7740\u8D26\u53F7\u8D70\uFF0C\u4E0D\u8BE5\u8DDF\u7740\u6D4F\u89C8\u5668\u8D70\uFF1B`call` \u7684\u65B9\u6CD5\u8FD8\u662F\u5404\u4E2A\u5BBF\u4E3B\u5404\u6CE8\u518C\u4E00\u4EFD\u7684\uFF0C\u884C\u4E3A\u8FDF\u65E9\u5206\u53C9\u3002"
202
+ text: "**\u8BB0\u5F55\u5B58\u5728\u7528\u6237\u6D4F\u89C8\u5668\u672C\u5730\uFF0C\u6309\u767B\u5F55\u8D26\u53F7\u9694\u79BB\u3002** \u540C\u4E00\u53F0\u7535\u8111\u6362\u4E2A\u8D26\u53F7\u767B\u5F55\u4E92\u4E0D\u5F71\u54CD\uFF0C\u4F46**\u6362\u8BBE\u5907\u3001\u6362\u6D4F\u89C8\u5668\u3001\u6E05\u7F13\u5B58\u5C31\u5931\u6548**\u2014\u2014\u5B83\u662F\u300C\u5C11\u70E6\u6211\u4E00\u4E0B\u300D\u7684\u4F53\u9A8C\u4F18\u5316\uFF0C\u4E0D\u662F\u300C\u540E\u7AEF\u6C38\u4E45\u538B\u5236\u8FD9\u6761\u6295\u653E\u300D\u7684\u51ED\u636E\u3002\u771F\u6B63\u7684\u957F\u671F\u9891\u63A7\u4ECD\u7531\u540E\u7AEF\u7B97\u3002"
203
+ },
204
+ {
205
+ t: "note",
206
+ tone: "info",
207
+ text: "`close` \u7684 `reason` \u7167\u65E7\u8981\u5199\uFF1A\u5173\u95ED\u4E8B\u4EF6\u4ECD\u4F1A\u539F\u6837\u4E0A\u62A5\u7ED9\u540E\u7AEF\uFF0C`reason` \u662F\u540E\u7AEF\u552F\u4E00\u80FD\u770B\u5230\u7684\u300C\u7528\u6237\u4E3A\u4EC0\u4E48\u5173\u300D\u3002\u8FD9\u4E2A\u4FE1\u606F\u8D70 `close` \u7684 `reason`\uFF0C\u4E0D\u8D70 `extra`\u2014\u2014`extra` \u53EA\u5C5E\u4E8E `click`\u3002"
186
208
  },
187
209
  { t: "h3", text: "call \u7684\u9002\u7528\u8FB9\u754C" },
188
210
  {
@@ -194,15 +216,15 @@ countdown_end // \u5012\u8BA1\u65F6\u5F52\u96F6`
194
216
  head: ["\u2705 \u8BE5\u7528 call", "\u274C \u4E0D\u8BE5\u7528 call"],
195
217
  rows: [
196
218
  [
197
- "\u5524\u8D77\u5145\u503C\u5F39\u7A97\u3001\u6253\u5F00\u5BA2\u670D\u4F1A\u8BDD\u3001\u590D\u5236\u5230\u526A\u8D34\u677F\u3001\u8DF3\u8F6C\u5E94\u7528\u5185\u7279\u5B9A\u9875\u9762",
198
- "\u8BB0\u5F55\u7528\u6237\u610F\u56FE\u3001\u5199\u672C\u5730\u5B58\u50A8"
219
+ "\u5524\u8D77\u5145\u503C\u5F39\u7A97\u3001\u6253\u5F00\u5BA2\u670D\u4F1A\u8BDD\u3001\u590D\u5236\u5230\u526A\u8D34\u677F\u3001\u8DF3\u8F6C\u5E94\u7528\u5185\u7279\u5B9A\u9875\u9762\u3001\u300C\u4ECA\u65E5\u4E0D\u518D\u63D0\u793A / \u4E0D\u518D\u63D0\u793A\u300D\uFF08`dismissToday` / `dismissForever`\uFF09",
220
+ "\u8BA9\u5BBF\u4E3B\u505A\u4E00\u4EF6\u5B83\u6CA1\u6CE8\u518C\u8FC7\u7684\u4E8B"
199
221
  ]
200
222
  ]
201
223
  },
202
224
  {
203
225
  t: "note",
204
226
  tone: "info",
205
- text: "\u5224\u65AD\u6807\u51C6\u53EA\u6709\u4E00\u6761\uFF1A**\u8FD9\u4EF6\u4E8B\u540E\u7AEF\u9700\u4E0D\u9700\u8981\u77E5\u9053**\u3002\u9700\u8981 \u2192 \u8D70\u4E0A\u62A5\uFF08`close` \u7684 `reason`\uFF0C\u6216 `track`\uFF09\uFF1B\u7EAF\u7CB9\u662F\u5BBF\u4E3B\u7684\u672C\u5730\u52A8\u4F5C\u3001\u540E\u7AEF\u4E0D\u5173\u5FC3 \u2192 \u624D\u7528 `call`\u3002"
227
+ text: "`call` \u53EA\u80FD\u8C03**\u4E0A\u9762\u6E05\u5355\u91CC\u5DF2\u6CE8\u518C**\u7684\u65B9\u6CD5\u540D\uFF0C\u540D\u5B57\u662F\u5BBF\u4E3B\u4E0E\u8FD0\u8425\u4E4B\u95F4\u7684\u5951\u7EA6\uFF0C\u5199\u4E86\u6CA1\u6CE8\u518C\u7684\u540D\u5B57\uFF0C\u90A3\u4E00\u6B65\u4F1A\u9759\u9ED8\u5931\u6548\uFF08\u7269\u6599\u7167\u5E38\u663E\u793A\uFF0C\u6309\u94AE\u70B9\u4E86\u6CA1\u53CD\u5E94\uFF09\u3002\u6240\u4EE5\u81EA\u5DF1\u53D1\u660E\u4E00\u4E2A\u540D\u5B57\u53BB\u300C\u8BB0\u4E00\u7B14\u8D26\u300D\u662F\u884C\u4E0D\u901A\u7684\u2014\u2014\u672C\u5730\u8BB0\u8D26\u7528\u73B0\u6210\u7684 `dismissToday` / `dismissForever`\uFF0C\u9700\u8981\u540E\u7AEF\u77E5\u9053\u7684\u4E8B\u4E00\u5F8B\u8D70\u4E0A\u62A5\uFF08`close` \u7684 `reason`\uFF0C\u6216 `track`\uFF09\u3002"
206
228
  },
207
229
  { t: "h3", text: "\u66DD\u5149\u548C\u5173\u95ED\u4E5F\u8981\u57CB\u70B9\uFF1Astage.onShow / stage.onClose" },
208
230
  {
@@ -266,7 +288,7 @@ countdown_end // \u5012\u8BA1\u65F6\u5F52\u96F6`
266
288
  {
267
289
  t: "note",
268
290
  tone: "info",
269
- text: '`close` \u53EA\u662F\u901A\u77E5\u5BBF\u4E3B\u300C\u7528\u6237\u5173\u6389\u4E86\u300D\uFF0C**\u8FD9\u4E00\u6B21\u5173\u4E0D\u5173\u7531\u5BBF\u4E3B\u51B3\u5B9A**\uFF1B\u800C\u300C\u4EE5\u540E\u8FD8\u51FA\u4E0D\u51FA\u300D\u7531\u540E\u7AEF\u6839\u636E\u4E0A\u62A5\u7684 `reason` \u51B3\u5B9A\uFF0C\u6240\u4EE5\u60F3\u8BA9\u5B83\u522B\u518D\u51FA\u73B0\uFF0C\u5199 `reason: "user-dismiss"` \u5373\u53EF\uFF0C\u4E0D\u9700\u8981\u518D\u914D `call`\u3002'
291
+ text: '`close` \u53EA\u662F\u901A\u77E5\u5BBF\u4E3B\u300C\u7528\u6237\u5173\u6389\u4E86\u300D\uFF0C**\u8FD9\u4E00\u6B21\u5173\u4E0D\u5173\u7531\u5BBF\u4E3B\u51B3\u5B9A**\uFF1B`reason` \u4F1A\u539F\u6837\u4E0A\u62A5\uFF0C\u540E\u7AEF\u636E\u6B64\u5224\u65AD\u300C\u4EE5\u540E\u8FD8\u51FA\u4E0D\u51FA\u300D\u3002\u60F3\u5728\u524D\u7AEF\u4E5F\u7ACB\u523B\u751F\u6548\uFF08\u4ECA\u5929\u4E4B\u5185 / \u6C38\u4E45\u4E0D\u518D\u51FA\u73B0\uFF09\uFF0C\u5728 `close` \u4E4B\u524D\u518D\u52A0\u4E00\u6761 `{ "type": "call", "name": "dismissToday" }`\uFF08\u6216 `dismissForever`\uFF09\uFF0C\u89C1\u4E0A\u4E00\u8282\u3002'
270
292
  },
271
293
  {
272
294
  t: "note",
@@ -2723,7 +2745,8 @@ var noticeToPopup = {
2723
2745
  fontSize: 13,
2724
2746
  cursor: "pointer"
2725
2747
  },
2726
- action: { type: "close", reason: "user-dismiss" }
2748
+ // 公告条行末的关闭只管「这一次」,不写本地标记
2749
+ action: { type: "close", reason: "user-close" }
2727
2750
  }
2728
2751
  ]
2729
2752
  }
@@ -3090,12 +3113,14 @@ var confirmAndSwitch = {
3090
3113
  cursor: "pointer"
3091
3114
  },
3092
3115
  // 确认后整个关掉,两层一起消失。
3093
- // 「不再提醒」的意图靠 reason 上报给后端,不配 call 写本地存储
3116
+ // 标记写在这一步而不是上一层的「不再提醒」按钮上:
3117
+ // 那个按钮只是打开二次确认,用户还可能反悔,真正的意图在这里才确定
3094
3118
  action: {
3095
3119
  type: "sequence",
3096
3120
  actions: [
3097
3121
  { type: "track", event: "popup_never_remind_confirm" },
3098
- { type: "closeAll", reason: "user-dismiss" }
3122
+ { type: "call", name: "dismissForever" },
3123
+ { type: "closeAll", reason: "dismiss-forever" }
3099
3124
  ]
3100
3125
  },
3101
3126
  children: [
@@ -3431,8 +3456,15 @@ var imageBanner = {
3431
3456
  fontSize: 12,
3432
3457
  cursor: "pointer"
3433
3458
  },
3434
- // 「不再提醒」写在 close 的 reason 上,上报给后端即可,不配 call 写本地存储
3435
- action: { type: "close", reason: "user-dismiss" }
3459
+ // 「不再提醒」两步走:先调宿主的 dismissForever 写本地标记(前端立刻不再展示),
3460
+ // close 关掉;reason 照旧上报给后端,那是后端唯一看得到的「为什么关」
3461
+ action: {
3462
+ type: "sequence",
3463
+ actions: [
3464
+ { type: "call", name: "dismissForever" },
3465
+ { type: "close", reason: "dismiss-forever" }
3466
+ ]
3467
+ }
3436
3468
  }
3437
3469
  ]
3438
3470
  }
@@ -3540,8 +3572,15 @@ function createDrawerBanner(options) {
3540
3572
  fontSize: 9,
3541
3573
  cursor: "pointer"
3542
3574
  },
3543
- // 「不再提醒」写在 close reason 上,上报给后端即可,不配 call 写本地存储
3544
- action: { type: "close", reason: "user-dismiss" }
3575
+ // 「不再提醒」两步走:dismissForever 写本地标记 + close 关掉,缺一不可
3576
+ // (这两个方法只写标记、不关闭)
3577
+ action: {
3578
+ type: "sequence",
3579
+ actions: [
3580
+ { type: "call", name: "dismissForever" },
3581
+ { type: "close", reason: "dismiss-forever" }
3582
+ ]
3583
+ }
3545
3584
  }
3546
3585
  ]
3547
3586
  };
@@ -4601,20 +4640,22 @@ var achieveCell3 = (verb, value, unit, label) => ({
4601
4640
  type: "flex",
4602
4641
  style: {
4603
4642
  direction: "column",
4643
+ // grid 不在白名单,用 flex wrap + 半宽复刻 grid-template-columns: 1fr 1fr(gap 9)
4604
4644
  width: "calc(50% - 5px)",
4605
4645
  background: "rgba(255,255,255,0.16)",
4606
4646
  borderWidth: 1,
4607
4647
  borderStyle: "solid",
4608
4648
  borderColor: "rgba(255,255,255,0.2)",
4609
4649
  radius: 10,
4610
- padding: "10px 13px",
4611
- gap: 3
4650
+ // .period-price-modal .ac 把基础规则的 9px 11px 覆盖成 10px 13px
4651
+ padding: "10px 13px"
4612
4652
  },
4613
4653
  children: [
4614
4654
  {
4615
- // lineHeight 必须显式给,否则 20px 数字的默认行高会把格子撑高
4655
+ // .ac .n:line-height 1.1 × 20px = 22px,显式给死,
4656
+ // 否则 20px 数字的默认行高(≈1.5)会把格子撑高 8px 左右
4616
4657
  type: "flex",
4617
- style: { align: "baseline", gap: 3, height: 22 },
4658
+ style: { align: "baseline", height: 22, whiteSpace: "nowrap" },
4618
4659
  children: [
4619
4660
  {
4620
4661
  type: "text",
@@ -4623,7 +4664,10 @@ var achieveCell3 = (verb, value, unit, label) => ({
4623
4664
  fontSize: 11.5,
4624
4665
  fontWeight: "600",
4625
4666
  lineHeight: 1.1,
4626
- color: "rgba(255,255,255,0.92)"
4667
+ letterSpacing: 0.2,
4668
+ marginRight: 3,
4669
+ // demo 是 opacity .7 叠在 .m-top 的白字上,等价于这个色值
4670
+ color: "rgba(255,255,255,0.7)"
4627
4671
  }
4628
4672
  },
4629
4673
  {
@@ -4634,14 +4678,25 @@ var achieveCell3 = (verb, value, unit, label) => ({
4634
4678
  {
4635
4679
  type: "text",
4636
4680
  content: ` ${unit}`,
4637
- style: { fontSize: 12, lineHeight: 1.1, color: "rgba(255,255,255,0.92)" }
4681
+ style: {
4682
+ fontSize: 12,
4683
+ fontWeight: "600",
4684
+ lineHeight: 1.1,
4685
+ // demo 是 opacity .85
4686
+ color: "rgba(255,255,255,0.85)"
4687
+ }
4638
4688
  }
4639
4689
  ]
4640
4690
  },
4641
4691
  {
4642
4692
  type: "text",
4643
4693
  content: label,
4644
- style: { fontSize: 11.5, lineHeight: 1.35, color: "rgba(255,255,255,0.72)" }
4694
+ style: {
4695
+ fontSize: 11,
4696
+ lineHeight: 1.4,
4697
+ marginTop: 2,
4698
+ color: "rgba(255,255,255,0.85)"
4699
+ }
4645
4700
  }
4646
4701
  ]
4647
4702
  });
@@ -4652,7 +4707,15 @@ var loseRow3 = {
4652
4707
  {
4653
4708
  type: "text",
4654
4709
  content: "",
4655
- style: { width: 6, height: 6, radius: "50%", background: "#f53f3f", marginTop: 7 }
4710
+ style: {
4711
+ width: 6,
4712
+ height: 6,
4713
+ radius: "50%",
4714
+ background: "#f53f3f",
4715
+ marginTop: 7,
4716
+ // demo 的 flex: none —— 文案换行时圆点不许被压扁
4717
+ flexShrink: "0"
4718
+ }
4656
4719
  },
4657
4720
  {
4658
4721
  type: "flex",
@@ -4668,20 +4731,6 @@ var loseRow3 = {
4668
4731
  color: "#1f2533"
4669
4732
  }
4670
4733
  },
4671
- {
4672
- type: "text",
4673
- content: "{{ item.tag }}",
4674
- visibleWhen: "item.tag != ''",
4675
- style: {
4676
- background: "{{ item.sev == 'lose' ? '#ffd5cf' : 'rgba(255,255,255,0.78)' }}",
4677
- color: "{{ item.sev == 'lose' ? '#cf1322' : '#8a7f78' }}",
4678
- fontSize: 10,
4679
- fontWeight: "800",
4680
- radius: 4,
4681
- padding: "1px 6px",
4682
- whiteSpace: "nowrap"
4683
- }
4684
- },
4685
4734
  {
4686
4735
  type: "text",
4687
4736
  content: "\u2014 {{ item.t }}",
@@ -4695,14 +4744,18 @@ var tierCard3 = {
4695
4744
  type: "box",
4696
4745
  style: {
4697
4746
  flex: "1",
4698
- height: 121,
4747
+ height: 119,
4699
4748
  radius: 12,
4700
4749
  background: "{{ item.key == current.key ? '#fffaf0' : '#ffffff' }}",
4701
4750
  borderStyle: "solid",
4702
4751
  borderWidth: "{{ item.key == current.key ? '2px' : '1px' }}",
4703
4752
  borderColor: "{{ item.key == current.key ? '#f0a000' : '#e5e8ed' }}",
4704
- cursor: "pointer"
4753
+ shadow: "{{ item.key == current.key ? '0 7px 18px rgba(240,160,0,0.1)' : 'none' }}",
4754
+ cursor: "pointer",
4755
+ transition: "border-color 0.15s, background 0.15s, box-shadow 0.15s"
4705
4756
  },
4757
+ // .tcol:hover { border-color: var(--gold) }
4758
+ hoverStyle: { borderColor: "#faad14" },
4706
4759
  action: {
4707
4760
  type: "sequence",
4708
4761
  actions: [
@@ -4716,6 +4769,8 @@ var tierCard3 = {
4716
4769
  },
4717
4770
  children: [
4718
4771
  {
4772
+ // .thot:top -9、字号 11、padding 2px 8px、radius 6。
4773
+ // 宽 38 = 2 字 × 11px + 左右 8px;居中靠 left: calc(50% - 19px)
4719
4774
  type: "text",
4720
4775
  rect: ["calc(50% - 19px)", -9, 38, 22],
4721
4776
  content: "\u63A8\u8350",
@@ -4727,29 +4782,41 @@ var tierCard3 = {
4727
4782
  fontWeight: "800",
4728
4783
  radius: 6,
4729
4784
  textAlign: "center",
4730
- lineHeight: 22
4785
+ lineHeight: 22,
4786
+ whiteSpace: "nowrap"
4731
4787
  }
4732
4788
  },
4733
4789
  {
4734
4790
  type: "text",
4735
4791
  rect: [0, 12, "100%", 19],
4736
4792
  content: "{{ item.p }}",
4737
- style: { fontSize: 13, color: "#8a909c", textAlign: "center" }
4793
+ style: { fontSize: 13, lineHeight: 1.45, color: "#8a909c", textAlign: "center" }
4738
4794
  },
4739
4795
  {
4740
4796
  type: "flex",
4741
- rect: [0, 34, "100%", 26],
4797
+ rect: [0, 36, "100%", 26],
4742
4798
  style: { justify: "center", align: "baseline" },
4743
4799
  children: [
4744
4800
  {
4801
+ // .tpr i:符号比数字小一号、字重 600
4745
4802
  type: "text",
4746
4803
  content: "\xA5",
4747
- style: { fontSize: 13, fontWeight: "800", color: "#1f2533" }
4804
+ style: {
4805
+ fontSize: 14,
4806
+ fontWeight: "600",
4807
+ lineHeight: 1.2,
4808
+ color: "{{ item.key == current.key ? '#d46b08' : '#1f2533' }}"
4809
+ }
4748
4810
  },
4749
4811
  {
4750
4812
  type: "text",
4751
4813
  content: "{{ item.price }}",
4752
- style: { fontSize: 21, fontWeight: "800", color: "#1f2533" }
4814
+ style: {
4815
+ fontSize: 21,
4816
+ fontWeight: "800",
4817
+ lineHeight: 1.2,
4818
+ color: "{{ item.key == current.key ? '#d46b08' : '#1f2533' }}"
4819
+ }
4753
4820
  }
4754
4821
  ]
4755
4822
  },
@@ -4757,14 +4824,21 @@ var tierCard3 = {
4757
4824
  type: "text",
4758
4825
  rect: [4, 63, "calc(100% - 8px)", 32],
4759
4826
  content: "{{ item.per }}",
4760
- style: { fontSize: 11, color: "#8a909c", textAlign: "center", lineHeight: 1.35 }
4827
+ style: {
4828
+ fontSize: 11,
4829
+ lineHeight: 1.5,
4830
+ textAlign: "center",
4831
+ color: "{{ item.key == current.key ? '#d46b08' : '#8a909c' }}",
4832
+ fontWeight: "{{ item.key == current.key ? '600' : '400' }}"
4833
+ }
4761
4834
  },
4762
4835
  {
4836
+ // .tflag 的 margin-top: auto(贴底)在绝对定位里直接写死 y = 119 - 9 - 15
4763
4837
  type: "text",
4764
- rect: [0, 98, "100%", 15],
4838
+ rect: [0, 95, "100%", 15],
4765
4839
  content: "{{ item.flag }}",
4766
4840
  visibleWhen: "item.flag != ''",
4767
- style: { fontSize: 11, color: "#8a909c", textAlign: "center" }
4841
+ style: { fontSize: 11, lineHeight: 1.35, color: "#8a909c", textAlign: "center" }
4768
4842
  }
4769
4843
  ]
4770
4844
  };
@@ -4773,13 +4847,37 @@ var quotaLow = {
4773
4847
  type: "popup",
4774
4848
  meta: { name: "\u642C\u5BB6\u6B21\u6570\u5C06\u5C3D \xB7 \u989D\u5EA6\u8FDB\u5EA6\u6761\uFF08\u590D\u523B\u8FD0\u8425 demo\uFF09" },
4775
4849
  stage: {
4850
+ // .modal.period-price-modal { width: min(520px, calc(100vw - 24px)) }
4776
4851
  width: 520,
4777
4852
  height: "auto",
4778
4853
  layout: "flow",
4779
4854
  mask: true,
4780
4855
  maskClosable: false,
4781
- closeButton: { show: true, position: "top-right", offset: [14, 14] },
4782
- style: { radius: 18 }
4856
+ closeButton: {
4857
+ // .m-close:24×24 的半透明白圆点,字符 ×、15px
4858
+ show: true,
4859
+ position: "top-right",
4860
+ offset: [14, 14],
4861
+ size: 24,
4862
+ icon: "\xD7",
4863
+ style: { background: "rgba(255,255,255,0.3)", fontSize: 15, color: "#ffffff" }
4864
+ },
4865
+ // .modal 的圆角与投影(--shadow-lg)
4866
+ style: { radius: 18, shadow: "0 28px 72px rgba(16,27,51,0.24)" },
4867
+ // demo 的 animation: pop .38s cubic-bezier(.16,1,.3,1) both
4868
+ // 注意 easing 的小数必须写成 0.16 —— 校验的正则不认 CSS 允许的 .16 简写
4869
+ animate: {
4870
+ name: "pop",
4871
+ duration: 380,
4872
+ easing: "cubic-bezier(0.16, 1, 0.3, 1)",
4873
+ fill: "both"
4874
+ }
4875
+ },
4876
+ keyframes: {
4877
+ pop: {
4878
+ from: { opacity: 0, transform: "translateY(14px) scale(0.96)" },
4879
+ to: { opacity: 1, transform: "none" }
4880
+ }
4783
4881
  },
4784
4882
  data: {
4785
4883
  // 实时统计走后端数据源。$source 填的是宿主注册过的数据源名(不是接口地址),
@@ -4787,20 +4885,11 @@ var quotaLow = {
4787
4885
  stat: { $source: "userStatistics" },
4788
4886
  // 总额度:运营按当前套餐手填。为什么不走接口、以后怎么换,见文件头注释
4789
4887
  total: 30,
4888
+ // 三条都没有状态标签 —— demo 这一屏的 lose 配置里就没有 tag 字段
4790
4889
  lose: [
4791
- { b: "\u6279\u91CF\u642C\u5BB6", tag: "\u5C06\u505C\u7528", sev: "lose", t: "\u989D\u5EA6\u5F52\u96F6\u540E\u65E0\u6CD5\u7EE7\u7EED\u4E0A\u8D27" },
4792
- {
4793
- b: "1688 \u4E00\u4EF6\u4EE3\u53D1",
4794
- tag: "\u5C06\u505C\u7528",
4795
- sev: "lose",
4796
- t: "\u6E90\u5934\u8D27\u6E90\u65AD\u4F9B\uFF0C\u9009\u54C1\u3001\u94FA\u8D27\u3001\u4EE3\u53D1\u90FD\u8981\u624B\u52A8\u505A"
4797
- },
4798
- {
4799
- b: "AI \u81EA\u52A8\u4F18\u5316",
4800
- tag: "\u5C06\u6682\u505C",
4801
- sev: "pause",
4802
- t: "\u65B0\u5546\u54C1\u4E0D\u518D\u8865\u4E3B\u6807\u9898 / \u77ED\u6807\u9898 / \u767D\u5E95\u56FE"
4803
- }
4890
+ { b: "\u6279\u91CF\u642C\u5BB6", t: "\u989D\u5EA6\u5F52\u96F6\u540E\u65E0\u6CD5\u7EE7\u7EED\u4E0A\u8D27" },
4891
+ { b: "1688 \u4E00\u4EF6\u4EE3\u53D1", t: "\u6E90\u5934\u8D27\u6E90\u65AD\u4F9B\uFF0C\u9009\u54C1\u3001\u94FA\u8D27\u3001\u4EE3\u53D1\u90FD\u8981\u624B\u52A8\u505A" },
4892
+ { b: "AI \u81EA\u52A8\u4F18\u5316", t: "\u65B0\u5546\u54C1\u4E0D\u518D\u8865\u4E3B\u6807\u9898 / \u77ED\u6807\u9898 / \u767D\u5E95\u56FE" }
4804
4893
  ],
4805
4894
  // 价格档位从后端数据源取,后端返回几档就渲染几档,配置时不用知道数量
4806
4895
  tiers: { $source: "listRenewTiers", params: { scene: "quota_low" } }
@@ -4808,118 +4897,114 @@ var quotaLow = {
4808
4897
  state: { period: 1 },
4809
4898
  derived: { current: { list: "tiers", indexBy: "period" } },
4810
4899
  nodes: [
4811
- // ===== 深色渐变头部:标签 + 2×2 成果格 =====
4900
+ // ===== .m-top 深色渐变头部:(标签 + 额度条)同排 + 2×2 成果格 =====
4812
4901
  {
4813
4902
  type: "flex",
4814
4903
  style: {
4815
4904
  direction: "column",
4816
4905
  background: "linear-gradient(135deg,#2b0f0f,#3a1414)",
4817
- padding: "20px 22px 16px",
4818
- gap: 13
4906
+ padding: "20px 22px 16px"
4819
4907
  },
4820
4908
  children: [
4821
4909
  {
4822
- type: "text",
4823
- content: "\u26A1 \u642C\u5BB6\u6B21\u6570\u5373\u5C06\u7528\u5B8C",
4824
- style: {
4825
- // 不写 alignSelf 会被 flex 列拉满整行,标签必须按内容宽度
4826
- alignSelf: "flex-start",
4827
- background: "rgba(255,255,255,0.18)",
4828
- color: "#ffffff",
4829
- fontSize: 12,
4830
- fontWeight: "700",
4831
- radius: 6,
4832
- padding: "5px 10px"
4833
- }
4834
- },
4835
- {
4836
- // 四格并列写死(扁平对象没法 bind 遍历),flex + wrap 排成 2×2。
4837
- // 第一格的数字不是统计字段,而是「总额度 − 剩余次数」现算出来的
4838
- type: "flex",
4839
- style: { gap: 9, wrap: true },
4840
- children: [
4841
- achieveCell3("\u5DF2\u7528", USED, "\u6B21", "\u642C\u5BB6\u6B21\u6570"),
4842
- achieveCell3("\u5DF2\u4E0A\u67B6", "{{ stat.move_success_count }}", "\u4E2A", "\u7D2F\u8BA1\u4E0A\u67B6\u5546\u54C1"),
4843
- achieveCell3("\u65E5\u5747", "{{ stat.avg_daily_move_count }}", "\u4E2A", "\u5E73\u5747\u6BCF\u5929\u4E0A\u67B6"),
4844
- achieveCell3(
4845
- "\u5DF2\u8865\u9F50",
4846
- "{{ stat.white_image_fill_count }}",
4847
- "\u5F20",
4848
- "\u767D\u5E95\u56FE \xB7 \u5408\u89C4\u53EF\u62A5\u6D3B\u52A8"
4849
- )
4850
- ]
4851
- }
4852
- ]
4853
- },
4854
- // ===== 白色 body =====
4855
- {
4856
- type: "flex",
4857
- style: { direction: "column", background: "#ffffff", padding: "22px 26px 24px" },
4858
- children: [
4859
- // ===== 额度进度条:轨道 + 填充条 + 百分比表达式(本示例的重点)=====
4860
- {
4910
+ // .m-top-head:右侧留 30px 给关闭按钮让位
4861
4911
  type: "flex",
4862
4912
  style: {
4863
- direction: "column",
4864
- background: "#fff8f3",
4865
- radius: 10,
4866
- padding: "8px 13px 9px",
4867
- gap: 4
4913
+ align: "center",
4914
+ justify: "space-between",
4915
+ gap: 14,
4916
+ padding: "0 30px 0 0"
4868
4917
  },
4869
4918
  children: [
4870
4919
  {
4871
- // 标题行:左边「剩余 N 次」,右边「已用 X / 总额度 次」
4920
+ // .tag:flex: none,按内容宽度,不许被额度条挤扁
4921
+ type: "text",
4922
+ content: "\u26A1 \u642C\u5BB6\u6B21\u6570\u5373\u5C06\u7528\u5B8C",
4923
+ style: {
4924
+ background: "rgba(255,255,255,0.18)",
4925
+ color: "#ffffff",
4926
+ fontSize: 12,
4927
+ fontWeight: "700",
4928
+ radius: 6,
4929
+ padding: "3px 10px",
4930
+ flexShrink: "0",
4931
+ whiteSpace: "nowrap"
4932
+ }
4933
+ },
4934
+ {
4935
+ // ===== 额度进度条(本示例的重点)。.m-top .quota 反白配色版 =====
4872
4936
  type: "flex",
4873
- style: { align: "baseline", justify: "space-between" },
4937
+ style: {
4938
+ direction: "column",
4939
+ flex: "1",
4940
+ maxWidth: 280,
4941
+ background: "rgba(255,255,255,0.12)",
4942
+ borderWidth: 1,
4943
+ borderStyle: "solid",
4944
+ borderColor: "rgba(255,255,255,0.16)",
4945
+ radius: 7,
4946
+ padding: "3px 10px 4px"
4947
+ },
4874
4948
  children: [
4875
4949
  {
4950
+ // .qh:左「搬家次数剩余」,右加粗的剩余次数
4876
4951
  type: "flex",
4877
- style: { align: "baseline", gap: 3 },
4952
+ style: { align: "baseline", justify: "space-between" },
4878
4953
  children: [
4879
4954
  {
4880
4955
  type: "text",
4881
4956
  content: "\u642C\u5BB6\u6B21\u6570\u5269\u4F59",
4882
- style: { fontSize: 12, lineHeight: 1.35, color: "#3f4656" }
4957
+ style: {
4958
+ fontSize: 10.5,
4959
+ lineHeight: 1.25,
4960
+ color: "rgba(255,255,255,0.85)"
4961
+ }
4883
4962
  },
4884
4963
  {
4885
4964
  type: "text",
4886
4965
  content: "{{ user.collectCount }} \u6B21",
4887
4966
  style: {
4888
- fontSize: 15,
4967
+ fontSize: 12.5,
4889
4968
  fontWeight: "800",
4890
- lineHeight: 1.25,
4891
- color: "#cf1322"
4969
+ lineHeight: 1.15,
4970
+ color: "#ffb066"
4971
+ }
4972
+ }
4973
+ ]
4974
+ },
4975
+ {
4976
+ // .qbar 轨道。用 flex 而不是 box —— box 的子节点走绝对定位、必须给 rect,
4977
+ // 填充条要的是「跟着父级流」;overflow: hidden 必须写,
4978
+ // 否则填充条的直角会戳出轨道的圆角外面
4979
+ type: "flex",
4980
+ style: {
4981
+ height: 3,
4982
+ radius: 4,
4983
+ background: "rgba(255,255,255,0.2)",
4984
+ margin: "2px 0 1px",
4985
+ overflow: "hidden"
4986
+ },
4987
+ children: [
4988
+ {
4989
+ // 填充条。宽度是算出来的:已用 ÷ 总额度 × 100,节点 style 里的
4990
+ // 字符串同样走插值,所以百分比不需要后端多下发一个字段
4991
+ type: "box",
4992
+ style: {
4993
+ width: "{{ (total - user.collectCount) / total * 100 }}%",
4994
+ height: "100%",
4995
+ background: "linear-gradient(90deg,#f53f3f,#ff7a45)"
4892
4996
  }
4893
4997
  }
4894
4998
  ]
4895
4999
  },
4896
5000
  {
5001
+ // .qn
4897
5002
  type: "text",
4898
5003
  content: `\u5DF2\u7528 ${USED} / {{ total }} \u6B21`,
4899
- style: { fontSize: 10.5, lineHeight: 1.35, color: "#8a909c" }
4900
- }
4901
- ]
4902
- },
4903
- {
4904
- // 轨道。用 flex 而不是 box —— box 的子节点走绝对定位、必须给 rect,
4905
- // 填充条要的是「跟着父级流」;overflow: hidden 必须写,否则填充条的
4906
- // 直角会戳出轨道的圆角外面
4907
- type: "flex",
4908
- style: {
4909
- height: 5,
4910
- radius: 4,
4911
- background: "#ffe0cc",
4912
- overflow: "hidden"
4913
- },
4914
- children: [
4915
- {
4916
- // 填充条。宽度是算出来的:已用 ÷ 总额度 × 100,节点 style 里的
4917
- // 字符串同样走插值,所以百分比不需要后端多下发一个字段
4918
- type: "box",
4919
5004
  style: {
4920
- width: "{{ (total - user.collectCount) / total * 100 }}%",
4921
- height: "100%",
4922
- background: "linear-gradient(90deg,#f53f3f,#ff7a45)"
5005
+ fontSize: 9,
5006
+ lineHeight: 1.25,
5007
+ color: "rgba(255,255,255,0.6)"
4923
5008
  }
4924
5009
  }
4925
5010
  ]
@@ -4927,17 +5012,49 @@ var quotaLow = {
4927
5012
  ]
4928
5013
  },
4929
5014
  {
5015
+ // .achieve:四格并列写死(扁平对象没法 bind 遍历),flex + wrap 复刻 2×2 grid。
5016
+ // 第一格的数字不是统计字段,而是「总额度 − 剩余次数」现算出来的
5017
+ type: "flex",
5018
+ style: { gap: 9, wrap: true, marginTop: 14 },
5019
+ children: [
5020
+ achieveCell3("\u5DF2\u7528", USED, "\u6B21", "\u642C\u5BB6\u6B21\u6570"),
5021
+ achieveCell3("\u5DF2\u4E0A\u67B6", "{{ stat.move_success_count }}", "\u4E2A", "\u7D2F\u8BA1\u4E0A\u67B6\u5546\u54C1"),
5022
+ achieveCell3("\u65E5\u5747", "{{ stat.avg_daily_move_count }}", "\u4E2A", "\u5E73\u5747\u6BCF\u5929\u4E0A\u67B6"),
5023
+ achieveCell3(
5024
+ "\u5DF2\u8865\u9F50",
5025
+ "{{ stat.white_image_fill_count }}",
5026
+ "\u5F20",
5027
+ "\u767D\u5E95\u56FE \xB7 \u5408\u89C4\u53EF\u62A5\u6D3B\u52A8"
5028
+ )
5029
+ ]
5030
+ }
5031
+ ]
5032
+ },
5033
+ // ===== .m-body 白底 =====
5034
+ {
5035
+ type: "flex",
5036
+ style: { direction: "column", background: "#ffffff", padding: "22px 26px 24px" },
5037
+ children: [
5038
+ {
5039
+ // .m-copy-panel
4930
5040
  type: "text",
4931
5041
  content: "\u642C\u5BB6\u6B21\u6570\u7528\u5B8C\uFF0C\u4EA7\u54C1\u80FD\u529B\u5C06\u53D7\u9650\uFF1A",
4932
- style: { fontSize: 15, fontWeight: "800", color: "#1f2533", marginTop: 17 }
5042
+ style: {
5043
+ fontSize: 15,
5044
+ fontWeight: "800",
5045
+ lineHeight: 1.55,
5046
+ letterSpacing: -0.15,
5047
+ color: "#1f2533"
5048
+ }
4933
5049
  },
4934
5050
  {
5051
+ // .lose
4935
5052
  type: "repeat",
4936
5053
  bind: "lose",
4937
5054
  template: loseRow3,
4938
5055
  style: {
4939
5056
  direction: "column",
4940
- marginTop: 12,
5057
+ marginTop: 14,
4941
5058
  background: "#ffe9e6",
4942
5059
  borderWidth: 1,
4943
5060
  borderStyle: "solid",
@@ -4947,13 +5064,20 @@ var quotaLow = {
4947
5064
  }
4948
5065
  },
4949
5066
  {
5067
+ // .tiers 的 border-top:白名单没有 borderTop,用 1px 实心分隔条代替
5068
+ type: "box",
5069
+ style: { height: 1, background: "#eceef3", marginTop: 18 }
5070
+ },
5071
+ {
5072
+ // .tv:lead 被 normalizeTrialPricing 置空,所以整行都在 <b> 里
5073
+ //(字重 800、墨色),后面跟价格口径标记 .tv-tag
4950
5074
  type: "flex",
4951
- style: { align: "center", gap: 8, marginTop: 17, marginBottom: 9 },
5075
+ style: { align: "center", gap: 8, marginTop: 17, marginBottom: 11 },
4952
5076
  children: [
4953
5077
  {
4954
5078
  type: "text",
4955
- content: "\u7EED\u6EE1\u989D\u5EA6 \xB7 \u9009\u62E9\u5468\u671F",
4956
- style: { fontSize: 13.5, fontWeight: "700", color: "#747b89" }
5079
+ content: "\u4E13\u5C5E\u4F18\u60E0 \xB7 \u5012\u8BA1\u65F6",
5080
+ style: { fontSize: 13.5, fontWeight: "800", color: "#1f2533" }
4957
5081
  },
4958
5082
  {
4959
5083
  type: "text",
@@ -4970,19 +5094,27 @@ var quotaLow = {
4970
5094
  }
4971
5095
  ]
4972
5096
  },
5097
+ // .tcols:wide 版 gap 8
4973
5098
  { type: "repeat", bind: "tiers", style: { gap: 8 }, template: tierCard3 },
4974
5099
  {
5100
+ // .m-cta(th-loss 主题的红橙渐变)
4975
5101
  type: "flex",
4976
5102
  style: {
4977
5103
  justify: "center",
4978
- align: "center",
5104
+ align: "baseline",
4979
5105
  gap: 5,
4980
- height: 52,
5106
+ padding: "13px",
4981
5107
  radius: 11,
4982
5108
  background: "linear-gradient(90deg,#f53f3f,#ff7a45)",
4983
- marginTop: 15,
5109
+ marginTop: 20,
5110
+ shadow: "0 8px 18px rgba(245,63,63,0.14)",
5111
+ transition: "transform 0.18s, box-shadow 0.18s",
4984
5112
  cursor: "pointer"
4985
5113
  },
5114
+ hoverStyle: {
5115
+ transform: "translateY(-1px)",
5116
+ shadow: "0 10px 22px rgba(245,63,63,0.2)"
5117
+ },
4986
5118
  action: {
4987
5119
  type: "sequence",
4988
5120
  actions: [
@@ -4996,11 +5128,18 @@ var quotaLow = {
4996
5128
  },
4997
5129
  children: [
4998
5130
  {
5131
+ // .m-cta .ct
4999
5132
  type: "text",
5000
5133
  content: "\u7EED\u6EE1\u989D\u5EA6 \xB7",
5001
- style: { fontSize: 14, fontWeight: "800", color: "#ffffff" }
5134
+ style: {
5135
+ fontSize: 14,
5136
+ fontWeight: "800",
5137
+ letterSpacing: -0.2,
5138
+ color: "#ffffff"
5139
+ }
5002
5140
  },
5003
5141
  {
5142
+ // .m-cta .cp —— demo 的 syncCTAPrice() 把它同步成「选中档位名 + 价格」
5004
5143
  type: "text",
5005
5144
  content: "{{ current.p }} \xA5{{ current.price }}",
5006
5145
  style: { fontSize: 16.5, fontWeight: "800", color: "#ffffff" }
@@ -5008,13 +5147,14 @@ var quotaLow = {
5008
5147
  ]
5009
5148
  },
5010
5149
  {
5150
+ // .m-ghost
5011
5151
  type: "text",
5012
5152
  content: "\u5347\u7EA7\u6216\u67E5\u770B\u66F4\u591A\u4EA7\u54C1\u5957\u9910",
5013
5153
  style: {
5014
- fontSize: 12.5,
5154
+ fontSize: 12,
5015
5155
  color: "#8a909c",
5016
5156
  textAlign: "center",
5017
- marginTop: 11,
5157
+ marginTop: 10,
5018
5158
  cursor: "pointer"
5019
5159
  },
5020
5160
  action: { type: "track", event: "popup_more_plans" }
@@ -5149,10 +5289,17 @@ var imageHotspot = {
5149
5289
  id: "hotspot-never",
5150
5290
  type: "box",
5151
5291
  // 最底部「不再提醒」,动作是关弹窗而不是跳转。
5152
- // reason 上报给后端,后端据此不再下发这条物料——不需要写本地存储
5292
+ // dismissForever 写本地标记让它前端立刻不再出现,close 才是真正关掉这一层;
5293
+ // reason 一并上报,后端据此决定以后还下不下发
5153
5294
  rect: ["30%", 478, "40%", 26],
5154
5295
  style: { radius: 13, background: HOTSPOT_BG, cursor: "pointer" },
5155
- action: { type: "close", reason: "user-dismiss" }
5296
+ action: {
5297
+ type: "sequence",
5298
+ actions: [
5299
+ { type: "call", name: "dismissForever" },
5300
+ { type: "close", reason: "dismiss-forever" }
5301
+ ]
5302
+ }
5156
5303
  }
5157
5304
  ]
5158
5305
  };
@@ -5232,7 +5379,9 @@ var noticeBar = {
5232
5379
  type: "sequence",
5233
5380
  actions: [
5234
5381
  { type: "track", event: "notice_close", params: { notice: "guide" } },
5235
- { type: "close", reason: "user-dismiss" }
5382
+ // 行末的 × 只是「这次关掉」,不写本地标记:下次进页面它还该出现。
5383
+ // 要「以后别再出现」得另放一个按钮,配 dismissForever(见 action 章节)
5384
+ { type: "close", reason: "user-close" }
5236
5385
  ]
5237
5386
  }
5238
5387
  }
@@ -5467,7 +5616,8 @@ function checklistSection() {
5467
5616
  \u6709\u4E00\u4E2A\u4E0D\u5408\u89C4\uFF0C\u6574\u4EFD\u914D\u7F6E\u5C31\u5B58\u4E0D\u4E0A
5468
5617
  - [ ] \u6BCF\u4E2A\u89C6\u56FE\u7684 \`stage\` \u90FD\u6709 \`onShow\` \u66DD\u5149\u57CB\u70B9\u548C \`onClose\` \u5173\u95ED\u57CB\u70B9\uFF0C\`onClose\` \u7684 params \u91CC\u5E26\u4E0A \`"reason": "{{ closeReason }}"\`
5469
5618
  - [ ] \u5173\u95ED\u6309\u94AE\u6CA1\u6709\u591A\u4F59\u7684 \`icon\`\uFF08\u9ED8\u8BA4\u7684\u5185\u7F6E\u77E2\u91CF\u56FE\u6807\u5C31\u662F\u5BF9\u7684\uFF09
5470
- - [ ] \u6CA1\u6709\u7528 \`call\` \u53BB\u8BB0\u5F55\u7528\u6237\u610F\u56FE\u6216\u5199\u672C\u5730\u5B58\u50A8\uFF08\`call\` \u53EA\u7528\u6765\u8BA9\u5BBF\u4E3B\u505A\u4E00\u4EF6\u4E8B\uFF0C\u5982\u5524\u8D77\u5145\u503C / \u6253\u5F00\u5BA2\u670D / \u590D\u5236\u5230\u526A\u8D34\u677F\uFF09\u3002\u300C\u4E0D\u518D\u63D0\u9192\u300D\u5199\u6210 \`{ "type": "close", "reason": "user-dismiss" }\`\uFF0C\u4E0D\u914D \`call\`
5619
+ - [ ] \u6BCF\u4E2A \`call\` \u7684 \`name\` \u90FD\u662F\u5BBF\u4E3B\u5DF2\u6CE8\u518C\u7684\u65B9\u6CD5\uFF08\u5F53\u524D\u53EA\u6709 \`dismissToday\` / \`dismissForever\`\uFF09\uFF0C\u6CA1\u6709\u81EA\u5DF1\u53D1\u660E\u7684\u540D\u5B57\u2014\u2014\u5199\u4E86\u6CA1\u6CE8\u518C\u7684\u540D\u5B57\u90A3\u4E00\u6B65\u9759\u9ED8\u5931\u6548
5620
+ - [ ] \u914D\u4E86\u300C\u4ECA\u65E5\u4E0D\u518D\u63D0\u793A\u300D/\u300C\u4E0D\u518D\u63D0\u793A\u300D\u7684\u8BDD\uFF1A\`call\` \u540E\u9762**\u8DDF\u7740 \`close\`**\uFF08\u8FD9\u4E24\u4E2A\u65B9\u6CD5\u53EA\u5199\u6807\u8BB0\u3001\u4E0D\u5173\u95ED\uFF0C\u6F0F\u4E86 \`close\` \u7528\u6237\u70B9\u5B8C\u5F39\u7A97\u8FD8\u5728\uFF09\uFF0C\u4E14 \`close\` \u5E26\u4E0A \`reason\`
5471
5621
  - [ ] \u6BCF\u4E2A \`animate.name\` \u90FD\u80FD\u5728\u9876\u5C42 \`keyframes\` \u91CC\u627E\u5230\uFF1B\`easing\` \u5728\u767D\u540D\u5355\u91CC\uFF1B\u6CA1\u6709\u5B9A\u4E49\u4E86\u5374\u6CA1\u4EBA\u5F15\u7528\u7684\u5173\u952E\u5E27
5472
5622
  - [ ] \u88C5\u9970\u6027\u56FE\u5C42\uFF08\u5149\u6655\u3001\u626B\u5149\u3001\u5149\u70B9\uFF09\u90FD\u5199\u4E86 \`"pointerEvents": "none"\`
5473
5623
  - [ ] \u8F93\u51FA\u7684\u662F\u5408\u6CD5 JSON\uFF08\u6CA1\u6709\u591A\u4F59\u9017\u53F7\u3001\u6CA1\u6709\u6CE8\u91CA\uFF09`;
@@ -5507,8 +5657,11 @@ function actionSection() {
5507
5657
  - \`setState\`\uFF1A\`{ "type": "setState", "key": "period", "value": "{{ index }}" }\` \u505A\u9009\u4E2D\u5207\u6362
5508
5658
  - \`close\`\uFF1A\u5173\u6389\u5F53\u524D\u8FD9\u4E00\u5C42\uFF08\u53EA\u6709\u4E00\u5C42\u65F6\u5C31\u662F\u6574\u4F53\u5173\u95ED\uFF09\u3002\u6CE8\u610F\u5B83\u53EA\u662F**\u901A\u77E5\u5BBF\u4E3B\u9875\u9762**\u300C\u7528\u6237\u60F3\u5173\u4E86\u300D\uFF0C\u7531\u5BBF\u4E3B\u51B3\u5B9A\u5173\u4E0D\u5173\uFF1B\u591A\u89C6\u56FE\u65F6\u5173\u5185\u5C42\u4E0D\u4F1A\u901A\u77E5\u5BBF\u4E3B\uFF0C\u53EA\u662F\u56DE\u5230\u4E0B\u9762\u90A3\u5C42
5509
5659
  - \`closeAll\`\uFF1A\u51E0\u5C42\u90FD\u5173\u6389\uFF0C\u4E00\u5B9A\u4F1A\u901A\u77E5\u5BBF\u4E3B
5510
- - \u60F3\u300C\u5173\u4E86\u5C31\u522B\u518D\u51FA\u73B0\u300D\uFF0C\u5C31\u5199 \`{ "type": "close", "reason": "user-dismiss" }\`\u3002\u4E0A\u62A5\u51FA\u53BB\u662F \`{ "event": "close", "reason": "user-dismiss" }\`\uFF0C\u540E\u7AEF\u636E\u6B64\u6C38\u4E45\u538B\u5236\u8FD9\u6761\u7269\u6599\u3002**\u4E0D\u8981**\u518D\u914D \`call\` \u8BA9\u5BBF\u4E3B\u5199\u672C\u5730\u5B58\u50A8\u2014\u2014\u9891\u63A7\u7531\u540E\u7AEF\u7B97\uFF0C\u524D\u7AEF\u5B58\u7684\u4F9D\u636E\u540E\u7AEF\u770B\u4E0D\u89C1\uFF0C\u800C\u4E14\u6362\u8BBE\u5907\u3001\u6E05\u7F13\u5B58\u5C31\u6CA1\u4E86
5511
- - \`call\`\uFF1A**\u8BA9\u5BBF\u4E3B\u53BB\u505A\u4E00\u4EF6\u4E8B**\uFF08\u5524\u8D77\u5145\u503C\u5F39\u7A97\u3001\u6253\u5F00\u5BA2\u670D\u4F1A\u8BDD\u3001\u590D\u5236\u5230\u526A\u8D34\u677F\u3001\u8DF3\u8F6C\u5E94\u7528\u5185\u7279\u5B9A\u9875\u9762\uFF09\u3002\u5224\u65AD\u6807\u51C6\uFF1A**\u8FD9\u4EF6\u4E8B\u540E\u7AEF\u9700\u4E0D\u9700\u8981\u77E5\u9053**\u2014\u2014\u9700\u8981\u5C31\u8D70\u4E0A\u62A5\uFF08\`close\` \u7684 \`reason\` \u6216 \`track\`\uFF09\uFF0C\u7EAF\u672C\u5730\u52A8\u4F5C\u624D\u7528 \`call\`\u3002\u7EDD\u4E0D\u7528 \`call\` \u8BB0\u5F55\u7528\u6237\u610F\u56FE\u6216\u5199\u672C\u5730\u5B58\u50A8
5660
+ - \`call\`\uFF1A**\u8BA9\u5BBF\u4E3B\u53BB\u505A\u4E00\u4EF6\u5DF2\u6CE8\u518C\u7684\u4E8B**\u3002\u540D\u5B57\u53EA\u80FD\u4ECE\u5BBF\u4E3B\u6CE8\u518C\u7684\u6E05\u5355\u91CC\u9009\uFF0C\u5199\u4E86\u6CA1\u6CE8\u518C\u7684\u540D\u5B57\u90A3\u4E00\u6B65\u9759\u9ED8\u5931\u6548\uFF08\u7269\u6599\u7167\u5E38\u663E\u793A\uFF0C\u6309\u94AE\u70B9\u4E86\u6CA1\u53CD\u5E94\uFF09\uFF0C\u6240\u4EE5\u4E0D\u8981\u81EA\u5DF1\u53D1\u660E\u65B9\u6CD5\u540D
5661
+ - \u300C\u4ECA\u65E5\u4E0D\u518D\u63D0\u793A\u300D/\u300C\u4E0D\u518D\u63D0\u793A\u300D\u7528\u73B0\u6210\u7684\u4E24\u4E2A\u65B9\u6CD5\uFF1A\`dismissToday\` / \`dismissForever\`\u3002**\u5B83\u4EEC\u53EA\u5199\u6807\u8BB0\u3001\u4E0D\u5173\u95ED**\uFF0C\`close\` \u5FC5\u987B\u81EA\u5DF1\u914D\u5728\u540E\u9762\uFF1A
5662
+ \`{ "type": "sequence", "actions": [{ "type": "call", "name": "dismissToday" }, { "type": "close", "reason": "dismiss-today" }] }\`
5663
+ \uFF08\u6C38\u4E45\u7248\u628A\u4E24\u5904\u5206\u522B\u6362\u6210 \`dismissForever\` \u548C \`"dismiss-forever"\`\uFF09
5664
+ - \u8FD9\u4E24\u4E2A\u65B9\u6CD5\u7684\u8BB0\u5F55**\u5B58\u5728\u7528\u6237\u6D4F\u89C8\u5668\u672C\u5730\u3001\u6309\u767B\u5F55\u8D26\u53F7\u9694\u79BB**\uFF0C\u6362\u8BBE\u5907 / \u6E05\u7F13\u5B58\u5C31\u5931\u6548\u2014\u2014\u662F\u300C\u5C11\u70E6\u6211\u4E00\u4E0B\u300D\u7684\u4F53\u9A8C\u4F18\u5316\uFF0C\u4E0D\u662F\u540E\u7AEF\u6C38\u4E45\u538B\u5236\u8FD9\u6761\u6295\u653E\u7684\u51ED\u636E\u3002\u6240\u4EE5 \`close\` \u7684 \`reason\` \u7167\u65E7\u8981\u5199\uFF0C\u90A3\u662F\u540E\u7AEF\u552F\u4E00\u770B\u5F97\u5230\u7684\u300C\u7528\u6237\u4E3A\u4EC0\u4E48\u5173\u300D
5512
5665
  - \`open\`\uFF1A\u6253\u5F00\u53E6\u4E00\u4E2A\u89C6\u56FE\uFF0C\u89C1\u4E0B\u4E00\u8282
5513
5666
  - \u4EFB\u4F55\u8282\u70B9\u52A0 \`action\` \u90FD\u80FD\u70B9\u51FB
5514
5667
  - **\u6BCF\u4E2A\u53EF\u70B9\u51FB\u5143\u7D20\u90FD\u5E94\u8BE5\u914D \`track\`**\uFF0C\u5426\u5219\u6CA1\u6709\u6570\u636E\u53EF\u770B
@@ -5577,7 +5730,7 @@ countdown_end // \u5012\u8BA1\u65F6\u5F52\u96F6
5577
5730
  ] } }
5578
5731
  \`\`\`
5579
5732
 
5580
- \`close\` \u53EA\u901A\u77E5\u5BBF\u4E3B\u300C\u8FD9\u4E00\u6B21\u5173\u4E0D\u5173\u300D\uFF1B\u300C\u4EE5\u540E\u8FD8\u51FA\u4E0D\u51FA\u300D\u7531\u540E\u7AEF\u6309\u4E0A\u62A5\u7684 \`reason\` \u51B3\u5B9A\uFF0C\u6240\u4EE5 \`reason: "user-dismiss"\` \u5C31\u591F\u4E86\uFF0C\u4E0D\u8981\u518D\u914D \`call\`\u3002
5733
+ \`close\` \u53EA\u901A\u77E5\u5BBF\u4E3B\u300C\u8FD9\u4E00\u6B21\u5173\u4E0D\u5173\u300D\uFF1B\`reason\` \u4F1A\u539F\u6837\u4E0A\u62A5\uFF0C\u540E\u7AEF\u636E\u6B64\u5224\u65AD\u300C\u4EE5\u540E\u8FD8\u51FA\u4E0D\u51FA\u300D\u3002\u60F3\u8BA9\u5B83\u5728\u524D\u7AEF\u4E5F\u7ACB\u523B\u4E0D\u518D\u51FA\u73B0\uFF0C\u5728 \`close\` \u4E4B\u524D\u52A0\u4E00\u6761 \`{ "type": "call", "name": "dismissToday" }\`\uFF08\u6216 \`dismissForever\`\uFF09\u3002
5581
5734
  \u6574\u6761\u53EF\u70B9 + \u884C\u672B \xD7 \u4E0D\u4F1A\u51B2\u7A81\uFF1A\u5185\u5C42\u6709\u81EA\u5DF1\u7684 \`action\` \u5C31\u4E0D\u518D\u5192\u6CE1\u7ED9\u5916\u5C42\u3002`;
5582
5735
  }
5583
5736
  function viewsSection() {