smartai2dian0/src/modules/conversation-chat/DialogItem.vue

<template>
  <div class="dialog-item-container">
    <DialogQuestion v-if="item_type === 'q'" :question="questionInfo" @select="handleSelectChat" />

    <DialogAnswer
      v-if="item_type === 'a'"
      :answer="answerInfo"
      @stop="handleStopChat"
      @retry="handleRetryChat"
      @select="handleSelectChat"
    />
  </div>
</template>

<script setup>
import { ref, computed } from 'vue';

import DialogQuestion from '../conversation-item/DialogQuestion.vue';
import DialogAnswer from '../conversation-item/DialogAnswer.vue';

const props = defineProps({
  dialog: Object
});

const emit = defineEmits(['stop', 'retry', 'select']);

/**
 * 当前这一项的类别，有两个值
 * q 提问
 * a 智能体的回答
 */
const item_type = computed(() => {
  const item = props.dialog;

  return item.client_custom_item_type;
});

/**
 * 客户端提问数据
 */
const questionInfo = computed(() => {
  return {
    content: props.dialog.question,
    client_custom_icon: props.dialog.client_custom_icon,
    client_custom_upload_file_list: props.dialog.client_custom_upload_file_list,
    client_custom_unique_id: props.dialog.client_custom_unique_id
  };
});

/**
 * 智能体回答的答案
 */
const answerInfo = computed(() => {
  const chat_info = props.dialog;

  const obj = {
    client_custom_unique_id: chat_info.client_custom_unique_id
  };

  // 智能体回答的内容
  if (chat_info.answer) {
    obj.content = chat_info.answer;
  }

  /**
   * 状态值信息
   * 0 加载中
   * 1 正在对话
   * 2 已结束
   */
  obj.client_custom_chat_status = chat_info.client_custom_chat_status;
  obj.client_custom_icon = chat_info.client_custom_icon;

  // 附加数据
  obj.client_custom_linked_sql = chat_info.client_custom_linked_sql || '';
  obj.client_custom_linked_code = chat_info.client_custom_linked_code || '';
  obj.client_custom_linked_refference_full_content = chat_info.client_custom_linked_refference_full_content || '';
  obj.client_custom_linked_image = chat_info.client_custom_linked_image || '';
  obj.client_custom_linked_download_files = chat_info.client_custom_linked_download_files || '';
  obj.client_custom_linked_refference_full_content = chat_info.client_custom_linked_refference_full_content; // 完整引用地址

  return obj;
});

/**
 * 停止答案的生成
 */
const handleStopChat = () => {
  emit('stop');
};

const handleRetryChat = () => {
  emit('retry');
};

const handleSelectChat = () => {
  emit('select');
};
</script>

<style lang="css" scoped>
.dialog-item-container {
  margin-top: 10px;
  margin-bottom: 10px;
}
</style>