From 8ca8e359d4693aefa7365517f791e42b90763e04 Mon Sep 17 00:00:00 2001
From: wangdan-fit2cloud <dan.wang@fit2cloud.com>
Date: Tue, 12 Dec 2023 14:13:22 +0800
Subject: [PATCH] feat:

---
 .../items/complex/ArrayObjectCard.vue         | 74 +++++++++----------
 .../items/complex/ObjectCard.vue              | 11 +--
 .../dynamics-form/items/complex/TabCard.vue   | 11 +--
 .../items/table/ProgressTableItem.vue         | 10 ++-
 .../items/table/TableCheckbox.vue             | 42 ++++++-----
 .../dynamics-form/items/table/TableRadio.vue  | 42 ++++++-----
 ui/src/styles/element-plus.scss               |  9 ++-
 ui/src/views/dataset/index.vue                |  1 +
 ui/src/views/dataset/step/ResultSuccess.vue   |  2 +-
 9 files changed, 98 insertions(+), 104 deletions(-)

diff --git a/ui/src/components/dynamics-form/items/complex/ArrayObjectCard.vue b/ui/src/components/dynamics-form/items/complex/ArrayObjectCard.vue
index dcbb610d3..d3709bcd6 100644
--- a/ui/src/components/dynamics-form/items/complex/ArrayObjectCard.vue
+++ b/ui/src/components/dynamics-form/items/complex/ArrayObjectCard.vue
@@ -1,5 +1,5 @@
 <template v-loading="_loading">
-  <div style="width: 100%; display: flex; flex-wrap: wrap">
+  <div class="arrt-object-card flex w-full">
     <el-card class="box-card" :style="style" v-for="(item, index) in _data" :key="index">
       <DynamicsForm
         :style="formStyle"
@@ -113,49 +113,45 @@ defineExpose({
 })
 </script>
 <style lang="scss" scoped>
-.box-card {
-  width: 30%;
-  position: relative;
-  margin: 10px;
-  padding-top: 20px;
-}
-.card-add {
-  display: inline-flex;
-  justify-content: center;
-  align-items: center;
-  font-size: 16px;
-  cursor: pointer;
-  min-height: var(--card-min-height);
-  border: 1px dashed var(--el-color-primary);
-  background: #eff0f1;
-  padding-bottom: 20px;
-
-  .add-icon {
-    font-size: 14px;
-    border-radius: 4px;
-    border: 1px solid var(--app-border-color-dark);
-    background: var(--app-layout-bg-color);
-    margin-right: 12px;
+.arrt-object-card {
+  .box-card {
+    width: 30%;
+    position: relative;
+    margin: 10px;
+    padding-top: 20px;
   }
-  &:hover {
-    color: var(--el-color-primary);
-    background: #ffffff;
+  .card-add {
+    display: inline-flex;
+    justify-content: center;
+    align-items: center;
+    font-size: 16px;
+    cursor: pointer;
+    min-height: var(--card-min-height);
+    border: 1px dashed var(--el-color-primary);
+    background: #eff0f1;
+    padding-bottom: 20px;
+
     .add-icon {
+      font-size: 14px;
+      border-radius: 4px;
+      border: 1px solid var(--app-border-color-dark);
+      background: var(--app-layout-bg-color);
+      margin-right: 12px;
+    }
+    &:hover {
+      color: var(--el-color-primary);
       background: #ffffff;
-      border-color: var(--el-color-primary);
+      .add-icon {
+        background: #ffffff;
+        border-color: var(--el-color-primary);
+      }
     }
   }
-}
-:deep(.el-form-item) {
-  &:last-child {
-    margin-bottom: 0px;
+  .delete-button {
+    position: absolute;
+    right: 12px;
+    top: 10px;
+    height: auto;
   }
-  margin-bottom: 18px;
-}
-.delete-button {
-  position: absolute;
-  right: 12px;
-  top: 10px;
-  height: auto;
 }
 </style>
diff --git a/ui/src/components/dynamics-form/items/complex/ObjectCard.vue b/ui/src/components/dynamics-form/items/complex/ObjectCard.vue
index 17b07a977..a007b00f8 100644
--- a/ui/src/components/dynamics-form/items/complex/ObjectCard.vue
+++ b/ui/src/components/dynamics-form/items/complex/ObjectCard.vue
@@ -1,5 +1,5 @@
 <template>
-  <el-card class="box-card" :style="style">
+  <el-card :style="style">
     <DynamicsForm
       :read-only="view"
       :style="formStyle"
@@ -72,11 +72,4 @@ defineExpose({
   validate
 })
 </script>
-<style lang="scss" scoped>
-:deep(.el-form-item) {
-  &:last-child {
-    margin-bottom: 0px;
-  }
-  margin-bottom: 18px;
-}
-</style>
+<style lang="scss" scoped></style>
diff --git a/ui/src/components/dynamics-form/items/complex/TabCard.vue b/ui/src/components/dynamics-form/items/complex/TabCard.vue
index fa7770509..c27ac7185 100644
--- a/ui/src/components/dynamics-form/items/complex/TabCard.vue
+++ b/ui/src/components/dynamics-form/items/complex/TabCard.vue
@@ -8,7 +8,7 @@
         :name="index"
       >
         <template v-if="formField.children">
-          <el-card class="box-card" :style="style">
+          <el-card :style="style">
             <DynamicsForm
               :style="formStyle"
               :view="view"
@@ -119,11 +119,4 @@ defineExpose({
   field: props.field
 })
 </script>
-<style lang="scss" scoped>
-:deep(.el-form-item) {
-  &:last-child {
-    margin-bottom: 0px;
-  }
-  margin-bottom: 18px;
-}
-</style>
+<style lang="scss" scoped></style>
diff --git a/ui/src/components/dynamics-form/items/table/ProgressTableItem.vue b/ui/src/components/dynamics-form/items/table/ProgressTableItem.vue
index 218007b71..41652cf50 100644
--- a/ui/src/components/dynamics-form/items/table/ProgressTableItem.vue
+++ b/ui/src/components/dynamics-form/items/table/ProgressTableItem.vue
@@ -1,5 +1,5 @@
 <template>
-  <div>
+  <div class="progress-table-item">
     <el-popover placement="top-start" :title="row[text_field]" :width="200" trigger="hover">
       <template #reference>
         <el-progress v-bind="$attrs" :percentage="row[value_field]"></el-progress
@@ -61,8 +61,10 @@ const view_card = computed(() => {
   line-height: 22px;
   height: 22px;
 }
-.value {
-  float: right;
-  @include valueScss;
+.progress-table-item {
+  .value {
+    float: right;
+    @include valueScss;
+  }
 }
 </style>
diff --git a/ui/src/components/dynamics-form/items/table/TableCheckbox.vue b/ui/src/components/dynamics-form/items/table/TableCheckbox.vue
index 8c26ae9dc..28c11c4a2 100644
--- a/ui/src/components/dynamics-form/items/table/TableCheckbox.vue
+++ b/ui/src/components/dynamics-form/items/table/TableCheckbox.vue
@@ -1,5 +1,5 @@
 <template>
-  <div>
+  <div class="table-checkbox">
     <div class="header">
       <div class="title">{{ title }}</div>
 
@@ -186,26 +186,28 @@ const activeText = computed(() => {
 })
 </script>
 <style lang="scss" scoped>
-.header {
-  display: flex;
-  justify-content: space-between;
-  margin-bottom: 16px;
-  .title {
-    color: #1f2329;
-    font-weight: 400;
-    font-size: 14px;
-    line-height: 22px;
+.table-checkbox {
+  .header {
+    display: flex;
+    justify-content: space-between;
+    margin-bottom: 16px;
+    .title {
+      color: #1f2329;
+      font-weight: 400;
+      font-size: 14px;
+      line-height: 22px;
+    }
+    .input-with-select {
+      width: 45%;
+    }
   }
-  .input-with-select {
-    width: 45%;
-  }
-}
-.msg {
-  margin-top: 12px;
-  color: rgba(100, 106, 115, 1);
-  .active {
-    margin-left: 3px;
-    color: var(--el-color-primary);
+  .msg {
+    margin-top: 12px;
+    color: rgba(100, 106, 115, 1);
+    .active {
+      margin-left: 3px;
+      color: var(--el-color-primary);
+    }
   }
 }
 </style>
diff --git a/ui/src/components/dynamics-form/items/table/TableRadio.vue b/ui/src/components/dynamics-form/items/table/TableRadio.vue
index 63d58cc87..3239deac6 100644
--- a/ui/src/components/dynamics-form/items/table/TableRadio.vue
+++ b/ui/src/components/dynamics-form/items/table/TableRadio.vue
@@ -1,5 +1,5 @@
 <template>
-  <div>
+  <div class="table-radio">
     <div class="header">
       <div class="title">{{ title }}</div>
 
@@ -174,26 +174,28 @@ const activeText = computed(() => {
 })
 </script>
 <style lang="scss" scoped>
-.header {
-  display: flex;
-  justify-content: space-between;
-  margin-bottom: 16px;
-  .title {
-    color: #1f2329;
-    font-weight: 400;
-    font-size: 14px;
-    line-height: 22px;
+.table-radio {
+  .header {
+    display: flex;
+    justify-content: space-between;
+    margin-bottom: 16px;
+    .title {
+      color: #1f2329;
+      font-weight: 400;
+      font-size: 14px;
+      line-height: 22px;
+    }
+    .input-with-select {
+      width: 45%;
+    }
   }
-  .input-with-select {
-    width: 45%;
-  }
-}
-.msg {
-  margin-top: 12px;
-  color: rgba(100, 106, 115, 1);
-  .active {
-    margin-left: 3px;
-    color: var(--el-color-primary);
+  .msg {
+    margin-top: 12px;
+    color: rgba(100, 106, 115, 1);
+    .active {
+      margin-left: 3px;
+      color: var(--el-color-primary);
+    }
   }
 }
 </style>
diff --git a/ui/src/styles/element-plus.scss b/ui/src/styles/element-plus.scss
index d34a4bd0b..ca5f60eb9 100644
--- a/ui/src/styles/element-plus.scss
+++ b/ui/src/styles/element-plus.scss
@@ -29,8 +29,13 @@
 }
 
 .el-form-item {
-  margin-bottom: 24px;
-
+  margin-bottom: 18px;
+  .el-form-item {
+    margin-bottom: 18px;
+    &:last-child {
+      margin-bottom: 0px;
+    }
+  }
 }
 
 .el-dialog {
diff --git a/ui/src/views/dataset/index.vue b/ui/src/views/dataset/index.vue
index ff631f7e1..3612f6d1a 100644
--- a/ui/src/views/dataset/index.vue
+++ b/ui/src/views/dataset/index.vue
@@ -116,6 +116,7 @@ function deleteDateset(row: any) {
           const index = datasetList.value.findIndex((v) => v.id === row.id)
           datasetList.value.splice(index, 1)
           MsgSuccess('删除成功')
+          loading.value = false
         })
         .catch(() => {
           loading.value = false
diff --git a/ui/src/views/dataset/step/ResultSuccess.vue b/ui/src/views/dataset/step/ResultSuccess.vue
index 3889e3b65..9d4e1501f 100644
--- a/ui/src/views/dataset/step/ResultSuccess.vue
+++ b/ui/src/views/dataset/step/ResultSuccess.vue
@@ -3,7 +3,7 @@
     <el-result icon="success" title="🎉 数据集创建成功 🎉">
       <template #sub-title>
         <div class="mt-8">
-          <span class="bold">{{ data?.documment_list.length || 0 }}</span>
+          <span class="bold">{{ data?.document_list.length || 0 }}</span>
           <el-text type="info" class="ml-4">文档</el-text>
           <el-divider direction="vertical" />
           <span class="bold">{{ paragraph_count || 0 }}</span>