From 957ccf8b4785a8ac6243f8ee8ff8ce3174f974d6 Mon Sep 17 00:00:00 2001
From: Jafeng <2998840497@qq.com>
Date: Wed, 20 May 2026 16:32:00 +0800
Subject: [PATCH] =?UTF-8?q?feat:=E5=B8=B8=E7=94=A8=E8=AF=AD=E5=BA=93?=
 =?UTF-8?q?=E5=8D=87=E7=BA=A7=EF=BC=8C=E6=96=B0=E5=A2=9E=E6=9B=B4=E5=A4=9A?=
 =?UTF-8?q?=E5=B8=B8=E7=94=A8=E8=AF=AD=EF=BC=8C=E6=B7=BB=E5=8A=A0=E6=94=B6?=
 =?UTF-8?q?=E8=97=8F=E5=8A=9F=E8=83=BD?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 pages/message/common-phrases.vue | 1623 +++++++++++++++++-------------
 utils/api.js                     |   15 +-
 2 files changed, 937 insertions(+), 701 deletions(-)

diff --git a/pages/message/common-phrases.vue b/pages/message/common-phrases.vue
index 3b664d0..aca2274 100644
--- a/pages/message/common-phrases.vue
+++ b/pages/message/common-phrases.vue
@@ -1,11 +1,27 @@
 <template>
   <view class="common-phrases-page">
+    <view class="tabs-bar">
+      <view
+        class="tab-item"
+        :class="{ active: activeTab === 'mine' }"
+        @click="switchTab('mine')"
+      >
+        我的常用语
+      </view>
+      <view
+        class="tab-item"
+        :class="{ active: activeTab === 'more' }"
+        @click="switchTab('more')"
+      >
+        更多常用语
+      </view>
+    </view>
+
     <view class="content-wrapper">
-      <!-- 左侧分类列表 -->
       <view class="category-sidebar">
         <scroll-view class="category-list" scroll-y>
           <view
-            v-for="category in allCategories"
+            v-for="category in currentCategories"
             :key="category.id"
             class="category-item"
             :class="{ active: currentCategory === category.id }"
@@ -15,7 +31,7 @@
             <view class="category-content">
               <text class="category-name">{{ category.name }}</text>
               <view
-                v-if="isEditMode && category.deletable"
+                v-if="activeTab === 'mine' && isEditMode && category.deletable"
                 class="delete-badge"
                 @click.stop="deleteCategory(category)"
               >
@@ -24,44 +40,90 @@
             </view>
           </view>
         </scroll-view>
-        
-        <!-- 新增分类按钮（固定在底部） -->
-        <view class="add-category-footer" @click="showAddCategoryDialog">
+
+        <view
+          v-if="activeTab === 'mine'"
+          class="add-category-footer"
+          @click="showAddCategoryDialog"
+        >
           <text class="add-category-text">新增分类</text>
         </view>
       </view>
 
-      <!-- 右侧常用语列表 -->
       <view class="phrases-container">
+        <view class="list-header">
+          <view class="current-title">
+            {{ currentCategoryName }}（{{ currentPhrases.length }}）
+          </view>
+          <view class="search-box">
+            <text class="search-icon">⌕</text>
+            <input
+              v-model="searchKeyword"
+              class="search-input"
+              placeholder="搜索常用语"
+              confirm-type="search"
+            />
+            <text v-if="searchKeyword" class="clear-search" @click="searchKeyword = ''">×</text>
+          </view>
+        </view>
+
         <scroll-view class="phrases-list" scroll-y>
           <view
             v-for="phrase in currentPhrases"
             :key="phrase.id"
             class="phrase-item"
-            @click="handlePhraseClick(phrase)"
           >
-            <view class="phrase-content">{{ phrase.content }}</view>
-            <view v-if="isEditMode" class="phrase-actions">
-              <view class="action-btn edit" @click.stop="editPhrase(phrase)">
-                <text>编辑</text>
-              </view>
+            <view class="phrase-top">
+              <view class="phrase-content">{{ phrase.content }}</view>
               <view
-                class="action-btn delete"
-                @click.stop="deletePhrase(phrase)"
+                v-if="activeTab === 'mine' && phrase.sourceCommonWordId"
+                class="collected-badge"
               >
-                <text>删除</text>
+                已收藏
+              </view>
+            </view>
+            <view class="phrase-actions">
+              <view class="action-btn send" @click.stop="sendPhrase(phrase)">
+                <text class="action-icon">✈</text>
+                <text>发送</text>
+              </view>
+
+              <template v-if="activeTab === 'mine'">
+                <view class="action-btn edit" @click.stop="editPhrase(phrase)">
+                  <text class="action-icon">✎</text>
+                  <text>编辑</text>
+                </view>
+                <view class="action-btn delete" @click.stop="deletePhrase(phrase)">
+                  <text class="action-icon">⌫</text>
+                  <text>删除</text>
+                </view>
+              </template>
+
+              <view
+                v-else
+                class="action-btn collect"
+                :class="{ collected: isFavorite(phrase) }"
+                @click.stop="toggleFavorite(phrase)"
+              >
+                <text class="action-icon">{{ isFavorite(phrase) ? "★" : "☆" }}</text>
+                <text>{{ isFavorite(phrase) ? "已收藏" : "收藏" }}</text>
               </view>
             </view>
           </view>
 
           <view v-if="currentPhrases.length === 0" class="empty-state">
             <text class="empty-text">暂无常用语</text>
-            <text class="empty-hint">点击下方按钮添加常用语</text>
+            <text class="empty-hint">
+              {{ activeTab === "mine" ? "可添加快捷回复或收藏更多常用语" : "可在后台常用语库维护后使用" }}
+            </text>
+          </view>
+
+          <view v-if="activeTab === 'more' && currentPhrases.length > 0" class="collect-tip">
+            收藏时请选择保存到“我的常用语”的真实目录
           </view>
         </scroll-view>
-        
-        <!-- 底部操作栏（页脚） -->
-        <view class="footer-action-bar">
+
+        <view v-if="activeTab === 'mine'" class="footer-action-bar">
           <view class="add-phrase-btn" @click="showAddPhraseDialog">
             <text class="add-icon">+</text>
             <text class="add-text">添加快捷回复</text>
@@ -73,35 +135,79 @@
       </view>
     </view>
 
-    <!-- 添加/编辑常用语弹窗 -->
     <view v-if="showPhrasePopup" class="popup-mask" @click="closePopup">
-      <view class="popup-content" @click.stop>
+      <view class="popup-content phrase-popup" @click.stop>
         <view class="popup-header">
-          <text class="popup-title">{{
-            editingPhrase ? "编辑快捷回复" : "添加快捷回复"
-          }}</text>
+          <text class="popup-title">{{ editingPhrase ? "编辑常用语" : "添加常用语" }}</text>
           <view class="popup-close" @click="closePopup">
             <text class="close-icon">×</text>
           </view>
         </view>
+
+        <view class="form-label">所在目录</view>
+        <picker
+          mode="selector"
+          :range="myCategories"
+          range-key="name"
+          :value="phraseCategoryIndex"
+          @change="handlePhraseCategoryChange"
+        >
+          <view class="category-picker">
+            <text>{{ selectedPhraseCategoryName }}</text>
+            <text class="picker-arrow">⌄</text>
+          </view>
+        </picker>
+        <view class="form-hint">可选择保存到指定目录</view>
+
+        <view class="form-label content-label">常用语内容</view>
         <textarea
           v-model="phraseForm.content"
           class="phrase-textarea"
-          placeholder="在此处输入文字"
+          placeholder="请输入常用语内容，支持换行"
           maxlength="500"
-          :auto-height="true"
+          :auto-height="false"
         ></textarea>
         <view class="char-count">{{ phraseForm.content.length }}/500</view>
         <view class="popup-actions">
           <button class="cancel-btn" @click="closePopup">取消</button>
-          <button class="confirm-btn" @click="savePhrase">
-            {{ editingPhrase ? "保存" : "确认添加" }}
-          </button>
+          <button class="confirm-btn" @click="savePhrase">保存</button>
+        </view>
+      </view>
+    </view>
+
+    <view v-if="showCollectPopup" class="popup-mask" @click="closeCollectPopup">
+      <view class="popup-content collect-popup" @click.stop>
+        <view class="popup-header">
+          <text class="popup-title">收藏常用语</text>
+          <view class="popup-close" @click="closeCollectPopup">
+            <text class="close-icon">×</text>
+          </view>
+        </view>
+
+        <view class="form-label">保存目录</view>
+        <picker
+          mode="selector"
+          :range="myCategories"
+          range-key="name"
+          :value="collectCategoryIndex"
+          @change="handleCollectCategoryChange"
+        >
+          <view class="category-picker">
+            <text>{{ selectedCollectCategoryName }}</text>
+            <text class="picker-arrow">⌄</text>
+          </view>
+        </picker>
+        <view class="form-hint">收藏后将添加到所选目录</view>
+
+        <view class="collect-preview">{{ collectingPhrase?.content || "" }}</view>
+
+        <view class="popup-actions">
+          <button class="cancel-btn" @click="closeCollectPopup">取消</button>
+          <button class="confirm-btn" @click="confirmFavorite">收藏</button>
         </view>
       </view>
     </view>
 
-    <!-- 添加分类弹窗 -->
     <view
       v-if="showCategoryPopup"
       class="popup-mask"
@@ -109,9 +215,7 @@
     >
       <view class="popup-content category-popup" @click.stop>
         <view class="popup-header">
-          <text class="popup-title">{{
-            editingCategory ? "编辑分类" : "新建分类"
-          }}</text>
+          <text class="popup-title">{{ editingCategory ? "编辑分类" : "新建分类" }}</text>
           <view class="popup-close" @click="closeCategoryPopup">
             <text class="close-icon">×</text>
           </view>
@@ -119,13 +223,11 @@
         <input
           v-model="categoryForm.name"
           class="category-input"
-          placeholder="请输入分类名，最多6个字"
+          placeholder="请输入分类名，最多10个字"
         />
         <view class="popup-actions">
           <button class="cancel-btn" @click="closeCategoryPopup">取消</button>
-          <button class="confirm-btn" @click="saveCategory">
-            {{ editingCategory ? "保存" : "确认添加" }}
-          </button>
+          <button class="confirm-btn" @click="saveCategory">保存</button>
         </view>
       </view>
     </view>
@@ -138,131 +240,160 @@ import { storeToRefs } from "pinia";
 import api from "@/utils/api";
 import useAccountStore from "@/store/account";
 
-// 获取 store
 const { doctorInfo } = storeToRefs(useAccountStore());
 
-// 获取系统状态栏高度
-const statusBarHeight = ref(0);
-
-// 编辑模式
+const activeTab = ref("mine");
 const isEditMode = ref(false);
+const searchKeyword = ref("");
+const currentCategory = ref("");
 
-// 默认分类（虚拟分类，不存在于数据库）
-const DEFAULT_CATEGORY = {
-  id: "__default__",
-  name: "默认",
-  sort: -1,
-  deletable: false,
-  type: "personal",
-};
-
-// 分类数据（初始为空，从后台加载）
-const categories = ref([]);
-
-// 机构分类数据
+const myCategories = ref([]);
+const myPhrases = ref([]);
 const corpCategories = ref([]);
-
-// 所有分类（包含默认分类 + 个人分类 + 机构分类）
-const allCategories = computed(() => {
-  // 个人分类
-  const personalCats = [DEFAULT_CATEGORY, ...categories.value];
-  
-  // 机构分类（标记为只读）
-  const corpCats = corpCategories.value.map(cat => ({
-    ...cat,
-    type: "corp",
-    deletable: false,
-    isCorpCategory: true, // 标记为机构分类
-  }));
-  
-  return [...personalCats, ...corpCats];
-});
-
-const currentCategory = ref(DEFAULT_CATEGORY.id);
-
-// 常用语数据
-const phrases = ref([]);
-
-// 机构常用语数据
 const corpPhrases = ref([]);
 
-// 当前分类的常用语
-const currentPhrases = computed(() => {
-  // 获取当前分类信息
-  const currentCat = allCategories.value.find(c => c.id === currentCategory.value);
-  
-  if (currentCategory.value === DEFAULT_CATEGORY.id) {
-    // 默认分类显示没有 categoryId 或 categoryId 为空的个人常用语
-    return phrases.value.filter((p) => !p.categoryId);
-  }
-  
-  // 如果是机构分类，返回机构常用语
-  if (currentCat?.isCorpCategory) {
-    return corpPhrases.value.filter((p) => p.categoryId === currentCategory.value);
-  }
-  
-  // 个人分类，返回个人常用语
-  const filtered = phrases.value.filter((p) => p.categoryId === currentCategory.value);
-  console.log("当前分类:", currentCategory.value);
-  return filtered;
-});
-
-// 弹窗显示状态
 const showPhrasePopup = ref(false);
 const showCategoryPopup = ref(false);
+const showCollectPopup = ref(false);
+const editingPhrase = ref(null);
+const editingCategory = ref(null);
+const collectingPhrase = ref(null);
 
-// 表单数据
 const phraseForm = ref({
   content: "",
+  cateId: "",
+});
+
+const collectForm = ref({
+  cateId: "",
 });
 
 const categoryForm = ref({
   name: "",
 });
 
-const editingPhrase = ref(null);
-const editingCategory = ref(null);
+const currentCategories = computed(() => {
+  return activeTab.value === "more" ? corpCategories.value : myCategories.value;
+});
 
-// 返回上一页
-const goBack = () => {
-  uni.navigateBack();
+const currentCategoryName = computed(() => {
+  const category = currentCategories.value.find((item) => item.id === currentCategory.value);
+  return category ? category.name : "未选择";
+});
+
+const firstMyCategory = computed(() => {
+  return myCategories.value[0];
+});
+
+const favoriteMap = computed(() => {
+  return myPhrases.value.reduce((map, item) => {
+    if (item.sourceCommonWordId) map[item.sourceCommonWordId] = item;
+    return map;
+  }, {});
+});
+
+const getCategoryScopeIds = (categories, categoryId) => {
+  const ids = [categoryId].filter(Boolean);
+  let changed = true;
+  while (changed) {
+    changed = false;
+    categories.forEach((item) => {
+      if (item.parentId && ids.includes(item.parentId) && !ids.includes(item.id)) {
+        ids.push(item.id);
+        changed = true;
+      }
+    });
+  }
+  return ids;
+};
+
+const currentPhrases = computed(() => {
+  const keyword = searchKeyword.value.trim();
+  const source = activeTab.value === "more" ? corpPhrases.value : myPhrases.value;
+  const scopeIds = getCategoryScopeIds(currentCategories.value, currentCategory.value);
+  let list = source.filter((item) => scopeIds.includes(item.cateId));
+
+  if (keyword) {
+    list = list.filter((item) => String(item.content || "").includes(keyword));
+  }
+
+  return list;
+});
+
+const phraseCategoryIndex = computed(() => {
+  const index = myCategories.value.findIndex((item) => item.id === phraseForm.value.cateId);
+  return index > -1 ? index : 0;
+});
+
+const selectedPhraseCategoryName = computed(() => {
+  return myCategories.value[phraseCategoryIndex.value]?.name || "请选择目录";
+});
+
+const collectCategoryIndex = computed(() => {
+  const index = myCategories.value.findIndex((item) => item.id === collectForm.value.cateId);
+  return index > -1 ? index : 0;
+});
+
+const selectedCollectCategoryName = computed(() => {
+  return myCategories.value[collectCategoryIndex.value]?.name || "请选择目录";
+});
+
+const normalizeCategory = (item, categoryType) => ({
+  id: item._id || item.id,
+  name: item.label || item.name || "未命名",
+  sort: item.sort || 0,
+  level: item.level || 1,
+  parentId: item.parentId || "",
+  type: categoryType,
+  deletable: categoryType === "user",
+});
+
+const normalizePhrase = (item, phraseType) => ({
+  id: item._id || item.id,
+  cateId: item.cateId || item.categoryId,
+  content: item.content || "",
+  createTime: item.createTime,
+  updateTime: item.updateTime,
+  sourceType: item.sourceType,
+  sourceCommonWordId: item.sourceCommonWordId,
+  sourceCateId: item.sourceCateId,
+  collectTime: item.collectTime,
+  collectClient: item.collectClient,
+  type: phraseType,
+});
+
+const getAccountParams = () => {
+  const corpId = doctorInfo.value?.corpId;
+  const userId = doctorInfo.value?.userid;
+  return { corpId, userId };
+};
+
+const isFavorite = (phrase) => Boolean(favoriteMap.value[phrase.id]);
+
+const switchTab = (tab) => {
+  if (activeTab.value === tab) return;
+  activeTab.value = tab;
+  isEditMode.value = false;
+  searchKeyword.value = "";
+  currentCategory.value =
+    tab === "mine"
+      ? firstMyCategory.value?.id || ""
+      : corpCategories.value[0]?.id || "";
 };
 
-// 切换编辑模式
 const toggleEditMode = () => {
   isEditMode.value = !isEditMode.value;
 };
 
-// 切换分类
-const switchCategory = (categoryId) => {
-  currentCategory.value = categoryId;
-};
-
-// 处理分类点击（编辑模式下编辑分类名称）
 const handleCategoryClick = (category) => {
-  if (isEditMode.value && category.deletable) {
-    // 编辑模式下，点击可编辑的分类，弹出编辑框
+  if (activeTab.value === "mine" && isEditMode.value && category.deletable) {
     editCategory(category);
-  } else {
-    // 非编辑模式，切换分类
-    switchCategory(category.id);
-  }
-};
-
-// 编辑分类
-const editCategory = (category) => {
-  editingCategory.value = category;
-  categoryForm.value.name = category.name;
-  showCategoryPopup.value = true;
-};
-
-// 处理常用语点击
-const handlePhraseClick = (phrase) => {
-  if (isEditMode.value) {
     return;
   }
+  currentCategory.value = category.id;
+};
 
-  // 返回到聊天页面并发送消息
+const sendPhrase = (phrase) => {
   const pages = getCurrentPages();
   const prevPage = pages[pages.length - 2];
 
@@ -273,790 +404,894 @@ const handlePhraseClick = (phrase) => {
   uni.navigateBack();
 };
 
-// 显示添加常用语弹窗
 const showAddPhraseDialog = () => {
   editingPhrase.value = null;
-  phraseForm.value.content = "";
+  phraseForm.value = {
+    content: "",
+    cateId: currentCategory.value || firstMyCategory.value?.id || "",
+  };
   showPhrasePopup.value = true;
 };
 
-// 编辑常用语
 const editPhrase = (phrase) => {
   editingPhrase.value = phrase;
-  phraseForm.value.content = phrase.content;
+  phraseForm.value = {
+    content: phrase.content,
+    cateId: phrase.cateId || firstMyCategory.value?.id || "",
+  };
   showPhrasePopup.value = true;
 };
 
-// 保存常用语
+const handlePhraseCategoryChange = (event) => {
+  const index = Number(event.detail.value || 0);
+  phraseForm.value.cateId = myCategories.value[index]?.id || "";
+};
+
 const savePhrase = async () => {
+  if (!phraseForm.value.cateId) {
+    uni.showToast({ title: "请选择目录", icon: "none" });
+    return;
+  }
   if (!phraseForm.value.content.trim()) {
-    uni.showToast({
-      title: "请输入内容",
-      icon: "none",
-    });
+    uni.showToast({ title: "请输入内容", icon: "none" });
+    return;
+  }
+
+  const { corpId, userId } = getAccountParams();
+  if (!corpId || !userId) {
+    uni.showToast({ title: "请先登录", icon: "none" });
     return;
   }
 
   try {
-    if (!doctorInfo.value) {
-      uni.showToast({
-        title: "请先登录",
-        icon: "none",
-      });
-      return;
-    }
-
-    const corpId = doctorInfo.value.corpId;
-    const userId = doctorInfo.value.userid;
-
-    // 如果是默认分类，categoryId 设置为 null
-    let categoryId = editingPhrase.value?.categoryId || currentCategory.value;
-    if (categoryId === DEFAULT_CATEGORY.id) {
-      categoryId = null;
-    }
-
-    const result = await api("savePersonalPhrase", {
+    const result = await api("setCommonWords", {
       id: editingPhrase.value?.id,
-      categoryId: categoryId,
+      cateId: phraseForm.value.cateId,
       content: phraseForm.value.content,
       corpId,
       userId,
     });
 
-    console.log("保存常用语返回结果:", result);
-
     if (result.success) {
+      const nextPhrase = normalizePhrase({
+        ...editingPhrase.value,
+        ...(result.data || {}),
+        _id: editingPhrase.value?.id || result.data?._id,
+        cateId: phraseForm.value.cateId,
+        content: phraseForm.value.content.trim(),
+      }, "user");
+
       if (editingPhrase.value) {
-        // 更新
-        const index = phrases.value.findIndex(
-          (p) => p.id === editingPhrase.value.id
-        );
-        if (index !== -1) {
-          phrases.value[index].content = phraseForm.value.content;
-          // 如果是默认分类，categoryId 设置为 null
-          const newCategoryId = editingPhrase.value.categoryId || currentCategory.value;
-          phrases.value[index].categoryId = newCategoryId === DEFAULT_CATEGORY.id ? null : newCategoryId;
-        }
+        const index = myPhrases.value.findIndex((item) => item.id === editingPhrase.value.id);
+        if (index > -1) myPhrases.value.splice(index, 1, nextPhrase);
+      } else if (nextPhrase.id) {
+        myPhrases.value.unshift(nextPhrase);
       } else {
-        // 新增
-        console.log("新增常用语，返回数据:", result.data);
-        console.log("当前分类ID:", currentCategory.value);
-        if (result.data) {
-          phrases.value.push(result.data);
-          console.log("添加后的 phrases:", phrases.value);
-        }
+        await loadMyPhrases();
       }
 
-      uni.showToast({
-        title: editingPhrase.value ? "保存成功" : "添加成功",
-        icon: "success",
-      });
-
+      uni.showToast({ title: "保存成功", icon: "success" });
       closePopup();
     } else {
-      uni.showToast({
-        title: result.message || "操作失败",
-        icon: "none",
-      });
+      uni.showToast({ title: result.message || "操作失败", icon: "none" });
     }
   } catch (error) {
     console.error("保存常用语失败:", error);
-    uni.showToast({
-      title: "操作失败",
-      icon: "none",
-    });
+    uni.showToast({ title: "操作失败", icon: "none" });
   }
 };
 
-// 删除常用语
+const removeMyPhrase = async (phrase) => {
+  const { corpId, userId } = getAccountParams();
+  const result = await api("removeCommonWords", {
+    id: phrase.id,
+    corpId,
+    userId,
+  });
+
+  if (result.success) {
+    const index = myPhrases.value.findIndex((item) => item.id === phrase.id);
+    if (index > -1) myPhrases.value.splice(index, 1);
+  }
+  return result;
+};
+
 const deletePhrase = (phrase) => {
   uni.showModal({
     title: "提示",
     content: "确定删除该常用语吗？",
     success: async (res) => {
-      if (res.confirm) {
-        try {
-          const corpId = doctorInfo.value.corpId;
-          const userId = doctorInfo.value.userid;
-
-          const result = await api("deletePersonalPhrase", {
-            id: phrase.id,
-            corpId,
-            userId,
-          });
-
-          if (result.success) {
-            const index = phrases.value.findIndex((p) => p.id === phrase.id);
-            if (index !== -1) {
-              phrases.value.splice(index, 1);
-            }
-
-            uni.showToast({
-              title: "删除成功",
-              icon: "success",
-            });
-          } else {
-            uni.showToast({
-              title: result.message || "删除失败",
-              icon: "none",
-            });
-          }
-        } catch (error) {
-          console.error("删除常用语失败:", error);
-          uni.showToast({
-            title: "删除失败",
-            icon: "none",
-          });
+      if (!res.confirm) return;
+      try {
+        const result = await removeMyPhrase(phrase);
+        if (result.success) {
+          uni.showToast({ title: "删除成功", icon: "success" });
+        } else {
+          uni.showToast({ title: result.message || "删除失败", icon: "none" });
         }
+      } catch (error) {
+        console.error("删除常用语失败:", error);
+        uni.showToast({ title: "删除失败", icon: "none" });
       }
     },
   });
 };
 
-// 显示添加分类弹窗
+const toggleFavorite = async (phrase) => {
+  const { corpId, userId } = getAccountParams();
+  if (!corpId || !userId) {
+    uni.showToast({ title: "请先登录", icon: "none" });
+    return;
+  }
+
+  try {
+    const favorite = favoriteMap.value[phrase.id];
+    if (favorite) {
+      const result = await removeMyPhrase(favorite);
+      if (result.success) {
+        uni.showToast({ title: "已取消收藏", icon: "success" });
+      } else {
+        uni.showToast({ title: result.message || "取消收藏失败", icon: "none" });
+      }
+      return;
+    }
+
+    if (myCategories.value.length === 0) {
+      uni.showToast({ title: "请先新增目录", icon: "none" });
+      return;
+    }
+
+    collectingPhrase.value = phrase;
+    collectForm.value.cateId = firstMyCategory.value?.id || "";
+    showCollectPopup.value = true;
+  } catch (error) {
+    console.error("收藏操作失败:", error);
+    uni.showToast({ title: "操作失败", icon: "none" });
+  }
+};
+
+const handleCollectCategoryChange = (event) => {
+  const index = Number(event.detail.value || 0);
+  collectForm.value.cateId = myCategories.value[index]?.id || "";
+};
+
+const confirmFavorite = async () => {
+  const phrase = collectingPhrase.value;
+  if (!phrase) {
+    closeCollectPopup();
+    return;
+  }
+
+  if (!collectForm.value.cateId) {
+    uni.showToast({ title: "请选择目录", icon: "none" });
+    return;
+  }
+
+  const { corpId, userId } = getAccountParams();
+  if (!corpId || !userId) {
+    uni.showToast({ title: "请先登录", icon: "none" });
+    return;
+  }
+
+  try {
+    const result = await api("setCommonWords", {
+      cateId: collectForm.value.cateId,
+      content: phrase.content,
+      corpId,
+      userId,
+      sourceType: "common-words",
+      sourceCommonWordId: phrase.id,
+      sourceCateId: phrase.cateId,
+      collectClient: "wxapp",
+    });
+
+    if (result.success && result.data) {
+      myPhrases.value.unshift(normalizePhrase(result.data, "user"));
+      uni.showToast({ title: "收藏成功", icon: "success" });
+      closeCollectPopup();
+    } else if (result.success) {
+      await loadMyPhrases();
+      uni.showToast({ title: "收藏成功", icon: "success" });
+      closeCollectPopup();
+    } else {
+      uni.showToast({ title: result.message || "收藏失败", icon: "none" });
+    }
+  } catch (error) {
+    console.error("收藏操作失败:", error);
+    uni.showToast({ title: "操作失败", icon: "none" });
+  }
+};
+
 const showAddCategoryDialog = () => {
   editingCategory.value = null;
   categoryForm.value.name = "";
   showCategoryPopup.value = true;
 };
 
-// 保存分类
+const editCategory = (category) => {
+  editingCategory.value = category;
+  categoryForm.value.name = category.name;
+  showCategoryPopup.value = true;
+};
+
 const saveCategory = async () => {
   if (!categoryForm.value.name.trim()) {
-    uni.showToast({
-      title: "请输入分类名",
-      icon: "none",
-    });
+    uni.showToast({ title: "请输入分类名", icon: "none" });
     return;
   }
 
-  if (categoryForm.value.name.length > 6) {
-    uni.showToast({
-      title: "输入内容超过6个字",
-      icon: "none",
-    });
+  if (categoryForm.value.name.length > 10) {
+    uni.showToast({ title: "输入内容超过10个字", icon: "none" });
     return;
   }
 
   try {
-    const corpId = doctorInfo.value.corpId;
-    const userId = doctorInfo.value.userid;
-
-    const result = await api("savePersonalPhraseCategory", {
-      id: editingCategory.value?.id, // 如果是编辑，传入 id
-      name: categoryForm.value.name,
+    const { corpId, userId } = getAccountParams();
+    const result = await api(editingCategory.value ? "updateUserCommonWordCate" : "addUserCommonWordCate", {
+      id: editingCategory.value?.id,
+      label: categoryForm.value.name,
       corpId,
       userId,
     });
 
-    if (result.success && result.data) {
-      if (editingCategory.value) {
-        // 更新分类
-        const index = categories.value.findIndex(
-          (c) => c.id === editingCategory.value.id
-        );
-        if (index !== -1) {
-          categories.value[index].name = result.data.name;
-        }
-        uni.showToast({
-          title: "修改成功",
-          icon: "success",
-        });
-      } else {
-        // 新增分类
-        categories.value.push({
-          id: result.data.id,
-          name: result.data.name,
-          sort: result.data.sort,
-          deletable: result.data.deletable,
-        });
-        uni.showToast({
-          title: "添加成功",
-          icon: "success",
-        });
-      }
-
+    if (result.success) {
+      await loadMyCategories();
+      uni.showToast({ title: "保存成功", icon: "success" });
       closeCategoryPopup();
     } else {
-      uni.showToast({
-        title: result.message || "操作失败",
-        icon: "none",
-      });
+      uni.showToast({ title: result.message || "操作失败", icon: "none" });
     }
   } catch (error) {
     console.error("保存分类失败:", error);
-    uni.showToast({
-      title: "操作失败",
-      icon: "none",
-    });
+    uni.showToast({ title: "操作失败", icon: "none" });
   }
 };
 
-// 长按分类
 const handleCategoryLongPress = (category) => {
-  if (!category.deletable) return;
+  if (activeTab.value !== "mine" || !category.deletable) return;
 
   uni.showModal({
     title: "提示",
-    content: `确定删除分类"${category.name}"吗？该分类下的所有常用语也将被删除。`,
+    content: `确定删除分类"${category.name}"吗？该分类下的常用语也将被删除。`,
     success: (res) => {
-      if (res.confirm) {
-        deleteCategory(category);
-      }
+      if (res.confirm) deleteCategory(category);
     },
   });
 };
 
-// 删除分类
 const deleteCategory = async (category) => {
   if (!category.deletable) {
-    uni.showToast({
-      title: "该分类不可删除",
-      icon: "none",
-    });
+    uni.showToast({ title: "该分类不可删除", icon: "none" });
     return;
   }
 
   try {
-    const corpId = doctorInfo.value.corpId;
-    const userId = doctorInfo.value.userid;
-
-    const result = await api("deletePersonalPhraseCategory", {
+    const { corpId, userId } = getAccountParams();
+    const result = await api("deleteUserCommonWordCate", {
       id: category.id,
       corpId,
       userId,
     });
 
     if (result.success) {
-      // 删除分类
-      const index = categories.value.findIndex((c) => c.id === category.id);
-      if (index !== -1) {
-        categories.value.splice(index, 1);
-      }
-
-      // 如果删除的是当前分类，切换到默认分类
-      if (currentCategory.value === category.id) {
-        currentCategory.value = DEFAULT_CATEGORY.id;
-      }
-
-      uni.showToast({
-        title: "删除成功",
-        icon: "success",
-      });
+      await loadMyCategories();
+      await loadMyPhrases();
+      currentCategory.value = firstMyCategory.value?.id || "";
+      uni.showToast({ title: "删除成功", icon: "success" });
     } else {
-      uni.showToast({
-        title: result.message || "删除失败",
-        icon: "none",
-      });
+      uni.showToast({ title: result.message || "删除失败", icon: "none" });
     }
   } catch (error) {
     console.error("删除分类失败:", error);
-    uni.showToast({
-      title: "删除失败",
-      icon: "none",
-    });
+    uni.showToast({ title: "删除失败", icon: "none" });
   }
 };
 
-// 关闭弹窗
 const closePopup = () => {
   showPhrasePopup.value = false;
+  editingPhrase.value = null;
+};
+
+const closeCollectPopup = () => {
+  showCollectPopup.value = false;
+  collectingPhrase.value = null;
+  collectForm.value.cateId = "";
 };
 
 const closeCategoryPopup = () => {
   showCategoryPopup.value = false;
+  editingCategory.value = null;
 };
 
-// 加载常用语数据
-const loadPhrases = async () => {
-  try {
-    const corpId = doctorInfo.value.corpId;
-    const userId = doctorInfo.value.userid;
-
-    const result = await api("getPersonalPhrases", {
-      corpId,
-      userId,
-    });
-
-    if (result.success && result.data) {
-      // 更新常用语列表
-      if (Array.isArray(result.data.phrases)) {
-        phrases.value = result.data.phrases;
-      }
-      // 更新分类列表
-      if (Array.isArray(result.data.categories)) {
-        categories.value = result.data.categories;
-
-        // 如果当前分类不存在，保持默认分类
-        if (currentCategory.value && currentCategory.value !== DEFAULT_CATEGORY.id) {
-          const categoryExists = categories.value.find((c) => c.id === currentCategory.value);
-          if (!categoryExists) {
-            currentCategory.value = DEFAULT_CATEGORY.id;
-          }
-        }
-      }
-    } else {
-      uni.showToast({
-        title: result.message || "加载失败",
-        icon: "none",
-      });
+const loadMyCategories = async () => {
+  const { corpId, userId } = getAccountParams();
+  const result = await api("getUserCommonWordCate", { corpId, userId });
+  if (result.success) {
+    const list = Array.isArray(result.list) ? result.list : [];
+    myCategories.value = list.map((item) => normalizeCategory(item, "user")).filter((item) => item.id);
+    if (activeTab.value === "mine") {
+      currentCategory.value = currentCategory.value || firstMyCategory.value?.id || "";
     }
+  } else {
+    uni.showToast({ title: result.message || "加载失败", icon: "none" });
+  }
+};
+
+const loadMyPhrases = async () => {
+  const { corpId, userId } = getAccountParams();
+  const cateIds = myCategories.value.map((item) => item.id).filter(Boolean);
+  if (cateIds.length === 0) {
+    myPhrases.value = [];
+    return;
+  }
+
+  const result = await api("getCommonWordsList", {
+    corpId,
+    userId,
+    cateIds,
+    page: 1,
+    pageSize: 10000,
+  }, false);
+
+  if (result.success) {
+    const list = Array.isArray(result.list) ? result.list : [];
+    myPhrases.value = list.map((item) => normalizePhrase(item, "user")).filter((item) => item.id);
+  }
+};
+
+const loadCorpCategories = async () => {
+  const { corpId, userId } = getAccountParams();
+  const result = await api("getCorpCommonWordCate", { corpId, userId }, false);
+  if (result.success) {
+    const list = Array.isArray(result.list) ? result.list : [];
+    corpCategories.value = list.map((item) => normalizeCategory(item, "corp")).filter((item) => item.id);
+    if (activeTab.value === "more" && !currentCategory.value) {
+      currentCategory.value = corpCategories.value[0]?.id || "";
+    }
+  }
+};
+
+const loadCorpPhrases = async () => {
+  const { corpId, userId } = getAccountParams();
+  const cateIds = corpCategories.value.map((item) => item.id).filter(Boolean);
+  if (cateIds.length === 0) {
+    corpPhrases.value = [];
+    return;
+  }
+
+  const result = await api("getCommonWordsList", {
+    corpId,
+    userId,
+    cateIds,
+    page: 1,
+    pageSize: 10000,
+  }, false);
+
+  if (result.success) {
+    const list = Array.isArray(result.list) ? result.list : [];
+    corpPhrases.value = list.map((item) => normalizePhrase(item, "corp")).filter((item) => item.id);
+  }
+};
+
+const loadAll = async () => {
+  const { corpId, userId } = getAccountParams();
+  if (!corpId || !userId) {
+    uni.showToast({ title: "请先登录", icon: "none" });
+    return;
+  }
+
+  try {
+    await loadMyCategories();
+    await loadMyPhrases();
+    await loadCorpCategories();
+    await loadCorpPhrases();
   } catch (error) {
     console.error("加载常用语失败:", error);
-    uni.showToast({
-      title: "加载失败",
-      icon: "none",
-    });
+    uni.showToast({ title: "加载失败", icon: "none" });
   }
 };
 
 onMounted(() => {
-  // 获取系统信息
-  const systemInfo = uni.getSystemInfoSync();
-  statusBarHeight.value = systemInfo.statusBarHeight || 0;
-
-  loadPhrases();
+  loadAll();
 });
 </script>
 
 <style scoped lang="scss">
-// 使用项目主题色
-$primary-color: #0877F1;
-$primary-light: #e8f3ff;
-$primary-gradient-start: #1b5cc8;
-$primary-gradient-end: #0877f1;
+$primary-color: #1f5cff;
+$primary-light: #eef4ff;
+$text-main: #222;
+$border-color: #edf0f5;
 
 .common-phrases-page {
-  display: flex;
-  flex-direction: column;
-  background-color: #f5f5f5;
   position: absolute;
   left: 0;
   right: 0;
   top: 0;
   bottom: 20rpx;
-}
-
-// 自定义导航栏
-.custom-navbar {
-  position: fixed;
-  top: 0;
-  left: 0;
-  right: 0;
-  background: linear-gradient(
-    135deg,
-    $primary-gradient-end 0%,
-    $primary-gradient-start 100%
-  );
-  z-index: 1000;
-  box-shadow: 0 2rpx 12rpx rgba(8, 119, 241, 0.15);
-}
-
-.navbar-content {
-  height: 88rpx;
   display: flex;
-  align-items: center;
-  justify-content: space-between;
-  padding: 0 32rpx;
-  position: relative;
+  flex-direction: column;
+  background: #f7f8fb;
 }
 
-.navbar-left {
-  width: 80rpx;
-  height: 88rpx;
+.tabs-bar {
   display: flex;
-  align-items: center;
-  justify-content: flex-start;
+  height: 96rpx;
+  background: #fff;
+  border-bottom: 1px solid $border-color;
 
-  .back-icon {
-    font-size: 56rpx;
-    color: #fff;
-    font-weight: 300;
-    line-height: 1;
-  }
-}
-
-.navbar-center {
-  position: absolute;
-  left: 50%;
-  transform: translateX(-50%);
-  display: flex;
-  align-items: center;
-  justify-content: center;
-
-  .navbar-title {
-    font-size: 36rpx;
-    font-weight: 600;
-    color: #fff;
-  }
-}
-
-.navbar-right {
-  width: 80rpx;
-  height: 88rpx;
-  display: flex;
-  align-items: center;
-  justify-content: flex-end;
-
-  .more-btn {
-    display: flex;
-    align-items: center;
-    gap: 6rpx;
-    padding: 12rpx 16rpx;
-    background-color: rgba(255, 255, 255, 0.2);
-    border-radius: 40rpx;
-
-    .dot {
-      font-size: 24rpx;
-      color: #fff;
-      line-height: 1;
-    }
-  }
-}
-
-// 底部操作栏（页脚）
-.footer-action-bar {
-  display: flex;
-  align-items: center;
-  justify-content: space-between;
-  gap: 16rpx;
-  padding: 24rpx;
-  background-color: #fff;
-  border-top: 1px solid #f0f0f0;
-  box-shadow: 0 -2rpx 12rpx rgba(0, 0, 0, 0.04);
-
-  .add-phrase-btn {
+  .tab-item {
     flex: 1;
+    position: relative;
     display: flex;
     align-items: center;
     justify-content: center;
-    padding: 20rpx 24rpx;
-    background: linear-gradient(
-      135deg,
-      $primary-gradient-end 0%,
-      $primary-gradient-start 100%
-    );
-    border-radius: 30rpx;
-    box-shadow: 0 4rpx 16rpx rgba(8, 119, 241, 0.2);
+    color: #4b5565;
+    font-size: 30rpx;
+    font-weight: 500;
 
-    .add-icon {
-      font-size: 32rpx;
-      color: #fff;
-      font-weight: 600;
-      margin-right: 8rpx;
-    }
-
-    .add-text {
-      font-size: 28rpx;
-      color: #fff;
-      font-weight: 500;
-    }
-  }
-
-  .edit-btn {
-    padding: 20rpx 32rpx;
-    // background-color: $primary-light;
-    border-radius: 20rpx;
-    // box-shadow: 0 2rpx 8rpx rgba(8, 119, 241, 0.15);
-
-    .edit-text {
-      font-size: 28rpx;
+    &.active {
       color: $primary-color;
-      font-weight: 500;
+      font-weight: 700;
+
+      &::after {
+        content: "";
+        position: absolute;
+        left: 50%;
+        bottom: 14rpx;
+        width: 70rpx;
+        height: 6rpx;
+        border-radius: 999rpx;
+        background: $primary-color;
+        transform: translateX(-50%);
+      }
     }
   }
 }
 
 .content-wrapper {
   flex: 1;
+  min-height: 0;
   display: flex;
   overflow: hidden;
 }
 
-// 左侧分类栏
 .category-sidebar {
   width: 210rpx;
-  background-color: #fff;
-  border-right: 1px solid #f0f0f0;
+  flex-shrink: 0;
   display: flex;
   flex-direction: column;
+  background: #fff;
+  border-right: 1px solid $border-color;
 
   .category-list {
     flex: 1;
-    height: 0; // 配合 flex: 1 实现固定高度
-    overflow-y: auto; // 支持垂直滚动
+    min-height: 0;
   }
 
   .category-item {
     position: relative;
-    padding: 20rpx 16rpx;
-    text-align: center;
-    background-color: #fff;
-    transition: all 0.3s;
-
-    .category-content {
-      position: relative;
-    }
-
-    .category-name {
-      font-size: 28rpx;
-      color: #666;
-      transition: all 0.3s;
-    }
+    min-height: 88rpx;
+    display: flex;
+    align-items: center;
+    justify-content: center;
+    padding: 12rpx 16rpx;
+    color: #344054;
+    background: #fff;
 
     &.active {
-      background-color: $primary-light;
+      color: $primary-color;
+      background: $primary-light;
+
+      &::before {
+        content: "";
+        position: absolute;
+        left: 0;
+        top: 20rpx;
+        bottom: 20rpx;
+        width: 4rpx;
+        border-radius: 999rpx;
+        background: $primary-color;
+      }
 
       .category-name {
-        color: $primary-color;
-        font-weight: 600;
-        font-size: 30rpx;
-      }
-    }
-
-    .delete-badge {
-      position: absolute;
-      top: -20rpx;
-      right: 2rpx;
-      width: 28rpx;
-      height: 28rpx;
-      background-color: #ff3b30;
-      border-radius: 50%;
-      display: flex;
-      align-items: center;
-      justify-content: center;
-      box-shadow: 0 2rpx 8rpx rgba(255, 59, 48, 0.3);
-
-      .delete-icon {
-        font-size: 24rpx;
-        color: #fff;
-        line-height: 1;
-        font-weight: 300;
+        font-weight: 700;
       }
     }
   }
 
-  // 新增分类按钮（固定在底部）
-  .add-category-footer {
+  .category-content {
+    position: relative;
+    width: 100%;
+    text-align: center;
+  }
+
+  .category-name {
+    font-size: 28rpx;
+    line-height: 40rpx;
+    word-break: break-all;
+  }
+
+  .delete-badge {
+    position: absolute;
+    top: -22rpx;
+    right: -8rpx;
+    width: 30rpx;
+    height: 30rpx;
     display: flex;
     align-items: center;
     justify-content: center;
-    padding: 40rpx 16rpx;
-    background-color: #fff;
-    border-top: 1px solid #f0f0f0;
-    box-shadow: 0 -2rpx 8rpx rgba(0, 0, 0, 0.04);
-    margin-bottom: 18rpx;
+    border-radius: 50%;
+    background: #ff3b30;
+
+    .delete-icon {
+      color: #fff;
+      font-size: 24rpx;
+      line-height: 1;
+    }
+  }
+
+  .add-category-footer {
+    min-height: 104rpx;
+    display: flex;
+    align-items: center;
+    justify-content: center;
+    border-top: 1px solid $border-color;
+    background: #fff;
 
     .add-category-text {
-      font-size: 26rpx;
       color: $primary-color;
-      font-weight: 500;
-    }
-
-    &:active {
-      background-color: $primary-light;
+      font-size: 28rpx;
+      font-weight: 600;
     }
   }
 }
 
-// 右侧内容区
 .phrases-container {
   flex: 1;
+  min-width: 0;
   display: flex;
   flex-direction: column;
-  background-color: #f8f9fa;
+  background: #f7f8fb;
+}
+
+.list-header {
+  padding: 22rpx 24rpx 14rpx;
+
+  .current-title {
+    margin-bottom: 16rpx;
+    color: $text-main;
+    font-size: 28rpx;
+    font-weight: 700;
+  }
+}
+
+.search-box {
+  height: 64rpx;
+  display: flex;
+  align-items: center;
+  padding: 0 20rpx;
+  border-radius: 32rpx;
+  background: #fff;
+  border: 1px solid $border-color;
+
+  .search-icon {
+    margin-right: 10rpx;
+    color: #98a2b3;
+    font-size: 30rpx;
+  }
+
+  .search-input {
+    flex: 1;
+    min-width: 0;
+    height: 64rpx;
+    color: $text-main;
+    font-size: 26rpx;
+  }
+
+  .clear-search {
+    width: 36rpx;
+    height: 36rpx;
+    display: flex;
+    align-items: center;
+    justify-content: center;
+    color: #98a2b3;
+    font-size: 34rpx;
+  }
 }
 
 .phrases-list {
   flex: 1;
-  padding: 10rpx;
-  height: 0; // 配合 flex: 1 实现固定高度
-  overflow-y: auto; // 支持垂直滚动
+  min-height: 0;
+  padding: 0 24rpx 24rpx;
+  box-sizing: border-box;
+}
 
-  .phrase-item {
-    padding: 24rpx;
-    margin-bottom: 16rpx;
-    background-color: #fff;
-    border-radius: 16rpx;
-    border-left: 6rpx solid $primary-color;
-    box-shadow: 0 2rpx 12rpx rgba(0, 0, 0, 0.04);
-    transition: all 0.3s;
+.phrase-item {
+  margin-bottom: 20rpx;
+  padding: 24rpx 24rpx 18rpx;
+  border-radius: 14rpx;
+  background: #fff;
+  border: 1px solid $border-color;
+  box-shadow: 0 8rpx 24rpx rgba(16, 24, 40, 0.04);
 
-    &:active {
-      transform: scale(0.98);
-      box-shadow: 0 4rpx 16rpx rgba(0, 0, 0, 0.08);
-    }
-
-    .phrase-content {
-      font-size: 28rpx;
-      color: #333;
-      line-height: 1.8;
-    }
-
-    .phrase-actions {
-      display: flex;
-      justify-content: flex-end;
-      margin-top: 16rpx;
-      padding-top: 16rpx;
-      border-top: 1px solid #f0f0f0;
-      gap: 16rpx;
-
-      .action-btn {
-        padding: 10rpx 28rpx;
-        font-size: 24rpx;
-        border-radius: 40rpx;
-        transition: all 0.3s;
-
-        &.edit {
-          color: $primary-color;
-          background-color: $primary-light;
-        }
-
-        &.delete {
-          color: #ff3b30;
-          background-color: #ffe6e6;
-        }
-      }
-    }
+  .phrase-top {
+    display: flex;
+    align-items: flex-start;
+    gap: 12rpx;
   }
 
-  .empty-state {
+  .phrase-content {
+    flex: 1;
+    min-width: 0;
+    color: $text-main;
+    font-size: 28rpx;
+    line-height: 44rpx;
+    word-break: break-word;
+    white-space: pre-wrap;
+  }
+
+  .collected-badge {
+    flex-shrink: 0;
+    padding: 4rpx 10rpx;
+    color: $primary-color;
+    font-size: 22rpx;
+    border-radius: 6rpx;
+    background: $primary-light;
+  }
+
+  .phrase-actions {
+    display: flex;
+    align-items: center;
+    gap: 28rpx;
+    margin-top: 20rpx;
+    padding-top: 16rpx;
+    border-top: 1px solid $border-color;
+  }
+
+  .action-btn {
+    display: flex;
+    align-items: center;
+    gap: 6rpx;
+    color: #475467;
+    font-size: 26rpx;
+
+    .action-icon {
+      font-size: 30rpx;
+      line-height: 1;
+    }
+
+    &.send,
+    &.collect.collected {
+      color: $primary-color;
+    }
+
+    &.delete {
+      color: #ff3b30;
+    }
+  }
+}
+
+.collect-tip {
+  padding: 8rpx 0 28rpx;
+  color: #98a2b3;
+  font-size: 24rpx;
+}
+
+.empty-state {
+  display: flex;
+  flex-direction: column;
+  align-items: center;
+  justify-content: center;
+  padding: 180rpx 24rpx;
+  text-align: center;
+
+  .empty-text {
+    color: #667085;
+    font-size: 30rpx;
+    font-weight: 600;
+  }
+
+  .empty-hint {
+    margin-top: 14rpx;
+    color: #98a2b3;
+    font-size: 24rpx;
+  }
+}
+
+.footer-action-bar {
+  display: flex;
+  align-items: center;
+  gap: 18rpx;
+  padding: 22rpx 24rpx 28rpx;
+  background: #fff;
+  border-top: 1px solid $border-color;
+
+  .add-phrase-btn {
+    flex: 1;
+    height: 76rpx;
     display: flex;
-    flex-direction: column;
     align-items: center;
     justify-content: center;
-    padding: 160rpx 0;
+    gap: 10rpx;
+    color: #fff;
+    background: $primary-color;
+    border-radius: 18rpx;
+    box-shadow: 0 8rpx 20rpx rgba(31, 92, 255, 0.22);
+  }
 
-    .empty-text {
-      font-size: 32rpx;
-      color: #999;
-      margin-bottom: 16rpx;
-    }
+  .add-icon,
+  .add-text,
+  .edit-text {
+    font-size: 28rpx;
+    font-weight: 600;
+  }
 
-    .empty-hint {
-      font-size: 24rpx;
-      color: #ccc;
-    }
+  .edit-btn {
+    width: 112rpx;
+    height: 76rpx;
+    display: flex;
+    align-items: center;
+    justify-content: center;
+    color: $primary-color;
   }
 }
 
 .popup-mask {
   position: fixed;
-  top: 0;
   left: 0;
   right: 0;
+  top: 0;
   bottom: 0;
-  background-color: rgba(0, 0, 0, 0.6);
-  display: flex;
-  align-items: center;
-  justify-content: center;
   z-index: 9999;
-  backdrop-filter: blur(4rpx);
+  display: flex;
+  align-items: flex-end;
+  justify-content: center;
+  background: rgba(0, 0, 0, 0.45);
 }
 
 .popup-content {
-  width: 600rpx;
-  padding: 40rpx;
-  background-color: #fff;
-  border-radius: 24rpx;
-  max-height: 80vh;
-  display: flex;
-  flex-direction: column;
-  box-shadow: 0 8rpx 32rpx rgba(0, 0, 0, 0.15);
+  width: 100%;
+  padding: 34rpx 32rpx 40rpx;
+  box-sizing: border-box;
+  background: #fff;
+  border-radius: 28rpx 28rpx 0 0;
+  box-shadow: 0 -10rpx 30rpx rgba(16, 24, 40, 0.12);
 
   .popup-header {
     display: flex;
     align-items: center;
     justify-content: space-between;
-    margin-bottom: 32rpx;
-
-    .popup-title {
-      font-size: 36rpx;
-      font-weight: 600;
-      color: #333;
-    }
-
-    .popup-close {
-      width: 48rpx;
-      height: 48rpx;
-      display: flex;
-      align-items: center;
-      justify-content: center;
-      background-color: #f5f5f5;
-      border-radius: 50%;
-
-      .close-icon {
-        font-size: 40rpx;
-        color: #999;
-        line-height: 1;
-        font-weight: 300;
-      }
-    }
+    margin-bottom: 30rpx;
   }
 
-  .phrase-textarea {
-    width: 100%;
-    min-height: 300rpx;
-    max-height: 500rpx;
-    padding: 20rpx;
-    font-size: 28rpx;
-    color: #333;
-    background-color: #f8f9fa;
-    border-radius: 12rpx;
-    border: 2rpx solid #e9ecef;
-    margin-bottom: 12rpx;
-    box-sizing: border-box;
-    line-height: 1.6;
+  .popup-title {
+    color: $text-main;
+    font-size: 34rpx;
+    font-weight: 700;
   }
 
-  .char-count {
-    text-align: right;
-    font-size: 24rpx;
-    color: #999;
-    margin-bottom: 32rpx;
+  .popup-close {
+    width: 48rpx;
+    height: 48rpx;
+    display: flex;
+    align-items: center;
+    justify-content: center;
   }
 
+  .close-icon {
+    color: #98a2b3;
+    font-size: 46rpx;
+    line-height: 1;
+  }
+}
+
+.form-label {
+  margin-bottom: 14rpx;
+  color: $text-main;
+  font-size: 26rpx;
+  font-weight: 600;
+}
+
+.content-label {
+  margin-top: 30rpx;
+}
+
+.category-picker,
+.category-input {
+  height: 84rpx;
+  display: flex;
+  align-items: center;
+  justify-content: space-between;
+  padding: 0 22rpx;
+  box-sizing: border-box;
+  color: $text-main;
+  font-size: 28rpx;
+  border: 1px solid #d9e0ea;
+  border-radius: 12rpx;
+  background: #fff;
+}
+
+.picker-arrow {
+  color: #667085;
+  font-size: 32rpx;
+}
+
+.form-hint {
+  margin-top: 12rpx;
+  color: #98a2b3;
+  font-size: 24rpx;
+}
+
+.collect-preview {
+  margin: 28rpx 0 32rpx;
+  padding: 22rpx;
+  color: $text-main;
+  font-size: 28rpx;
+  line-height: 42rpx;
+  word-break: break-word;
+  white-space: pre-wrap;
+  border-radius: 12rpx;
+  background: #f7f8fb;
+  border: 1px solid $border-color;
+}
+
+.phrase-textarea {
+  width: 100%;
+  height: 220rpx;
+  padding: 22rpx;
+  box-sizing: border-box;
+  color: $text-main;
+  font-size: 28rpx;
+  line-height: 42rpx;
+  border: 1px solid #d9e0ea;
+  border-radius: 12rpx;
+  background: #fff;
+}
+
+.char-count {
+  margin-top: 12rpx;
+  margin-bottom: 30rpx;
+  color: #98a2b3;
+  font-size: 24rpx;
+  text-align: right;
+}
+
+.category-popup {
   .category-input {
     width: 100%;
-    padding: 0 20rpx; // 只设置左右 padding，去掉上下 padding
-    font-size: 28rpx;
-    color: #333;
-    background-color: #f8f9fa;
-    border-radius: 12rpx;
-    border: 2rpx solid #e9ecef;
     margin-bottom: 32rpx;
-    box-sizing: border-box;
-    height: 100rpx;
-    line-height: 100rpx; // 行高等于高度，实现垂直居中
+  }
+}
+
+.popup-actions {
+  display: flex;
+  gap: 24rpx;
+
+  button {
+    flex: 1;
+    height: 78rpx;
+    display: flex;
+    align-items: center;
+    justify-content: center;
+    padding: 0;
+    font-size: 28rpx;
+    font-weight: 600;
+    border-radius: 14rpx;
+
+    &::after {
+      border: 0;
+    }
   }
 
-  .popup-actions {
-    display: flex;
-    justify-content: space-between;
-    gap: 20rpx;
+  .cancel-btn {
+    color: $text-main;
+    background: #fff;
+    border: 1px solid #d9e0ea;
+  }
 
-    button {
-      flex: 1;
-      padding: 10rpx;
-      font-size: 28rpx;
-      border-radius: 12rpx;
-      border: none;
-      font-weight: 500;
-      &.cancel-btn {
-        color: #666;
-        background-color: #f5f5f5;
-      }
-
-      &.confirm-btn {
-        color: #fff;
-        background: linear-gradient(
-          135deg,
-          $primary-gradient-end 0%,
-          $primary-gradient-start 100%
-        );
-        box-shadow: 0 4rpx 12rpx rgba(8, 119, 241, 0.3);
-      }
-    }
+  .confirm-btn {
+    color: #fff;
+    background: $primary-color;
   }
 }
 </style>
diff --git a/utils/api.js b/utils/api.js
index 2760b54..36d567c 100644
--- a/utils/api.js
+++ b/utils/api.js
@@ -43,17 +43,18 @@ const urlsConfig = {
     getArticleByIds: 'getArticleByIds',// 诊断库
     getDisease: 'getDisease',
     getCommonPhrases: 'getCommonPhrases',
+    getCommonWordsList: 'getCommonWordsList',
+    getCorpCommonWordCate: 'getCorpCommonWordCate',
+    getUserCommonWordCate: 'getUserCommonWordCate',
+    addUserCommonWordCate: 'addUserCommonWordCate',
+    updateUserCommonWordCate: 'updateUserCommonWordCate',
+    deleteUserCommonWordCate: 'deleteUserCommonWordCate',
+    setCommonWords: 'setCommonWords',
+    removeCommonWords: 'removeCommonWords',
     saveCommonPhrase: 'saveCommonPhrase',
     deleteCommonPhrase: 'deleteCommonPhrase',
     getCommonPhraseCategories: 'getCommonPhraseCategories',
     saveCommonPhraseCategory: 'saveCommonPhraseCategory',
-    // 个人常用语接口
-    getPersonalPhrases: 'getPersonalPhrases',
-    savePersonalPhrase: 'savePersonalPhrase',
-    deletePersonalPhrase: 'deletePersonalPhrase',
-    getPersonalPhraseCategories: 'getPersonalPhraseCategories',
-    savePersonalPhraseCategory: 'savePersonalPhraseCategory',
-    deletePersonalPhraseCategory: 'deletePersonalPhraseCategory',
     // 宣教文章接口
     getArticleCateList: 'getArticleCateList',
     getArticleList: 'getArticleList',