From a66606af5961151d9cabf9cbebd1475777d8904b Mon Sep 17 00:00:00 2001
From: wangdan-fit2cloud <dan.wang@fit2cloud.com>
Date: Fri, 23 Feb 2024 18:28:21 +0800
Subject: [PATCH] =?UTF-8?q?feat:=20=E5=85=B3=E4=BA=8E?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 .../components/top-bar/avatar/AboutDialog.vue |  24 ++-
 ui/src/styles/element-plus.scss               |   9 +-
 ui/src/views/application/CreateAndSetting.vue | 157 +++++++++---------
 3 files changed, 104 insertions(+), 86 deletions(-)

diff --git a/ui/src/layout/components/top-bar/avatar/AboutDialog.vue b/ui/src/layout/components/top-bar/avatar/AboutDialog.vue
index 18571bcfc..97a901c74 100644
--- a/ui/src/layout/components/top-bar/avatar/AboutDialog.vue
+++ b/ui/src/layout/components/top-bar/avatar/AboutDialog.vue
@@ -39,28 +39,38 @@ defineExpose({ open })
 </script>
 <style lang="scss" scope>
 .about-dialog {
+  padding: 0;
   border-radius: 4px;
+  width: 600px;
   .el-dialog__header {
     background: var(--app-header-bg-color);
     margin-right: 0;
-    height: 45px;
+    height: 140px;
     border-radius: 4px 4px 0 0;
+    box-sizing: border-box;
+  }
+  .el-dialog__title {
+    line-height: 140px;
   }
   .about-title {
-    font-size: 24px;
+    font-size: 40px;
   }
   .logo {
     background-image: url('@/assets/logo.png');
     background-size: 100% 100%;
-    width: 35px;
-    height: 35px;
+    width: 59px;
+    height: 59px;
   }
   .about-ui {
-    width: 200px;
+    padding: 24px;
+    width: 360px;
     margin: 0 auto;
     line-height: 30px;
-    span {
-      width: 80px;
+    font-weight: 400;
+    .label {
+      width: 180px;
+      text-align: left;
+      color: var(--app-text-color-secondary);
     }
   }
 }
diff --git a/ui/src/styles/element-plus.scss b/ui/src/styles/element-plus.scss
index cafdbff7a..49a5a9873 100644
--- a/ui/src/styles/element-plus.scss
+++ b/ui/src/styles/element-plus.scss
@@ -5,6 +5,7 @@
   --el-box-shadow-light: 0px 2px 4px 0px rgba(31, 35, 41, 0.12);
   --el-border-color: #dee0e3;
   --el-text-color-regular: #1f2329;
+  --el-color-info: #8F959E
 }
 
 .el-button {
@@ -50,11 +51,16 @@
 .el-form-item__label {
   font-weight: 400;
 }
+
 .el-form-item__error {
   position: unset;
   font-size: 14px;
 }
 
+.el-form--label-top .el-form-item .el-form-item__label {
+  padding-right: 0;
+}
+
 .el-dialog {
   --el-dialog-title-font-size: 16px;
   --el-dialog-padding-primary: 24px;
@@ -183,9 +189,6 @@
 
 .el-text {
   font-weight: 400;
-  &.el-text--info {
-    color: var(--app-text-color-secondary);
-  }
 }
 
 .el-switch {
diff --git a/ui/src/views/application/CreateAndSetting.vue b/ui/src/views/application/CreateAndSetting.vue
index ee00b8956..d1acfe29f 100644
--- a/ui/src/views/application/CreateAndSetting.vue
+++ b/ui/src/views/application/CreateAndSetting.vue
@@ -102,95 +102,100 @@
                 <template #label>
                   <div class="flex-between">
                     <span>关联知识库</span>
+                    <div>
+                      <el-popover :visible="popoverVisible" :width="300" trigger="click">
+                        <template #reference>
+                          <el-button type="primary" link @click="datasetSettingChange('open')"
+                            ><el-icon class="mr-4"><Operation /></el-icon>参数设置</el-button
+                          >
+                        </template>
+                        <div class="dataset_setting">
+                          <div class="form-item mb-16 p-8">
+                            <div class="title flex align-center mb-8">
+                              <span style="margin-right: 4px">相似度</span>
+                              <el-tooltip
+                                effect="dark"
+                                content="相似度越高相关性越强。"
+                                placement="right"
+                              >
+                                <el-icon style="font-size: 16px">
+                                  <Warning />
+                                </el-icon>
+                              </el-tooltip>
+                            </div>
+                            <div @click.stop>
+                              高于
+                              <el-input-number
+                                v-model="dataset_setting.similarity"
+                                :min="0"
+                                :max="1"
+                                :precision="3"
+                                :step="0.1"
+                                controls-position="right"
+                                style="width: 100px"
+                                size="small"
+                              />
+                            </div>
+                          </div>
+                          <div class="form-item mb-16 p-8">
+                            <div class="title mb-8">引用分段数</div>
+                            <div @click.stop>
+                              TOP
+                              <el-input-number
+                                v-model="dataset_setting.top_n"
+                                :min="1"
+                                :max="10"
+                                controls-position="right"
+                                style="width: 100px"
+                                size="small"
+                              />
+                              个分段
+                            </div>
+                          </div>
 
-                    <el-popover :visible="popoverVisible" :width="300" trigger="click">
-                      <template #reference>
-                        <el-button type="primary" link @click="datasetSettingChange('open')"
-                          >参数设置</el-button
-                        >
-                      </template>
-                      <div class="dataset_setting">
-                        <div class="form-item mb-16 p-8">
-                          <div class="title flex align-center mb-8">
-                            <span style="margin-right: 4px">相似度</span>
-                            <el-tooltip
-                              effect="dark"
-                              content="相似度越高相关性越强。"
-                              placement="right"
-                            >
-                              <el-icon style="font-size: 16px">
-                                <Warning />
-                              </el-icon>
-                            </el-tooltip>
-                          </div>
-                          <div @click.stop>
-                            高于
-                            <el-input-number
-                              v-model="dataset_setting.similarity"
-                              :min="0"
-                              :max="1"
-                              :precision="3"
-                              :step="0.1"
-                              controls-position="right"
-                              style="width: 100px"
-                              size="small"
-                            />
+                          <div class="form-item mb-16 p-8">
+                            <div class="title mb-8">最多引用字符数</div>
+                            <div class="flex align-center">
+                              <el-slider
+                                v-model="dataset_setting.max_paragraph_char_number"
+                                show-input
+                                :show-input-controls="false"
+                                :min="500"
+                                :max="10000"
+                                style="width: 200px"
+                                size="small"
+                                class="custom-slider"
+                              />
+                              <span class="ml-4">个字符</span>
+                            </div>
                           </div>
                         </div>
-                        <div class="form-item mb-16 p-8">
-                          <div class="title mb-8">引用分段数</div>
-                          <div @click.stop>
-                            TOP
-                            <el-input-number
-                              v-model="dataset_setting.top_n"
-                              :min="1"
-                              :max="10"
-                              controls-position="right"
-                              style="width: 100px"
-                              size="small"
-                            />
-                            个分段
-                          </div>
+                        <div class="text-right">
+                          <el-button size="small" @click="popoverVisible = false">取消</el-button>
+                          <el-button
+                            type="primary"
+                            @click="datasetSettingChange('close')"
+                            size="small"
+                            >确认</el-button
+                          >
                         </div>
-
-                        <div class="form-item mb-16 p-8">
-                          <div class="title mb-8">最多引用字符数</div>
-                          <div class="flex align-center">
-                            <el-slider
-                              v-model="dataset_setting.max_paragraph_char_number"
-                              show-input
-                              :show-input-controls="false"
-                              :min="500"
-                              :max="10000"
-                              style="width: 200px"
-                              size="small"
-                              class="custom-slider"
-                            />
-                            <span class="ml-4">个字符</span>
-                          </div>
-                        </div>
-                      </div>
-                      <div class="text-right">
-                        <el-button size="small" @click="popoverVisible = false">取消</el-button>
-                        <el-button
-                          type="primary"
-                          @click="datasetSettingChange('close')"
-                          size="small"
-                          >确认</el-button
-                        >
-                      </div>
-                    </el-popover>
+                      </el-popover>
+                      <el-button type="primary" link @click="openDatasetDialog"
+                        ><el-icon class="mr-4"><Plus /></el-icon>添加</el-button
+                      >
+                    </div>
                   </div>
                 </template>
                 <div class="w-full">
+                  <el-text type="info">关联的知识库展示在这里</el-text>
                   <el-row :gutter="12">
-                    <el-col :xs="24" :sm="24" :md="12" :lg="12" :xl="12" class="mb-8">
+                    <!-- <el-col :xs="24" :sm="24" :md="12" :lg="12" :xl="12" class="mb-8">
                       <CardAdd
                         title="关联知识库"
                         @click="openDatasetDialog"
                         style="min-height: 50px; font-size: 14px"
                       />
-                    </el-col>
+                    </el-col> -->
                     <el-col
                       :xs="24"
                       :sm="24"