feat(config): add footer with ICP and CC license to all locales

docs/.vitepress/config.mjs

@@ -626,6 +626,10 @@ export default defineConfig({
               ]
             }
           ]
+        },
+        footer: {
+          message: '<a href="https://beian.miit.gov.cn/" target="_blank">京ICP备2026002630号-1</a>',
+          copyright: '本作品采用 <a href="http://creativecommons.org/licenses/by-nc-sa/4.0/" target="_blank">知识共享署名-非商业性使用-相同方式共享 4.0 国际许可协议（CC BY-NC-SA 4.0）</a> 进行许可'
         }
       }
     },
@@ -667,7 +671,11 @@ export default defineConfig({
           { text: 'Appendix', link: '/en-us/appendix/ai-capability-dictionary' }
         ],
         // TODO: Add English sidebar when content is ready
-        sidebar: {}
+        sidebar: {},
+        footer: {
+          message: '<a href="https://beian.miit.gov.cn/" target="_blank">京ICP备2026002630号-1</a>',
+          copyright: '本作品采用 <a href="http://creativecommons.org/licenses/by-nc-sa/4.0/" target="_blank">知识共享署名-非商业性使用-相同方式共享 4.0 国际许可协议（CC BY-NC-SA 4.0）</a> 进行许可'
+        }
       }
     },
 
@@ -708,7 +716,11 @@ export default defineConfig({
           { text: '付録', link: '/ja-jp/appendix/ai-capability-dictionary' }
         ],
         // TODO: Add Japanese sidebar when content is ready
-        sidebar: {}
+        sidebar: {},
+        footer: {
+          message: '<a href="https://beian.miit.gov.cn/" target="_blank">京ICP备2026002630号-1</a>',
+          copyright: '本作品采用 <a href="http://creativecommons.org/licenses/by-nc-sa/4.0/" target="_blank">知识共享署名-非商业性使用-相同方式共享 4.0 国际许可协议（CC BY-NC-SA 4.0）</a> 进行许可'
+        }
       }
     },
     'zh-tw': {
@@ -746,7 +758,11 @@ export default defineConfig({
           },
           { text: '附錄', link: '/zh-tw/appendix/ai-capability-dictionary' }
         ],
-        sidebar: {}
+        sidebar: {},
+        footer: {
+          message: '<a href="https://beian.miit.gov.cn/" target="_blank">京ICP备2026002630号-1</a>',
+          copyright: '本作品采用 <a href="http://creativecommons.org/licenses/by-nc-sa/4.0/" target="_blank">知识共享署名-非商业性使用-相同方式共享 4.0 国际许可协议（CC BY-NC-SA 4.0）</a> 进行许可'
+        }
       }
     },
     'ko-kr': {
@@ -781,7 +797,11 @@ export default defineConfig({
           },
           { text: '부록', link: '/ko-kr/appendix/ai-capability-dictionary' }
         ],
-        sidebar: {}
+        sidebar: {},
+        footer: {
+          message: '<a href="https://beian.miit.gov.cn/" target="_blank">京ICP备2026002630号-1</a>',
+          copyright: '本作品采用 <a href="http://creativecommons.org/licenses/by-nc-sa/4.0/" target="_blank">知识共享署名-非商业性使用-相同方式共享 4.0 国际许可协议（CC BY-NC-SA 4.0）</a> 进行许可'
+        }
       }
     },
     'es-es': {
@@ -819,7 +839,11 @@ export default defineConfig({
           },
           { text: 'Apéndice', link: '/es-es/appendix/ai-capability-dictionary' }
         ],
-        sidebar: {}
+        sidebar: {},
+        footer: {
+          message: '<a href="https://beian.miit.gov.cn/" target="_blank">京ICP备2026002630号-1</a>',
+          copyright: '本作品采用 <a href="http://creativecommons.org/licenses/by-nc-sa/4.0/" target="_blank">知识共享署名-非商业性使用-相同方式共享 4.0 国际许可协议（CC BY-NC-SA 4.0）</a> 进行许可'
+        }
       }
     },
     'fr-fr': {
@@ -854,7 +878,11 @@ export default defineConfig({
           },
           { text: 'Annexe', link: '/fr-fr/appendix/ai-capability-dictionary' }
         ],
-        sidebar: {}
+        sidebar: {},
+        footer: {
+          message: '<a href="https://beian.miit.gov.cn/" target="_blank">京ICP备2026002630号-1</a>',
+          copyright: '本作品采用 <a href="http://creativecommons.org/licenses/by-nc-sa/4.0/" target="_blank">知识共享署名-非商业性使用-相同方式共享 4.0 国际许可协议（CC BY-NC-SA 4.0）</a> 进行许可'
+        }
       }
     },
     'de-de': {
@@ -889,7 +917,11 @@ export default defineConfig({
           },
           { text: 'Anhang', link: '/de-de/appendix/ai-capability-dictionary' }
         ],
-        sidebar: {}
+        sidebar: {},
+        footer: {
+          message: '<a href="https://beian.miit.gov.cn/" target="_blank">京ICP备2026002630号-1</a>',
+          copyright: '本作品采用 <a href="http://creativecommons.org/licenses/by-nc-sa/4.0/" target="_blank">知识共享署名-非商业性使用-相同方式共享 4.0 国际许可协议（CC BY-NC-SA 4.0）</a> 进行许可'
+        }
       }
     },
     'ar-sa': {
@@ -927,7 +959,11 @@ export default defineConfig({
           },
           { text: 'ملحق', link: '/ar-sa/appendix/ai-capability-dictionary' }
         ],
-        sidebar: {}
+        sidebar: {},
+        footer: {
+          message: '<a href="https://beian.miit.gov.cn/" target="_blank">京ICP备2026002630号-1</a>',
+          copyright: '本作品采用 <a href="http://creativecommons.org/licenses/by-nc-sa/4.0/" target="_blank">知识共享署名-非商业性使用-相同方式共享 4.0 国际许可协议（CC BY-NC-SA 4.0）</a> 进行许可'
+        }
       }
     },
     'vi-vn': {
@@ -962,7 +998,11 @@ export default defineConfig({
           },
           { text: 'Phụ lục', link: '/vi-vn/appendix/ai-capability-dictionary' }
         ],
-        sidebar: {}
+        sidebar: {},
+        footer: {
+          message: '<a href="https://beian.miit.gov.cn/" target="_blank">京ICP备2026002630号-1</a>',
+          copyright: '本作品采用 <a href="http://creativecommons.org/licenses/by-nc-sa/4.0/" target="_blank">知识共享署名-非商业性使用-相同方式共享 4.0 国际许可协议（CC BY-NC-SA 4.0）</a> 进行许可'
+        }
       }
     }
   }

docs/zh-cn/stage-1/1.4-complete-project-practice/index.md

@@ -101,32 +101,92 @@ API Key 可能会过期，网络可能会断开。
 
 ## 2. 注入灵魂：模拟真实数据 (Mock Data)
 
-一个空荡荡的页面是无法打动人的。想象一下，你向别人展示“电商工作台”，结果商品列表里空空如也，或者只有一行 "test / test / test"。
+一个空荡荡的页面是无法打动人的。想象一下，你向别人展示“电商素材工作台”，结果历史记录里空空如也，或者只有一行 "test / test / test"。
-为了让演示效果最佳，我们需要“伪造”一些逼真的数据。
+为了让演示效果最佳，我们需要“伪造”一些逼真的数据，让你的原型看起来像一个已经运营了半年的真实产品。
 
-### 2.1 让 AI 生成 Mock 数据
+### 2.1 让 AI 帮你设计数据结构
-你不需要手动去编造数据。利用我们学过的 AI 能力，让它帮你生成一份 JSON 数据。
 
-**操作步骤：**
+我们不需要自己去想每一个字段叫什么（比如是叫 `name` 还是 `title`），这件事完全可以交给 AI。
-1. 告诉 AI 你的数据结构（或者把代码发给它）。
-2. 让它生成 10-20 条逼真的模拟数据。
 
-> 提示词示例：
+你只需要告诉 AI 你的**业务场景**：
-> “我正在做一个抖音电商的工作台，请帮我生成 10 条模拟的商品历史记录。包含：商品图 URL（找一些真实的占位图，如使用 Unsplash 的图片）、商品标题（要像真实的淘宝/抖音商品标题）、生成的文案、创建时间。请直接给我一个 JavaScript 数组。”
 
-### 2.2 预埋数据到原型中
+> **提示词示例：**
-拿到数据后，让 AI IDE 帮你把它“塞”进代码里。
+> “我正在做一个**抖音电商素材工作台**的原型。
+> 请帮我设计一个 JSON 数据结构，用来描述一个‘商品任务’。
+> 这个任务应该包含：商品的基本信息（名字、类目）、输入的素材（图片链接）、以及 AI 生成的结果（标题、文案、海报图）。
+> 请直接给我一个 JSON 示例。”
 
-> 提示词示例：
+AI 会根据你的描述，自动帮你构思出类似 `productName`, `generatedContent` 这样的字段。
-> “请在页面初始化时，检查如果没有历史记录，就默认加载这 10 条模拟数据，让页面看起来丰富一点。”
 
-### 2.3 使用在线预设数据源
+### 2.2 让 AI 批量生产“逼真”数据
-除了让 AI 生成，你还可以利用一些现成的 Mock 数据服务或库（如果你想让原型更专业）：
-- **Faker.js**: 一个专门生成假数据的库（可以让 AI 帮你安装和使用）。
-- **Picsum Photos**: 自动生成占位图片。例如 `<img src="https://picsum.photos/200/300" />` 会每次给你一张随机图。
 
-**技巧：**
+有了数据结构后，下一步就是让 AI 帮你“填空”，生成一批看起来真实的数据。
-在演示时，一个填满真实感数据的列表，能让观众瞬间代入场景，忽略掉“这只是个原型”的事实。
+
+**提示词技巧：**
+你不能只告诉 AI “帮我生成数据”，你需要像给实习生布置任务一样，告诉它**业务背景**和**内容要求**：
+*   **业务背景**：告诉 AI 我们是做“抖音电商”的，所以商品标题要吸睛（比如“显瘦神器”、“学生党必入”），文案要口语化。
+*   **图片要求**：为了让原型好看，图片不能是黑白的占位符，最好是随机的彩色风景或实物图。
+
+> **提示词示例：**
+> “请基于刚才设计的结构，帮我生成 10 条逼真的模拟数据。
+> （备注：不一定要 JSON 格式。如果你正在写前端，可以让它直接生成 JavaScript 数组；如果你用 Python，可以让它生成 List。）
+> 
+> **业务场景要求**：
+> 1. 假设这是一家综合百货店，商品涵盖‘女装’、‘数码’、‘美妆’三个类目。
+> 2. **生成的标题和文案要非常‘抖音风’**：比如标题要包含 Emoji (🔥, ✨)，文案要用‘绝绝子’、‘亲测好用’这种语气。
+> 3. **图片字段**：请统一使用 `https://picsum.photos/seed/{random_id}/300/400` 这个格式，确保每张图都不一样。”
+
+**生成的 Mock Data 示例：**
+
+```javascript
+export const mockProductTasks = [
+  {
+    id: "task_001",
+    name: "夏季法式复古碎花裙",
+    status: "completed",
+    input: {
+      category: "女装",
+      features: ["收腰", "显瘦", "气质"],
+      originalImage: "https://picsum.photos/seed/dress_input/300/400"
+    },
+    output: {
+      generatedTitle: "✨谁穿谁好看！这条法式碎花裙真的绝绝子🔥",
+      generatedCopy: "姐妹们！这条裙子真的太显瘦了！收腰设计绝了，穿上立马有腰身。面料很透气，夏天穿完全不闷。约会逛街首选！👗",
+      generatedPosterImage: "https://picsum.photos/seed/dress_output/300/400"
+    },
+    createdAt: "2026-01-20T10:00:00Z"
+  },
+  {
+    id: "task_002",
+    name: "超强降噪蓝牙耳机 Pro",
+    status: "completed",
+    input: {
+      category: "数码",
+      features: ["降噪", "超长续航", "低延迟"],
+      originalImage: "https://picsum.photos/seed/tech_input/300/400"
+    },
+    output: {
+      generatedTitle: "🎧 终于被我找到了！这款耳机降噪太强了吧！🔇",
+      generatedCopy: "戴上它，世界瞬间安静了。音质绝佳，听歌就像在现场。续航也很给力，充一次电用一周！学生党必入！",
+      generatedPosterImage: "https://picsum.photos/seed/tech_output/300/400"
+    },
+    createdAt: "2026-01-21T14:30:00Z"
+  }
+  // ... 更多数据
+];
+```
+
+### 2.3 (进阶) 使用 LocalStorage 实现“假增删改”
+
+如果你希望刚才生成的“模拟数据”不仅能看，还能删、能改，甚至新生成的任务刷新页面后还在，你可以结合 `LocalStorage`。
+
+> **提示词示例：**
+> “请帮我实现一个数据存储功能。
+> 1. 优先从 `localStorage` 读取数据。
+> 2. 如果 `localStorage` 为空，则使用刚才生成的 Mock 数据初始化，并将它们存入 `localStorage`。
+> 3. 同时帮我写 `addProductTask` 和 `deleteProductTask` 函数，每次操作都要同步更新 `localStorage`。”
+
+通过这一步，你的原型就拥有了“记忆”，用户体验几乎和真产品无异。
 
 <div style="margin: 50px 0;">
   <ClientOnly>