diff --git a/dashboard/frontend/src/locales/langs/en-us.ts b/dashboard/frontend/src/locales/langs/en-us.ts
index b864913..a162ff4 100644
--- a/dashboard/frontend/src/locales/langs/en-us.ts
+++ b/dashboard/frontend/src/locales/langs/en-us.ts
@@ -242,7 +242,33 @@ const local: App.I18n.Schema = {
     system: 'System',
     system_users: 'Users',
     toolbox: 'Toolbox',
-    'toolbox_luxsin-controller': 'Luxsin Controller'
+    'toolbox_luxsin-controller': 'Luxsin Controller',
+    www: 'Website',
+    www_global: 'Global Config',
+    www_global_basic: 'Site Info',
+    www_global_footer: 'Footer',
+    www_global_social: 'Social Links',
+    www_global_seo: 'SEO Defaults',
+    www_nav: 'Navigation',
+    www_nav_items: 'Nav Items',
+    www_nav_appearance: 'Nav Appearance',
+    www_page: 'Pages',
+    www_page_home: 'Home Sections',
+    'www_page_product-list': 'Product List Page',
+    'www_page_news-list': 'News List Page',
+    www_page_about: 'About Us',
+    www_page_support: 'Support',
+    www_product: 'Products',
+    www_product_series: 'Product Series',
+    www_product_list: 'Product List',
+    www_news: 'News',
+    www_news_articles: 'Articles',
+    www_media: 'Media Library',
+    www_i18n: 'Translations',
+    www_contact: 'Contact Form',
+    www_contact_settings: 'Form Settings',
+    www_contact_submissions: 'Submissions',
+    'www_page-seo': 'Page SEO'
   },
   page: {
     login: {
diff --git a/dashboard/frontend/src/locales/langs/zh-cn.ts b/dashboard/frontend/src/locales/langs/zh-cn.ts
index 64e5089..5006e7b 100644
--- a/dashboard/frontend/src/locales/langs/zh-cn.ts
+++ b/dashboard/frontend/src/locales/langs/zh-cn.ts
@@ -238,7 +238,34 @@ const local: App.I18n.Schema = {
     system: '系统管理',
     system_users: '账号管理',
     toolbox: '工具箱',
-    'toolbox_luxsin-controller': 'luxsin 控制器'
+    'toolbox_luxsin-controller': 'luxsin 控制器',
+    // 官网管理
+    www: '官网管理',
+    www_global: '全局配置',
+    www_global_basic: '站点信息',
+    www_global_footer: '页脚配置',
+    www_global_social: '社交链接',
+    www_global_seo: 'SEO 默认值',
+    www_nav: '导航管理',
+    www_nav_items: '导航入口',
+    www_nav_appearance: '导航外观',
+    www_page: '页面管理',
+    www_page_home: '首页区块',
+    'www_page_product-list': '产品列表页',
+    'www_page_news-list': '新闻列表页',
+    www_page_about: '关于我们',
+    www_page_support: '技术支持',
+    www_product: '产品管理',
+    www_product_series: '产品系列',
+    www_product_list: '产品列表',
+    www_news: '新闻管理',
+    www_news_articles: '新闻文章',
+    www_media: '素材库',
+    www_i18n: '翻译管理',
+    www_contact: '联系表单',
+    www_contact_settings: '表单配置',
+    www_contact_submissions: '提交记录',
+    'www_page-seo': '页面 SEO'
   },
   page: {
     login: {
diff --git a/dashboard/frontend/src/router/elegant/imports.ts b/dashboard/frontend/src/router/elegant/imports.ts
index 246ca05..1d901b0 100644
--- a/dashboard/frontend/src/router/elegant/imports.ts
+++ b/dashboard/frontend/src/router/elegant/imports.ts
@@ -29,4 +29,23 @@ export const views: Record<LastLevelRouteKey, RouteComponent | (() => Promise<Ro
   upgrade_blacklist: () => import("@/views/upgrade/blacklist/index.vue"),
   "upgrade_ota-target-device": () => import("@/views/upgrade/ota-target-device/index.vue"),
   upgrade_ota: () => import("@/views/upgrade/ota/index.vue"),
+  www_contact_settings: () => import("@/views/www/contact/settings/index.vue"),
+  www_contact_submissions: () => import("@/views/www/contact/submissions/index.vue"),
+  www_global_basic: () => import("@/views/www/global/basic/index.vue"),
+  www_global_footer: () => import("@/views/www/global/footer/index.vue"),
+  www_global_seo: () => import("@/views/www/global/seo/index.vue"),
+  www_global_social: () => import("@/views/www/global/social/index.vue"),
+  www_i18n: () => import("@/views/www/i18n/index.vue"),
+  www_media: () => import("@/views/www/media/index.vue"),
+  www_nav_appearance: () => import("@/views/www/nav/appearance/index.vue"),
+  www_nav_items: () => import("@/views/www/nav/items/index.vue"),
+  www_news_articles: () => import("@/views/www/news/articles/index.vue"),
+  "www_page-seo": () => import("@/views/www/page-seo/index.vue"),
+  www_page_about: () => import("@/views/www/page/about/index.vue"),
+  www_page_home: () => import("@/views/www/page/home/index.vue"),
+  "www_page_news-list": () => import("@/views/www/page/news-list/index.vue"),
+  "www_page_product-list": () => import("@/views/www/page/product-list/index.vue"),
+  www_page_support: () => import("@/views/www/page/support/index.vue"),
+  www_product_list: () => import("@/views/www/product/list/index.vue"),
+  www_product_series: () => import("@/views/www/product/series/index.vue"),
 };
diff --git a/dashboard/frontend/src/router/elegant/routes.ts b/dashboard/frontend/src/router/elegant/routes.ts
index 3dfc95c..965c50f 100644
--- a/dashboard/frontend/src/router/elegant/routes.ts
+++ b/dashboard/frontend/src/router/elegant/routes.ts
@@ -238,5 +238,318 @@ export const generatedRoutes: GeneratedRoute[] = [
         }
       }
     ]
+  },
+  {
+    name: 'www',
+    path: '/www',
+    component: 'layout.base',
+    meta: {
+      title: 'www',
+      i18nKey: 'route.www',
+      icon: 'mdi:globe-model',
+      order: 7
+    },
+    children: [
+      {
+        name: 'www_contact',
+        path: '/www/contact',
+        meta: {
+          title: 'www_contact',
+          i18nKey: 'route.www_contact',
+          icon: 'mdi:email-outline',
+          order: 8
+        },
+        children: [
+          {
+            name: 'www_contact_settings',
+            path: '/www/contact/settings',
+            component: 'view.www_contact_settings',
+            meta: {
+              title: 'www_contact_settings',
+              i18nKey: 'route.www_contact_settings',
+              icon: 'mdi:form-textbox',
+              order: 1,
+              keepAlive: true
+            }
+          },
+          {
+            name: 'www_contact_submissions',
+            path: '/www/contact/submissions',
+            component: 'view.www_contact_submissions',
+            meta: {
+              title: 'www_contact_submissions',
+              i18nKey: 'route.www_contact_submissions',
+              icon: 'mdi:inbox-outline',
+              order: 2,
+              keepAlive: true
+            }
+          }
+        ]
+      },
+      {
+        name: 'www_global',
+        path: '/www/global',
+        meta: {
+          title: 'www_global',
+          i18nKey: 'route.www_global',
+          icon: 'mdi:application-cog-outline',
+          order: 1
+        },
+        children: [
+          {
+            name: 'www_global_basic',
+            path: '/www/global/basic',
+            component: 'view.www_global_basic',
+            meta: {
+              title: 'www_global_basic',
+              i18nKey: 'route.www_global_basic',
+              icon: 'mdi:information-outline',
+              order: 1,
+              keepAlive: true
+            }
+          },
+          {
+            name: 'www_global_footer',
+            path: '/www/global/footer',
+            component: 'view.www_global_footer',
+            meta: {
+              title: 'www_global_footer',
+              i18nKey: 'route.www_global_footer',
+              icon: 'mdi:page-layout-footer',
+              order: 2,
+              keepAlive: true
+            }
+          },
+          {
+            name: 'www_global_seo',
+            path: '/www/global/seo',
+            component: 'view.www_global_seo',
+            meta: {
+              title: 'www_global_seo',
+              i18nKey: 'route.www_global_seo',
+              icon: 'mdi:magnify',
+              order: 4,
+              keepAlive: true
+            }
+          },
+          {
+            name: 'www_global_social',
+            path: '/www/global/social',
+            component: 'view.www_global_social',
+            meta: {
+              title: 'www_global_social',
+              i18nKey: 'route.www_global_social',
+              icon: 'mdi:share-variant-outline',
+              order: 3,
+              keepAlive: true
+            }
+          }
+        ]
+      },
+      {
+        name: 'www_i18n',
+        path: '/www/i18n',
+        component: 'view.www_i18n',
+        meta: {
+          title: 'www_i18n',
+          i18nKey: 'route.www_i18n',
+          icon: 'mdi:translate',
+          order: 7,
+          keepAlive: true
+        }
+      },
+      {
+        name: 'www_media',
+        path: '/www/media',
+        component: 'view.www_media',
+        meta: {
+          title: 'www_media',
+          i18nKey: 'route.www_media',
+          icon: 'mdi:image-multiple-outline',
+          order: 6,
+          keepAlive: true
+        }
+      },
+      {
+        name: 'www_nav',
+        path: '/www/nav',
+        meta: {
+          title: 'www_nav',
+          i18nKey: 'route.www_nav',
+          icon: 'mdi:menu',
+          order: 2
+        },
+        children: [
+          {
+            name: 'www_nav_appearance',
+            path: '/www/nav/appearance',
+            component: 'view.www_nav_appearance',
+            meta: {
+              title: 'www_nav_appearance',
+              i18nKey: 'route.www_nav_appearance',
+              icon: 'mdi:palette-outline',
+              order: 2,
+              keepAlive: true
+            }
+          },
+          {
+            name: 'www_nav_items',
+            path: '/www/nav/items',
+            component: 'view.www_nav_items',
+            meta: {
+              title: 'www_nav_items',
+              i18nKey: 'route.www_nav_items',
+              icon: 'mdi:format-list-bulleted',
+              order: 1,
+              keepAlive: true
+            }
+          }
+        ]
+      },
+      {
+        name: 'www_news',
+        path: '/www/news',
+        meta: {
+          title: 'www_news',
+          i18nKey: 'route.www_news',
+          icon: 'mdi:newspaper-variant-multiple-outline',
+          order: 5
+        },
+        children: [
+          {
+            name: 'www_news_articles',
+            path: '/www/news/articles',
+            component: 'view.www_news_articles',
+            meta: {
+              title: 'www_news_articles',
+              i18nKey: 'route.www_news_articles',
+              icon: 'mdi:article-outline',
+              order: 1,
+              keepAlive: true
+            }
+          }
+        ]
+      },
+      {
+        name: 'www_page',
+        path: '/www/page',
+        meta: {
+          title: 'www_page',
+          i18nKey: 'route.www_page',
+          icon: 'mdi:file-document-outline',
+          order: 3
+        },
+        children: [
+          {
+            name: 'www_page_about',
+            path: '/www/page/about',
+            component: 'view.www_page_about',
+            meta: {
+              title: 'www_page_about',
+              i18nKey: 'route.www_page_about',
+              icon: 'mdi:account-group-outline',
+              order: 4,
+              keepAlive: true
+            }
+          },
+          {
+            name: 'www_page_home',
+            path: '/www/page/home',
+            component: 'view.www_page_home',
+            meta: {
+              title: 'www_page_home',
+              i18nKey: 'route.www_page_home',
+              icon: 'mdi:home-outline',
+              order: 1,
+              keepAlive: true
+            }
+          },
+          {
+            name: 'www_page_news-list',
+            path: '/www/page/news-list',
+            component: 'view.www_page_news-list',
+            meta: {
+              title: 'www_page_news-list',
+              i18nKey: 'route.www_page_news-list',
+              icon: 'mdi:newspaper-variant-outline',
+              order: 3,
+              keepAlive: true
+            }
+          },
+          {
+            name: 'www_page_product-list',
+            path: '/www/page/product-list',
+            component: 'view.www_page_product-list',
+            meta: {
+              title: 'www_page_product-list',
+              i18nKey: 'route.www_page_product-list',
+              icon: 'mdi:format-list-bulleted-square',
+              order: 2,
+              keepAlive: true
+            }
+          },
+          {
+            name: 'www_page_support',
+            path: '/www/page/support',
+            component: 'view.www_page_support',
+            meta: {
+              title: 'www_page_support',
+              i18nKey: 'route.www_page_support',
+              icon: 'mdi:lifebuoy',
+              order: 5,
+              keepAlive: true
+            }
+          }
+        ]
+      },
+      {
+        name: 'www_page-seo',
+        path: '/www/page-seo',
+        component: 'view.www_page-seo',
+        meta: {
+          title: 'www_page-seo',
+          i18nKey: 'route.www_page-seo',
+          icon: 'mdi:search-web',
+          order: 9,
+          keepAlive: true
+        }
+      },
+      {
+        name: 'www_product',
+        path: '/www/product',
+        meta: {
+          title: 'www_product',
+          i18nKey: 'route.www_product',
+          icon: 'mdi:package-variant-closed',
+          order: 4
+        },
+        children: [
+          {
+            name: 'www_product_list',
+            path: '/www/product/list',
+            component: 'view.www_product_list',
+            meta: {
+              title: 'www_product_list',
+              i18nKey: 'route.www_product_list',
+              icon: 'mdi:view-list-outline',
+              order: 2,
+              keepAlive: true
+            }
+          },
+          {
+            name: 'www_product_series',
+            path: '/www/product/series',
+            component: 'view.www_product_series',
+            meta: {
+              title: 'www_product_series',
+              i18nKey: 'route.www_product_series',
+              icon: 'mdi:layers-outline',
+              order: 1,
+              keepAlive: true
+            }
+          }
+        ]
+      }
+    ]
   }
 ];
diff --git a/dashboard/frontend/src/router/elegant/transform.ts b/dashboard/frontend/src/router/elegant/transform.ts
index 0643515..b30f864 100644
--- a/dashboard/frontend/src/router/elegant/transform.ts
+++ b/dashboard/frontend/src/router/elegant/transform.ts
@@ -181,7 +181,33 @@ const routeMap: RouteMap = {
   "upgrade": "/upgrade",
   "upgrade_blacklist": "/upgrade/blacklist",
   "upgrade_ota": "/upgrade/ota",
-  "upgrade_ota-target-device": "/upgrade/ota-target-device"
+  "upgrade_ota-target-device": "/upgrade/ota-target-device",
+  "www": "/www",
+  "www_contact": "/www/contact",
+  "www_contact_settings": "/www/contact/settings",
+  "www_contact_submissions": "/www/contact/submissions",
+  "www_global": "/www/global",
+  "www_global_basic": "/www/global/basic",
+  "www_global_footer": "/www/global/footer",
+  "www_global_seo": "/www/global/seo",
+  "www_global_social": "/www/global/social",
+  "www_i18n": "/www/i18n",
+  "www_media": "/www/media",
+  "www_nav": "/www/nav",
+  "www_nav_appearance": "/www/nav/appearance",
+  "www_nav_items": "/www/nav/items",
+  "www_news": "/www/news",
+  "www_news_articles": "/www/news/articles",
+  "www_page": "/www/page",
+  "www_page_about": "/www/page/about",
+  "www_page_home": "/www/page/home",
+  "www_page_news-list": "/www/page/news-list",
+  "www_page_product-list": "/www/page/product-list",
+  "www_page_support": "/www/page/support",
+  "www_page-seo": "/www/page-seo",
+  "www_product": "/www/product",
+  "www_product_list": "/www/product/list",
+  "www_product_series": "/www/product/series"
 };
 
 /**
diff --git a/dashboard/frontend/src/service/api/index.ts b/dashboard/frontend/src/service/api/index.ts
index 3daea45..5ae286b 100644
--- a/dashboard/frontend/src/service/api/index.ts
+++ b/dashboard/frontend/src/service/api/index.ts
@@ -8,3 +8,15 @@ export * from './blacklist';
 export * from './ota-target-device';
 export * from './share-code-log';
 export * from './model';
+
+// 官网 CMS
+export * from './www-global';
+export * from './www-nav';
+export * from './www-sections';
+export * from './www-pages';
+export * from './www-products';
+export * from './www-news';
+export * from './www-media';
+export * from './www-i18n';
+export * from './www-contact';
+export * from './www-seo';
diff --git a/dashboard/frontend/src/service/api/www-contact.ts b/dashboard/frontend/src/service/api/www-contact.ts
new file mode 100644
index 0000000..25bfa4b
--- /dev/null
+++ b/dashboard/frontend/src/service/api/www-contact.ts
@@ -0,0 +1,49 @@
+import { request } from '../request';
+import type { PageParams } from './brand';
+
+// ===== 表单配置 =====
+export function fetchGetFormSettings() {
+  return request<Api.Www.FormSettings>({ url: '/www/contact/settings', method: 'get' });
+}
+
+export function fetchUpdateFormSettings(data: Omit<Api.Www.FormSettings, 'id'>) {
+  return request<Api.Www.FormSettings>({ url: '/www/contact/settings', method: 'put', data });
+}
+
+// ===== 表单字段 =====
+export function fetchGetFormFields() {
+  return request<{ items: Api.Www.FormField[]; total: number }>({ url: '/www/contact/fields', method: 'get' });
+}
+
+export function fetchCreateFormField(data: Partial<Api.Www.FormField>) {
+  return request<Api.Www.FormField>({ url: '/www/contact/fields', method: 'post', data });
+}
+
+export function fetchUpdateFormField(id: number, data: Partial<Api.Www.FormField>) {
+  return request<Api.Www.FormField>({ url: `/www/contact/fields/${id}`, method: 'put', data });
+}
+
+export function fetchDeleteFormField(id: number) {
+  return request({ url: `/www/contact/fields/${id}`, method: 'delete' });
+}
+
+export function fetchSortFormFields(data: Array<{ id: number; sort_order: number }>) {
+  return request({ url: '/www/contact/fields/sort', method: 'patch', data });
+}
+
+// ===== 提交记录 =====
+export function fetchGetFormSubmissions(params?: PageParams & { is_read?: 0 | 1; start_date?: string; end_date?: string }) {
+  return request<Api.Common.PageResult<Api.Www.FormSubmission>>({ url: '/www/contact/submissions', method: 'get', params });
+}
+
+export function fetchGetFormSubmission(id: number) {
+  return request<Api.Www.FormSubmission>({ url: `/www/contact/submissions/${id}`, method: 'get' });
+}
+
+export function fetchMarkSubmissionRead(id: number) {
+  return request({ url: `/www/contact/submissions/${id}/read`, method: 'patch' });
+}
+
+export function fetchDeleteSubmission(id: number) {
+  return request({ url: `/www/contact/submissions/${id}`, method: 'delete' });
+}
diff --git a/dashboard/frontend/src/service/api/www-global.ts b/dashboard/frontend/src/service/api/www-global.ts
new file mode 100644
index 0000000..17bdae1
--- /dev/null
+++ b/dashboard/frontend/src/service/api/www-global.ts
@@ -0,0 +1,41 @@
+import { request } from '../request';
+import type { PageParams } from './brand';
+
+// ===== 站点信息 =====
+export function fetchGetSiteSettings() {
+  return request<Api.Www.SiteSettings>({ url: '/www/global/site', method: 'get' });
+}
+
+export function fetchUpdateSiteSettings(data: Omit<Api.Www.SiteSettings, 'id' | 'updated_at'>) {
+  return request<Api.Www.SiteSettings>({ url: '/www/global/site', method: 'put', data });
+}
+
+// ===== 页脚配置 =====
+export function fetchGetFooterSettings() {
+  return request<Api.Www.FooterSettings>({ url: '/www/global/footer', method: 'get' });
+}
+
+export function fetchUpdateFooterSettings(data: Omit<Api.Www.FooterSettings, 'id'>) {
+  return request<Api.Www.FooterSettings>({ url: '/www/global/footer', method: 'put', data });
+}
+
+// ===== 社交链接 =====
+export function fetchGetSocialLinks() {
+  return request<Api.Www.SocialLink[]>({ url: '/www/global/social', method: 'get' });
+}
+
+export function fetchUpdateSocialLinks(data: Array<Pick<Api.Www.SocialLink, 'platform' | 'url' | 'qrcode_url'>>) {
+  return request<Api.Www.SocialLink[]>({ url: '/www/global/social', method: 'put', data });
+}
+
+// ===== SEO 默认值 =====
+export function fetchGetSeoDefaults() {
+  return request<Api.Www.SeoDefaults>({ url: '/www/global/seo', method: 'get' });
+}
+
+export function fetchUpdateSeoDefaults(data: Omit<Api.Www.SeoDefaults, 'id'>) {
+  return request<Api.Www.SeoDefaults>({ url: '/www/global/seo', method: 'put', data });
+}
+
+// 保留 PageParams 导出兼容
+export type { PageParams };
diff --git a/dashboard/frontend/src/service/api/www-i18n.ts b/dashboard/frontend/src/service/api/www-i18n.ts
new file mode 100644
index 0000000..0d9f673
--- /dev/null
+++ b/dashboard/frontend/src/service/api/www-i18n.ts
@@ -0,0 +1,13 @@
+import { request } from '../request';
+
+export function fetchGetI18nEntries(params?: { keyword?: string }) {
+  return request<{ items: Api.Www.I18nEntry[]; total: number }>({ url: '/www/i18n', method: 'get', params });
+}
+
+export function fetchUpdateI18nEntry(id: number, data: { value_zh: string; value_en: string }) {
+  return request<Api.Www.I18nEntry>({ url: `/www/i18n/${id}`, method: 'put', data });
+}
+
+export function fetchBatchUpdateI18nEntries(data: Array<{ id: number; value_zh: string; value_en: string }>) {
+  return request({ url: '/www/i18n/batch', method: 'put', data });
+}
diff --git a/dashboard/frontend/src/service/api/www-media.ts b/dashboard/frontend/src/service/api/www-media.ts
new file mode 100644
index 0000000..9feef03
--- /dev/null
+++ b/dashboard/frontend/src/service/api/www-media.ts
@@ -0,0 +1,51 @@
+import { request } from '../request';
+import type { PageParams } from './brand';
+
+// ===== 素材库 =====
+export function fetchGetMedia(params?: PageParams & { category?: string; tag?: string; keyword?: string; file_type?: string }) {
+  return request<Api.Common.PageResult<Api.Www.MediaItem>>({ url: '/www/media', method: 'get', params });
+}
+
+export function fetchUploadMedia(file: File, onProgress?: (percent: number) => void) {
+  const formData = new FormData();
+  formData.append('file', file);
+  return request<Api.Www.MediaItem>({
+    url: '/www/media/upload',
+    method: 'post',
+    data: formData,
+    onUploadProgress: (e: { loaded: number; total?: number }) => {
+      if (onProgress && e.total) {
+        onProgress(Math.round((e.loaded / e.total) * 100));
+      }
+    }
+  });
+}
+
+export function fetchGetMediaItem(id: number) {
+  return request<Api.Www.MediaItem>({ url: `/www/media/${id}`, method: 'get' });
+}
+
+export function fetchUpdateMediaItem(id: number, data: { filename?: string; category?: string; tags?: string[] }) {
+  return request<Api.Www.MediaItem>({ url: `/www/media/${id}`, method: 'put', data });
+}
+
+export function fetchDeleteMediaItem(id: number) {
+  return request({ url: `/www/media/${id}`, method: 'delete' });
+}
+
+// ===== 素材标签 =====
+export function fetchGetMediaTags() {
+  return request<Api.Www.MediaTag[]>({ url: '/www/media/tags', method: 'get' });
+}
+
+export function fetchCreateMediaTag(tagName: string) {
+  return request<Api.Www.MediaTag>({ url: '/www/media/tags', method: 'post', data: { tag_name: tagName } });
+}
+
+export function fetchUpdateMediaTag(id: number, tagName: string) {
+  return request<Api.Www.MediaTag>({ url: `/www/media/tags/${id}`, method: 'put', data: { tag_name: tagName } });
+}
+
+export function fetchDeleteMediaTag(id: number) {
+  return request({ url: `/www/media/tags/${id}`, method: 'delete' });
+}
diff --git a/dashboard/frontend/src/service/api/www-nav.ts b/dashboard/frontend/src/service/api/www-nav.ts
new file mode 100644
index 0000000..beced1f
--- /dev/null
+++ b/dashboard/frontend/src/service/api/www-nav.ts
@@ -0,0 +1,31 @@
+import { request } from '../request';
+
+// ===== 导航入口 =====
+export function fetchGetNavItems() {
+  return request<{ items: Api.Www.NavItem[]; total: number }>({ url: '/www/nav/items', method: 'get' });
+}
+
+export function fetchCreateNavItem(data: Api.Www.NavItemPayload) {
+  return request<Api.Www.NavItem>({ url: '/www/nav/items', method: 'post', data });
+}
+
+export function fetchUpdateNavItem(id: number, data: Partial<Api.Www.NavItemPayload>) {
+  return request<Api.Www.NavItem>({ url: `/www/nav/items/${id}`, method: 'put', data });
+}
+
+export function fetchDeleteNavItem(id: number) {
+  return request({ url: `/www/nav/items/${id}`, method: 'delete' });
+}
+
+export function fetchSortNavItems(data: Array<{ id: number; sort_order: number }>) {
+  return request({ url: '/www/nav/items/sort', method: 'patch', data });
+}
+
+// ===== 导航外观 =====
+export function fetchGetNavAppearance() {
+  return request<Api.Www.NavAppearance>({ url: '/www/nav/appearance', method: 'get' });
+}
+
+export function fetchUpdateNavAppearance(data: Omit<Api.Www.NavAppearance, 'id'>) {
+  return request<Api.Www.NavAppearance>({ url: '/www/nav/appearance', method: 'put', data });
+}
diff --git a/dashboard/frontend/src/service/api/www-news.ts b/dashboard/frontend/src/service/api/www-news.ts
new file mode 100644
index 0000000..fbbe5fe
--- /dev/null
+++ b/dashboard/frontend/src/service/api/www-news.ts
@@ -0,0 +1,32 @@
+import { request } from '../request';
+import type { PageParams } from './brand';
+
+// ===== 新闻文章 =====
+export function fetchGetNews(params?: PageParams & { status?: string; title?: string }) {
+  return request<Api.Common.PageResult<Api.Www.NewsArticle>>({ url: '/www/news', method: 'get', params });
+}
+
+export function fetchGetNewsArticle(id: number) {
+  return request<Api.Www.NewsArticle>({ url: `/www/news/${id}`, method: 'get' });
+}
+
+export function fetchCreateNewsArticle(data: Api.Www.NewsArticlePayload) {
+  return request<Api.Www.NewsArticle>({ url: '/www/news', method: 'post', data });
+}
+
+export function fetchUpdateNewsArticle(id: number, data: Partial<Api.Www.NewsArticlePayload>) {
+  return request<Api.Www.NewsArticle>({ url: `/www/news/${id}`, method: 'put', data });
+}
+
+export function fetchDeleteNewsArticle(id: number) {
+  return request({ url: `/www/news/${id}`, method: 'delete' });
+}
+
+// ===== 文章推荐 =====
+export function fetchGetNewsRecommendations(id: number) {
+  return request<Api.Www.NewsArticle[]>({ url: `/www/news/${id}/recommendations`, method: 'get' });
+}
+
+export function fetchUpdateNewsRecommendations(id: number, recommendedIds: number[]) {
+  return request({ url: `/www/news/${id}/recommendations`, method: 'put', data: { recommended_ids: recommendedIds } });
+}
diff --git a/dashboard/frontend/src/service/api/www-pages.ts b/dashboard/frontend/src/service/api/www-pages.ts
new file mode 100644
index 0000000..db7ab9a
--- /dev/null
+++ b/dashboard/frontend/src/service/api/www-pages.ts
@@ -0,0 +1,37 @@
+import { request } from '../request';
+
+// ===== 产品列表页配置 =====
+export function fetchGetProductListSettings() {
+  return request<Api.Www.ProductListSettings>({ url: '/www/page/product-list', method: 'get' });
+}
+
+export function fetchUpdateProductListSettings(data: Omit<Api.Www.ProductListSettings, 'id'>) {
+  return request<Api.Www.ProductListSettings>({ url: '/www/page/product-list', method: 'put', data });
+}
+
+// ===== 新闻列表页配置 =====
+export function fetchGetNewsListSettings() {
+  return request<Api.Www.NewsListSettings>({ url: '/www/page/news-list', method: 'get' });
+}
+
+export function fetchUpdateNewsListSettings(data: Omit<Api.Www.NewsListSettings, 'id'>) {
+  return request<Api.Www.NewsListSettings>({ url: '/www/page/news-list', method: 'put', data });
+}
+
+// ===== 关于我们配置 =====
+export function fetchGetAboutSettings() {
+  return request<Api.Www.AboutSettings>({ url: '/www/page/about', method: 'get' });
+}
+
+export function fetchUpdateAboutSettings(data: Record<string, unknown>) {
+  return request<Api.Www.AboutSettings>({ url: '/www/page/about', method: 'put', data });
+}
+
+// ===== 技术支持配置 =====
+export function fetchGetSupportSettings() {
+  return request<Api.Www.SupportSettings>({ url: '/www/page/support', method: 'get' });
+}
+
+export function fetchUpdateSupportSettings(data: Record<string, unknown>) {
+  return request<Api.Www.SupportSettings>({ url: '/www/page/support', method: 'put', data });
+}
diff --git a/dashboard/frontend/src/service/api/www-products.ts b/dashboard/frontend/src/service/api/www-products.ts
new file mode 100644
index 0000000..05462a8
--- /dev/null
+++ b/dashboard/frontend/src/service/api/www-products.ts
@@ -0,0 +1,51 @@
+import { request } from '../request';
+import type { PageParams } from './brand';
+
+// ===== 产品系列 =====
+export function fetchGetProductSeries() {
+  return request<{ items: Api.Www.ProductSeries[]; total: number }>({
+    url: '/www/product/series',
+    method: 'get'
+  });
+}
+
+export function fetchCreateProductSeries(data: Api.Www.ProductSeriesPayload) {
+  return request<Api.Www.ProductSeries>({ url: '/www/product/series', method: 'post', data });
+}
+
+export function fetchGetProductSeriesById(id: number) {
+  return request<Api.Www.ProductSeries>({ url: `/www/product/series/${id}`, method: 'get' });
+}
+
+export function fetchUpdateProductSeries(id: number, data: Partial<Api.Www.ProductSeriesPayload>) {
+  return request<Api.Www.ProductSeries>({ url: `/www/product/series/${id}`, method: 'put', data });
+}
+
+export function fetchDeleteProductSeries(id: number) {
+  return request({ url: `/www/product/series/${id}`, method: 'delete' });
+}
+
+export function fetchSortProductSeries(data: Array<{ id: number; sort_order: number }>) {
+  return request({ url: '/www/product/series/sort', method: 'patch', data });
+}
+
+// ===== 产品 =====
+export function fetchGetProducts(params?: PageParams & { series_id?: number; is_visible?: 0 | 1; name?: string }) {
+  return request<Api.Common.PageResult<Api.Www.Product>>({ url: '/www/products', method: 'get', params });
+}
+
+export function fetchGetProduct(id: number) {
+  return request<Api.Www.Product>({ url: `/www/products/${id}`, method: 'get' });
+}
+
+export function fetchCreateProduct(data: Api.Www.ProductPayload) {
+  return request<Api.Www.Product>({ url: '/www/products', method: 'post', data });
+}
+
+export function fetchUpdateProduct(id: number, data: Partial<Api.Www.ProductPayload>) {
+  return request<Api.Www.Product>({ url: `/www/products/${id}`, method: 'put', data });
+}
+
+export function fetchDeleteProduct(id: number) {
+  return request({ url: `/www/products/${id}`, method: 'delete' });
+}
diff --git a/dashboard/frontend/src/service/api/www-sections.ts b/dashboard/frontend/src/service/api/www-sections.ts
new file mode 100644
index 0000000..df34ec6
--- /dev/null
+++ b/dashboard/frontend/src/service/api/www-sections.ts
@@ -0,0 +1,76 @@
+import { request } from '../request';
+
+// ===== Section 区块 =====
+export function fetchGetSections(params: { page_type: string; product_id?: number }) {
+  return request<{ items: Api.Www.SectionBlock[]; total: number }>({
+    url: '/www/sections',
+    method: 'get',
+    params
+  });
+}
+
+export function fetchGetSection(id: number) {
+  return request<Api.Www.SectionBlock>({ url: `/www/sections/${id}`, method: 'get' });
+}
+
+export function fetchCreateSection(data: Api.Www.SectionPayload) {
+  return request<Api.Www.SectionBlock>({ url: '/www/sections', method: 'post', data });
+}
+
+export function fetchUpdateSection(id: number, data: Partial<Api.Www.SectionPayload>) {
+  return request<Api.Www.SectionBlock>({ url: `/www/sections/${id}`, method: 'put', data });
+}
+
+export function fetchDeleteSection(id: number) {
+  return request({ url: `/www/sections/${id}`, method: 'delete' });
+}
+
+export function fetchSortSections(data: Array<{ id: number; sort_order: number }>) {
+  return request({ url: '/www/sections/sort', method: 'patch', data });
+}
+
+export function fetchDuplicateSection(id: number) {
+  return request<Api.Www.SectionBlock>({ url: `/www/sections/${id}/duplicate`, method: 'post' });
+}
+
+// ===== 参数分组 =====
+export function fetchGetSpecGroups(sectionId: number) {
+  return request<Api.Www.SpecGroup[]>({ url: `/www/sections/${sectionId}/spec-groups`, method: 'get' });
+}
+
+export function fetchCreateSpecGroup(sectionId: number, data: { title_zh: string; title_en: string; default_visible?: number }) {
+  return request<Api.Www.SpecGroup>({ url: `/www/sections/${sectionId}/spec-groups`, method: 'post', data });
+}
+
+export function fetchUpdateSpecGroup(sectionId: number, groupId: number, data: Partial<{ title_zh: string; title_en: string; default_visible: number }>) {
+  return request<Api.Www.SpecGroup>({ url: `/www/sections/${sectionId}/spec-groups/${groupId}`, method: 'put', data });
+}
+
+export function fetchDeleteSpecGroup(sectionId: number, groupId: number) {
+  return request({ url: `/www/sections/${sectionId}/spec-groups/${groupId}`, method: 'delete' });
+}
+
+export function fetchSortSpecGroups(sectionId: number, data: Array<{ id: number; sort_order: number }>) {
+  return request({ url: `/www/sections/${sectionId}/spec-groups/sort`, method: 'patch', data });
+}
+
+// ===== 参数项 =====
+export function fetchGetSpecItems(groupId: number) {
+  return request<Api.Www.SpecItem[]>({ url: `/www/spec-groups/${groupId}/items`, method: 'get' });
+}
+
+export function fetchCreateSpecItem(groupId: number, data: { name_zh: string; name_en: string; value_zh: string; value_en: string }) {
+  return request<Api.Www.SpecItem>({ url: `/www/spec-groups/${groupId}/items`, method: 'post', data });
+}
+
+export function fetchUpdateSpecItem(id: number, data: Partial<{ name_zh: string; name_en: string; value_zh: string; value_en: string }>) {
+  return request<Api.Www.SpecItem>({ url: `/www/spec-items/${id}`, method: 'put', data });
+}
+
+export function fetchDeleteSpecItem(id: number) {
+  return request({ url: `/www/spec-items/${id}`, method: 'delete' });
+}
+
+export function fetchSortSpecItems(groupId: number, data: Array<{ id: number; sort_order: number }>) {
+  return request({ url: `/www/spec-groups/${groupId}/items/sort`, method: 'patch', data });
+}
diff --git a/dashboard/frontend/src/service/api/www-seo.ts b/dashboard/frontend/src/service/api/www-seo.ts
new file mode 100644
index 0000000..5427c23
--- /dev/null
+++ b/dashboard/frontend/src/service/api/www-seo.ts
@@ -0,0 +1,9 @@
+import { request } from '../request';
+
+export function fetchGetPageSeo(params: { page_type: string; entity_id?: number }) {
+  return request<Api.Www.PageSeo>({ url: '/www/page-seo', method: 'get', params });
+}
+
+export function fetchUpdatePageSeo(data: Omit<Api.Www.PageSeo, 'id'>) {
+  return request<Api.Www.PageSeo>({ url: '/www/page-seo', method: 'put', data });
+}
diff --git a/dashboard/frontend/src/typings/api/www.d.ts b/dashboard/frontend/src/typings/api/www.d.ts
new file mode 100644
index 0000000..3ff7543
--- /dev/null
+++ b/dashboard/frontend/src/typings/api/www.d.ts
@@ -0,0 +1,348 @@
+declare namespace Api {
+  namespace Www {
+    // ===== 1. 全局配置 =====
+    interface SiteSettings {
+      id?: number;
+      site_title: string;
+      favicon_url: string;
+      logo_dark_url: string;
+      logo_light_url: string;
+      updated_at?: string;
+    }
+
+    interface FooterSettings {
+      id?: number;
+      company_name: string;
+      company_address: string;
+      contact_phone: string;
+      contact_email: string;
+      copyright_text: string;
+      icp_number: string;
+      police_number: string;
+    }
+
+    interface SocialLink {
+      id?: number;
+      platform: string;
+      url: string;
+      qrcode_url: string;
+      sort_order?: number;
+    }
+
+    interface SeoDefaults {
+      id?: number;
+      meta_description: string;
+      meta_keywords: string;
+      og_image_url: string;
+    }
+
+    // ===== 2. 导航管理 =====
+    interface NavItem {
+      id: number;
+      name_zh: string;
+      name_en: string;
+      link: string;
+      is_visible: boolean;
+      sort_order: number;
+      display_mode: 'text' | 'icon' | 'image';
+      icon_name: string;
+      image_url: string;
+      open_new_tab: boolean;
+      created_at?: string;
+      updated_at?: string;
+    }
+
+    interface NavItemPayload {
+      name_zh: string;
+      name_en: string;
+      link: string;
+      is_visible?: boolean;
+      display_mode?: string;
+      icon_name?: string;
+      image_url?: string;
+      open_new_tab?: boolean;
+    }
+
+    interface NavAppearance {
+      id?: number;
+      homepage_style: string;
+      non_homepage_style: string;
+    }
+
+    // ===== 3. Section 区块 =====
+    interface SectionBlock {
+      id: number;
+      page_type: string;
+      product_id: number | null;
+      layout: string;
+      theme: string;
+      bg_type: string;
+      bg_value: string;
+      overlay_enabled: boolean;
+      overlay_opacity: number;
+      overline_zh: string;
+      overline_en: string;
+      title_zh: string;
+      title_en: string;
+      subtitle_zh: string;
+      subtitle_en: string;
+      content_zh: string;
+      content_en: string;
+      cta_primary_zh: string;
+      cta_primary_en: string;
+      cta_primary_url: string;
+      cta_secondary_zh: string;
+      cta_secondary_en: string;
+      cta_secondary_url: string;
+      media_url_zh: string;
+      media_url_en: string;
+      video_url: string;
+      config: Record<string, unknown>;
+      is_visible: boolean;
+      sort_order: number;
+      created_at?: string;
+      updated_at?: string;
+    }
+
+    interface SectionPayload {
+      page_type: string;
+      product_id?: number | null;
+      layout: string;
+      theme?: string;
+      bg_type?: string;
+      bg_value?: string;
+      overlay_enabled?: boolean;
+      overlay_opacity?: number;
+      overline_zh?: string;
+      overline_en?: string;
+      title_zh?: string;
+      title_en?: string;
+      subtitle_zh?: string;
+      subtitle_en?: string;
+      content_zh?: string;
+      content_en?: string;
+      cta_primary_zh?: string;
+      cta_primary_en?: string;
+      cta_primary_url?: string;
+      cta_secondary_zh?: string;
+      cta_secondary_en?: string;
+      cta_secondary_url?: string;
+      media_url_zh?: string;
+      media_url_en?: string;
+      video_url?: string;
+      config?: Record<string, unknown>;
+      is_visible?: boolean;
+    }
+
+    interface SpecGroup {
+      id: number;
+      section_id: number;
+      title_zh: string;
+      title_en: string;
+      default_visible: number;
+      sort_order: number;
+    }
+
+    interface SpecItem {
+      id: number;
+      group_id: number;
+      name_zh: string;
+      name_en: string;
+      value_zh: string;
+      value_en: string;
+      sort_order: number;
+    }
+
+    // ===== 4. 页面配置 =====
+    interface ProductListSettings {
+      id?: number;
+      hero_title_zh: string;
+      hero_title_en: string;
+      hero_subtitle_zh: string;
+      hero_subtitle_en: string;
+      hero_bg_url: string;
+      columns: number;
+      show_series_filter: boolean;
+      default_sort: string;
+    }
+
+    interface NewsListSettings {
+      id?: number;
+      hero_title_zh: string;
+      hero_title_en: string;
+      hero_subtitle_zh: string;
+      hero_subtitle_en: string;
+      hero_bg_url: string;
+      page_size: number;
+      show_cover: boolean;
+      show_summary: boolean;
+    }
+
+    interface AboutSettings {
+      id?: number;
+      [key: string]: unknown;
+    }
+
+    interface SupportSettings {
+      id?: number;
+      [key: string]: unknown;
+    }
+
+    // ===== 5. 产品管理 =====
+    interface ProductSeries {
+      id: number;
+      name_zh: string;
+      name_en: string;
+      overline: string;
+      subtitle_zh: string;
+      subtitle_en: string;
+      cover_url: string;
+      sort_order: number;
+      is_visible: boolean;
+      created_at?: string;
+      updated_at?: string;
+    }
+
+    interface ProductSeriesPayload {
+      name_zh: string;
+      name_en: string;
+      overline?: string;
+      subtitle_zh?: string;
+      subtitle_en?: string;
+      cover_url?: string;
+      is_visible?: boolean;
+    }
+
+    interface Product {
+      id: number;
+      series_id: number;
+      name_zh: string;
+      name_en: string;
+      slug: string;
+      intro_zh: string;
+      intro_en: string;
+      cover_url: string;
+      is_visible: boolean;
+      sort_order: number;
+      series?: ProductSeries;
+      created_at?: string;
+      updated_at?: string;
+    }
+
+    interface ProductPayload {
+      series_id: number;
+      name_zh: string;
+      name_en: string;
+      slug: string;
+      intro_zh?: string;
+      intro_en?: string;
+      cover_url?: string;
+      is_visible?: boolean;
+    }
+
+    // ===== 6. 新闻管理 =====
+    interface NewsArticle {
+      id: number;
+      title_zh: string;
+      title_en: string;
+      slug: string;
+      summary_zh: string;
+      summary_en: string;
+      cover_url: string;
+      content_zh: string;
+      content_en: string;
+      status: 'draft' | 'published' | 'offline';
+      published_at: string | null;
+      created_at?: string;
+      updated_at?: string;
+    }
+
+    interface NewsArticlePayload {
+      title_zh: string;
+      title_en: string;
+      slug: string;
+      summary_zh?: string;
+      summary_en?: string;
+      cover_url?: string;
+      content_zh?: string;
+      content_en?: string;
+      status?: string;
+      published_at?: string | null;
+    }
+
+    // ===== 7. 素材库 =====
+    interface MediaItem {
+      id: number;
+      filename: string;
+      file_path: string;
+      file_type: 'image' | 'video' | 'file';
+      mime_type: string;
+      file_size: number;
+      width: number | null;
+      height: number | null;
+      category: string;
+      thumbnail_url: string;
+      webp_url: string;
+      ref_count: number;
+      tags: string[];
+      created_at?: string;
+    }
+
+    interface MediaTag {
+      id: number;
+      tag_name: string;
+    }
+
+    // ===== 8. 翻译管理 =====
+    interface I18nEntry {
+      id: number;
+      dict_key: string;
+      value_zh: string;
+      value_en: string;
+      description: string;
+    }
+
+    // ===== 9. 联系表单 =====
+    interface FormSettings {
+      id?: number;
+      recipient_email: string;
+      success_message_zh: string;
+      success_message_en: string;
+      error_message_zh: string;
+      error_message_en: string;
+      cooldown_seconds: number;
+    }
+
+    interface FormField {
+      id: number;
+      name_zh: string;
+      name_en: string;
+      field_type: 'text' | 'email' | 'phone' | 'textarea' | 'select';
+      is_required: boolean;
+      placeholder_zh: string;
+      placeholder_en: string;
+      options_json: string | null;
+      sort_order: number;
+    }
+
+    interface FormSubmission {
+      id: number;
+      form_data: Record<string, unknown>;
+      visitor_ip: string;
+      user_agent: string;
+      is_read: boolean;
+      submitted_at: string;
+    }
+
+    // ===== 10. 页面 SEO =====
+    interface PageSeo {
+      id?: number;
+      page_type: string;
+      entity_id?: number | null;
+      meta_title: string;
+      meta_description: string;
+      meta_keywords: string;
+      og_image_url: string;
+    }
+  }
+}
diff --git a/dashboard/frontend/src/typings/components.d.ts b/dashboard/frontend/src/typings/components.d.ts
index 04ca23f..ba7d237 100644
--- a/dashboard/frontend/src/typings/components.d.ts
+++ b/dashboard/frontend/src/typings/components.d.ts
@@ -68,10 +68,12 @@ declare module 'vue' {
     NNotificationProvider: typeof import('naive-ui')['NNotificationProvider']
     NPagination: typeof import('naive-ui')['NPagination']
     NProgress: typeof import('naive-ui')['NProgress']
+    NRadio: typeof import('naive-ui')['NRadio']
     NRadioButton: typeof import('naive-ui')['NRadioButton']
     NRadioGroup: typeof import('naive-ui')['NRadioGroup']
     NScrollbar: typeof import('naive-ui')['NScrollbar']
     NSelect: typeof import('naive-ui')['NSelect']
+    NSlider: typeof import('naive-ui')['NSlider']
     NSpace: typeof import('naive-ui')['NSpace']
     NSpin: typeof import('naive-ui')['NSpin']
     NSwitch: typeof import('naive-ui')['NSwitch']
@@ -156,10 +158,12 @@ declare global {
   const NNotificationProvider: typeof import('naive-ui')['NNotificationProvider']
   const NPagination: typeof import('naive-ui')['NPagination']
   const NProgress: typeof import('naive-ui')['NProgress']
+  const NRadio: typeof import('naive-ui')['NRadio']
   const NRadioButton: typeof import('naive-ui')['NRadioButton']
   const NRadioGroup: typeof import('naive-ui')['NRadioGroup']
   const NScrollbar: typeof import('naive-ui')['NScrollbar']
   const NSelect: typeof import('naive-ui')['NSelect']
+  const NSlider: typeof import('naive-ui')['NSlider']
   const NSpace: typeof import('naive-ui')['NSpace']
   const NSpin: typeof import('naive-ui')['NSpin']
   const NSwitch: typeof import('naive-ui')['NSwitch']
diff --git a/dashboard/frontend/src/typings/elegant-router.d.ts b/dashboard/frontend/src/typings/elegant-router.d.ts
index 9ba461e..4068b8d 100644
--- a/dashboard/frontend/src/typings/elegant-router.d.ts
+++ b/dashboard/frontend/src/typings/elegant-router.d.ts
@@ -36,6 +36,32 @@ declare module "@elegant-router/types" {
     "upgrade_blacklist": "/upgrade/blacklist";
     "upgrade_ota": "/upgrade/ota";
     "upgrade_ota-target-device": "/upgrade/ota-target-device";
+    "www": "/www";
+    "www_contact": "/www/contact";
+    "www_contact_settings": "/www/contact/settings";
+    "www_contact_submissions": "/www/contact/submissions";
+    "www_global": "/www/global";
+    "www_global_basic": "/www/global/basic";
+    "www_global_footer": "/www/global/footer";
+    "www_global_seo": "/www/global/seo";
+    "www_global_social": "/www/global/social";
+    "www_i18n": "/www/i18n";
+    "www_media": "/www/media";
+    "www_nav": "/www/nav";
+    "www_nav_appearance": "/www/nav/appearance";
+    "www_nav_items": "/www/nav/items";
+    "www_news": "/www/news";
+    "www_news_articles": "/www/news/articles";
+    "www_page": "/www/page";
+    "www_page_about": "/www/page/about";
+    "www_page_home": "/www/page/home";
+    "www_page_news-list": "/www/page/news-list";
+    "www_page_product-list": "/www/page/product-list";
+    "www_page_support": "/www/page/support";
+    "www_page-seo": "/www/page-seo";
+    "www_product": "/www/product";
+    "www_product_list": "/www/product/list";
+    "www_product_series": "/www/product/series";
   };
 
   /**
@@ -78,6 +104,7 @@ declare module "@elegant-router/types" {
     | "system"
     | "toolbox"
     | "upgrade"
+    | "www"
   >;
 
   /**
@@ -108,6 +135,25 @@ declare module "@elegant-router/types" {
     | "upgrade_blacklist"
     | "upgrade_ota-target-device"
     | "upgrade_ota"
+    | "www_contact_settings"
+    | "www_contact_submissions"
+    | "www_global_basic"
+    | "www_global_footer"
+    | "www_global_seo"
+    | "www_global_social"
+    | "www_i18n"
+    | "www_media"
+    | "www_nav_appearance"
+    | "www_nav_items"
+    | "www_news_articles"
+    | "www_page-seo"
+    | "www_page_about"
+    | "www_page_home"
+    | "www_page_news-list"
+    | "www_page_product-list"
+    | "www_page_support"
+    | "www_product_list"
+    | "www_product_series"
   >;
 
   /**
diff --git a/dashboard/frontend/src/views/www/contact/settings/index.vue b/dashboard/frontend/src/views/www/contact/settings/index.vue
new file mode 100644
index 0000000..f6a7478
--- /dev/null
+++ b/dashboard/frontend/src/views/www/contact/settings/index.vue
@@ -0,0 +1,262 @@
+<script setup lang="ts">
+import { h, onMounted, reactive, ref } from 'vue';
+import { NButton, NSpace, NSwitch, type DataTableColumns, type FormInst, type FormRules } from 'naive-ui';
+import {
+  fetchCreateFormField,
+  fetchDeleteFormField,
+  fetchGetFormFields,
+  fetchGetFormSettings,
+  fetchUpdateFormField,
+  fetchUpdateFormSettings
+} from '@/service/api';
+
+defineOptions({ name: 'WwwContactSettings' });
+
+const loading = ref(false);
+const saving = ref(false);
+const submitLoading = ref(false);
+const dialogVisible = ref(false);
+const dialogTitle = ref('');
+const formRef = ref<FormInst | null>(null);
+const tableData = ref<Api.Www.FormField[]>([]);
+
+const formData = reactive({
+  recipient_email: '',
+  success_message_zh: '感谢您的留言，我们会尽快回复！',
+  success_message_en: 'Thank you for your message. We will get back to you soon!',
+  error_message_zh: '提交失败，请稍后重试。',
+  error_message_en: 'Submission failed. Please try again later.',
+  cooldown_seconds: 60
+});
+
+const fieldFormData = reactive({
+  id: null as number | null,
+  name_zh: '',
+  name_en: '',
+  field_type: 'text' as 'text' | 'email' | 'phone' | 'textarea' | 'select',
+  is_required: true,
+  placeholder_zh: '',
+  placeholder_en: '',
+  options_json: ''
+});
+
+const fieldRules: FormRules = {
+  name_zh: [{ required: true, message: '请输入字段名称（中）', trigger: ['blur', 'input'] }],
+  name_en: [{ required: true, message: '请输入字段名称（英）', trigger: ['blur', 'input'] }]
+};
+
+const fieldTypeOptions = [
+  { label: '单行文本', value: 'text' },
+  { label: '邮箱', value: 'email' },
+  { label: '电话', value: 'phone' },
+  { label: '多行文本', value: 'textarea' },
+  { label: '下拉选择', value: 'select' }
+];
+
+const columns: DataTableColumns<Api.Www.FormField> = [
+  { title: '排序', key: 'sort_order', width: 60 },
+  { title: '名称（中）', key: 'name_zh', width: 100 },
+  { title: '名称（英）', key: 'name_en', width: 100 },
+  {
+    title: '类型',
+    key: 'field_type',
+    width: 100,
+    render(row) {
+      return fieldTypeOptions.find(o => o.value === row.field_type)?.label || row.field_type;
+    }
+  },
+  {
+    title: '必填',
+    key: 'is_required',
+    width: 60,
+    render(row) {
+      return h(NSwitch, {
+        value: row.is_required,
+        onUpdateValue: (val: boolean) => handleToggleRequired(row, val)
+      });
+    }
+  },
+  { title: '占位符（中）', key: 'placeholder_zh', ellipsis: { tooltip: true } },
+  {
+    title: '操作',
+    key: 'actions',
+    width: 140,
+    render(row) {
+      return h('div', { class: 'flex-y-center gap-8px' }, [
+        h(NButton, { size: 'small', type: 'primary', onClick: () => handleEditField(row) }, { default: () => '编辑' }),
+        h(NButton, { size: 'small', type: 'error', onClick: () => handleDeleteField(row) }, { default: () => '删除' })
+      ]);
+    }
+  }
+];
+
+async function loadData() {
+  loading.value = true;
+  const [settingsRes, fieldsRes] = await Promise.all([fetchGetFormSettings(), fetchGetFormFields()]);
+  loading.value = false;
+  if (!settingsRes.error && settingsRes.data) {
+    Object.assign(formData, settingsRes.data);
+  }
+  if (!fieldsRes.error && fieldsRes.data) {
+    tableData.value = fieldsRes.data.items || [];
+  }
+}
+
+async function handleSaveSettings() {
+  saving.value = true;
+  const { error } = await fetchUpdateFormSettings({ ...formData });
+  saving.value = false;
+  if (!error) {
+    window.$message?.success('保存成功');
+  }
+}
+
+function handleAddField() {
+  dialogTitle.value = '新增字段';
+  fieldFormData.id = null;
+  fieldFormData.name_zh = '';
+  fieldFormData.name_en = '';
+  fieldFormData.field_type = 'text';
+  fieldFormData.is_required = true;
+  fieldFormData.placeholder_zh = '';
+  fieldFormData.placeholder_en = '';
+  fieldFormData.options_json = '';
+  dialogVisible.value = true;
+}
+
+function handleEditField(row: Api.Www.FormField) {
+  dialogTitle.value = '编辑字段';
+  fieldFormData.id = row.id;
+  fieldFormData.name_zh = row.name_zh;
+  fieldFormData.name_en = row.name_en;
+  fieldFormData.field_type = row.field_type as 'text' | 'email' | 'phone' | 'textarea' | 'select';
+  fieldFormData.is_required = row.is_required;
+  fieldFormData.placeholder_zh = row.placeholder_zh;
+  fieldFormData.placeholder_en = row.placeholder_en;
+  fieldFormData.options_json = row.options_json || '';
+  dialogVisible.value = true;
+}
+
+async function handleToggleRequired(row: Api.Www.FormField, val: boolean) {
+  const { error } = await fetchUpdateFormField(row.id, { is_required: val });
+  if (!error) {
+    row.is_required = val;
+    window.$message?.success('已更新');
+  }
+}
+
+function handleDeleteField(row: Api.Www.FormField) {
+  window.$dialog?.warning({
+    title: '警告',
+    content: `确定要删除字段「${row.name_zh}」吗？`,
+    positiveText: '确定',
+    negativeText: '取消',
+    onPositiveClick: async () => {
+      const { error } = await fetchDeleteFormField(row.id);
+      if (!error) {
+        window.$message?.success('删除成功');
+        loadData();
+      }
+    }
+  });
+}
+
+async function handleSubmitField() {
+  await formRef.value?.validate();
+  submitLoading.value = true;
+  const { id, ...payload } = fieldFormData;
+  const { error } = id
+    ? await fetchUpdateFormField(id, payload)
+    : await fetchCreateFormField(payload);
+  submitLoading.value = false;
+  if (!error) {
+    window.$message?.success(id ? '更新成功' : '创建成功');
+    dialogVisible.value = false;
+    loadData();
+  }
+}
+
+onMounted(loadData);
+</script>
+
+<template>
+  <NSpace vertical :size="16">
+    <NCard :bordered="false" class="card-wrapper" title="表单全局配置" size="small" :loading="loading">
+      <NForm :model="formData" label-placement="left" label-width="140">
+        <NFormItem label="通知接收邮箱">
+          <NInput v-model:value="formData.recipient_email" placeholder="如：info@luxsin.com" class="w-300px" />
+        </NFormItem>
+        <NFormItem label="成功提示（中）">
+          <NInput v-model:value="formData.success_message_zh" class="w-500px" />
+        </NFormItem>
+        <NFormItem label="成功提示（英）">
+          <NInput v-model:value="formData.success_message_en" class="w-500px" />
+        </NFormItem>
+        <NFormItem label="失败提示（中）">
+          <NInput v-model:value="formData.error_message_zh" class="w-500px" />
+        </NFormItem>
+        <NFormItem label="失败提示（英）">
+          <NInput v-model:value="formData.error_message_en" class="w-500px" />
+        </NFormItem>
+        <NFormItem label="提交冷却时间（秒）">
+          <NInputNumber v-model:value="formData.cooldown_seconds" :min="0" :max="3600" />
+        </NFormItem>
+      </NForm>
+      <div class="flex justify-end">
+        <NButton type="primary" :loading="saving" @click="handleSaveSettings">
+          <template #icon><SvgIcon icon="mdi:content-save" /></template>
+          保存配置
+        </NButton>
+      </div>
+    </NCard>
+
+    <NCard :bordered="false" class="card-wrapper" title="表单字段" size="small">
+      <template #header-extra>
+        <NButton type="primary" @click="handleAddField">
+          <template #icon><SvgIcon icon="mdi:plus" /></template>
+          新增字段
+        </NButton>
+      </template>
+
+      <NDataTable :columns="columns" :data="tableData" :bordered="false" size="small" />
+    </NCard>
+
+    <NModal
+      v-model:show="dialogVisible"
+      preset="card"
+      :title="dialogTitle"
+      class="w-600px"
+      :mask-closable="false"
+    >
+      <NForm ref="formRef" :model="fieldFormData" :rules="fieldRules" label-placement="left" label-width="120">
+        <NFormItem label="字段名称（中）" path="name_zh">
+          <NInput v-model:value="fieldFormData.name_zh" maxlength="50" />
+        </NFormItem>
+        <NFormItem label="字段名称（英）" path="name_en">
+          <NInput v-model:value="fieldFormData.name_en" maxlength="50" />
+        </NFormItem>
+        <NFormItem label="字段类型">
+          <NSelect v-model:value="fieldFormData.field_type" :options="fieldTypeOptions" />
+        </NFormItem>
+        <NFormItem label="是否必填">
+          <NSwitch v-model:value="fieldFormData.is_required" />
+        </NFormItem>
+        <NFormItem label="占位符（中）">
+          <NInput v-model:value="fieldFormData.placeholder_zh" maxlength="200" />
+        </NFormItem>
+        <NFormItem label="占位符（英）">
+          <NInput v-model:value="fieldFormData.placeholder_en" maxlength="200" />
+        </NFormItem>
+        <NFormItem v-if="fieldFormData.field_type === 'select'" label="选项 JSON">
+          <NInput v-model:value="fieldFormData.options_json" type="textarea" :autosize="{ minRows: 3 }" placeholder='[{"label":"选项1","value":"1"}]' />
+        </NFormItem>
+      </NForm>
+      <template #footer>
+        <NSpace justify="end">
+          <NButton @click="dialogVisible = false">取消</NButton>
+          <NButton type="primary" :loading="submitLoading" @click="handleSubmitField">确定</NButton>
+        </NSpace>
+      </template>
+    </NModal>
+  </NSpace>
+</template>
diff --git a/dashboard/frontend/src/views/www/contact/submissions/index.vue b/dashboard/frontend/src/views/www/contact/submissions/index.vue
new file mode 100644
index 0000000..ba4b842
--- /dev/null
+++ b/dashboard/frontend/src/views/www/contact/submissions/index.vue
@@ -0,0 +1,187 @@
+<script setup lang="ts">
+import { computed, h, onMounted, reactive, ref } from 'vue';
+import { NButton, NSpace, NTag, type DataTableColumns } from 'naive-ui';
+import {
+  fetchDeleteSubmission,
+  fetchGetFormSubmissions,
+  fetchMarkSubmissionRead
+} from '@/service/api';
+
+defineOptions({ name: 'WwwContactSubmissions' });
+
+const loading = ref(false);
+const detailVisible = ref(false);
+const detailData = ref<Api.Www.FormSubmission | null>(null);
+const tableData = ref<Api.Www.FormSubmission[]>([]);
+
+const searchForm = reactive({
+  is_read: null as number | null
+});
+
+const pagination = reactive({
+  page: 1,
+  pageSize: 10,
+  itemCount: 0,
+  pageSizes: [10, 20, 50]
+});
+
+const readOptions = [
+  { label: '全部', value: null },
+  { label: '未读', value: 0 },
+  { label: '已读', value: 1 }
+];
+
+const columns = computed<DataTableColumns<Api.Www.FormSubmission>>(() => [
+  { title: 'ID', key: 'id', width: 60 },
+  {
+    title: '状态',
+    key: 'is_read',
+    width: 80,
+    render(row) {
+      return row.is_read
+        ? h(NTag, { type: 'default', size: 'small' }, { default: () => '已读' })
+        : h(NTag, { type: 'warning', size: 'small' }, { default: () => '未读' });
+    }
+  },
+  { title: 'IP', key: 'visitor_ip', width: 130 },
+  { title: '提交时间', key: 'submitted_at', width: 170 },
+  {
+    title: '操作',
+    key: 'actions',
+    width: 200,
+    fixed: 'right',
+    render(row) {
+      const buttons = [
+        h(NButton, { size: 'small', type: 'info', onClick: () => handleViewDetail(row) }, { default: () => '查看' })
+      ];
+      if (!row.is_read) {
+        buttons.push(h(NButton, { size: 'small', type: 'success', onClick: () => handleMarkRead(row) }, { default: () => '标记已读' }));
+      }
+      buttons.push(h(NButton, { size: 'small', type: 'error', onClick: () => handleDelete(row) }, { default: () => '删除' }));
+      return h('div', { class: 'flex-y-center gap-8px' }, buttons);
+    }
+  }
+]);
+
+async function loadData() {
+  loading.value = true;
+  const { data, error } = await fetchGetFormSubmissions({
+    skip: (pagination.page - 1) * pagination.pageSize,
+    limit: pagination.pageSize,
+    is_read: (searchForm.is_read ?? undefined) as 0 | 1 | undefined
+  });
+  loading.value = false;
+  if (!error && data) {
+    tableData.value = data.items || [];
+    pagination.itemCount = data.total || 0;
+  } else if (!error) {
+    tableData.value = [];
+    pagination.itemCount = 0;
+  }
+}
+
+function handleSearch() {
+  pagination.page = 1;
+  loadData();
+}
+
+function handleViewDetail(row: Api.Www.FormSubmission) {
+  detailData.value = row;
+  detailVisible.value = true;
+  if (!row.is_read) {
+    handleMarkRead(row);
+  }
+}
+
+async function handleMarkRead(row: Api.Www.FormSubmission) {
+  const { error } = await fetchMarkSubmissionRead(row.id);
+  if (!error) {
+    row.is_read = true;
+    window.$message?.success('已标记为已读');
+  }
+}
+
+function handleDelete(row: Api.Www.FormSubmission) {
+  window.$dialog?.warning({
+    title: '警告',
+    content: `确定要删除提交记录 #${row.id} 吗？`,
+    positiveText: '确定',
+    negativeText: '取消',
+    onPositiveClick: async () => {
+      const { error } = await fetchDeleteSubmission(row.id);
+      if (!error) {
+        window.$message?.success('删除成功');
+        loadData();
+      }
+    }
+  });
+}
+
+function handlePageChange(page: number) {
+  pagination.page = page;
+  loadData();
+}
+
+function handlePageSizeChange(pageSize: number) {
+  pagination.pageSize = pageSize;
+  pagination.page = 1;
+  loadData();
+}
+
+onMounted(loadData);
+</script>
+
+<template>
+  <NSpace vertical :size="16">
+    <NCard :bordered="false" class="card-wrapper" size="small">
+      <NForm inline :model="searchForm" label-placement="left">
+        <NFormItem label="状态">
+          <NRadioGroup :value="searchForm.is_read" @update:value="(v: number | null) => { searchForm.is_read = v; handleSearch(); }">
+            <NRadioButton :value="null as any">全部</NRadioButton>
+            <NRadioButton :value="0">未读</NRadioButton>
+            <NRadioButton :value="1">已读</NRadioButton>
+          </NRadioGroup>
+        </NFormItem>
+      </NForm>
+    </NCard>
+
+    <NCard :bordered="false" class="card-wrapper" title="提交记录" size="small">
+      <NDataTable :loading="loading" :columns="columns" :data="tableData" :bordered="false" size="small" />
+
+      <div class="mt-16px flex justify-end">
+        <NPagination
+          :page="pagination.page"
+          :page-size="pagination.pageSize"
+          :item-count="pagination.itemCount"
+          :page-sizes="pagination.pageSizes"
+          show-size-picker
+          :prefix="({ itemCount }) => `共 ${itemCount ?? 0} 条`"
+          @update:page="handlePageChange"
+          @update:page-size="handlePageSizeChange"
+        />
+      </div>
+    </NCard>
+
+    <NModal
+      v-model:show="detailVisible"
+      preset="card"
+      title="提交详情"
+      class="w-600px"
+    >
+      <template v-if="detailData">
+        <NSpace vertical :size="12">
+          <div><strong>ID：</strong>{{ detailData.id }}</div>
+          <div><strong>提交时间：</strong>{{ detailData.submitted_at }}</div>
+          <div><strong>访客 IP：</strong>{{ detailData.visitor_ip }}</div>
+          <div><strong>User-Agent：</strong>{{ detailData.user_agent }}</div>
+          <NDivider>表单数据</NDivider>
+          <NDescriptions :column="1" bordered>
+            <NDescriptionsItem v-for="(val, key) in detailData.form_data" :key="key" :label="String(key)">
+              {{ val }}
+            </NDescriptionsItem>
+          </NDescriptions>
+        </NSpace>
+      </template>
+    </NModal>
+  </NSpace>
+</template>
diff --git a/dashboard/frontend/src/views/www/global/basic/index.vue b/dashboard/frontend/src/views/www/global/basic/index.vue
new file mode 100644
index 0000000..12be7ae
--- /dev/null
+++ b/dashboard/frontend/src/views/www/global/basic/index.vue
@@ -0,0 +1,73 @@
+<script setup lang="ts">
+import { onMounted, reactive, ref } from 'vue';
+import { type FormInst, type FormRules } from 'naive-ui';
+import { fetchGetSiteSettings, fetchUpdateSiteSettings } from '@/service/api';
+
+defineOptions({ name: 'WwwGlobalBasic' });
+
+const formRef = ref<FormInst | null>(null);
+const loading = ref(false);
+const saving = ref(false);
+
+const formData = reactive({
+  site_title: '',
+  favicon_url: '',
+  logo_dark_url: '',
+  logo_light_url: ''
+});
+
+const rules: FormRules = {
+  site_title: [{ required: true, message: '请输入站点标题', trigger: ['blur', 'input'] }]
+};
+
+async function loadData() {
+  loading.value = true;
+  const { data, error } = await fetchGetSiteSettings();
+  loading.value = false;
+  if (!error && data) {
+    formData.site_title = data.site_title || '';
+    formData.favicon_url = data.favicon_url || '';
+    formData.logo_dark_url = data.logo_dark_url || '';
+    formData.logo_light_url = data.logo_light_url || '';
+  }
+}
+
+async function handleSave() {
+  await formRef.value?.validate();
+  saving.value = true;
+  const { error } = await fetchUpdateSiteSettings({ ...formData });
+  saving.value = false;
+  if (!error) {
+    window.$message?.success('保存成功');
+  }
+}
+
+onMounted(loadData);
+</script>
+
+<template>
+  <NCard :bordered="false" class="card-wrapper" title="站点信息" size="small" :loading="loading">
+    <NForm ref="formRef" :model="formData" :rules="rules" label-placement="left" label-width="120">
+      <NFormItem label="站点标题" path="site_title">
+        <NInput v-model:value="formData.site_title" maxlength="100" placeholder="如：乐笙 Luxsin" class="w-400px" />
+      </NFormItem>
+      <NFormItem label="Favicon" path="favicon_url">
+        <NInput v-model:value="formData.favicon_url" placeholder="素材路径，如 /uploads/brand/favicon.svg" class="w-400px" />
+      </NFormItem>
+      <NFormItem label="Logo（深色版）" path="logo_dark_url">
+        <NInput v-model:value="formData.logo_dark_url" placeholder="浅色区块上用的 Logo 路径" class="w-400px" />
+      </NFormItem>
+      <NFormItem label="Logo（浅色版）" path="logo_light_url">
+        <NInput v-model:value="formData.logo_light_url" placeholder="深色区块上用的 Logo 路径" class="w-400px" />
+      </NFormItem>
+    </NForm>
+    <div class="flex justify-end">
+      <NButton type="primary" :loading="saving" @click="handleSave">
+        <template #icon>
+          <SvgIcon icon="mdi:content-save" />
+        </template>
+        保存
+      </NButton>
+    </div>
+  </NCard>
+</template>
diff --git a/dashboard/frontend/src/views/www/global/footer/index.vue b/dashboard/frontend/src/views/www/global/footer/index.vue
new file mode 100644
index 0000000..f13ede5
--- /dev/null
+++ b/dashboard/frontend/src/views/www/global/footer/index.vue
@@ -0,0 +1,77 @@
+<script setup lang="ts">
+import { onMounted, reactive, ref } from 'vue';
+import { type FormInst } from 'naive-ui';
+import { fetchGetFooterSettings, fetchUpdateFooterSettings } from '@/service/api';
+
+defineOptions({ name: 'WwwGlobalFooter' });
+
+const formRef = ref<FormInst | null>(null);
+const loading = ref(false);
+const saving = ref(false);
+
+const formData = reactive({
+  company_name: '',
+  company_address: '',
+  contact_phone: '',
+  contact_email: '',
+  copyright_text: '',
+  icp_number: '',
+  police_number: ''
+});
+
+async function loadData() {
+  loading.value = true;
+  const { data, error } = await fetchGetFooterSettings();
+  loading.value = false;
+  if (!error && data) {
+    Object.assign(formData, data);
+  }
+}
+
+async function handleSave() {
+  saving.value = true;
+  const { error } = await fetchUpdateFooterSettings({ ...formData });
+  saving.value = false;
+  if (!error) {
+    window.$message?.success('保存成功');
+  }
+}
+
+onMounted(loadData);
+</script>
+
+<template>
+  <NCard :bordered="false" class="card-wrapper" title="页脚配置" size="small" :loading="loading">
+    <NForm ref="formRef" :model="formData" label-placement="left" label-width="120">
+      <NFormItem label="公司名称">
+        <NInput v-model:value="formData.company_name" maxlength="200" class="w-500px" />
+      </NFormItem>
+      <NFormItem label="公司地址">
+        <NInput v-model:value="formData.company_address" maxlength="500" class="w-500px" />
+      </NFormItem>
+      <NFormItem label="联系电话">
+        <NInput v-model:value="formData.contact_phone" maxlength="50" class="w-300px" />
+      </NFormItem>
+      <NFormItem label="联系邮箱">
+        <NInput v-model:value="formData.contact_email" maxlength="100" class="w-300px" />
+      </NFormItem>
+      <NFormItem label="版权文字">
+        <NInput v-model:value="formData.copyright_text" maxlength="200" class="w-500px" />
+      </NFormItem>
+      <NFormItem label="ICP 备案号">
+        <NInput v-model:value="formData.icp_number" maxlength="50" class="w-300px" />
+      </NFormItem>
+      <NFormItem label="公安备案号">
+        <NInput v-model:value="formData.police_number" maxlength="50" class="w-300px" />
+      </NFormItem>
+    </NForm>
+    <div class="flex justify-end">
+      <NButton type="primary" :loading="saving" @click="handleSave">
+        <template #icon>
+          <SvgIcon icon="mdi:content-save" />
+        </template>
+        保存
+      </NButton>
+    </div>
+  </NCard>
+</template>
diff --git a/dashboard/frontend/src/views/www/global/seo/index.vue b/dashboard/frontend/src/views/www/global/seo/index.vue
new file mode 100644
index 0000000..75fb09d
--- /dev/null
+++ b/dashboard/frontend/src/views/www/global/seo/index.vue
@@ -0,0 +1,59 @@
+<script setup lang="ts">
+import { onMounted, reactive, ref } from 'vue';
+import { fetchGetSeoDefaults, fetchUpdateSeoDefaults } from '@/service/api';
+
+defineOptions({ name: 'WwwGlobalSeo' });
+
+const loading = ref(false);
+const saving = ref(false);
+
+const formData = reactive({
+  meta_description: '',
+  meta_keywords: '',
+  og_image_url: ''
+});
+
+async function loadData() {
+  loading.value = true;
+  const { data, error } = await fetchGetSeoDefaults();
+  loading.value = false;
+  if (!error && data) {
+    Object.assign(formData, data);
+  }
+}
+
+async function handleSave() {
+  saving.value = true;
+  const { error } = await fetchUpdateSeoDefaults({ ...formData });
+  saving.value = false;
+  if (!error) {
+    window.$message?.success('保存成功');
+  }
+}
+
+onMounted(loadData);
+</script>
+
+<template>
+  <NCard :bordered="false" class="card-wrapper" title="SEO 默认值" size="small" :loading="loading">
+    <NForm :model="formData" label-placement="left" label-width="120">
+      <NFormItem label="默认描述">
+        <NInput v-model:value="formData.meta_description" type="textarea" :autosize="{ minRows: 2, maxRows: 4 }" maxlength="160" class="w-500px" />
+      </NFormItem>
+      <NFormItem label="默认关键词">
+        <NInput v-model:value="formData.meta_keywords" placeholder="逗号分隔，如：DAC,DMP,HiFi,音频" maxlength="300" class="w-500px" />
+      </NFormItem>
+      <NFormItem label="OG 默认图片">
+        <NInput v-model:value="formData.og_image_url" placeholder="素材路径，如 /uploads/brand/og-default.jpg" class="w-500px" />
+      </NFormItem>
+    </NForm>
+    <div class="flex justify-end">
+      <NButton type="primary" :loading="saving" @click="handleSave">
+        <template #icon>
+          <SvgIcon icon="mdi:content-save" />
+        </template>
+        保存
+      </NButton>
+    </div>
+  </NCard>
+</template>
diff --git a/dashboard/frontend/src/views/www/global/social/index.vue b/dashboard/frontend/src/views/www/global/social/index.vue
new file mode 100644
index 0000000..70f19f7
--- /dev/null
+++ b/dashboard/frontend/src/views/www/global/social/index.vue
@@ -0,0 +1,111 @@
+<script setup lang="ts">
+import { h, onMounted, ref } from 'vue';
+import { NButton, NSpace, NTag, type DataTableColumns } from 'naive-ui';
+import { fetchGetSocialLinks, fetchUpdateSocialLinks } from '@/service/api';
+
+defineOptions({ name: 'WwwGlobalSocial' });
+
+const loading = ref(false);
+const saving = ref(false);
+const tableData = ref<Api.Www.SocialLink[]>([]);
+
+const platformOptions = [
+  { label: '微信', value: 'wechat' },
+  { label: '微博', value: 'weibo' },
+  { label: '哔哩哔哩', value: 'bilibili' },
+  { label: 'YouTube', value: 'youtube' },
+  { label: 'Instagram', value: 'instagram' },
+  { label: 'Facebook', value: 'facebook' },
+  { label: 'X (Twitter)', value: 'twitter' },
+  { label: 'TikTok', value: 'tiktok' }
+];
+
+function platformLabel(val: string) {
+  return platformOptions.find(o => o.value === val)?.label || val;
+}
+
+const columns: DataTableColumns<Api.Www.SocialLink> = [
+  { title: '平台', key: 'platform', width: 120, render: row => platformLabel(row.platform) },
+  { title: '链接 URL', key: 'url', ellipsis: { tooltip: true } },
+  {
+    title: '二维码',
+    key: 'qrcode_url',
+    width: 100,
+    render(row) {
+      return row.qrcode_url ? h(NTag, { type: 'success', size: 'small' }, { default: () => '已上传' }) : '-';
+    }
+  },
+  {
+    title: '操作',
+    key: 'actions',
+    width: 120,
+    render(row, index) {
+      return h(NButton, { size: 'small', type: 'error', onClick: () => handleRemove(index) }, { default: () => '移除' });
+    }
+  }
+];
+
+function handleAdd() {
+  tableData.value.push({ platform: 'wechat', url: '', qrcode_url: '', sort_order: tableData.value.length + 1 });
+}
+
+function handleRemove(index: number) {
+  tableData.value.splice(index, 1);
+}
+
+async function loadData() {
+  loading.value = true;
+  const { data, error } = await fetchGetSocialLinks();
+  loading.value = false;
+  if (!error && data) {
+    tableData.value = data;
+  }
+}
+
+async function handleSave() {
+  saving.value = true;
+  const payload = tableData.value.map((item: Api.Www.SocialLink) => ({
+    platform: item.platform,
+    url: item.url,
+    qrcode_url: item.qrcode_url
+  }));
+  const { error } = await fetchUpdateSocialLinks(payload);
+  saving.value = false;
+  if (!error) {
+    window.$message?.success('保存成功');
+    loadData();
+  }
+}
+
+onMounted(loadData);
+</script>
+
+<template>
+  <NCard :bordered="false" class="card-wrapper" title="社交链接" size="small" :loading="loading">
+    <template #header-extra>
+      <NSpace>
+        <NButton type="primary" @click="handleAdd">
+          <template #icon>
+            <SvgIcon icon="mdi:plus" />
+          </template>
+          添加
+        </NButton>
+        <NButton type="success" :loading="saving" @click="handleSave">
+          <template #icon>
+            <SvgIcon icon="mdi:content-save" />
+          </template>
+          保存
+        </NButton>
+      </NSpace>
+    </template>
+
+    <NDataTable :columns="columns" :data="tableData" :bordered="false" size="small">
+      <template #empty>
+        <NSpace vertical align="center" class="py-20px">
+          <span>暂无社交链接</span>
+          <NButton type="primary" size="small" @click="handleAdd">添加第一个</NButton>
+        </NSpace>
+      </template>
+    </NDataTable>
+  </NCard>
+</template>
diff --git a/dashboard/frontend/src/views/www/i18n/index.vue b/dashboard/frontend/src/views/www/i18n/index.vue
new file mode 100644
index 0000000..74c1213
--- /dev/null
+++ b/dashboard/frontend/src/views/www/i18n/index.vue
@@ -0,0 +1,124 @@
+<script setup lang="ts">
+import { h, onMounted, reactive, ref } from 'vue';
+import { NButton, NInput, NSpace, type DataTableColumns } from 'naive-ui';
+import { fetchGetI18nEntries, fetchUpdateI18nEntry } from '@/service/api';
+
+defineOptions({ name: 'WwwI18n' });
+
+const loading = ref(false);
+const saving = ref(false);
+const tableData = ref<Api.Www.I18nEntry[]>([]);
+const searchKeyword = ref('');
+const editingId = ref<number | null>(null);
+const editValue = reactive({ value_zh: '', value_en: '' });
+
+async function loadData() {
+  loading.value = true;
+  const { data, error } = await fetchGetI18nEntries({ keyword: searchKeyword.value || undefined });
+  loading.value = false;
+  if (!error && data) {
+    tableData.value = data.items || [];
+  }
+}
+
+function handleSearch() {
+  loadData();
+}
+
+function handleEdit(row: Api.Www.I18nEntry) {
+  editingId.value = row.id;
+  editValue.value_zh = row.value_zh;
+  editValue.value_en = row.value_en;
+}
+
+function handleCancelEdit() {
+  editingId.value = null;
+}
+
+async function handleSave(row: Api.Www.I18nEntry) {
+  saving.value = true;
+  const { error } = await fetchUpdateI18nEntry(row.id, { ...editValue });
+  saving.value = false;
+  if (!error) {
+    row.value_zh = editValue.value_zh;
+    row.value_en = editValue.value_en;
+    window.$message?.success('保存成功');
+    editingId.value = null;
+  }
+}
+
+const columns: DataTableColumns<Api.Www.I18nEntry> = [
+  { title: 'ID', key: 'id', width: 60 },
+  { title: 'Key', key: 'dict_key', width: 200, ellipsis: { tooltip: true } },
+  {
+    title: '中文值',
+    key: 'value_zh',
+    render(row) {
+      if (editingId.value === row.id) {
+        return h(NInput, {
+          value: editValue.value_zh,
+          'onUpdate:value': (v: string) => (editValue.value_zh = v),
+          size: 'small'
+        });
+      }
+      return row.value_zh || '-';
+    }
+  },
+  {
+    title: '英文值',
+    key: 'value_en',
+    render(row) {
+      if (editingId.value === row.id) {
+        return h(NInput, {
+          value: editValue.value_en,
+          'onUpdate:value': (v: string) => (editValue.value_en = v),
+          size: 'small'
+        });
+      }
+      return row.value_en || '-';
+    }
+  },
+  { title: '说明', key: 'description', width: 150, ellipsis: { tooltip: true } },
+  {
+    title: '操作',
+    key: 'actions',
+    width: 150,
+    fixed: 'right',
+    render(row) {
+      if (editingId.value === row.id) {
+        return h(NSpace, { size: 4 }, {
+          default: () => [
+            h(NButton, { size: 'small', type: 'primary', loading: saving.value, onClick: () => handleSave(row) }, { default: () => '保存' }),
+            h(NButton, { size: 'small', onClick: handleCancelEdit }, { default: () => '取消' })
+          ]
+        });
+      }
+      return h(NButton, { size: 'small', type: 'primary', onClick: () => handleEdit(row) }, { default: () => '编辑' });
+    }
+  }
+];
+
+onMounted(loadData);
+</script>
+
+<template>
+  <NSpace vertical :size="16">
+    <NCard :bordered="false" class="card-wrapper" size="small">
+      <NForm inline label-placement="left">
+        <NFormItem label="关键词">
+          <NInput v-model:value="searchKeyword" clearable placeholder="搜索 Key 或值" class="w-300px" @keyup.enter="handleSearch" />
+        </NFormItem>
+        <NFormItem>
+          <NButton type="primary" @click="handleSearch">
+            <template #icon><SvgIcon icon="mdi:magnify" /></template>
+            搜索
+          </NButton>
+        </NFormItem>
+      </NForm>
+    </NCard>
+
+    <NCard :bordered="false" class="card-wrapper" title="翻译词条" size="small">
+      <NDataTable :loading="loading" :columns="columns" :data="tableData" :bordered="false" size="small" />
+    </NCard>
+  </NSpace>
+</template>
diff --git a/dashboard/frontend/src/views/www/media/index.vue b/dashboard/frontend/src/views/www/media/index.vue
new file mode 100644
index 0000000..35639f5
--- /dev/null
+++ b/dashboard/frontend/src/views/www/media/index.vue
@@ -0,0 +1,247 @@
+<script setup lang="ts">
+import { computed, h, onMounted, reactive, ref } from 'vue';
+import { NButton, NSpace, NTag, NUpload, type DataTableColumns, type UploadCustomRequestOptions } from 'naive-ui';
+import {
+  fetchDeleteMediaItem,
+  fetchGetMedia,
+  fetchGetMediaTags,
+  fetchUploadMedia
+} from '@/service/api';
+
+defineOptions({ name: 'WwwMedia' });
+
+const loading = ref(false);
+const tableData = ref<Api.Www.MediaItem[]>([]);
+const tagOptions = ref<Api.Www.MediaTag[]>([]);
+
+const searchForm = reactive({
+  category: null as string | null,
+  file_type: null as string | null,
+  keyword: ''
+});
+
+const pagination = reactive({
+  page: 1,
+  pageSize: 20,
+  itemCount: 0,
+  pageSizes: [20, 50, 100]
+});
+
+const categoryOptions = [
+  { label: '产品', value: 'product' },
+  { label: '横幅', value: 'banner' },
+  { label: '新闻', value: 'news' },
+  { label: '品牌', value: 'brand' },
+  { label: '视频', value: 'video' },
+  { label: '文档', value: 'document' },
+  { label: '其他', value: 'other' }
+];
+
+const fileTypeOptions = [
+  { label: '图片', value: 'image' },
+  { label: '视频', value: 'video' },
+  { label: '文件', value: 'file' }
+];
+
+function formatSize(bytes: number) {
+  if (bytes < 1024) return `${bytes} B`;
+  if (bytes < 1024 * 1024) return `${(bytes / 1024).toFixed(1)} KB`;
+  return `${(bytes / (1024 * 1024)).toFixed(1)} MB`;
+}
+
+function categoryLabel(val: string) {
+  return categoryOptions.find(o => o.value === val)?.label || val;
+}
+
+const columns = computed<DataTableColumns<Api.Www.MediaItem>>(() => [
+  { title: 'ID', key: 'id', width: 60 },
+  {
+    title: '预览',
+    key: 'thumbnail_url',
+    width: 80,
+    render(row) {
+      if (row.file_type === 'image' && (row.thumbnail_url || row.file_path)) {
+        return h('img', {
+          src: row.thumbnail_url || row.file_path,
+          alt: row.filename,
+          style: 'width: 48px; height: 48px; object-fit: cover; border-radius: 4px;'
+        });
+      }
+      return h(NTag, { size: 'small' }, { default: () => row.file_type });
+    }
+  },
+  { title: '文件名', key: 'filename', ellipsis: { tooltip: true } },
+  {
+    title: '类型',
+    key: 'file_type',
+    width: 80,
+    render(row) {
+      const map: Record<string, 'success' | 'info' | 'warning'> = { image: 'success', video: 'info', file: 'warning' };
+      return h(NTag, { type: map[row.file_type] || 'default', size: 'small' }, { default: () => row.file_type });
+    }
+  },
+  { title: '分类', key: 'category', width: 80, render: row => categoryLabel(row.category) },
+  { title: '大小', key: 'file_size', width: 100, render: row => formatSize(row.file_size) },
+  {
+    title: '标签',
+    key: 'tags',
+    width: 150,
+    render(row) {
+      if (!row.tags?.length) return '-';
+      return h(NSpace, { size: 4 }, { default: () => row.tags.map(t => h(NTag, { size: 'small' }, { default: () => t })) });
+    }
+  },
+  { title: '引用', key: 'ref_count', width: 60 },
+  {
+    title: '操作',
+    key: 'actions',
+    width: 100,
+    fixed: 'right',
+    render(row) {
+      return h(NButton, {
+        size: 'small',
+        type: 'error',
+        onClick: () => handleDelete(row)
+      }, { default: () => '删除' });
+    }
+  }
+]);
+
+async function loadData() {
+  loading.value = true;
+  const { data, error } = await fetchGetMedia({
+    skip: (pagination.page - 1) * pagination.pageSize,
+    limit: pagination.pageSize,
+    category: searchForm.category || undefined,
+    file_type: searchForm.file_type || undefined,
+    keyword: searchForm.keyword || undefined
+  });
+  loading.value = false;
+  if (!error && data) {
+    tableData.value = data.items || [];
+    pagination.itemCount = data.total || 0;
+  } else if (!error) {
+    tableData.value = [];
+    pagination.itemCount = 0;
+  }
+}
+
+async function loadTags() {
+  const { data, error } = await fetchGetMediaTags();
+  if (!error && data) {
+    tagOptions.value = data;
+  }
+}
+
+function handleSearch() {
+  pagination.page = 1;
+  loadData();
+}
+
+function handleReset() {
+  searchForm.category = null;
+  searchForm.file_type = null;
+  searchForm.keyword = '';
+  pagination.page = 1;
+  loadData();
+}
+
+async function handleUpload({ file, onFinish, onError }: UploadCustomRequestOptions) {
+  const { error } = await fetchUploadMedia(file.file as File);
+  if (!error) {
+    window.$message?.success(`${file.name} 上传成功`);
+    onFinish();
+    loadData();
+  } else {
+    onError();
+  }
+}
+
+function handleDelete(row: Api.Www.MediaItem) {
+  window.$dialog?.warning({
+    title: '警告',
+    content: `确定要删除素材「${row.filename}」吗？${row.ref_count > 0 ? `该素材有 ${row.ref_count} 处引用。` : ''}`,
+    positiveText: '确定',
+    negativeText: '取消',
+    onPositiveClick: async () => {
+      const { error } = await fetchDeleteMediaItem(row.id);
+      if (!error) {
+        window.$message?.success('删除成功');
+        loadData();
+      }
+    }
+  });
+}
+
+function handlePageChange(page: number) {
+  pagination.page = page;
+  loadData();
+}
+
+function handlePageSizeChange(pageSize: number) {
+  pagination.pageSize = pageSize;
+  pagination.page = 1;
+  loadData();
+}
+
+onMounted(() => {
+  loadTags();
+  loadData();
+});
+</script>
+
+<template>
+  <NSpace vertical :size="16">
+    <NCard :bordered="false" class="card-wrapper" size="small">
+      <NForm inline :model="searchForm" label-placement="left">
+        <NFormItem label="分类">
+          <NSelect v-model:value="searchForm.category" :options="categoryOptions" clearable placeholder="全部分类" class="w-150px" />
+        </NFormItem>
+        <NFormItem label="类型">
+          <NSelect v-model:value="searchForm.file_type" :options="fileTypeOptions" clearable placeholder="全部类型" class="w-120px" />
+        </NFormItem>
+        <NFormItem label="文件名">
+          <NInput v-model:value="searchForm.keyword" clearable placeholder="搜索文件名" class="w-200px" @keyup.enter="handleSearch" />
+        </NFormItem>
+        <NFormItem>
+          <NSpace>
+            <NButton type="primary" @click="handleSearch">
+              <template #icon><SvgIcon icon="mdi:magnify" /></template>
+              搜索
+            </NButton>
+            <NButton @click="handleReset">
+              <template #icon><SvgIcon icon="mdi:refresh" /></template>
+              重置
+            </NButton>
+          </NSpace>
+        </NFormItem>
+      </NForm>
+    </NCard>
+
+    <NCard :bordered="false" class="card-wrapper" title="素材列表" size="small">
+      <template #header-extra>
+        <NUpload :custom-request="handleUpload" :show-file-list="false" multiple>
+          <NButton type="primary">
+            <template #icon><SvgIcon icon="mdi:upload" /></template>
+            上传素材
+          </NButton>
+        </NUpload>
+      </template>
+
+      <NDataTable :loading="loading" :columns="columns" :data="tableData" :bordered="false" size="small" />
+
+      <div class="mt-16px flex justify-end">
+        <NPagination
+          :page="pagination.page"
+          :page-size="pagination.pageSize"
+          :item-count="pagination.itemCount"
+          :page-sizes="pagination.pageSizes"
+          show-size-picker
+          :prefix="({ itemCount }) => `共 ${itemCount ?? 0} 条`"
+          @update:page="handlePageChange"
+          @update:page-size="handlePageSizeChange"
+        />
+      </div>
+    </NCard>
+  </NSpace>
+</template>
diff --git a/dashboard/frontend/src/views/www/nav/appearance/index.vue b/dashboard/frontend/src/views/www/nav/appearance/index.vue
new file mode 100644
index 0000000..c68f8c9
--- /dev/null
+++ b/dashboard/frontend/src/views/www/nav/appearance/index.vue
@@ -0,0 +1,66 @@
+<script setup lang="ts">
+import { onMounted, reactive, ref } from 'vue';
+import { fetchGetNavAppearance, fetchUpdateNavAppearance } from '@/service/api';
+
+defineOptions({ name: 'WwwNavAppearance' });
+
+const loading = ref(false);
+const saving = ref(false);
+
+const formData = reactive({
+  homepage_style: 'transparent',
+  non_homepage_style: 'solid'
+});
+
+const styleOptions = [
+  { label: '透明', value: 'transparent' },
+  { label: '纯色', value: 'solid' },
+  { label: '毛玻璃', value: 'blur' }
+];
+
+async function loadData() {
+  loading.value = true;
+  const { data, error } = await fetchGetNavAppearance();
+  loading.value = false;
+  if (!error && data) {
+    formData.homepage_style = data.homepage_style || 'transparent';
+    formData.non_homepage_style = data.non_homepage_style || 'solid';
+  }
+}
+
+async function handleSave() {
+  saving.value = true;
+  const { error } = await fetchUpdateNavAppearance({ ...formData });
+  saving.value = false;
+  if (!error) {
+    window.$message?.success('保存成功');
+  }
+}
+
+onMounted(loadData);
+</script>
+
+<template>
+  <NCard :bordered="false" class="card-wrapper" title="导航外观" size="small" :loading="loading">
+    <NForm :model="formData" label-placement="left" label-width="140">
+      <NFormItem label="首页导航风格">
+        <NRadioGroup v-model:value="formData.homepage_style">
+          <NRadio v-for="opt in styleOptions" :key="opt.value" :value="opt.value">{{ opt.label }}</NRadio>
+        </NRadioGroup>
+      </NFormItem>
+      <NFormItem label="非首页导航风格">
+        <NRadioGroup v-model:value="formData.non_homepage_style">
+          <NRadio v-for="opt in styleOptions" :key="opt.value" :value="opt.value">{{ opt.label }}</NRadio>
+        </NRadioGroup>
+      </NFormItem>
+    </NForm>
+    <div class="flex justify-end">
+      <NButton type="primary" :loading="saving" @click="handleSave">
+        <template #icon>
+          <SvgIcon icon="mdi:content-save" />
+        </template>
+        保存
+      </NButton>
+    </div>
+  </NCard>
+</template>
diff --git a/dashboard/frontend/src/views/www/nav/items/index.vue b/dashboard/frontend/src/views/www/nav/items/index.vue
new file mode 100644
index 0000000..28ccb93
--- /dev/null
+++ b/dashboard/frontend/src/views/www/nav/items/index.vue
@@ -0,0 +1,224 @@
+<script setup lang="ts">
+import { h, onMounted, reactive, ref } from 'vue';
+import { NButton, NSpace, NSwitch, NTag, type DataTableColumns, type FormInst, type FormRules } from 'naive-ui';
+import {
+  fetchCreateNavItem,
+  fetchDeleteNavItem,
+  fetchGetNavItems,
+  fetchUpdateNavItem
+} from '@/service/api';
+
+defineOptions({ name: 'WwwNavItems' });
+
+const loading = ref(false);
+const submitLoading = ref(false);
+const dialogVisible = ref(false);
+const dialogTitle = ref('');
+const formRef = ref<FormInst | null>(null);
+const tableData = ref<Api.Www.NavItem[]>([]);
+
+const formData = reactive({
+  id: null as number | null,
+  name_zh: '',
+  name_en: '',
+  link: '/',
+  is_visible: true,
+  display_mode: 'text' as string,
+  icon_name: '',
+  image_url: '',
+  open_new_tab: false
+});
+
+const rules: FormRules = {
+  name_zh: [{ required: true, message: '请输入中文名称', trigger: ['blur', 'input'] }],
+  name_en: [{ required: true, message: '请输入英文名称', trigger: ['blur', 'input'] }],
+  link: [{ required: true, message: '请输入链接', trigger: ['blur', 'input'] }]
+};
+
+const columns: DataTableColumns<Api.Www.NavItem> = [
+  { title: 'ID', key: 'id', width: 60 },
+  { title: '中文名', key: 'name_zh', width: 120 },
+  { title: '英文名', key: 'name_en', width: 120 },
+  { title: '链接', key: 'link', ellipsis: { tooltip: true } },
+  {
+    title: '显示形式',
+    key: 'display_mode',
+    width: 100,
+    render(row) {
+      const map: Record<string, string> = { text: '文字', icon: '图标', image: '图片' };
+      return map[row.display_mode] || row.display_mode;
+    }
+  },
+  {
+    title: '可见',
+    key: 'is_visible',
+    width: 80,
+    render(row) {
+      return h(NSwitch, {
+        value: row.is_visible,
+        onUpdateValue: (val: boolean) => handleToggleVisible(row, val)
+      });
+    }
+  },
+  {
+    title: '新标签页',
+    key: 'open_new_tab',
+    width: 90,
+    render(row) {
+      return row.open_new_tab ? h(NTag, { type: 'info', size: 'small' }, { default: () => '是' }) : '否';
+    }
+  },
+  {
+    title: '操作',
+    key: 'actions',
+    width: 140,
+    fixed: 'right',
+    render(row) {
+      return h('div', { class: 'flex-y-center gap-8px' }, [
+        h(NButton, { size: 'small', type: 'primary', onClick: () => handleEdit(row) }, { default: () => '编辑' }),
+        h(NButton, { size: 'small', type: 'error', onClick: () => handleDelete(row) }, { default: () => '删除' })
+      ]);
+    }
+  }
+];
+
+async function loadData() {
+  loading.value = true;
+  const { data, error } = await fetchGetNavItems();
+  loading.value = false;
+  if (!error && data) {
+    tableData.value = data.items || [];
+  }
+}
+
+function handleAdd() {
+  dialogTitle.value = '新增导航入口';
+  formData.id = null;
+  formData.name_zh = '';
+  formData.name_en = '';
+  formData.link = '/';
+  formData.is_visible = true;
+  formData.display_mode = 'text';
+  formData.icon_name = '';
+  formData.image_url = '';
+  formData.open_new_tab = false;
+  dialogVisible.value = true;
+}
+
+function handleEdit(row: Api.Www.NavItem) {
+  dialogTitle.value = '编辑导航入口';
+  formData.id = row.id;
+  formData.name_zh = row.name_zh;
+  formData.name_en = row.name_en;
+  formData.link = row.link;
+  formData.is_visible = row.is_visible;
+  formData.display_mode = row.display_mode;
+  formData.icon_name = row.icon_name;
+  formData.image_url = row.image_url;
+  formData.open_new_tab = row.open_new_tab;
+  dialogVisible.value = true;
+}
+
+async function handleToggleVisible(row: Api.Www.NavItem, val: boolean) {
+  const { error } = await fetchUpdateNavItem(row.id, { is_visible: val });
+  if (!error) {
+    row.is_visible = val;
+    window.$message?.success('已更新');
+  }
+}
+
+function handleDelete(row: Api.Www.NavItem) {
+  window.$dialog?.warning({
+    title: '警告',
+    content: `确定要删除导航入口「${row.name_zh}」吗？`,
+    positiveText: '确定',
+    negativeText: '取消',
+    onPositiveClick: async () => {
+      const { error } = await fetchDeleteNavItem(row.id);
+      if (!error) {
+        window.$message?.success('删除成功');
+        loadData();
+      }
+    }
+  });
+}
+
+async function handleSubmit() {
+  await formRef.value?.validate();
+  submitLoading.value = true;
+  const { id, ...payload } = formData;
+  const { error } = id
+    ? await fetchUpdateNavItem(id, payload)
+    : await fetchCreateNavItem(payload);
+  submitLoading.value = false;
+  if (!error) {
+    window.$message?.success(id ? '更新成功' : '创建成功');
+    dialogVisible.value = false;
+    loadData();
+  }
+}
+
+onMounted(loadData);
+</script>
+
+<template>
+  <NSpace vertical :size="16">
+    <NCard :bordered="false" class="card-wrapper" title="导航入口" size="small">
+      <template #header-extra>
+        <NButton type="primary" @click="handleAdd">
+          <template #icon>
+            <SvgIcon icon="mdi:plus" />
+          </template>
+          新增入口
+        </NButton>
+      </template>
+
+      <NDataTable :loading="loading" :columns="columns" :data="tableData" :bordered="false" size="small" />
+    </NCard>
+
+    <NModal
+      v-model:show="dialogVisible"
+      preset="card"
+      :title="dialogTitle"
+      class="w-600px"
+      :mask-closable="false"
+    >
+      <NForm ref="formRef" :model="formData" :rules="rules" label-placement="left" label-width="100">
+        <NFormItem label="中文名称" path="name_zh">
+          <NInput v-model:value="formData.name_zh" maxlength="50" placeholder="如：产品" />
+        </NFormItem>
+        <NFormItem label="英文名称" path="name_en">
+          <NInput v-model:value="formData.name_en" maxlength="50" placeholder="如：Products" />
+        </NFormItem>
+        <NFormItem label="链接" path="link">
+          <NInput v-model:value="formData.link" placeholder="如：/products" />
+        </NFormItem>
+        <NFormItem label="显示形式">
+          <NRadioGroup v-model:value="formData.display_mode">
+            <NRadioButton value="text">文字</NRadioButton>
+            <NRadioButton value="icon">图标</NRadioButton>
+            <NRadioButton value="image">图片</NRadioButton>
+          </NRadioGroup>
+        </NFormItem>
+        <NFormItem v-if="formData.display_mode === 'icon'" label="图标名">
+          <NInput v-model:value="formData.icon_name" placeholder="如：mdi:package-variant-closed" />
+        </NFormItem>
+        <NFormItem v-if="formData.display_mode === 'image'" label="图片路径">
+          <NInput v-model:value="formData.image_url" placeholder="素材路径" />
+        </NFormItem>
+        <NFormItem label="是否可见">
+          <NSwitch v-model:value="formData.is_visible" />
+        </NFormItem>
+        <NFormItem label="新标签页打开">
+          <NSwitch v-model:value="formData.open_new_tab" />
+        </NFormItem>
+      </NForm>
+      <template #footer>
+        <NSpace justify="end">
+          <NButton @click="dialogVisible = false">取消</NButton>
+          <NButton type="primary" :loading="submitLoading" @click="handleSubmit">确定</NButton>
+        </NSpace>
+      </template>
+    </NModal>
+  </NSpace>
+</template>
diff --git a/dashboard/frontend/src/views/www/news/articles/index.vue b/dashboard/frontend/src/views/www/news/articles/index.vue
new file mode 100644
index 0000000..9bd6d14
--- /dev/null
+++ b/dashboard/frontend/src/views/www/news/articles/index.vue
@@ -0,0 +1,299 @@
+<script setup lang="ts">
+import { computed, h, onMounted, reactive, ref } from 'vue';
+import { NButton, NSpace, NTag, type DataTableColumns, type FormInst, type FormRules } from 'naive-ui';
+import {
+  fetchCreateNewsArticle,
+  fetchDeleteNewsArticle,
+  fetchGetNews,
+  fetchUpdateNewsArticle
+} from '@/service/api';
+
+defineOptions({ name: 'WwwNewsArticles' });
+
+const loading = ref(false);
+const submitLoading = ref(false);
+const dialogVisible = ref(false);
+const dialogTitle = ref('');
+const formRef = ref<FormInst | null>(null);
+const tableData = ref<Api.Www.NewsArticle[]>([]);
+
+const searchForm = reactive({
+  status: null as string | null,
+  title: ''
+});
+
+const pagination = reactive({
+  page: 1,
+  pageSize: 10,
+  itemCount: 0,
+  pageSizes: [10, 20, 50]
+});
+
+const formData = reactive({
+  id: null as number | null,
+  title_zh: '',
+  title_en: '',
+  slug: '',
+  summary_zh: '',
+  summary_en: '',
+  cover_url: '',
+  content_zh: '',
+  content_en: '',
+  status: 'draft' as string,
+  published_at: null as string | null
+});
+
+const rules: FormRules = {
+  title_zh: [{ required: true, message: '请输入标题（中）', trigger: ['blur', 'input'] }],
+  title_en: [{ required: true, message: '请输入标题（英）', trigger: ['blur', 'input'] }],
+  slug: [{ required: true, message: '请输入 URL 标识', trigger: ['blur', 'input'] }]
+};
+
+const statusOptions = [
+  { label: '草稿', value: 'draft' },
+  { label: '已发布', value: 'published' },
+  { label: '已下线', value: 'offline' }
+];
+
+function statusTagType(status: string): 'default' | 'success' | 'warning' {
+  if (status === 'published') return 'success';
+  if (status === 'offline') return 'warning';
+  return 'default';
+}
+
+function statusLabel(status: string) {
+  return statusOptions.find(o => o.value === status)?.label || status;
+}
+
+const columns = computed<DataTableColumns<Api.Www.NewsArticle>>(() => [
+  { title: 'ID', key: 'id', width: 60 },
+  { title: '标题（中）', key: 'title_zh', ellipsis: { tooltip: true } },
+  { title: '标题（英）', key: 'title_en', ellipsis: { tooltip: true } },
+  { title: 'Slug', key: 'slug', width: 150, ellipsis: { tooltip: true } },
+  {
+    title: '状态',
+    key: 'status',
+    width: 80,
+    render(row) {
+      return h(NTag, { type: statusTagType(row.status), size: 'small' }, { default: () => statusLabel(row.status) });
+    }
+  },
+  { title: '发布时间', key: 'published_at', width: 170, render: row => row.published_at || '-' },
+  {
+    title: '操作',
+    key: 'actions',
+    width: 140,
+    fixed: 'right',
+    render(row) {
+      return h('div', { class: 'flex-y-center gap-8px' }, [
+        h(NButton, { size: 'small', type: 'primary', onClick: () => handleEdit(row) }, { default: () => '编辑' }),
+        h(NButton, { size: 'small', type: 'error', onClick: () => handleDelete(row) }, { default: () => '删除' })
+      ]);
+    }
+  }
+]);
+
+async function loadData() {
+  loading.value = true;
+  const { data, error } = await fetchGetNews({
+    skip: (pagination.page - 1) * pagination.pageSize,
+    limit: pagination.pageSize,
+    status: searchForm.status || undefined,
+    title: searchForm.title || undefined
+  });
+  loading.value = false;
+  if (!error && data) {
+    tableData.value = data.items || [];
+    pagination.itemCount = data.total || 0;
+  } else if (!error) {
+    tableData.value = [];
+    pagination.itemCount = 0;
+  }
+}
+
+function handleSearch() {
+  pagination.page = 1;
+  loadData();
+}
+
+function handleReset() {
+  searchForm.status = null;
+  searchForm.title = '';
+  pagination.page = 1;
+  loadData();
+}
+
+function handleAdd() {
+  dialogTitle.value = '新增文章';
+  formData.id = null;
+  formData.title_zh = '';
+  formData.title_en = '';
+  formData.slug = '';
+  formData.summary_zh = '';
+  formData.summary_en = '';
+  formData.cover_url = '';
+  formData.content_zh = '';
+  formData.content_en = '';
+  formData.status = 'draft';
+  formData.published_at = null;
+  dialogVisible.value = true;
+}
+
+function handleEdit(row: Api.Www.NewsArticle) {
+  dialogTitle.value = '编辑文章';
+  formData.id = row.id;
+  formData.title_zh = row.title_zh;
+  formData.title_en = row.title_en;
+  formData.slug = row.slug;
+  formData.summary_zh = row.summary_zh;
+  formData.summary_en = row.summary_en;
+  formData.cover_url = row.cover_url;
+  formData.content_zh = row.content_zh;
+  formData.content_en = row.content_en;
+  formData.status = row.status;
+  formData.published_at = row.published_at;
+  dialogVisible.value = true;
+}
+
+function handleDelete(row: Api.Www.NewsArticle) {
+  window.$dialog?.warning({
+    title: '警告',
+    content: `确定要删除文章「${row.title_zh}」吗？`,
+    positiveText: '确定',
+    negativeText: '取消',
+    onPositiveClick: async () => {
+      const { error } = await fetchDeleteNewsArticle(row.id);
+      if (!error) {
+        window.$message?.success('删除成功');
+        loadData();
+      }
+    }
+  });
+}
+
+async function handleSubmit() {
+  await formRef.value?.validate();
+  submitLoading.value = true;
+  const { id, ...payload } = formData;
+  const { error } = id
+    ? await fetchUpdateNewsArticle(id, payload)
+    : await fetchCreateNewsArticle(payload);
+  submitLoading.value = false;
+  if (!error) {
+    window.$message?.success(id ? '更新成功' : '创建成功');
+    dialogVisible.value = false;
+    loadData();
+  }
+}
+
+function handlePageChange(page: number) {
+  pagination.page = page;
+  loadData();
+}
+
+function handlePageSizeChange(pageSize: number) {
+  pagination.pageSize = pageSize;
+  pagination.page = 1;
+  loadData();
+}
+
+onMounted(loadData);
+</script>
+
+<template>
+  <NSpace vertical :size="16">
+    <NCard :bordered="false" class="card-wrapper" size="small">
+      <NForm inline :model="searchForm" label-placement="left">
+        <NFormItem label="状态">
+          <NSelect v-model:value="searchForm.status" :options="statusOptions" clearable placeholder="全部" class="w-120px" />
+        </NFormItem>
+        <NFormItem label="标题">
+          <NInput v-model:value="searchForm.title" clearable placeholder="搜索标题" class="w-200px" @keyup.enter="handleSearch" />
+        </NFormItem>
+        <NFormItem>
+          <NSpace>
+            <NButton type="primary" @click="handleSearch">
+              <template #icon><SvgIcon icon="mdi:magnify" /></template>
+              搜索
+            </NButton>
+            <NButton @click="handleReset">
+              <template #icon><SvgIcon icon="mdi:refresh" /></template>
+              重置
+            </NButton>
+          </NSpace>
+        </NFormItem>
+      </NForm>
+    </NCard>
+
+    <NCard :bordered="false" class="card-wrapper" title="新闻文章" size="small">
+      <template #header-extra>
+        <NButton type="primary" @click="handleAdd">
+          <template #icon><SvgIcon icon="mdi:plus" /></template>
+          新增文章
+        </NButton>
+      </template>
+
+      <NDataTable :loading="loading" :columns="columns" :data="tableData" :bordered="false" size="small" />
+
+      <div class="mt-16px flex justify-end">
+        <NPagination
+          :page="pagination.page"
+          :page-size="pagination.pageSize"
+          :item-count="pagination.itemCount"
+          :page-sizes="pagination.pageSizes"
+          show-size-picker
+          :prefix="({ itemCount }) => `共 ${itemCount ?? 0} 条`"
+          @update:page="handlePageChange"
+          @update:page-size="handlePageSizeChange"
+        />
+      </div>
+    </NCard>
+
+    <NModal
+      v-model:show="dialogVisible"
+      preset="card"
+      :title="dialogTitle"
+      class="w-800px"
+      :mask-closable="false"
+    >
+      <NForm ref="formRef" :model="formData" :rules="rules" label-placement="left" label-width="100">
+        <NFormItem label="标题（中）" path="title_zh">
+          <NInput v-model:value="formData.title_zh" maxlength="200" />
+        </NFormItem>
+        <NFormItem label="标题（英）" path="title_en">
+          <NInput v-model:value="formData.title_en" maxlength="200" />
+        </NFormItem>
+        <NFormItem label="URL 标识" path="slug">
+          <NInput v-model:value="formData.slug" maxlength="200" placeholder="如：luxsin-dmp-a8-launch" />
+        </NFormItem>
+        <NFormItem label="摘要（中）">
+          <NInput v-model:value="formData.summary_zh" type="textarea" :autosize="{ minRows: 2 }" maxlength="300" />
+        </NFormItem>
+        <NFormItem label="摘要（英）">
+          <NInput v-model:value="formData.summary_en" type="textarea" :autosize="{ minRows: 2 }" maxlength="300" />
+        </NFormItem>
+        <NFormItem label="封面图">
+          <NInput v-model:value="formData.cover_url" placeholder="素材路径" />
+        </NFormItem>
+        <NFormItem label="正文（中）">
+          <NInput v-model:value="formData.content_zh" type="textarea" :autosize="{ minRows: 6, maxRows: 15 }" placeholder="支持 HTML" />
+        </NFormItem>
+        <NFormItem label="正文（英）">
+          <NInput v-model:value="formData.content_en" type="textarea" :autosize="{ minRows: 6, maxRows: 15 }" placeholder="支持 HTML" />
+        </NFormItem>
+        <NFormItem label="状态">
+          <NSelect v-model:value="formData.status" :options="statusOptions" />
+        </NFormItem>
+        <NFormItem label="发布时间">
+          <NDatePicker v-model:formatted-value="formData.published_at" type="datetime" value-format="yyyy-MM-dd'T'HH:mm:ssZ" clearable class="w-300px" />
+        </NFormItem>
+      </NForm>
+      <template #footer>
+        <NSpace justify="end">
+          <NButton @click="dialogVisible = false">取消</NButton>
+          <NButton type="primary" :loading="submitLoading" @click="handleSubmit">确定</NButton>
+        </NSpace>
+      </template>
+    </NModal>
+  </NSpace>
+</template>
diff --git a/dashboard/frontend/src/views/www/page-seo/index.vue b/dashboard/frontend/src/views/www/page-seo/index.vue
new file mode 100644
index 0000000..04d4317
--- /dev/null
+++ b/dashboard/frontend/src/views/www/page-seo/index.vue
@@ -0,0 +1,153 @@
+<script setup lang="ts">
+import { h, onMounted, reactive, ref } from 'vue';
+import { NButton, NSpace, type DataTableColumns } from 'naive-ui';
+import { fetchGetPageSeo, fetchUpdatePageSeo } from '@/service/api';
+
+defineOptions({ name: 'WwwPageSeo' });
+
+const loading = ref(false);
+const saving = ref(false);
+const dialogVisible = ref(false);
+const dialogTitle = ref('');
+const tableData = ref<Api.Www.PageSeo[]>([]);
+const selectedPageType = ref<string | null>(null);
+
+const formData = reactive({
+  id: null as number | null,
+  page_type: '',
+  entity_id: null as number | null,
+  meta_title: '',
+  meta_description: '',
+  meta_keywords: '',
+  og_image_url: ''
+});
+
+const pageTypeOptions = [
+  { label: '首页', value: 'home' },
+  { label: '产品列表页', value: 'products' },
+  { label: '产品详情页', value: 'product_detail' },
+  { label: '新闻列表页', value: 'news' },
+  { label: '新闻详情页', value: 'news_detail' },
+  { label: '关于我们', value: 'about' },
+  { label: '技术支持', value: 'support' }
+];
+
+const columns: DataTableColumns<Api.Www.PageSeo> = [
+  { title: '页面类型', key: 'page_type', width: 140 },
+  { title: '实体 ID', key: 'entity_id', width: 80, render: row => row.entity_id || '-' },
+  { title: 'Meta 标题', key: 'meta_title', ellipsis: { tooltip: true } },
+  { title: 'Meta 描述', key: 'meta_description', ellipsis: { tooltip: true } },
+  {
+    title: '操作',
+    key: 'actions',
+    width: 100,
+    render(row) {
+      return h(NButton, { size: 'small', type: 'primary', onClick: () => handleEdit(row) }, { default: () => '编辑' });
+    }
+  }
+];
+
+async function loadData() {
+  if (!selectedPageType.value) return;
+  loading.value = true;
+  const { data, error } = await fetchGetPageSeo({ page_type: selectedPageType.value });
+  loading.value = false;
+  if (!error && data) {
+    tableData.value = [data];
+  } else if (!error) {
+    tableData.value = [];
+  }
+}
+
+function handleEdit(row?: Api.Www.PageSeo) {
+  dialogTitle.value = row ? '编辑 SEO' : '配置 SEO';
+  formData.id = row?.id || null;
+  formData.page_type = row?.page_type || selectedPageType.value || '';
+  formData.entity_id = row?.entity_id || null;
+  formData.meta_title = row?.meta_title || '';
+  formData.meta_description = row?.meta_description || '';
+  formData.meta_keywords = row?.meta_keywords || '';
+  formData.og_image_url = row?.og_image_url || '';
+  dialogVisible.value = true;
+}
+
+async function handleSubmit() {
+  saving.value = true;
+  const { id, ...payload } = formData;
+  const { error } = await fetchUpdatePageSeo(payload);
+  saving.value = false;
+  if (!error) {
+    window.$message?.success('保存成功');
+    dialogVisible.value = false;
+    loadData();
+  }
+}
+
+onMounted(() => {
+  selectedPageType.value = 'home';
+  loadData();
+});
+</script>
+
+<template>
+  <NSpace vertical :size="16">
+    <NCard :bordered="false" class="card-wrapper" size="small">
+      <NForm inline label-placement="left">
+        <NFormItem label="页面类型">
+          <NSelect
+            v-model:value="selectedPageType"
+            :options="pageTypeOptions"
+            placeholder="选择页面类型"
+            class="w-200px"
+            @update:value="loadData"
+          />
+        </NFormItem>
+        <NFormItem>
+          <NButton type="primary" @click="handleEdit()">
+            <template #icon><SvgIcon icon="mdi:plus" /></template>
+            配置 SEO
+          </NButton>
+        </NFormItem>
+      </NForm>
+    </NCard>
+
+    <NCard :bordered="false" class="card-wrapper" title="页面 SEO 配置" size="small">
+      <NDataTable :loading="loading" :columns="columns" :data="tableData" :bordered="false" size="small" />
+    </NCard>
+
+    <NModal
+      v-model:show="dialogVisible"
+      preset="card"
+      :title="dialogTitle"
+      class="w-600px"
+      :mask-closable="false"
+    >
+      <NForm :model="formData" label-placement="left" label-width="120">
+        <NFormItem label="页面类型">
+          <NInput :value="pageTypeOptions.find(o => o.value === formData.page_type)?.label || formData.page_type" disabled />
+        </NFormItem>
+        <NFormItem v-if="formData.page_type === 'product_detail' || formData.page_type === 'news_detail'" label="实体 ID">
+          <NInputNumber v-model:value="formData.entity_id" :min="1" placeholder="产品或文章 ID" />
+        </NFormItem>
+        <NFormItem label="Meta 标题">
+          <NInput v-model:value="formData.meta_title" maxlength="200" />
+        </NFormItem>
+        <NFormItem label="Meta 描述">
+          <NInput v-model:value="formData.meta_description" type="textarea" :autosize="{ minRows: 2 }" maxlength="160" />
+        </NFormItem>
+        <NFormItem label="Meta 关键词">
+          <NInput v-model:value="formData.meta_keywords" maxlength="300" placeholder="逗号分隔" />
+        </NFormItem>
+        <NFormItem label="OG 图片">
+          <NInput v-model:value="formData.og_image_url" placeholder="素材路径" />
+        </NFormItem>
+      </NForm>
+      <template #footer>
+        <NSpace justify="end">
+          <NButton @click="dialogVisible = false">取消</NButton>
+          <NButton type="primary" :loading="saving" @click="handleSubmit">保存</NButton>
+        </NSpace>
+      </template>
+    </NModal>
+  </NSpace>
+</template>
diff --git a/dashboard/frontend/src/views/www/page/about/index.vue b/dashboard/frontend/src/views/www/page/about/index.vue
new file mode 100644
index 0000000..261dc68
--- /dev/null
+++ b/dashboard/frontend/src/views/www/page/about/index.vue
@@ -0,0 +1,44 @@
+<script setup lang="ts">
+import { onMounted, reactive, ref } from 'vue';
+import { fetchGetAboutSettings, fetchUpdateAboutSettings } from '@/service/api';
+
+defineOptions({ name: 'WwwPageAbout' });
+
+const loading = ref(false);
+const saving = ref(false);
+
+const formData = reactive<Record<string, unknown>>({});
+
+async function loadData() {
+  loading.value = true;
+  const { data, error } = await fetchGetAboutSettings();
+  loading.value = false;
+  if (!error && data) {
+    Object.assign(formData, data);
+    delete formData.id;
+  }
+}
+
+async function handleSave() {
+  saving.value = true;
+  const { error } = await fetchUpdateAboutSettings({ ...formData });
+  saving.value = false;
+  if (!error) {
+    window.$message?.success('保存成功');
+  }
+}
+
+onMounted(loadData);
+</script>
+
+<template>
+  <NCard :bordered="false" class="card-wrapper" title="关于我们" size="small" :loading="loading">
+    <NEmpty description="关于我们页面配置为动态 JSON 结构，请使用 JSON 编辑器编辑" />
+    <div class="mt-16px flex justify-end">
+      <NButton type="primary" :loading="saving" @click="handleSave">
+        <template #icon><SvgIcon icon="mdi:content-save" /></template>
+        保存
+      </NButton>
+    </div>
+  </NCard>
+</template>
diff --git a/dashboard/frontend/src/views/www/page/home/index.vue b/dashboard/frontend/src/views/www/page/home/index.vue
new file mode 100644
index 0000000..382fac4
--- /dev/null
+++ b/dashboard/frontend/src/views/www/page/home/index.vue
@@ -0,0 +1,338 @@
+<script setup lang="ts">
+import { h, onMounted, reactive, ref } from 'vue';
+import { NButton, NSpace, NSwitch, NTag, type DataTableColumns, type FormInst } from 'naive-ui';
+import {
+  fetchCreateSection,
+  fetchDeleteSection,
+  fetchGetSections,
+  fetchUpdateSection
+} from '@/service/api';
+
+defineOptions({ name: 'WwwPageHome' });
+
+const loading = ref(false);
+const submitLoading = ref(false);
+const dialogVisible = ref(false);
+const dialogTitle = ref('');
+const formRef = ref<FormInst | null>(null);
+const tableData = ref<Api.Www.SectionBlock[]>([]);
+
+const layoutOptions = [
+  { label: 'Hero Split', value: 'hero_split' },
+  { label: 'Full Width Banner', value: 'full_banner' },
+  { label: 'Feature Grid', value: 'feature_grid' },
+  { label: 'Split Content', value: 'split_content' },
+  { label: 'Gallery', value: 'gallery' },
+  { label: 'Stats', value: 'stats' },
+  { label: 'Video Showcase', value: 'video_showcase' },
+  { label: 'Scroll Narrative', value: 'scroll_narrative' },
+  { label: 'Quote', value: 'quote' },
+  { label: 'Spec Table', value: 'spec_table' }
+];
+
+const themeOptions = [
+  { label: '浅色', value: 'light' },
+  { label: '深色', value: 'dark' }
+];
+
+const formData = reactive({
+  id: null as number | null,
+  layout: 'hero_split',
+  theme: 'light',
+  bg_type: 'color',
+  bg_value: '',
+  overlay_enabled: false,
+  overlay_opacity: 0,
+  overline_zh: '',
+  overline_en: '',
+  title_zh: '',
+  title_en: '',
+  subtitle_zh: '',
+  subtitle_en: '',
+  content_zh: '',
+  content_en: '',
+  cta_primary_zh: '',
+  cta_primary_en: '',
+  cta_primary_url: '',
+  cta_secondary_zh: '',
+  cta_secondary_en: '',
+  cta_secondary_url: '',
+  media_url_zh: '',
+  media_url_en: '',
+  video_url: '',
+  is_visible: true
+});
+
+const columns: DataTableColumns<Api.Www.SectionBlock> = [
+  { title: '排序', key: 'sort_order', width: 60 },
+  { title: '布局', key: 'layout', width: 130 },
+  {
+    title: '主题',
+    key: 'theme',
+    width: 80,
+    render(row) {
+      return h(NTag, { type: row.theme === 'dark' ? 'default' : 'success', size: 'small' }, {
+        default: () => (row.theme === 'dark' ? '深色' : '浅色')
+      });
+    }
+  },
+  { title: '标题（中）', key: 'title_zh', ellipsis: { tooltip: true } },
+  { title: '标题（英）', key: 'title_en', ellipsis: { tooltip: true } },
+  {
+    title: '可见',
+    key: 'is_visible',
+    width: 80,
+    render(row) {
+      return h(NSwitch, {
+        value: row.is_visible,
+        onUpdateValue: (val: boolean) => handleToggleVisible(row, val)
+      });
+    }
+  },
+  {
+    title: '操作',
+    key: 'actions',
+    width: 180,
+    fixed: 'right',
+    render(row) {
+      return h('div', { class: 'flex-y-center gap-8px' }, [
+        h(NButton, { size: 'small', type: 'primary', onClick: () => handleEdit(row) }, { default: () => '编辑' }),
+        h(NButton, { size: 'small', type: 'error', onClick: () => handleDelete(row) }, { default: () => '删除' })
+      ]);
+    }
+  }
+];
+
+async function loadData() {
+  loading.value = true;
+  const { data, error } = await fetchGetSections({ page_type: 'home' });
+  loading.value = false;
+  if (!error && data) {
+    tableData.value = data.items || [];
+  }
+}
+
+function handleAdd() {
+  dialogTitle.value = '新增 Section';
+  formData.id = null;
+  formData.layout = 'hero_split';
+  formData.theme = 'light';
+  formData.bg_type = 'color';
+  formData.bg_value = '';
+  formData.overlay_enabled = false;
+  formData.overlay_opacity = 0;
+  formData.overline_zh = '';
+  formData.overline_en = '';
+  formData.title_zh = '';
+  formData.title_en = '';
+  formData.subtitle_zh = '';
+  formData.subtitle_en = '';
+  formData.content_zh = '';
+  formData.content_en = '';
+  formData.cta_primary_zh = '';
+  formData.cta_primary_en = '';
+  formData.cta_primary_url = '';
+  formData.cta_secondary_zh = '';
+  formData.cta_secondary_en = '';
+  formData.cta_secondary_url = '';
+  formData.media_url_zh = '';
+  formData.media_url_en = '';
+  formData.video_url = '';
+  formData.is_visible = true;
+  dialogVisible.value = true;
+}
+
+function handleEdit(row: Api.Www.SectionBlock) {
+  dialogTitle.value = '编辑 Section';
+  formData.id = row.id;
+  formData.layout = row.layout;
+  formData.theme = row.theme;
+  formData.bg_type = row.bg_type;
+  formData.bg_value = row.bg_value;
+  formData.overlay_enabled = row.overlay_enabled;
+  formData.overlay_opacity = row.overlay_opacity;
+  formData.overline_zh = row.overline_zh;
+  formData.overline_en = row.overline_en;
+  formData.title_zh = row.title_zh;
+  formData.title_en = row.title_en;
+  formData.subtitle_zh = row.subtitle_zh;
+  formData.subtitle_en = row.subtitle_en;
+  formData.content_zh = row.content_zh;
+  formData.content_en = row.content_en;
+  formData.cta_primary_zh = row.cta_primary_zh;
+  formData.cta_primary_en = row.cta_primary_en;
+  formData.cta_primary_url = row.cta_primary_url;
+  formData.cta_secondary_zh = row.cta_secondary_zh;
+  formData.cta_secondary_en = row.cta_secondary_en;
+  formData.cta_secondary_url = row.cta_secondary_url;
+  formData.media_url_zh = row.media_url_zh;
+  formData.media_url_en = row.media_url_en;
+  formData.video_url = row.video_url;
+  formData.is_visible = row.is_visible;
+  dialogVisible.value = true;
+}
+
+async function handleToggleVisible(row: Api.Www.SectionBlock, val: boolean) {
+  const { error } = await fetchUpdateSection(row.id, { is_visible: val });
+  if (!error) {
+    row.is_visible = val;
+    window.$message?.success('已更新');
+  }
+}
+
+function handleDelete(row: Api.Www.SectionBlock) {
+  window.$dialog?.warning({
+    title: '警告',
+    content: `确定要删除 Section「${row.title_zh || row.layout}」吗？`,
+    positiveText: '确定',
+    negativeText: '取消',
+    onPositiveClick: async () => {
+      const { error } = await fetchDeleteSection(row.id);
+      if (!error) {
+        window.$message?.success('删除成功');
+        loadData();
+      }
+    }
+  });
+}
+
+async function handleSubmit() {
+  submitLoading.value = true;
+  const { id, ...payload } = formData;
+  const reqData = { ...payload, page_type: 'home' };
+  const { error } = id
+    ? await fetchUpdateSection(id, reqData)
+    : await fetchCreateSection(reqData);
+  submitLoading.value = false;
+  if (!error) {
+    window.$message?.success(id ? '更新成功' : '创建成功');
+    dialogVisible.value = false;
+    loadData();
+  }
+}
+
+onMounted(loadData);
+</script>
+
+<template>
+  <NSpace vertical :size="16">
+    <NCard :bordered="false" class="card-wrapper" title="首页区块" size="small">
+      <template #header-extra>
+        <NButton type="primary" @click="handleAdd">
+          <template #icon>
+            <SvgIcon icon="mdi:plus" />
+          </template>
+          新增区块
+        </NButton>
+      </template>
+
+      <NDataTable :loading="loading" :columns="columns" :data="tableData" :bordered="false" size="small" />
+    </NCard>
+
+    <NModal
+      v-model:show="dialogVisible"
+      preset="card"
+      :title="dialogTitle"
+      class="w-800px"
+      :mask-closable="false"
+    >
+      <NForm ref="formRef" :model="formData" label-placement="left" label-width="120">
+        <NDivider>基础配置</NDivider>
+        <NFormItem label="布局类型">
+          <NSelect v-model:value="formData.layout" :options="layoutOptions" />
+        </NFormItem>
+        <NFormItem label="主题">
+          <NRadioGroup v-model:value="formData.theme">
+            <NRadio v-for="opt in themeOptions" :key="opt.value" :value="opt.value">{{ opt.label }}</NRadio>
+          </NRadioGroup>
+        </NFormItem>
+        <NFormItem label="背景类型">
+          <NRadioGroup v-model:value="formData.bg_type">
+            <NRadioButton value="color">纯色</NRadioButton>
+            <NRadioButton value="image">图片</NRadioButton>
+            <NRadioButton value="gradient">渐变</NRadioButton>
+          </NRadioGroup>
+        </NFormItem>
+        <NFormItem label="背景值">
+          <NInput v-model:value="formData.bg_value" placeholder="颜色值或图片路径" />
+        </NFormItem>
+        <NFormItem label="遮罩">
+          <NSpace align="center">
+            <NSwitch v-model:value="formData.overlay_enabled" />
+            <span>透明度</span>
+            <NSlider v-model:value="formData.overlay_opacity" :min="0" :max="1" :step="0.05" class="w-200px" />
+            <span>{{ formData.overlay_opacity.toFixed(2) }}</span>
+          </NSpace>
+        </NFormItem>
+
+        <NDivider>文案内容</NDivider>
+        <NFormItem label="Overline（中）">
+          <NInput v-model:value="formData.overline_zh" maxlength="100" />
+        </NFormItem>
+        <NFormItem label="Overline（英）">
+          <NInput v-model:value="formData.overline_en" maxlength="100" />
+        </NFormItem>
+        <NFormItem label="标题（中）">
+          <NInput v-model:value="formData.title_zh" maxlength="200" />
+        </NFormItem>
+        <NFormItem label="标题（英）">
+          <NInput v-model:value="formData.title_en" maxlength="200" />
+        </NFormItem>
+        <NFormItem label="副标题（中）">
+          <NInput v-model:value="formData.subtitle_zh" type="textarea" :autosize="{ minRows: 1 }" />
+        </NFormItem>
+        <NFormItem label="副标题（英）">
+          <NInput v-model:value="formData.subtitle_en" type="textarea" :autosize="{ minRows: 1 }" />
+        </NFormItem>
+        <NFormItem label="正文（中）">
+          <NInput v-model:value="formData.content_zh" type="textarea" :autosize="{ minRows: 2 }" />
+        </NFormItem>
+        <NFormItem label="正文（英）">
+          <NInput v-model:value="formData.content_en" type="textarea" :autosize="{ minRows: 2 }" />
+        </NFormItem>
+
+        <NDivider>按钮</NDivider>
+        <NFormItem label="主按钮（中）">
+          <NInput v-model:value="formData.cta_primary_zh" maxlength="50" />
+        </NFormItem>
+        <NFormItem label="主按钮（英）">
+          <NInput v-model:value="formData.cta_primary_en" maxlength="50" />
+        </NFormItem>
+        <NFormItem label="主按钮链接">
+          <NInput v-model:value="formData.cta_primary_url" maxlength="500" />
+        </NFormItem>
+        <NFormItem label="次按钮（中）">
+          <NInput v-model:value="formData.cta_secondary_zh" maxlength="50" />
+        </NFormItem>
+        <NFormItem label="次按钮（英）">
+          <NInput v-model:value="formData.cta_secondary_en" maxlength="50" />
+        </NFormItem>
+        <NFormItem label="次按钮链接">
+          <NInput v-model:value="formData.cta_secondary_url" maxlength="500" />
+        </NFormItem>
+
+        <NDivider>素材</NDivider>
+        <NFormItem label="图片（中）">
+          <NInput v-model:value="formData.media_url_zh" maxlength="500" placeholder="素材路径" />
+        </NFormItem>
+        <NFormItem label="图片（英）">
+          <NInput v-model:value="formData.media_url_en" maxlength="500" placeholder="素材路径" />
+        </NFormItem>
+        <NFormItem label="视频地址">
+          <NInput v-model:value="formData.video_url" maxlength="500" placeholder="视频路径或 URL" />
+        </NFormItem>
+
+        <NDivider>显示</NDivider>
+        <NFormItem label="是否可见">
+          <NSwitch v-model:value="formData.is_visible" />
+        </NFormItem>
+      </NForm>
+      <template #footer>
+        <NSpace justify="end">
+          <NButton @click="dialogVisible = false">取消</NButton>
+          <NButton type="primary" :loading="submitLoading" @click="handleSubmit">确定</NButton>
+        </NSpace>
+      </template>
+    </NModal>
+  </NSpace>
+</template>
diff --git a/dashboard/frontend/src/views/www/page/news-list/index.vue b/dashboard/frontend/src/views/www/page/news-list/index.vue
new file mode 100644
index 0000000..4eb4a39
--- /dev/null
+++ b/dashboard/frontend/src/views/www/page/news-list/index.vue
@@ -0,0 +1,79 @@
+<script setup lang="ts">
+import { onMounted, reactive, ref } from 'vue';
+import { fetchGetNewsListSettings, fetchUpdateNewsListSettings } from '@/service/api';
+
+defineOptions({ name: 'WwwPageNewsList' });
+
+const loading = ref(false);
+const saving = ref(false);
+
+const formData = reactive({
+  hero_title_zh: '新闻中心',
+  hero_title_en: 'News',
+  hero_subtitle_zh: '',
+  hero_subtitle_en: '',
+  hero_bg_url: '',
+  page_size: 10,
+  show_cover: true,
+  show_summary: true
+});
+
+async function loadData() {
+  loading.value = true;
+  const { data, error } = await fetchGetNewsListSettings();
+  loading.value = false;
+  if (!error && data) {
+    Object.assign(formData, data);
+  }
+}
+
+async function handleSave() {
+  saving.value = true;
+  const { error } = await fetchUpdateNewsListSettings({ ...formData });
+  saving.value = false;
+  if (!error) {
+    window.$message?.success('保存成功');
+  }
+}
+
+onMounted(loadData);
+</script>
+
+<template>
+  <NCard :bordered="false" class="card-wrapper" title="新闻列表页配置" size="small" :loading="loading">
+    <NForm :model="formData" label-placement="left" label-width="140">
+      <NDivider>Page Hero</NDivider>
+      <NFormItem label="标题（中）">
+        <NInput v-model:value="formData.hero_title_zh" maxlength="100" class="w-400px" />
+      </NFormItem>
+      <NFormItem label="标题（英）">
+        <NInput v-model:value="formData.hero_title_en" maxlength="100" class="w-400px" />
+      </NFormItem>
+      <NFormItem label="副标题（中）">
+        <NInput v-model:value="formData.hero_subtitle_zh" maxlength="200" class="w-500px" />
+      </NFormItem>
+      <NFormItem label="副标题（英）">
+        <NInput v-model:value="formData.hero_subtitle_en" maxlength="200" class="w-500px" />
+      </NFormItem>
+      <NFormItem label="背景图">
+        <NInput v-model:value="formData.hero_bg_url" placeholder="素材路径" class="w-500px" />
+      </NFormItem>
+      <NDivider>列表配置</NDivider>
+      <NFormItem label="每页条数">
+        <NInputNumber v-model:value="formData.page_size" :min="5" :max="50" />
+      </NFormItem>
+      <NFormItem label="显示封面图">
+        <NSwitch v-model:value="formData.show_cover" />
+      </NFormItem>
+      <NFormItem label="显示摘要">
+        <NSwitch v-model:value="formData.show_summary" />
+      </NFormItem>
+    </NForm>
+    <div class="flex justify-end">
+      <NButton type="primary" :loading="saving" @click="handleSave">
+        <template #icon><SvgIcon icon="mdi:content-save" /></template>
+        保存
+      </NButton>
+    </div>
+  </NCard>
+</template>
diff --git a/dashboard/frontend/src/views/www/page/product-list/index.vue b/dashboard/frontend/src/views/www/page/product-list/index.vue
new file mode 100644
index 0000000..a7f6f24
--- /dev/null
+++ b/dashboard/frontend/src/views/www/page/product-list/index.vue
@@ -0,0 +1,119 @@
+<script setup lang="ts">
+import { onMounted, reactive, ref } from 'vue';
+import { type FormInst, type FormRules } from 'naive-ui';
+import { fetchGetProductListSettings, fetchUpdateProductListSettings } from '@/service/api';
+
+defineOptions({ name: 'WwwPageProductList' });
+
+const formRef = ref<FormInst | null>(null);
+const loading = ref(false);
+const saving = ref(false);
+
+const sortOptions = [
+  { label: '按排序序号', value: 'sort_order' },
+  { label: '最新优先', value: 'latest' },
+  { label: '最早优先', value: 'oldest' }
+];
+
+const formData = reactive({
+  hero_title_zh: '',
+  hero_title_en: '',
+  hero_subtitle_zh: '',
+  hero_subtitle_en: '',
+  hero_bg_url: '',
+  columns: 3,
+  show_series_filter: true,
+  default_sort: 'sort_order'
+});
+
+const rules: FormRules = {
+  hero_title_zh: [{ required: true, message: '请输入 Hero 标题（中）', trigger: ['blur', 'input'] }],
+  columns: [{ required: true, type: 'number', message: '请设置列数', trigger: ['blur', 'change'] }],
+  default_sort: [{ required: true, message: '请选择默认排序', trigger: ['blur', 'change'] }]
+};
+
+async function loadData() {
+  loading.value = true;
+  const { data, error } = await fetchGetProductListSettings();
+  loading.value = false;
+  if (!error && data) {
+    formData.hero_title_zh = data.hero_title_zh || '';
+    formData.hero_title_en = data.hero_title_en || '';
+    formData.hero_subtitle_zh = data.hero_subtitle_zh || '';
+    formData.hero_subtitle_en = data.hero_subtitle_en || '';
+    formData.hero_bg_url = data.hero_bg_url || '';
+    formData.columns = data.columns ?? 3;
+    formData.show_series_filter = data.show_series_filter ?? true;
+    formData.default_sort = data.default_sort || 'sort_order';
+  }
+}
+
+async function handleSave() {
+  await formRef.value?.validate();
+  saving.value = true;
+  const { error } = await fetchUpdateProductListSettings({ ...formData });
+  saving.value = false;
+  if (!error) {
+    window.$message?.success('保存成功');
+  }
+}
+
+onMounted(loadData);
+</script>
+
+<template>
+  <NCard :bordered="false" class="card-wrapper" title="产品列表页配置" size="small" :loading="loading">
+    <NForm ref="formRef" :model="formData" :rules="rules" label-placement="left" label-width="120">
+      <NDivider>Hero 区文案</NDivider>
+      <NFormItem label="Hero 标题（中）" path="hero_title_zh">
+        <NInput v-model:value="formData.hero_title_zh" maxlength="200" placeholder="产品列表" class="w-400px" />
+      </NFormItem>
+      <NFormItem label="Hero 标题（英）" path="hero_title_en">
+        <NInput v-model:value="formData.hero_title_en" maxlength="200" placeholder="Products" class="w-400px" />
+      </NFormItem>
+      <NFormItem label="Hero 副标题（中）" path="hero_subtitle_zh">
+        <NInput
+          v-model:value="formData.hero_subtitle_zh"
+          type="textarea"
+          :autosize="{ minRows: 1 }"
+          maxlength="500"
+          class="w-400px"
+        />
+      </NFormItem>
+      <NFormItem label="Hero 副标题（英）" path="hero_subtitle_en">
+        <NInput
+          v-model:value="formData.hero_subtitle_en"
+          type="textarea"
+          :autosize="{ minRows: 1 }"
+          maxlength="500"
+          class="w-400px"
+        />
+      </NFormItem>
+      <NFormItem label="Hero 背景图" path="hero_bg_url">
+        <NInput v-model:value="formData.hero_bg_url" placeholder="素材路径，如 /uploads/hero/products.jpg" class="w-400px" />
+      </NFormItem>
+
+      <NDivider>列表配置</NDivider>
+      <NFormItem label="列数" path="columns">
+        <NSpace align="center">
+          <NSlider v-model:value="formData.columns" :min="2" :max="4" :step="1" class="w-200px" />
+          <span>{{ formData.columns }} 列</span>
+        </NSpace>
+      </NFormItem>
+      <NFormItem label="显示系列筛选" path="show_series_filter">
+        <NSwitch v-model:value="formData.show_series_filter" />
+      </NFormItem>
+      <NFormItem label="默认排序" path="default_sort">
+        <NSelect v-model:value="formData.default_sort" :options="sortOptions" class="w-200px" />
+      </NFormItem>
+    </NForm>
+    <div class="flex justify-end">
+      <NButton type="primary" :loading="saving" @click="handleSave">
+        <template #icon>
+          <SvgIcon icon="mdi:content-save" />
+        </template>
+        保存
+      </NButton>
+    </div>
+  </NCard>
+</template>
diff --git a/dashboard/frontend/src/views/www/page/support/index.vue b/dashboard/frontend/src/views/www/page/support/index.vue
new file mode 100644
index 0000000..2a48686
--- /dev/null
+++ b/dashboard/frontend/src/views/www/page/support/index.vue
@@ -0,0 +1,44 @@
+<script setup lang="ts">
+import { onMounted, reactive, ref } from 'vue';
+import { fetchGetSupportSettings, fetchUpdateSupportSettings } from '@/service/api';
+
+defineOptions({ name: 'WwwPageSupport' });
+
+const loading = ref(false);
+const saving = ref(false);
+
+const formData = reactive<Record<string, unknown>>({});
+
+async function loadData() {
+  loading.value = true;
+  const { data, error } = await fetchGetSupportSettings();
+  loading.value = false;
+  if (!error && data) {
+    Object.assign(formData, data);
+    delete formData.id;
+  }
+}
+
+async function handleSave() {
+  saving.value = true;
+  const { error } = await fetchUpdateSupportSettings({ ...formData });
+  saving.value = false;
+  if (!error) {
+    window.$message?.success('保存成功');
+  }
+}
+
+onMounted(loadData);
+</script>
+
+<template>
+  <NCard :bordered="false" class="card-wrapper" title="技术支持" size="small" :loading="loading">
+    <NEmpty description="技术支持页面配置为动态 JSON 结构，请使用 JSON 编辑器编辑" />
+    <div class="mt-16px flex justify-end">
+      <NButton type="primary" :loading="saving" @click="handleSave">
+        <template #icon><SvgIcon icon="mdi:content-save" /></template>
+        保存
+      </NButton>
+    </div>
+  </NCard>
+</template>
diff --git a/dashboard/frontend/src/views/www/product/list/index.vue b/dashboard/frontend/src/views/www/product/list/index.vue
new file mode 100644
index 0000000..0814482
--- /dev/null
+++ b/dashboard/frontend/src/views/www/product/list/index.vue
@@ -0,0 +1,336 @@
+<script setup lang="ts">
+import { computed, h, onMounted, reactive, ref } from 'vue';
+import { NButton, NSpace, NSwitch, NTag, type DataTableColumns, type FormInst, type FormRules } from 'naive-ui';
+import {
+  fetchCreateProduct,
+  fetchDeleteProduct,
+  fetchGetProducts,
+  fetchGetProductSeries,
+  fetchUpdateProduct
+} from '@/service/api';
+
+defineOptions({ name: 'WwwProductList' });
+
+const loading = ref(false);
+const submitLoading = ref(false);
+const dialogVisible = ref(false);
+const dialogTitle = ref('');
+const formRef = ref<FormInst | null>(null);
+const tableData = ref<Api.Www.Product[]>([]);
+const seriesOptions = ref<Api.Www.ProductSeries[]>([]);
+
+const searchForm = reactive({
+  series_id: null as number | null,
+  name: ''
+});
+
+const pagination = reactive({
+  page: 1,
+  pageSize: 10,
+  itemCount: 0,
+  pageSizes: [10, 20, 50, 100]
+});
+
+const formData = reactive({
+  id: null as number | null,
+  series_id: null as number | null,
+  name_zh: '',
+  name_en: '',
+  slug: '',
+  intro_zh: '',
+  intro_en: '',
+  cover_url: '',
+  is_visible: true
+});
+
+const rules: FormRules = {
+  series_id: [{ required: true, message: '请选择产品系列', trigger: ['blur', 'change'] }],
+  name_zh: [{ required: true, message: '请输入产品中文名', trigger: ['blur', 'input'] }],
+  name_en: [{ required: true, message: '请输入产品英文名', trigger: ['blur', 'input'] }],
+  slug: [{ required: true, message: '请输入 URL 标识', trigger: ['blur', 'input'] }]
+};
+
+const seriesSelectOptions = computed(() =>
+  seriesOptions.value.map(s => ({ label: s.name_zh, value: s.id }))
+);
+
+const columns = computed<DataTableColumns<Api.Www.Product>>(() => [
+  { title: 'ID', key: 'id', width: 60 },
+  { title: '产品名称（中）', key: 'name_zh', width: 150, ellipsis: { tooltip: true } },
+  { title: '产品名称（英）', key: 'name_en', width: 150, ellipsis: { tooltip: true } },
+  {
+    title: '所属系列',
+    key: 'series_id',
+    width: 120,
+    render(row) {
+      const s = seriesOptions.value.find(o => o.id === row.series_id);
+      return s?.name_zh || row.series_id;
+    }
+  },
+  { title: 'Slug', key: 'slug', width: 120, ellipsis: { tooltip: true } },
+  {
+    title: '可见',
+    key: 'is_visible',
+    width: 80,
+    render(row) {
+      return h(NSwitch, {
+        value: row.is_visible,
+        onUpdateValue: (val: boolean) => handleToggleVisible(row, val)
+      });
+    }
+  },
+  {
+    title: '操作',
+    key: 'actions',
+    width: 180,
+    fixed: 'right',
+    render(row) {
+      return h('div', { class: 'flex-y-center gap-8px' }, [
+        h(NButton, { size: 'small', type: 'primary', onClick: () => handleEdit(row) }, { default: () => '编辑' }),
+        h(NButton, { size: 'small', type: 'info', onClick: () => handleEditSections(row) }, { default: () => '区块' }),
+        h(NButton, { size: 'small', type: 'error', onClick: () => handleDelete(row) }, { default: () => '删除' })
+      ]);
+    }
+  }
+]);
+
+async function loadSeries() {
+  const { data, error } = await fetchGetProductSeries();
+  if (!error && data) {
+    seriesOptions.value = data.items || [];
+  }
+}
+
+async function loadData() {
+  loading.value = true;
+  const { data, error } = await fetchGetProducts({
+    skip: (pagination.page - 1) * pagination.pageSize,
+    limit: pagination.pageSize,
+    series_id: searchForm.series_id || undefined,
+    name: searchForm.name || undefined
+  });
+  loading.value = false;
+  if (!error && data) {
+    tableData.value = data.items || [];
+    pagination.itemCount = data.total || 0;
+  } else if (!error) {
+    tableData.value = [];
+    pagination.itemCount = 0;
+  }
+}
+
+function handleSearch() {
+  pagination.page = 1;
+  loadData();
+}
+
+function handleReset() {
+  searchForm.series_id = null;
+  searchForm.name = '';
+  pagination.page = 1;
+  loadData();
+}
+
+function handleAdd() {
+  dialogTitle.value = '新增产品';
+  formData.id = null;
+  formData.series_id = null;
+  formData.name_zh = '';
+  formData.name_en = '';
+  formData.slug = '';
+  formData.intro_zh = '';
+  formData.intro_en = '';
+  formData.cover_url = '';
+  formData.is_visible = true;
+  dialogVisible.value = true;
+}
+
+function handleEdit(row: Api.Www.Product) {
+  dialogTitle.value = '编辑产品';
+  formData.id = row.id;
+  formData.series_id = row.series_id;
+  formData.name_zh = row.name_zh;
+  formData.name_en = row.name_en;
+  formData.slug = row.slug;
+  formData.intro_zh = row.intro_zh;
+  formData.intro_en = row.intro_en;
+  formData.cover_url = row.cover_url;
+  formData.is_visible = row.is_visible;
+  dialogVisible.value = true;
+}
+
+function handleEditSections(_row: Api.Www.Product) {
+  // TODO: 跳转到产品详情页编辑 Section + 参数规格
+  window.$message?.info('区块编辑器开发中');
+}
+
+async function handleToggleVisible(row: Api.Www.Product, val: boolean) {
+  const { error } = await fetchUpdateProduct(row.id, { is_visible: val });
+  if (!error) {
+    row.is_visible = val;
+    window.$message?.success('已更新');
+  }
+}
+
+function handleDelete(row: Api.Www.Product) {
+  window.$dialog?.warning({
+    title: '警告',
+    content: `确定要删除产品「${row.name_zh}」吗？关联的 Section 和参数规格将一并删除。`,
+    positiveText: '确定',
+    negativeText: '取消',
+    onPositiveClick: async () => {
+      const { error } = await fetchDeleteProduct(row.id);
+      if (!error) {
+        window.$message?.success('删除成功');
+        loadData();
+      }
+    }
+  });
+}
+
+async function handleSubmit() {
+  await formRef.value?.validate();
+  submitLoading.value = true;
+  const { id, ...payload } = formData;
+  const reqPayload = { ...payload, series_id: payload.series_id ?? 0 };
+  const { error } = id
+    ? await fetchUpdateProduct(id, reqPayload)
+    : await fetchCreateProduct(reqPayload);
+  submitLoading.value = false;
+  if (!error) {
+    window.$message?.success(id ? '更新成功' : '创建成功');
+    dialogVisible.value = false;
+    loadData();
+  }
+}
+
+function handlePageChange(page: number) {
+  pagination.page = page;
+  loadData();
+}
+
+function handlePageSizeChange(pageSize: number) {
+  pagination.pageSize = pageSize;
+  pagination.page = 1;
+  loadData();
+}
+
+onMounted(() => {
+  loadSeries();
+  loadData();
+});
+</script>
+
+<template>
+  <NSpace vertical :size="16">
+    <NCard :bordered="false" class="card-wrapper" size="small">
+      <NForm inline :model="searchForm" label-placement="left">
+        <NFormItem label="产品系列">
+          <NSelect
+            v-model:value="searchForm.series_id"
+            :options="seriesSelectOptions"
+            clearable
+            placeholder="全部系列"
+            class="w-200px"
+          />
+        </NFormItem>
+        <NFormItem label="产品名称">
+          <NInput
+            v-model:value="searchForm.name"
+            clearable
+            placeholder="搜索产品名称"
+            class="w-200px"
+            @keyup.enter="handleSearch"
+          />
+        </NFormItem>
+        <NFormItem>
+          <NSpace>
+            <NButton type="primary" @click="handleSearch">
+              <template #icon>
+                <SvgIcon icon="mdi:magnify" />
+              </template>
+              搜索
+            </NButton>
+            <NButton @click="handleReset">
+              <template #icon>
+                <SvgIcon icon="mdi:refresh" />
+              </template>
+              重置
+            </NButton>
+          </NSpace>
+        </NFormItem>
+      </NForm>
+    </NCard>
+
+    <NCard :bordered="false" class="card-wrapper" title="产品列表" size="small">
+      <template #header-extra>
+        <NButton type="primary" @click="handleAdd">
+          <template #icon>
+            <SvgIcon icon="mdi:plus" />
+          </template>
+          新增产品
+        </NButton>
+      </template>
+
+      <NDataTable :loading="loading" :columns="columns" :data="tableData" :bordered="false" size="small" />
+
+      <div class="mt-16px flex justify-end">
+        <NPagination
+          :page="pagination.page"
+          :page-size="pagination.pageSize"
+          :item-count="pagination.itemCount"
+          :page-sizes="pagination.pageSizes"
+          show-size-picker
+          :prefix="({ itemCount }) => `共 ${itemCount ?? 0} 条`"
+          @update:page="handlePageChange"
+          @update:page-size="handlePageSizeChange"
+        />
+      </div>
+    </NCard>
+
+    <NModal
+      v-model:show="dialogVisible"
+      preset="card"
+      :title="dialogTitle"
+      class="w-600px"
+      :mask-closable="false"
+    >
+      <NForm ref="formRef" :model="formData" :rules="rules" label-placement="left" label-width="120">
+        <NFormItem label="产品系列" path="series_id">
+          <NSelect
+            v-model:value="formData.series_id"
+            :options="seriesSelectOptions"
+            placeholder="请选择产品系列"
+          />
+        </NFormItem>
+        <NFormItem label="产品中文名" path="name_zh">
+          <NInput v-model:value="formData.name_zh" maxlength="100" placeholder="如：DMP-A8" />
+        </NFormItem>
+        <NFormItem label="产品英文名" path="name_en">
+          <NInput v-model:value="formData.name_en" maxlength="100" placeholder="如：DMP-A8" />
+        </NFormItem>
+        <NFormItem label="URL 标识" path="slug">
+          <NInput v-model:value="formData.slug" maxlength="200" placeholder="如：dmp-a8" />
+        </NFormItem>
+        <NFormItem label="简介（中）">
+          <NInput v-model:value="formData.intro_zh" type="textarea" :autosize="{ minRows: 2 }" maxlength="500" />
+        </NFormItem>
+        <NFormItem label="简介（英）">
+          <NInput v-model:value="formData.intro_en" type="textarea" :autosize="{ minRows: 2 }" maxlength="500" />
+        </NFormItem>
+        <NFormItem label="封面图路径">
+          <NInput v-model:value="formData.cover_url" placeholder="素材路径" />
+        </NFormItem>
+        <NFormItem label="是否可见">
+          <NSwitch v-model:value="formData.is_visible" />
+        </NFormItem>
+      </NForm>
+      <template #footer>
+        <NSpace justify="end">
+          <NButton @click="dialogVisible = false">取消</NButton>
+          <NButton type="primary" :loading="submitLoading" @click="handleSubmit">确定</NButton>
+        </NSpace>
+      </template>
+    </NModal>
+  </NSpace>
+</template>
diff --git a/dashboard/frontend/src/views/www/product/series/index.vue b/dashboard/frontend/src/views/www/product/series/index.vue
new file mode 100644
index 0000000..184ad43
--- /dev/null
+++ b/dashboard/frontend/src/views/www/product/series/index.vue
@@ -0,0 +1,197 @@
+<script setup lang="ts">
+import { h, onMounted, reactive, ref } from 'vue';
+import { NButton, NSwitch, NTag, type DataTableColumns, type FormInst, type FormRules } from 'naive-ui';
+import {
+  fetchCreateProductSeries,
+  fetchDeleteProductSeries,
+  fetchGetProductSeries,
+  fetchUpdateProductSeries
+} from '@/service/api';
+
+defineOptions({ name: 'WwwProductSeries' });
+
+const loading = ref(false);
+const submitLoading = ref(false);
+const dialogVisible = ref(false);
+const dialogTitle = ref('');
+const formRef = ref<FormInst | null>(null);
+const tableData = ref<Api.Www.ProductSeries[]>([]);
+
+const formData = reactive({
+  id: null as number | null,
+  name_zh: '',
+  name_en: '',
+  overline: '',
+  subtitle_zh: '',
+  subtitle_en: '',
+  cover_url: '',
+  is_visible: true
+});
+
+const rules: FormRules = {
+  name_zh: [{ required: true, message: '请输入系列中文名', trigger: ['blur', 'input'] }],
+  name_en: [{ required: true, message: '请输入系列英文名', trigger: ['blur', 'input'] }]
+};
+
+const columns: DataTableColumns<Api.Www.ProductSeries> = [
+  { title: 'ID', key: 'id', width: 60 },
+  { title: '中文名', key: 'name_zh', width: 150 },
+  { title: '英文名', key: 'name_en', width: 150 },
+  { title: 'Overline', key: 'overline', width: 120, ellipsis: { tooltip: true } },
+  { title: '副标题（中）', key: 'subtitle_zh', ellipsis: { tooltip: true } },
+  {
+    title: '可见',
+    key: 'is_visible',
+    width: 80,
+    render(row) {
+      return h(NSwitch, {
+        value: row.is_visible,
+        onUpdateValue: (val: boolean) => handleToggleVisible(row, val)
+      });
+    }
+  },
+  {
+    title: '操作',
+    key: 'actions',
+    width: 140,
+    fixed: 'right',
+    render(row) {
+      return h('div', { class: 'flex-y-center gap-8px' }, [
+        h(NButton, { size: 'small', type: 'primary', onClick: () => handleEdit(row) }, { default: () => '编辑' }),
+        h(NButton, { size: 'small', type: 'error', onClick: () => handleDelete(row) }, { default: () => '删除' })
+      ]);
+    }
+  }
+];
+
+async function loadData() {
+  loading.value = true;
+  const { data, error } = await fetchGetProductSeries();
+  loading.value = false;
+  if (!error && data) {
+    tableData.value = data.items || [];
+  }
+}
+
+function handleAdd() {
+  dialogTitle.value = '新增产品系列';
+  formData.id = null;
+  formData.name_zh = '';
+  formData.name_en = '';
+  formData.overline = '';
+  formData.subtitle_zh = '';
+  formData.subtitle_en = '';
+  formData.cover_url = '';
+  formData.is_visible = true;
+  dialogVisible.value = true;
+}
+
+function handleEdit(row: Api.Www.ProductSeries) {
+  dialogTitle.value = '编辑产品系列';
+  formData.id = row.id;
+  formData.name_zh = row.name_zh;
+  formData.name_en = row.name_en;
+  formData.overline = row.overline;
+  formData.subtitle_zh = row.subtitle_zh;
+  formData.subtitle_en = row.subtitle_en;
+  formData.cover_url = row.cover_url;
+  formData.is_visible = row.is_visible;
+  dialogVisible.value = true;
+}
+
+async function handleToggleVisible(row: Api.Www.ProductSeries, val: boolean) {
+  const { error } = await fetchUpdateProductSeries(row.id, { is_visible: val });
+  if (!error) {
+    row.is_visible = val;
+    window.$message?.success('已更新');
+  }
+}
+
+function handleDelete(row: Api.Www.ProductSeries) {
+  window.$dialog?.warning({
+    title: '警告',
+    content: `确定要删除产品系列「${row.name_zh}」吗？删除后该系列下的产品将失去关联。`,
+    positiveText: '确定',
+    negativeText: '取消',
+    onPositiveClick: async () => {
+      const { error } = await fetchDeleteProductSeries(row.id);
+      if (!error) {
+        window.$message?.success('删除成功');
+        loadData();
+      }
+    }
+  });
+}
+
+async function handleSubmit() {
+  await formRef.value?.validate();
+  submitLoading.value = true;
+  const { id, ...payload } = formData;
+  const { error } = id
+    ? await fetchUpdateProductSeries(id, payload)
+    : await fetchCreateProductSeries(payload);
+  submitLoading.value = false;
+  if (!error) {
+    window.$message?.success(id ? '更新成功' : '创建成功');
+    dialogVisible.value = false;
+    loadData();
+  }
+}
+
+onMounted(loadData);
+</script>
+
+<template>
+  <NSpace vertical :size="16">
+    <NCard :bordered="false" class="card-wrapper" title="产品系列" size="small">
+      <template #header-extra>
+        <NButton type="primary" @click="handleAdd">
+          <template #icon>
+            <SvgIcon icon="mdi:plus" />
+          </template>
+          新增系列
+        </NButton>
+      </template>
+
+      <NDataTable :loading="loading" :columns="columns" :data="tableData" :bordered="false" size="small" />
+    </NCard>
+
+    <NModal
+      v-model:show="dialogVisible"
+      preset="card"
+      :title="dialogTitle"
+      class="w-600px"
+      :mask-closable="false"
+    >
+      <NForm ref="formRef" :model="formData" :rules="rules" label-placement="left" label-width="120">
+        <NFormItem label="系列中文名" path="name_zh">
+          <NInput v-model:value="formData.name_zh" maxlength="100" placeholder="如：DMP 流媒体系列" />
+        </NFormItem>
+        <NFormItem label="系列英文名" path="name_en">
+          <NInput v-model:value="formData.name_en" maxlength="100" placeholder="如：DMP Streaming Series" />
+        </NFormItem>
+        <NFormItem label="Overline">
+          <NInput v-model:value="formData.overline" maxlength="50" placeholder="如：DMP SERIES" />
+        </NFormItem>
+        <NFormItem label="副标题（中）">
+          <NInput v-model:value="formData.subtitle_zh" maxlength="200" />
+        </NFormItem>
+        <NFormItem label="副标题（英）">
+          <NInput v-model:value="formData.subtitle_en" maxlength="200" />
+        </NFormItem>
+        <NFormItem label="封面图路径">
+          <NInput v-model:value="formData.cover_url" placeholder="素材路径" />
+        </NFormItem>
+        <NFormItem label="是否可见">
+          <NSwitch v-model:value="formData.is_visible" />
+        </NFormItem>
+      </NForm>
+      <template #footer>
+        <NSpace justify="end">
+          <NButton @click="dialogVisible = false">取消</NButton>
+          <NButton type="primary" :loading="submitLoading" @click="handleSubmit">确定</NButton>
+        </NSpace>
+      </template>
+    </NModal>
+  </NSpace>
+</template>