gpttemp

2025-12-31 00:49:32 +08:00
parent ae57b68f99
commit eb8c097777
709 changed files with 39727 additions and 1041 deletions
--- a/code/app/home/view/videoGpt1/module/detail_main/action.html
+++ b/code/app/home/view/videoGpt1/module/detail_main/action.html
@@ -0,0 +1,111 @@
+{// ===================== Action Variants ===================== }
+
+{if $variant == 0}
+<div class="{$TpStyle.dom_prefix}-dm-action v0">
+    <a href='{site:vpurl v_id="$arrVideo.v_id" v_py="$arrVideo.v_name_en" play_type="default" play_index="1" /}'>立即播放</a>
+</div>
+
+{elseif $variant == 1}
+<div class="{$TpStyle.dom_prefix}-dm-action v1">
+    <a href='{site:vpurl v_id="$arrVideo.v_id" v_py="$arrVideo.v_name_en" play_type="default" play_index="1" /}'>在线播放</a>
+    <span>无需安装</span>
+</div>
+
+{elseif $variant == 2}
+<nav class="{$TpStyle.dom_prefix}-dm-action v2">
+    <a href='{site:vpurl v_id="$arrVideo.v_id" v_py="$arrVideo.v_name_en" play_type="default" play_index="1" /}'>▶ 播放</a>
+    <a href="#desc">剧情</a>
+</nav>
+
+{elseif $variant == 3}
+<ul class="{$TpStyle.dom_prefix}-dm-action v3">
+    <li><a href='{site:vpurl v_id="$arrVideo.v_id" v_py="$arrVideo.v_name_en" play_type="default" play_index="1" /}'>高清</a></li>
+    <li><a href='{site:vpurl v_id="$arrVideo.v_id" v_py="$arrVideo.v_name_en" play_type="default" play_index="1" /}'>免费</a></li>
+</ul>
+
+{elseif $variant == 4}
+<div class="{$TpStyle.dom_prefix}-dm-action v4">
+    <button onclick="location.href='{$playUrl}'">立即观看</button>
+</div>
+
+{elseif $variant == 5}
+<div class="{$TpStyle.dom_prefix}-dm-action v5">
+    <a href='{site:vpurl v_id="$arrVideo.v_id" v_py="$arrVideo.v_name_en" play_type="default" play_index="1" /}'>{$arrVideo.v_name} 在线观看</a>
+</div>
+
+{elseif $variant == 6}
+<footer class="{$TpStyle.dom_prefix}-dm-action v6">
+    <a href='{site:vpurl v_id="$arrVideo.v_id" v_py="$arrVideo.v_name_en" play_type="default" play_index="1" /}'>开始播放</a>
+</footer>
+
+{elseif $variant == 7}
+<section class="{$TpStyle.dom_prefix}-dm-action v7">
+    <a href='{site:vpurl v_id="$arrVideo.v_id" v_py="$arrVideo.v_name_en" play_type="default" play_index="1" /}'>免费观看</a>
+    <small>高清资源</small>
+</section>
+
+{elseif $variant == 8}
+<div class="{$TpStyle.dom_prefix}-dm-action v8">
+    <a href='{site:vpurl v_id="$arrVideo.v_id" v_py="$arrVideo.v_name_en" play_type="default" play_index="1" /}'>播放正片</a>
+</div>
+
+{elseif $variant == 9}
+<div class="{$TpStyle.dom_prefix}-dm-action v9">
+    <a href='{site:vpurl v_id="$arrVideo.v_id" v_py="$arrVideo.v_name_en" play_type="default" play_index="1" /}'>立即观看 {$arrVideo.v_name}</a>
+</div>
+
+{elseif $variant == 10}
+<div class="{$TpStyle.dom_prefix}-dm-action v10">
+    <a href='{site:vpurl v_id="$arrVideo.v_id" v_py="$arrVideo.v_name_en" play_type="default" play_index="1" /}'>在线播放 · 高清</a>
+</div>
+
+{elseif $variant == 11}
+<div class="{$TpStyle.dom_prefix}-dm-action v11">
+    <a href='{site:vpurl v_id="$arrVideo.v_id" v_py="$arrVideo.v_name_en" play_type="default" play_index="1" /}'>点击播放</a>
+    <span>支持多线路</span>
+</div>
+
+{elseif $variant == 12}
+<nav class="{$TpStyle.dom_prefix}-dm-action v12">
+    <a href='{site:vpurl v_id="$arrVideo.v_id" v_py="$arrVideo.v_name_en" play_type="default" play_index="1" /}'>播放</a>
+    <a href='{site:vpurl v_id="$arrVideo.v_id" v_py="$arrVideo.v_name_en" play_type="default" play_index="1" /}'>下载</a>
+</nav>
+
+{elseif $variant == 13}
+<div class="{$TpStyle.dom_prefix}-dm-action v13">
+    <a href='{site:vpurl v_id="$arrVideo.v_id" v_py="$arrVideo.v_name_en" play_type="default" play_index="1" /}'>▶</a>
+</div>
+
+{elseif $variant == 14}
+<div class="{$TpStyle.dom_prefix}-dm-action v14">
+    <a href='{site:vpurl v_id="$arrVideo.v_id" v_py="$arrVideo.v_name_en" play_type="default" play_index="1" /}'>{$arrVideo.v_name} 免费看</a>
+</div>
+
+{elseif $variant == 15}
+<aside class="{$TpStyle.dom_prefix}-dm-action v15">
+    <a href='{site:vpurl v_id="$arrVideo.v_id" v_py="$arrVideo.v_name_en" play_type="default" play_index="1" /}'>立即播放</a>
+</aside>
+
+{elseif $variant == 16}
+<div class="{$TpStyle.dom_prefix}-dm-action v16"
+     data-action="play">
+    <a href='{site:vpurl v_id="$arrVideo.v_id" v_py="$arrVideo.v_name_en" play_type="default" play_index="1" /}'>播放影片</a>
+</div>
+
+{elseif $variant == 17}
+<div class="{$TpStyle.dom_prefix}-dm-action v17">
+    <a href='{site:vpurl v_id="$arrVideo.v_id" v_py="$arrVideo.v_name_en" play_type="default" play_index="1" /}'>高清播放</a>
+    <em>无需登录</em>
+</div>
+
+{elseif $variant == 18}
+<section class="{$TpStyle.dom_prefix}-dm-action v18">
+    <a href='{site:vpurl v_id="$arrVideo.v_id" v_py="$arrVideo.v_name_en" play_type="default" play_index="1" /}'>在线观看</a>
+</section>
+
+{elseif $variant == 19}
+<footer class="{$TpStyle.dom_prefix}-dm-action v19">
+    <a href='{site:vpurl v_id="$arrVideo.v_id" v_py="$arrVideo.v_name_en" play_type="default" play_index="1" /}'>马上播放</a>
+</footer>
+
+{/if}
--- a/code/app/home/view/videoGpt1/module/detail_main/cover.html
+++ b/code/app/home/view/videoGpt1/module/detail_main/cover.html
@@ -0,0 +1,152 @@
+{//  ===================== Cover Variants ===================== }
+
+{if $variant == 0}
+<div class="{$TpStyle.dom_prefix}-dm-cover v0">
+    <img class="{$TpStyle.dom_prefix}-dm-cover-img"
+         src="{site:cfg code='PUBLIC_COVER_DOMAIN' encode='false'/}{$arrVideo.v_pic}"
+         alt="{$arrVideo.v_name}">
+</div>
+
+{elseif $variant == 1}
+<figure class="{$TpStyle.dom_prefix}-dm-cover v1">
+    <img class="{$TpStyle.dom_prefix}-dm-cover-img"
+         src="{site:cfg code='PUBLIC_COVER_DOMAIN' encode='false'/}{$arrVideo.v_pic}"
+         alt="{$arrVideo.v_name}">
+    <figcaption class="{$TpStyle.dom_prefix}-dm-cover-cap">
+        {$arrVideo.v_remarks}
+    </figcaption>
+</figure>
+
+{elseif $variant == 2}
+<a class="{$TpStyle.dom_prefix}-dm-cover v2"
+   href='{site:vpurl v_id="$arrVideo.v_id" v_py="$arrVideo.v_name_en" play_type="default" play_index="1" /}'>
+    <img class="{$TpStyle.dom_prefix}-dm-cover-img"
+         src="{site:cfg code='PUBLIC_COVER_DOMAIN' encode='false'/}{$arrVideo.v_pic}"
+         alt="{$arrVideo.v_name}">
+</a>
+
+{elseif $variant == 3}
+<div class="{$TpStyle.dom_prefix}-dm-cover v3">
+    <div class="{$TpStyle.dom_prefix}-dm-cover-bg"
+         data-bg="{site:cfg code='PUBLIC_COVER_DOMAIN' encode='false'/}{$arrVideo.v_pic}"></div>
+</div>
+
+{elseif $variant == 4}
+<div class="{$TpStyle.dom_prefix}-dm-cover v4">
+    <img class="{$TpStyle.dom_prefix}-dm-cover-img"
+         src="{site:cfg code='PUBLIC_COVER_DOMAIN' encode='false'/}{$arrVideo.v_pic}">
+    <span class="{$TpStyle.dom_prefix}-dm-cover-badge">
+        {$arrVideo.v_year}
+    </span>
+</div>
+
+{elseif $variant == 5}
+<div class="{$TpStyle.dom_prefix}-dm-cover v5">
+    <img class="{$TpStyle.dom_prefix}-dm-cover-img"
+         src="{site:cfg code='PUBLIC_COVER_DOMAIN' encode='false'/}{$arrVideo.v_pic}">
+    <span class="{$TpStyle.dom_prefix}-dm-cover-score">
+        {$arrVideo.v_score}
+    </span>
+</div>
+
+{elseif $variant == 6}
+<section class="{$TpStyle.dom_prefix}-dm-cover v6">
+    <div class="{$TpStyle.dom_prefix}-dm-cover-bg"
+         data-bg="{site:cfg code='PUBLIC_COVER_DOMAIN' encode='false'/}{$arrVideo.v_pic}"></div>
+    <span class="{$TpStyle.dom_prefix}-dm-cover-play"></span>
+</section>
+
+{elseif $variant == 7}
+<article class="{$TpStyle.dom_prefix}-dm-cover v7">
+    <img class="{$TpStyle.dom_prefix}-dm-cover-img"
+         src="{site:cfg code='PUBLIC_COVER_DOMAIN' encode='false'/}{$arrVideo.v_pic}">
+</article>
+
+{elseif $variant == 8}
+<div class="{$TpStyle.dom_prefix}-dm-cover v8">
+    <picture class="{$TpStyle.dom_prefix}-dm-cover-pic">
+        <img class="{$TpStyle.dom_prefix}-dm-cover-img"
+             src="{site:cfg code='PUBLIC_COVER_DOMAIN' encode='false'/}{$arrVideo.v_pic}">
+    </picture>
+</div>
+
+{elseif $variant == 9}
+<div class="{$TpStyle.dom_prefix}-dm-cover v9">
+    <img class="{$TpStyle.dom_prefix}-dm-cover-img"
+         src="{site:cfg code='PUBLIC_COVER_DOMAIN' encode='false'/}{$arrVideo.v_pic}">
+    <span class="{$TpStyle.dom_prefix}-dm-cover-remark">
+        {$arrVideo.v_remarks}
+    </span>
+</div>
+
+{elseif $variant == 10}
+<div class="{$TpStyle.dom_prefix}-dm-cover v10">
+    <div class="{$TpStyle.dom_prefix}-dm-cover-bg"
+         data-bg="{site:cfg code='PUBLIC_COVER_DOMAIN' encode='false'/}{$arrVideo.v_pic}"></div>
+    <span class="{$TpStyle.dom_prefix}-dm-cover-tag">HD</span>
+</div>
+
+{elseif $variant == 11}
+<a class="{$TpStyle.dom_prefix}-dm-cover v11"
+   href='{site:vpurl v_id="$arrVideo.v_id" v_py="$arrVideo.v_name_en" play_type="default" play_index="1" /}'>
+    <div class="{$TpStyle.dom_prefix}-dm-cover-bg"
+         data-bg="{site:cfg code='PUBLIC_COVER_DOMAIN' encode='false'/}{$arrVideo.v_pic}"></div>
+</a>
+
+{elseif $variant == 12}
+<div class="{$TpStyle.dom_prefix}-dm-cover v12">
+    <img class="{$TpStyle.dom_prefix}-dm-cover-img"
+         src="{site:cfg code='PUBLIC_COVER_DOMAIN' encode='false'/}{$arrVideo.v_pic}">
+    <span class="{$TpStyle.dom_prefix}-dm-cover-top">更新中</span>
+</div>
+
+{elseif $variant == 13}
+<div class="{$TpStyle.dom_prefix}-dm-cover v13">
+    <img class="{$TpStyle.dom_prefix}-dm-cover-img"
+         src="{site:cfg code='PUBLIC_COVER_DOMAIN' encode='false'/}{$arrVideo.v_pic}">
+    <span class="{$TpStyle.dom_prefix}-dm-cover-corner"></span>
+</div>
+
+{elseif $variant == 14}
+<div class="{$TpStyle.dom_prefix}-dm-cover v14">
+    <div class="{$TpStyle.dom_prefix}-dm-cover-bg"
+         data-bg="{site:cfg code='PUBLIC_COVER_DOMAIN' encode='false'/}{$arrVideo.v_pic}"></div>
+    <span class="{$TpStyle.dom_prefix}-dm-cover-year">
+        {$arrVideo.v_year}
+    </span>
+</div>
+
+{elseif $variant == 15}
+<div class="{$TpStyle.dom_prefix}-dm-cover v15">
+    <img class="{$TpStyle.dom_prefix}-dm-cover-img"
+         src="{site:cfg code='PUBLIC_COVER_DOMAIN' encode='false'/}{$arrVideo.v_pic}">
+    <span class="{$TpStyle.dom_prefix}-dm-cover-free">
+        免费
+    </span>
+</div>
+
+{elseif $variant == 16}
+<div class="{$TpStyle.dom_prefix}-dm-cover v16">
+    <img class="{$TpStyle.dom_prefix}-dm-cover-img"
+         src="{site:cfg code='PUBLIC_COVER_DOMAIN' encode='false'/}{$arrVideo.v_pic}">
+    <span class="{$TpStyle.dom_prefix}-dm-cover-mask"></span>
+</div>
+
+{elseif $variant == 17}
+<aside class="{$TpStyle.dom_prefix}-dm-cover v17">
+    <img class="{$TpStyle.dom_prefix}-dm-cover-img"
+         src="{site:cfg code='PUBLIC_COVER_DOMAIN' encode='false'/}{$arrVideo.v_pic}">
+</aside>
+
+{elseif $variant == 18}
+<div class="{$TpStyle.dom_prefix}-dm-cover v18"
+     data-cover="{site:cfg code='PUBLIC_COVER_DOMAIN' encode='false'/}{$arrVideo.v_pic}">
+</div>
+
+{elseif $variant == 19}
+<section class="{$TpStyle.dom_prefix}-dm-cover v19">
+    <img class="{$TpStyle.dom_prefix}-dm-cover-img"
+         src="{site:cfg code='PUBLIC_COVER_DOMAIN' encode='false'/}{$arrVideo.v_pic}">
+</section>
+
+{/if}
--- a/code/app/home/view/videoGpt1/module/detail_main/desc.html
+++ b/code/app/home/view/videoGpt1/module/detail_main/desc.html
@@ -0,0 +1,134 @@
+{// ===================== Desc Variants ===================== }
+
+{if $variant == 0}
+<p class="{$TpStyle.dom_prefix}-dm-desc v0">
+    {$arrVideo.v_description}
+</p>
+
+{elseif $variant == 1}
+<div class="{$TpStyle.dom_prefix}-dm-desc v1">
+    <p>{$arrVideo.v_description|mb_substr=0,120}</p>
+</div>
+
+{elseif $variant == 2}
+<section class="{$TpStyle.dom_prefix}-dm-desc v2">
+    <p>{$arrVideo.v_description|mb_substr=0,200}</p>
+</section>
+
+{elseif $variant == 3}
+<article class="{$TpStyle.dom_prefix}-dm-desc v3">
+    <p>{$arrVideo.v_description}</p>
+</article>
+
+{elseif $variant == 4}
+<div class="{$TpStyle.dom_prefix}-dm-desc v4">
+    <p>
+        剧情简介：{$arrVideo.v_description|mb_substr=0,150}
+    </p>
+</div>
+
+{elseif $variant == 5}
+<details class="{$TpStyle.dom_prefix}-dm-desc v5">
+    <summary>剧情介绍</summary>
+    <p>{$arrVideo.v_description}</p>
+</details>
+
+{elseif $variant == 6}
+<div class="{$TpStyle.dom_prefix}-dm-desc v6">
+    <p>{$arrVideo.v_description|mb_substr=0,100}...</p>
+    <a href="#desc">查看详情</a>
+</div>
+
+{elseif $variant == 7}
+<section class="{$TpStyle.dom_prefix}-dm-desc v7">
+    <header>影片简介</header>
+    <p>{$arrVideo.v_description|mb_substr=0,180}</p>
+</section>
+
+{elseif $variant == 8}
+<div class="{$TpStyle.dom_prefix}-dm-desc v8">
+    <blockquote>
+        {$arrVideo.v_description|mb_substr=0,160}
+    </blockquote>
+</div>
+
+{elseif $variant == 9}
+<p class="{$TpStyle.dom_prefix}-dm-desc v9">
+    {$arrVideo.v_name}（{$arrVideo.v_year}）剧情：
+    {$arrVideo.v_description|mb_substr=0,140}
+</p>
+
+{elseif $variant == 10}
+<div class="{$TpStyle.dom_prefix}-dm-desc v10">
+    <p itemprop="description">
+        {$arrVideo.v_description|mb_substr=0,160}
+    </p>
+</div>
+
+{elseif $variant == 11}
+<div class="{$TpStyle.dom_prefix}-dm-desc v11"
+     data-desc="{$arrVideo.v_description|mb_substr=0,200}">
+    <p>{$arrVideo.v_description|mb_substr=0,120}</p>
+</div>
+
+{elseif $variant == 12}
+<section class="{$TpStyle.dom_prefix}-dm-desc v12">
+    <p>
+        {$arrVideo.v_description|mb_substr=0,100}
+        <span class="{$TpStyle.dom_prefix}-dm-desc-more">
+            {$arrVideo.v_name} 在线观看
+        </span>
+    </p>
+</section>
+
+{elseif $variant == 13}
+<div class="{$TpStyle.dom_prefix}-dm-desc v13">
+    <p>
+        {$arrVideo.v_description|mb_substr=0,130}
+        高清完整版内容介绍。
+    </p>
+</div>
+
+{elseif $variant == 14}
+<div class="{$TpStyle.dom_prefix}-dm-desc v14">
+    <p>
+        {$arrVideo.v_description|mb_substr=0,150}
+    </p>
+    <p class="{$TpStyle.dom_prefix}-dm-desc-note">
+        本片支持在线播放
+    </p>
+</div>
+
+{elseif $variant == 15}
+<p class="{$TpStyle.dom_prefix}-dm-desc v15">
+    {$arrVideo.v_description|mb_substr=0,120}
+    免费观看{$arrVideo.v_name}
+</p>
+
+{elseif $variant == 16}
+<div class="{$TpStyle.dom_prefix}-dm-desc v16">
+    <p>
+        <strong>{$arrVideo.v_name}</strong>
+        {$arrVideo.v_description|mb_substr=0,140}
+    </p>
+</div>
+
+{elseif $variant == 17}
+<section class="{$TpStyle.dom_prefix}-dm-desc v17">
+    <p>{$arrVideo.v_description|mb_substr=0,180}</p>
+</section>
+
+{elseif $variant == 18}
+<div class="{$TpStyle.dom_prefix}-dm-desc v18">
+    <p class="{$TpStyle.dom_prefix}-dm-desc-hidden">
+        {$arrVideo.v_description}
+    </p>
+</div>
+
+{elseif $variant == 19}
+<article class="{$TpStyle.dom_prefix}-dm-desc v19">
+    <header>剧情简介</header>
+    <p>{$arrVideo.v_description|mb_substr=0,160}</p>
+</article>
+
+{/if}
--- a/code/app/home/view/videoGpt1/module/detail_main/detail_main_router.html
+++ b/code/app/home/view/videoGpt1/module/detail_main/detail_main_router.html
@@ -0,0 +1,15 @@
+{switch $pageCfg.detail_main.layout}
+
+{case value="A"}
+    {include file="module/detail_main/layout/layout_A" /}
+{/case}
+
+{case value="B"}
+    {include file="module/detail_main/layout/layout_B" /}
+{/case}
+
+{case value="C"}
+    {include file="module/detail_main/layout/layout_C" /}
+{/case}
+
+{/switch}
--- a/code/app/home/view/videoGpt1/module/detail_main/detail_main_router.md
+++ b/code/app/home/view/videoGpt1/module/detail_main/detail_main_router.md
@@ -0,0 +1,32 @@
+
+    A 改成 ：
+    h5
+    顶部  cover 1/3 居中显示，pc 有个最大尺寸，不要太大，不然封面霸屏了  
+    中间: 居中展示 :title  meta    
+    下面  居中展示 action ;
+    pc: 
+     左边 cover
+     右边 title  meta  action desc
+
+     ┌───────────────────────────────┐
+│           cover               │   ← 主视觉（居中，不霸屏）
+├───────────────────────────────┤
+│ title | meta | action         │   ← 信息一行阅读
+├───────────────────────────────┤
+│              desc             │   ← 内容阅读区
+└───────────────────────────────┘
+
+    
+    B 改成 ：
+    顶部  左边cover 1/3  ；右边: title  meta    action
+    下面 desc
+
+    c 改成 ：
+    顶部 title 
+    中间 左边cover 1/3  ；右边: meta    action
+    下面 desc
+
+
+    注意 ：
+    thinkphp 视图 注释  {// ===== Top：Title ===== }
+    然后 所有html的 class 请加seed 前缀 {$TpStyle.dom_prefix}-
--- a/code/app/home/view/videoGpt1/module/detail_main/index.md
+++ b/code/app/home/view/videoGpt1/module/detail_main/index.md
@@ -0,0 +1,268 @@
+好，确认你选的是 **方案 1：给你「5 个模块 × 每个 20 套的【具体 HTML 设计清单】」**。
+下面我**不写完整代码**，而是给你 **可以直接照着写的结构设计说明**，每一套都**明确“差异点在哪”**，这样你写的时候不会重复、不会越界，也不会把自己绕晕。
+
+> 目标只有一个：
+> **F12 看起来不一样 + SEO 结构不一样 + 长期好维护**
+
+---
+
+# 一、Title 模块（20 套设计清单）
+好，这里我一次性给你可直接上线用的完整版本，不再讲概念。
+
+你要的是：
+
+✅ title 模块
+
+✅ 1 个文件内 20 套 HTML
+
+✅ 配套 CSS
+
+✅ CSS 全部走类名
+
+✅ 用 seed / dom_prefix 做前缀，天然差异化
+
+✅ 后续加标签不需要动 CSS
+
+下面内容你可以 直接复制进项目。
+
+一、Title 模块 HTML（1 个文件 / 20 套）
+
+文件路径：
+
+module/detail_main/title.html
+
+约定
+
+$variant：0–19
+
+$TpStyle.dom_prefix：seed 前缀
+
+$arrVideo：视频数据
+> 变化维度：
+> **标签语义 / 层级 / 强弱 / 附加信息**
+
+### Title 01–05（标准标题系）
+
+1. `h1` 单行标题
+2. `h1 + small(year)`
+3. `h2 + strong`
+4. `h1` 带引号《》
+5. `h1` + `sup`（HD / 完结）
+
+### Title 06–10（语义包裹系）
+
+6. `header > h1`
+7. `div.title > h1`
+8. `figure > figcaption > h1`
+9. `section > h1 + p.sub`
+10. `article > h1`
+
+### Title 11–15（强调变化系）
+
+11. `h1 > strong`
+12. `h1 > em`
+13. `h2 + span.tag(年份)`
+14. `h1 + span.score`
+15. `h1 + i.icon`
+
+### Title 16–20（SEO 扩展系）
+
+16. `h1` + “在线观看”文案
+17. `h1` + “免费高清完整版”
+18. `h1 + meta(itemprop=name)`
+19. `h1` + `data-title` 属性
+20. `h1` + 隐藏 `span`（SEO）
+
+---
+
+# 二、Cover 模块（20 套设计清单）
+
+> 变化维度：
+> **img / bg / 容器语义 / 角标 / 交互**
+
+### Cover 01–05（基础封面）
+
+1. `div > img`
+2. `figure > img`
+3. `a > img`（可点击）
+4. `div.cover > img + badge`
+5. `div.cover > img + score`
+
+### Cover 06–10（背景图系）
+
+6. `div.bg` + inline background
+7. `div.bg` + 渐变遮罩
+8. `section.bg`
+9. `figure.bg + figcaption`
+10. `a.bg`（跳播放）
+
+### Cover 11–15（信息叠加系）
+
+11. 封面右下角年份
+12. 封面左上角“更新中”
+13. hover 显示播放 icon
+14. hover 显示标题
+15. 叠加评分条
+
+### Cover 16–20（比例 / 结构差异）
+
+16. 2:3 比例容器
+17. 1:1 比例容器
+18. 3:4 比例容器
+19. picture / source 结构
+20. img + noscript（SEO）
+
+---
+
+# 三、Meta 模块（20 套设计清单）
+
+> 变化维度：
+> **结构标签 / 字段顺序 / 展示密度**
+
+### Meta 01–05（列表系）
+
+1. `ul > li`（类型 / 年份 / 地区）
+2. `ol > li`
+3. `ul.inline`
+4. `ul + icon`
+5. `ul + span.label`
+
+### Meta 06–10（定义列表）
+
+6. `dl > dt/dd`
+7. `dl.horizontal`
+8. `dl` + data-*
+9. `dl` + microdata
+10. `dl` 精简版（2 项）
+
+### Meta 11–15（行内文本）
+
+11. `p` 用 `|` 分隔
+12. `p` 用 `·` 分隔
+13. `span.meta-item`
+14. `small.meta`
+15. `p` + `time`
+
+### Meta 16–20（SEO 结构）
+
+16. `table`（2 行）
+17. `div.meta-grid`
+18. `meta itemprop`
+19. `data-year / data-area`
+20. 隐藏 meta（SEO）
+
+---
+
+# 四、Desc 模块（20 套设计清单）
+
+> 变化维度：
+> **内容长度 / 展示方式 / 语义标签**
+
+### Desc 01–05（直出文本）
+
+1. `p` 全文
+2. `p` 截断 120 字
+3. `p` 截断 200 字
+4. `div` 全文
+5. `section > p`
+
+### Desc 06–10（可展开）
+
+6. `details > summary`
+7. `div + “展开更多”`
+8. `p + a(#desc)`
+9. `section + toggle`
+10. `article + footer`
+
+### Desc 11–15（SEO 改写）
+
+11. 标准简介 + 年份
+12. 加“在线观看”关键词
+13. 加“高清资源”
+14. 加“剧情介绍”前缀
+15. 半伪原创句式
+
+### Desc 16–20（语义增强）
+
+16. `article`
+17. `blockquote`
+18. `p itemprop=description`
+19. `div data-desc`
+20. 隐藏长描述（SEO）
+
+---
+
+# 五、Action 模块（20 套设计清单）
+
+> 变化维度：
+> **交互形式 / 文案 / 结构**
+
+### Action 01–05（按钮）
+
+1. 单按钮「立即播放」
+2. 单按钮「在线观看」
+3. button 标签
+4. a.btn 标签
+5. 带 icon 的按钮
+
+### Action 06–10（导航）
+
+6. `nav > a`（播放 / 剧情）
+7. `ul > li > a`
+8. 横向按钮组
+9. 垂直按钮组
+10. sticky action
+
+### Action 11–15（强化转化）
+
+11. 播放 + “无需安装”
+12. 播放 + “高清”
+13. 播放 + “免费”
+14. 播放 + “推荐”
+15. 播放 + 提示文本
+
+### Action 16–20（结构差异）
+
+16. `section.action`
+17. `footer.action`
+18. `div.action`
+19. `aside.action`
+20. data-action 结构
+
+---
+
+# 六、你写的时候只需要记住 3 条铁律
+
+1. **一个模块 = 一个文件**
+2. **一个文件 = 20 个 `{if $variant == N}`**
+3. **每个 variant = 完整、真实、能独立存在的 HTML**
+
+不需要：
+
+* 原子
+* 组合器
+* cfg 兜底
+* 复杂判断
+
+---
+
+# 七、最终工程评价（实话）
+
+你现在这个方案：
+
+* ✔ **复杂度最低**
+* ✔ **差异化足够大**
+* ✔ **和 item 体系统一**
+* ✔ **最适合 InCloud**
+* ✔ **3 年内不用重构**
+
+这是**站群工程里的“终态方案”**。
+
+---
+
+如果你下一步想要，我可以：
+
+* **直接帮你把某一个模块（比如 title 或 action）的 20 套 HTML 全部写出来**
+* 或 **帮你设计「播放页 Player」用同一套路**
+
+你一句话说哪个模块，我直接给你 **完整 20 套可复制代码**。
--- a/code/app/home/view/videoGpt1/module/detail_main/layout/layout_A.html
+++ b/code/app/home/view/videoGpt1/module/detail_main/layout/layout_A.html
@@ -0,0 +1,27 @@
+<section class="{$TpStyle.dom_prefix}-dm-root {$TpStyle.dom_prefix}-layout-a">
+
+    {// ===== Top：Cover ===== }
+    <div class="{$TpStyle.dom_prefix}-dm-row {$TpStyle.dom_prefix}-dm-row-cover">
+        {assign name="variant" value="$pageCfg.detail_main.cover"}
+        {include file="module/detail_main/cover" /}
+    </div>
+
+    {// ===== Middle：Title + Meta + Action ===== }
+    <div class="{$TpStyle.dom_prefix}-dm-row {$TpStyle.dom_prefix}-dm-row-info">
+        {assign name="variant" value="$pageCfg.detail_main.title"}
+        {include file="module/detail_main/title" /}
+
+        {assign name="variant" value="$pageCfg.detail_main.meta"}
+        {include file="module/detail_main/meta" /}
+
+        {assign name="variant" value="$pageCfg.detail_main.action"}
+        {include file="module/detail_main/action" /}
+    </div>
+
+    {// ===== Bottom：Desc ===== }
+    <div class="{$TpStyle.dom_prefix}-dm-row {$TpStyle.dom_prefix}-dm-row-desc">
+        {assign name="variant" value="$pageCfg.detail_main.desc"}
+        {include file="module/detail_main/desc" /}
+    </div>
+
+</section>
--- a/code/app/home/view/videoGpt1/module/detail_main/layout/layout_B.html
+++ b/code/app/home/view/videoGpt1/module/detail_main/layout/layout_B.html
@@ -0,0 +1,30 @@
+<section class="{$TpStyle.dom_prefix}-dm-root {$TpStyle.dom_prefix}-layout-B">
+
+    {// ===== Top：Cover + Info ===== }
+    <div class="{$TpStyle.dom_prefix}-dm-row {$TpStyle.dom_prefix}-dm-row-top">
+
+        <div class="{$TpStyle.dom_prefix}-dm-col {$TpStyle.dom_prefix}-dm-col-cover">
+            {assign name="variant" value="$pageCfg.detail_main.cover"}
+            {include file="module/detail_main/cover" /}
+        </div>
+
+        <div class="{$TpStyle.dom_prefix}-dm-col {$TpStyle.dom_prefix}-dm-col-info">
+            {assign name="variant" value="$pageCfg.detail_main.title"}
+            {include file="module/detail_main/title" /}
+
+            {assign name="variant" value="$pageCfg.detail_main.meta"}
+            {include file="module/detail_main/meta" /}
+
+            {assign name="variant" value="$pageCfg.detail_main.action"}
+            {include file="module/detail_main/action" /}
+        </div>
+
+    </div>
+
+    {// ===== Bottom：Desc ===== }
+    <div class="{$TpStyle.dom_prefix}-dm-row {$TpStyle.dom_prefix}-dm-row-bottom">
+        {assign name="variant" value="$pageCfg.detail_main.desc"}
+        {include file="module/detail_main/desc" /}
+    </div>
+
+</section>
--- a/code/app/home/view/videoGpt1/module/detail_main/layout/layout_C.html
+++ b/code/app/home/view/videoGpt1/module/detail_main/layout/layout_C.html
@@ -0,0 +1,33 @@
+<section class="{$TpStyle.dom_prefix}-dm-root {$TpStyle.dom_prefix}-layout-C">
+
+    {// ===== Top：Title ===== }
+    <div class="{$TpStyle.dom_prefix}-dm-row {$TpStyle.dom_prefix}-dm-row-top">
+        {assign name="variant" value="$pageCfg.detail_main.title"}
+        {include file="module/detail_main/title" /}
+    </div>
+
+    {// ===== Middle：Cover + Meta / Action ===== }
+    <div class="{$TpStyle.dom_prefix}-dm-row {$TpStyle.dom_prefix}-dm-row-middle">
+
+        <div class="{$TpStyle.dom_prefix}-dm-col {$TpStyle.dom_prefix}-dm-col-cover">
+            {assign name="variant" value="$pageCfg.detail_main.cover"}
+            {include file="module/detail_main/cover" /}
+        </div>
+
+        <div class="{$TpStyle.dom_prefix}-dm-col {$TpStyle.dom_prefix}-dm-col-info">
+            {assign name="variant" value="$pageCfg.detail_main.meta"}
+            {include file="module/detail_main/meta" /}
+
+            {assign name="variant" value="$pageCfg.detail_main.action"}
+            {include file="module/detail_main/action" /}
+        </div>
+
+    </div>
+
+    {// ===== Bottom：Desc ===== }
+    <div class="{$TpStyle.dom_prefix}-dm-row {$TpStyle.dom_prefix}-dm-row-bottom">
+        {assign name="variant" value="$pageCfg.detail_main.desc"}
+        {include file="module/detail_main/desc" /}
+    </div>
+
+</section>
--- a/code/app/home/view/videoGpt1/module/detail_main/meta.html
+++ b/code/app/home/view/videoGpt1/module/detail_main/meta.html
@@ -0,0 +1,222 @@
+{// ===================== Meta Variants (Array-aware, no i_last) ===================== }
+
+{// 预计算长度（避免 i_last） }
+{assign name="len_area" value="is_array($arrVideo.v_area)?count($arrVideo.v_area):0"}
+{assign name="len_actor" value="is_array($arrVideo.v_actor)?count($arrVideo.v_actor):0"}
+{assign name="len_director" value="is_array($arrVideo.v_director)?count($arrVideo.v_director):0"}
+{assign name="len_lang" value="is_array($arrVideo.v_lang)?count($arrVideo.v_lang):0"}
+
+{if $variant == 0}
+<ul class="{$TpStyle.dom_prefix}-dm-meta v0">
+    <li>年份：{$arrVideo.v_year}</li>
+    <li>
+        地区：
+        {volist name="arrVideo.v_area" id="vo" key="k"}
+            {$vo}{if $k < $len_area} / {/if}
+        {/volist}
+    </li>
+    <li>类型：{$arrVideo.v_category}</li>
+</ul>
+
+{elseif $variant == 1}
+<p class="{$TpStyle.dom_prefix}-dm-meta v1">
+    {$arrVideo.v_year} ·
+    {volist name="arrVideo.v_area" id="vo" key="k"}
+        {$vo}{if $k < $len_area} · {/if}
+    {/volist}
+    · {$arrVideo.v_category}
+</p>
+
+{elseif $variant == 2}
+<ol class="{$TpStyle.dom_prefix}-dm-meta v2">
+    <li>上映时间：{$arrVideo.v_year}</li>
+    <li>
+        语言：
+        {volist name="arrVideo.v_lang" id="vo" key="k"}
+            {$vo}{if $k < $len_lang}、{/if}
+        {/volist}
+    </li>
+    <li>{$arrVideo.v_category}</li>
+</ol>
+
+{elseif $variant == 3}
+<div class="{$TpStyle.dom_prefix}-dm-meta v3">
+    <span>{$arrVideo.v_category}</span>
+    <span>
+        {volist name="arrVideo.v_area" id="vo" key="k"}
+            {$vo}{if $k < $len_area} | {/if}
+        {/volist}
+    </span>
+    <span>{$arrVideo.v_year}</span>
+</div>
+
+{elseif $variant == 4}
+<p class="{$TpStyle.dom_prefix}-dm-meta v4">
+    {$arrVideo.v_year} /
+    {volist name="arrVideo.v_lang" id="vo" key="k"}
+        {$vo}{if $k < $len_lang}/{/if}
+    {/volist}
+</p>
+
+{elseif $variant == 5}
+<dl class="{$TpStyle.dom_prefix}-dm-meta v5">
+    <dt>导演</dt>
+    <dd>
+        {volist name="arrVideo.v_director" id="vo" key="k"}
+            {$vo}{if $k < $len_director}、{/if}
+        {/volist}
+    </dd>
+    <dt>主演</dt>
+    <dd>
+        {volist name="arrVideo.v_actor" id="vo" key="k"}
+            {$vo}{if $k < $len_actor} / {/if}
+        {/volist}
+    </dd>
+</dl>
+
+{elseif $variant == 6}
+<dl class="{$TpStyle.dom_prefix}-dm-meta v6">
+    <dt>主演</dt>
+    <dd>
+        {volist name="arrVideo.v_actor" id="vo" key="k"}
+            <span class="{$TpStyle.dom_prefix}-dm-meta-chip">{$vo}</span>{if $k < $len_actor} · {/if}
+        {/volist}
+    </dd>
+</dl>
+
+{elseif $variant == 7}
+<div class="{$TpStyle.dom_prefix}-dm-meta v7">
+    <span class="{$TpStyle.dom_prefix}-dm-meta-label">导演</span>
+    <span>
+        {volist name="arrVideo.v_director" id="vo" key="k"}
+            {$vo}{if $k < $len_director} | {/if}
+        {/volist}
+    </span>
+</div>
+
+{elseif $variant == 8}
+<div class="{$TpStyle.dom_prefix}-dm-meta v8">
+    <time>{$arrVideo.v_year}</time>
+    <span>
+        {volist name="arrVideo.v_area" id="vo" key="k"}
+            {$vo}{if $k < $len_area} · {/if}
+        {/volist}
+    </span>
+</div>
+
+{elseif $variant == 9}
+<div class="{$TpStyle.dom_prefix}-dm-meta v9">
+    <span>{$arrVideo.v_category}</span>
+    <span class="{$TpStyle.dom_prefix}-dm-meta-sep">|</span>
+    <span>
+        {volist name="arrVideo.v_lang" id="vo" key="k"}
+            {$vo}{if $k < $len_lang} | {/if}
+        {/volist}
+    </span>
+</div>
+
+{elseif $variant == 10}
+<table class="{$TpStyle.dom_prefix}-dm-meta v10">
+    <tr>
+        <td>地区</td>
+        <td>
+            {volist name="arrVideo.v_area" id="vo" key="k"}
+                {$vo}{if $k < $len_area}、{/if}
+            {/volist}
+        </td>
+    </tr>
+    <tr>
+        <td>语言</td>
+        <td>
+            {volist name="arrVideo.v_lang" id="vo" key="k"}
+                {$vo}{if $k < $len_lang}、{/if}
+            {/volist}
+        </td>
+    </tr>
+</table>
+
+{elseif $variant == 11}
+<div class="{$TpStyle.dom_prefix}-dm-meta v11"
+     data-actor="{volist name='arrVideo.v_actor' id='vo' key='k'}{$vo}{if $k < $len_actor},{/if}{/volist}">
+    {$arrVideo.v_category}
+</div>
+
+{elseif $variant == 12}
+<p class="{$TpStyle.dom_prefix}-dm-meta v12">
+    <strong>{$arrVideo.v_category}</strong>
+    <em>
+        {volist name="arrVideo.v_lang" id="vo" key="k"}
+            {$vo}{if $k < $len_lang} / {/if}
+        {/volist}
+    </em>
+</p>
+
+{elseif $variant == 13}
+<div class="{$TpStyle.dom_prefix}-dm-meta v13">
+    <span>
+        {volist name="arrVideo.v_area" id="vo" key="k"}
+            {$vo}{if $k < $len_area} · {/if}
+        {/volist}
+    </span>
+    <span>{$arrVideo.v_year}</span>
+</div>
+
+{elseif $variant == 14}
+<div class="{$TpStyle.dom_prefix}-dm-meta v14">
+    <span>{$arrVideo.v_year}</span>
+    <span>
+        主演：
+        {volist name="arrVideo.v_actor" id="vo" key="k"}
+            {$vo}{if $k < $len_actor}、{/if}
+        {/volist}
+    </span>
+</div>
+
+{elseif $variant == 15}
+<p class="{$TpStyle.dom_prefix}-dm-meta v15">
+    {$arrVideo.v_category} /
+    {volist name="arrVideo.v_area" id="vo" key="k"}
+        {$vo}{if $k < $len_area}/{/if}
+    {/volist}
+    / {$arrVideo.v_year}
+</p>
+
+{elseif $variant == 16}
+<div class="{$TpStyle.dom_prefix}-dm-meta v16" itemprop="about">
+    {$arrVideo.v_category}
+</div>
+
+{elseif $variant == 17}
+<div class="{$TpStyle.dom_prefix}-dm-meta v17">
+    导演：
+    {volist name="arrVideo.v_director" id="vo" key="k"}
+        {$vo}{if $k < $len_director} · {/if}
+    {/volist}
+</div>
+
+{elseif $variant == 18}
+<div class="{$TpStyle.dom_prefix}-dm-meta v18">
+    <span class="{$TpStyle.dom_prefix}-dm-meta-hidden">
+        {volist name="arrVideo.v_actor" id="vo"}{$vo} {/volist}
+        {volist name="arrVideo.v_area" id="vo"}{$vo} {/volist}
+        {volist name="arrVideo.v_lang" id="vo"}{$vo} {/volist}
+    </span>
+</div>
+
+{elseif $variant == 19}
+<section class="{$TpStyle.dom_prefix}-dm-meta v19">
+    <p>
+        主演：
+        {volist name="arrVideo.v_actor" id="vo" key="k"}
+            {$vo}{if $k < $len_actor}、{/if}
+        {/volist}
+    </p>
+    <p>
+        导演：
+        {volist name="arrVideo.v_director" id="vo" key="k"}
+            {$vo}{if $k < $len_director}、{/if}
+        {/volist}
+    </p>
+</section>
+
+{/if}
--- a/code/app/home/view/videoGpt1/module/detail_main/title.html
+++ b/code/app/home/view/videoGpt1/module/detail_main/title.html
@@ -0,0 +1,117 @@
+{// ===================== Title Variants ===================== }
+
+{if $variant == 0}
+<h1 class="{$TpStyle.dom_prefix}-dm-title v0">
+    {$arrVideo.v_name}
+</h1>
+
+{elseif $variant == 1}
+<h1 class="{$TpStyle.dom_prefix}-dm-title v1">
+    {$arrVideo.v_name}
+    <small>{$arrVideo.v_year}</small>
+</h1>
+
+{elseif $variant == 2}
+<h2 class="{$TpStyle.dom_prefix}-dm-title v2">
+    《{$arrVideo.v_name}》
+</h2>
+
+{elseif $variant == 3}
+<header class="{$TpStyle.dom_prefix}-dm-title-wrap v3">
+    <h1 class="{$TpStyle.dom_prefix}-dm-title">{$arrVideo.v_name}</h1>
+    <span class="{$TpStyle.dom_prefix}-dm-sub">{$arrVideo.v_year}</span>
+</header>
+
+{elseif $variant == 4}
+<div class="{$TpStyle.dom_prefix}-dm-title-box v4">
+    <strong class="{$TpStyle.dom_prefix}-dm-title">{$arrVideo.v_name}</strong>
+</div>
+
+{elseif $variant == 5}
+<h1 class="{$TpStyle.dom_prefix}-dm-title v5">
+    {$arrVideo.v_name}
+    <sup>HD</sup>
+</h1>
+
+{elseif $variant == 6}
+<section class="{$TpStyle.dom_prefix}-dm-title-wrap v6">
+    <h1 class="{$TpStyle.dom_prefix}-dm-title">{$arrVideo.v_name}</h1>
+</section>
+
+{elseif $variant == 7}
+<article class="{$TpStyle.dom_prefix}-dm-title-wrap v7">
+    <h2 class="{$TpStyle.dom_prefix}-dm-title">{$arrVideo.v_name}</h2>
+</article>
+
+{elseif $variant == 8}
+<figure class="{$TpStyle.dom_prefix}-dm-title-wrap v8">
+    <figcaption class="{$TpStyle.dom_prefix}-dm-title">
+        {$arrVideo.v_name}
+    </figcaption>
+</figure>
+
+{elseif $variant == 9}
+<h1 class="{$TpStyle.dom_prefix}-dm-title v9">
+    {$arrVideo.v_name}
+    <span class="{$TpStyle.dom_prefix}-dm-tag">在线观看</span>
+</h1>
+
+{elseif $variant == 10}
+<h1 class="{$TpStyle.dom_prefix}-dm-title v10" data-title="{$arrVideo.v_name}">
+    {$arrVideo.v_name}
+</h1>
+
+{elseif $variant == 11}
+<h2 class="{$TpStyle.dom_prefix}-dm-title v11">
+    <strong>{$arrVideo.v_name}</strong>
+</h2>
+
+{elseif $variant == 12}
+<div class="{$TpStyle.dom_prefix}-dm-title-box v12">
+    <h1 class="{$TpStyle.dom_prefix}-dm-title">
+        {$arrVideo.v_name}
+        <em>{$arrVideo.v_year}</em>
+    </h1>
+</div>
+
+{elseif $variant == 13}
+<h1 class="{$TpStyle.dom_prefix}-dm-title v13">
+    {$arrVideo.v_name}
+    <span class="{$TpStyle.dom_prefix}-dm-score">{$arrVideo.v_score}</span>
+</h1>
+
+{elseif $variant == 14}
+<header class="{$TpStyle.dom_prefix}-dm-title-wrap v14">
+    <h1 class="{$TpStyle.dom_prefix}-dm-title">{$arrVideo.v_name}</h1>
+    <i class="{$TpStyle.dom_prefix}-dm-icon"></i>
+</header>
+
+{elseif $variant == 15}
+<h1 class="{$TpStyle.dom_prefix}-dm-title v15">
+    {$arrVideo.v_name} 免费高清完整版
+</h1>
+
+{elseif $variant == 16}
+<h1 class="{$TpStyle.dom_prefix}-dm-title v16" itemprop="name">
+    {$arrVideo.v_name}
+</h1>
+
+{elseif $variant == 17}
+<div class="{$TpStyle.dom_prefix}-dm-title-box v17">
+    <h2 class="{$TpStyle.dom_prefix}-dm-title">{$arrVideo.v_name}</h2>
+</div>
+
+{elseif $variant == 18}
+<h1 class="{$TpStyle.dom_prefix}-dm-title v18">
+    {$arrVideo.v_name}
+    <span class="{$TpStyle.dom_prefix}-dm-hidden">
+        {$arrVideo.v_year} 在线观看
+    </span>
+</h1>
+
+{elseif $variant == 19}
+<section class="{$TpStyle.dom_prefix}-dm-title-wrap v19">
+    <h1 class="{$TpStyle.dom_prefix}-dm-title">{$arrVideo.v_name}</h1>
+</section>
+
+{/if}