Browse Source

feat:动态表单调试

hanyang 1 năm trước cách đây
mục cha
commit
26567e5eb7

+ 1 - 0
public/i18n/lang-en.json

@@ -464,6 +464,7 @@
   },
   "wendangchujuan": {
     "agent_title": "Document paper",
+    "dynamic_title": "Custom",
 
     "dificulty": "Difficulty",
     "should_generate_paper": "Whether to generate a test paper",

+ 1 - 0
public/i18n/lang-zh.json

@@ -461,6 +461,7 @@
   },
   "wendangchujuan": {
     "agent_title": "文档出卷",
+    "dynamic_title": "自定义",
 
     "dificulty": "难度",
     "should_generate_paper": "是否生成试卷",

+ 2 - 2
src/modules/conversation-board/api-conversation-board.js

@@ -78,7 +78,7 @@ export const conversationBoardAgentListBackup = (params) => {
  * 正式环境需要使用的会话列表
  * @see https://app.apifox.com/link/project/5404857/apis/api-233232945
  */
-export const conversationBoardAgentListV1 = (params) => {
+export const conversationBoardAgentList = (params) => {
   const request_url = `/api/dialog/list`;
 
   const send_data = {
@@ -121,7 +121,7 @@ export const conversationBoardAgentListV1 = (params) => {
  * @param {object} params
  * @returns
  */
-export const conversationBoardAgentList = (params) => {
+export const conversationBoardAgentListV2 = (params) => {
   const request_url = `/api/user/menus`;
 
   const send_data = {};

+ 113 - 0
src/modules/conversation-chat/DialogInputTop copy.vue

@@ -0,0 +1,113 @@
+<template>
+  <div class="dialog-input-area-top-container">
+    <!-- 文档出卷 -->
+    <template v-if="menu_id === 7">
+      <!-- <BtnIframeChujuan /> -->
+
+      <BtnConfigChujuan @confirm="handleChujuanConfirm" />
+      <BtnConfigDynamic @confirm="handleChujuanConfirm" />
+    </template>
+
+    <template v-if="menu_id === 9">
+      <!-- 文档报告 -->
+      <a-space size="large">
+        <a-tooltip :content="radio_qingxi_text">
+          <a-radio :value="1" :model-value="act_type" @click="handleRadioClick(1)">文档清洗</a-radio>
+        </a-tooltip>
+
+        <a-tooltip :content="radio_shengcheng_text">
+          <a-radio :value="2" :model-value="act_type" @click="handleRadioClick(2)">报告生成</a-radio>
+        </a-tooltip>
+      </a-space>
+    </template>
+  </div>
+</template>
+
+<script setup>
+import { ref, onMounted, onUnmounted } from 'vue';
+
+import BtnIframeChujuan from '../btn-iframe-chujuan/BtnIframeChujuan.vue';
+import BtnConfigChujuan from '../btn-iframe-chujuan/BtnConfigChujuan.vue';
+import BtnConfigDynamic from '../form-dynamic/BtnConfigDynamic.vue';
+
+/**
+ * 此组件用以处理对话的附加参数
+ * 父组件通过ref调用此组件expose的两个方法
+ */
+
+const props = defineProps({
+  disabled: Boolean,
+  /**
+   * 菜单ID
+   * 不同的值,对应不同的智能体
+   */
+  menu_id: Number
+});
+
+const act_type = ref(1);
+// const upload_warning_text = `支持上传文件pdf、docx文档(最多${MAX_ACCEPT_FILE}个,每个大小不超过10MB)`;
+const radio_qingxi_text = '对上传的文档进行清洗,输出生成清洗后的文档';
+const radio_shengcheng_text = '对上传的(经过清洗的)文档生成报告,输出生成的报告文档';
+// const emit = defineEmits(['change']);
+
+const menuid7_config_datas = ref({});
+
+const handleRadioClick = (value) => {
+  act_type.value = value / 1;
+};
+
+/**
+ * 清空表单的内容
+ */
+const clear = () => {};
+
+/**
+ * 出卷的数据
+ */
+const handleChujuanConfirm = (data) => {
+  menuid7_config_datas.value = data;
+};
+
+/**
+ * 获取所有的数据
+ * 父组件应该使用 ref,调用此参数
+ */
+const getOptions = () => {
+  if (props.menu_id === 7) {
+    const obj = {};
+
+    const params = menuid7_config_datas.value;
+
+    for (let key in params) {
+      obj[key] = params[key];
+    }
+
+    return obj;
+  }
+
+  if (props.menu_id === 9) {
+    return {
+      workflow: act_type.value
+    };
+  }
+
+  return {};
+};
+
+defineExpose({
+  /**
+   * 清空表单里的内容
+   */
+  clear: clear,
+  /**
+   * 获取附件参数的键值对
+   */
+  getOptions: getOptions
+});
+</script>
+
+<style lang="css" scoped>
+.dialog-input-area-top-container {
+  margin-bottom: 10px;
+}
+</style>

+ 7 - 23
src/modules/conversation-chat/DialogInputTop.vue

@@ -1,33 +1,12 @@
 <template>
   <div class="dialog-input-area-top-container">
-    <!-- 文档出卷 -->
-    <template v-if="menu_id === 7">
-      <!-- <BtnIframeChujuan /> -->
-
-      <BtnConfigChujuan @confirm="handleChujuanConfirm" />
-      <BtnConfigDynamic @confirm="handleChujuanConfirm" />
-    </template>
-
-    <template v-if="menu_id === 9">
-      <!-- 文档报告 -->
-      <a-space size="large">
-        <a-tooltip :content="radio_qingxi_text">
-          <a-radio :value="1" :model-value="act_type" @click="handleRadioClick(1)">文档清洗</a-radio>
-        </a-tooltip>
-
-        <a-tooltip :content="radio_shengcheng_text">
-          <a-radio :value="2" :model-value="act_type" @click="handleRadioClick(2)">报告生成</a-radio>
-        </a-tooltip>
-      </a-space>
-    </template>
+    <BtnConfigDynamic @confirm="handleChujuanConfirm" :user_input_form="user_input_form" />
   </div>
 </template>
 
 <script setup>
 import { ref, onMounted, onUnmounted } from 'vue';
 
-import BtnIframeChujuan from '../btn-iframe-chujuan/BtnIframeChujuan.vue';
-import BtnConfigChujuan from '../btn-iframe-chujuan/BtnConfigChujuan.vue';
 import BtnConfigDynamic from '../form-dynamic/BtnConfigDynamic.vue';
 
 /**
@@ -41,7 +20,12 @@ const props = defineProps({
    * 菜单ID
    * 不同的值,对应不同的智能体
    */
-  menu_id: Number
+  menu_id: Number,
+  /**
+   * 对应的表单数据
+   *
+   * */
+  user_input_form: Array
 });
 
 const act_type = ref(1);

+ 30 - 0
src/modules/conversation-chat/api-conversation-chat-qa.js

@@ -0,0 +1,30 @@
+import ajax from '../../base/ajax';
+
+/**
+ * 对话-配置信息(动态表单)
+ * @see https://app.apifox.com/project/5404857/apis/api-233232945
+ * @param {String} agent_id
+ * @returns
+ * */
+export const conversationQAParameter = (agent_id) => {
+  const chatId = agent_id;
+  const request_url = `/api/v1/chat/${chatId}/parameters`;
+  return new Promise((resolve, reject) => {
+    ajax({
+      url: request_url,
+      method: 'get'
+    })
+      .then((res) => {
+        console.log('conversationQAParameter', res);
+        if (Object.keys(res).length) {
+          resolve({
+            code: 200,
+            data: res
+          });
+        } else {
+          resolve(res);
+        }
+      })
+      .catch(reject);
+  });
+};

+ 50 - 0
src/modules/conversation-chat/use-conversation-chat-parameters.js

@@ -0,0 +1,50 @@
+import { ref } from 'vue';
+
+import { conversationQAParameter } from './api-conversation-chat-qa';
+
+export default function useConversationChatParameters() {
+  // api请求的状态
+  const api_status = ref(1); // api状态 1 请求未启动 2 请求进心中 3 请求已成功 4 请求失败(网络成功,但是code不等于200) 5 请求出错
+  const api_message = ref(''); // 请求消息 与 api_status 对应的 message 消息内容
+
+  //动态表单数据
+  const conversation_params = ref({}); // 记录对话配置信息
+
+  /**
+   * 调用api请求
+   */
+  const handleApiRequest = (agent_id) => {
+    // 进入加载状态
+    api_status.value = 2;
+    api_message.value = '';
+    conversationQAParameter(agent_id)
+      .then((res) => {
+        if (res.code / 1 === 200) {
+          // 成功
+          const res_config = res.data; // 历史记录列表
+
+          conversation_params.value = res_config;
+          // api请求成功
+          api_status.value = 3;
+          api_message.value = 'success';
+        } else {
+          // api请求成功,但是业务失败
+          api_status.value = 4;
+          api_message.value = res.msg;
+        }
+      })
+      .catch((err) => {
+        console.log(err);
+        // api请求出错
+        api_status.value = 5;
+        api_message.value = err.message;
+      });
+  };
+
+  return {
+    getConversationParams: handleApiRequest,
+    api_status,
+    api_message,
+    conversation_params
+  };
+}

+ 74 - 0
src/modules/form-dynamic/BtnConfigDynamic copy.vue

@@ -0,0 +1,74 @@
+<template>
+  <a-button @click="handleClick" class="chujuan-btn">
+    <img class="chujuan-logo-img" :src="logo" /> {{ $t('wendangchujuan.agent_title') }}
+  </a-button>
+
+  <a-modal
+    v-model:visible="visible"
+    @ok="handleOk"
+    @cancel="handleCancel"
+    modal-class="dynamicform-config-container-modal"
+    body-class="dynamicform-config-container-body"
+  >
+    <template #title> <img class="chujuan-logo-img" :src="logo" /> {{ $t('wendangchujuan.agent_title') }} </template>
+
+    <DynamicFormWraper ref="confForm" />
+  </a-modal>
+</template>
+
+<script setup>
+import { ref } from 'vue';
+
+import logo from '../../assets/1.png';
+
+import DynamicFormWraper from '../form-dynamic/DynamicFormWraper.vue';
+
+const emits = defineEmits(['confirm']);
+
+const confForm = ref(null);
+const visible = ref(false);
+
+const handleClick = () => {
+  visible.value = true;
+};
+const handleOk = () => {
+  const target = confForm.value;
+  if (target && typeof target.getValues === 'function') {
+    const data = target.getValues();
+
+    emits('confirm', data);
+  }
+
+  visible.value = false;
+};
+const handleCancel = () => {
+  visible.value = false;
+};
+</script>
+
+<style scoped>
+.chujuan-btn {
+  border-radius: 30px;
+  color: #353535;
+}
+.chujuan-logo-img {
+  width: 22px;
+  display: inline-block;
+  margin-right: 5px;
+}
+</style>
+
+<style>
+.dynamicform-config-container-modal.arco-modal {
+  width: 50%;
+}
+.dynamicform-config-container-body.arco-modal-body {
+  padding: 30px;
+  max-height: 70vh;
+  overflow-y: auto;
+}
+.dynamicform-config-container-body.arco-modal-body .chujuan-iframe {
+  width: 100%;
+  height: 80vh;
+}
+</style>

+ 10 - 4
src/modules/form-dynamic/BtnConfigDynamic.vue

@@ -1,6 +1,6 @@
 <template>
   <a-button @click="handleClick" class="chujuan-btn">
-    <img class="chujuan-logo-img" :src="logo" /> {{ $t('wendangchujuan.agent_title') }}
+    <img class="chujuan-logo-img" :src="logo" /> {{ $t('wendangchujuan.dynamic_title') }}
   </a-button>
 
   <a-modal
@@ -10,9 +10,10 @@
     modal-class="dynamicform-config-container-modal"
     body-class="dynamicform-config-container-body"
   >
-    <template #title> <img class="chujuan-logo-img" :src="logo" /> {{ $t('wendangchujuan.agent_title') }} </template>
+    <template #title> <img class="chujuan-logo-img" :src="logo" /> {{ $t('wendangchujuan.dynamic_title') }} </template>
 
-    <DynamicFormWraper ref="confForm" />
+    <!-- <DynamicFormWraper ref="confForm" /> -->
+    <DynamicFormBasic ref="confForm" :form_params="user_input_form" />
   </a-modal>
 </template>
 
@@ -21,7 +22,12 @@ import { ref } from 'vue';
 
 import logo from '../../assets/1.png';
 
-import DynamicFormWraper from '../form-dynamic/DynamicFormWraper.vue';
+// import DynamicFormWraper from '../form-dynamic/DynamicFormWraper.vue';
+import DynamicFormBasic from './dynamicformbasic.vue';
+
+const props = defineProps({
+  user_input_form: Array
+});
 
 const emits = defineEmits(['confirm']);
 

+ 7 - 3
src/modules/form-dynamic/DynamicFormBasic.vue

@@ -125,14 +125,17 @@ const file_values = ref({});
  */
 const form_fields = computed(() => {
   const forms_conf = props.form_params;
-
+  console.log(forms_conf, 1111);
   const conf_list = [];
 
   const len = forms_conf.length;
 
   for (let i = 0; i < len; i++) {
-    const item = forms_conf[i];
-
+    // const item = forms_conf[i];
+    let item = {};
+    for (const key in forms_conf[i]) {
+      item = forms_conf[i][key];
+    }
     const itm_tp = item.type;
 
     // 默认值
@@ -173,6 +176,7 @@ const form_fields = computed(() => {
 
     conf_list.push(conf);
   }
+  console.log(conf_list, 999);
 
   return conf_list;
 });

+ 9 - 3
src/modules/intelligent/MessageBody.vue

@@ -11,7 +11,7 @@
     >
       <template #description> {{ item.desc }} </template>
       <template #settings>
-        <a-switch v-model="item.online" checked-color="#4569EA" @change="changeStatus(item)">
+        <a-switch v-model="item.online" @change="changeStatus(item)">
           <template #checked> {{ $t('management.online') }} </template>
           <template #unchecked> {{ $t('management.offline') }} </template>
         </a-switch>
@@ -245,9 +245,15 @@ const changeDropdownVisible = async (visible, id) => {
 const changeStatus = async (item) => {
   try {
     const res = await changeDialogStatus(item.id, item.status == '1' ? '0' : '1');
-    if (res.code != 200) {
+    if (res.code / 1 == 200) {
       moke_data.value.forEach((it) => {
-        if (item.id === id) {
+        if (item.id === it.id) {
+          it.status == '1' ? (it.status = 0) : (it.status = 1);
+        }
+      });
+    } else {
+      moke_data.value.forEach((it) => {
+        if (item.id === it.id) {
           it.online = item.online;
         }
       });

+ 1 - 0
src/modules/intelligent/TopSetting.vue

@@ -65,6 +65,7 @@
   ></ModelSelectIcon>
   <AgentConfig
     v-model:show_rg_config="show_rg_config"
+    v-if="show_rg_config"
     ref="editAgentKuai"
     :typeAngint="add_type"
     :formData="itemObj"

+ 8 - 0
src/views/ConversationQA.vue

@@ -9,6 +9,7 @@
           :CHAT_AGENT_INFOMATION="CHAT_AGENT_INFOMATION"
           :session_id="chat_session"
           :key="chat_agent"
+          :conversation_params="conversation_params"
         />
       </template>
 
@@ -40,6 +41,10 @@ import getChatAgentInfomation from '../modules/conversation-board/get-chat-agent
 
 import { getConfigField } from '../config/index';
 
+import useConversationChatParameters from '../modules/conversation-chat/use-conversation-chat-parameters';
+
+// 对话配置信息接口数据
+const { getConversationParams, api_status, api_message, conversation_params } = useConversationChatParameters();
 /**
  * 此页面为对话页面
  * 用户可能从如下几个地方进入对话页面:
@@ -172,6 +177,9 @@ function comfirmAgent(agent_id) {
   CHAT_AGENT_INFOMATION.value = getChatAgentInfomation(agent_id);
 
   chat_agent.value = agent_id;
+
+  // 根据agent_id 查询到动态表单数据
+  getConversationParams(chat_agent.value);
 }
 
 async function init() {

+ 73 - 40
src/views/conversation/ConversationChatContainer.vue

@@ -52,7 +52,12 @@
           @submit="handleInputSubmit"
         >
           <template v-if="show_input_others_opts" v-slot:top>
-            <DialogInputTop :menu_id="current_menu_id" :agent_info="CHAT_AGENT_INFOMATION" ref="dialog_input_top" />
+            <DialogInputTop
+              :menu_id="current_menu_id"
+              :agent_info="CHAT_AGENT_INFOMATION"
+              :user_input_form="conversation_params.user_input_form"
+              ref="dialog_input_top"
+            />
           </template>
 
           <template v-slot:left>
@@ -117,7 +122,12 @@ const props = defineProps({
    * 会话ID
    * 如果有此参数,则意味着获取该对话的记录内容
    */
-  session_id: String
+  session_id: String,
+  /**
+   * 动态表单数据
+   * 根据智能体的agent_id 获取到动态表单数据
+   * */
+  conversation_params: Object
 });
 
 const i18n = useI18n();
@@ -250,43 +260,61 @@ const show_welcome = ref(true);
 
 /**
  * 表单区域:是否显示附加参数表单
- * 文档报告场景下需要显示此组件
+ *
+ * 根据动态表单返回的数据中user_input_form中是否有数据来控制是否显示附加参数表单
  */
 const show_input_others_opts = computed(() => {
-  const menu_id = current_menu_id.value;
-
-  /**
-   * 7 文档出卷
-   * 9 文档报告
-   */
-  if (menu_id === 7 || menu_id === 9) {
+  if (
+    props.conversation_params &&
+    props.conversation_params.user_input_form &&
+    props.conversation_params.user_input_form.length
+  ) {
     return true;
   }
-
   return false;
+
+  // const menu_id = current_menu_id.value;
+
+  // /**
+  //  * 7 文档出卷
+  //  * 9 文档报告
+  //  */
+  // if (menu_id === 7 || menu_id === 9) {
+  //   return true;
+  // }
+
+  // return false;
 });
 
 /**
  * 是否支持文本输入
  * 返回 true,输入区域将不存在文本输入框
  * 返回 false,输入区域将可以进行文本输入
+ *
+ *通过conversation_params.retriever_resource.enabled来控制是否支持文本输入
  */
 const enable_text_input = computed(() => {
-  const menu_id = current_menu_id.value;
-
-  /**
-   * 1 报表合并:上传几个文档,进行合并  允许 .xlsx
-   * 无需输入
-   */
-  if (menu_id === 1) {
-    return false;
+  let enabled = false;
+  if (props.conversation_params && props.conversation_params.retriever_resource) {
+    enabled = props.conversation_params.retriever_resource.enabled;
+    console.log('enable_text_input', enabled);
   }
-
-  // if (menu_id === 7) {
+  return enabled;
+  // const menu_id = current_menu_id.value;
+
+  // /**
+  //  * 1 报表合并:上传几个文档,进行合并  允许 .xlsx
+  //  * 无需输入
+  //  */
+  // if (menu_id === 1) {
   //   return false;
   // }
 
-  return true;
+  // // if (menu_id === 7) {
+  // //   return false;
+  // // }
+
+  // return true;
 });
 
 /**
@@ -325,27 +353,32 @@ const default_text_value = computed(() => {
  * 表单区域:是否允许文件上传
  * 返回 ture,输入区域将会有文件上传按钮
  * 返回 false,输入区域将没有文件上传按钮
+ *
+ * 根据 conversation_params.file_upload.enabled来控制是否允许文件上传
  */
 const enable_file_upload = computed(() => {
-  const menu_id = current_menu_id.value;
-
-  /**
-   * 1 报表合并:上传几个文档,进行合并  允许 .xlsx
-   * 3 文档智能:上传文档,让智能体进行解析 允许: .pdf/.docx
-   * 5 智能数据:上传Excel,生成饼状图 允许 .xlsx
-   * 6 小数绘图:上传图片,描述图片的内容 允许 .png/jpg/jpeg
-   * 9 文档报告: 允许 .docx
-   */
-  if (menu_id === 1 || menu_id === 3 || menu_id === 5 || menu_id === 6 || menu_id === 9) {
-    return true;
-  }
-
-  // 文档出卷
-  if (menu_id === 7) {
-    return true;
+  let enabled = false;
+  if (props.conversation_params && props.conversation_params.file_upload) {
+    enabled = props.conversation_params.file_upload.enabled;
   }
-
-  return false;
+  return enabled;
+
+  // const menu_id = current_menu_id.value;
+  // /**
+  //  * 1 报表合并:上传几个文档,进行合并  允许 .xlsx
+  //  * 3 文档智能:上传文档,让智能体进行解析 允许: .pdf/.docx
+  //  * 5 智能数据:上传Excel,生成饼状图 允许 .xlsx
+  //  * 6 小数绘图:上传图片,描述图片的内容 允许 .png/jpg/jpeg
+  //  * 9 文档报告: 允许 .docx
+  //  */
+  // if (menu_id === 1 || menu_id === 3 || menu_id === 5 || menu_id === 6 || menu_id === 9) {
+  //   return true;
+  // }
+  // // 文档出卷
+  // if (menu_id === 7) {
+  //   return true;
+  // }
+  // return false;
 });
 
 /**