perf: 优化弹出层

ui/src/components/ai-chat/ParagraphSourceDialog.vue

@@ -6,6 +6,8 @@
     destroy-on-close
     append-to-body
     align-center
+    :close-on-click-modal="false"
+    :close-on-press-escape="false"
   >
     <div class="mb-8">
       <el-scrollbar>

ui/src/layout/components/top-bar/avatar/APIKeyDialog.vue

@@ -1,5 +1,11 @@
 <template>
-  <el-dialog :title="$t('layout.topbar.avatar.apiKey')" v-model="dialogVisible" width="800">
+  <el-dialog
+    :title="$t('layout.topbar.avatar.apiKey')"
+    v-model="dialogVisible"
+    width="800"
+    :close-on-click-modal="false"
+    :close-on-press-escape="false"
+  >
     <el-card shadow="never" class="layout-bg mb-16">
       <el-text type="info" class="color-secondary">{{
         $t('layout.topbar.avatar.apiServiceAddress')

ui/src/layout/components/top-bar/avatar/ResetPassword.vue

@@ -1,5 +1,10 @@
 <template>
-  <el-dialog v-model="resetPasswordDialog" :title="$t('layout.topbar.avatar.resetPassword')">
+  <el-dialog
+    v-model="resetPasswordDialog"
+    :title="$t('layout.topbar.avatar.resetPassword')"
+    :close-on-click-modal="false"
+    :close-on-press-escape="false"
+  >
     <el-form
       class="reset-password-form mb-24"
       ref="resetPasswordFormRef"

ui/src/layout/components/top-bar/avatar/SettingAPIKeyDialog.vue

@@ -1,25 +1,33 @@
 <template>
-  <el-dialog :title="$t('views.applicationOverview.appInfo.SettingAPIKeyDialog.dialogTitle')" v-model="dialogVisible">
+  <el-dialog
+    :title="$t('views.applicationOverview.appInfo.SettingAPIKeyDialog.dialogTitle')"
+    v-model="dialogVisible"
+    :close-on-click-modal="false"
+    :close-on-press-escape="false"
+  >
     <el-form label-position="top" ref="settingFormRef" :model="form">
-      <el-form-item :label="$t('views.applicationOverview.appInfo.SettingAPIKeyDialog.allowCrossDomainLabel')"
+      <el-form-item
-                    @click.prevent>
+        :label="$t('views.applicationOverview.appInfo.SettingAPIKeyDialog.allowCrossDomainLabel')"
+        @click.prevent
+      >
         <el-switch size="small" v-model="form.allow_cross_domain"></el-switch>
       </el-form-item>
       <el-form-item>
         <el-input
-            v-model="form.cross_domain_list"
+          v-model="form.cross_domain_list"
-            :placeholder="$t('views.applicationOverview.appInfo.SettingAPIKeyDialog.crossDomainPlaceholder')"
+          :placeholder="
-            :rows="10"
+            $t('views.applicationOverview.appInfo.SettingAPIKeyDialog.crossDomainPlaceholder')
-            type="textarea"
+          "
+          :rows="10"
+          type="textarea"
         />
       </el-form-item>
     </el-form>
     <template #footer>
       <span class="dialog-footer">
-        <el-button
+        <el-button @click.prevent="dialogVisible = false">{{
-            @click.prevent="dialogVisible = false">{{
+          $t('views.applicationOverview.appInfo.SettingAPIKeyDialog.cancelButtonText')
-            $t('views.applicationOverview.appInfo.SettingAPIKeyDialog.cancelButtonText')
+        }}</el-button>
-          }}</el-button>
         <el-button type="primary" @click="submit(settingFormRef)" :loading="loading">
           {{ $t('views.applicationOverview.appInfo.SettingAPIKeyDialog.saveButtonText') }}
         </el-button>
@@ -28,16 +36,16 @@
   </el-dialog>
 </template>
 <script setup lang="ts">
-import {ref, watch} from 'vue'
+import { ref, watch } from 'vue'
-import {useRoute} from 'vue-router'
+import { useRoute } from 'vue-router'
-import type {FormInstance} from 'element-plus'
+import type { FormInstance } from 'element-plus'
 import overviewApi from '@/api/system-api-key'
-import {MsgSuccess} from '@/utils/message'
+import { MsgSuccess } from '@/utils/message'
-import {t} from '@/locales'
+import { t } from '@/locales'
 
 const route = useRoute()
 const {
-  params: {id}
+  params: { id }
 } = route
 
 const emit = defineEmits(['refresh'])
@@ -66,8 +74,8 @@ const open = (data: any) => {
   APIKeyId.value = data.id
   form.value.allow_cross_domain = data.allow_cross_domain
   form.value.cross_domain_list = data.cross_domain_list?.length
-      ? data.cross_domain_list?.join('\n')
+    ? data.cross_domain_list?.join('\n')
-      : ''
+    : ''
   dialogVisible.value = true
 }
 
@@ -78,10 +86,10 @@ const submit = async (formEl: FormInstance | undefined) => {
       const obj = {
         allow_cross_domain: form.value.allow_cross_domain,
         cross_domain_list: form.value.cross_domain_list
-            ? form.value.cross_domain_list.split('\n').filter(function (item: string) {
+          ? form.value.cross_domain_list.split('\n').filter(function (item: string) {
               return item !== ''
             })
-            : []
+          : []
       }
       overviewApi.putAPIKey(APIKeyId.value, obj, loading).then((res) => {
         emit('refresh')
@@ -93,6 +101,6 @@ const submit = async (formEl: FormInstance | undefined) => {
   })
 }
 
-defineExpose({open})
+defineExpose({ open })
 </script>
 <style lang="scss" scope></style>

ui/src/views/application-overview/component/APIKeyDialog.vue

@@ -1,5 +1,11 @@
 <template>
-  <el-dialog title="API Key" v-model="dialogVisible" width="800">
+  <el-dialog
+    title="API Key"
+    v-model="dialogVisible"
+    width="800"
+    :close-on-click-modal="false"
+    :close-on-press-escape="false"
+  >
     <el-button type="primary" class="mb-16" @click="createApiKey">
       {{ $t('views.applicationOverview.appInfo.APIKeyDialog.creatApiKey') }}
     </el-button>

ui/src/views/application-overview/component/DisplaySettingDialog.vue

@@ -1,5 +1,10 @@
 <template>
-  <el-dialog title="显示设置" v-model="dialogVisible">
+  <el-dialog
+    title="显示设置"
+    v-model="dialogVisible"
+    :close-on-click-modal="false"
+    :close-on-press-escape="false"
+  >
     <el-form label-position="top" ref="displayFormRef" :model="form">
       <el-form-item>
         <el-space direction="vertical" alignment="start">

ui/src/views/application-overview/component/EditAvatarDialog.vue

@@ -2,6 +2,8 @@
   <el-dialog
     :title="$t('views.applicationOverview.appInfo.EditAvatarDialog.title')"
     v-model="dialogVisible"
+    :close-on-click-modal="false"
+    :close-on-press-escape="false"
   >
     <el-radio-group v-model="radioType" class="radio-block mb-16">
       <div>

ui/src/views/application-overview/component/EmbedDialog.vue

@@ -4,6 +4,8 @@
     v-model="dialogVisible"
     width="900"
     class="embed-dialog"
+    :close-on-click-modal="false"
+    :close-on-press-escape="false"
   >
     <el-row :gutter="12">
       <el-col :span="12">
@@ -71,9 +73,8 @@ const source1 = ref('')
 
 const source2 = ref('')
 
-const urlParams1 = computed(() => props.apiInputParams ? '?' + props.apiInputParams : '')
+const urlParams1 = computed(() => (props.apiInputParams ? '?' + props.apiInputParams : ''))
-const urlParams2 = computed(() => props.apiInputParams ? '&' + props.apiInputParams : '')
+const urlParams2 = computed(() => (props.apiInputParams ? '&' + props.apiInputParams : ''))
-
 
 watch(dialogVisible, (bool) => {
   if (!bool) {
@@ -103,7 +104,6 @@ src="${window.location.origin}/api/application/embed?protocol=${window.location.
   dialogVisible.value = true
 }
 
-
 defineExpose({ open })
 </script>
 <style lang="scss" scope>

ui/src/views/application-overview/component/LimitDialog.vue

@@ -2,6 +2,8 @@
   <el-dialog
     :title="$t('views.applicationOverview.appInfo.LimitDialog.dialogTitle')"
     v-model="dialogVisible"
+    :close-on-click-modal="false"
+    :close-on-press-escape="false"
   >
     <el-form label-position="top" ref="limitFormRef" :model="form">
       <!-- <el-form-item

ui/src/views/application-overview/component/SettingAPIKeyDialog.vue

@@ -1,13 +1,23 @@
 <template>
-  <el-dialog :title="$t('views.applicationOverview.appInfo.SettingAPIKeyDialog.dialogTitle')" v-model="dialogVisible">
+  <el-dialog
+    :title="$t('views.applicationOverview.appInfo.SettingAPIKeyDialog.dialogTitle')"
+    v-model="dialogVisible"
+    :close-on-click-modal="false"
+    :close-on-press-escape="false"
+  >
     <el-form label-position="top" ref="settingFormRef" :model="form">
-      <el-form-item :label="$t('views.applicationOverview.appInfo.SettingAPIKeyDialog.allowCrossDomainLabel')" @click.prevent>
+      <el-form-item
+        :label="$t('views.applicationOverview.appInfo.SettingAPIKeyDialog.allowCrossDomainLabel')"
+        @click.prevent
+      >
         <el-switch size="small" v-model="form.allow_cross_domain"></el-switch>
       </el-form-item>
       <el-form-item>
         <el-input
           v-model="form.cross_domain_list"
-          :placeholder="$t('views.applicationOverview.appInfo.SettingAPIKeyDialog.crossDomainPlaceholder')"
+          :placeholder="
+            $t('views.applicationOverview.appInfo.SettingAPIKeyDialog.crossDomainPlaceholder')
+          "
           :rows="10"
           type="textarea"
         />
@@ -15,9 +25,11 @@
     </el-form>
     <template #footer>
       <span class="dialog-footer">
-        <el-button @click.prevent="dialogVisible = false">{{$t('views.applicationOverview.appInfo.SettingAPIKeyDialog.cancelButtonText')}}</el-button>
+        <el-button @click.prevent="dialogVisible = false">{{
+          $t('views.applicationOverview.appInfo.SettingAPIKeyDialog.cancelButtonText')
+        }}</el-button>
         <el-button type="primary" @click="submit(settingFormRef)" :loading="loading">
-          {{$t('views.applicationOverview.appInfo.SettingAPIKeyDialog.saveButtonText')}}
+          {{ $t('views.applicationOverview.appInfo.SettingAPIKeyDialog.saveButtonText') }}
         </el-button>
       </span>
     </template>

ui/src/views/application/component/AIModeParamSettingDialog.vue

@@ -6,6 +6,8 @@
     v-model="dialogVisible"
     style="width: 550px"
     append-to-body
+    :close-on-click-modal="false"
+    :close-on-press-escape="false"
   >
     <DynamicsForm
       v-model="form_data"

ui/src/views/application/component/AddDatasetDialog.vue

@@ -6,6 +6,8 @@
     append-to-body
     class="addDataset-dialog"
     align-center
+    :close-on-click-modal="false"
+    :close-on-press-escape="false"
   >
     <template #header="{ titleId, titleClass }">
       <div class="flex-between mb-8">

ui/src/views/application/component/CopyApplicationDialog.vue

@@ -4,6 +4,8 @@
     v-model="dialogVisible"
     width="650"
     append-to-body
+    :close-on-click-modal="false"
+    :close-on-press-escape="false"
   >
     <el-form
       ref="applicationFormRef"

ui/src/views/application/component/CreateApplicationDialog.vue

@@ -4,6 +4,8 @@
     v-model="dialogVisible"
     width="650"
     append-to-body
+    :close-on-click-modal="false"
+    :close-on-press-escape="false"
   >
     <el-form
       ref="applicationFormRef"

ui/src/views/application/component/ParamSettingDialog.vue

@@ -6,6 +6,8 @@
     v-model="dialogVisible"
     style="width: 550px"
     append-to-body
+    :close-on-click-modal="false"
+    :close-on-press-escape="false"
   >
     <div class="dialog-max-height">
       <el-scrollbar always>

ui/src/views/dataset/component/CreateDatasetDialog.vue

@@ -1,5 +1,12 @@
 <template>
-  <el-dialog title="创建知识库" v-model="dialogVisible" width="680" append-to-body>
+  <el-dialog
+    title="创建知识库"
+    v-model="dialogVisible"
+    width="680"
+    append-to-body
+    :close-on-click-modal="false"
+    :close-on-press-escape="false"
+  >
     <!-- 基本信息 -->
     <BaseForm ref="BaseFormRef" v-if="dialogVisible" />
     <el-form

ui/src/views/dataset/component/EditParagraphDialog.vue

@@ -5,6 +5,8 @@
     width="80%"
     destroy-on-close
     class="paragraph-dialog"
+    :close-on-click-modal="false"
+    :close-on-press-escape="false"
   >
     <el-row v-if="isConnect">
       <el-col :span="18" class="p-24">

ui/src/views/document/component/SelectDatasetDialog.vue

@@ -1,5 +1,12 @@
 <template>
-  <el-dialog title="选择知识库" v-model="dialogVisible" width="600" class="select-dataset-dialog">
+  <el-dialog
+    title="选择知识库"
+    v-model="dialogVisible"
+    width="600"
+    class="select-dataset-dialog"
+    :close-on-click-modal="false"
+    :close-on-press-escape="false"
+  >
     <template #header="{ titleId, titleClass }">
       <div class="my-header flex">
         <h4 :id="titleId" :class="titleClass">选择知识库</h4>

ui/src/views/log/component/EditMarkDialog.vue

@@ -1,5 +1,12 @@
 <template>
-  <el-dialog title="修改标注" v-model="dialogVisible" width="600" class="edit-mark-dialog">
+  <el-dialog
+    title="修改标注"
+    v-model="dialogVisible"
+    width="600"
+    class="edit-mark-dialog"
+    :close-on-click-modal="false"
+    :close-on-press-escape="false"
+  >
     <template #header="{ titleId, titleClass }">
       <div class="flex-between">
         <h4 :id="titleId" :class="titleClass">修改标注</h4>

ui/src/views/paragraph/component/SelectDocumentDialog.vue

@@ -1,5 +1,11 @@
 <template>
-  <el-dialog title="选择知识库/文档" v-model="dialogVisible" width="500">
+  <el-dialog
+    title="选择知识库/文档"
+    v-model="dialogVisible"
+    width="500"
+    :close-on-click-modal="false"
+    :close-on-press-escape="false"
+  >
     <el-form
       ref="formRef"
       :model="form"

ui/src/views/problem/component/RelateProblemDialog.vue

@@ -5,6 +5,8 @@
     width="80%"
     class="paragraph-dialog"
     destroy-on-close
+    :close-on-click-modal="false"
+    :close-on-press-escape="false"
   >
     <el-row v-loading="loading">
       <el-col :span="6">

ui/src/views/user-manage/component/UserDialog.vue

@@ -7,6 +7,8 @@
       label-position="top"
       require-asterisk-position="right"
       @submit.prevent
+      :close-on-click-modal="false"
+      :close-on-press-escape="false"
     >
       <el-form-item :prop="isEdit ? '' : 'username'" label="用户名">
         <el-input

ui/src/views/user-manage/component/UserPwdDialog.vue

@@ -7,6 +7,8 @@
       label-position="top"
       require-asterisk-position="right"
       @submit.prevent
+      :close-on-click-modal="false"
+      :close-on-press-escape="false"
     >
       <el-form-item label="新密码" prop="password">
         <el-input

ui/src/workflow/nodes/reranker-node/ParamSettingDialog.vue

@@ -6,6 +6,8 @@
     v-model="dialogVisible"
     style="width: 550px"
     append-to-body
+    :close-on-click-modal="false"
+    :close-on-press-escape="false"
   >
     <div>
       <el-scrollbar always>