feat: Detail组件重构完成

src/views/components-demo/avatars/index.vue

@@ -0,0 +1,84 @@
+<template>
+  <div>
+    <el-alert
+      effect="dark"
+      :closable="false"
+      title="头像组组件 -- 基础用法"
+      type="info"
+      style="margin-bottom: 20px"
+    />
+    <avatars :data="data" />
+
+    <el-alert
+      effect="dark"
+      :closable="false"
+      title="头像组组件 -- 不显示tooltip"
+      type="info"
+      style="margin-top: 20px; margin-bottom: 20px"
+    />
+    <avatars :data="data" :tooltip="false" />
+
+    <el-alert
+      effect="dark"
+      :closable="false"
+      title="头像组组件 -- 最多展示5"
+      type="info"
+      style="margin-top: 20px; margin-bottom: 20px"
+    />
+    <avatars :data="data" :max="5" />
+
+    <el-alert
+      effect="dark"
+      :closable="false"
+      title="头像组组件 -- 展示头像"
+      type="info"
+      style="margin-top: 20px; margin-bottom: 20px"
+    />
+    <avatars show-avatar :data="data1" />
+  </div>
+</template>
+
+<script setup lang="ts" name="AvatarsDemo">
+import { ref } from 'vue'
+import { AvatarConfig } from '_c/Avatars/types'
+import Avatars from '_c/Avatars/index.vue'
+
+const data = ref<AvatarConfig[]>([
+  { text: '陈某某' },
+  { text: '李某某', type: 'success' },
+  { text: '张某某', type: 'danger' },
+  { text: '王某某', type: 'warning' },
+  { text: '龙某某' },
+  { text: '孙某某' },
+  { text: '刘某某' },
+  { text: '赵某某' }
+])
+const data1 = ref<AvatarConfig[]>([
+  {
+    text: '陈某某',
+    url: 'https://dss0.bdstatic.com/70cFuHSh_Q1YnxGkpoWK1HF6hhy/it/u=2863969516,2611770076&fm=26&gp=0.jpg'
+  },
+  {
+    text: '李某某',
+    url: 'https://dss3.bdstatic.com/70cFv8Sh_Q1YnxGkpoWK1HF6hhy/it/u=465970198,3877503753&fm=26&gp=0.jpg'
+  },
+  {
+    text: '张某某',
+    url: 'https://dss0.bdstatic.com/70cFvHSh_Q1YnxGkpoWK1HF6hhy/it/u=1857202600,3614139084&fm=26&gp=0.jpg'
+  },
+  {
+    text: '王某某',
+    url: 'https://dss1.bdstatic.com/70cFuXSh_Q1YnxGkpoWK1HF6hhy/it/u=1444080181,4150129244&fm=26&gp=0.jpg'
+  },
+  {
+    text: '龙某某',
+    url: 'https://dss0.bdstatic.com/70cFuHSh_Q1YnxGkpoWK1HF6hhy/it/u=2469786567,2163872639&fm=26&gp=0.jpg'
+  },
+  {
+    text: '孙某某',
+    url: 'https://ss1.bdstatic.com/70cFvXSh_Q1YnxGkpoWK1HF6hhy/it/u=4119236579,869456058&fm=26&gp=0.jpg'
+  },
+  { text: '刘某某', url: 'xxxxx' },
+  { text: '赵某某' }
+])
+</script>