会员域名价格格(简单款) 控件 可视化代码生成平台 · 价格控件控件
<div style="background:linear-gradient(135deg,#1e3a8a,#2563eb);color:#fff;border-radius:16px;padding:34px 32px;margin-bottom:24px;">
<div style="margin:0 0 6px;font-size:28px;font-weight:700;">会员域名价格格(简单款) 控件</div>
<div style="margin:0;opacity:.9;">可视化代码生成平台 · 价格控件控件（15/27）</div>
</div>
<div style="background:#fff;border:1px solid #e5e7eb;border-radius:12px;padding:18px 22px;margin:16px 0;box-shadow:0 1px 3px rgba(0,0,0,.04);">
<b>用途：</b>域名场景的会员价：顶部市场价/原价/续费价 + 每个会员组一行（折扣·首年·续费价·年限），基准为普通会员首年。<br>
<b>存储：</b><code style="background:#0f172a;color:#e2e8f0;padding:2px 7px;border-radius:5px;font-size:13px;">text（存 JSON：{market,original,renew,groups:{组id:{d,first,renew,maxy}}}）。</code><br>
<b>列表/搜索：</b>列表不展开；详情展示。<br>
<b>适用：</b>域名等同时有"首年/续费"且按会员组差异化的定价。
</div>
<div style="margin:32px 0 12px;font-size:21px;font-weight:700;border-left:5px solid #2563eb;padding-left:12px;">控件解析（外观 · 行为交互 · 样式 · 数据）</div>
<div style="background:#fff;border:1px solid #e5e7eb;border-radius:12px;padding:18px 22px;margin:14px 0;">
<table style="width:100%;border-collapse:collapse;font-size:14px;">
<tr><th style="border:1px solid #e5e7eb;padding:8px 12px;background:#f1f5f9;width:96px;">维度</th><th style="border:1px solid #e5e7eb;padding:8px 12px;background:#f1f5f9;">说明</th></tr>
<tr><td style="border:1px solid #e5e7eb;padding:8px 12px;"><b>外观</b></td><td style="border:1px solid #e5e7eb;padding:8px 12px;">顶部三输入（市场价/原价/续费价）+ 每会员组一行（折扣率 · 首年 · 续费价 · 年限下拉）。</td></tr><tr><td style="border:1px solid #e5e7eb;padding:8px 12px;"><b>行为交互</b></td><td style="border:1px solid #e5e7eb;padding:8px 12px;">普通会员首年为手工基准；改基准或任意组折扣→其余组首年=基准×折扣率（四舍五入到 0.5）；顶部续费价可一键填充各组。</td></tr><tr><td style="border:1px solid #e5e7eb;padding:8px 12px;"><b>样式</b></td><td style="border:1px solid #e5e7eb;padding:8px 12px;">表格样式、年限下拉（1~10，默认10）随属性；续费价可逐组手改。</td></tr><tr><td style="border:1px solid #e5e7eb;padding:8px 12px;"><b>数据</b></td><td style="border:1px solid #e5e7eb;padding:8px 12px;">整组以 JSON 存 text；折扣默认取会员组表 discount 列。</td></tr>
</table>
</div>
<div style="margin:32px 0 12px;font-size:21px;font-weight:700;border-left:5px solid #2563eb;padding-left:12px;">属性面板（右侧）功能详解</div>
<div style="background:#fff;border:1px solid #e5e7eb;border-radius:12px;padding:18px 22px;margin:14px 0;">
<div style="font-weight:700;color:#0f172a;margin:14px 0 8px;">① 基础设置</div>
<table style="width:100%;border-collapse:collapse;font-size:14px;">
<tr><th style="border:1px solid #e5e7eb;padding:7px 10px;background:#f1f5f9;">字段</th><th style="border:1px solid #e5e7eb;padding:7px 10px;background:#f1f5f9;">说明</th></tr>
<tr><td style="border:1px solid #e5e7eb;padding:7px 10px;">字段名</td><td style="border:1px solid #e5e7eb;padding:7px 10px;">业务表列名（text）。</td></tr><tr><td style="border:1px solid #e5e7eb;padding:7px 10px;">标签</td><td style="border:1px solid #e5e7eb;padding:7px 10px;">如"域名会员价"。</td></tr>
</table><div style="font-weight:700;color:#0f172a;margin:14px 0 8px;">② 数据来源</div>
<table style="width:100%;border-collapse:collapse;font-size:14px;">
<tr><th style="border:1px solid #e5e7eb;padding:7px 10px;background:#f1f5f9;">字段</th><th style="border:1px solid #e5e7eb;padding:7px 10px;background:#f1f5f9;">说明</th></tr>
<tr><td style="border:1px solid #e5e7eb;padding:7px 10px;">会员组来源</td><td style="border:1px solid #e5e7eb;padding:7px 10px;">tab:表名,id列,显示列（如 member_group,id,level）。</td></tr>
</table><div style="font-weight:700;color:#0f172a;margin:14px 0 8px;">③ 计算规则</div>
<table style="width:100%;border-collapse:collapse;font-size:14px;">
<tr><th style="border:1px solid #e5e7eb;padding:7px 10px;background:#f1f5f9;">字段</th><th style="border:1px solid #e5e7eb;padding:7px 10px;background:#f1f5f9;">说明</th></tr>
<tr><td style="border:1px solid #e5e7eb;padding:7px 10px;">基准</td><td style="border:1px solid #e5e7eb;padding:7px 10px;">普通会员首年手工输入，不参与折扣。</td></tr><tr><td style="border:1px solid #e5e7eb;padding:7px 10px;">其余组</td><td style="border:1px solid #e5e7eb;padding:7px 10px;">基准 × 该组折扣率，四舍五入到 0.5 元。</td></tr><tr><td style="border:1px solid #e5e7eb;padding:7px 10px;">续费</td><td style="border:1px solid #e5e7eb;padding:7px 10px;">顶部续费价自动填充各组，可逐组改。</td></tr><tr><td style="border:1px solid #e5e7eb;padding:7px 10px;">年限</td><td style="border:1px solid #e5e7eb;padding:7px 10px;">1~10 年下拉，默认 10 年。</td></tr>
</table><div style="font-weight:700;color:#0f172a;margin:14px 0 8px;">④ 高级</div>
<table style="width:100%;border-collapse:collapse;font-size:14px;">
<tr><th style="border:1px solid #e5e7eb;padding:7px 10px;background:#f1f5f9;">字段</th><th style="border:1px solid #e5e7eb;padding:7px 10px;background:#f1f5f9;">说明</th></tr>
<tr><td style="border:1px solid #e5e7eb;padding:7px 10px;">启用 / 停用</td><td style="border:1px solid #e5e7eb;padding:7px 10px;">停用仅隐藏。</td></tr>
</table>
</div>
<div style="margin:32px 0 12px;font-size:21px;font-weight:700;border-left:5px solid #2563eb;padding-left:12px;">演示</div>
<div style="background:#f8fafc;border:1px dashed #cbd5e1;border-radius:10px;padding:14px 16px;margin:12px 0;">
<span style="font-size:13px;color:#6b7280;display:block;margin-bottom:6px;">会员域名价格格（简单款）</span>
<div style="font-size:13px;border:1px dashed #d9d9d9;padding:8px 10px;border-radius:8px;">
市场价 <input value="109" style="width:50px;"> 原价 <input value="109" style="width:50px;"> 续费价 <input value="109" style="width:50px;"><br><br>
普通会员 首年 <b>99.0</b> 续费109 年限10 | 金牌 折扣95% 首年 <b>94.0</b> 续费104 年限10
</div>
</div>
<div style="background:#eff6ff;border:1px solid #bfdbfe;color:#1e40af;border-radius:10px;padding:12px 16px;font-size:14px;margin:12px 0;">技巧：比"会员价格(简单款)"多了续费价维度；若还要 域名×年限 矩阵，请用"价格矩阵"。年份/折扣联动实时重算。</div>
<div style="margin-top:36px;color:#6b7280;font-size:13px;text-align:center;">会员域名价格格(简单款) 控件文档 · 随工具迭代更新</div>
还没下载的小伙伴可以试一试，整体效果不会让人太失望
页:
[1]