|
|
@@ -127,16 +127,16 @@ const CHAT_AGENT_INFOMATION = ref({
|
|
|
config: {}
|
|
|
});
|
|
|
|
|
|
-const header_height = 30;
|
|
|
-const footer_height = 30;
|
|
|
-const input_height = ref(100);
|
|
|
-
|
|
|
-const { width: chat_width, height: chat_height } = useEleSizeV1('chat_main');
|
|
|
-// const { width: input_area_width, height: input_area_height } = useEleSizeV2('dialog_input');
|
|
|
-
|
|
|
-const inputClearFn1 = useInputClear('dialog_input');
|
|
|
+/**
|
|
|
+ * input的一些操作方法
|
|
|
+ */
|
|
|
+const inputClearFn1 = useInputClear('dialog_input'); // 主表单清空
|
|
|
const inputClearFn2 = useInputClear('dialog_input_top'); // 顶部附加表单的数据
|
|
|
-const getInputTopOptions = useInputGetOptions('dialog_input_top'); // 获取表单的参数
|
|
|
+const getInputTopOptions = useInputGetOptions('dialog_input_top'); // 获取附加表单参数的方法
|
|
|
+
|
|
|
+/**
|
|
|
+ * 对话区域滚动到底部
|
|
|
+ */
|
|
|
const scroll2Bottom = useScroll2Bottom('list_scroller');
|
|
|
const scroll2ListBottom = () => {
|
|
|
nextTick(() => {
|
|
|
@@ -144,11 +144,17 @@ const scroll2ListBottom = () => {
|
|
|
});
|
|
|
};
|
|
|
|
|
|
-const input_style = computed(() => {
|
|
|
- return {
|
|
|
- // height: input_height + 'px'
|
|
|
- };
|
|
|
-});
|
|
|
+/**
|
|
|
+ * 整个对话区域的一些尺寸定义
|
|
|
+ */
|
|
|
+const header_height = 30;
|
|
|
+const footer_height = 30;
|
|
|
+const input_height = ref(100);
|
|
|
+
|
|
|
+/**
|
|
|
+ * 获取到对话区域的宽度和高度
|
|
|
+ */
|
|
|
+const { width: chat_width, height: chat_height } = useEleSizeV1('chat_main');
|
|
|
|
|
|
/**
|
|
|
* 对话列表区域的高度
|
|
|
@@ -157,6 +163,12 @@ const list_height = computed(() => {
|
|
|
return chat_height.value - header_height - footer_height - input_height.value - 20;
|
|
|
});
|
|
|
|
|
|
+const input_style = computed(() => {
|
|
|
+ return {
|
|
|
+ // height: input_height + 'px'
|
|
|
+ };
|
|
|
+});
|
|
|
+
|
|
|
// ------------------------------------------------------------------
|
|
|
// ------------------------------------------------------------------
|
|
|
// ------------------------------------------------------------------
|
|
|
@@ -167,22 +179,19 @@ const list_height = computed(() => {
|
|
|
const chat_log_list = ref([]); // 历史对话的数据列表
|
|
|
const chat_new_list = ref([]); // 新对话的数据列表
|
|
|
const chat_suggestion = ref([]); // 对话推荐项目
|
|
|
-/**
|
|
|
- * 此轮对话的状态
|
|
|
- * 0 未开始
|
|
|
- * 1 进行中
|
|
|
- * 2 已结束
|
|
|
- * 3 错误
|
|
|
- */
|
|
|
-const chat_new_status = ref(0);
|
|
|
+
|
|
|
/**
|
|
|
* 当前新对话的ID
|
|
|
* 当用户有输入后,点击提交,此时创建新对话,新对话的ID为此ID
|
|
|
* 之后用户可以一直使用此ID进行对话。
|
|
|
*/
|
|
|
const chat_new_id = ref(null);
|
|
|
+
|
|
|
/**
|
|
|
* 新对话,客户端的提问数据
|
|
|
+ * 用以临时保存客户端的提问数据
|
|
|
+ * 每当用户确认进行提问时,将新提问赋给此值
|
|
|
+ * 一旦对话消息通过websocket发送到服务器,此值可清空
|
|
|
*/
|
|
|
const chat_new_question = ref({});
|
|
|
|
|
|
@@ -197,6 +206,11 @@ const chat_display_list = computed(() => {
|
|
|
return [].concat(chat_log_list.value, chat_new_list.value);
|
|
|
});
|
|
|
|
|
|
+/**
|
|
|
+ * 是否禁用输入组件
|
|
|
+ */
|
|
|
+const input_disabled = ref(false);
|
|
|
+
|
|
|
/**
|
|
|
* 菜单ID编号
|
|
|
* 1 报表合并
|
|
|
@@ -214,17 +228,17 @@ const current_menu_id = computed(() => {
|
|
|
const menu_id = agent.menuId / 1;
|
|
|
return menu_id;
|
|
|
});
|
|
|
-/**
|
|
|
- * 当前对话的类型
|
|
|
- */
|
|
|
-const current_chat_type = computed(() => {
|
|
|
- // const agent = CHAT_AGENT_INFOMATION.value.agent;
|
|
|
- // const menu_id = agent.menuId / 1;
|
|
|
- const menu_id = current_menu_id.value;
|
|
|
- const chat_type = menu_id === 1 ? 'excel' : '';
|
|
|
-
|
|
|
- return chat_type;
|
|
|
-});
|
|
|
+// /**
|
|
|
+// * 当前对话的类型
|
|
|
+// * 目前已知类型有量类: excel 和 其他类
|
|
|
+// * 当类别为excel时,文件上传接口和对话websocket链接都不一样
|
|
|
+// */
|
|
|
+// const current_chat_type = computed(() => {
|
|
|
+// const menu_id = current_menu_id.value;
|
|
|
+// const chat_type = menu_id === 1 ? 'excel' : '';
|
|
|
+
|
|
|
+// return chat_type;
|
|
|
+// });
|
|
|
|
|
|
/**
|
|
|
* 是否显示欢迎页
|
|
|
@@ -253,7 +267,7 @@ const show_input_others_opts = computed(() => {
|
|
|
});
|
|
|
|
|
|
/**
|
|
|
- * 分享
|
|
|
+ * 内容分享操作
|
|
|
* @param chat_id
|
|
|
*/
|
|
|
const handleChatShare = (chat_id) => {};
|
|
|
@@ -272,17 +286,12 @@ const handleErrorMessage = (msg) => {
|
|
|
};
|
|
|
// ---------------------------------------------
|
|
|
|
|
|
-/**
|
|
|
- * 是否禁用输入组件
|
|
|
- */
|
|
|
-const input_disabled = ref(false);
|
|
|
-
|
|
|
/**
|
|
|
* 异常处理
|
|
|
* 异常处理过程是一个会话模拟的过程
|
|
|
* 先在界面上显示加载动画,然后紧接着显示错误提示
|
|
|
* 让用户感知到智能体有处理数据的过程
|
|
|
- * 所以在异常处理阶段,有一些需要处理的关键点,比如欢迎界面的显示
|
|
|
+ * 所以在异常处理阶段,有一些需要处理的关键点,比如欢迎界面的显示(如果在现实,则需要隐藏,否则对话显示不了)
|
|
|
* @param exceptionInfo
|
|
|
*/
|
|
|
const handleChatRequestionException = (exceptionInfo) => {
|
|
|
@@ -302,6 +311,7 @@ const handleChatRequestionException = (exceptionInfo) => {
|
|
|
|
|
|
/**
|
|
|
* 输入区域的尺寸发生了变化
|
|
|
+ * 整个对话区域的尺寸也需要依据此变化而变化
|
|
|
* @param size
|
|
|
*/
|
|
|
const handleInputSizeChange = (size) => {
|
|
|
@@ -346,7 +356,7 @@ const handleInputSubmit = async (options) => {
|
|
|
* 整理客户端提问的数据
|
|
|
* 组装Question数据
|
|
|
*/
|
|
|
- const client_question = formatDialogQuestionByClient(ask_text, ask_files, CHAT_AGENT_INFOMATION.value);
|
|
|
+ const client_question = formatDialogQuestionByClient(ask_text, ask_files);
|
|
|
// 保存用户的提问信息
|
|
|
// 当消息正式发出后,将提问数据放入列表中
|
|
|
chat_new_question.value = client_question;
|
|
|
@@ -421,8 +431,7 @@ const handleInputSubmit = async (options) => {
|
|
|
return;
|
|
|
}
|
|
|
} else {
|
|
|
- // 已创建chat
|
|
|
- // console.log(chat_new_id.value, '已创建');
|
|
|
+ // 已创建chat,使用已创建的会话ID,进入下一步流程
|
|
|
}
|
|
|
|
|
|
// 文件上传后的信息
|
|
|
@@ -432,28 +441,15 @@ const handleInputSubmit = async (options) => {
|
|
|
*/
|
|
|
if (ask_files.length !== 0) {
|
|
|
// 进行文件上传,获取文件信息
|
|
|
-
|
|
|
const chat_id = chat_new_id.value;
|
|
|
|
|
|
try {
|
|
|
- // const file_params = files2Formdata(ask_files);
|
|
|
- const uploadResult = await uploadFileByAgentInfo(agent_id, chat_id, ask_files, CHAT_AGENT_INFOMATION.value);
|
|
|
+ const menu_id = current_menu_id.value;
|
|
|
+ const uploadResult = await uploadFileByAgentInfo(agent_id, chat_id, ask_files, menu_id);
|
|
|
|
|
|
if (uploadResult.code / 1 === 200) {
|
|
|
// 文件上传成功
|
|
|
files_response = uploadResult.data;
|
|
|
-
|
|
|
- // // TODO: 统一文件上传数据
|
|
|
- // // 文档智能的文件上传文件信息在 files 里
|
|
|
- // if (file_uploaded.files) {
|
|
|
- // files_response = file_uploaded.files;
|
|
|
- // } else {
|
|
|
- // if (Array.isArray(file_uploaded)) {
|
|
|
- // files_response = file_uploaded;
|
|
|
- // } else {
|
|
|
- // files_response = [file_uploaded];
|
|
|
- // }
|
|
|
- // }
|
|
|
} else {
|
|
|
// 文件上传异常
|
|
|
handleChatRequestionException({
|
|
|
@@ -476,9 +472,10 @@ const handleInputSubmit = async (options) => {
|
|
|
/**
|
|
|
* 组装参数
|
|
|
* 组装socket参数: 文本和文件
|
|
|
- * 此方法会依据当前使用的agent,组装好传递给websocket的基础的文本和文件的参数
|
|
|
+ * 此方法会依据当前使用的agent,组装好传递给websocket的 基础的文本和文件的参数
|
|
|
*/
|
|
|
- const msg_obj = formatDialogSendOptions(ask_text, files_response, current_menu_id.value);
|
|
|
+ const menu_id = current_menu_id.value;
|
|
|
+ const msg_obj = formatDialogSendOptions(ask_text, files_response, menu_id);
|
|
|
|
|
|
/**
|
|
|
* 文本和文件的数据已经组装完成
|
|
|
@@ -488,7 +485,6 @@ const handleInputSubmit = async (options) => {
|
|
|
* 附加参数应该是一个键值对对象,最终和和已有的文本参数和文件参数合并成一个新的键值对对象发送给websocket
|
|
|
*/
|
|
|
// 获取附加表单的数据项目
|
|
|
- // 如果
|
|
|
if (other_options && typeof other_options === 'object') {
|
|
|
for (let key in other_options) {
|
|
|
msg_obj[key] = other_options[key];
|
|
|
@@ -545,15 +541,9 @@ function handleWSSend(chat_id, value) {
|
|
|
* 2. 发送消息
|
|
|
*/
|
|
|
|
|
|
- /**
|
|
|
- * 当对话类型为文档报告时,websocket连接地址不同
|
|
|
- */
|
|
|
- // const agent = CHAT_AGENT_INFOMATION.value.agent;
|
|
|
- // const menu_id = agent.menuId / 1;
|
|
|
- // const chat_type = menu_id === 1 ? 'excel' : '';
|
|
|
-
|
|
|
// 初始化websocket连接
|
|
|
- initWSConnection(props.agent_id, chat_id, current_chat_type.value);
|
|
|
+ const menu_id = current_menu_id.value;
|
|
|
+ initWSConnection(props.agent_id, chat_id, menu_id);
|
|
|
// 发送socket连接
|
|
|
sendWSMessage(value);
|
|
|
/**
|