fix(Embedded Management): The welcome message is limited to 50 characters. After embedding, the characters on the left and right sides of the assistant are not fully displayed.

Author: dataeaseShu

frontend/src/views/chat/index.vue

@@ -1182,6 +1182,9 @@ onMounted(() => {
         font-size: 24px;
         line-height: 32px;
         margin: 16px 0;
+        max-width: 100%;
+        word-break: break-all;
+        padding: 0 20px;
       }
 
       .i-can {
@@ -1192,6 +1195,9 @@ onMounted(() => {
         font-size: 14px;
         line-height: 24px;
         color: #646a73;
+        max-width: 100%;
+        word-break: break-all;
+        padding: 0 20px;
       }
     }
 

frontend/src/views/embedded/AssistantPreview.vue

@@ -33,7 +33,7 @@ const pageLogo = computed(() => {
         <LOGO></LOGO>
       </el-icon>
       <img v-else :src="pageLogo" class="logo" width="30px" height="30px" alt="" />
-      <span class="title">{{ name }}</span>
+      <span :title="name" class="title ellipsis">{{ name }}</span>
 
       <el-tooltip effect="dark" :content="$t('embedded.new_conversation')" placement="top">
         <el-icon class="new-chat" size="20">
@@ -115,10 +115,10 @@ const pageLogo = computed(() => {
       font-size: 16px;
       line-height: 24px;
       color: var(--ed-text-color-primary);
+      width: 200px;
     }
 
-    .ed-icon {
-      position: relative;
+    .ed-icon:not(.logo) {
       cursor: pointer;
 
       &::after {

frontend/src/views/embedded/index.vue

@@ -8,7 +8,11 @@
         <LOGO></LOGO>
       </el-icon>
       <img v-else :src="logo" class="logo" width="30px" height="30px" alt="" />
-      <span class="title">{{ appName || $t('embedded.intelligent_customer_service') }}</span>
+      <span
+        :title="appName || $t('embedded.intelligent_customer_service')"
+        class="title ellipsis"
+        >{{ appName || $t('embedded.intelligent_customer_service') }}</span
+      >
 
       <el-tooltip effect="dark" :content="$t('embedded.new_conversation')" placement="top">
         <el-icon class="new-chat" size="20" @click="createChat">
@@ -230,10 +234,10 @@ onBeforeUnmount(() => {
       font-size: 16px;
       line-height: 24px;
       color: var(--ed-text-color-primary);
+      max-width: calc(100% - 180px);
     }
 
-    .ed-icon {
-      position: relative;
+    .ed-icon:not(.logo) {
       cursor: pointer;
 
       &::after {

frontend/src/views/system/embedded/SetUi.vue

@@ -277,7 +277,7 @@ defineExpose({
             <el-upload
               name="logo"
               :show-file-list="false"
-              accept=".jpeg,.jpg,.png,.gif,.svg"
+              accept=".jpg,.png,.gif,.svg"
               :before-upload="(e: any) => beforeUpload(e, 'logo')"
               :http-request="uploadImg"
             >
@@ -293,7 +293,7 @@ defineExpose({
             <el-upload
               name="float_icon"
               :show-file-list="false"
-              accept=".jpeg,.jpg,.png,.gif,.svg"
+              accept=".jpg,.png,.gif,.svg"
               :before-upload="(e: any) => beforeUpload(e, 'float_icon')"
               :http-request="uploadImg"
             >
@@ -403,8 +403,11 @@ defineExpose({
 
     .left-preview {
       width: 460px;
-      pointer-events: none;
       height: 100%;
+
+      .content {
+        pointer-events: none;
+      }
     }
 
     .right-form {

frontend/src/views/system/embedded/iframe.vue

@@ -63,7 +63,7 @@ const currentEmbedded = reactive<any>(cloneDeep(defaultEmbedded))
 const isCreate = ref(false)
 const defaultForm = {
   oid: 1,
-  private_list: [] as any,
+  public_list: [] as any,
 }
 const dsForm = reactive(cloneDeep(defaultForm))
 
@@ -124,15 +124,15 @@ const handleAddEmbedded = (val: any) => {
   }
 }
 const wsChanged = (val: any) => {
-  dsForm.private_list = []
+  dsForm.public_list = []
   dsForm.oid = val
   getDsList(true)
 }
 const getDsList = (change: boolean = false) => {
   dsApi(dsForm.oid).then((res: any) => {
     dsListOptions.value = res || []
     if (change || !currentEmbedded.id) {
-      dsForm.private_list = dsListOptions.value.map((ele: any) => ele.id)
+      dsForm.public_list = dsListOptions.value.map((ele: any) => ele.id)
     }
   })
 }
@@ -185,11 +185,11 @@ const handleActive = (row: any) => {
 }
 
 const handlePrivate = (row: any) => {
-  dsForm.private_list.push(row.id)
+  dsForm.public_list = dsForm.public_list.filter((ele: any) => ele !== row.id)
 }
 
 const handlePublic = (row: any) => {
-  dsForm.private_list = dsForm.private_list.filter((ele: any) => ele !== row.id)
+  dsForm.public_list.push(row.id)
 }
 
 const searchLoading = ref(false)
@@ -822,7 +822,10 @@ const saveHandler = () => {
           </el-form-item>
         </el-form>
       </div>
-      <div v-if="activeStep === 1 && !advancedApplication" class="drawer-content">
+      <div
+        v-if="activeStep === 1 && !advancedApplication"
+        class="drawer-content drawer-content_scroll"
+      >
         <div class="title">
           {{ $t('embedded.set_data_source') }}
         </div>
@@ -864,21 +867,23 @@ const saveHandler = () => {
               </div>
             </template>
             <div class="card-ds_content">
-              <DsCard
-                v-for="(ele, index) in dsListOptions"
-                :id="ele.id"
-                :key="ele.id"
-                :class="[0, 1].includes(index) && 'no-margin_top'"
-                :name="ele.name"
-                :type="ele.type"
-                :type-name="ele.type_name"
-                :description="ele.description"
-                :is-private="dsForm.private_list.includes(ele.id)"
-                :num="ele.num"
-                @active="handleActive(ele)"
-                @private="handlePrivate(ele)"
-                @public="handlePublic(ele)"
-              ></DsCard>
+              <el-scrollbar>
+                <DsCard
+                  v-for="(ele, index) in dsListOptions"
+                  :id="ele.id"
+                  :key="ele.id"
+                  :class="[0, 1].includes(index) && 'no-margin_top'"
+                  :name="ele.name"
+                  :type="ele.type"
+                  :type-name="ele.type_name"
+                  :description="ele.description"
+                  :is-private="!dsForm.public_list.includes(ele.id)"
+                  :num="ele.num"
+                  @active="handleActive(ele)"
+                  @private="handlePrivate(ele)"
+                  @public="handlePublic(ele)"
+                ></DsCard>
+              </el-scrollbar>
             </div>
           </el-form-item>
         </el-form>
@@ -1194,6 +1199,10 @@ const saveHandler = () => {
     }
   }
 
+  .drawer-content_scroll {
+    overflow: hidden;
+  }
+
   .certificate-table_form {
     .ed-form-item__label:after {
       display: none;