From 0decd81e471e8147baea69a85e528768d9adc9df Mon Sep 17 00:00:00 2001
From: tianxin <tianxin930618@163.com>
Date: Thu, 19 Oct 2023 01:24:18 -0700
Subject: [PATCH] =?UTF-8?q?fix(empty-data):=E5=AF=B9=E6=90=9C=E7=B4=A2?=
 =?UTF-8?q?=E8=BE=93=E5=85=A5=E7=A9=BA=E6=95=B0=E6=8D=AE=E8=BF=9B=E8=A1=8C?=
 =?UTF-8?q?=E7=BB=9F=E4=B8=80=E6=A0=B7=E5=BC=8F=E5=8F=98=E6=9B=B4?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 packages/common/component/PluginBlockList.vue     |  5 +++++
 packages/plugins/bridge/src/BridgeManage.vue      | 10 ++++++++--
 packages/plugins/data/src/DataSourceList.vue      |  5 ++++-
 packages/plugins/data/src/Main.vue                |  9 ++++++++-
 packages/plugins/materials/src/block/Main.vue     |  2 +-
 packages/plugins/materials/src/component/Main.vue |  7 +++++--
 6 files changed, 31 insertions(+), 7 deletions(-)

diff --git a/packages/common/component/PluginBlockList.vue b/packages/common/component/PluginBlockList.vue
index 753ad3b7e3..9b3852cb95 100644
--- a/packages/common/component/PluginBlockList.vue
+++ b/packages/common/component/PluginBlockList.vue
@@ -1,5 +1,6 @@
 <template>
   <ul
+    v-if="state.data.length"
     :class="[
       'block-list',
       'lowcode-scrollbar',
@@ -129,6 +130,10 @@
       </div>
     </div>
   </ul>
+  <div v-else class="empty-wrap">
+    <svg-icon class="empty-icon" name="empty"></svg-icon>
+    <p class="empty-text">暂无数据</p>
+  </div>
 </template>
 
 <script>
diff --git a/packages/plugins/bridge/src/BridgeManage.vue b/packages/plugins/bridge/src/BridgeManage.vue
index 8fec03404a..17aeef1b9e 100644
--- a/packages/plugins/bridge/src/BridgeManage.vue
+++ b/packages/plugins/bridge/src/BridgeManage.vue
@@ -6,7 +6,11 @@
         clearable
         placeholder="请输入关键字搜索"
         @update:modelValue="searchBridgeData"
-      ></tiny-search>
+      >
+        <template #prefix>
+          <tiny-icon-search />
+        </template>
+      </tiny-search>
     </div>
     <div class="list">
       <div
@@ -30,6 +34,7 @@
 <script>
 import { watchEffect, ref, reactive } from 'vue'
 import { Search } from '@opentiny/vue'
+import { iconSearch } from '@opentiny/vue-icon'
 import {
   RESOURCE_TYPE,
   ACTION_TYPE,
@@ -44,7 +49,8 @@ import {
 
 export default {
   components: {
-    TinySearch: Search
+    TinySearch: Search,
+    TinyIconSearch: iconSearch()
   },
   props: {
     name: {
diff --git a/packages/plugins/data/src/DataSourceList.vue b/packages/plugins/data/src/DataSourceList.vue
index abd9eab12d..642b74b47e 100644
--- a/packages/plugins/data/src/DataSourceList.vue
+++ b/packages/plugins/data/src/DataSourceList.vue
@@ -15,7 +15,10 @@
         </div>
       </li>
     </ul>
-    <div v-if="!filteredKey.length" class="data-source-list-blank"><span>查询结果为空</span></div>
+    <div v-if="!filteredKey.length" class="empty-wrap">
+      <svg-icon class="empty-icon" name="empty"></svg-icon>
+      <p class="empty-text">暂无数据</p>
+    </div>
   </div>
 </template>
 
diff --git a/packages/plugins/data/src/Main.vue b/packages/plugins/data/src/Main.vue
index f9cd7acbf9..d9592c9166 100644
--- a/packages/plugins/data/src/Main.vue
+++ b/packages/plugins/data/src/Main.vue
@@ -14,8 +14,13 @@
         :modelValue="query"
         class="left-filter"
         placeholder="请输入搜索条件"
+        clearable
         @update:modelValue="search"
-      ></tiny-search>
+      >
+        <template #prefix>
+          <tiny-icon-search />
+        </template>
+      </tiny-search>
       <div class="add-btn">
         <tiny-button @click="openPanel(OPTION_TYPE.ADD)">{{
           activeName === STATE.CURRENT_STATE ? '添加变量' : '添加全局变量'
@@ -63,6 +68,7 @@
 <script>
 import { reactive, ref, computed, onActivated } from 'vue'
 import { Button, Search, Tabs, TabItem } from '@opentiny/vue'
+import { iconSearch } from '@opentiny/vue-icon'
 import {
   useCanvas,
   useHistory,
@@ -85,6 +91,7 @@ export default {
   components: {
     TinySearch: Search,
     TinyButton: Button,
+    TinyIconSearch: iconSearch(),
     DataSourceList,
     CreateVariable,
     CloseIcon,
diff --git a/packages/plugins/materials/src/block/Main.vue b/packages/plugins/materials/src/block/Main.vue
index 0075b8fcc8..60c76e8f29 100644
--- a/packages/plugins/materials/src/block/Main.vue
+++ b/packages/plugins/materials/src/block/Main.vue
@@ -1,7 +1,7 @@
 <template>
   <div class="blocks-wrap">
     <block-group v-model="state.groups" @changeGroup="changeGroup"></block-group>
-    <tiny-search v-model="state.searchValue" placeholder="请输入关键字搜索">
+    <tiny-search v-model="state.searchValue" clearable placeholder="请输入关键字搜索">
       <template #prefix> <tiny-icon-search /> </template>
     </tiny-search>
     <block-list v-model:blockList="filterBlocks" :show-add-button="false" :show-block-shot="true"></block-list>
diff --git a/packages/plugins/materials/src/component/Main.vue b/packages/plugins/materials/src/component/Main.vue
index 5a53125ac3..489d93b5ab 100644
--- a/packages/plugins/materials/src/component/Main.vue
+++ b/packages/plugins/materials/src/component/Main.vue
@@ -1,6 +1,6 @@
 <template>
   <div class="components-wrap">
-    <tiny-search v-model="state.searchValue" placeholder="请输入关键字搜索" @update:modelValue="change">
+    <tiny-search v-model="state.searchValue" placeholder="请输入关键字搜索" clearable @update:modelValue="change">
       <template #prefix> <icon-search /> </template>
     </tiny-search>
     <tiny-collapse v-model="state.activeName" class="lowcode-scrollbar">
@@ -24,6 +24,10 @@
           </template>
         </ul>
       </tiny-collapse-item>
+      <div v-if="!state.components.length" class="empty-wrap">
+        <svg-icon class="empty-icon" name="empty"></svg-icon>
+        <p class="empty-text">暂无数据</p>
+      </div>
     </tiny-collapse>
   </div>
 </template>
@@ -178,7 +182,6 @@ export default {
   }
 
   :deep(.tiny-svg, #tiny-engine .tiny-svg) {
-    transform: rotate(270deg);
     &.is-active {
       transform: rotate(180deg);
     }