feat(Uploader): support uploading status (#5625)

src/uploader/demo/index.vue

@@ -8,8 +8,8 @@
       <van-uploader v-model="fileList" multiple accept="*" />
     </demo-block>
 
-    <demo-block v-if="!isWeapp" :title="$t('failed')">
-      <van-uploader v-model="failedFileList" :after-read="afterReadFailed" />
+    <demo-block v-if="!isWeapp" :title="$t('status')">
+      <van-uploader v-model="statusFileList" :after-read="afterReadFailed" />
     </demo-block>
 
     <demo-block :title="$t('maxCount')">
@@ -34,19 +34,23 @@
 export default {
   i18n: {
     'zh-CN': {
+      status: '上传状态',
       failed: '上传失败',
       upload: '上传文件',
       preview: '文件预览',
       maxCount: '限制上传数量',
+      uploading: '上传中...',
       beforeRead: '上传前校验',
       uploadStyle: '自定义上传样式',
       invalidType: '请上传 jpg 格式图片',
     },
     'en-US': {
+      status: 'Upload Status',
       failed: 'Failed',
       upload: 'Upload File',
       preview: 'Preview File',
       maxCount: 'Max Count',
+      uploading: 'Uploading...',
       beforeRead: 'Before Read',
       uploadStyle: 'Upload Style',
       invalidType: 'Please upload an image in jpg format',
@@ -61,16 +65,23 @@ export default {
       ],
       fileList2: [{ url: 'https://img.yzcdn.cn/vant/sand.jpg' }],
       fileList3: [],
-      failedFileList: [],
+      statusFileList: [],
     };
   },
 
   created() {
-    this.failedFileList.push({
-      url: 'https://img.yzcdn.cn/vant/leaf.jpg',
-      status: 'failed',
-      message: this.$t('failed'),
-    });
+    this.statusFileList.push(
+      {
+        url: 'https://img.yzcdn.cn/vant/leaf.jpg',
+        status: 'uploading',
+        message: this.$t('uploading'),
+      },
+      {
+        url: 'https://img.yzcdn.cn/vant/tree.jpg',
+        status: 'failed',
+        message: this.$t('failed'),
+      }
+    );
   },
 
   methods: {
@@ -88,8 +99,13 @@ export default {
     },
 
     afterReadFailed(item) {
-      item.status = 'failed';
-      item.message = this.$t('failed');
+      item.status = 'uploading';
+      item.message = this.$t('uploading');
+
+      setTimeout(() => {
+        item.status = 'failed';
+        item.message = this.$t('failed');
+      }, 1000);
     },
   },
 };