From bf68ac2b8c5dcc8d7fcb3fea2df813a86a858aee Mon Sep 17 00:00:00 2001
From: wangdan-fit2cloud <dan.wang@fit2cloud.com>
Date: Wed, 22 Nov 2023 11:05:06 +0800
Subject: [PATCH] feat:

---
 ui/src/api/team.ts                            |  1 -
 ui/src/components/ai-dialog/index.vue         | 73 +++++++++++++------
 ui/src/components/back-button/index.vue       |  3 +-
 ui/src/components/card-box/index.vue          |  2 +-
 ui/src/components/common-list/index.vue       |  2 +-
 ui/src/components/tag-ellipsis/index.vue      |  6 +-
 ui/src/components/tags-input/index.vue        |  6 +-
 ui/src/request/index.ts                       |  2 +-
 ui/src/styles/app.scss                        | 48 +++++++++---
 ui/src/styles/element-plus.scss               |  6 +-
 ui/src/styles/variables.scss                  |  2 +-
 ui/src/utils/utils.ts                         | 11 ++-
 ui/src/views/dataset/component/BaseForm.vue   |  5 +-
 .../dataset/component/ParagraphPreview.vue    |  1 -
 .../dataset/component/UploadComponent.vue     |  4 +-
 ui/src/views/dataset/step/StepFirst.vue       |  9 ++-
 ui/src/views/document/index.vue               |  8 +-
 .../paragraph/component/ParagraphForm.vue     |  5 +-
 .../paragraph/component/ProblemComponent.vue  |  1 -
 19 files changed, 129 insertions(+), 66 deletions(-)

diff --git a/ui/src/api/team.ts b/ui/src/api/team.ts
index 03c6b18d7..9e6ef896b 100644
--- a/ui/src/api/team.ts
+++ b/ui/src/api/team.ts
@@ -1,7 +1,6 @@
 import { Result } from '@/request/Result'
 import { get, post, del, put } from '@/request/index'
 import type { TeamMember } from '@/api/type/team'
-// import type { Ref } from 'vue'
 
 const prefix = '/team/member'
 
diff --git a/ui/src/components/ai-dialog/index.vue b/ui/src/components/ai-dialog/index.vue
index 1b5016371..f1c38dff7 100644
--- a/ui/src/components/ai-dialog/index.vue
+++ b/ui/src/components/ai-dialog/index.vue
@@ -2,35 +2,35 @@
   <div class="ai-dialog p-24">
     <el-scrollbar>
       <div class="ai-dialog__content">
-        <div class="avatar">
-          <AppAvatar class="avatar-gradient">
-            <img src="@/assets/icon_robot.svg" style="width: 54%" alt="" />
-          </AppAvatar>
-          <!-- <AppAvatar>
+        <div class="item-content mb-16">
+          <div class="avatar">
+            <AppAvatar class="avatar-gradient">
+              <img src="@/assets/icon_robot.svg" style="width: 54%" alt="" />
+            </AppAvatar>
+            <!-- <AppAvatar>
             <img src="@/assets/user-icon.svg" style="width: 54%" alt="" />
           </AppAvatar> -->
-        </div>
+          </div>
 
-        <div class="content">
-          <el-card shadow="always" class="dialog-card">
-            <h4>您好，我是 MaxKB 智能小助手</h4>
-            <div class="mt-4">
-              <el-text type="info">回答用户提出的 MaxKB 产品使用问题</el-text>
-            </div>
-          </el-card>
-          <el-card shadow="always" class="dialog-card mt-12">
-            <h4 class="mb-8">您可以尝试输入以下问题：</h4>
-            <el-space wrap>
-              <el-button icon="EditPen" class="problem-button">
-                DataEase支持哪些类型的数据源？
-              </el-button>
-              <el-button icon="EditPen" class="problem-button">
+          <div class="content">
+            <el-card shadow="always" class="dialog-card">
+              <h4>您好，我是 MaxKB 智能小助手</h4>
+              <div class="mt-4">
+                <el-text type="info">回答用户提出的 MaxKB 产品使用问题</el-text>
+              </div>
+            </el-card>
+            <el-card shadow="always" class="dialog-card mt-12">
+              <h4 class="mb-8">您可以尝试输入以下问题：</h4>
+              <div class="problem-button cursor">
+                <el-icon><EditPen /></el-icon>
                 DataEase支持哪些类型的数据源？XXXXXXXXXXX
+              </div>
+              <el-button icon="EditPen" class="problem-button">
+                <div>DataEase支持哪些类型的数据源？XXXXXXXXXXX</div>
               </el-button>
-            </el-space>
-          </el-card>
+            </el-card>
 
-          <!-- <el-card shadow="always" class="dialog-card mt-12"> XXXXXXXXX </el-card>
+            <!-- <el-card shadow="always" class="dialog-card mt-12"> XXXXXXXXX </el-card>
           <el-card shadow="always" class="dialog-card mt-12"> XXXXXXXXX </el-card>
           <el-card shadow="always" class="dialog-card mt-12"> XXXXXXXXX </el-card>
           <el-card shadow="always" class="dialog-card mt-12"> XXXXXXXXX </el-card>
@@ -40,6 +40,29 @@
           <el-card shadow="always" class="dialog-card mt-12"> XXXXXXXXX </el-card>
           <el-card shadow="always" class="dialog-card mt-12"> XXXXXXXXX </el-card>
           <el-card shadow="always" class="dialog-card mt-12"> XXXXXXXXX </el-card> -->
+          </div>
+        </div>
+        <div class="item-content mb-16">
+          <div class="avatar">
+            <AppAvatar>
+              <img src="@/assets/user-icon.svg" style="width: 54%" alt="" />
+            </AppAvatar>
+          </div>
+          <div class="content">
+            <div class="text">
+              XXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXX
+            </div>
+          </div>
+        </div>
+        <div class="item-content mb-16">
+          <div class="avatar">
+            <AppAvatar class="avatar-gradient">
+              <img src="@/assets/icon_robot.svg" style="width: 54%" alt="" />
+            </AppAvatar>
+          </div>
+          <div class="content">
+            <el-card shadow="always" class="dialog-card"> XXXXXXXXX </el-card>
+          </div>
         </div>
       </div>
     </el-scrollbar>
@@ -89,6 +112,10 @@ const inputValue = ref('')
     .content {
       padding-left: var(--padding-left);
     }
+    .text {
+      word-break: break-all;
+      padding: 6px 0;
+    }
     .problem-button {
       width: 100%;
       border: none;
diff --git a/ui/src/components/back-button/index.vue b/ui/src/components/back-button/index.vue
index 9f52e8475..f5640ad67 100644
--- a/ui/src/components/back-button/index.vue
+++ b/ui/src/components/back-button/index.vue
@@ -12,7 +12,8 @@ const props = defineProps({
   to: String
 })
 
-const back: any = router.options.history.state.back // 上一层路由
+/* 上一层路由 */
+const back: any = router.options.history.state.back
 function jump() {
   if (props.to === '-1') {
     back ? router.push(back) : router.go(-1)
diff --git a/ui/src/components/card-box/index.vue b/ui/src/components/card-box/index.vue
index 995d4d94d..0663b2cae 100644
--- a/ui/src/components/card-box/index.vue
+++ b/ui/src/components/card-box/index.vue
@@ -6,7 +6,7 @@
           <AppAvatar class="mr-12" shape="square" :size="32" v-if="showIcon">
             <img src="@/assets/icon_document.svg" style="width: 58%" alt="" />
           </AppAvatar>
-          <h4 class="ellipsis">{{ title }}</h4>
+          <h4 class="ellipsis-1">{{ title }}</h4>
         </div>
       </slot>
     </div>
diff --git a/ui/src/components/common-list/index.vue b/ui/src/components/common-list/index.vue
index a214a027a..01c4f7412 100644
--- a/ui/src/components/common-list/index.vue
+++ b/ui/src/components/common-list/index.vue
@@ -36,7 +36,7 @@ function clickHandle(row: any, index: number) {
 }
 </script>
 <style lang="scss" scoped>
-// 通用 ui li样式
+/* 通用 ui li样式 */
 .common-list {
   li {
     padding: 11px 16px;
diff --git a/ui/src/components/tag-ellipsis/index.vue b/ui/src/components/tag-ellipsis/index.vue
index 09ec24de7..72cdedaee 100644
--- a/ui/src/components/tag-ellipsis/index.vue
+++ b/ui/src/components/tag-ellipsis/index.vue
@@ -22,16 +22,16 @@ const isShowTooltip = computed(() => {
   const containerWeight = tagLabel.value?.scrollWidth
   const contentWeight = tagLabel.value?.clientWidth
   if (containerWeight > contentWeight) {
-    // 实际宽度 > 可视宽度
+    /* 实际宽度 > 可视宽度 */
     return true
   } else {
-    // 否则为不溢出
+    /* 否则为不溢出 */
     return false
   }
 })
 </script>
 <style lang="scss" scoped>
-// tag超出省略号
+/* tag超出省略号 */
 .tag-ellipsis {
   border: 1px solid var(--el-border-color);
   color: var(--app-text-color);
diff --git a/ui/src/components/tags-input/index.vue b/ui/src/components/tags-input/index.vue
index 04928805f..dd719bca3 100644
--- a/ui/src/components/tags-input/index.vue
+++ b/ui/src/components/tags-input/index.vue
@@ -26,12 +26,12 @@ import { ref, watch } from 'vue'
 defineOptions({ name: 'TagsInput' })
 const props = defineProps({
   tags: {
-    // 多个
+    /* 多个 */
     type: Array<String>,
     default: () => []
   },
   tag: {
-    // 单个
+    /* 单个 */
     type: String,
     default: ''
   },
@@ -40,7 +40,7 @@ const props = defineProps({
     default: '请输入'
   },
   limit: {
-    // 最多生成标签数
+    /* 最多生成标签数 */
     type: Number,
     default: -1
   },
diff --git a/ui/src/request/index.ts b/ui/src/request/index.ts
index d195c3e85..540a4dfe7 100644
--- a/ui/src/request/index.ts
+++ b/ui/src/request/index.ts
@@ -17,7 +17,7 @@ const axiosConfig = {
 
 const instance = axios.create(axiosConfig)
 
-// 设置请求拦截器
+/* 设置请求拦截器 */
 instance.interceptors.request.use(
   (config: AxiosRequestConfig) => {
     if (config.headers === undefined) {
diff --git a/ui/src/styles/app.scss b/ui/src/styles/app.scss
index 3f4ce3c54..34909148e 100644
--- a/ui/src/styles/app.scss
+++ b/ui/src/styles/app.scss
@@ -52,18 +52,18 @@ ul {
   padding: 0;
 }
 
-// 滚动条整体部分
+/* 滚动条整体部分 */
 ::-webkit-scrollbar {
   width: 6px; // 纵向滚动条宽度
   height: 6px; // 横向滚动条高度
 }
 
-// 滑块
+/* 滑块 */
 ::-webkit-scrollbar-thumb {
   border-radius: 5px;
 }
 
-// 轨道
+/* 轨道 */
 ::-webkit-scrollbar-track {
   border-radius: 5px;
   background-color: transparent;
@@ -208,7 +208,11 @@ h4 {
   cursor: pointer;
 }
 
-.ellipsis {
+/*
+  超出省略号
+*/
+
+.ellipsis-1 {
   display: inline-block;
   max-width: 100px;
   text-overflow: ellipsis;
@@ -216,13 +220,27 @@ h4 {
   overflow: hidden;
 }
 
-// 内容部分 自适应高度
+/*
+  双行超出省略号，其他行数自定义 -webkit-line-clamp
+*/
+.ellipsis-2 {
+  display: -webkit-box;
+  -webkit-box-orient: vertical;
+  -webkit-line-clamp: 2;
+  overflow: hidden;
+}
+
+/*
+  内容部分 自适应高度
+*/
 .main-calc-height {
   height: var(--app-main-height);
   box-sizing: border-box;
 }
 
-// 标题前带竖线样式
+/*
+  标题前带竖线样式
+*/
 .title-decoration-1 {
   position: relative;
   padding-left: 12px;
@@ -248,24 +266,30 @@ h4 {
   font-weight: 900;
 }
 
-// tag
+/* tag */
 .default-tag {
   background: var(--tag-deflaut-bg);
   color: var(--tag-deflaut-color);
 }
 
-// card 无边框无阴影
+/*
+  card 无边框无阴影 灰色背景
+*/
 .card-never {
   background: var(--app-layout-bg-color);
   border: none;
 }
 
-// 图标旋转90度
+/*
+   图标旋转90度
+*/
 .rotate-90 {
   transform: rotateZ(90deg);
 }
 
-// 表格第一行插入自定义行
+/*
+  表格第一行插入自定义行
+*/
 .table-quick-append {
   background: #ffffff;
   .el-table__append-wrapper {
@@ -291,7 +315,9 @@ h4 {
   }
 }
 
-// 头像渐变背景
+/*
+  头像渐变背景
+*/
 .avatar-gradient {
   background: var(--app-avatar-gradient-color);
 }
diff --git a/ui/src/styles/element-plus.scss b/ui/src/styles/element-plus.scss
index 08aea7672..9f05a554f 100644
--- a/ui/src/styles/element-plus.scss
+++ b/ui/src/styles/element-plus.scss
@@ -129,7 +129,7 @@
   width: 100px;
 }
 
-// el-steps
+/* el-steps */
 .el-step__icon {
   background: none;
 }
@@ -172,10 +172,6 @@
 }
 
 .input-with-select {
-  .el-input__wrapper {
-    // border: 1px solid var(--el-border-color);
-    // box-shadow: none!important;
-  }
 
   .el-input-group__prepend {
     background-color: var(--el-fill-color-blank);
diff --git a/ui/src/styles/variables.scss b/ui/src/styles/variables.scss
index bcc2ab388..3fd8815a9 100644
--- a/ui/src/styles/variables.scss
+++ b/ui/src/styles/variables.scss
@@ -16,7 +16,7 @@
   --app-logo-color: linear-gradient(180deg, #3370ff 0%, #7f3bf5 100%);
   --app-avatar-gradient-color: linear-gradient(270deg, #9258f7 0%, #3370ff 100%);
 
-  // 计算高度
+  /* 计算高度 */
   --app-main-height: calc(100vh - var(--app-header-height) - var(--app-view-padding) * 2 - 40px);
 
   /** sidebar 组件 */
diff --git a/ui/src/utils/utils.ts b/ui/src/utils/utils.ts
index 792158798..ede5b148d 100644
--- a/ui/src/utils/utils.ts
+++ b/ui/src/utils/utils.ts
@@ -9,7 +9,8 @@ export function numberFormat(num: number) {
 
 export function filesize(size: number) {
   if (!size) return ''
-  const num = 1024.0 //byte
+  /* byte */
+  const num = 1024.0
 
   if (size < num) return size + 'B'
   if (size < Math.pow(num, 2)) return (size / num).toFixed(2) + 'K' //kb
@@ -18,13 +19,17 @@ export function filesize(size: number) {
   return (size / Math.pow(num, 4)).toFixed(2) + 'T' //T
 }
 
-// 获取文件后缀
+/*
+  获取文件后缀
+*/
 export function fileType(name: string) {
   const suffix = name.split('.')
   return suffix[suffix.length - 1]
 }
 
-// 获得文件对应图片
+/*
+  获得文件对应图片
+*/
 export function getImgUrl(name: string) {
   const type = fileType(name) || 'txt'
   return `/src/assets/${type}-icon.svg`
diff --git a/ui/src/views/dataset/component/BaseForm.vue b/ui/src/views/dataset/component/BaseForm.vue
index 91bbf94d0..34a3a1457 100644
--- a/ui/src/views/dataset/component/BaseForm.vue
+++ b/ui/src/views/dataset/component/BaseForm.vue
@@ -55,12 +55,13 @@ watch(
     }
   },
   {
-    // 初始化立即执行
     immediate: true
   }
 )
 
-// 表单校验
+/*
+  表单校验
+*/
 function validate() {
   if (!FormRef.value) return
   return FormRef.value.validate((valid: any) => {
diff --git a/ui/src/views/dataset/component/ParagraphPreview.vue b/ui/src/views/dataset/component/ParagraphPreview.vue
index 988358e33..457bbc031 100644
--- a/ui/src/views/dataset/component/ParagraphPreview.vue
+++ b/ui/src/views/dataset/component/ParagraphPreview.vue
@@ -73,7 +73,6 @@ watch(
     newData.value = value
   },
   {
-    // 初始化立即执行
     immediate: true
   }
 )
diff --git a/ui/src/views/dataset/component/UploadComponent.vue b/ui/src/views/dataset/component/UploadComponent.vue
index 9b2e844a4..fcdd2164f 100644
--- a/ui/src/views/dataset/component/UploadComponent.vue
+++ b/ui/src/views/dataset/component/UploadComponent.vue
@@ -80,7 +80,9 @@ function deleteFlie(index: number) {
   form.value.fileList.splice(index, 1)
 }
 
-// 表单校验
+/*
+  表单校验
+*/
 function validate() {
   if (!FormRef.value) return
   return FormRef.value.validate((valid: any) => {
diff --git a/ui/src/views/dataset/step/StepFirst.vue b/ui/src/views/dataset/step/StepFirst.vue
index 8ad011f1f..c995a48ad 100644
--- a/ui/src/views/dataset/step/StepFirst.vue
+++ b/ui/src/views/dataset/step/StepFirst.vue
@@ -25,11 +25,12 @@ const isCreate = type === 'create'
 const BaseFormRef = ref()
 const UploadComponentRef = ref()
 
-// submit
 const onSubmit = async () => {
   if (isCreate) {
     if ((await BaseFormRef.value?.validate()) && (await UploadComponentRef.value.validate())) {
-      // stores保存数据
+      /*
+        stores保存数据
+      */
       dataset.saveBaseInfo(BaseFormRef.value.form)
       dataset.saveDocumentsFile(UploadComponentRef.value.form.fileList)
       return true
@@ -38,7 +39,9 @@ const onSubmit = async () => {
     }
   } else {
     if (await UploadComponentRef.value.validate()) {
-      // stores保存数据
+      /*
+        stores保存数据
+      */
       dataset.saveDocumentsFile(UploadComponentRef.value.form.fileList)
       return true
     } else {
diff --git a/ui/src/views/document/index.vue b/ui/src/views/document/index.vue
index 7afa6ff13..4a6f8e1d1 100644
--- a/ui/src/views/document/index.vue
+++ b/ui/src/views/document/index.vue
@@ -127,7 +127,9 @@ function rowClickHandle(row: any) {
   router.push({ path: `/dataset/${datasetId}/${row.id}` })
 }
 
-// 快速创建空白文档
+/*
+  快速创建空白文档
+*/
 function creatQuickHandle(val: string) {
   loading.value = true
   const obj = { name: val }
@@ -166,7 +168,9 @@ function deleteDocument(row: any) {
     .catch(() => {})
 }
 
-// 更新名称或状态
+/*
+  更新名称或状态
+*/
 function updateData(documentId: string, data: any) {
   loading.value = true
   datasetApi
diff --git a/ui/src/views/paragraph/component/ParagraphForm.vue b/ui/src/views/paragraph/component/ParagraphForm.vue
index 6b3b96fd5..4adfdc911 100644
--- a/ui/src/views/paragraph/component/ParagraphForm.vue
+++ b/ui/src/views/paragraph/component/ParagraphForm.vue
@@ -51,12 +51,13 @@ watch(
     }
   },
   {
-    // 初始化立即执行
     immediate: true
   }
 )
 
-// 表单校验
+/*
+  表单校验
+*/
 function validate() {
   if (!paragraphFormRef.value) return
   return paragraphFormRef.value.validate((valid: any) => {
diff --git a/ui/src/views/paragraph/component/ProblemComponent.vue b/ui/src/views/paragraph/component/ProblemComponent.vue
index 76ec50262..d14369e5f 100644
--- a/ui/src/views/paragraph/component/ProblemComponent.vue
+++ b/ui/src/views/paragraph/component/ProblemComponent.vue
@@ -60,7 +60,6 @@ watch(
     }
   },
   {
-    // 初始化立即执行
     immediate: true
   }
 )