ai-chat-bot-interface 1.7.7 → 1.7.9

package/src/ChatUi.vue

@@ -1,1087 +0,0 @@
-<template>
-  <div class="cui_box">
-    <div class="cui_wrap">
-      <div v-if="showHeader" class="cui_header">
-        <div class="title" @click.stop="queryHistoryList">
-          <div class="back" @click.stop="handleBack">
-            <back-icon />
-          </div>
-          <div class="name_box">
-            <div class="name">{{ name }}</div>
-            <div v-if="nameSub" class="name_sub">{{ nameSub }}</div>
-          </div>
-        </div>
-        <div class="btn_group">
-          <button class="btn" @click.stop="createConv">
-            <new-chat class="icon" />
-            <span style="font-size: 14px">{{ finalDefMsg.newChat }}</span>
-          </button>
-          <template v-show="false">
-            <button class="btn">
-              <clear-icon />
-            </button>
-            <button class="btn">
-              <close-icon />
-            </button>
-          </template>
-        </div>
-      </div>
-      <div class="cui_content">
-        <div
-          v-if="botInfo && botInfo.onboarding_info"
-          style="text-align: left; margin-top: 50px"
-        >
-          <div style="text-align: center">
-            <img
-              :src="botInfo.icon_url"
-              alt="icon"
-              width="64"
-              height="64"
-              style="border-radius: 15px"
-            />
-            <p class="board_name">{{ botInfo.name }}</p>
-          </div>
-
-          <div class="board_desc">{{ botInfo.onboarding_info.prologue }}</div>
-          <div class="flexcss">
-            <span
-              v-for="(item, idx) in botInfo.onboarding_info.suggested_questions"
-              :key="idx"
-              class="board_sug"
-              @click.stop="chatConv([{ content: item, text: item }])"
-              >{{ item }}</span
-            >
-          </div>
-        </div>
-        <template v-for="(conv, index) in historyList" :key="index">
-          <div v-if="conv.role === 'assistant'" class="replay role_sys">
-            <div class="replay_content">
-              <div class="name">
-                <img class="avatar" :src="logo" alt="avatar" />
-                {{ name }}
-                <!--<span class="time">12:30</span>-->
-              </div>
-              <div class="box">
-                <template v-if="conv.reasoning_content">
-                  <div v-if="conv.status === 'thinking'" class="think_status">
-                    <thinking-icon class="icon" />
-                    {{ finalDefMsg.thinking }}
-                  </div>
-                  <div v-else class="think_status">
-                    <ok-icon class="icon" />
-                    {{ finalDefMsg.thinkCompleted }}
-                  </div>
-
-                  <p class="think_text">
-                    {{ conv.reasoning_content }}
-                  </p>
-                </template>
-                <template v-if="conv.content">
-                  <assistant-replay
-                    v-if="contentTye === 'text'"
-                    :content="conv.content"
-                  />
-                  <markdown-viewer
-                    v-else-if="contentTye === 'markdown'"
-                    :content="conv.content"
-                  />
-                  <template v-if="!isAnswering">
-                    <div v-if="conv.extra.length">
-                      <template v-for="(comp, idx) in conv.extra" :key="idx">
-                        <!--                      <p
-                          v-if="comp.showType === 'plan' && comp.planParse"
-                          class="text"
-                          style="margin-top: 1em"
-                        >
-                          {{ comp.planParse }}
-                        </p>-->
-                        <dishes-list
-                          v-if="
-                            finalCardList.dishes && comp.showType === 'card'
-                          "
-                          :sku-list="comp.skuList"
-                          :is-mini="!showHeader"
-                          :def-msg="finalDefMsg"
-                          :channel="channel"
-                          @select="(data) => handleCardTap(data, comp)"
-                        />
-                        <plan-card
-                          v-if="finalCardList.plan && comp.showType === 'plan'"
-                          :info="comp"
-                          :def-msg="finalDefMsg"
-                          @select="handleCardTap({ type: 'match' }, comp)"
-                        />
-                        <store-list
-                          v-if="
-                            finalCardList.store && comp.showType === 'store'
-                          "
-                          :list="comp.storeList"
-                          @select="handleStoreSel"
-                        />
-                        <personal-form
-                          v-if="
-                            finalCardList.personalForm &&
-                            comp.showType === 'personalForm'
-                          "
-                          :query="firstMsg"
-                          @submit="chatConv"
-                        />
-                        <div v-if="comp.showType === 'contactKF'">
-                          电话热线：<a href="tel:4006681606">400 6681 606</a>
-                          <img
-                            src="https://prodstatic.weis1606.cn/api/smartFood/mealPlan/contact_kf.png"
-                            alt=""
-                            width="100%"
-                            style="margin-top: 10px"
-                          />
-                        </div>
-                      </template>
-                    </div>
-                    <div v-else-if="handleTextNeedBtn(conv.content)">
-                      <div
-                        class="cui_btn cui_btn_2"
-                        @click.stop="handleCardTap({ type: 'match' }, {})"
-                      >
-                        {{ finalDefMsg.useSolution }}
-                      </div>
-                    </div>
-                  </template>
-                </template>
-                <div
-                  v-if="isAnswering && index === historyList.length - 1"
-                  class="loading_row"
-                >
-                  Ai努力生成中...
-                  <loading-icon2 />
-                </div>
-              </div>
-            </div>
-          </div>
-          <div v-else class="replay role_user">
-            <div class="replay_content">
-              <div class="name">
-                健康用户
-                <!--<span class="time">12:30</span>-->
-                <img class="avatar" :src="avatar" alt="avatar" />
-              </div>
-              <div class="box">
-                <p class="text" v-html="conv.content" />
-                <div v-if="conv.extra.length">
-                  <imge-list :list="conv.extra" />
-                </div>
-              </div>
-            </div>
-          </div>
-        </template>
-        <div ref="endTarget" style="height: 100px" />
-      </div>
-      <operate-module
-        v-model="inputText"
-        :new-chat="!showHeader"
-        :token="token"
-        :tag-list="tagList"
-        :def-msg="finalDefMsg"
-        :is-req="isReq"
-        @send="chatConv"
-        @tag="handleTagSel"
-        @call="handleCall"
-      />
-    </div>
-  </div>
-</template>
-
-<script setup>
-import { computed, nextTick, onMounted, provide, ref } from 'vue';
-import ClearIcon from './components/icons/ClearIcon.vue';
-import CloseIcon from './components/icons/CloseIcon.vue';
-import NewSessionIcon from './components/icons/NewSessionIcon.vue';
-import SendIcon from './components/icons/SendIcon.vue';
-import { get, post } from './utils/request';
-import DishesCard from './components/DishesCard.vue';
-import DishesList from './components/DishesList.vue';
-import PlanCard from './components/PlanCard.vue';
-import OperateModule from './components/OperateModule.vue';
-import BackIcon from './components/icons/BackIcon.vue';
-import NewChat from './components/icons/newChat.vue';
-import LoadingIcon from './components/icons/loadingIcon.vue';
-import LoadingIcon2 from './components/icons/loadingIcon2.vue';
-import ImgeList from './components/imgeList.vue';
-import ThinkingIcon from './components/icons/ThinkingIcon.vue';
-import OkIcon from './components/icons/OkIcon.vue';
-import AssistantReplay from './components/assistantReplay/assistantReplay.vue';
-import StoreList from './components/StoreList/StoreList.vue';
-import MarkdownViewer from './components/MarkdownPlan/MarkdownViewer.vue';
-import PersonalForm from './components/personalForm/personalForm.vue';
-import processBar from './components/icons/processBar.vue';
-
-const chatOptions = computed(() => {
-  return {
-    headers: {
-      Authorization: `Bearer ${props.token}`,
-      'Content-Type': 'application/json',
-    },
-  };
-});
-const conversationId = ref('');
-const isAnswering = ref(false);
-const isReq = ref('00');
-const historyList = ref([]);
-const isFirst = ref(false);
-const turns = ref(1);
-
-const msgObj = {
-  placeholder: '發消息⋯',
-  fileText: '請根據我上傳的體檢報告為我生成飲食方案',
-  uploadingTips: '文件正在上傳，請稍候...',
-  matchText: '請用以上方案為我配餐',
-  matchContent: '請用以上方案為我配餐',
-  energy: '熱量',
-  protein: '蛋白質',
-  fat: '脂肪',
-  carbonwater: '碳水',
-  newChat: '新對話',
-  thinking: '思考中...',
-  thinkCompleted: '思考完成',
-  useSolution: '用該方案配餐',
-  aiTips: '【内容由AI生成，仅供参考】',
-};
-const defCardList = {
-  store: true,
-  dishes: true,
-  plan: true,
-  personalForm: false,
-};
-
-const props = defineProps({
-  logo: {
-    type: String,
-    default: 'https://prodstatic.weis1606.cn/api/smartFood/icon/weis_logo.png',
-  },
-  avatar: {
-    type: String,
-    default: 'https://prodstatic.weis1606.cn/api/smartFood/icon/def_gray.svg',
-  },
-  name: {
-    type: String,
-    default: 'Weis Bot',
-  },
-  nameSub: {
-    type: String,
-    default: 'nutribite.com',
-  },
-  botId: {
-    type: String,
-    required: true,
-  },
-  uid: {
-    type: String,
-    required: true,
-    default: 'user',
-  },
-  channel: {
-    type: String,
-    default: 'web',
-  },
-  token: {
-    type: String,
-    required: true,
-  },
-  postToken: {
-    type: String,
-    default: '',
-  },
-  showHeader: {
-    type: Boolean,
-    default: true,
-  },
-  tagList: {
-    type: Array,
-    default: () => [
-      { name: '人工客服', value: 'kefu', type: 'chat', msg: '人工客服' },
-      { name: '查看菜单', value: 'menu', type: 'call', msg: '查看菜单' },
-      { name: '体检报告', value: 'exam', type: 'upload', msg: '体检报告' },
-    ],
-  },
-  defMsg: {
-    type: Object,
-    default: () => ({}),
-  },
-  contentTye: {
-    type: String,
-    default: 'text',
-  },
-  cardList: {
-    type: Object,
-    default: () => ({
-      store: true,
-      dishes: true,
-      plan: true,
-      personalForm: false,
-    }),
-  },
-  storage: {
-    type: String,
-    default: 'sessionStorage',
-  },
-  needLog: {
-    type: Boolean,
-    default: false,
-  },
-  firstMsg: {
-    type: String,
-    default: '',
-  },
-});
-
-const Emits = defineEmits(['call', 'log']);
-
-const finalDefMsg = computed(() => {
-  return {
-    ...msgObj,
-    ...props.defMsg,
-  };
-});
-const finalCardList = computed(() => {
-  return {
-    ...defCardList,
-    ...props.cardList,
-  };
-});
-
-const endTarget = ref(null);
-const inputText = ref('');
-const botInfo = ref({});
-
-const storage = {
-  setItem: (key, value) => {
-    props.storage === 'sessionStorage'
-      ? sessionStorage.setItem(key, value)
-      : localStorage.setItem(key, value);
-  },
-  getItem: (key) => {
-    return props.storage === 'sessionStorage'
-      ? sessionStorage.getItem(key)
-      : localStorage.getItem(key);
-  },
-};
-
-onMounted(async () => {
-  localStorage.setItem('postToken', props.postToken || '');
-  if (storage.getItem('conversationId')) {
-    conversationId.value = storage.getItem('conversationId');
-    await queryBotInfo();
-    await queryHistoryList();
-    isFirst.value = false;
-  } else {
-    await createConv();
-    if (props.firstMsg) {
-      await handleFirstMsg();
-    }
-  }
-  scrollToEnd();
-});
-
-const handleFirstMsg = async () => {
-  const presetList = [
-    {
-      params: {
-        planType: '03', // 03保持，01减肥
-        profileInfo: {
-          birthday: '20010101',
-          motion: '01',
-          sex: '2',
-          weight: '50',
-          height: '160',
-        },
-      },
-      age: 25,
-      msg: `本食谱为均衡营养版${props.firstMsg}的食疗调养方案示例，依据以下女性常规身体数据制定：
-性别：女；
-年龄：25岁；
-身高：160cm；
-体重：50kg；
-日常运动水平：久坐；
-口味偏好及饮食禁忌：无；
-如需定制贴合个人情况的专属方案，请前往完善个人身体数据，获取个性化定制食谱。`,
-    },
-    {
-      params: {
-        planType: '03',
-        profileInfo: {
-          birthday: '20010101',
-          motion: '01',
-          sex: '1',
-          weight: '65',
-          height: '170',
-        },
-      },
-      age: 25,
-      msg: `本食谱为均衡营养版${props.firstMsg}的食疗调养方案示例，依据以下男性常规身体数据制定：
-性别：男；
-年龄：25岁；
-身高：170cm；
-体重：65kg；
-日常运动水平：久坐；
-口味偏好及饮食禁忌：无；
-如需定制贴合个人情况的专属方案，请前往完善个人身体数据，获取个性化定制食谱。`,
-    },
-    {
-      params: {
-        planType: '01',
-        profileInfo: {
-          birthday: '19910101',
-          motion: '01',
-          sex: '2',
-          weight: '65',
-          height: '160',
-        },
-      },
-      age: 35,
-      msg: `本食谱为控卡版${props.firstMsg}的食疗调养方案示例，依据以下女性常规身体数据制定：
-性别：女；
-年龄：35岁；
-身高：160cm；
-体重：65kg；
-日常运动水平：久坐；
-口味偏好及饮食禁忌：无；
-如需定制贴合个人情况的专属方案，请前往完善个人身体数据，获取个性化定制食谱。`,
-    },
-    {
-      params: {
-        planType: '01',
-        profileInfo: {
-          birthday: '19910101',
-          motion: '01',
-          sex: '1',
-          weight: '75',
-          height: '170',
-        },
-      },
-      age: 35,
-      msg: `本食谱为控卡版${props.firstMsg}的食疗调养方案示例，依据以下男性常规身体数据制定：
-性别：男；
-年龄：35岁；
-身高：170cm；
-体重：75kg；
-日常运动水平：久坐；
-口味偏好及饮食禁忌：无；
-如需定制贴合个人情况的专属方案，请前往完善个人身体数据，获取个性化定制食谱。`,
-    },
-  ];
-  const categoryMap = {
-    '01': '早餐',
-    '02': '午餐',
-    '03': '晚餐',
-    '04': '加餐',
-  };
-  let p = localStorage.getItem('preset_point') || 0;
-  p++;
-  if (p >= presetList.length) {
-    p = 0;
-  }
-
-  localStorage.setItem('preset_point', p);
-  const curInfo = presetList[p];
-  const curMsg = `帮我定制${props.firstMsg}的⻝疗调养⽅案`;
-  const perMsg = curMsg;
-
-  historyList.value = [
-    {
-      conversation_id: '',
-      bot_id: props.botId,
-      role: 'user',
-      content: perMsg,
-      reasoning_content: '',
-      status: 'ended',
-      extra: [],
-    },
-  ];
-
-  const res = await post('/api/cn.weis.api.Food/bdGeneralTemp', {
-    method: 'bdGeneralTemp',
-    params: [{ ...curInfo.params }],
-    token: props.postToken,
-  });
-
-  if (res.errCode === 0 && res.obj) {
-    const cateMap = {};
-    (res.obj.planDetails || []).forEach((item) => {
-      cateMap[item.category] = {
-        energy: `热量：${item.totalKcal}kcal`,
-        carbonWater: `碳水：${item.carbohydrateTotal}g`,
-        protein: `蛋白质：${item.proteinTotal}g`,
-        fat: `脂肪：${item.fatTotal}g`,
-      };
-    });
-
-    //     const resMsg = `您的身高：${curInfo.params.profileInfo.height}cm  年龄：${
-    //       curInfo.age
-    //     } 岁  体重：${curInfo.params.profileInfo.weight}kg  性别：${
-    //       curInfo.params.profileInfo.sex === '2' ? '女' : '男'
-    //     }  日常运动水平：久坐
-    // 根据您的身体状况，给您推荐的饮食方案如下
-
-    const resMsg = `我将为您出通用的食谱建议，如您有定制化健康诉求，请点击下方“私人订制个性食谱”来让我结合您的个人情况制定个性化配餐计划
-
-
-| 早餐        |          | 午餐 |
-|------------|----------|----|
-| ${cateMap['01'].energy} |&nbsp;&nbsp;&nbsp; &nbsp;&nbsp;&nbsp;&nbsp; &nbsp; | ${cateMap['02'].energy} |
-| ${cateMap['01'].carbonWater}   |&nbsp;&nbsp;&nbsp; &nbsp;&nbsp;&nbsp;&nbsp; &nbsp; | ${cateMap['02'].carbonWater}   |
-| ${cateMap['01'].protein} |&nbsp;&nbsp;&nbsp; &nbsp;&nbsp;&nbsp;&nbsp; &nbsp; | ${cateMap['02'].protein} |
-| ${cateMap['01'].fat}   |&nbsp;&nbsp;&nbsp; &nbsp;&nbsp;&nbsp;&nbsp; &nbsp; | ${cateMap['02'].fat}   |
-
-| 晚餐        |          | 加餐 |
-|------------|----------|----|
-| ${cateMap['03'].energy} |&nbsp;&nbsp;&nbsp; &nbsp;&nbsp;&nbsp;&nbsp; &nbsp; | ${cateMap['04'].energy} |
-| ${cateMap['03'].carbonWater}   |&nbsp;&nbsp;&nbsp; &nbsp;&nbsp;&nbsp;&nbsp; &nbsp; | ${cateMap['04'].carbonWater}   |
-| ${cateMap['03'].protein} |&nbsp;&nbsp;&nbsp; &nbsp;&nbsp;&nbsp;&nbsp; &nbsp; | ${cateMap['04'].protein} |
-| ${cateMap['03'].fat}   |&nbsp;&nbsp;&nbsp; &nbsp;&nbsp;&nbsp;&nbsp; &nbsp; | ${cateMap['04'].fat}   |`;
-
-    historyList.value.push({
-      conversation_id: '',
-      bot_id: props.botId,
-      role: 'assistant',
-      content: resMsg,
-      reasoning_content: '',
-      status: 'ended',
-      extra: [
-        {
-          ...res.obj,
-          showType: 'card',
-        },
-      ],
-    });
-    Emits('log', {
-      turns: turns.value,
-      info: {
-        ...historyList.value[historyList.value.length - 1],
-        question: {
-          content: perMsg,
-          role: 'user',
-        },
-      },
-    });
-  }
-};
-
-const createConv = async () => {
-  const res = await post(
-    'https://api.coze.cn/v1/conversation/create',
-    { bot_id: props.botId, connector_id: '999' },
-    { ...chatOptions.value },
-  );
-  isFirst.value = true;
-  turns.value = 0;
-  console.log(res);
-  if (res.code === 0 && res.data) {
-    conversationId.value = res.data.id || '';
-    storage.setItem('conversationId', conversationId.value);
-    historyList.value = [];
-    await queryBotInfo();
-    // await messageCreate();
-  }
-};
-// const messageCreate = async () => {
-//   console.log(chatOptions.value);
-//   const res = await post(
-//       `https://api.coze.cn/v1/conversation/message/create?conversation_id=${conversationId.value}`,
-//       { "role":"user","content":`#userid_${props.uid}`,"content_type":"text"},
-//       {...chatOptions.value});
-// };
-/*const messageCreate = async () => {
-  const res = await fetch(
-      `https://api.coze.cn/v3/chat?conversation_id=${conversationId.value}`,
-      {
-        method: 'POST',
-        headers: {
-          ...chatOptions.value.headers,
-          // 'Content-Type': 'text/event-stream',
-        },
-        body: JSON.stringify({
-          bot_id: props.botId,
-          user_id: props.uid,
-          stream: true,
-          connector_id: '999',
-          additional_messages: [
-            {
-              'role': 'user',
-              'content_type': 'text',
-              'content': `#userid_${props.uid}`,
-
-            }],
-        }),
-        credentials: 'same-origin', // 默认同源策略
-        mode: 'cors', // 默认跨域模式
-        cache: 'default', // 默认缓存策略
-      },
-  );
-};*/
-
-const chatConv = async (data) => {
-  isReq.value = '01';
-  let isInCode = Array.isArray(data); //  data.hasOwnProperty('text') && data.hasOwnProperty('code');
-  const botId = props.botId;
-  if (!(!isAnswering.value && (inputText.value || isInCode))) {
-    return;
-  }
-  const inText = inputText.value;
-  console.log('== user send ==', isInCode, data, inText);
-  isAnswering.value = true;
-
-  const additional_messages = [];
-  const uObj = {
-    conversation_id: conversationId.value,
-    bot_id: botId,
-    role: 'user',
-    content: '',
-    reasoning_content: '',
-    status: 'ended',
-    extra: [],
-  };
-  const markStr = `chat_${new Date().getTime()};`;
-  data.forEach((item) => {
-    if (item.hasOwnProperty('content') && item.content) {
-      if (item.hasOwnProperty('type') && item.type === 'object_string') {
-        console.log('=== item ====', item);
-        // botId = '7474884145253023795';
-        additional_messages.push({
-          content: JSON.stringify(
-            item.content.map((con) => ({
-              type: con.type,
-              file_id: con.file_id,
-            })),
-          ),
-          content_type: 'object_string',
-          role: 'user',
-          meta_data: {
-            chat_group: markStr,
-          },
-        });
-        uObj.extra = item.content.map((con) => ({
-          ...con,
-          showType: con.type,
-        }));
-      } else {
-        uObj.content = item.text;
-        additional_messages.push({
-          content: item.content,
-          content_type: 'text',
-          role: 'user',
-          meta_data: {
-            chat_group: markStr,
-          },
-        });
-      }
-    }
-  });
-  historyList.value.push(uObj);
-  isReq.value = '02';
-  // if (props.needLog) {
-  // Emits('log', {
-  //   turns: turns.value,
-  //   info: uObj,
-  // });
-  // }
-  const res = await fetch(
-    `https://api.coze.cn/v3/chat?conversation_id=${conversationId.value}`,
-    {
-      method: 'POST',
-      headers: {
-        ...chatOptions.value.headers,
-        // 'Content-Type': 'text/event-stream',
-      },
-      body: JSON.stringify({
-        bot_id: botId,
-        user_id: props.uid,
-        stream: true,
-        connector_id: '999',
-        additional_messages /*[
-          {
-            content: '[{"type":"image","file_id":"7475569020654436390"}]',
-            content_type: 'object_string',
-            role: 'user',
-          },
-          {
-            role: 'user',
-            content_type: 'text',
-            content: isInCode ? data.code : inText, // '配餐1600kcal，身高173，体重60kg，生成一天的套餐',
-          },
-        ]*/,
-        custom_variables: {
-          uid: props.uid,
-        },
-      }),
-      credentials: 'same-origin', // 默认同源策略
-      mode: 'cors', // 默认跨域模式
-      cache: 'default', // 默认缓存策略
-    },
-  );
-  isReq.value = '03';
-  historyList.value.push({
-    conversation_id: '',
-    bot_id: '',
-    role: 'assistant',
-    content: '',
-    reasoning_content: '',
-    status: 'answering',
-    extra: [],
-  });
-  scrollToEnd();
-  inputText.value = '';
-  const idx = historyList.value.length - 1;
-  const reader = res.body.getReader();
-  const decoder = new TextDecoder('utf-8');
-  let buffer = '';
-
-  const handlePersonalForm = () => {
-    console.log('======= End ======', historyList.value, isFirst.value);
-    if (isFirst.value) {
-      if (
-        historyList.value[idx].extra.findIndex((item) =>
-          item.hasOwnProperty('showType'),
-        ) === -1
-      ) {
-        historyList.value[idx].extra.push({ showType: 'personalForm' });
-      }
-      isFirst.value = false;
-      console.log('===============', historyList.value[idx]);
-    }
-  };
-
-  // 逐块读取数据
-  while (true) {
-    const { done, value } = await reader.read();
-    if (done) {
-      console.log('Stream has ended.');
-      isAnswering.value = false;
-      isReq.value = '00';
-      historyList.value[idx].status = 'ended';
-      handlePersonalForm();
-      if (props.needLog) {
-        Emits('log', {
-          turns: turns.value,
-          info: {
-            ...historyList.value[idx],
-            question: {
-              ...uObj,
-            },
-          },
-        });
-        turns.value += 1;
-      }
-      scrollToEnd();
-      break;
-    }
-
-    // 解码数据块
-    const chunk = decoder.decode(value, { stream: true });
-    buffer += chunk;
-
-    // 处理数据块
-    const lines = buffer.split('\n');
-    buffer = lines.pop(); // 保留未处理的片段
-
-    lines.forEach((line) => {
-      if (line.trim().length > 0 && line.trim().startsWith('data:')) {
-        const str = line.replace(/^data:\s*/, '');
-        const strObj = JSON.parse(str);
-        console.log('Received:', strObj);
-        isAnswering.value = true;
-        isReq.value = '04';
-        if (!historyList.value[idx].bot_id && strObj.bot_id) {
-          historyList.value[idx].bot_id = strObj.bot_id;
-        }
-        if (!historyList.value[idx].conversation_id && strObj.conversation_id) {
-          historyList.value[idx].conversation_id = strObj.conversation_id;
-        }
-        if (
-          strObj.hasOwnProperty('reasoning_content') &&
-          strObj.reasoning_content &&
-          strObj.type === 'answer'
-        ) {
-          historyList.value[idx].status = 'thinking';
-          historyList.value[idx].reasoning_content += strObj.reasoning_content;
-          scrollToEnd();
-        } else if (
-          strObj.hasOwnProperty('content') &&
-          strObj.hasOwnProperty('content_type') &&
-          strObj.content_type === 'text' &&
-          strObj.hasOwnProperty('type') &&
-          strObj.type === 'answer' &&
-          !strObj.hasOwnProperty('created_at')
-        ) {
-          historyList.value[idx].status = 'answering';
-          historyList.value[idx].content = handleText(
-            historyList.value[idx].content + strObj.content,
-          );
-          scrollToEnd();
-        } else if (
-          strObj.hasOwnProperty('type') &&
-          strObj.type === 'tool_response'
-        ) {
-          const extraObj = JSON.parse(strObj.content);
-          if (extraObj.hasOwnProperty('showType')) {
-            historyList.value[idx].extra.push({ ...extraObj });
-          } else if (extraObj.hasOwnProperty('response_for_model')) {
-            const modelObj = JSON.parse(extraObj.response_for_model);
-            if (modelObj.hasOwnProperty('showType')) {
-              historyList.value[idx].extra.push({ ...modelObj });
-            }
-          }
-          scrollToEnd();
-        }
-      }
-    });
-  }
-  console.log('====', historyList.value);
-};
-
-const queryHistoryList = async () => {
-  const res = await post(
-    `https://api.coze.cn/v1/conversation/message/list?conversation_id=${conversationId.value}`,
-    { order: 'asc' },
-    { ...chatOptions.value },
-  );
-  if (res.code === 0 && res.data && res.data.length) {
-    historyList.value = [];
-    const cardList = [];
-    const userFileList = [];
-    res.data.forEach((row) => {
-      if (row.hasOwnProperty('content_type')) {
-        if (row.content_type === 'text') {
-          historyList.value.push({
-            chat_id: row.chat_id,
-            conversation_id: row.conversation_id,
-            bot_id: row.bot_id,
-            role: row.role,
-            meta_data: row.meta_data,
-            content: handleText(row.content),
-            reasoning_content: row.reasoning_content,
-            status: 'ended',
-            extra: [],
-          });
-        } else if (row.content_type === 'card' && row.role === 'assistant') {
-          try {
-            const cardObj = JSON.parse(row.content);
-            if (cardObj.hasOwnProperty('showType')) {
-              cardList.push({
-                chat_id: row.chat_id,
-                conversation_id: row.conversation_id,
-                bot_id: row.bot_id,
-                role: row.role,
-                extra: [{ ...cardObj }],
-              });
-            } else if (cardObj.hasOwnProperty('response_for_model')) {
-              const modelObj = JSON.parse(cardObj.response_for_model);
-              if (modelObj.hasOwnProperty('showType')) {
-                cardList.push({
-                  chat_id: row.chat_id,
-                  conversation_id: row.conversation_id,
-                  bot_id: row.bot_id,
-                  role: row.role,
-                  extra: [{ ...modelObj }],
-                });
-              }
-            }
-          } catch (e) {
-            console.log('== 解析错误 sys==');
-          }
-        } else if (
-          row.content_type === 'object_string' &&
-          row.role === 'user'
-        ) {
-          try {
-            const strObj = JSON.parse(row.content);
-            cardList.push({
-              chat_id: row.chat_id,
-              conversation_id: row.conversation_id,
-              bot_id: row.bot_id,
-              role: row.role,
-              meta_data: row.meta_data,
-              extra: strObj.map((item) => ({ ...item, showType: item.type })),
-            });
-          } catch (e) {
-            console.log('== 解析错误 user==');
-          }
-        }
-      }
-    });
-    cardList.forEach((card) => {
-      const idx =
-        card.role === 'user'
-          ? historyList.value.findIndex(
-              (c) =>
-                c.meta_data.chat_group === card.meta_data.chat_group &&
-                c.role === card.role,
-            )
-          : historyList.value.findIndex(
-              (c) => c.chat_id === card.chat_id && c.role === card.role,
-            );
-      if (idx > -1) {
-        historyList.value[idx].extra = [...card.extra];
-      }
-    });
-  }
-
-  console.log('== history ==', historyList.value, finalCardList.value);
-};
-
-const queryBotInfo = async () => {
-  const res = await get(
-    `https://api.coze.cn/v1/bot/get_online_info?bot_id=${props.botId}`,
-    { ...chatOptions.value },
-  );
-  console.log(res);
-  if (res.code === 0 && res.data) {
-    botInfo.value = { ...res.data };
-  }
-};
-
-const handleText = (str) => {
-  return str;
-  // console.log(str);
-  // let txt = '';
-  //
-  // return str.replaceAll(
-  //   /\[([^\]]+)\]\((https?:\/\/[^)]+)\)/gi,
-  //   '<a href="$2" target="_blank">[$1]</a>',
-  // );
-};
-const handleBack = () => {
-  Emits('call', { type: 'back' });
-};
-const handleStoreSel = (info) => {
-  chatConv([{ content: info.content, text: info.text }]);
-};
-const handleTagSel = (info) => {
-  console.log(info);
-  switch (info.type) {
-    case 'chat':
-      chatConv([{ content: info.msg, text: info.msg }]);
-      break;
-    case 'call':
-      Emits('call', { ...info });
-      break;
-    case 'simulate':
-      simulateChat(info);
-      break;
-  }
-};
-
-const handleCardTap = ({ type }, info) => {
-  switch (type) {
-    case 'change':
-      chatConv([{ content: '換一套菜品', text: '換一套菜品' }]);
-      break;
-    case 'match':
-      chatConv([
-        {
-          content: finalDefMsg.value.matchContent,
-          text: finalDefMsg.value.matchText,
-        },
-      ]);
-      break;
-    case 'personalForm':
-      simulateChat({
-        msg: '请为我生成一份个性化的健康的食谱',
-        name: '用户信息',
-        type: 'simulate',
-        value: 'personalForm',
-      });
-      break;
-    default:
-      Emits('call', { type, info });
-  }
-};
-const handleCall = (data) => {
-  switch (data.type) {
-    case 'new_chat':
-      createConv();
-      break;
-    default:
-      Emits('call', data);
-
-      break;
-  }
-};
-
-const handlePlanParse = (list) => {
-  const pIdx = list.findIndex((p) => p.showType === 'plan');
-  return pIdx > -1
-    ? { show: true, text: list[pIdx].planParse }
-    : { show: false };
-};
-
-const scrollToEnd = () => {
-  setTimeout(() => {
-    nextTick(() => {
-      endTarget.value.scrollIntoView();
-    });
-  }, 100);
-};
-
-provide('triggerScrollToEnd', scrollToEnd);
-
-const handleTextNeedBtn = (str) => {
-  const regExp = /#全日總熱量：(\d*?)kcal/g;
-  return regExp.test(str);
-};
-
-const simulateChat = (info) => {
-  console.log('== simulateChat == ', info);
-  historyList.value.push({
-    conversation_id: '',
-    bot_id: props.botId,
-    role: 'user',
-    content: info.msg,
-    reasoning_content: '',
-    status: 'ended',
-    extra: [],
-  });
-  let resInfo = {
-    msg: '',
-    extra: [],
-  };
-  switch (info.value) {
-    case 'personalForm':
-      resInfo.msg =
-        '请填写您的身体数据，维小饭将根据你的身体数据智能生成个性化食谱';
-      resInfo.extra = [
-        {
-          showType: 'personalForm',
-        },
-      ];
-      break;
-    case 'contactKF':
-      resInfo.msg = '联系专业营养师团队帮你快速实现科学配比的健康餐营养搭配。';
-      resInfo.extra = [{ showType: 'contactKF' }];
-      break;
-  }
-  historyList.value.push({
-    conversation_id: '',
-    bot_id: props.botId,
-    role: 'assistant',
-    content: resInfo.msg,
-    reasoning_content: '',
-    status: 'ended',
-    extra: [...resInfo.extra],
-  });
-  turns.value += 1;
-  Emits('log', {
-    turns: turns.value,
-    info: {
-      ...historyList.value[historyList.value.length - 1],
-      question: {
-        content: info.msg,
-        role: 'user',
-      },
-    },
-  });
-  scrollToEnd();
-};
-</script>
-
-<style scoped lang="less">
-@import './ChatUi';
-</style>