no message

App.vue

@@ -1,365 +1,369 @@
 <script>
-import useAccountStore from "@/store/account.js";
+	import useAccountStore from "@/store/account.js";
-import { globalTimChatManager } from "@/utils/tim-chat.js";
+	import {
+		globalTimChatManager
+	} from "@/utils/tim-chat.js";
 
-export default {
+	export default {
-  onLaunch: function () {
+		onLaunch: function() {
 			// 需在 pinia 安装后再获取 store，避免 getActivePinia 报错
-    const { login } = useAccountStore();
+			const {
+				login
+			} = useAccountStore();
 			login();
 			console.log("App Launch: ");
 		},
-  onShow: function () {
+		onShow: function() {
 			console.log("App Show");
 		},
-  onHide: function () {
+		onHide: function() {
 			console.log("App Hide");
-    // 小程序退出时退出腾讯IM登录
+			try {
-    // try {
+				if (globalTimChatManager && globalTimChatManager.tim) {
-    //   if (globalTimChatManager && globalTimChatManager.tim) {
+					console.log('小程序退出，开始退出腾讯IM');
-    //     console.log('小程序退出，开始退出腾讯IM');
+					globalTimChatManager.destroy();
-    //     globalTimChatManager.destroy();
+					console.log('腾讯IM退出成功');
-    //     console.log('腾讯IM退出成功');
+				}
-    //   }
+			} catch (error) {
-    // } catch (error) {
+				console.error('退出腾讯IM失败:', error);
-    //   console.error('退出腾讯IM失败:', error);
+			}
-    // }
 		},
-};
+	};
 </script>
 
 <style lang="scss">
-$primary-color: #0074ff;
+	$primary-color: #0074ff;
 
-page {
+	page {
 		height: 100%;
 		background: #f5f5f5;
-}
+	}
 
-.shadow-up {
+	.shadow-up {
 		box-shadow: rgba(0, 0, 0, 0) 0px 0px 0px 0px, rgba(0, 0, 0, 0) 0px 0px 0px 0px,
 			rgba(0, 0, 0, 0.1) 0px -10px 15px -3px, rgba(0, 0, 0, 0.1) 0px -4px 6px -4px;
-}
+	}
 
-.shadow-lg {
+	.shadow-lg {
 		box-shadow: 0 10px 15px -3px rgb(0 0 0 / 0.1), 0 4px 6px -4px rgb(0 0 0 / 0.1);
-}
+	}
 
-.relative {
+	.relative {
 		position: relative;
-}
+	}
 
-.inline-block {
+	.inline-block {
 		display: inline-block;
-}
+	}
 
-.flex {
+	.flex {
 		display: flex;
-}
+	}
 
-.flex-col {
+	.flex-col {
 		flex-direction: column;
-}
+	}
 
-.flex-wrap {
+	.flex-wrap {
 		flex-wrap: wrap;
-}
+	}
 
-.flex-grow {
+	.flex-grow {
 		flex-grow: 1;
-}
+	}
 
-.flex-shrink-0 {
+	.flex-shrink-0 {
 		flex-shrink: 0;
-}
+	}
 
-.items-center {
+	.items-center {
 		align-items: center;
-}
+	}
 
-.justify-center {
+	.justify-center {
 		justify-content: center;
-}
+	}
 
-.justify-between {
+	.justify-between {
 		justify-content: space-between;
-}
+	}
 
-.justify-around {
+	.justify-around {
 		justify-content: space-around;
-}
+	}
 
-.justify-end {
+	.justify-end {
 		justify-content: flex-end;
-}
+	}
 
-.bg-gray {
+	.bg-gray {
 		background: #f5f5f5;
-}
+	}
 
-.bg-primary {
+	.bg-primary {
 		background: $primary-color;
-}
+	}
 
-.bg-success {
+	.bg-success {
 		background: green;
-}
+	}
 
-.bg-white {
+	.bg-white {
 		background: #fff;
-}
+	}
 
-.bg-warning {
+	.bg-warning {
 		background: orange;
-}
+	}
 
-.bg-danger {
+	.bg-danger {
 		background: rgb(248 113 113);
-}
+	}
 
-.py-5 {
+	.py-5 {
 		padding-top: 10rpx;
 		padding-bottom: 10rpx;
-}
+	}
 
-.p-15 {
+	.p-15 {
 		padding: 30rpx;
-}
+	}
 
-.p-10 {
+	.p-10 {
 		padding: 20rpx;
-}
+	}
 
-.px-5 {
+	.px-5 {
 		padding-left: 10rpx;
 		padding-right: 10rpx;
-}
+	}
 
-.px-10 {
+	.px-10 {
 		padding-left: 20rpx;
 		padding-right: 20rpx;
-}
+	}
 
-.px-12 {
+	.px-12 {
 		padding-left: 24rpx;
 		padding-right: 24rpx;
-}
+	}
 
-.px-15 {
+	.px-15 {
 		padding-left: 30rpx;
 		padding-right: 30rpx;
-}
+	}
 
-.pt-5 {
+	.pt-5 {
 		padding-top: 10rpx;
-}
+	}
-.pt-15 {
+
+	.pt-15 {
 		padding-top: 30rpx;
-}
+	}
 
-.break-all {
+	.break-all {
 		word-break: break-all;
-}
+	}
 
-.pb-5 {
+	.pb-5 {
 		padding-bottom: 10rpx;
-}
+	}
 
-.pb-10 {
+	.pb-10 {
 		padding-bottom: 20rpx;
-}
+	}
 
-.py-10 {
+	.py-10 {
 		padding-top: 20rpx;
 		padding-bottom: 20rpx;
-}
+	}
 
-.py-12 {
+	.py-12 {
 		padding-top: 24rpx;
 		padding-bottom: 24rpx;
-}
+	}
 
-.py-15 {
+	.py-15 {
 		padding-top: 30rpx;
 		padding-bottom: 30rpx;
-}
+	}
 
-.mr-5 {
+	.mr-5 {
 		margin-right: 10rpx;
-}
+	}
 
-.mr-10 {
+	.mr-10 {
 		margin-right: 20rpx;
-}
+	}
 
-.ml-15 {
+	.ml-15 {
 		margin-left: 30rpx;
-}
+	}
 
-.mb-5 {
+	.mb-5 {
 		margin-bottom: 10rpx;
-}
+	}
 
-.mb-10 {
+	.mb-10 {
 		margin-bottom: 20rpx;
-}
+	}
 
-.mt-10 {
+	.mt-10 {
 		margin-top: 20rpx;
-}
+	}
 
-.mt-15 {
+	.mt-15 {
 		margin-top: 30rpx;
-}
+	}
 
-.mt-12 {
+	.mt-12 {
 		margin-top: 24rpx;
-}
+	}
 
-.mx-10 {
+	.mx-10 {
 		margin-left: 20rpx;
 		margin-right: 20rpx;
-}
+	}
 
-.mx-auto {
+	.mx-auto {
 		margin-left: auto;
 		margin-right: auto;
-}
+	}
 
-.rounded {
+	.rounded {
 		border-radius: 16rpx;
-}
+	}
 
-.rounded-sm {
+	.rounded-sm {
 		border-radius: 8rpx;
-}
+	}
 
-.rounded-full {
+	.rounded-full {
 		border-radius: 999px;
-}
+	}
 
-.text-center {
+	.text-center {
 		text-align: center;
-}
+	}
 
-.text-right {
+	.text-right {
 		text-align: right;
-}
+	}
 
-.text-gray {
+	.text-gray {
 		color: #999;
-}
+	}
 
-.text-black {
+	.text-black {
 		color: #000;
-}
+	}
 
-.text-dark {
+	.text-dark {
 		color: #333;
-}
+	}
 
-.text-danger {
+	.text-danger {
 		color: #f56c6c;
-}
+	}
 
-.text-primary {
+	.text-primary {
 		color: $primary-color;
-}
+	}
 
-.text-success {
+	.text-success {
 		color: #67c23a;
-}
+	}
 
-.text-white {
+	.text-white {
 		color: #fff;
-}
+	}
 
-.text-warning {
+	.text-warning {
 		color: #f56c6c;
-}
+	}
 
-.text-sm {
+	.text-sm {
 		font-size: 24rpx;
-}
+	}
 
-.text-base {
+	.text-base {
 		font-size: 28rpx;
-}
+	}
 
-.text-lg {
+	.text-lg {
 		font-size: 32rpx;
-}
+	}
 
-.text-xl {
+	.text-xl {
 		font-size: 36rpx;
-}
+	}
 
-.leading-normal {
+	.leading-normal {
 		line-height: 1.5;
-}
+	}
 
-.border {
+	.border {
 		border: 1px solid #eee;
-}
+	}
 
-.border-dashed {
+	.border-dashed {
 		border: 1px dashed #eee;
-}
+	}
 
-.border-b {
+	.border-b {
 		border-bottom: 1px solid #eee;
-}
+	}
 
-.border-auto {
+	.border-auto {
 		border: 1px solid;
-}
+	}
 
-.border-dashed-auto {
+	.border-dashed-auto {
 		border: 1px dashed;
-}
+	}
 
-.border-primary {
+	.border-primary {
 		border: 1px solid $primary-color;
-}
+	}
 
-.font-semibold {
+	.font-semibold {
 		font-weight: bold;
-}
+	}
 
-.truncate {
+	.truncate {
 		white-space: nowrap;
 		overflow: hidden;
 		text-overflow: ellipsis;
-}
+	}
 
-.w-0 {
+	.w-0 {
 		width: 0;
-}
+	}
 
-.w-full {
+	.w-full {
 		width: 100%;
-}
+	}
 
-.overflow-hidden {
+	.overflow-hidden {
 		overflow: hidden;
-}
+	}
 
-.border-box {
+	.border-box {
 		box-sizing: border-box;
-}
+	}
 
-.line-clamp-2 {
+	.line-clamp-2 {
 		display: -webkit-box;
 		-webkit-box-orient: vertical;
 		-webkit-line-clamp: 2;
 		overflow: hidden;
-}
+	}
 
-.h-full {
+	.h-full {
 		height: 100%;
-}
+	}
 
-.safe-bottom-padding {
+	.safe-bottom-padding {
 		height: env(safe-area-inset-bottom);
-}
+	}
 </style>

pages.json

@@ -13,6 +13,12 @@
 				"enablePullDownRefresh": false
 			}
 		},
+		{
+			"path": "pages/message/common-phrases",
+			"style": {
+				"navigationBarTitleText": "常用语"
+			}
+		},
 		{
 			"path": "pages/case/case",
 			"style": {

pages/message/common-phrases.vue

@@ -1,24 +1,49 @@
 <template>
   <view class="common-phrases-page">
-    <view class="header">
+    <!-- 自定义导航栏 -->
-      <view class="title">快捷回复</view>
+    <view class="custom-navbar" :style="{ paddingTop: statusBarHeight + 'px' }">
-      <view class="edit-btn" @click="toggleEditMode">{{ isEditMode ? '完成' : '编辑' }}</view>
+      <view class="navbar-content">
+
+        <view class="navbar-center">
+          <text class="navbar-title">快捷回复</text>
+        </view>
+        <view class="navbar-right" @click="toggleEditMode">
+          <text class="edit-text">{{ isEditMode ? '完成' : '编辑' }}</text>
+        </view>
+      </view>
     </view>
 
-    <view class="category-tabs">
+    <view class="content-wrapper">
+      <!-- 左侧分类列表 -->
+      <view class="category-sidebar">
+        <scroll-view class="category-list" scroll-y>
           <view 
             v-for="category in categories" 
             :key="category.id"
-        class="category-tab"
+            class="category-item"
             :class="{ active: currentCategory === category.id }"
             @click="switchCategory(category.id)"
+            @longpress="handleCategoryLongPress(category)"
           >
-        {{ category.name }}
+            <view class="category-name">{{ category.name }}</view>
+            <view v-if="currentCategory === category.id" class="active-indicator"></view>
+            <view v-if="isEditMode && category.deletable" class="delete-badge" @click.stop="deleteCategory(category)">
+              <text class="delete-icon">×</text>
             </view>
-      <view class="add-category-btn" @click="showAddCategoryDialog">
+          </view>
+          
+          <view class="add-category-item" @click="showAddCategoryDialog">
             <text class="plus-icon">+</text>
-        加分类
+            <text>加分类</text>
           </view>
+        </scroll-view>
+      </view>
+
+      <!-- 右侧常用语列表 -->
+      <view class="phrases-container">
+        <view class="add-phrase-header" @click="showAddPhraseDialog">
+          <text class="add-icon">+</text>
+          <text class="add-text">添加快捷回复</text>
         </view>
 
         <scroll-view class="phrases-list" scroll-y>
@@ -30,32 +55,41 @@
           >
             <view class="phrase-content">{{ phrase.content }}</view>
             <view v-if="isEditMode" class="phrase-actions">
-          <view class="action-btn edit" @click.stop="editPhrase(phrase)">编辑</view>
+              <view class="action-btn edit" @click.stop="editPhrase(phrase)">
-          <view class="action-btn delete" @click.stop="deletePhrase(phrase)">删除</view>
+                <text>编辑</text>
+              </view>
+              <view class="action-btn delete" @click.stop="deletePhrase(phrase)">
+                <text>删除</text>
+              </view>
             </view>
           </view>
           
           <view v-if="currentPhrases.length === 0" class="empty-state">
             <image src="/static/empty.svg" class="empty-icon" mode="aspectFit"></image>
             <text class="empty-text">暂无常用语</text>
+            <text class="empty-hint">点击上方按钮添加常用语</text>
           </view>
         </scroll-view>
-
+      </view>
-    <view class="add-phrase-btn" @click="showAddPhraseDialog">
-      <text class="plus-icon-white">+</text>
-      添加快捷回复
     </view>
 
     <!-- 添加/编辑常用语弹窗 -->
     <view v-if="showPhrasePopup" class="popup-mask" @click="closePopup">
       <view class="popup-content" @click.stop>
-        <view class="popup-title">{{ editingPhrase ? '编辑' : '添加快捷回复' }}</view>
+        <view class="popup-header">
+          <text class="popup-title">{{ editingPhrase ? '编辑快捷回复' : '添加快捷回复' }}</text>
+          <view class="popup-close" @click="closePopup">
+            <text class="close-icon">×</text>
+          </view>
+        </view>
         <textarea 
           v-model="phraseForm.content" 
           class="phrase-textarea"
           placeholder="在此处输入文字"
           maxlength="500"
+          :auto-height="true"
         ></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>
@@ -66,11 +100,16 @@
     <!-- 添加分类弹窗 -->
     <view v-if="showCategoryPopup" class="popup-mask" @click="closeCategoryPopup">
       <view class="popup-content category-popup" @click.stop>
-        <view class="popup-title">新建分类名</view>
+        <view class="popup-header">
+          <text class="popup-title">新建分类</text>
+          <view class="popup-close" @click="closeCategoryPopup">
+            <text class="close-icon">×</text>
+          </view>
+        </view>
         <input 
           v-model="categoryForm.name" 
           class="category-input"
-          placeholder="请在此填写分类名，最多6个字"
+          placeholder="请输入分类名，最多6个字"
           maxlength="6"
         />
         <view class="popup-actions">
@@ -86,14 +125,17 @@
 import { ref, computed, onMounted } from 'vue';
 import api from '@/utils/api';
 
+// 获取系统状态栏高度
+const statusBarHeight = ref(0);
+
 // 编辑模式
 const isEditMode = ref(false);
 
 // 分类数据
 const categories = ref([
-  { id: 'visit', name: '文字随访' },
+  { id: 'visit', name: '文字随访', deletable: false },
-  { id: 'voice', name: '语音随访' },
+  { id: 'voice', name: '语音随访', deletable: false },
-  { id: 'common', name: '常用回复' },
+  { id: 'common', name: '常用回复', deletable: false },
 ]);
 
 const currentCategory = ref('common');
@@ -121,6 +163,11 @@ const categoryForm = ref({
 
 const editingPhrase = ref(null);
 
+// 返回上一页
+const goBack = () => {
+  uni.navigateBack();
+};
+
 // 切换编辑模式
 const toggleEditMode = () => {
   isEditMode.value = !isEditMode.value;
@@ -365,6 +412,12 @@ onMounted(() => {
 </script>
 
 <style scoped lang="scss">
+// 使用项目主题色
+$primary-color: #0877F1;
+$primary-light: #e8f3ff;
+$primary-gradient-start: #1b5cc8;
+$primary-gradient-end: #0877f1;
+
 .common-phrases-page {
   height: 100vh;
   display: flex;
@@ -388,62 +441,117 @@ onMounted(() => {
 
   .edit-btn {
     font-size: 28rpx;
-    color: #ff6b35;
+    color: $primary-color;
   }
 }
 
-.category-tabs {
+.content-wrapper {
+  flex: 1;
   display: flex;
-  align-items: center;
+  overflow: hidden;
-  padding: 24rpx 32rpx;
+}
-  background-color: #fff;
-  overflow-x: auto;
-  white-space: nowrap;
 
-  .category-tab {
+// 左侧分类栏
-    padding: 12rpx 24rpx;
+.category-sidebar {
-    margin-right: 16rpx;
+  width: 200rpx;
+  background-color: #f8f8f8;
+  border-right: 1px solid #e5e5e5;
+
+  .category-list {
+    height: 100%;
+  }
+
+  .category-item {
+    position: relative;
+    padding: 32rpx 24rpx;
+    text-align: center;
+    background-color: #f8f8f8;
+    border-bottom: 1px solid #e5e5e5;
+
+    .category-name {
       font-size: 28rpx;
       color: #666;
-    background-color: #f5f5f5;
+    }
-    border-radius: 8rpx;
-    flex-shrink: 0;
 
     &.active {
-      color: #ff6b35;
+      background-color: #fff;
-      background-color: #fff5f2;
+
-      border: 1px solid #ff6b35;
+      .category-name {
+        color: $primary-color;
+        font-weight: 600;
+      }
+
+      .active-indicator {
+        position: absolute;
+        left: 0;
+        top: 50%;
+        transform: translateY(-50%);
+        width: 6rpx;
+        height: 40rpx;
+        background-color: $primary-color;
+        border-radius: 0 4rpx 4rpx 0;
+      }
     }
   }
 
-  .add-category-btn {
+  .add-category-item {
     display: flex;
+    flex-direction: column;
     align-items: center;
-    padding: 12rpx 24rpx;
+    justify-content: center;
-    font-size: 28rpx;
+    padding: 32rpx 24rpx;
-    color: #ff6b35;
+    font-size: 24rpx;
-    background-color: #fff5f2;
+    color: $primary-color;
-    border-radius: 8rpx;
+    background-color: #f8f8f8;
-    flex-shrink: 0;
 
     .plus-icon {
       font-size: 32rpx;
-      margin-right: 4rpx;
       font-weight: 600;
+      margin-bottom: 8rpx;
     }
   }
 }
 
+// 右侧内容区
+.phrases-container {
+  flex: 1;
+  display: flex;
+  flex-direction: column;
+  background-color: #fff;
+}
+
+.add-phrase-header {
+  display: flex;
+  align-items: center;
+  justify-content: center;
+  padding: 24rpx;
+  background: linear-gradient(270deg, $primary-gradient-start 2.26%, $primary-gradient-end 94.33%);
+  border-bottom: 1px solid rgba(8, 119, 241, 0.1);
+
+  .add-icon {
+    font-size: 32rpx;
+    color: #fff;
+    font-weight: 600;
+    margin-right: 8rpx;
+  }
+
+  .add-text {
+    font-size: 28rpx;
+    color: #fff;
+    font-weight: 500;
+  }
+}
+
 .phrases-list {
   flex: 1;
-  padding: 24rpx 32rpx;
+  padding: 24rpx;
-  overflow-y: auto;
 
   .phrase-item {
     padding: 24rpx;
     margin-bottom: 16rpx;
-    background-color: #fff;
+    background-color: #f8f8f8;
     border-radius: 12rpx;
+    border-left: 4rpx solid $primary-color;
 
     .phrase-content {
       font-size: 28rpx;
@@ -456,7 +564,7 @@ onMounted(() => {
       justify-content: flex-end;
       margin-top: 16rpx;
       padding-top: 16rpx;
-      border-top: 1px solid #f5f5f5;
+      border-top: 1px solid #e5e5e5;
 
       .action-btn {
         padding: 8rpx 24rpx;
@@ -465,8 +573,8 @@ onMounted(() => {
         border-radius: 8rpx;
 
         &.edit {
-          color: #007aff;
+          color: $primary-color;
-          background-color: #e6f2ff;
+          background-color: $primary-light;
         }
 
         &.delete {
@@ -497,24 +605,6 @@ onMounted(() => {
   }
 }
 
-.add-phrase-btn {
-  display: flex;
-  align-items: center;
-  justify-content: center;
-  margin: 24rpx 32rpx;
-  padding: 24rpx;
-  font-size: 28rpx;
-  color: #fff;
-  background-color: #ff6b35;
-  border-radius: 12rpx;
-
-  .plus-icon-white {
-    font-size: 36rpx;
-    margin-right: 8rpx;
-    font-weight: 600;
-  }
-}
-
 .popup-mask {
   position: fixed;
   top: 0;
@@ -582,7 +672,8 @@ onMounted(() => {
 
       &.confirm-btn {
         color: #fff;
-        background-color: #ff6b35;
+        background: linear-gradient(270deg, $primary-gradient-start 2.26%, $primary-gradient-end 94.33%);
+        box-shadow: 0 2rpx 8rpx rgba(8, 119, 241, 0.2);
       }
     }
   }

pages/message/components/chat-input.vue

@@ -150,6 +150,23 @@ const sendTextMessage = async () => {
   inputText.value = "";
 };
 
+// 从常用语发送文本消息
+const sendTextMessageFromPhrase = async (content) => {
+  if (!content.trim()) return;
+  
+  await sendMessage("text", content);
+  
+  // 发送成功后滚动到底部
+  nextTick(() => {
+    emit("scrollToBottom");
+  });
+};
+
+// 暴露方法给父组件调用
+defineExpose({
+  sendTextMessageFromPhrase
+});
+
 // 发送图片消息
 const sendImageMessage = async (imageFile) => {
   console.log("chat-input sendImageMessage 被调用，参数:", imageFile);
@@ -337,14 +354,40 @@ const sendSurveyMessage = async () => {
   await sendCustomMessage(surveyMessage);
 };
 
-// 更多面板按钮配置
+// 跳转到常用语页面
+const goToCommonPhrases = () => {
+  uni.navigateTo({
+    url: '/pages/message/common-phrases'
+  });
+};
+
 const morePanelButtons = [
-  { text: "照片", icon: "/static/home/photo.png", action: showImagePicker },
+  { text: "照片", icon: "/static/icon/zhaopian.png", action: showImagePicker },
-  { text: "拍摄", icon: "/static/home/video.png", action: takePhoto },
+  {
-  // { text: '病情', icon: '/static/home/avatar.svg', action: sendSymptomMessage },
+    text: "回访任务",
-  // { text: '处方', icon: '/static/home/avatar.svg', action: sendPrescriptionMessage },
+    icon: "/static/icon/zhaopian.png",
-  // { text: '续方', icon: '/static/home/avatar.svg', action: sendRefillMessage },
+    action: showImagePicker,
-  // { text: '问卷', icon: '/static/home/avatar.svg', action: sendSurveyMessage }
+  },
+  {
+    text: "常用语",
+    icon: "/static/icon/changyongyu.png",
+    action: goToCommonPhrases,
+  },
+  {
+    text: "宣教",
+    icon: "/static/icon/xuanjiaowenzhang.png",
+    action: showImagePicker,
+  },
+  {
+    text: "问卷",
+    icon: "/static/icon/zhaopian.png",
+    action: showImagePicker,
+  },
+  {
+    text: "结束问诊",
+    icon: "/static/icon/jieshuzixun.png",
+    action: showImagePicker,
+  },
 ];
 
 function handleInputFocus() {

pages/message/index.vue

@@ -111,6 +111,7 @@
     <!-- 聊天输入组件 -->
     <ChatInput
       v-if="!isEvaluationPopupOpen"
+      ref="chatInputRef"
       :timChatManager="timChatManager"
       :formatTime="formatTime"
       @scrollToBottom="() => scrollToBottom(true)"
@@ -153,6 +154,9 @@ const timChatManager = globalTimChatManager;
 const { account, openid, isIMInitialized } = storeToRefs(useAccountStore());
 const { initIMAfterLogin } = useAccountStore();
 
+// 聊天输入组件引用
+const chatInputRef = ref(null);
+
 const groupId = ref("");
 const {
   chatMember,
@@ -590,6 +594,18 @@ onHide(() => {
   stopIMMonitoring();
 });
 
+// 发送常用语（从常用语页面返回时调用）
+const sendCommonPhrase = (content) => {
+  if (chatInputRef.value) {
+    chatInputRef.value.sendTextMessageFromPhrase(content);
+  }
+};
+
+// 暴露方法给常用语页面调用
+defineExpose({
+  sendCommonPhrase
+});
+
 // 页面卸载
 onUnmounted(() => {
   clearMessageCache();

utils/api.js

@@ -15,7 +15,12 @@ const urlsConfig = {
   },
 
   knowledgeBase: {
-    getArticleByIds: 'getArticleByIds'
+    getArticleByIds: 'getArticleByIds',
+    getCommonPhrases: 'getCommonPhrases',
+    saveCommonPhrase: 'saveCommonPhrase',
+    deleteCommonPhrase: 'deleteCommonPhrase',
+    getCommonPhraseCategories: 'getCommonPhraseCategories',
+    saveCommonPhraseCategory: 'saveCommonPhraseCategory'
   },
   member: {
     addCustomer: 'add',