diff --git a/core/core-frontend/src/custom-component/v-query/CustomSortFilter.vue b/core/core-frontend/src/custom-component/v-query/CustomSortFilter.vue
index 723ec31c66..9624b4cd74 100644
--- a/core/core-frontend/src/custom-component/v-query/CustomSortFilter.vue
+++ b/core/core-frontend/src/custom-component/v-query/CustomSortFilter.vue
@@ -7,7 +7,7 @@
     class="custom-sort_filter"
     width="300px"
   >
-    <div>
+    <div style="max-height: 400px; overflow-y: auto">
       <draggable :list="sortList" animation="300" class="drag-list">
         <template #item="{ element }">
           <span :key="element.name" class="item-dimension" :title="element">
diff --git a/core/core-frontend/src/custom-component/v-query/Select.vue b/core/core-frontend/src/custom-component/v-query/Select.vue
index 2cc0c9b969..097dbf4c30 100644
--- a/core/core-frontend/src/custom-component/v-query/Select.vue
+++ b/core/core-frontend/src/custom-component/v-query/Select.vue
@@ -291,9 +291,18 @@ const setOldMapValue = arr => {
 const customSort = () => {
   if (config.value.sortList?.length && config.value.sort === 'customSort') {
     options.value = [
-      ...options.value.sort(
-        (a, b) => config.value.sortList.indexOf(a.value) - config.value.sortList.indexOf(b.value)
-      )
+      ...options.value
+        .sort(a => {
+          if (config.value.sortList.indexOf(a.value) !== -1) {
+            return -1
+          }
+        })
+        .sort((a, b) => {
+          if (config.value.sortList.indexOf(a.value) === -1) {
+            return 0
+          }
+          return config.value.sortList.indexOf(a.value) - config.value.sortList.indexOf(b.value)
+        })
     ]
   }
 }
@@ -517,7 +526,7 @@ const setOptions = (num: number) => {
         handleFieldIdChange({
           queryId: field.id,
           displayId: displayId || field.id,
-          sort: sort === 'customSort' ? '' : sort,
+          sort: sort === 'customSort' ? 'asc' : sort,
           sortId,
           resultMode: config.value.resultMode || 0,
           searchText: searchText.value,
diff --git a/core/core-frontend/src/layout/components/ToolboxCfg.vue b/core/core-frontend/src/layout/components/ToolboxCfg.vue
index e31ca8dec5..633faac003 100644
--- a/core/core-frontend/src/layout/components/ToolboxCfg.vue
+++ b/core/core-frontend/src/layout/components/ToolboxCfg.vue
@@ -83,9 +83,8 @@ onMounted(() => {
 
 <style lang="less">
 .toolbox-top-popover {
-  height: 82px;
   min-width: 208px !important;
-  padding: 16px !important;
+  padding: 8px !important;
   display: flex;
   .doc-card {
     margin: auto;
diff --git a/core/core-frontend/src/layout/components/TopDoc.vue b/core/core-frontend/src/layout/components/TopDoc.vue
index 4d74351bac..9b304b1f69 100644
--- a/core/core-frontend/src/layout/components/TopDoc.vue
+++ b/core/core-frontend/src/layout/components/TopDoc.vue
@@ -29,17 +29,15 @@ const cardInfoList = [
     :show-arrow="false"
     popper-class="top-popover"
     placement="bottom-end"
-    width="208"
+    width="210"
     trigger="hover"
   >
-    <el-row>
-      <top-doc-card
-        :span="12"
-        v-for="(item, index) in cardInfoList"
-        :key="index"
-        :card-info="item"
-      ></top-doc-card>
-    </el-row>
+    <top-doc-card
+      :span="12"
+      v-for="(item, index) in cardInfoList"
+      :key="index"
+      :card-info="item"
+    ></top-doc-card>
     <template #reference>
       <div
         class="sys-setting"
@@ -75,6 +73,11 @@ const cardInfoList = [
 
 <style lang="less">
 .top-popover {
-  padding: 0 0 16px 0 !important;
+  display: flex;
+  padding: 8px !important;
+  flex-wrap: wrap;
+  .doc-card {
+    margin: auto;
+  }
 }
 </style>
diff --git a/core/core-frontend/src/layout/components/TopDocCard.vue b/core/core-frontend/src/layout/components/TopDocCard.vue
index 0e4797b747..41211ac028 100644
--- a/core/core-frontend/src/layout/components/TopDocCard.vue
+++ b/core/core-frontend/src/layout/components/TopDocCard.vue
@@ -27,33 +27,28 @@ const openBlank = () => {
 
 <template>
   <div class="doc-card" @click="openBlank">
-    <el-row class="base-show">
-      <Icon class-name="item-top-icon"
-        ><component class="svg-icon item-top-icon" :is="cardInfo.icon"></component
-      ></Icon>
-    </el-row>
-    <el-row class="base-show show-content"> {{ cardInfo.name }}</el-row>
+    <div class="base-show">
+      <Icon><component class="svg-icon item-top-icon" :is="cardInfo.icon"></component></Icon>
+    </div>
+    <div class="base-show show-content">{{ cardInfo.name }}</div>
   </div>
 </template>
 
 <style lang="less" scoped>
 .doc-card {
-  padding-top: 2px;
-  margin-top: 16px;
-  margin-left: 16px;
-  width: 80px;
-  height: 50px;
+  padding: 8px 0;
+  width: 96px;
+  height: 66px;
   cursor: pointer;
-  &:hover {
-    background-color: rgba(30, 39, 56, 0.05);
-  }
+  display: flex;
+  flex-direction: column;
+  align-items: center;
+  &:hover,
   &:active {
-    background-color: rgba(30, 39, 56, 0.1);
+    background-color: #1f23291a;
+    border-radius: 4px;
   }
 }
-.base-show {
-  justify-content: center;
-}
 
 .show-content {
   font-size: 14px;
diff --git a/core/core-frontend/src/views/visualized/data/datasource/index.vue b/core/core-frontend/src/views/visualized/data/datasource/index.vue
index 2a4935d5c2..f5300d5ff9 100644
--- a/core/core-frontend/src/views/visualized/data/datasource/index.vue
+++ b/core/core-frontend/src/views/visualized/data/datasource/index.vue
@@ -132,6 +132,7 @@ const createDataset = (tableName?: string) => {
     useEmitt().emitter.emit('changeCurrentComponent', 'DatasetEditor')
     return
   }
+  wsCache.set('ds-info-id', nodeInfo.id)
   router.push({
     path: '/dataset-form',
     query: {
@@ -989,7 +990,9 @@ const loadInit = () => {
 }
 
 onMounted(() => {
-  nodeInfo.id = (route.params.id as string) || (route.query.id as string) || ''
+  const dsId = wsCache.get('ds-info-id') || route.params.id
+  nodeInfo.id = (dsId as string) || (route.query.id as string) || ''
+  wsCache.delete('ds-info-id')
   loadInit()
   listDs()
   const { opt } = router.currentRoute.value.query