vxe-pc-ui 3.7.7 → 3.7.9

package/es/image/src/preview.js

@@ -231,7 +231,7 @@ export default {
                 reactData.offsetScale = Number(Math.max(-0.9, offsetScale - stepNum).toFixed(2));
             }
         },
-        handleChange(isNext) {
+        handleChangeEvent(evnt, isNext) {
             const $xeImagePreview = this;
             const reactData = $xeImagePreview.reactData;
             let activeIndex = reactData.activeIndex || 0;
@@ -252,13 +252,18 @@ export default {
                     activeIndex--;
                 }
             }
-            $xeImagePreview.resetStyle();
+            const imgUrl = imgList[activeIndex || 0];
             reactData.activeIndex = activeIndex;
+            $xeImagePreview.resetStyle();
             $xeImagePreview.emitModel(activeIndex);
+            $xeImagePreview.dispatchEvent('change', { url: imgUrl, activeIndex }, evnt);
         },
-        handleRotateImg(isRight) {
+        handleRotateImgEvent(evnt, isRight) {
             const $xeImagePreview = this;
             const reactData = $xeImagePreview.reactData;
+            const imgList = $xeImagePreview.computeImgList;
+            const { activeIndex } = reactData;
+            const imgUrl = imgList[activeIndex || 0];
             let offsetRotate = reactData.offsetRotate;
             if (isRight) {
                 offsetRotate += 90;
@@ -267,6 +272,7 @@ export default {
                 offsetRotate -= 90;
             }
             reactData.offsetRotate = offsetRotate;
+            $xeImagePreview.dispatchEvent('rotate', { url: imgUrl, rotateValue: offsetRotate }, evnt);
         },
         handlePct11() {
             const $xeImagePreview = this;
@@ -372,10 +378,10 @@ export default {
                         $xeImagePreview.handlePct11();
                         break;
                     case 'rotateLeft':
-                        $xeImagePreview.handleRotateImg(false);
+                        $xeImagePreview.handleRotateImgEvent(evnt, false);
                         break;
                     case 'rotateRight':
-                        $xeImagePreview.handleRotateImg(true);
+                        $xeImagePreview.handleRotateImgEvent(evnt, true);
                         break;
                     case 'print':
                         $xeImagePreview.handlePrintImg();
@@ -459,7 +465,7 @@ export default {
                     reactData.offsetLeft -= 1;
                 }
                 else {
-                    $xeImagePreview.handleChange(false);
+                    $xeImagePreview.handleChangeEvent(evnt, false);
                 }
             }
             else if (isRightArrow) {
@@ -468,16 +474,16 @@ export default {
                     reactData.offsetLeft += 1;
                 }
                 else {
-                    $xeImagePreview.handleChange(true);
+                    $xeImagePreview.handleChangeEvent(evnt, true);
                 }
             }
             else if (isR && isControlKey) {
                 evnt.preventDefault();
                 if (hasShiftKey) {
-                    $xeImagePreview.handleRotateImg(false);
+                    $xeImagePreview.handleRotateImgEvent(evnt, false);
                 }
                 else {
-                    $xeImagePreview.handleRotateImg(true);
+                    $xeImagePreview.handleRotateImgEvent(evnt, true);
                 }
             }
             else if (isP && isControlKey) {
@@ -588,8 +594,8 @@ export default {
                     ? h('div', {
                         class: 'vxe-image-preview--previous-btn',
                         on: {
-                            click() {
-                                $xeImagePreview.handleChange(false);
+                            click(evnt) {
+                                $xeImagePreview.handleChangeEvent(evnt, false);
                             }
                         }
                     }, [
@@ -602,8 +608,8 @@ export default {
                     ? h('div', {
                         class: 'vxe-image-preview--next-btn',
                         on: {
-                            click() {
-                                $xeImagePreview.handleChange(true);
+                            click(evnt) {
+                                $xeImagePreview.handleChangeEvent(evnt, true);
                             }
                         }
                     }, [

package/es/image/src/util.js

@@ -7,6 +7,7 @@ export const openPreviewImage = (options) => {
             escClosable: true
         }, options);
         const { urlList, activeIndex } = opts;
+        const { rotate, change } = opts.events || {};
         const modalId = XEUtils.uniqueId('image-preview');
         VxeUI.modal.open({
             id: modalId,
@@ -36,6 +37,16 @@ export const openPreviewImage = (options) => {
                         on: {
                             close() {
                                 VxeUI.modal.close(modalId);
+                            },
+                            change(eventParams) {
+                                if (change) {
+                                    change.call(this, eventParams);
+                                }
+                            },
+                            rotate(eventParams) {
+                                if (rotate) {
+                                    rotate.call(this, eventParams);
+                                }
                             }
                         }
                     });