ソースを参照

fix:修改动态表单弹出样式

hanyang 1 年間 前
コミット
8d1a6181ff

+ 5 - 1
src/modules/conversation-chat/DialogInputTop.vue

@@ -1,6 +1,6 @@
 <template>
   <div class="dialog-input-area-top-container">
-    <BtnConfigDynamic @confirm="handleChujuanConfirm" :user_input_form="user_input_form" />
+    <BtnConfigDynamic @confirm="handleChujuanConfirm" @init_model="initModel" :user_input_form="user_input_form" />
   </div>
 </template>
 
@@ -23,6 +23,7 @@ const props = defineProps({
    * */
   user_input_form: Array
 });
+const emit = defineEmits(['initModel']);
 
 const act_type = ref(1);
 // const upload_warning_text = `支持上传文件pdf、docx文档(最多${MAX_ACCEPT_FILE}个,每个大小不超过10MB)`;
@@ -60,6 +61,9 @@ const getOptions = () => {
   }
   return obj;
 };
+const initModel = (val) => {
+  emit('initModel', val);
+};
 
 defineExpose({
   /**

+ 30 - 19
src/modules/form-dynamic/BtnConfigDynamic.vue

@@ -9,8 +9,11 @@
     :closable="false"
     :hide-cancel="is_init_model"
     :hide-ok="is_init_model"
+    :mask="false"
+    ref="modelVal"
     modal-class="dynamicform-config-container-modal"
     body-class="dynamicform-config-container-body"
+    :body-style="bodyStyle"
   >
     <template #title> <img class="chujuan-logo-img" :src="logo" /> {{ $t('wendangchujuan.dynamic_title') }} </template>
 
@@ -38,42 +41,40 @@ const props = defineProps({
   user_input_form: Array
 });
 
-const emits = defineEmits(['confirm']);
+const emits = defineEmits(['confirm', 'init_model']);
 
 const confForm = ref(null);
 const visible = ref(false);
-// const ok_text = computed(() => {
-//   return is_init_model.value ? '开始对话' : '确认';
-// });
+const modelVal = ref(null);
 const is_init_model = ref(false); //是否是初始的配置
+
+const bodyStyle = ref({});
 const handleClick = () => {
   visible.value = true;
-  is_init_model.value = false;
+  is_init_model.vale = false;
+  emits('init_model', is_init_model.value);
+  if (modelVal.value) {
+    bodyStyle.value = {
+      'max-height': '40vh'
+    };
+  }
 };
-// const handleOk = () => {
-//   const target = confForm.value;
-//   if (target && typeof target.getValues === 'function') {
-//     const data = target.getValues();
-//     console.log('data', data);
-//     emits('confirm', data);
-//   }
 
-//   visible.value = false;
-// };
 const toCancel = () => {
   visible.value = false;
 };
 const submitForm = (data) => {
-  console.log(data, 111);
   emits('confirm', data);
   visible.value = false;
   is_init_model.value = false;
+  emits('init_model', is_init_model.value);
 };
 
 onMounted(() => {
   if (props.user_input_form.length) {
     visible.value = true;
     is_init_model.value = true;
+    emits('init_model', is_init_model.value);
   }
 });
 </script>
@@ -81,7 +82,8 @@ onMounted(() => {
 <style scoped>
 .chujuan-btn {
   border-radius: 30px;
-  color: #353535;
+  color: var(--color-text-2);
+  background-color: var(--color-bg-1);
 }
 .chujuan-logo-img {
   width: 22px;
@@ -92,11 +94,12 @@ onMounted(() => {
 
 <style>
 .dynamicform-config-container-modal.arco-modal {
-  width: 40%;
+  width: 100%;
+  box-shadow: 0px 4px 10px 0px rgba(0, 0, 0, 0.3);
 }
 .dynamicform-config-container-body.arco-modal-body {
   padding: 30px;
-  max-height: 70vh;
+  max-height: 60vh;
   overflow-y: auto;
 }
 .dynamicform-config-container-body.arco-modal-body .chujuan-iframe {
@@ -104,7 +107,7 @@ onMounted(() => {
   height: 80vh;
 }
 .dynamicform-config-container-modal.arco-modal .arco-modal-header {
-  background-color: #f3f3f3;
+  background-color: var(--color-fill-2);
 }
 .dynamicform-config-container-modal.arco-modal .arco-modal-header .arco-modal-title {
   justify-content: flex-start;
@@ -112,4 +115,12 @@ onMounted(() => {
 .dynamicform-config-container-modal.arco-modal .arco-modal-footer .arco-btn {
   display: none;
 }
+.arco-modal-container {
+  width: 40%;
+  margin: auto;
+}
+.arco-modal-wrapper.arco-modal-wrapper-align-center .arco-modal {
+  top: -5vh;
+}
+/* .arco-modal-wrapper; */
 </style>

+ 9 - 9
src/modules/form-dynamic/DynamicFormBasic.vue

@@ -89,16 +89,16 @@
             </template>
           </a-upload>
         </a-form-item>
-        <!-- 提交按钮 -->
-        <a-form-item>
-          <a-button class="btn_1" style="margin-right: 10px" type="primary" html-type="submit" v-if="is_init_model"
-            >开始对话</a-button
-          >
-          <a-button class="btn_1" style="margin-right: 10px" type="primary" html-type="submit" v-else>保存</a-button>
-
-          <a-button class="btn_1" html-type="submit" v-if="!is_init_model" @click="handleCancel">取消</a-button>
-        </a-form-item>
       </template>
+      <!-- 提交按钮 -->
+      <a-form-item>
+        <a-button class="btn_1" style="margin-right: 10px" type="primary" html-type="submit" v-if="is_init_model"
+          >开始对话</a-button
+        >
+        <a-button class="btn_1" style="margin-right: 10px" type="primary" html-type="submit" v-else>保存</a-button>
+
+        <a-button class="btn_1" html-type="submit" v-if="!is_init_model" @click="handleCancel">取消</a-button>
+      </a-form-item>
     </a-form>
   </div>
 </template>

+ 10 - 7
src/modules/intelligent/rgflow/AgentConfig.vue

@@ -498,15 +498,17 @@ const syncDialogInfoFun = async (dialogId) => {
 };
 const handleBeforeOk = async (done) => {
   formRef.value.validate().then((res) => {
-    // console.log('res:', res)
+    console.log('res:', res);
   });
   formRef1.value.validate().then((res) => {
-    // console.log('res:', res)
+    console.log('res:', res);
   });
   formRef2.value.validate().then((res) => {
-    // console.log('res:', res)
+    console.log('res:', res);
   });
+  console.log(form);
   if (form.name && form.kb_ids.length > 0 && form.prompt_config.system && form.llm_id) {
+    console.log(formNew, 'formNew');
     let title = t('management.create_success');
     let formNew = { ...form };
     if (formNew.rerank_id) {
@@ -518,7 +520,6 @@ const handleBeforeOk = async (done) => {
     }
 
     formNew.prompt_config.parameters = form.prompt_config.parameters.map((item) => {
-      console.log(item, 999);
       return {
         ...item,
         key: item.key,
@@ -537,8 +538,8 @@ const handleBeforeOk = async (done) => {
       //formNew.llm_setting.max_tokens = '';
       delete formNew.llm_setting.max_tokens;
     }
-    // formMew.vector_similarity_weight = 1 - Number(formMew.vector_similarity_weight);
-    // console.log(formNew, 'formNew');
+    formMew.vector_similarity_weight = 1 - Number(formMew.vector_similarity_weight);
+    console.log(formNew, 'formNew');
     setLoading(true);
     try {
       const res = await createRgFlow(formNew);
@@ -572,6 +573,7 @@ const handleBeforeOk = async (done) => {
       setLoading(false);
     }
   } else {
+    console.log(111111111111);
     Message.warning(t('management.empty_tip_request'));
     done(false);
   }
@@ -587,7 +589,8 @@ const editClick = (data) => {
       max_tokens.value = true;
     }
     Object.assign(form, props.formData);
-    // console.log(form, '表单数据');
+    form.vector_similarity_weight = 1 - form.vector_similarity_weight;
+    console.log(form, '表单数据');
   });
 };
 

+ 21 - 3
src/views/conversation/ConversationChatContainer.vue

@@ -4,7 +4,7 @@
       <div class="conversation-chat-main-left"></div>
       <div class="conversation-chat-main-content" :style="style_conversation_chat_content">
         <DialogHeader
-          v-if="!show_welcome"
+          v-if="!show_welcome && !is_init_model"
           class="conversation-chat-header"
           :agent_name="current_agent_name"
           :style="style_header"
@@ -54,6 +54,7 @@
           </div>
 
           <DialogInput
+            v-show="!is_init_model"
             ref="dialog_input"
             class="conversation-chat-input"
             :style="style_conversation_chat_list"
@@ -68,7 +69,11 @@
             @submit="handleInputSubmit"
           >
             <template v-if="show_input_others_opts" v-slot:top>
-              <DialogInputTop :user_input_form="conversation_params.user_input_form" ref="dialog_input_top" />
+              <DialogInputTop
+                :user_input_form="conversation_params.user_input_form"
+                @initModel="initModel"
+                ref="dialog_input_top"
+              />
             </template>
             <template v-slot:top>
               <DialogStopSse v-if="show_stop_sse" @stopResponse="stopResponse"></DialogStopSse>
@@ -81,7 +86,7 @@
           ></DialogCommonUsed>
         </div>
 
-        <DialogFooter class="conversation-chat-footer" :style="style_footer" />
+        <DialogFooter v-show="!is_init_model" class="conversation-chat-footer" :style="style_footer" />
       </div>
 
       <div class="conversation-chat-main-right" :style="style_conversation_chat_right">
@@ -906,11 +911,16 @@ const toShowWelcome = () => {
   is_show_right_page.value = false;
 };
 const toNewChat = () => {
+  if (is_init_model.value) {
+    pushInitAnswer();
+  }
+  is_init_model.value = false;
   chat_display_list.value = [];
   if (!show_welcome.value) {
     return;
   }
   show_welcome.value = false;
+
   pushInitAnswer();
 };
 
@@ -927,6 +937,14 @@ const pushInitAnswer = () => {
     client_custom_chat_message_id: '' //会话的message_id
   });
 };
+/**
+ * 智能体中区分是首次进去展示动态表单,还是点击按钮进去展示动态表单
+ * */
+const is_init_model = ref(false);
+const initModel = (val) => {
+  is_init_model.value = val;
+};
+
 const target_action_config = ref({});
 /**
  * 初始化sse相关方法