feat(Uploader): add close-preview event (#4376)

src/uploader/README.md

@@ -134,6 +134,7 @@ export default {
 |------|------|------|
 | oversize | Triggered when file size over limit | Same as after-read |
 | click-preview | Triggered when click preview image | Same as after-read |
+| close-preview | Triggered when close full screen image preview | - |
 | delete | Triggered when delete preview file | file |
 
 ### Slots

src/uploader/README.zh-CN.md

@@ -150,6 +150,7 @@ export default {
 |------|------|------|
 | oversize | 文件大小超过限制时触发 | 同`after-read` |
 | click-preview | 点击预览图时触发 | 同`after-read` | 
+| close-preview | 关闭全屏图片预览时触发 | - |
 | delete | 删除文件预览时触发 | file: 被删除的文件对象 |
 
 ### Slots

src/uploader/index.js

@@ -189,7 +189,10 @@ export default createComponent({
       ImagePreview({
         images: imageFiles,
         closeOnPopstate: true,
-        startPosition: imageFiles.indexOf(item.content || item.url)
+        startPosition: imageFiles.indexOf(item.content || item.url),
+        onClose: () => {
+          this.$emit('close-preview');
+        }
       });
     },
 

src/uploader/test/index.spec.js

@@ -1,5 +1,5 @@
 import Uploader from '..';
-import { mount, later } from '../../../test/utils';
+import { mount, later, triggerDrag } from '../../../test/utils';
 
 window.File = function() {
   this.size = 10000;
@@ -356,3 +356,20 @@ it('click-preview event', () => {
   expect(wrapper.emitted('click-preview')[0][0]).toEqual({ url: IMAGE });
   expect(wrapper.emitted('click-preview')[0][1]).toEqual({ name: '' });
 });
+
+it('close-preview event', async () => {
+  const wrapper = mount(Uploader, {
+    propsData: {
+      fileList: [{ url: IMAGE }]
+    }
+  });
+
+  wrapper.find('.van-image').trigger('click');
+
+  const preview = document.querySelector('.van-image-preview');
+  const swipe = preview.querySelector('.van-swipe__track');
+  triggerDrag(swipe, 0, 0);
+
+  await later(300);
+  expect(wrapper.emitted('close-preview')).toBeTruthy();
+});