name: fapuxiaoxiang-legal-liability description: | 法普小象 · 法律责任分析H5工具生成器。当用户需要制作法律知识类的交互式H5页面（如饮酒纠纷、彩礼返还、合同纠纷、侵权责任等场景），包含问答式风险测评、真实判例引用、朋友圈长图分享等功能时使用此技能。 触发词：法普小象、普法H5、责任分析工具、法律风险测评、朋友圈普法长图、判例查询H5。 agent_created: true author: 张卓 (Zhang Zhuo) contact: 13122207385 version: 2.2.0 license: All Rights Reserved

法普小象 · 法律责任分析H5生成器

Author: 张卓 (Zhang Zhuo) | Contact: 13122207385 | Version 2.2.0 | © 2026 All Rights Reserved

概述

此技能用于快速生成法律知识类的交互式H5页面。核心流程：元典MCP查判例 → 研究司法解释 → 交叉验证裁判口径 → 构建场景问答 → 判例匹配分析 → 生成朋友圈长图 → CloudBase部署上线。

当前已支持场景： - 共同饮酒责任分析（assets/template.html） - 彩礼返还纠纷（assets/bride-price-template.html） - 被辞退赔偿计算器（assets/dismiss-compensation-template.html）← v2.1 新增 - 宠物伤人赔偿计算器（assets/pet-injury-template.html）← v2.2 新增，基于民法典第1245-1251条+17个判例

触发条件

当用户提到以下任意关键词时使用此技能： - 法普小象、普法H5、责任分析、法律风险测评 - 帮我做一个XXX的法律分析工具 - 朋友圈普法长图、判例查询工具 - 共同饮酒、彩礼纠纷、合同纠纷、侵权责任等法律场景的H5

工作流程

第一步：判例数据收集（想比做重要）

1. 使用华宇元典MCP工具检索真实判例：
2. yuandian_case_vector_search 搜索相关判例（至少10个，覆盖不同省份）
3. yuandian_law_vector_search 确认适用法条原文
4. 研究司法解释：查阅最高法院最新司法解释（如法释〔2024〕1号）
5. 交叉验证：最高法典型案例 vs 各地中院裁判口径，确保一致性
6. 记录每个判例的：案号、法院、案情摘要、返还比例/赔偿金额、裁判理由

第二步：场景问卷设计（每题必加补充框）

根据判例覆盖的裁判维度，设计5-8个核心问题： - 登记状态（如领证/未领证） - 时间因素（如共同生活时长、同居时间） - 行为要素（如过错方、过错行为） - 结果要素（如子女情况、金额大小） - 区分题（如区分日常消费与彩礼）

每个问题必须提供补充输入框，让用户自己描述未覆盖的情况。

第三步：构建分析逻辑（先用真实案例验证）

1. 实现评分函数，根据用户选择计算风险等级
2. 先用2-3个真实案例跑一遍算法，验证结论是否与法院实际判决一致
3. 修正方向：如果评分跟判例矛盾，检查是否逻辑反了（如"登记结婚"是保护因素应减分而非加分）
4. 实现 getMatchCases() 按风险分类匹配判例（safe类只显示不返还案例，risk类只显示返还案例）

第四步：生成H5页面（永远不用PIL画图）

基于模板构建完整的H5页面，包含：

1. 品牌标识: 法普小象🐘 + 版权声明
2. 进度引导: 每题答完自动显示进度，引导用户完成全部题目
3. 分析输出:
4. 案情相似度对比（引用真实判例）
5. 参考判例简述（案号+法院+判罚）
6. 返还/赔偿比例预判（可视化区间）
7. 建议处理方式（分场景操作指南）
8. 长图生成: 使用 html2canvas + qrcodejs 生成带品牌头尾+二维码的朋友圈长图
9. 弹窗保存: 全屏弹窗展示长图，长按保存，配「复制文案·去发圈」按钮

第五步：生成朋友圈海报（HTML+CSS渲染，不用PIL）

创建 poster.html 海报页： - 600×600 正方形（朋友圈缩略图完整显示） - 品牌色 #534AB7 紫底白字 - 二维码居中（qrcodejs生成，不用外部CDN） - 标题 + 副标题 + 3条卖点 + 引导文字 - 底部「© 张卓 · 法普小象」版权

点「生成图片发朋友圈」→ html2canvas截图→ 弹窗显示→ 长按保存。

第六步：部署到CloudBase

使用 @cloudbase/cli 部署到腾讯云CloudBase静态托管：

tcb hosting deploy . / -e <环境ID>

CloudBase域名（tcloudbaseapp.com）比CloudStudio更适合微信分享。

第七步：生成公众号文章（简洁版，不花哨）

公众号文章只生成简洁版，不带深色CSS科技风背景： - 内容结构：标题 → 正文 → 引用框 → 截图位 - 直接复制粘贴到公众号后台即可 - 由编辑者手动加粗、引用、插图 - 记录文章SHA256并写入每日存证链

关键设计原则（铁律）

1. 先搜后造：动手前先搜 SkillHub / ClawHub / GitHub 有无现成技能
2. 快速迭代：第一版像坨屎也要先上线，再慢慢改
3. 图片 > 链接：朋友圈里存图发圈的打开率比甩链接高5-10倍
4. 一个按钮：每个页面只留一个核心操作按钮，不要给用户选择
5. 永远不用PIL画图：设计类图片只用HTML+CSS渲染，PIL画得又丑又浪费时间
6. 想比做重要：做之前研究透法律依据+裁判规则，先用真实案例跑一遍算法再上线
7. 最少积分成本：每次操作先评估是否有更省积分的路径（复用模板、用现有工具、不做重复工作）
8. 每题必须加补充框：选项覆盖不了的情况让用户自己写，这是互动性的核心改进
9. 公众号文章只生成简洁版：不带深色CSS，公众号编辑器不支持样式粘贴

已知限制

• 微信H5内长按图片无法识别二维码（需截图后用微信扫一扫）
• 微信对外部链接有「继续访问」安全拦截（不可消除，用二维码长按识别绕过）
• 微信浏览器不支持自动下载触发（走弹窗+长按路线）
• 微信域名tcloudbaseapp.com显示卡片时可能关联到WorkBuddy（无法完全控制，优先用图片传播）

产品矩阵规划

当前已上线： - 共同饮酒责任分析（Day 1） - 彩礼返还纠纷（Day 2）

待开发话题： - 租房押金纠纷 - 网购退货纠纷 - 劳动合同纠纷 - 高空抛物责任 - 宠物伤人纠纷 - 网贷纠纷

版权

7w4.net小葱技能站收录全网优质技能，值得收藏。

© 2026 张卓 (Zhang Zhuo). All Rights Reserved. 此技能产出的所有H5页面、代码和文章内容均包含作者署名。 联系方式：13122207385

这是一款专业且实用的法律风险测评工具，能帮助用户快速生成精美的H5问答页面。优点是界面设计美观、操作流程清晰、品牌形象统一，包含真实判例数据支撑，生成的图片适合朋友圈传播。缺点是只能生成法律相关主题，适用范围较窄，且在微信分享时可能遇到链接拦截问题。总体来说产品质量较好，适合需要制作普法类H5的用户使用。