vxe-pc-ui 4.7.7 → 4.7.9

package/es/image/src/preview.js

@@ -37,6 +37,7 @@ export default defineVxeComponent({
         'change',
         'download',
         'download-fail',
+        'rotate',
         'close'
     ],
     setup(props, context) {
@@ -215,7 +216,7 @@ export default defineVxeComponent({
                 reactData.offsetScale = Number(Math.max(-0.9, offsetScale - stepNum).toFixed(2));
             }
         };
-        const handleChange = (isNext) => {
+        const handleChangeEvent = (evnt, isNext) => {
             let activeIndex = reactData.activeIndex || 0;
             const imgList = computeImgList.value;
             if (isNext) {
@@ -234,11 +235,16 @@ export default defineVxeComponent({
                     activeIndex--;
                 }
             }
-            resetStyle();
+            const imgUrl = imgList[activeIndex || 0];
             reactData.activeIndex = activeIndex;
+            resetStyle();
             emitModel(activeIndex);
+            dispatchEvent('change', { url: imgUrl, activeIndex }, evnt);
         };
-        const handleRotateImg = (isRight) => {
+        const handleRotateImgEvent = (evnt, isRight) => {
+            const imgList = computeImgList.value;
+            const { activeIndex } = reactData;
+            const imgUrl = imgList[activeIndex || 0];
             let offsetRotate = reactData.offsetRotate;
             if (isRight) {
                 offsetRotate += 90;
@@ -247,6 +253,7 @@ export default defineVxeComponent({
                 offsetRotate -= 90;
             }
             reactData.offsetRotate = offsetRotate;
+            dispatchEvent('rotate', { url: imgUrl, rotateValue: offsetRotate }, evnt);
         };
         const handlePct11 = () => {
             resetStyle();
@@ -341,10 +348,10 @@ export default defineVxeComponent({
                         handlePct11();
                         break;
                     case 'rotateLeft':
-                        handleRotateImg(false);
+                        handleRotateImgEvent(evnt, false);
                         break;
                     case 'rotateRight':
-                        handleRotateImg(true);
+                        handleRotateImgEvent(evnt, true);
                         break;
                     case 'print':
                         handlePrintImg();
@@ -423,7 +430,7 @@ export default defineVxeComponent({
                     reactData.offsetLeft -= 1;
                 }
                 else {
-                    handleChange(false);
+                    handleChangeEvent(evnt, false);
                 }
             }
             else if (isRightArrow) {
@@ -432,16 +439,16 @@ export default defineVxeComponent({
                     reactData.offsetLeft += 1;
                 }
                 else {
-                    handleChange(true);
+                    handleChangeEvent(evnt, true);
                 }
             }
             else if (isR && isControlKey) {
                 evnt.preventDefault();
                 if (hasShiftKey) {
-                    handleRotateImg(false);
+                    handleRotateImgEvent(evnt, false);
                 }
                 else {
-                    handleRotateImg(true);
+                    handleRotateImgEvent(evnt, true);
                 }
             }
             else if (isP && isControlKey) {
@@ -529,8 +536,8 @@ export default defineVxeComponent({
                 imgList.length > 1
                     ? h('div', {
                         class: 'vxe-image-preview--previous-btn',
-                        onClick() {
-                            handleChange(false);
+                        onClick(evnt) {
+                            handleChangeEvent(evnt, false);
                         }
                     }, [
                         h('i', {
@@ -541,8 +548,8 @@ export default defineVxeComponent({
                 imgList.length > 1
                     ? h('div', {
                         class: 'vxe-image-preview--next-btn',
-                        onClick() {
-                            handleChange(true);
+                        onClick(evnt) {
+                            handleChangeEvent(evnt, true);
                         }
                     }, [
                         h('i', {

package/es/image/src/util.js

@@ -8,6 +8,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,
@@ -34,6 +35,16 @@ export const openPreviewImage = (options) => {
                         downloadMethod: opts.downloadMethod,
                         onClose() {
                             VxeUI.modal.close(modalId);
+                        },
+                        onChange(eventParams) {
+                            if (change) {
+                                change.call(this, eventParams);
+                            }
+                        },
+                        onRotate(eventParams) {
+                            if (rotate) {
+                                rotate.call(this, eventParams);
+                            }
                         }
                     });
                 }