feat: 头像上传组件

stories/UploadAvatar.stories.ts

@@ -1,13 +1,49 @@
+/*
+ * @Author: zhaojinfeng 121016171@qq.com
+ * @Date: 2023-07-18 12:28:36
+ * @LastEditors: zhaojinfeng 121016171@qq.com
+ * @LastEditTime: 2023-07-20 17:13:00
+ * @FilePath: \vue3\stories\UploadAvatar.stories.ts
+ * @Description:
+ *
+ */
 import type { Meta, StoryObj } from '@storybook/vue3'
 import ThUploadAvatar from '../packages/upload-avatar/index.vue'
+import avatar from './assets/avatar.jpeg'
 
 const meta = {
   title: '表单组件/UploadAvatar',
   component: ThUploadAvatar,
   tags: ['autodocs'],
+  args: {
+    modelValue: '',
+    accpet: '.jpeg,.jpg,.png,.bmp',
+    disabled: false,
+    fileSize: 2,
+    autoCropHeight: 200,
+    autoCropWidth: 200,
+    uploadFunction() {
+      return Promise.resolve({
+        id: 0,
+        url: avatar,
+      })
+    },
+    onOnSuccess() {
+      ElMessage.success('模拟上传成功')
+    },
+  },
 } satisfies Meta<typeof ThUploadAvatar>
 export default meta
 
 type Story = StoryObj<typeof meta>
 
-export const Base: Story = {}
+export const Base: Story = {
+  storyName: '基本使用',
+}
+export const Preview: Story = {
+  storyName: '启用disabled，当做预览组件',
+  args: {
+    modelValue: avatar,
+    disabled: false,
+  },
+}