feat: 添加空状态组件，优化数据为空时的展示效果

src/ui/empty/index.vue

@@ -0,0 +1,25 @@
+<script lang='ts' setup>
+import empty from "@/assets/images/empty.png?url";
+
+withDefaults(defineProps<{
+  image?: string;
+  title?: string;
+}>(), {
+  image: empty,
+  title: "暂无数据",
+});
+</script>
+
+<template>
+  <div class="flex flex-col-center space-y-2 my-4">
+    <slot name="icon">
+      <img :src="empty" class="w-22 h-22 object-contain">
+    </slot>
+    <div class="text-sm text-text-400">
+      {{ title }}
+    </div>
+    <slot name="extra" />
+  </div>
+</template>
+
+<style lang='css' scoped></style>

src/ui/index.ts

@@ -36,5 +36,6 @@ declare module "vue" {
     UiTag: typeof import("./tag/index.vue")["default"];
     UiTextareaLabel: typeof import("./textarea-label/index.vue")["default"];
     UiBackButton: typeof import("./back-button/index.vue")["default"];
+    UiEmpty: typeof import("./empty/index.vue")["default"];
   }
 }