From 3b063ff64cf45f658464c120e1065f45e65687b4 Mon Sep 17 00:00:00 2001
From: =?UTF-8?q?=E8=B6=85=E7=BA=A7=E8=80=81=E7=99=BD=E5=85=94?=
 <fsmecx@gmail.com>
Date: Sun, 28 Sep 2025 14:52:05 +0800
Subject: [PATCH] =?UTF-8?q?=E7=A7=BB=E9=99=A4=E5=86=97=E4=BD=99=E6=96=87?=
 =?UTF-8?q?=E4=BB=B6=E5=B9=B6=E9=87=8D=E6=9E=84=E5=86=85=E5=AE=B9=E7=AE=A1?=
 =?UTF-8?q?=E7=90=86=E6=A8=A1=E5=9D=97=EF=BC=9A=E5=88=A0=E9=99=A4=E6=8A=80?=
 =?UTF-8?q?=E6=9C=AF=E6=A0=88=E5=92=8C=E5=85=BC=E5=AE=B9=E6=80=A7=E8=AF=B4?=
 =?UTF-8?q?=E6=98=8E=E6=96=87=E6=A1=A3=EF=BC=8C=E7=A7=BB=E9=99=A4=E5=A4=9A?=
 =?UTF-8?q?=E4=B8=AA=E6=A8=A1=E6=80=81=E6=A1=86=E7=BB=84=E4=BB=B6=EF=BC=8C?=
 =?UTF-8?q?=E6=95=B4=E5=90=88=E7=AE=A1=E7=90=86=E7=BB=84=E4=BB=B6=E4=B8=BA?=
 =?UTF-8?q?=E7=BB=9F=E4=B8=80=E7=BB=93=E6=9E=84=EF=BC=8C=E4=BC=98=E5=8C=96?=
 =?UTF-8?q?=E4=BB=A3=E7=A0=81=E7=BB=84=E7=BB=87=EF=BC=8C=E6=8F=90=E5=8D=87?=
 =?UTF-8?q?=E5=8F=AF=E7=BB=B4=E6=8A=A4=E6=80=A7=E3=80=82?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 Cunkebao/兼容性说明.md                        | 177 -------------
 Cunkebao/技术栈.md                            |  26 --
 Touchkebao/src/pages/index.tsx                |   2 +-
 .../content-management/AddKeywordModal.tsx    | 162 ------------
 .../content-management/AddMaterialModal.tsx   | 174 -------------
 .../AddSensitiveWordModal.tsx                 | 133 ----------
 .../content-management/EditMaterialModal.tsx  | 211 ---------------
 .../powerCenter/content-management/api.ts     |  19 +-
 .../content-management/components/index.ts    |  12 +-
 .../management}/KeywordManagement.tsx         |   9 +-
 .../management}/MaterialManagement.tsx        |  25 +-
 .../management}/SensitiveWordManagement.tsx   |   9 +-
 .../components/management/index.ts            |   4 +
 .../components/modals/ContentManager.tsx      | 244 ++++++++++++++++++
 .../modals/KeywordModal.tsx}                  |  88 +++++--
 .../components/modals/MaterialModal.tsx       | 194 ++++++++++++++
 .../modals/SensitiveWordModal.tsx}            |  82 ++++--
 .../components/modals/index.ts                |   5 +
 .../powerCenter/content-management/index.tsx  |  38 ++-
 .../content-management/modals/index.ts        |   3 -
 20 files changed, 639 insertions(+), 978 deletions(-)
 delete mode 100644 Cunkebao/兼容性说明.md
 delete mode 100644 Cunkebao/技术栈.md
 delete mode 100644 Touchkebao/src/pages/pc/ckbox/powerCenter/content-management/AddKeywordModal.tsx
 delete mode 100644 Touchkebao/src/pages/pc/ckbox/powerCenter/content-management/AddMaterialModal.tsx
 delete mode 100644 Touchkebao/src/pages/pc/ckbox/powerCenter/content-management/AddSensitiveWordModal.tsx
 delete mode 100644 Touchkebao/src/pages/pc/ckbox/powerCenter/content-management/EditMaterialModal.tsx
 rename Touchkebao/src/pages/pc/ckbox/powerCenter/content-management/{ => components/management}/KeywordManagement.tsx (97%)
 rename Touchkebao/src/pages/pc/ckbox/powerCenter/content-management/{ => components/management}/MaterialManagement.tsx (94%)
 rename Touchkebao/src/pages/pc/ckbox/powerCenter/content-management/{ => components/management}/SensitiveWordManagement.tsx (97%)
 create mode 100644 Touchkebao/src/pages/pc/ckbox/powerCenter/content-management/components/management/index.ts
 create mode 100644 Touchkebao/src/pages/pc/ckbox/powerCenter/content-management/components/modals/ContentManager.tsx
 rename Touchkebao/src/pages/pc/ckbox/powerCenter/content-management/{EditKeywordModal.tsx => components/modals/KeywordModal.tsx} (68%)
 create mode 100644 Touchkebao/src/pages/pc/ckbox/powerCenter/content-management/components/modals/MaterialModal.tsx
 rename Touchkebao/src/pages/pc/ckbox/powerCenter/content-management/{EditSensitiveWordModal.tsx => components/modals/SensitiveWordModal.tsx} (65%)
 create mode 100644 Touchkebao/src/pages/pc/ckbox/powerCenter/content-management/components/modals/index.ts
 delete mode 100644 Touchkebao/src/pages/pc/ckbox/powerCenter/content-management/modals/index.ts

diff --git a/Cunkebao/兼容性说明.md b/Cunkebao/兼容性说明.md
deleted file mode 100644
index dc77df52..00000000
--- a/Cunkebao/兼容性说明.md
+++ /dev/null
@@ -1,177 +0,0 @@
-# 存客宝项目 - 浏览器兼容性说明
-
-## 🎯 **兼容性目标**
-
-本项目已配置为支持以下浏览器版本：
-
-- **Chrome**: 50+
-- **Firefox**: 50+
-- **Safari**: 10+
-- **Edge**: 12+
-- **Internet Explorer**: 11+ (部分功能受限)
-- **Android**: 4.4+ (特别优化Android 7)
-- **iOS**: 9+
-
-## 🔧 **兼容性配置**
-
-### 1. **Polyfill 支持**
-
-项目已集成以下 polyfill 来确保低版本浏览器兼容性：
-
-- **core-js**: ES6+ 特性支持
-- **regenerator-runtime**: async/await 支持
-- **whatwg-fetch**: fetch API 支持
-- **Android专用polyfill**: 针对Android 7等低版本系统优化
-
-### 2. **构建配置**
-
-- 使用 **terser** 进行代码压缩
-- 配置了 **browserslist** 目标浏览器
-- 添加了兼容性检测组件
-- 特别针对Android设备优化
-
-### 3. **特性支持**
-
-项目通过 polyfill 支持以下 ES6+ 特性：
-
-- ✅ Promise
-- ✅ fetch API
-- ✅ Array.from, Array.find, Array.includes, Array.findIndex
-- ✅ Object.assign, Object.entries, Object.values, Object.keys
-- ✅ String.includes, String.startsWith, String.endsWith
-- ✅ Map, Set, WeakMap, WeakSet
-- ✅ Symbol
-- ✅ requestAnimationFrame
-- ✅ IntersectionObserver
-- ✅ ResizeObserver
-- ✅ URLSearchParams
-- ✅ AbortController
-
-## 🚀 **使用方法**
-
-### 开发环境
-
-```bash
-pnpm dev
-```
-
-### 生产构建
-
-```bash
-pnpm build
-```
-
-### 预览构建结果
-
-```bash
-pnpm preview
-```
-
-## 📱 **Android 特别优化**
-
-### **Android 7 兼容性**
-
-Android 7 (API 24) 系统对ES6+特性支持不完整，项目已特别优化：
-
-#### **问题解决：**
-
-- ✅ Array.prototype.includes 方法缺失
-- ✅ String.prototype.includes 方法缺失
-- ✅ Object.assign 方法缺失
-- ✅ Array.from 方法缺失
-- ✅ requestAnimationFrame 缺失
-- ✅ IntersectionObserver 缺失
-- ✅ URLSearchParams 缺失
-
-#### **解决方案：**
-
-- 使用自定义polyfill补充缺失方法
-- 提供降级实现确保功能可用
-- 自动检测Android版本并启用相应polyfill
-
-### **Android WebView 优化**
-
-- 针对系统WebView进行特别优化
-- 支持微信、QQ等内置浏览器
-- 提供降级方案确保基本功能可用
-
-## ⚠️ **注意事项**
-
-1. **Android 7 支持**
-   - 已启用兼容模式，基本功能可用
-   - 建议升级到Android 8+或使用最新版Chrome
-   - 部分高级特性可能受限
-
-2. **Android 6 及以下**
-   - 支持有限，建议升级系统
-   - 使用最新版Chrome浏览器
-   - 部分功能可能不可用
-
-3. **移动端兼容性**
-   - iOS Safari 10+
-   - Android Chrome 50+
-   - 微信内置浏览器 (部分功能受限)
-   - QQ内置浏览器 (部分功能受限)
-
-4. **性能考虑**
-   - polyfill 会增加包体积
-   - 现代浏览器会自动忽略不需要的 polyfill
-   - Android设备上会有额外的兼容性检测
-
-## 🔍 **兼容性检测**
-
-项目包含自动兼容性检测功能：
-
-### **通用检测**
-
-- 在低版本浏览器中会显示警告提示
-- 控制台会输出兼容性信息
-- 建议用户升级浏览器
-
-### **Android专用检测**
-
-- 自动检测Android系统版本
-- 检测Chrome和WebView版本
-- 识别微信、QQ等内置浏览器
-- 提供针对性的解决方案建议
-
-## 📝 **更新日志**
-
-### v3.0.0
-
-- ✅ 添加 ES5 兼容性支持
-- ✅ 集成 core-js polyfill
-- ✅ 添加兼容性检测组件
-- ✅ 优化构建配置
-- ✅ **新增Android 7专用polyfill**
-- ✅ **新增Android兼容性检测**
-- ✅ **优化移动端体验**
-
-## 🛠️ **故障排除**
-
-如果遇到兼容性问题：
-
-1. **Android设备问题**
-   - 检查Android系统版本
-   - 确认Chrome浏览器版本
-   - 查看控制台错误信息
-   - 尝试使用系统浏览器而非内置浏览器
-
-2. **通用问题**
-   - 检查浏览器版本是否在支持范围内
-   - 查看控制台是否有错误信息
-   - 确认 polyfill 是否正确加载
-   - 尝试清除浏览器缓存
-
-3. **性能问题**
-   - 在低版本设备上可能加载较慢
-   - 建议使用WiFi网络
-   - 关闭不必要的浏览器扩展
-
-## 📞 **技术支持**
-
-如有兼容性问题，请联系开发团队。
-
-### **特别说明**
-
-本项目已针对Android 7等低版本系统进行了特别优化，通过代码弥补了系统内核对ES6+特性支持不完整的问题。虽然不能完全替代系统升级，但可以确保应用在低版本Android设备上正常运行。
diff --git a/Cunkebao/技术栈.md b/Cunkebao/技术栈.md
deleted file mode 100644
index a565619f..00000000
--- a/Cunkebao/技术栈.md
+++ /dev/null
@@ -1,26 +0,0 @@
-## 使用技术栈
-- React 18
-- TypeScript
-- Vite（新一代前端构建工具）
-- axios
-- sass (scss)
-- React Router v6
-- antd-mobile
-- antd（已设置基础单位为 rem，配合 postcss-pxtorem）
-- postcss-pxtorem（px 转 rem，移动端适配）
-- ESLint + Prettier（代码规范与自动格式化）
-- 路径别名 @ 指向 src 目录
-
-## 关于兼容与工程化
-- 自动化脚本（yarn lint、yarn dev 等）
-- 移动端 rem 适配（html 根字体 + pxtorem）
-- iOS 浏览器滚动回弹兼容问题已通过全局样式处理
-- 支持 VS Code 编辑器自动格式化（推荐配合 ESLint/Prettier 插件）
-
-## 目录结构简要
-- src/ 业务源码（pages、api、styles、App.tsx、main.tsx 等）
-- public/ 静态资源目录
-- index.html 项目入口（根目录）
-- vite.config.ts 构建与路径别名配置
-- tsconfig.json TypeScript 配置
-- .eslintrc.js 代码规范配置
\ No newline at end of file
diff --git a/Touchkebao/src/pages/index.tsx b/Touchkebao/src/pages/index.tsx
index ed9c8153..d0857ff5 100644
--- a/Touchkebao/src/pages/index.tsx
+++ b/Touchkebao/src/pages/index.tsx
@@ -18,7 +18,7 @@ const IndexPage: React.FC = () => {
     if (isMobile()) {
       navigate("/mobile/dashboard");
     } else {
-      navigate("/pc/dashboard");
+      navigate("/pc/weChat");
     }
   }, [navigate]);
 
diff --git a/Touchkebao/src/pages/pc/ckbox/powerCenter/content-management/AddKeywordModal.tsx b/Touchkebao/src/pages/pc/ckbox/powerCenter/content-management/AddKeywordModal.tsx
deleted file mode 100644
index 86836d9b..00000000
--- a/Touchkebao/src/pages/pc/ckbox/powerCenter/content-management/AddKeywordModal.tsx
+++ /dev/null
@@ -1,162 +0,0 @@
-import React, { useState } from "react";
-import { Modal, Form, Input, Button, message, Select } from "antd";
-import { addKeyword, type KeywordAddRequest } from "./api";
-
-const { TextArea } = Input;
-const { Option } = Select;
-
-interface AddKeywordModalProps {
-  visible: boolean;
-  onCancel: () => void;
-  onSuccess: () => void;
-}
-
-const AddKeywordModal: React.FC<AddKeywordModalProps> = ({
-  visible,
-  onCancel,
-  onSuccess,
-}) => {
-  const [form] = Form.useForm();
-  const [loading, setLoading] = useState(false);
-
-  const handleSubmit = async (values: any) => {
-    try {
-      setLoading(true);
-      const data: KeywordAddRequest = {
-        title: values.title,
-        keywords: values.keywords,
-        content: values.content,
-        matchType: values.matchType,
-        priority: values.priority,
-        replyType: values.replyType,
-        status: values.status || "1",
-      };
-
-      const response = await addKeyword(data);
-      if (response) {
-        message.success("添加关键词成功");
-        form.resetFields();
-        onSuccess();
-        onCancel();
-      } else {
-        message.error(response?.message || "添加关键词失败");
-      }
-    } catch (error) {
-      console.error("添加关键词失败:", error);
-      message.error("添加关键词失败");
-    } finally {
-      setLoading(false);
-    }
-  };
-
-  const handleCancel = () => {
-    form.resetFields();
-    onCancel();
-  };
-
-  return (
-    <Modal
-      title="添加关键词回复"
-      open={visible}
-      onCancel={handleCancel}
-      footer={null}
-      width={600}
-    >
-      <Form
-        form={form}
-        layout="vertical"
-        onFinish={handleSubmit}
-        initialValues={{
-          status: "1",
-          matchType: "模糊匹配",
-          priority: "1",
-          replyType: "text",
-        }}
-      >
-        <Form.Item
-          name="title"
-          label="关键词标题"
-          rules={[{ required: true, message: "请输入关键词标题" }]}
-        >
-          <Input placeholder="请输入关键词标题" />
-        </Form.Item>
-
-        <Form.Item
-          name="keywords"
-          label="关键词"
-          rules={[{ required: true, message: "请输入关键词" }]}
-        >
-          <Input placeholder="请输入关键词" />
-        </Form.Item>
-
-        <Form.Item
-          name="content"
-          label="回复内容"
-          rules={[{ required: true, message: "请输入回复内容" }]}
-        >
-          <TextArea rows={4} placeholder="请输入回复内容" />
-        </Form.Item>
-
-        <Form.Item
-          name="matchType"
-          label="匹配类型"
-          rules={[{ required: true, message: "请选择匹配类型" }]}
-        >
-          <Select placeholder="请选择匹配类型">
-            <Option value="模糊匹配">模糊匹配</Option>
-            <Option value="精确匹配">精确匹配</Option>
-          </Select>
-        </Form.Item>
-
-        <Form.Item
-          name="priority"
-          label="优先级"
-          rules={[{ required: true, message: "请选择优先级" }]}
-        >
-          <Select placeholder="请选择优先级">
-            <Option value="1">优先级1</Option>
-            <Option value="2">优先级2</Option>
-            <Option value="3">优先级3</Option>
-            <Option value="4">优先级4</Option>
-            <Option value="5">优先级5</Option>
-          </Select>
-        </Form.Item>
-
-        <Form.Item
-          name="replyType"
-          label="回复类型"
-          rules={[{ required: true, message: "请选择回复类型" }]}
-        >
-          <Select placeholder="请选择回复类型">
-            <Option value="text">文本回复</Option>
-            <Option value="template">模板回复</Option>
-          </Select>
-        </Form.Item>
-
-        <Form.Item
-          name="status"
-          label="状态"
-          rules={[{ required: true, message: "请选择状态" }]}
-        >
-          <Select placeholder="请选择状态">
-            <Option value="1">启用</Option>
-            <Option value="0">禁用</Option>
-          </Select>
-        </Form.Item>
-
-        <Form.Item>
-          <div
-            style={{ display: "flex", justifyContent: "flex-end", gap: "8px" }}
-          >
-            <Button onClick={handleCancel}>取消</Button>
-            <Button type="primary" htmlType="submit" loading={loading}>
-              确定
-            </Button>
-          </div>
-        </Form.Item>
-      </Form>
-    </Modal>
-  );
-};
-
-export default AddKeywordModal;
diff --git a/Touchkebao/src/pages/pc/ckbox/powerCenter/content-management/AddMaterialModal.tsx b/Touchkebao/src/pages/pc/ckbox/powerCenter/content-management/AddMaterialModal.tsx
deleted file mode 100644
index 70ee7e34..00000000
--- a/Touchkebao/src/pages/pc/ckbox/powerCenter/content-management/AddMaterialModal.tsx
+++ /dev/null
@@ -1,174 +0,0 @@
-import React, { useState } from "react";
-import { Modal, Form, Input, Button, message, Select } from "antd";
-import { addMaterial, type MaterialAddRequest } from "./api";
-import ImageUpload from "@/components/Upload/ImageUpload/ImageUpload";
-
-const { TextArea } = Input;
-const { Option } = Select;
-
-interface AddMaterialModalProps {
-  visible: boolean;
-  onCancel: () => void;
-  onSuccess: () => void;
-}
-
-const AddMaterialModal: React.FC<AddMaterialModalProps> = ({
-  visible,
-  onCancel,
-  onSuccess,
-}) => {
-  const [form] = Form.useForm();
-  const [loading, setLoading] = useState(false);
-  const [materialType, setMaterialType] = useState<string>("文本");
-
-  const handleSubmit = async (values: any) => {
-    try {
-      setLoading(true);
-      const data: MaterialAddRequest = {
-        title: values.title,
-        content: [values.content],
-        cover: Array.isArray(values.cover)
-          ? values.cover[0] || ""
-          : values.cover || "",
-        status: values.status || "1",
-        type: values.type || "文本",
-      };
-
-      const response = await addMaterial(data);
-      if (response) {
-        message.success("添加素材成功");
-        form.resetFields();
-        onSuccess();
-        onCancel();
-      } else {
-        message.error(response?.message || "添加素材失败");
-      }
-    } catch (error) {
-      console.error("添加素材失败:", error);
-      message.error("添加素材失败");
-    } finally {
-      setLoading(false);
-    }
-  };
-
-  const handleCancel = () => {
-    form.resetFields();
-    setMaterialType("文本");
-    onCancel();
-  };
-
-  return (
-    <Modal
-      title="添加素材"
-      open={visible}
-      onCancel={handleCancel}
-      footer={null}
-      width={600}
-    >
-      <Form
-        form={form}
-        layout="vertical"
-        onFinish={handleSubmit}
-        initialValues={{ status: "1", type: "文本" }}
-        onValuesChange={changedValues => {
-          if (changedValues.type) {
-            setMaterialType(changedValues.type);
-          }
-        }}
-      >
-        <Form.Item
-          name="title"
-          label="素材标题"
-          rules={[{ required: true, message: "请输入素材标题" }]}
-        >
-          <Input placeholder="请输入素材标题" />
-        </Form.Item>
-
-        <Form.Item
-          name="type"
-          label="素材类型"
-          rules={[{ required: true, message: "请选择素材类型" }]}
-        >
-          <Select placeholder="请选择素材类型">
-            <Option value="文本">文本</Option>
-            <Option value="图片">图片</Option>
-            <Option value="视频">视频</Option>
-          </Select>
-        </Form.Item>
-
-        {materialType === "文本" && (
-          <Form.Item
-            name="content"
-            label="素材内容"
-            rules={[{ required: true, message: "请输入素材内容" }]}
-          >
-            <TextArea
-              rows={4}
-              placeholder="请输入素材内容，多个内容用换行分隔"
-            />
-          </Form.Item>
-        )}
-
-        {materialType === "图片" && (
-          <Form.Item
-            name="content"
-            label="图片文件"
-            rules={[{ required: true, message: "请上传图片文件" }]}
-          >
-            <ImageUpload
-              count={1}
-              accept="image/*"
-              className="material-cover-upload"
-            />
-          </Form.Item>
-        )}
-
-        {materialType === "视频" && (
-          <Form.Item
-            name="content"
-            label="视频文件"
-            rules={[{ required: true, message: "请上传视频文件" }]}
-          >
-            <ImageUpload
-              count={1}
-              accept="video/*"
-              className="material-cover-upload"
-            />
-          </Form.Item>
-        )}
-
-        <Form.Item name="cover" label="封面图片">
-          <ImageUpload
-            count={1}
-            accept="image/*"
-            className="material-cover-upload"
-          />
-        </Form.Item>
-
-        <Form.Item
-          name="status"
-          label="状态"
-          rules={[{ required: true, message: "请选择状态" }]}
-        >
-          <Select placeholder="请选择状态">
-            <Option value="1">启用</Option>
-            <Option value="0">禁用</Option>
-          </Select>
-        </Form.Item>
-
-        <Form.Item>
-          <div
-            style={{ display: "flex", justifyContent: "flex-end", gap: "8px" }}
-          >
-            <Button onClick={handleCancel}>取消</Button>
-            <Button type="primary" htmlType="submit" loading={loading}>
-              确定
-            </Button>
-          </div>
-        </Form.Item>
-      </Form>
-    </Modal>
-  );
-};
-
-export default AddMaterialModal;
diff --git a/Touchkebao/src/pages/pc/ckbox/powerCenter/content-management/AddSensitiveWordModal.tsx b/Touchkebao/src/pages/pc/ckbox/powerCenter/content-management/AddSensitiveWordModal.tsx
deleted file mode 100644
index 4d3cdca7..00000000
--- a/Touchkebao/src/pages/pc/ckbox/powerCenter/content-management/AddSensitiveWordModal.tsx
+++ /dev/null
@@ -1,133 +0,0 @@
-import React, { useState } from "react";
-import { Modal, Form, Input, Button, message, Select } from "antd";
-import { addSensitiveWord, type SensitiveWordAddRequest } from "./api";
-
-const { TextArea } = Input;
-const { Option } = Select;
-
-interface AddSensitiveWordModalProps {
-  visible: boolean;
-  onCancel: () => void;
-  onSuccess: () => void;
-}
-
-const AddSensitiveWordModal: React.FC<AddSensitiveWordModalProps> = ({
-  visible,
-  onCancel,
-  onSuccess,
-}) => {
-  const [form] = Form.useForm();
-  const [loading, setLoading] = useState(false);
-
-  const handleSubmit = async (values: any) => {
-    try {
-      setLoading(true);
-      const data: SensitiveWordAddRequest = {
-        title: values.title,
-        keywords: values.keywords,
-        content: values.content,
-        operation: values.operation,
-        status: values.status || "1",
-      };
-
-      const response = await addSensitiveWord(data);
-      if (response) {
-        message.success("添加敏感词成功");
-        form.resetFields();
-        onSuccess();
-        onCancel();
-      } else {
-        message.error(response?.message || "添加敏感词失败");
-      }
-    } catch (error) {
-      console.error("添加敏感词失败:", error);
-      message.error("添加敏感词失败");
-    } finally {
-      setLoading(false);
-    }
-  };
-
-  const handleCancel = () => {
-    form.resetFields();
-    onCancel();
-  };
-
-  return (
-    <Modal
-      title="添加敏感词"
-      open={visible}
-      onCancel={handleCancel}
-      footer={null}
-      width={600}
-    >
-      <Form
-        form={form}
-        layout="vertical"
-        onFinish={handleSubmit}
-        initialValues={{ status: "1", operation: "1" }}
-      >
-        <Form.Item
-          name="title"
-          label="敏感词标题"
-          rules={[{ required: true, message: "请输入敏感词标题" }]}
-        >
-          <Input placeholder="请输入敏感词标题" />
-        </Form.Item>
-
-        <Form.Item
-          name="keywords"
-          label="关键词"
-          rules={[{ required: true, message: "请输入关键词" }]}
-        >
-          <Input placeholder="请输入关键词" />
-        </Form.Item>
-
-        <Form.Item
-          name="content"
-          label="敏感词内容"
-          rules={[{ required: true, message: "请输入敏感词内容" }]}
-        >
-          <TextArea rows={4} placeholder="请输入敏感词内容" />
-        </Form.Item>
-
-        <Form.Item
-          name="operation"
-          label="操作类型"
-          rules={[{ required: true, message: "请选择操作类型" }]}
-        >
-          <Select placeholder="请选择操作类型">
-            <Option value="0">不操作</Option>
-            <Option value="1">替换</Option>
-            <Option value="2">删除</Option>
-            <Option value="3">警告</Option>
-            <Option value="4">禁止发送</Option>
-          </Select>
-        </Form.Item>
-
-        <Form.Item
-          name="status"
-          label="状态"
-          rules={[{ required: true, message: "请选择状态" }]}
-        >
-          <Select placeholder="请选择状态">
-            <Option value="1">启用</Option>
-            <Option value="0">禁用</Option>
-          </Select>
-        </Form.Item>
-
-        <Form.Item>
-          <div
-            style={{ display: "flex", justifyContent: "flex-end", gap: "8px" }}
-          >
-            <Button onClick={handleCancel}>取消</Button>
-            <Button type="primary" htmlType="submit" loading={loading}>
-              确定
-            </Button>
-          </div>
-        </Form.Item>
-      </Form>
-    </Modal>
-  );
-};
-
-export default AddSensitiveWordModal;
diff --git a/Touchkebao/src/pages/pc/ckbox/powerCenter/content-management/EditMaterialModal.tsx b/Touchkebao/src/pages/pc/ckbox/powerCenter/content-management/EditMaterialModal.tsx
deleted file mode 100644
index f92de0d1..00000000
--- a/Touchkebao/src/pages/pc/ckbox/powerCenter/content-management/EditMaterialModal.tsx
+++ /dev/null
@@ -1,211 +0,0 @@
-import React, { useState, useEffect } from "react";
-import { Modal, Form, Input, Button, message, Select } from "antd";
-import {
-  updateMaterial,
-  getMaterialDetails,
-  type MaterialUpdateRequest,
-} from "./api";
-import ImageUpload from "@/components/Upload/ImageUpload/ImageUpload";
-
-const { TextArea } = Input;
-const { Option } = Select;
-
-interface EditMaterialModalProps {
-  visible: boolean;
-  materialId: number | null;
-  onCancel: () => void;
-  onSuccess: () => void;
-}
-
-const EditMaterialModal: React.FC<EditMaterialModalProps> = ({
-  visible,
-  materialId,
-  onCancel,
-  onSuccess,
-}) => {
-  const [form] = Form.useForm();
-  const [loading, setLoading] = useState(false);
-  const [materialType, setMaterialType] = useState<string>("文本");
-
-  // 获取素材详情
-  const fetchMaterialDetails = async (id: number) => {
-    try {
-      const response = await getMaterialDetails(id.toString());
-      if (response) {
-        const material = response;
-        form.setFieldsValue({
-          title: material.title,
-          content: Array.isArray(material.content)
-            ? material.content.join("\n")
-            : material.content,
-          cover: material.cover ? [material.cover] : [],
-          status: material.status.toString(),
-          type: material.type || "文本",
-        });
-        setMaterialType(material.type || "文本");
-      }
-    } catch (error) {
-      console.error("获取素材详情失败:", error);
-      message.error("获取素材详情失败");
-    }
-  };
-
-  // 当弹窗打开且有ID时，获取详情
-  useEffect(() => {
-    if (visible && materialId) {
-      fetchMaterialDetails(materialId);
-    }
-  }, [visible, materialId]);
-
-  const handleSubmit = async (values: any) => {
-    try {
-      setLoading(true);
-      const data: MaterialUpdateRequest = {
-        id: materialId?.toString(),
-        title: values.title,
-        content: [values.content],
-        cover: Array.isArray(values.cover)
-          ? values.cover[0] || ""
-          : values.cover || "",
-        status: values.status || "1",
-        type: values.type || "文本",
-      };
-
-      const response = await updateMaterial(data);
-      if (response) {
-        message.success("更新素材成功");
-        form.resetFields();
-        onSuccess();
-        onCancel();
-      } else {
-        message.error(response?.message || "更新素材失败");
-      }
-    } catch (error) {
-      console.error("更新素材失败:", error);
-      message.error("更新素材失败");
-    } finally {
-      setLoading(false);
-    }
-  };
-
-  const handleCancel = () => {
-    form.resetFields();
-    setMaterialType("文本");
-    onCancel();
-  };
-
-  return (
-    <Modal
-      title="编辑素材"
-      open={visible}
-      onCancel={handleCancel}
-      footer={null}
-      width={600}
-    >
-      <Form
-        form={form}
-        layout="vertical"
-        onFinish={handleSubmit}
-        initialValues={{ status: "1", type: "文本" }}
-        onValuesChange={changedValues => {
-          if (changedValues.type) {
-            setMaterialType(changedValues.type);
-          }
-        }}
-      >
-        <Form.Item
-          name="title"
-          label="素材标题"
-          rules={[{ required: true, message: "请输入素材标题" }]}
-        >
-          <Input placeholder="请输入素材标题" />
-        </Form.Item>
-
-        <Form.Item
-          name="type"
-          label="素材类型"
-          rules={[{ required: true, message: "请选择素材类型" }]}
-        >
-          <Select placeholder="请选择素材类型">
-            <Option value="文本">文本</Option>
-            <Option value="图片">图片</Option>
-            <Option value="视频">视频</Option>
-          </Select>
-        </Form.Item>
-
-        {materialType === "文本" && (
-          <Form.Item
-            name="content"
-            label="素材内容"
-            rules={[{ required: true, message: "请输入素材内容" }]}
-          >
-            <TextArea
-              rows={4}
-              placeholder="请输入素材内容，多个内容用换行分隔"
-            />
-          </Form.Item>
-        )}
-
-        {materialType === "图片" && (
-          <Form.Item
-            name="content"
-            label="图片文件"
-            rules={[{ required: true, message: "请上传图片文件" }]}
-          >
-            <ImageUpload
-              count={1}
-              accept="image/*"
-              className="material-cover-upload"
-            />
-          </Form.Item>
-        )}
-
-        {materialType === "视频" && (
-          <Form.Item
-            name="content"
-            label="视频文件"
-            rules={[{ required: true, message: "请上传视频文件" }]}
-          >
-            <ImageUpload
-              count={1}
-              accept="video/*"
-              className="material-cover-upload"
-            />
-          </Form.Item>
-        )}
-
-        <Form.Item name="cover" label="封面图片">
-          <ImageUpload
-            count={1}
-            accept="image/*"
-            className="material-cover-upload"
-          />
-        </Form.Item>
-
-        <Form.Item
-          name="status"
-          label="状态"
-          rules={[{ required: true, message: "请选择状态" }]}
-        >
-          <Select placeholder="请选择状态">
-            <Option value="1">启用</Option>
-            <Option value="0">禁用</Option>
-          </Select>
-        </Form.Item>
-
-        <Form.Item>
-          <div
-            style={{ display: "flex", justifyContent: "flex-end", gap: "8px" }}
-          >
-            <Button onClick={handleCancel}>取消</Button>
-            <Button type="primary" htmlType="submit" loading={loading}>
-              确定
-            </Button>
-          </div>
-        </Form.Item>
-      </Form>
-    </Modal>
-  );
-};
-
-export default EditMaterialModal;
diff --git a/Touchkebao/src/pages/pc/ckbox/powerCenter/content-management/api.ts b/Touchkebao/src/pages/pc/ckbox/powerCenter/content-management/api.ts
index d7d09ee5..7557e635 100644
--- a/Touchkebao/src/pages/pc/ckbox/powerCenter/content-management/api.ts
+++ b/Touchkebao/src/pages/pc/ckbox/powerCenter/content-management/api.ts
@@ -7,13 +7,22 @@ export interface MaterialListParams {
   page?: string;
 }
 
+// 内容项类型定义
+export interface ContentItem {
+  type: "text" | "image" | "video" | "file" | "audio" | "link";
+  data: string | LinkData;
+}
+
+// 链接数据类型
+export interface LinkData {
+  url: string;
+}
+
 export interface MaterialAddRequest {
-  content: string[];
-  cover: string;
-  status: string;
   title: string;
-  type: string; // 素材类型：文本、图片、视频
-  [property: string]: any;
+  cover?: string;
+  status: number;
+  content: ContentItem[];
 }
 
 export interface MaterialUpdateRequest extends MaterialAddRequest {
diff --git a/Touchkebao/src/pages/pc/ckbox/powerCenter/content-management/components/index.ts b/Touchkebao/src/pages/pc/ckbox/powerCenter/content-management/components/index.ts
index c14b46af..8acd8cb1 100644
--- a/Touchkebao/src/pages/pc/ckbox/powerCenter/content-management/components/index.ts
+++ b/Touchkebao/src/pages/pc/ckbox/powerCenter/content-management/components/index.ts
@@ -1,3 +1,9 @@
-export { default as MaterialManagement } from "../MaterialManagement";
-export { default as SensitiveWordManagement } from "../SensitiveWordManagement";
-export { default as KeywordManagement } from "../KeywordManagement";
+// 管理组件导出
+export { default as MaterialManagement } from "./management/MaterialManagement";
+export { default as SensitiveWordManagement } from "./management/SensitiveWordManagement";
+export { default as KeywordManagement } from "./management/KeywordManagement";
+
+// 模态框组件导出
+export { default as MaterialModal } from "./modals/MaterialModal";
+export { default as SensitiveWordModal } from "./modals/SensitiveWordModal";
+export { default as KeywordModal } from "./modals/KeywordModal";
diff --git a/Touchkebao/src/pages/pc/ckbox/powerCenter/content-management/KeywordManagement.tsx b/Touchkebao/src/pages/pc/ckbox/powerCenter/content-management/components/management/KeywordManagement.tsx
similarity index 97%
rename from Touchkebao/src/pages/pc/ckbox/powerCenter/content-management/KeywordManagement.tsx
rename to Touchkebao/src/pages/pc/ckbox/powerCenter/content-management/components/management/KeywordManagement.tsx
index 1aa504c4..9191e610 100644
--- a/Touchkebao/src/pages/pc/ckbox/powerCenter/content-management/KeywordManagement.tsx
+++ b/Touchkebao/src/pages/pc/ckbox/powerCenter/content-management/components/management/KeywordManagement.tsx
@@ -6,14 +6,14 @@ import {
   FormOutlined,
   DeleteOutlined,
 } from "@ant-design/icons";
-import styles from "./index.module.scss";
+import styles from "../../index.module.scss";
 import {
   getKeywordList,
   deleteKeyword,
   setKeywordStatus,
   type KeywordListParams,
-} from "./api";
-import EditKeywordModal from "./EditKeywordModal";
+} from "../../api";
+import KeywordModal from "../modals/KeywordModal";
 
 const { Search } = Input;
 
@@ -210,8 +210,9 @@ const KeywordManagement: React.FC = () => {
       </div>
 
       {/* 编辑弹窗 */}
-      <EditKeywordModal
+      <KeywordModal
         visible={editModalVisible}
+        mode="edit"
         keywordId={editingKeywordId}
         onCancel={() => {
           setEditModalVisible(false);
diff --git a/Touchkebao/src/pages/pc/ckbox/powerCenter/content-management/MaterialManagement.tsx b/Touchkebao/src/pages/pc/ckbox/powerCenter/content-management/components/management/MaterialManagement.tsx
similarity index 94%
rename from Touchkebao/src/pages/pc/ckbox/powerCenter/content-management/MaterialManagement.tsx
rename to Touchkebao/src/pages/pc/ckbox/powerCenter/content-management/components/management/MaterialManagement.tsx
index 0bb857d5..712ddd3a 100644
--- a/Touchkebao/src/pages/pc/ckbox/powerCenter/content-management/MaterialManagement.tsx
+++ b/Touchkebao/src/pages/pc/ckbox/powerCenter/content-management/components/management/MaterialManagement.tsx
@@ -1,4 +1,9 @@
-import React, { useState, useEffect } from "react";
+import React, {
+  useState,
+  useEffect,
+  forwardRef,
+  useImperativeHandle,
+} from "react";
 import { Button, Input, Card, message, Switch, Tag } from "antd";
 import {
   SearchOutlined,
@@ -8,14 +13,14 @@ import {
   FileImageOutlined,
   PlayCircleOutlined,
 } from "@ant-design/icons";
-import styles from "./index.module.scss";
+import styles from "../../index.module.scss";
 import {
   getMaterialList,
   deleteMaterial,
   setMaterialStatus,
   type MaterialListParams,
-} from "./api";
-import EditMaterialModal from "./EditMaterialModal";
+} from "../../api";
+import MaterialModal from "../modals/MaterialModal";
 
 const { Search } = Input;
 
@@ -35,7 +40,7 @@ interface MaterialItem {
   userName: string;
 }
 
-const MaterialManagement: React.FC = () => {
+const MaterialManagement = forwardRef<any, {}>((props, ref) => {
   const [searchValue, setSearchValue] = useState<string>("");
   const [materialsList, setMaterialsList] = useState<MaterialItem[]>([]);
   const [loading, setLoading] = useState<boolean>(false);
@@ -92,6 +97,11 @@ const MaterialManagement: React.FC = () => {
     }
   };
 
+  // 暴露方法给父组件
+  useImperativeHandle(ref, () => ({
+    fetchMaterials,
+  }));
+
   // 素材管理相关函数
   const handleDeleteMaterial = async (id: number) => {
     try {
@@ -244,8 +254,9 @@ const MaterialManagement: React.FC = () => {
       </div>
 
       {/* 编辑弹窗 */}
-      <EditMaterialModal
+      <MaterialModal
         visible={editModalVisible}
+        mode="edit"
         materialId={editingMaterialId}
         onCancel={() => {
           setEditModalVisible(false);
@@ -255,6 +266,6 @@ const MaterialManagement: React.FC = () => {
       />
     </div>
   );
-};
+});
 
 export default MaterialManagement;
diff --git a/Touchkebao/src/pages/pc/ckbox/powerCenter/content-management/SensitiveWordManagement.tsx b/Touchkebao/src/pages/pc/ckbox/powerCenter/content-management/components/management/SensitiveWordManagement.tsx
similarity index 97%
rename from Touchkebao/src/pages/pc/ckbox/powerCenter/content-management/SensitiveWordManagement.tsx
rename to Touchkebao/src/pages/pc/ckbox/powerCenter/content-management/components/management/SensitiveWordManagement.tsx
index 8acfb016..a51c3953 100644
--- a/Touchkebao/src/pages/pc/ckbox/powerCenter/content-management/SensitiveWordManagement.tsx
+++ b/Touchkebao/src/pages/pc/ckbox/powerCenter/content-management/components/management/SensitiveWordManagement.tsx
@@ -6,14 +6,14 @@ import {
   FormOutlined,
   DeleteOutlined,
 } from "@ant-design/icons";
-import styles from "./index.module.scss";
+import styles from "../../index.module.scss";
 import {
   getSensitiveWordList,
   deleteSensitiveWord,
   setSensitiveWordStatus,
   type SensitiveWordListParams,
-} from "./api";
-import EditSensitiveWordModal from "./EditSensitiveWordModal";
+} from "../../api";
+import SensitiveWordModal from "../modals/SensitiveWordModal";
 
 const { Search } = Input;
 
@@ -215,8 +215,9 @@ const SensitiveWordManagement: React.FC = () => {
       </div>
 
       {/* 编辑弹窗 */}
-      <EditSensitiveWordModal
+      <SensitiveWordModal
         visible={editModalVisible}
+        mode="edit"
         sensitiveWordId={editingSensitiveWordId}
         onCancel={() => {
           setEditModalVisible(false);
diff --git a/Touchkebao/src/pages/pc/ckbox/powerCenter/content-management/components/management/index.ts b/Touchkebao/src/pages/pc/ckbox/powerCenter/content-management/components/management/index.ts
new file mode 100644
index 00000000..deff774a
--- /dev/null
+++ b/Touchkebao/src/pages/pc/ckbox/powerCenter/content-management/components/management/index.ts
@@ -0,0 +1,4 @@
+// 管理组件统一导出
+export { default as MaterialManagement } from "./MaterialManagement";
+export { default as SensitiveWordManagement } from "./SensitiveWordManagement";
+export { default as KeywordManagement } from "./KeywordManagement";
diff --git a/Touchkebao/src/pages/pc/ckbox/powerCenter/content-management/components/modals/ContentManager.tsx b/Touchkebao/src/pages/pc/ckbox/powerCenter/content-management/components/modals/ContentManager.tsx
new file mode 100644
index 00000000..d471926f
--- /dev/null
+++ b/Touchkebao/src/pages/pc/ckbox/powerCenter/content-management/components/modals/ContentManager.tsx
@@ -0,0 +1,244 @@
+import React, { useState, useEffect } from "react";
+import { Button, Input, Select } from "antd";
+import {
+  PlusOutlined,
+  DeleteOutlined,
+  FileTextOutlined,
+  FileImageOutlined,
+  PlayCircleOutlined,
+  FileOutlined,
+  SoundOutlined,
+  LinkOutlined,
+} from "@ant-design/icons";
+import ImageUpload from "@/components/Upload/ImageUpload/ImageUpload";
+import VideoUpload from "@/components/Upload/VideoUpload";
+import FileUpload from "@/components/Upload/FileUpload";
+import type { ContentItem } from "../../api";
+
+const { TextArea } = Input;
+const { Option } = Select;
+
+interface ContentManagerProps {
+  value?: ContentItem[];
+  onChange?: (content: ContentItem[]) => void;
+}
+
+const ContentManager: React.FC<ContentManagerProps> = ({
+  value = [],
+  onChange,
+}) => {
+  const [contentItems, setContentItems] = useState<ContentItem[]>(value);
+
+  // 内容类型配置
+  const contentTypes = [
+    { value: "text", label: "文本", icon: <FileTextOutlined /> },
+    { value: "image", label: "图片", icon: <FileImageOutlined /> },
+    { value: "video", label: "视频", icon: <PlayCircleOutlined /> },
+    { value: "file", label: "文件", icon: <FileOutlined /> },
+    { value: "audio", label: "音频", icon: <SoundOutlined /> },
+    { value: "link", label: "链接", icon: <LinkOutlined /> },
+  ];
+
+  // 同步外部value到内部state
+  useEffect(() => {
+    setContentItems(value);
+  }, [value]);
+
+  // 初始化时添加默认文本内容项
+  useEffect(() => {
+    if (contentItems.length === 0) {
+      const defaultTextItem: ContentItem = {
+        type: "text",
+        data: "",
+      };
+      setContentItems([defaultTextItem]);
+      onChange?.([defaultTextItem]);
+    }
+  }, [contentItems.length, onChange]);
+
+  // 更新内容项
+  const updateContentItems = (newItems: ContentItem[]) => {
+    setContentItems(newItems);
+    onChange?.(newItems);
+  };
+
+  // 添加新内容项
+  const handleAddItem = () => {
+    const newItem: ContentItem = {
+      type: "text",
+      data: "",
+    };
+
+    const newItems = [...contentItems, newItem];
+    updateContentItems(newItems);
+  };
+
+  // 删除内容项
+  const handleDeleteItem = (index: number) => {
+    const newItems = contentItems.filter((_, i) => i !== index);
+    updateContentItems(newItems);
+  };
+
+  // 更新内容项数据
+  const updateItemData = (index: number, data: any) => {
+    const newItems = [...contentItems];
+    newItems[index] = { ...newItems[index], data };
+    updateContentItems(newItems);
+  };
+
+  // 更新内容项类型
+  const updateItemType = (index: number, newType: string) => {
+    const newItems = [...contentItems];
+
+    // 根据新类型重置数据
+    let newData: any;
+    if (newType === "link") {
+      newData = "";
+    } else {
+      newData = "";
+    }
+
+    newItems[index] = {
+      type: newType as any,
+      data: newData,
+    };
+    updateContentItems(newItems);
+  };
+
+  // 渲染内容项
+  const renderContentItem = (item: ContentItem, index: number) => {
+    return (
+      <div
+        key={index}
+        style={{
+          border: "1px solid #d9d9d9",
+          borderRadius: "6px",
+          padding: "12px",
+          marginBottom: "8px",
+          backgroundColor: "#fafafa",
+        }}
+      >
+        <div
+          style={{
+            display: "flex",
+            justifyContent: "space-between",
+            alignItems: "center",
+            marginBottom: "8px",
+          }}
+        >
+          <div style={{ display: "flex", alignItems: "center", gap: "8px" }}>
+            <Select
+              value={item.type}
+              onChange={newType => updateItemType(index, newType)}
+              style={{ width: 120 }}
+              size="small"
+            >
+              {contentTypes.map(type => (
+                <Option key={type.value} value={type.value}>
+                  {type.icon} {type.label}
+                </Option>
+              ))}
+            </Select>
+          </div>
+          {index !== 0 && (
+            <Button
+              type="link"
+              danger
+              size="small"
+              icon={<DeleteOutlined />}
+              onClick={() => handleDeleteItem(index)}
+            />
+          )}
+        </div>
+
+        {renderContentInput(item, index)}
+      </div>
+    );
+  };
+
+  // 渲染内容输入
+  const renderContentInput = (item: ContentItem, index: number) => {
+    switch (item.type) {
+      case "text":
+        return (
+          <TextArea
+            value={item.data as string}
+            onChange={e => updateItemData(index, e.target.value)}
+            placeholder="请输入文本内容"
+            rows={3}
+          />
+        );
+      case "image":
+        return (
+          <ImageUpload
+            count={1}
+            accept="image/*"
+            value={item.data ? [item.data as string] : []}
+            onChange={urls => updateItemData(index, urls[0] || "")}
+          />
+        );
+      case "video":
+        return (
+          <VideoUpload
+            value={item.data as string}
+            onChange={url => updateItemData(index, url)}
+            maxSize={50}
+            showPreview={true}
+          />
+        );
+      case "file":
+        return (
+          <FileUpload
+            value={item.data as string}
+            onChange={url => updateItemData(index, url)}
+            maxSize={10}
+            showPreview={true}
+            acceptTypes={["excel", "word", "ppt", "pdf", "txt"]}
+          />
+        );
+      case "audio":
+        return (
+          <FileUpload
+            value={item.data as string}
+            onChange={url => updateItemData(index, url)}
+            maxSize={50}
+            showPreview={true}
+            acceptTypes={["mp3", "wav", "aac", "m4a", "ogg"]}
+          />
+        );
+      case "link": {
+        return (
+          <div>
+            <Input
+              value={item.data as string}
+              onChange={e => updateItemData(index, e.target.value)}
+              placeholder="链接URL"
+              style={{ marginBottom: 8 }}
+            />
+          </div>
+        );
+      }
+      default:
+        return null;
+    }
+  };
+
+  return (
+    <div>
+      {/* 内容列表 */}
+      {contentItems.map((item, index) => renderContentItem(item, index))}
+
+      {/* 添加内容区域 */}
+      <Button
+        type="dashed"
+        block
+        icon={<PlusOutlined />}
+        onClick={handleAddItem}
+      >
+        添加内容
+      </Button>
+    </div>
+  );
+};
+
+export default ContentManager;
diff --git a/Touchkebao/src/pages/pc/ckbox/powerCenter/content-management/EditKeywordModal.tsx b/Touchkebao/src/pages/pc/ckbox/powerCenter/content-management/components/modals/KeywordModal.tsx
similarity index 68%
rename from Touchkebao/src/pages/pc/ckbox/powerCenter/content-management/EditKeywordModal.tsx
rename to Touchkebao/src/pages/pc/ckbox/powerCenter/content-management/components/modals/KeywordModal.tsx
index 8206b77f..e2e911e4 100644
--- a/Touchkebao/src/pages/pc/ckbox/powerCenter/content-management/EditKeywordModal.tsx
+++ b/Touchkebao/src/pages/pc/ckbox/powerCenter/content-management/components/modals/KeywordModal.tsx
@@ -1,23 +1,27 @@
 import React, { useState, useEffect } from "react";
 import { Modal, Form, Input, Button, message, Select } from "antd";
 import {
+  addKeyword,
   updateKeyword,
   getKeywordDetails,
+  type KeywordAddRequest,
   type KeywordUpdateRequest,
-} from "./api";
+} from "../../api";
 
 const { TextArea } = Input;
 const { Option } = Select;
 
-interface EditKeywordModalProps {
+interface KeywordModalProps {
   visible: boolean;
-  keywordId: string | null;
+  mode: "add" | "edit";
+  keywordId?: string | null;
   onCancel: () => void;
   onSuccess: () => void;
 }
 
-const EditKeywordModal: React.FC<EditKeywordModalProps> = ({
+const KeywordModal: React.FC<KeywordModalProps> = ({
   visible,
+  mode,
   keywordId,
   onCancel,
   onSuccess,
@@ -47,39 +51,65 @@ const EditKeywordModal: React.FC<EditKeywordModalProps> = ({
     }
   };
 
-  // 当弹窗打开且有ID时，获取详情
+  // 当弹窗打开且为编辑模式时，获取详情
   useEffect(() => {
-    if (visible && keywordId) {
+    if (visible && mode === "edit" && keywordId) {
       fetchKeywordDetails(keywordId);
+    } else if (visible && mode === "add") {
+      // 添加模式时重置表单
+      form.resetFields();
     }
-  }, [visible, keywordId]);
+  }, [visible, mode, keywordId]);
 
   const handleSubmit = async (values: any) => {
     try {
       setLoading(true);
-      const data: KeywordUpdateRequest = {
-        id: keywordId,
-        title: values.title,
-        keywords: values.keywords,
-        content: values.content,
-        matchType: values.matchType,
-        priority: values.priority,
-        replyType: values.replyType,
-        status: values.status,
-      };
 
-      const response = await updateKeyword(data);
-      if (response) {
-        message.success("更新关键词回复成功");
-        form.resetFields();
-        onSuccess();
-        onCancel();
+      if (mode === "add") {
+        const data: KeywordAddRequest = {
+          title: values.title,
+          keywords: values.keywords,
+          content: values.content,
+          matchType: values.matchType,
+          priority: values.priority,
+          replyType: values.replyType,
+          status: values.status || "1",
+        };
+
+        const response = await addKeyword(data);
+        if (response) {
+          message.success("添加关键词成功");
+          form.resetFields();
+          onSuccess();
+          onCancel();
+        } else {
+          message.error(response?.message || "添加关键词失败");
+        }
       } else {
-        message.error(response?.message || "更新关键词回复失败");
+        const data: KeywordUpdateRequest = {
+          id: keywordId,
+          title: values.title,
+          keywords: values.keywords,
+          content: values.content,
+          matchType: values.matchType,
+          priority: values.priority,
+          replyType: values.replyType,
+          status: values.status,
+        };
+
+        const response = await updateKeyword(data);
+        if (response) {
+          message.success("更新关键词回复成功");
+          form.resetFields();
+          onSuccess();
+          onCancel();
+        } else {
+          message.error(response?.message || "更新关键词回复失败");
+        }
       }
     } catch (error) {
-      console.error("更新关键词回复失败:", error);
-      message.error("更新关键词回复失败");
+      console.error(`${mode === "add" ? "添加" : "更新"}关键词失败:`, error);
+      message.error(`${mode === "add" ? "添加" : "更新"}关键词失败`);
     } finally {
       setLoading(false);
     }
@@ -90,9 +120,11 @@ const EditKeywordModal: React.FC<EditKeywordModalProps> = ({
     onCancel();
   };
 
+  const title = mode === "add" ? "添加关键词回复" : "编辑关键词回复";
+
   return (
     <Modal
-      title="编辑关键词回复"
+      title={title}
       open={visible}
       onCancel={handleCancel}
       footer={null}
@@ -195,4 +227,4 @@ const EditKeywordModal: React.FC<EditKeywordModalProps> = ({
   );
 };
 
-export default EditKeywordModal;
+export default KeywordModal;
diff --git a/Touchkebao/src/pages/pc/ckbox/powerCenter/content-management/components/modals/MaterialModal.tsx b/Touchkebao/src/pages/pc/ckbox/powerCenter/content-management/components/modals/MaterialModal.tsx
new file mode 100644
index 00000000..9a3f6bea
--- /dev/null
+++ b/Touchkebao/src/pages/pc/ckbox/powerCenter/content-management/components/modals/MaterialModal.tsx
@@ -0,0 +1,194 @@
+import React, { useState, useEffect, useCallback } from "react";
+import { Modal, Form, Input, Button, message, Select } from "antd";
+import {
+  addMaterial,
+  updateMaterial,
+  getMaterialDetails,
+  type MaterialAddRequest,
+  type MaterialUpdateRequest,
+  type ContentItem,
+} from "../../api";
+import ImageUpload from "@/components/Upload/ImageUpload/ImageUpload";
+import ContentManager from "./ContentManager";
+
+const { Option } = Select;
+
+interface MaterialModalProps {
+  visible: boolean;
+  mode: "add" | "edit";
+  materialId?: number | null;
+  onCancel: () => void;
+  onSuccess: () => void;
+}
+
+const MaterialModal: React.FC<MaterialModalProps> = ({
+  visible,
+  mode,
+  materialId,
+  onCancel,
+  onSuccess,
+}) => {
+  const [form] = Form.useForm();
+  const [loading, setLoading] = useState(false);
+  const [contentItems, setContentItems] = useState<ContentItem[]>([]);
+
+  // 获取素材详情
+  const fetchMaterialDetails = useCallback(
+    async (id: number) => {
+      try {
+        const response = await getMaterialDetails(id.toString());
+        if (response) {
+          const material = response;
+          form.setFieldsValue({
+            title: material.title,
+            cover: material.cover ? [material.cover] : [],
+            status: material.status,
+          });
+          // 设置内容项
+          setContentItems(material.content || []);
+        }
+      } catch (error) {
+        console.error("获取素材详情失败:", error);
+        message.error("获取素材详情失败");
+      }
+    },
+    [form],
+  );
+
+  // 当弹窗打开且为编辑模式时，获取详情
+  useEffect(() => {
+    if (visible && mode === "edit" && materialId) {
+      fetchMaterialDetails(materialId);
+    } else if (visible && mode === "add") {
+      // 添加模式时重置表单
+      form.resetFields();
+      setContentItems([]);
+    }
+  }, [visible, mode, materialId, fetchMaterialDetails, form]);
+
+  const handleSubmit = async (values: any) => {
+    try {
+      setLoading(true);
+
+      // 验证内容项
+      if (contentItems.length === 0) {
+        message.warning("请至少添加一个内容项");
+        return;
+      }
+
+      const coverValue = Array.isArray(values.cover)
+        ? values.cover[0] || ""
+        : values.cover || "";
+
+      const data: MaterialAddRequest = {
+        title: values.title,
+        status: values.status || 1,
+        content: contentItems,
+        ...(coverValue && { cover: coverValue }),
+      };
+
+      if (mode === "add") {
+        const response = await addMaterial(data);
+        if (response) {
+          message.success("添加素材成功");
+          form.resetFields();
+          setContentItems([]);
+          onSuccess();
+          onCancel();
+        } else {
+          message.error(response?.message || "添加素材失败");
+        }
+      } else {
+        const updateData: MaterialUpdateRequest = {
+          ...data,
+          id: materialId?.toString(),
+        };
+
+        const response = await updateMaterial(updateData);
+        if (response) {
+          message.success("更新素材成功");
+          form.resetFields();
+          setContentItems([]);
+          onSuccess();
+          onCancel();
+        } else {
+          message.error(response?.message || "更新素材失败");
+        }
+      }
+    } catch (error) {
+      console.error(`${mode === "add" ? "添加" : "更新"}素材失败:`, error);
+      message.error(`${mode === "add" ? "添加" : "更新"}素材失败`);
+    } finally {
+      setLoading(false);
+    }
+  };
+
+  const handleCancel = () => {
+    form.resetFields();
+    setContentItems([]);
+    onCancel();
+  };
+
+  const title = mode === "add" ? "添加素材" : "编辑素材";
+
+  return (
+    <Modal
+      title={title}
+      open={visible}
+      onCancel={handleCancel}
+      footer={null}
+      width={800}
+    >
+      <Form
+        form={form}
+        layout="vertical"
+        onFinish={handleSubmit}
+        initialValues={{ status: 1 }}
+      >
+        <Form.Item
+          name="title"
+          label="素材标题"
+          rules={[{ required: true, message: "请输入素材标题" }]}
+        >
+          <Input placeholder="请输入素材标题" />
+        </Form.Item>
+
+        <Form.Item label="素材内容">
+          <ContentManager value={contentItems} onChange={setContentItems} />
+        </Form.Item>
+
+        <Form.Item name="cover" label="封面图片">
+          <ImageUpload
+            count={1}
+            accept="image/*"
+            className="material-cover-upload"
+          />
+        </Form.Item>
+
+        <Form.Item
+          name="status"
+          label="状态"
+          rules={[{ required: true, message: "请选择状态" }]}
+        >
+          <Select placeholder="请选择状态">
+            <Option value={1}>启用</Option>
+            <Option value={0}>禁用</Option>
+          </Select>
+        </Form.Item>
+
+        <Form.Item>
+          <div
+            style={{ display: "flex", justifyContent: "flex-end", gap: "8px" }}
+          >
+            <Button onClick={handleCancel}>取消</Button>
+            <Button type="primary" htmlType="submit" loading={loading}>
+              确定
+            </Button>
+          </div>
+        </Form.Item>
+      </Form>
+    </Modal>
+  );
+};
+
+export default MaterialModal;
diff --git a/Touchkebao/src/pages/pc/ckbox/powerCenter/content-management/EditSensitiveWordModal.tsx b/Touchkebao/src/pages/pc/ckbox/powerCenter/content-management/components/modals/SensitiveWordModal.tsx
similarity index 65%
rename from Touchkebao/src/pages/pc/ckbox/powerCenter/content-management/EditSensitiveWordModal.tsx
rename to Touchkebao/src/pages/pc/ckbox/powerCenter/content-management/components/modals/SensitiveWordModal.tsx
index a5c45faf..22628f4e 100644
--- a/Touchkebao/src/pages/pc/ckbox/powerCenter/content-management/EditSensitiveWordModal.tsx
+++ b/Touchkebao/src/pages/pc/ckbox/powerCenter/content-management/components/modals/SensitiveWordModal.tsx
@@ -1,23 +1,27 @@
 import React, { useState, useEffect } from "react";
 import { Modal, Form, Input, Button, message, Select } from "antd";
 import {
+  addSensitiveWord,
   updateSensitiveWord,
   getSensitiveWordDetails,
+  type SensitiveWordAddRequest,
   type SensitiveWordUpdateRequest,
-} from "./api";
+} from "../../api";
 
 const { TextArea } = Input;
 const { Option } = Select;
 
-interface EditSensitiveWordModalProps {
+interface SensitiveWordModalProps {
   visible: boolean;
-  sensitiveWordId: string | null;
+  mode: "add" | "edit";
+  sensitiveWordId?: string | null;
   onCancel: () => void;
   onSuccess: () => void;
 }
 
-const EditSensitiveWordModal: React.FC<EditSensitiveWordModalProps> = ({
+const SensitiveWordModal: React.FC<SensitiveWordModalProps> = ({
   visible,
+  mode,
   sensitiveWordId,
   onCancel,
   onSuccess,
@@ -45,37 +49,61 @@ const EditSensitiveWordModal: React.FC<EditSensitiveWordModalProps> = ({
     }
   };
 
-  // 当弹窗打开且有ID时，获取详情
+  // 当弹窗打开且为编辑模式时，获取详情
   useEffect(() => {
-    if (visible && sensitiveWordId) {
+    if (visible && mode === "edit" && sensitiveWordId) {
       fetchSensitiveWordDetails(sensitiveWordId);
+    } else if (visible && mode === "add") {
+      // 添加模式时重置表单
+      form.resetFields();
     }
-  }, [visible, sensitiveWordId]);
+  }, [visible, mode, sensitiveWordId]);
 
   const handleSubmit = async (values: any) => {
     try {
       setLoading(true);
-      const data: SensitiveWordUpdateRequest = {
-        id: sensitiveWordId,
-        title: values.title,
-        keywords: values.keywords,
-        content: values.content,
-        operation: values.operation,
-        status: values.status,
-      };
 
-      const response = await updateSensitiveWord(data);
-      if (response) {
-        message.success("更新敏感词成功");
-        form.resetFields();
-        onSuccess();
-        onCancel();
+      if (mode === "add") {
+        const data: SensitiveWordAddRequest = {
+          title: values.title,
+          keywords: values.keywords,
+          content: values.content,
+          operation: values.operation,
+          status: values.status || "1",
+        };
+
+        const response = await addSensitiveWord(data);
+        if (response) {
+          message.success("添加敏感词成功");
+          form.resetFields();
+          onSuccess();
+          onCancel();
+        } else {
+          message.error(response?.message || "添加敏感词失败");
+        }
       } else {
-        message.error(response?.message || "更新敏感词失败");
+        const data: SensitiveWordUpdateRequest = {
+          id: sensitiveWordId,
+          title: values.title,
+          keywords: values.keywords,
+          content: values.content,
+          operation: values.operation,
+          status: values.status,
+        };
+
+        const response = await updateSensitiveWord(data);
+        if (response) {
+          message.success("更新敏感词成功");
+          form.resetFields();
+          onSuccess();
+          onCancel();
+        } else {
+          message.error(response?.message || "更新敏感词失败");
+        }
       }
     } catch (error) {
-      console.error("更新敏感词失败:", error);
-      message.error("更新敏感词失败");
+      console.error(`${mode === "add" ? "添加" : "更新"}敏感词失败:`, error);
+      message.error(`${mode === "add" ? "添加" : "更新"}敏感词失败`);
     } finally {
       setLoading(false);
     }
@@ -86,9 +114,11 @@ const EditSensitiveWordModal: React.FC<EditSensitiveWordModalProps> = ({
     onCancel();
   };
 
+  const title = mode === "add" ? "添加敏感词" : "编辑敏感词";
+
   return (
     <Modal
-      title="编辑敏感词"
+      title={title}
       open={visible}
       onCancel={handleCancel}
       footer={null}
@@ -164,4 +194,4 @@ const EditSensitiveWordModal: React.FC<EditSensitiveWordModalProps> = ({
   );
 };
 
-export default EditSensitiveWordModal;
+export default SensitiveWordModal;
diff --git a/Touchkebao/src/pages/pc/ckbox/powerCenter/content-management/components/modals/index.ts b/Touchkebao/src/pages/pc/ckbox/powerCenter/content-management/components/modals/index.ts
new file mode 100644
index 00000000..93227c33
--- /dev/null
+++ b/Touchkebao/src/pages/pc/ckbox/powerCenter/content-management/components/modals/index.ts
@@ -0,0 +1,5 @@
+// 模态框组件统一导出
+export { default as MaterialModal } from "./MaterialModal";
+export { default as SensitiveWordModal } from "./SensitiveWordModal";
+export { default as KeywordModal } from "./KeywordModal";
+export { default as ContentManager } from "./ContentManager";
diff --git a/Touchkebao/src/pages/pc/ckbox/powerCenter/content-management/index.tsx b/Touchkebao/src/pages/pc/ckbox/powerCenter/content-management/index.tsx
index 25aae8e2..edcb8d23 100644
--- a/Touchkebao/src/pages/pc/ckbox/powerCenter/content-management/index.tsx
+++ b/Touchkebao/src/pages/pc/ckbox/powerCenter/content-management/index.tsx
@@ -1,14 +1,16 @@
-import React, { useState } from "react";
+import React, { useState, useRef } from "react";
 import { Button } from "antd";
 import { PlusOutlined } from "@ant-design/icons";
 import PowerNavigation from "@/components/PowerNavtion";
 import styles from "./index.module.scss";
-import MaterialManagement from "./MaterialManagement";
-import SensitiveWordManagement from "./SensitiveWordManagement";
-import KeywordManagement from "./KeywordManagement";
-import AddMaterialModal from "./AddMaterialModal";
-import AddSensitiveWordModal from "./AddSensitiveWordModal";
-import AddKeywordModal from "./AddKeywordModal";
+import {
+  MaterialManagement,
+  SensitiveWordManagement,
+  KeywordManagement,
+  MaterialModal,
+  SensitiveWordModal,
+  KeywordModal,
+} from "./components";
 
 const ContentManagement: React.FC = () => {
   const [activeTab, setActiveTab] = useState<string>("material");
@@ -17,6 +19,9 @@ const ContentManagement: React.FC = () => {
     useState(false);
   const [keywordModalVisible, setKeywordModalVisible] = useState(false);
 
+  // 引用素材管理组件
+  const materialManagementRef = useRef<any>(null);
+
   const tabs = [
     { key: "material", label: "素材资源库" },
     { key: "sensitive", label: "敏感词管理" },
@@ -38,20 +43,22 @@ const ContentManagement: React.FC = () => {
 
   // 弹窗成功回调
   const handleModalSuccess = () => {
-    // 这里可以触发子组件重新获取数据
-    // 由于子组件是独立的，它们会在组件重新挂载时自动获取数据
+    // 刷新素材列表
+    if (materialManagementRef.current?.fetchMaterials) {
+      materialManagementRef.current.fetchMaterials();
+    }
   };
 
   const renderTabContent = () => {
     switch (activeTab) {
       case "material":
-        return <MaterialManagement />;
+        return <MaterialManagement ref={materialManagementRef} />;
       case "sensitive":
         return <SensitiveWordManagement />;
       case "keyword":
         return <KeywordManagement />;
       default:
-        return <MaterialManagement />;
+        return <MaterialManagement ref={materialManagementRef} />;
     }
   };
 
@@ -101,20 +108,23 @@ const ContentManagement: React.FC = () => {
       <div className={styles.content}>{renderTabContent()}</div>
 
       {/* 弹窗组件 */}
-      <AddMaterialModal
+      <MaterialModal
         visible={materialModalVisible}
+        mode="add"
         onCancel={() => setMaterialModalVisible(false)}
         onSuccess={handleModalSuccess}
       />
 
-      <AddSensitiveWordModal
+      <SensitiveWordModal
         visible={sensitiveWordModalVisible}
+        mode="add"
         onCancel={() => setSensitiveWordModalVisible(false)}
         onSuccess={handleModalSuccess}
       />
 
-      <AddKeywordModal
+      <KeywordModal
         visible={keywordModalVisible}
+        mode="add"
         onCancel={() => setKeywordModalVisible(false)}
         onSuccess={handleModalSuccess}
       />
diff --git a/Touchkebao/src/pages/pc/ckbox/powerCenter/content-management/modals/index.ts b/Touchkebao/src/pages/pc/ckbox/powerCenter/content-management/modals/index.ts
deleted file mode 100644
index 2d8f2c20..00000000
--- a/Touchkebao/src/pages/pc/ckbox/powerCenter/content-management/modals/index.ts
+++ /dev/null
@@ -1,3 +0,0 @@
-export { default as AddMaterialModal } from "../AddMaterialModal";
-export { default as AddSensitiveWordModal } from "../AddSensitiveWordModal";
-export { default as AddKeywordModal } from "../AddKeywordModal";