@web-utils/component 2.0.13 → 2.2.0

package/highlight-j-s/index.mjs

@@ -0,0 +1,76 @@
+import a from "highlight.js/lib/core";
+import "highlight.js/styles/atom-one-dark-reasonable.css";
+import { escapeHtml as l } from "@web-utils/core";
+import { n as g } from "../chunks/vueComponentNormalizer.JwmUNtgn.mjs";
+var s = function() {
+  var e = this, t = e.$createElement, n = e._self._c || t;
+  return n("pre", {
+    staticClass: "highlight-js"
+  }, [n("code", {
+    class: e.className,
+    domProps: {
+      innerHTML: e._s(e.highlighted.value)
+    }
+  })]);
+}, r = [];
+const o = {
+  name: "HighlightJS",
+  props: {
+    language: String,
+    code: String,
+    autodetect: Boolean
+  },
+  data: function() {
+    return {
+      detectedLanguage: ""
+    };
+  },
+  computed: {
+    className() {
+      return this.detectedLanguage ? `hljs ${this.detectedLanguage}` : "";
+    },
+    highlighted() {
+      if (!this.language && !a.getLanguage(this.language))
+        return console.warn(`The language "${this.language}" you specified could not be found.`), {
+          language: "",
+          value: l(this.code)
+        };
+      let e = {};
+      return !this.language || this.autodetect ? e = a.highlightAuto(this.code) : e = a.highlight(this.code, {
+        language: this.language,
+        ignoreIllegals: this.ignoreIllegals
+      }), e;
+    },
+    ignoreIllegals() {
+      return !0;
+    }
+  },
+  watch: {
+    "highlighted.language": {
+      immediate: !0,
+      handler(e) {
+        this.detectedLanguage = e;
+      }
+    }
+  }
+}, i = {};
+var u = /* @__PURE__ */ g(
+  o,
+  s,
+  r,
+  !1,
+  h,
+  null,
+  null,
+  null
+);
+function h(e) {
+  for (let t in i)
+    this[t] = i[t];
+}
+const p = /* @__PURE__ */ function() {
+  return u.exports;
+}();
+export {
+  p as default
+};

package/highlight-j-s/style.css

@@ -0,0 +1 @@
+.highlight-js{height:100%;max-height:calc(80vh - 32px);margin:0;overflow-x:hidden;overflow-y:auto}.highlight-js .hljs{white-space:pre-wrap;word-break:break-word;height:100%}.highlight-js .hljs *{font-family:Consolas,Monaco,monospace}

package/icon-card/index.mjs

@@ -0,0 +1,62 @@
+import { n as e } from "../chunks/vueComponentNormalizer.JwmUNtgn.mjs";
+var i = function() {
+  var t = this, s = t.$createElement, n = t._self._c || s;
+  return n("div", {
+    class: ["icon-card", "flex-row", t.iconBg]
+  }, [n("div", {
+    staticClass: "card-icon_bg"
+  }, [n("i", {
+    class: ["card-icon", t.icon]
+  })]), n("div", {
+    staticClass: "flex-item"
+  }, [n("p", {
+    staticClass: "icon-card_title"
+  }, [t._t("default")], 2), n("div", {
+    staticClass: "icon-card_num"
+  }, [n("span", {
+    staticClass: "icon-card_color",
+    on: {
+      click: t.toDetails
+    }
+  }, [t._v(t._s(t.number))]), t._t("nuit")], 2)])]);
+}, a = [];
+const o = {
+  name: "IconCard",
+  props: {
+    iconBg: {
+      type: String,
+      default: "blue"
+    },
+    icon: {
+      type: String,
+      default: "el-icon-s-custom"
+    },
+    path: String,
+    number: Number
+  },
+  methods: {
+    toDetails() {
+      this.$router.push(this.path);
+    }
+  }
+}, c = {};
+var r = /* @__PURE__ */ e(
+  o,
+  i,
+  a,
+  !1,
+  l,
+  null,
+  null,
+  null
+);
+function l(t) {
+  for (let s in c)
+    this[s] = c[s];
+}
+const u = /* @__PURE__ */ function() {
+  return r.exports;
+}();
+export {
+  u as default
+};

package/icon-card/style.css

@@ -0,0 +1 @@
+.icon-card{border-radius:4px;padding:14px}.icon-card .card-icon_bg{text-align:center;border-radius:14px;width:48px;height:48px;margin-right:14px}.icon-card .card-icon{font-size:24px;line-height:48px}.icon-card .icon-card_color{cursor:pointer;font-size:18px;font-weight:700}.icon-card.blue{background:#f4f9ff}.icon-card.blue .card-icon_bg{color:#3c8efd;background:#e8f2fc}.icon-card.blue .icon-card_color{color:#3c8efd}.icon-card.orange{background:#f9f5ee}.icon-card.orange .card-icon_bg{color:#fdc12e;background:#fdf2dc}.icon-card.orange .icon-card_color{color:#fdc12e}.icon-card.green{background:#f1f7ed}.icon-card.green .card-icon_bg{color:#72c734;background:#ddf7d9}.icon-card.green .icon-card_color{color:#72c734}

package/icon-temp/index.mjs

@@ -0,0 +1,50 @@
+import { n as a } from "../chunks/vueComponentNormalizer.JwmUNtgn.mjs";
+var r = function() {
+  var t = this, e = t.$createElement, n = t._self._c || e;
+  return n("span", {
+    staticClass: "avue-icon",
+    class: {
+      "avue-icon--small": t.small
+    }
+  }, [t.text.includes("#") ? n("svg", {
+    attrs: {
+      "aria-hidden": "true"
+    }
+  }, [n("use", {
+    attrs: {
+      "xlink:href": t.text
+    }
+  })]) : n("i", {
+    class: t.text
+  })]);
+}, l = [];
+const o = {
+  name: "IconTemp",
+  props: {
+    small: Boolean,
+    text: {
+      type: String,
+      default: ""
+    }
+  }
+}, s = {};
+var c = /* @__PURE__ */ a(
+  o,
+  r,
+  l,
+  !1,
+  i,
+  null,
+  null,
+  null
+);
+function i(t) {
+  for (let e in s)
+    this[e] = s[e];
+}
+const _ = /* @__PURE__ */ function() {
+  return c.exports;
+}();
+export {
+  _ as default
+};

package/icon-temp/style.css

@@ -0,0 +1 @@
+.avue-icon{justify-content:center;align-items:center;display:flex}.avue-icon svg,.avue-icon i{width:20px;height:20px;font-size:20px}.avue-icon--small svg,.avue-icon--small i{width:15px;height:15px;font-size:15px}

package/iframe-window/index.mjs

@@ -0,0 +1,61 @@
+import { n as l } from "../chunks/vueComponentNormalizer.JwmUNtgn.mjs";
+var s = function() {
+  var e = this, t = e.$createElement, r = e._self._c || t;
+  return r("ElementDialog", e._g(e._b({
+    attrs: {
+      "custom-class": "iframe-window",
+      embed: "",
+      height: "60vh",
+      title: e.title,
+      "show-full-screen": "",
+      visible: e.visible
+    },
+    scopedSlots: e._u([{
+      key: "default",
+      fn: function() {
+        return [r("iframe", {
+          staticClass: "iframe-window-iframe",
+          attrs: {
+            src: e.url,
+            frameborder: "0"
+          }
+        })];
+      },
+      proxy: !0
+    }])
+  }, "ElementDialog", e.$attrs, !1), e.$listeners));
+}, a = [];
+const i = {
+  name: "IframeWindow",
+  props: {
+    title: {
+      type: String,
+      default: "iframe窗口"
+    },
+    url: {
+      type: String,
+      default: "http://192.168.0.107:31221/wallboard"
+    },
+    visible: Boolean
+  }
+}, n = {};
+var o = /* @__PURE__ */ l(
+  i,
+  s,
+  a,
+  !1,
+  f,
+  null,
+  null,
+  null
+);
+function f(e) {
+  for (let t in n)
+    this[t] = n[t];
+}
+const c = /* @__PURE__ */ function() {
+  return o.exports;
+}();
+export {
+  c as default
+};

package/iframe-window/style.css

@@ -0,0 +1 @@
+.iframe-window.element-dialog.el-dialog.el-dialog-resizeable .el-dialog__body{padding:0;position:relative}.iframe-window .iframe-window-iframe{border:none;width:100%;height:100%;position:absolute;top:0;bottom:0;left:0;right:0}

package/image-cropper/index.mjs

@@ -0,0 +1,249 @@
+var c = Object.defineProperty;
+var r = Object.getOwnPropertySymbols;
+var l = Object.prototype.hasOwnProperty, u = Object.prototype.propertyIsEnumerable;
+var a = (e, o, t) => o in e ? c(e, o, { enumerable: !0, configurable: !0, writable: !0, value: t }) : e[o] = t, s = (e, o) => {
+  for (var t in o || (o = {}))
+    l.call(o, t) && a(e, t, o[t]);
+  if (r)
+    for (var t of r(o))
+      u.call(o, t) && a(e, t, o[t]);
+  return e;
+};
+import { B as f } from "../chunks/util.C2Bhx22L.mjs";
+import { VueCropper as m } from "vue-cropper";
+import d from "vue";
+import { n as h } from "../chunks/vueComponentNormalizer.JwmUNtgn.mjs";
+var v = function() {
+  var e = this, o = e.$createElement, t = e._self._c || o;
+  return t("ElementDialog", {
+    staticClass: "avue-cropper",
+    attrs: {
+      visible: e.visible,
+      "before-close": e.cancel,
+      title: "图片剪裁",
+      "close-on-press-escape": !1,
+      "close-on-click-modal": !1,
+      "modal-append-to-body": e.$AVUE.modalAppendToBody,
+      "append-to-body": e.$AVUE.appendToBody,
+      width: "1000px"
+    },
+    on: {
+      "update:visible": function(i) {
+        e.visible = i;
+      }
+    },
+    scopedSlots: e._u([{
+      key: "footer",
+      fn: function() {
+        return [t("ElButton", {
+          attrs: {
+            size: "small",
+            type: "primary"
+          },
+          on: {
+            click: e.submit
+          }
+        }, [e._v(" 确 定 ")]), t("ElButton", {
+          attrs: {
+            size: "small"
+          },
+          on: {
+            click: function(i) {
+              return e.cancel();
+            }
+          }
+        }, [e._v(" 取 消 ")])];
+      },
+      proxy: !0
+    }])
+  }, [t("div", {
+    staticClass: "cropper-content"
+  }, [t("div", {
+    staticClass: "cropper-box"
+  }, [t("div", {
+    staticClass: "cropper"
+  }, [t("VueCropper", {
+    ref: "cropper",
+    attrs: {
+      img: e.option.img,
+      "output-size": e.option.outputSize,
+      "output-type": e.option.outputType,
+      info: e.option.info,
+      "can-scale": e.option.canScale,
+      "auto-crop": e.option.autoCrop,
+      "auto-crop-width": e.option.autoCropWidth,
+      "auto-crop-height": e.option.autoCropHeight,
+      fixed: e.option.fixed,
+      "fixed-number": e.option.fixedNumber,
+      full: e.option.full,
+      "fixed-box": e.option.fixedBox,
+      "can-move": e.option.canMove,
+      "can-move-box": e.option.canMoveBox,
+      original: e.option.original,
+      "center-box": e.option.centerBox,
+      height: e.option.height,
+      "info-true": e.option.infoTrue,
+      "max-img-size": e.option.maxImgSize,
+      enlarge: e.option.enlarge,
+      mode: e.option.mode
+    },
+    on: {
+      realTime: e.realTime
+    }
+  })], 1), t("div", {
+    staticClass: "footer-btn"
+  }, [t("ElButton", {
+    attrs: {
+      size: "mini",
+      type: "danger",
+      icon: "el-icon-zoom-in"
+    },
+    on: {
+      click: function(i) {
+        return e.changeScale(1);
+      }
+    }
+  }), t("ElButton", {
+    attrs: {
+      size: "mini",
+      type: "danger",
+      icon: "el-icon-zoom-out"
+    },
+    on: {
+      click: function(i) {
+        return e.changeScale(-1);
+      }
+    }
+  }), t("ElButton", {
+    attrs: {
+      size: "mini",
+      icon: "el-icon-back",
+      type: "danger"
+    },
+    on: {
+      click: e.rotateLeft
+    }
+  }), t("ElButton", {
+    attrs: {
+      size: "mini",
+      type: "danger",
+      icon: "el-icon-right"
+    },
+    on: {
+      click: e.rotateRight
+    }
+  })], 1)]), t("div", {
+    staticClass: "show-preview"
+  }, [t("div", {
+    staticClass: "preview",
+    style: e.previews.div
+  }, [t("img", {
+    style: e.previews.img,
+    attrs: {
+      src: e.previews.url,
+      alt: ""
+    }
+  })])])])]);
+}, g = [];
+const n = {
+  name: "ImageCropper",
+  components: {
+    VueCropper: m
+  },
+  data() {
+    return {
+      visible: !1,
+      previews: {},
+      option: {}
+    };
+  },
+  methods: {
+    show() {
+      this.visible = !0;
+    },
+    // 图片缩放
+    changeScale(e) {
+      e = e || 1, this.$refs.cropper.changeScale(e);
+    },
+    // 向左旋转
+    rotateLeft() {
+      this.$refs.cropper.rotateLeft();
+    },
+    // 向右旋转
+    rotateRight() {
+      this.$refs.cropper.rotateRight();
+    },
+    // 实时预览函数
+    realTime(e) {
+      this.previews = e;
+    },
+    submit() {
+      this.visible = !1, this.$refs.cropper.getCropData((e) => {
+        let o = e;
+        this.option.type === "file" && (o = f(e, `${(/* @__PURE__ */ new Date()).getTime()}.${this.option.outputType}`)), this.option.callback && this.option.callback(o);
+      });
+    },
+    cancel(e) {
+      e && e(), this.visible = !1, this.option.cancel && this.option.cancel(), typeof this.option.beforeClose == "function" && this.option.beforeClose(), this.$destroy(), this.$el.remove();
+    }
+  }
+}, b = (e = {}) => {
+  const o = d.extend(n), t = s({
+    outputSize: 1,
+    // 裁剪生成图片的质量(可选0.1 - 1)
+    outputType: "jpeg",
+    // 裁剪生成图片的格式（jpeg || png || webp）
+    info: !0,
+    // 图片大小信息
+    canScale: !0,
+    // 图片是否允许滚轮缩放
+    autoCrop: !0,
+    // 是否默认生成截图框
+    fixed: !1,
+    // 是否开启截图框宽高固定比例
+    full: !1,
+    // false按原比例裁切图片，不失真
+    fixedBox: !1,
+    // 固定截图框大小，不允许改变
+    canMove: !0,
+    // 上传图片是否可以移动
+    canMoveBox: !0,
+    // 截图框能否拖动
+    original: !1,
+    // 上传图片按照原始比例渲染
+    centerBox: !1,
+    // 截图框是否被限制在图片里面
+    height: !0,
+    // 是否按照设备的dpr 输出等比例图片
+    infoTrue: !1,
+    // true为展示真实输出图片宽高，false展示看到的截图框宽高
+    enlarge: 1
+  }, e), i = new o({
+    data: {
+      option: t
+    }
+  }).$mount();
+  return document.body.appendChild(i.$el), i.show(), i;
+};
+n.imageCropper = b;
+const x = n, p = {};
+var C = /* @__PURE__ */ h(
+  x,
+  v,
+  g,
+  !1,
+  y,
+  null,
+  null,
+  null
+);
+function y(e) {
+  for (let o in p)
+    this[o] = p[o];
+}
+const k = /* @__PURE__ */ function() {
+  return C.exports;
+}();
+export {
+  k as default
+};

package/image-cropper/style.css

@@ -0,0 +1 @@
+.avue-cropper .cropper-content{justify-content:flex-end;display:flex}.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;justify-content:center;display:flex}.avue-cropper .cropper-content .show-preview .preview{background:#ccc;border:1px solid #67c23a;overflow:hidden}.avue-cropper .cropper-content .footer-btn{justify-content:center;margin-top:30px;padding-right:10px;display:flex}