@web-utils/component 2.7.30 → 2.7.31

package/dist/components/image-cropper/index.js

@@ -1,19 +1,21 @@
-import { z as dataURLtoFile } from "../../chunks/util.89913643.js";
+import { z as dataURLtoFile } from "../../chunks/util.b0d0b0ad.js";
 import { VueCropper } from "vue-cropper";
-import { n as normalizeComponent } from "../../chunks/vueComponentNormalizer.77ec6792.js";
+import { n as normalizeComponent } from "../../chunks/vueComponentNormalizer.9c6b8b3d.js";
 var render = function() {
-  var _vm = this, _h = _vm.$createElement, _c = _vm._self._c || _h;
+  var _vm = this;
+  var _h = _vm.$createElement;
+  var _c = _vm._self._c || _h;
   return _c("ElementDialog", {
     staticClass: "avue-cropper",
     attrs: {
-      visible: _vm.visible,
+      "visible": _vm.visible,
       "before-close": _vm.cancel,
-      title: "图片剪裁",
-      "close-on-press-escape": !1,
-      "close-on-click-modal": !1,
+      "title": "图片剪裁",
+      "close-on-press-escape": false,
+      "close-on-click-modal": false,
       "modal-append-to-body": _vm.$AVUE.modalAppendToBody,
       "append-to-body": _vm.$AVUE.appendToBody,
-      width: "1000px"
+      "width": "1000px"
     },
     on: {
       "update:visible": function($event) {
@@ -25,24 +27,24 @@ var render = function() {
       fn: function() {
         return [_c("ElButton", {
           attrs: {
-            size: "small",
-            type: "primary"
+            "size": "small",
+            "type": "primary"
           },
           on: {
-            click: _vm.submit
+            "click": _vm.submit
           }
         }, [_vm._v(" 确 定 ")]), _c("ElButton", {
           attrs: {
-            size: "small"
+            "size": "small"
           },
           on: {
-            click: function($event) {
+            "click": function($event) {
               return _vm.cancel();
             }
           }
         }, [_vm._v(" 取 消 ")])];
       },
-      proxy: !0
+      proxy: true
     }])
   }, [_c("div", {
     staticClass: "cropper-content"
@@ -53,72 +55,72 @@ var render = function() {
   }, [_c("VueCropper", {
     ref: "cropper",
     attrs: {
-      img: _vm.option.img,
+      "img": _vm.option.img,
       "output-size": _vm.option.outputSize,
       "output-type": _vm.option.outputType,
-      info: _vm.option.info,
+      "info": _vm.option.info,
       "can-scale": _vm.option.canScale,
       "auto-crop": _vm.option.autoCrop,
       "auto-crop-width": _vm.option.autoCropWidth,
       "auto-crop-height": _vm.option.autoCropHeight,
-      fixed: _vm.option.fixed,
+      "fixed": _vm.option.fixed,
       "fixed-number": _vm.option.fixedNumber,
-      full: _vm.option.full,
+      "full": _vm.option.full,
       "fixed-box": _vm.option.fixedBox,
       "can-move": _vm.option.canMove,
       "can-move-box": _vm.option.canMoveBox,
-      original: _vm.option.original,
+      "original": _vm.option.original,
       "center-box": _vm.option.centerBox,
-      height: _vm.option.height,
+      "height": _vm.option.height,
       "info-true": _vm.option.infoTrue,
       "max-img-size": _vm.option.maxImgSize,
-      enlarge: _vm.option.enlarge,
-      mode: _vm.option.mode
+      "enlarge": _vm.option.enlarge,
+      "mode": _vm.option.mode
     },
     on: {
-      realTime: _vm.realTime
+      "realTime": _vm.realTime
     }
   })], 1), _c("div", {
     staticClass: "footer-btn"
   }, [_c("ElButton", {
     attrs: {
-      size: "mini",
-      type: "danger",
-      icon: "el-icon-zoom-in"
+      "size": "mini",
+      "type": "danger",
+      "icon": "el-icon-zoom-in"
     },
     on: {
-      click: function($event) {
+      "click": function($event) {
         return _vm.changeScale(1);
       }
     }
   }), _c("ElButton", {
     attrs: {
-      size: "mini",
-      type: "danger",
-      icon: "el-icon-zoom-out"
+      "size": "mini",
+      "type": "danger",
+      "icon": "el-icon-zoom-out"
     },
     on: {
-      click: function($event) {
+      "click": function($event) {
         return _vm.changeScale(-1);
       }
     }
   }), _c("ElButton", {
     attrs: {
-      size: "mini",
-      icon: "el-icon-back",
-      type: "danger"
+      "size": "mini",
+      "icon": "el-icon-back",
+      "type": "danger"
     },
     on: {
-      click: _vm.rotateLeft
+      "click": _vm.rotateLeft
     }
   }), _c("ElButton", {
     attrs: {
-      size: "mini",
-      type: "danger",
-      icon: "el-icon-right"
+      "size": "mini",
+      "type": "danger",
+      "icon": "el-icon-right"
     },
     on: {
-      click: _vm.rotateRight
+      "click": _vm.rotateRight
     }
   })], 1)]), _c("div", {
     staticClass: "show-preview"
@@ -128,11 +130,13 @@ var render = function() {
   }, [_c("img", {
     style: _vm.previews.img,
     attrs: {
-      src: _vm.previews.url,
-      alt: ""
+      "src": _vm.previews.url,
+      "alt": ""
     }
   })])])])]);
-}, staticRenderFns = [];
+};
+var staticRenderFns = [];
+const ImageCropper_vue_vue_type_style_index_0_lang = "";
 const __vue2_script = {
   name: "ImageCropper",
   // imageCropper,
@@ -141,18 +145,19 @@ const __vue2_script = {
   },
   data() {
     return {
-      visible: !1,
+      visible: false,
       previews: {},
       option: {}
     };
   },
   methods: {
     show() {
-      this.visible = !0;
+      this.visible = true;
     },
     // 图片缩放
     changeScale(num) {
-      num = num || 1, this.$refs.cropper.changeScale(num);
+      num = num || 1;
+      this.$refs.cropper.changeScale(num);
     },
     // 向左旋转
     rotateLeft() {
@@ -167,29 +172,42 @@ const __vue2_script = {
       this.previews = data;
     },
     submit() {
-      this.visible = !1, this.$refs.cropper.getCropData((data) => {
+      this.visible = false;
+      this.$refs.cropper.getCropData((data) => {
         let result = data;
-        this.option.type === "file" && (result = dataURLtoFile(data, `${new Date().getTime()}.${this.option.outputType}`)), this.option.callback && this.option.callback(result);
+        if (this.option.type === "file") {
+          result = dataURLtoFile(data, `${new Date().getTime()}.${this.option.outputType}`);
+        }
+        this.option.callback && this.option.callback(result);
       });
     },
     cancel(done) {
-      done && done(), this.visible = !1, this.option.cancel && this.option.cancel(), typeof this.option.beforeClose == "function" && this.option.beforeClose(), this.$destroy(), this.$el.remove();
+      done && done();
+      this.visible = false;
+      this.option.cancel && this.option.cancel();
+      if (typeof this.option.beforeClose === "function") {
+        this.option.beforeClose();
+      }
+      this.$destroy();
+      this.$el.remove();
     }
   }
-}, __cssModules = {};
+};
+const __cssModules = {};
 var __component__ = /* @__PURE__ */ normalizeComponent(
   __vue2_script,
   render,
   staticRenderFns,
-  !1,
+  false,
   __vue2_injectStyles,
   null,
   null,
   null
 );
 function __vue2_injectStyles(context) {
-  for (let o in __cssModules)
+  for (let o in __cssModules) {
     this[o] = __cssModules[o];
+  }
 }
 const ImageCropper = /* @__PURE__ */ function() {
   return __component__.exports;

package/dist/components/image-cropper/style.css

@@ -1 +1,34 @@
-.avue-cropper .cropper-content{display:flex;justify-content:flex-end}.avue-cropper .cropper-content .cropper-box{flex:1;width:100%}.avue-cropper .cropper-content .cropper-box .cropper{width:auto;height:300px}.avue-cropper .cropper-content .show-preview{flex:1;display:flex;justify-content:center}.avue-cropper .cropper-content .show-preview .preview{overflow:hidden;border:1px solid #67c23a;background:#cccccc}.avue-cropper .cropper-content .footer-btn{margin-top:30px;display:flex;justify-content:center;padding-right:10px}
+/* 全局公共颜色配置 */ /* 全局公共尺寸配置 */
+/* 应用头部高度 */
+/* 页面宽度 */
+/* 侧栏宽度 */
+/* 标签高度 */
+/* 页面头部工具条高度 */
+.avue-cropper .cropper-content {
+  display: flex;
+  justify-content: flex-end;
+}
+.avue-cropper .cropper-content .cropper-box {
+  flex: 1;
+  width: 100%;
+}
+.avue-cropper .cropper-content .cropper-box .cropper {
+  width: auto;
+  height: 300px;
+}
+.avue-cropper .cropper-content .show-preview {
+  flex: 1;
+  display: flex;
+  justify-content: center;
+}
+.avue-cropper .cropper-content .show-preview .preview {
+  overflow: hidden;
+  border: 1px solid #67c23a;
+  background: #cccccc;
+}
+.avue-cropper .cropper-content .footer-btn {
+  margin-top: 30px;
+  display: flex;
+  justify-content: center;
+  padding-right: 10px;
+}

package/dist/components/image-preview/index.js

@@ -1,26 +1,28 @@
-import { i as isMediaType } from "../../chunks/util.89913643.js";
+import { i as isMediaType } from "../../chunks/util.b0d0b0ad.js";
 import { setPx } from "@web-utils/core";
-import { n as normalizeComponent } from "../../chunks/vueComponentNormalizer.77ec6792.js";
+import { n as normalizeComponent } from "../../chunks/vueComponentNormalizer.9c6b8b3d.js";
 var render = function() {
-  var _vm = this, _h = _vm.$createElement, _c = _vm._self._c || _h;
+  var _vm = this;
+  var _h = _vm.$createElement;
+  var _c = _vm._self._c || _h;
   return _vm.isShow ? _c("div", {
     staticClass: "avue-image-preview"
   }, [_vm.ops.modal ? _c("div", {
     staticClass: "avue-image-preview__mask",
     on: {
-      click: _vm.close
+      "click": _vm.close
     }
   }) : _vm._e(), _c("span", {
     staticClass: "el-image-viewer__btn el-image-viewer__close",
     on: {
-      click: _vm.close
+      "click": _vm.close
     }
   }, [_c("i", {
     staticClass: "el-icon-circle-close"
   })]), _vm.isRrrow ? _c("span", {
     staticClass: "el-image-viewer__btn el-image-viewer__prev",
     on: {
-      click: function($event) {
+      "click": function($event) {
         return _vm.handlePrev();
       }
     }
@@ -29,7 +31,7 @@ var render = function() {
   })]) : _vm._e(), _vm.isRrrow ? _c("span", {
     staticClass: "el-image-viewer__btn el-image-viewer__next",
     on: {
-      click: function($event) {
+      "click": function($event) {
         return _vm.handleNext();
       }
     }
@@ -41,51 +43,51 @@ var render = function() {
   }, [_c("ElCarousel", {
     ref: "carousel",
     attrs: {
-      "show-indicators": !1,
+      "show-indicators": false,
       "initial-index": _vm.index,
       "initial-swipe": _vm.index,
-      interval: 0,
-      arrow: "never",
+      "interval": 0,
+      "arrow": "never",
       "indicator-position": "none"
     },
     on: {
-      change: _vm.handleChange
+      "change": _vm.handleChange
     }
   }, _vm._l(_vm.datas, function(item, indexs) {
     return _c("ElCarouselItem", {
       key: indexs,
       nativeOn: {
-        click: function($event) {
+        "click": function($event) {
           if ($event.target !== $event.currentTarget)
             return null;
-          _vm.ops.closeOnClickModal && _vm.close();
+          _vm.ops.closeOnClickModal ? _vm.close() : "";
         }
       }
     }, [_vm.isMediaType(item) ? _c(_vm.isMediaType(item), {
       ref: "item",
-      refInFor: !0,
+      refInFor: true,
       tag: "Component",
       style: [_vm.styleName, _vm.styleBoxName],
       attrs: {
-        id: `avue-image-preview__${indexs}`,
-        src: item.url,
-        controls: "controls",
-        ondragstart: "return false"
+        "id": `avue-image-preview__${indexs}`,
+        "src": item.url,
+        "controls": "controls",
+        "ondragstart": "return false"
       },
       on: {
-        click: function($event) {
+        "click": function($event) {
           return _vm.handleClick(item, indexs);
         },
-        mousedown: _vm.move
+        "mousedown": _vm.move
       }
     }) : _c("div", {
       staticClass: "avue-image-preview__file",
       attrs: {
-        id: `avue-image-preview__${indexs}`
+        "id": `avue-image-preview__${indexs}`
       },
       on: {
-        click: function($event) {
-          return _vm.handleClick(item, indexs, !0);
+        "click": function($event) {
+          return _vm.handleClick(item, indexs, true);
         }
       }
     }, [_c("span", [_c("i", {
@@ -98,38 +100,40 @@ var render = function() {
   }, [_c("i", {
     staticClass: "el-icon-zoom-out",
     on: {
-      click: _vm.subScale
+      "click": _vm.subScale
     }
   }), _c("i", {
     staticClass: "el-icon-zoom-in",
     on: {
-      click: _vm.addScale
+      "click": _vm.addScale
     }
   }), _c("i", {
     staticClass: "el-image-viewer__actions__divider"
   }), _c("i", {
     staticClass: "el-icon-printer",
     on: {
-      click: _vm.handlePrint
+      "click": _vm.handlePrint
     }
   }), _c("i", {
     staticClass: "el-image-viewer__actions__divider"
   }), _c("i", {
     staticClass: "el-icon-refresh-left",
     on: {
-      click: function($event) {
+      "click": function($event) {
         _vm.rotate = _vm.rotate - 90;
       }
     }
   }), _c("i", {
     staticClass: "el-icon-refresh-right",
     on: {
-      click: function($event) {
+      "click": function($event) {
         _vm.rotate = _vm.rotate + 90;
       }
     }
   })])])]) : _vm._e();
-}, staticRenderFns = [];
+};
+var staticRenderFns = [];
+const ImagePreview_vue_vue_type_style_index_0_lang = "";
 const __vue2_script = {
   name: "ImagePreview",
   // imagePreview,
@@ -140,7 +144,7 @@ const __vue2_script = {
       scale: 1,
       datas: [],
       rotate: 0,
-      isShow: !1,
+      isShow: false,
       index: 0,
       ops: {}
     };
@@ -171,13 +175,19 @@ const __vue2_script = {
       this.$Print(`#avue-image-preview__${this.index}`);
     },
     handlePrev() {
-      this.$refs.carousel.prev(), this.index = this.$refs.carousel.activeIndex, this.stopItem();
+      this.$refs.carousel.prev();
+      this.index = this.$refs.carousel.activeIndex;
+      this.stopItem();
     },
     handleNext() {
-      this.$refs.carousel.next(), this.index = this.$refs.carousel.activeIndex, this.stopItem();
+      this.$refs.carousel.next();
+      this.index = this.$refs.carousel.activeIndex;
+      this.stopItem();
     },
     stopItem() {
-      this.left = 0, this.top = 0, this.$refs.item.forEach((ele) => {
+      this.left = 0;
+      this.top = 0;
+      this.$refs.item.forEach((ele) => {
         ele.pause && ele.pause();
       });
     },
@@ -185,45 +195,66 @@ const __vue2_script = {
       return isMediaType(item.url, item.type);
     },
     subScale() {
-      this.scale !== 0.2 && (this.scale = parseFloat((this.scale - 0.2).toFixed(2)));
+      if (this.scale !== 0.2) {
+        this.scale = parseFloat((this.scale - 0.2).toFixed(2));
+      }
     },
     addScale() {
       this.scale = parseFloat((this.scale + 0.2).toFixed(2));
     },
     handleChange() {
-      this.scale = 1, this.rotate = 0;
+      this.scale = 1;
+      this.rotate = 0;
     },
     move(e) {
-      let disX = e.clientX, disY = e.clientY;
+      let disX = e.clientX;
+      let disY = e.clientY;
       const scale = 2;
       document.onmousemove = (e2) => {
-        const left = e2.clientX - disX, top = e2.clientY - disY;
-        disX = e2.clientX, disY = e2.clientY, this.left = this.left + left * scale, this.top = this.top + top * scale;
-      }, document.onmouseup = () => {
-        document.onmousemove = null, document.onmouseup = null;
+        const left = e2.clientX - disX;
+        const top = e2.clientY - disY;
+        disX = e2.clientX;
+        disY = e2.clientY;
+        this.left = this.left + left * scale;
+        this.top = this.top + top * scale;
+      };
+      document.onmouseup = () => {
+        document.onmousemove = null;
+        document.onmouseup = null;
       };
     },
-    handleClick(item, index, df = !1) {
-      typeof this.ops.click == "function" ? this.ops.click(item, index) : df && window.open(item.url);
+    handleClick(item, index, df = false) {
+      if (typeof this.ops.click === "function") {
+        this.ops.click(item, index);
+      } else if (df) {
+        window.open(item.url);
+      }
     },
     close() {
-      this.isShow = !1, typeof this.ops.beforeClose == "function" && this.ops.beforeClose(this.datas, this.index), this.$destroy(), this.$el.remove();
+      this.isShow = false;
+      if (typeof this.ops.beforeClose === "function") {
+        this.ops.beforeClose(this.datas, this.index);
+      }
+      this.$destroy();
+      this.$el.remove();
     }
   }
-}, __cssModules = {};
+};
+const __cssModules = {};
 var __component__ = /* @__PURE__ */ normalizeComponent(
   __vue2_script,
   render,
   staticRenderFns,
-  !1,
+  false,
   __vue2_injectStyles,
   null,
   null,
   null
 );
 function __vue2_injectStyles(context) {
-  for (let o in __cssModules)
+  for (let o in __cssModules) {
     this[o] = __cssModules[o];
+  }
 }
 const ImagePreview = /* @__PURE__ */ function() {
   return __component__.exports;

package/dist/components/image-preview/style.css

@@ -1 +1,72 @@
-.avue-img--center{display:flex;align-items:center;justify-content:center}.avue-img--fullscreen .el-dialog__body{height:100%}.avue-image-preview{position:fixed;top:0;left:0;width:100%;height:100%;transition:all .5s;z-index:9998}.avue-image-preview .el-image-viewer__close i{color:#fff}.avue-image-preview .el-image-viewer__btn{z-index:1024}.avue-image-preview img{transition:all .5s;cursor:pointer}.avue-image-preview__file{text-align:center}.avue-image-preview__file a{color:#fff}.avue-image-preview__file i{cursor:pointer;font-size:80px}.avue-image-preview__mask{position:absolute;top:0;left:0;width:100%;height:100%;background:rgba(0,0,0,.5)}.avue-image-preview__box{width:100%;height:100%;display:flex;align-items:center;justify-content:center}.avue-image-preview__box .el-carousel{width:90%;height:100%}.avue-image-preview__box .el-carousel__container{height:100%}.avue-image-preview__box .el-carousel__item{width:100%;height:100%;display:flex;align-items:center;justify-content:center}
+/* 全局公共颜色配置 */ /* 全局公共尺寸配置 */
+/* 应用头部高度 */
+/* 页面宽度 */
+/* 侧栏宽度 */
+/* 标签高度 */
+/* 页面头部工具条高度 */
+.avue-img--center {
+  display: flex;
+  align-items: center;
+  justify-content: center;
+}
+.avue-img--fullscreen .el-dialog__body {
+  height: 100%;
+}
+.avue-image-preview {
+  position: fixed;
+  top: 0;
+  left: 0;
+  width: 100%;
+  height: 100%;
+  transition: all 0.5s;
+  z-index: 9998;
+}
+.avue-image-preview .el-image-viewer__close i {
+  color: #fff;
+}
+.avue-image-preview .el-image-viewer__btn {
+  z-index: 1024;
+}
+.avue-image-preview img {
+  transition: all 0.5s;
+  cursor: pointer;
+}
+.avue-image-preview__file {
+  text-align: center;
+}
+.avue-image-preview__file a {
+  color: #fff;
+}
+.avue-image-preview__file i {
+  cursor: pointer;
+  font-size: 80px;
+}
+.avue-image-preview__mask {
+  position: absolute;
+  top: 0;
+  left: 0;
+  width: 100%;
+  height: 100%;
+  background: rgba(0, 0, 0, 0.5);
+}
+.avue-image-preview__box {
+  width: 100%;
+  height: 100%;
+  display: flex;
+  align-items: center;
+  justify-content: center;
+}
+.avue-image-preview__box .el-carousel {
+  width: 90%;
+  height: 100%;
+}
+.avue-image-preview__box .el-carousel__container {
+  height: 100%;
+}
+.avue-image-preview__box .el-carousel__item {
+  width: 100%;
+  height: 100%;
+  display: flex;
+  align-items: center;
+  justify-content: center;
+}