From 1cc6f03e6fcbce376e18ee44f0204524a6212f96 Mon Sep 17 00:00:00 2001
From: neverland <chenjiahan@youzan.com>
Date: Fri, 23 Aug 2019 14:42:16 +0800
Subject: [PATCH] feat(Uploader): add click-preview event (#4206)

---
 src/uploader/README.md          |  3 ++-
 src/uploader/README.zh-CN.md    |  1 +
 src/uploader/demo/index.vue     |  4 ++--
 src/uploader/index.js           | 11 ++++++++++-
 src/uploader/test/index.spec.js | 13 +++++++++++++
 5 files changed, 28 insertions(+), 4 deletions(-)

diff --git a/src/uploader/README.md b/src/uploader/README.md
index 349982d90..9850f1954 100644
--- a/src/uploader/README.md
+++ b/src/uploader/README.md
@@ -133,6 +133,7 @@ export default {
 | Event | Description | Arguments |
 |------|------|------|
 | oversize | Triggered when file size over limit | Same as after-read |
+| click-preview | Triggered when click preview image | Same as after-read |
 | delete | Triggered when delete preview file | file |
 
 ### Slots
@@ -141,7 +142,7 @@ export default {
 |------|------|
 | default | Custom icon |
 
-### Parematers of before-read、after-read
+### Parematers of before-read、after-read、before-delete
 
 | Attribute | Description | Type |
 |------|------|------|
diff --git a/src/uploader/README.zh-CN.md b/src/uploader/README.zh-CN.md
index 8bc32797a..6073b1b0f 100644
--- a/src/uploader/README.zh-CN.md
+++ b/src/uploader/README.zh-CN.md
@@ -149,6 +149,7 @@ export default {
 | 事件名 | 说明 | 回调参数 |
 |------|------|------|
 | oversize | 文件大小超过限制时触发 | 同`after-read` |
+| click-preview | 点击预览图时触发 | 同`after-read` | 
 | delete | 删除文件预览时触发 | file: 被删除的文件对象 |
 
 ### Slots
diff --git a/src/uploader/demo/index.vue b/src/uploader/demo/index.vue
index 1ae8a3a9a..c866c71e9 100644
--- a/src/uploader/demo/index.vue
+++ b/src/uploader/demo/index.vue
@@ -79,8 +79,8 @@ export default {
       return true;
     },
 
-    afterRead(file) {
-      console.log(file);
+    afterRead(file, detail) {
+      console.log(file, detail);
     }
   }
 };
diff --git a/src/uploader/index.js b/src/uploader/index.js
index 7530335b4..02d0a7fb7 100644
--- a/src/uploader/index.js
+++ b/src/uploader/index.js
@@ -193,13 +193,22 @@ export default createComponent({
       });
     },
 
+    onClickPreview(file) {
+      this.$emit('click-preview', file, this.detail);
+    },
+
     renderPreview() {
       if (!this.previewImage) {
         return;
       }
 
       return this.fileList.map((item, index) => (
-        <div class={bem('preview')}>
+        <div
+          class={bem('preview')}
+          onClick={() => {
+            this.onClickPreview(item);
+          }}
+        >
           {isImageFile(item) ? (
             <Image
               fit={this.imageFit}
diff --git a/src/uploader/test/index.spec.js b/src/uploader/test/index.spec.js
index db5b66172..0ef7000d4 100644
--- a/src/uploader/test/index.spec.js
+++ b/src/uploader/test/index.spec.js
@@ -343,3 +343,16 @@ it('click to preview image', () => {
   const imagePreviewNode2 = document.querySelector('.van-image-preview');
   expect(imagePreviewNode2).toMatchSnapshot();
 });
+
+it('click-preview event', () => {
+  const wrapper = mount(Uploader, {
+    propsData: {
+      previewFullImage: false,
+      fileList: [{ url: IMAGE }, { url: PDF }]
+    }
+  });
+
+  wrapper.find('.van-image').trigger('click');
+  expect(wrapper.emitted('click-preview')[0][0]).toEqual({ url: IMAGE });
+  expect(wrapper.emitted('click-preview')[0][1]).toEqual({ name: '' });
+});