refactor: 优化代码

Author: wxg0103

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

@@ -4,6 +4,7 @@
     title="执行详情"
     v-model="dialogVisible"
     destroy-on-close
+    append-to-body
     align-center
     @click.stop
   >

ui/src/components/ai-chat/component/ParagraphCard.vue

@@ -17,7 +17,7 @@
     </template>
     <template #footer>
       <div class="footer-content flex-between">
-        <el-text class="flex align-center" style="width: 70%;">
+        <el-text class="flex align-center" style="width: 70%">
           <el-icon class="mr-4">
             <Document />
           </el-icon>

ui/src/views/authentication/component/EditModal.vue

@@ -1,6 +1,12 @@
 template
 <template>
-  <el-drawer v-model="visible" size="60%" :append-to-body="true" :destroy-on-close="true">
+  <el-drawer
+    v-model="visible"
+    size="60%"
+    :append-to-body="true"
+    :destroy-on-close="true"
+    @close="handleClose"
+  >
     <template #header>
       <div class="flex align-center" style="margin-left: -8px">
         <h4>{{ currentPlatform.name + '设置' }}</h4>
@@ -31,7 +37,7 @@ template
     </el-form>
     <template #footer>
       <span class="dialog-footer">
-        <el-button @click="visible = false">取 消</el-button>
+        <el-button @click="handleClose">取 消</el-button>
         <el-button @click="validateConnection">校 验</el-button>
         <el-button type="primary" @click="validateForm">保 存</el-button>
       </span>
@@ -115,7 +121,7 @@ const open = async (platform: Platform) => {
   switch (platform.key) {
     case 'wecom':
     case 'dingtalk':
-      if (currentPlatform.config.agent_id) {
+      if (currentPlatform.config.agent_id && currentPlatform.key === 'dingtalk') {
         currentPlatform.config.corp_id = currentPlatform.config.agent_id
         delete currentPlatform.config.agent_id
       }
@@ -141,6 +147,12 @@ const validateForm = () => {
   })
 }
 
+const handleClose = () => {
+  visible.value = false
+  formRef.value?.clearValidate()
+  emit('refresh')
+}
+
 function validateConnection() {
   platformApi.validateConnection(currentPlatform, loading).then((res: any) => {
     if (res.data) {

ui/src/views/authentication/component/SCAN.vue

@@ -130,8 +130,8 @@ function createPlatform(key: string, name: string): Platform {
   }
 
   const config = {
-    ...(key === 'dingtalk' ? { corp_id: '' } : {}),
     ...(key === 'wecom' ? { corp_id: '', agent_id: '' } : { app_key: '' }),
+    ...(key === 'dingtalk' ? { corp_id: '' } : {}),
     app_secret: '',
     callback_url: ''
   }

ui/src/views/chat/auth/component/password.vue

@@ -11,12 +11,13 @@
     top="25vh"
     center
     :modal="true"
+    @click.stop
   >
-    <el-form ref="FormRef" :model="form" @submit.prevent="validator">
+    <el-form ref="FormRef" :model="form" @submit.prevent="validator" @click.stop>
       <el-form-item prop="value" :rules="rules.value">
         <el-input show-password v-model="form.value" />
       </el-form-item>
-      <el-button class="w-full mt-8" type="primary" @click="validator" :loading="loading"
+      <el-button class="w-full mt-8" type="primary" @click.stop="validator" :loading="loading"
         >确定</el-button
       >
     </el-form>

ui/src/views/chat/auth/index.vue

@@ -1,5 +1,5 @@
 <template>
-  <div class="chat-pc__header">
+  <div class="chat-pc__header" :style="customStyle">
     <div class="flex align-center">
       <div class="mr-12 ml-24 flex">
         <AppAvatar
@@ -21,17 +21,18 @@
       <h4>{{ application_profile?.name }}</h4>
     </div>
   </div>
-  <div>
-    <component
-      :is="auth_components[`/src/views/chat/auth/component/${auth_type}.vue`].default"
-      v-model="is_auth"
-      :applicationProfile="application_profile"
-    />
-  </div>
+
+  <component
+    :is="auth_components[`/src/views/chat/auth/component/${auth_type}.vue`].default"
+    v-model="is_auth"
+    :applicationProfile="application_profile"
+  />
 </template>
 <script setup lang="ts">
 import { computed } from 'vue'
 import { isAppIcon } from '@/utils/application'
+import { hexToRgba } from '@/utils/theme'
+
 const auth_components: any = import.meta.glob('@/views/chat/auth/component/*.vue', {
   eager: true
 })
@@ -52,5 +53,13 @@ const is_auth = computed({
     emit('update:modelValue', v)
   }
 })
+
+const customStyle = computed(() => {
+  return {
+    background: props.application_profile?.custom_theme?.theme_color,
+    color: props.application_profile?.custom_theme?.header_font_color,
+    border: 'none'
+  }
+})
 </script>
 <style lang="scss"></style>

ui/src/views/chat/index.vue

@@ -12,13 +12,18 @@
     :application_profile="application_profile"
     :auth_type="application_profile.authentication_type"
     v-model="is_auth"
+    :style="{
+      '--el-color-primary': application_profile?.custom_theme?.theme_color,
+      '--el-color-primary-light-9': hexToRgba(application_profile?.custom_theme?.theme_color, 0.1)
+    }"
   ></Auth>
 </template>
 <script setup lang="ts">
 import { ref, onBeforeMount, computed } from 'vue'
 import { useRoute } from 'vue-router'
 import useStore from '@/stores'
 import Auth from '@/views/chat/auth/index.vue'
+import { hexToRgba } from '@/utils/theme'
 const route = useRoute()
 const { application, user } = useStore()