常用语联调接口

yangyin

2024-11-05 f15c8fa05e3e4eae8ef093ba6ba827ad74e38fec

 src/components/chat/components/playBar/phrase/CommonPhrases.vue

@@ -1,7 +1,7 @@
<template>
   <div class="container" :class="isHome ? 'top-[100%] mt-[8px]' : 'bottom-[100%] mb-[8px]'">
      <div class="container_header">
         <div class="title">常用语</div>
         <div class="question">常用语</div>
         <span class="ywifont ywicon-guanbi text-[15px] cursor-pointer text-[#767a97]" @click="closeCommonPhrases"></span>
      </div>
      <div class="container_content">
@@ -11,8 +11,8 @@
                  <div style="overflow-anchor: none" v-for="(item, index) in commonPhrases" :key="index">
                     <div class="phase_item" @click="titleClick(item)">
                        <div class="flex flex-col">
                           <div class="title">
                              {{ item.title }}
                           <div class="question">
                              {{ item.question }}
                           </div>
                           <!-- <div class="content">
                              {{ item.content }}
@@ -60,14 +60,15 @@

<script setup lang="ts">
import { ElMessageBox } from 'element-plus';
import { computed, reactive, ref } from 'vue';
import { addUserSample } from '/@/api/ai/chat';
import { computed, onMounted, reactive, ref } from 'vue';
import { addUserSample, deleteUserSample, listUserSample, updateUserSample } from '/@/api/ai/chat';
import { activeGroupType, activeRoomId, activeSampleId, setRoomConfig } from '/@/stores/chatRoom';
const state = reactive({
   useCommonPhrasesDialog: false,
   show_sample_title: false,
   inputCommonPhrases: '',
   sample_title: null,
   sample_id: null,
});
const commonPhrases = ref([]);
const props = defineProps(['isHome']);
@@ -85,7 +86,16 @@
   isShow.value = false;
};
//#endregion

//#region ====================== 获取常用语 ======================
const getCommonPhrases = async () => {
   const res = await listUserSample({
      group_type: activeGroupType.value,
   });
   if (res.json_ok) {
      commonPhrases.value = res.values;
   }
};
//#endregion
//#region ====================== 添加常用语 ======================
//关闭常用语弹窗
const handleClose = () => {
@@ -100,48 +110,67 @@
const editCommonPhrases = (item) => {
   state.useCommonPhrasesDialog = true;
   state.show_sample_title = true;
   state.inputCommonPhrases = item.title;
   state.inputCommonPhrases = item.question;
   state.sample_id = item.id;
};
const deleteCommonPhrases = (item) => {
   ElMessageBox.confirm(`你确定要删除常用语吗?<div style="white-space: pre-line;">[${item.title}]</div>`, '提示', {
const deleteCommonPhrases = (row) => {
   ElMessageBox.confirm(`你确定要删除常用语吗?`, '提示', {
      confirmButtonText: '确定',
      cancelButtonText: '取消',
      type: 'warning',
      dangerouslyUseHTMLString: true,
      type: 'warning',
   }).then(async () => {
      commonPhrases.value = commonPhrases.value.filter((i) => i.id !== item.id);
      const res = await deleteUserSample({
         sample_id: row.id,
      });
      const foundIndex = commonPhrases.value.findIndex((item) => item === row);
      foundIndex > -1 && commonPhrases.value.splice(foundIndex, 1);
   });
};
//提交常用语
const submitCommonPhrases = async () => {
   const res = await addUserSample({
      question: state.inputCommonPhrases,
      group_type: activeGroupType.value,
   });
   if (res.json_ok) {
      commonPhrases.value.push({
         id: res.sample_id,
         title: state.inputCommonPhrases,
   if (state.show_sample_title) {
      const res = await updateUserSample({
         sample_id: state.sample_id,
         question: state.inputCommonPhrases,
      });
      state.useCommonPhrasesDialog = false;
      if (res.json_ok) {
         const foundIndex = commonPhrases.value.findIndex((item) => item.id === state.sample_id);
         foundIndex > -1 && (commonPhrases.value[foundIndex].question = state.inputCommonPhrases);
         handleClose();
      }
   } else {
      const res = await addUserSample({
         question: state.inputCommonPhrases,
         group_type: activeGroupType.value,
      });
      if (res.json_ok) {
         commonPhrases.value.push({
            id: res.sample_id,
            question: state.inputCommonPhrases,
         });
         handleClose();
      }
   }
};
//#endregion
//#region ====================== 常用语到对话框 ======================
const emits = defineEmits<{
   (event: 'updateCommonChatInput', val): void;
   (event: 'updateCommonChatByUser', val): void;
}>();
const titleClick = (item) => {
   emits('updateCommonChatInput', item.title);
   emits('updateCommonChatInput', item.question);
   setRoomConfig(activeRoomId.value, 'isAnswerByLLM', false);
   activeSampleId.value = item.id;
};
const commonChatByUser = (data) => {
   commonPhrases.value.push(data);
};
defineExpose({ commonChatByUser });
//#endregion
onMounted(() => {
   getCommonPhrases();
});
defineExpose({ commonChatByUser });
</script>
<style scoped lang="scss">
.container {
@@ -165,7 +194,7 @@
      align-items: center;
      padding: 10px 6px;
      color: #060607;
      .title {
      .question {
         font-size: 14px;
         color: #060607;
         font-weight: 600;
@@ -199,7 +228,7 @@
            &:hover {
               background: #e5e7ed;
            }
            .title {
            .question {
               font-size: 14px;
               color: #8d8e99;
               font-weight: 400;