[新增] avatar 头像组件

docs/docs/zh-CN/components/avatar.md

@@ -0,0 +1,77 @@
+::: demo
+
+<template>
+  <lay-avatar :src="avatar"></lay-avatar>
+</template>
+
+<script>
+import { ref } from 'vue'
+
+export default {
+  setup() {
+
+    const avatar = "https://portrait.gitee.com/uploads/avatars/user/2813/8441097_shaynas_1610801433.png"
+
+    return {
+        avatar
+    }
+  }
+}
+</script>
+
+:::
+
+::: demo
+
+<template>
+  <lay-avatar :src="avatar" radius></lay-avatar>
+</template>
+
+<script>
+import { ref } from 'vue'
+
+export default {
+
+    setup() {
+
+        const avatar = "https://portrait.gitee.com/uploads/avatars/user/2813/8441097_shaynas_1610801433.png"
+        
+        return {
+            avatar
+        }
+  }
+}
+</script>
+
+:::
+
+::: demo
+
+<template>
+  <lay-avatar :src="avatar" size="xs"></lay-avatar> 
+  <lay-avatar :src="avatar" size="sm"></lay-avatar>
+  <lay-avatar :src="avatar"></lay-avatar>
+  <lay-avatar :src="avatar" size="lg"></lay-avatar>
+</template>
+
+<script>
+import { ref } from 'vue'
+
+export default {
+    setup() {
+
+        const avatar = "https://portrait.gitee.com/uploads/avatars/user/2813/8441097_shaynas_1610801433.png"
+
+        return {
+            avatar
+        }
+  }
+}
+</script>
+:::
+
+|  |  |  |
+|--|--|--|
+| src | 图源 | -- |
+| size | 尺寸 | `xs` `sm` `lg`|
+| radius | 圆形 | `true` `false`|

docs/src/layouts/Layout.vue

@@ -81,6 +81,7 @@ export default {
       { id: 20, title: '颜色',subTitle:"color" ,path: '/zh-CN/components/color' },
       { id: 21, title: '手风琴',subTitle:"collapse" ,path: '/zh-CN/components/collapse' },
       { id: 22, title: '表格',subTitle:"table" ,path: '/zh-CN/components/table' },
+      { id: 23, title: '头像',subTitle:"avatar" ,path: '/zh-CN/components/avatar' },
     ]
 
     const selected = ref(1)

docs/src/router/zh-CN.ts

@@ -116,6 +116,11 @@ const zhCN = [
         path: '/zh-CN/components/table',
         component: () => import('../../docs/zh-CN/components/table.md'),
         meta: { title: '表格' },
+      },
+      {
+        path: '/zh-CN/components/avatar',
+        component: () => import('../../docs/zh-CN/components/avatar.md'),
+        meta: { title: '头像' },
       }
     ],
   },

docs/src/styles/markdown.css

@@ -175,3 +175,7 @@ table th {
 table td {
   white-space: nowrap;
 }
+
+.source .layui-avatar {
+  margin-right: 30px;
+}