@web-utils/component 2.7.35 → 2.7.37

package/dist/components/properties-panel/style.css

@@ -1,122 +1 @@
-/* 全局公共颜色配置 */ /* 全局公共尺寸配置 */
-/* 应用头部高度 */
-/* 页面宽度 */
-/* 侧栏宽度 */
-/* 标签高度 */
-/* 页面头部工具条高度 */
-.process-panel__container {
-  box-sizing: border-box;
-  padding: 0 8px;
-  border-left: 1px solid #eeeeee;
-  box-shadow: 0 0 8px #cccccc;
-  max-height: 100%;
-  overflow-y: auto;
-}
-
-.panel-tab__title {
-  font-weight: 600;
-  padding: 0 8px;
-  font-size: 1.1em;
-  line-height: 1.2em;
-}
-.panel-tab__title i {
-  margin-right: 8px;
-  font-size: 1.2em;
-}
-
-.panel-tab__content {
-  width: 100%;
-  box-sizing: border-box;
-  border-top: 1px solid #eeeeee;
-  padding: 8px 16px;
-}
-.panel-tab__content .panel-tab__content--title {
-  display: flex;
-  justify-content: space-between;
-  padding-bottom: 8px;
-}
-.panel-tab__content .panel-tab__content--title span {
-  flex: 1;
-  text-align: left;
-}
-
-.element-property {
-  width: 100%;
-  display: flex;
-  align-items: flex-start;
-  margin: 8px 0;
-}
-.element-property .element-property__label {
-  display: block;
-  width: 90px;
-  text-align: right;
-  overflow: hidden;
-  padding-right: 12px;
-  line-height: 32px;
-  font-size: 14px;
-  box-sizing: border-box;
-}
-.element-property .element-property__value {
-  flex: 1;
-  line-height: 32px;
-}
-.element-property .el-form-item {
-  width: 100%;
-  margin-bottom: 0;
-  padding-bottom: 18px;
-}
-
-.list-property {
-  flex-direction: column;
-}
-.list-property .element-listener-item {
-  width: 100%;
-  display: inline-grid;
-  grid-template-columns: 16px auto 32px 32px;
-  grid-column-gap: 8px;
-}
-.list-property .element-listener-item + .element-listener-item {
-  margin-top: 8px;
-}
-
-.listener-filed__title {
-  display: inline-flex;
-  width: 100%;
-  justify-content: space-between;
-  align-items: center;
-  margin-top: 0;
-}
-.listener-filed__title span {
-  width: 200px;
-  text-align: left;
-  font-size: 14px;
-}
-.listener-filed__title i {
-  margin-right: 8px;
-}
-
-.element-drawer__button {
-  margin-top: 8px;
-  width: 100%;
-  display: inline-flex;
-  justify-content: space-around;
-}
-
-.element-drawer__button > .el-button {
-  width: 100%;
-}
-
-.el-collapse-item__content {
-  padding-bottom: 0;
-}
-
-.el-input.is-disabled .el-input__inner {
-  color: #999999;
-}
-
-.el-form-item.el-form-item--mini {
-  margin-bottom: 0;
-}
-.el-form-item.el-form-item--mini + .el-form-item {
-  margin-top: 16px;
-}
+.process-panel__container{box-sizing:border-box;padding:0 8px;border-left:1px solid #eeeeee;box-shadow:0 0 8px #ccc;max-height:100%;overflow-y:auto}.panel-tab__title{font-weight:600;padding:0 8px;font-size:1.1em;line-height:1.2em}.panel-tab__title i{margin-right:8px;font-size:1.2em}.panel-tab__content{width:100%;box-sizing:border-box;border-top:1px solid #eeeeee;padding:8px 16px}.panel-tab__content .panel-tab__content--title{display:flex;justify-content:space-between;padding-bottom:8px}.panel-tab__content .panel-tab__content--title span{flex:1;text-align:left}.element-property{width:100%;display:flex;align-items:flex-start;margin:8px 0}.element-property .element-property__label{display:block;width:90px;text-align:right;overflow:hidden;padding-right:12px;line-height:32px;font-size:14px;box-sizing:border-box}.element-property .element-property__value{flex:1;line-height:32px}.element-property .el-form-item{width:100%;margin-bottom:0;padding-bottom:18px}.list-property{flex-direction:column}.list-property .element-listener-item{width:100%;display:inline-grid;grid-template-columns:16px auto 32px 32px;grid-column-gap:8px}.list-property .element-listener-item+.element-listener-item{margin-top:8px}.listener-filed__title{display:inline-flex;width:100%;justify-content:space-between;align-items:center;margin-top:0}.listener-filed__title span{width:200px;text-align:left;font-size:14px}.listener-filed__title i{margin-right:8px}.element-drawer__button{margin-top:8px;width:100%;display:inline-flex;justify-content:space-around}.element-drawer__button>.el-button{width:100%}.el-collapse-item__content{padding-bottom:0}.el-input.is-disabled .el-input__inner{color:#999}.el-form-item.el-form-item--mini{margin-bottom:0}.el-form-item.el-form-item--mini+.el-form-item{margin-top:16px}

package/dist/components/queue/index.mjs

@@ -0,0 +1,76 @@
+import { n as s } from "../../chunks/vueComponentNormalizer.446f5dc4.mjs";
+var o = function() {
+  var e = this, t = e.$createElement, n = e._self._c || t;
+  return n("div", {
+    class: ["avue-queue", {
+      "avue-queue--block": e.block
+    }]
+  }, [n("div", {
+    ref: "queue",
+    staticClass: "animated",
+    class: e.animate
+  }, [e._t("default")], 2)]);
+}, i = [];
+const l = {
+  name: "Queue",
+  props: {
+    enter: {
+      type: String,
+      default: "fadeInLeft"
+    },
+    leave: {
+      type: String,
+      default: "fadeOutRight"
+    },
+    block: {
+      type: Boolean,
+      default: !1
+    },
+    delay: {
+      type: Number,
+      default: 0
+    }
+  },
+  data() {
+    return {
+      isFixed: 0,
+      animate: []
+    };
+  },
+  mounted() {
+    this.$nextTick(() => {
+      addEventListener("scroll", this.handleAnimate), this.handleAnimate();
+    });
+  },
+  destroyed() {
+    removeEventListener("scroll", this.handleAnimate);
+  },
+  methods: {
+    handleAnimate() {
+      const e = window.pageYOffset || document.documentElement.scrollTop || document.body.scrollTop, t = document.documentElement.clientHeight, n = this.$refs.queue;
+      e + t > n.offsetTop ? setTimeout(() => {
+        this.animate = [this.enter, "avue-opacity--active"];
+      }, this.delay) : this.animate = ["avue-opacity"];
+    }
+  }
+}, a = {};
+var u = /* @__PURE__ */ s(
+  l,
+  o,
+  i,
+  !1,
+  r,
+  null,
+  null,
+  null
+);
+function r(e) {
+  for (let t in a)
+    this[t] = a[t];
+}
+const d = /* @__PURE__ */ function() {
+  return u.exports;
+}();
+export {
+  d as default
+};

package/dist/components/record-video/index.mjs

@@ -0,0 +1,173 @@
+import { s as r } from "../../chunks/util.eca708b6.mjs";
+import { n as o } from "../../chunks/vueComponentNormalizer.446f5dc4.mjs";
+let n = class {
+  /**
+   * 构造函数
+   *
+   * @param  {Object}   videoObj 视频对象
+   */
+  constructor(t) {
+    this.video = t, this.mediaRecorder = null, this.chunks = [];
+  }
+  /**
+   * 初始化
+   *
+   * @return {Object} promise
+   */
+  init() {
+    return new Promise((t, i) => {
+      navigator.mediaDevices.getUserMedia({
+        audio: !0,
+        video: !0
+        // video: {
+        //     width: this.videoWidth,
+        //     height: this.videoHeight
+        // }
+      }).then((s) => {
+        "srcObject" in this.video ? this.video.srcObject = s : this.video.src = window.URL.createObjectURL(s), this.video.addEventListener("loadmetadata", () => {
+          this.video.play();
+        }), this.mediaRecorder = new MediaRecorder(s), this.mediaRecorder.addEventListener("dataavailable", (d) => {
+          this.chunks.push(d.data);
+        }), t();
+      }).catch((s) => {
+        i(s);
+      });
+    });
+  }
+  /**
+   * 视频开始录制
+   */
+  startRecord() {
+    this.mediaRecorder.state === "inactive" && this.mediaRecorder.start();
+  }
+  /**
+   * 视频结束录制
+   */
+  stopRecord() {
+    this.mediaRecorder.state === "recording" && this.mediaRecorder.stop();
+  }
+  /**
+   * 检测当前浏览器对否支持
+   *
+   * @return {boolean} 当前浏览器是否支持
+   */
+  isSupport() {
+    if (navigator.mediaDevices && navigator.mediaDevices.getUserMedia)
+      return !0;
+  }
+};
+var c = function() {
+  var e = this, t = e.$createElement, i = e._self._c || t;
+  return i("div", {
+    staticClass: "avue-video",
+    style: e.styleName
+  }, [i("div", {
+    staticClass: "avue-video__border"
+  }, [i("span", {
+    style: e.borderStyleName
+  }), i("span", {
+    style: e.borderStyleName
+  }), i("span", {
+    style: e.borderStyleName
+  }), i("span", {
+    style: e.borderStyleName
+  })]), i("img", {
+    staticClass: "avue-video__img",
+    style: e.imgStyleName,
+    attrs: {
+      src: e.background,
+      alt: ""
+    }
+  }), i("video", {
+    ref: "main",
+    staticClass: "avue-video__main",
+    attrs: {
+      autoplay: "",
+      muted: ""
+    },
+    domProps: {
+      muted: !0
+    }
+  })]);
+}, l = [];
+const h = {
+  name: "RecordVideo",
+  props: {
+    background: {
+      type: String
+    },
+    width: {
+      type: [String, Number],
+      default: 500
+    }
+  },
+  data() {
+    return {
+      videoObj: null
+    };
+  },
+  computed: {
+    styleName() {
+      return {
+        width: r(this.width)
+      };
+    },
+    imgStyleName() {
+      return {
+        width: r(this.width / 2)
+      };
+    },
+    borderStyleName() {
+      return {
+        width: r(this.width / 15),
+        height: r(this.width / 15),
+        borderWidth: r(5)
+      };
+    }
+  },
+  mounted() {
+    this.init();
+  },
+  methods: {
+    init() {
+      this.videoObj = new n(this.$refs.main), this.videoObj.init().then(() => {
+        this.videoObj.mediaRecorder.addEventListener("stop", this.getData, !1);
+      });
+    },
+    startRecord() {
+      this.videoObj.startRecord();
+    },
+    stopRecord() {
+      this.videoObj.stopRecord();
+    },
+    getData() {
+      const e = new Blob(this.videoObj.chunks, {
+        type: "video/mp4"
+      }), t = new FileReader();
+      t.readAsDataURL(e), t.addEventListener("loadend", () => {
+        const i = t.result;
+        this.$emit("data-change", i);
+      });
+    }
+  }
+}, a = {};
+var v = /* @__PURE__ */ o(
+  h,
+  c,
+  l,
+  !1,
+  m,
+  null,
+  null,
+  null
+);
+function m(e) {
+  for (let t in a)
+    this[t] = a[t];
+}
+const R = /* @__PURE__ */ function() {
+  return v.exports;
+}();
+export {
+  R as default
+};

package/dist/components/record-video/style.css

@@ -1,53 +1 @@
-/* 全局公共颜色配置 */ /* 全局公共尺寸配置 */
-/* 应用头部高度 */
-/* 页面宽度 */
-/* 侧栏宽度 */
-/* 标签高度 */
-/* 页面头部工具条高度 */
-.avue-video {
-  position: relative;
-  width: 500px;
-  overflow: hidden;
-}
-.avue-video__border span {
-  position: absolute;
-  width: 30px;
-  height: 30px;
-  border-width: 4px;
-  color: #0073eb;
-  border-style: solid;
-}
-.avue-video__border span:nth-child(1) {
-  left: 15px;
-  top: 15px;
-  border-right: 0;
-  border-bottom: 0;
-}
-.avue-video__border span:nth-child(2) {
-  right: 15px;
-  top: 15px;
-  border-left: 0;
-  border-bottom: 0;
-}
-.avue-video__border span:nth-child(3) {
-  bottom: 15px;
-  left: 15px;
-  border-right: 0;
-  border-top: 0;
-}
-.avue-video__border span:nth-child(4) {
-  bottom: 15px;
-  right: 15px;
-  border-left: 0;
-  border-top: 0;
-}
-.avue-video__img {
-  width: 100px;
-  position: absolute;
-  left: 50%;
-  top: 50%;
-  transform: translate(-50%, -50%);
-}
-.avue-video__main {
-  width: 100%;
-}
+.avue-video{position:relative;width:500px;overflow:hidden}.avue-video__border span{position:absolute;width:30px;height:30px;border-width:4px;color:#0073eb;border-style:solid}.avue-video__border span:nth-child(1){left:15px;top:15px;border-right:0;border-bottom:0}.avue-video__border span:nth-child(2){right:15px;top:15px;border-left:0;border-bottom:0}.avue-video__border span:nth-child(3){bottom:15px;left:15px;border-right:0;border-top:0}.avue-video__border span:nth-child(4){bottom:15px;right:15px;border-left:0;border-top:0}.avue-video__img{width:100px;position:absolute;left:50%;top:50%;transform:translate(-50%,-50%)}.avue-video__main{width:100%}

package/dist/components/resize-observer/index.mjs

@@ -0,0 +1,62 @@
+import { j as o } from "../../chunks/index.9b7a65d1.mjs";
+import { n as h } from "../../chunks/vueComponentNormalizer.446f5dc4.mjs";
+var a = function() {
+  var e = this, t = e.$createElement, r = e._self._c || t;
+  return r("div", {
+    staticClass: "resize-observer",
+    attrs: {
+      tabindex: "-1"
+    }
+  });
+}, l = [];
+let i;
+function s() {
+  s.init || (s.init = !0, i = o() !== -1);
+}
+const c = {
+  name: "ResizeObserver",
+  mounted() {
+    s(), this.$nextTick(() => {
+      this._w = this.$el.offsetWidth, this._h = this.$el.offsetHeight;
+    });
+    const e = document.createElement("object");
+    this._resizeObject = e, e.setAttribute("aria-hidden", "true"), e.setAttribute("tabindex", -1), e.onload = this.addResizeHandlers, e.type = "text/html", i && this.$el.appendChild(e), e.data = "about:blank", i || this.$el.appendChild(e);
+  },
+  beforeDestroy() {
+    this.removeResizeHandlers();
+  },
+  methods: {
+    compareAndNotify() {
+      (this._w !== this.$el.offsetWidth || this._h !== this.$el.offsetHeight) && (this._w = this.$el.offsetWidth, this._h = this.$el.offsetHeight, this.$emit("notify", {
+        width: this._w,
+        height: this._h
+      }));
+    },
+    addResizeHandlers() {
+      this._resizeObject.contentDocument.defaultView.addEventListener("resize", this.compareAndNotify), this.compareAndNotify();
+    },
+    removeResizeHandlers() {
+      this._resizeObject && this._resizeObject.onload && (!i && this._resizeObject.contentDocument && this._resizeObject.contentDocument.defaultView.removeEventListener("resize", this.compareAndNotify), this.$el.removeChild(this._resizeObject), this._resizeObject.onload = null, this._resizeObject = null);
+    }
+  }
+}, n = {};
+var d = /* @__PURE__ */ h(
+  c,
+  a,
+  l,
+  !1,
+  _,
+  null,
+  null,
+  null
+);
+function _(e) {
+  for (let t in n)
+    this[t] = n[t];
+}
+const m = /* @__PURE__ */ function() {
+  return d.exports;
+}();
+export {
+  m as default
+};

package/dist/components/resize-observer/style.css

@@ -1,31 +1 @@
-/* 全局公共颜色配置 */ /* 全局公共尺寸配置 */
-/* 应用头部高度 */
-/* 页面宽度 */
-/* 侧栏宽度 */
-/* 标签高度 */
-/* 页面头部工具条高度 */
-.resize-observer {
-  position: absolute;
-  top: 0;
-  left: 0;
-  z-index: -1;
-  display: block;
-  width: 100%;
-  height: 100%;
-  overflow: hidden;
-  background-color: transparent;
-  border: none;
-  opacity: 0;
-  pointer-events: none;
-}
-.resize-observer > object {
-  position: absolute;
-  top: 0;
-  left: 0;
-  z-index: -1;
-  display: block;
-  width: 100%;
-  height: 100%;
-  overflow: hidden;
-  pointer-events: none;
-}
+.resize-observer{position:absolute;top:0;left:0;z-index:-1;display:block;width:100%;height:100%;overflow:hidden;background-color:transparent;border:none;opacity:0;pointer-events:none}.resize-observer>object{position:absolute;top:0;left:0;z-index:-1;display:block;width:100%;height:100%;overflow:hidden;pointer-events:none}

package/dist/components/search/index.mjs

@@ -0,0 +1,143 @@
+import { D as i } from "../../chunks/util.eca708b6.mjs";
+import { i as n } from "../../chunks/init.07b0cebe.mjs";
+import { isBlank as o } from "@web-utils/core";
+import { n as l } from "../../chunks/vueComponentNormalizer.446f5dc4.mjs";
+var h = function() {
+  var t = this, e = t.$createElement, r = t._self._c || e;
+  return r("ElRow", {
+    class: ["avue-search", {
+      "avue--card": t.isCard
+    }],
+    attrs: {
+      span: 24
+    }
+  }, t._l(t.columnOption, function(s) {
+    return r("ElCol", {
+      key: s.prop,
+      staticClass: "avue-search__item",
+      attrs: {
+        span: s.span || 24
+      }
+    }, [r("p", {
+      staticClass: "avue-search__title"
+    }, [t._v(" " + t._s(s.label) + ": ")]), r("div", {
+      staticClass: "avue-search__content"
+    }, [t.mainSlot.includes(s.prop) ? t._t(s.prop, null, {
+      dic: t.DIC[s.prop]
+    }) : t._l(t.DIC[s.prop], function(a) {
+      return r("span", {
+        key: t.getKey(a, s.props, t.valueKey),
+        class: ["avue-search__tags", {
+          "avue-search__tags--active": t.getActive(a, s)
+        }],
+        on: {
+          click: function(v) {
+            return t.handleClick(s, a);
+          }
+        }
+      }, [t._v(t._s(t.getKey(a, s.props, t.labelKey)))]);
+    })], 2)]);
+  }), 1);
+}, u = [];
+const c = {
+  name: "Search",
+  mixins: [n],
+  props: {
+    value: [String, Object, Number, Boolean, Array]
+  },
+  computed: {
+    form: {
+      get() {
+        return this.value;
+      },
+      set(t) {
+        this.setVal(t);
+      }
+    },
+    props() {
+      return this.parentOption.props || {};
+    },
+    labelKey() {
+      return i.label;
+    },
+    valueKey() {
+      return i.value;
+    },
+    mainSlot() {
+      const t = [];
+      return this.propOption.forEach((e) => {
+        this.$scopedSlots[e.prop] && t.push(e.prop);
+      }), t;
+    },
+    isCard() {
+      return this.parentOption.card;
+    },
+    parentOption() {
+      return this.tableOption;
+    },
+    propOption() {
+      return this.columnOption;
+    },
+    columnOption() {
+      return this.parentOption.column;
+    }
+  },
+  watch: {
+    value: {
+      handler(t) {
+        this.setVal(t);
+      },
+      deep: !0
+    }
+  },
+  created() {
+    this.dataFormat();
+  },
+  methods: {
+    setVal(t) {
+      this.$emit("input", t), this.$emit("change", t);
+    },
+    getKey(t = {}, e = {}, r) {
+      return t[e[r] || this.props[r] || r];
+    },
+    dataFormat() {
+      this.propOption.forEach((t) => {
+        const e = t.prop;
+        o(this.form[e]) && this.$set(this.form, e, t.multiple === !1 ? "" : []);
+      });
+    },
+    getActive(t, e) {
+      const r = this.getKey(t, e.props, this.valueKey);
+      return e.multiple === !1 ? this.form[e.prop] === r : this.form[e.prop].includes(r);
+    },
+    handleClick(t, e) {
+      const r = this.getKey(e, t.props, this.valueKey);
+      if (t.multiple === !1)
+        this.form[t.prop] = r;
+      else {
+        const s = this.form[t.prop].indexOf(r);
+        s === -1 ? this.form[t.prop].push(r) : this.form[t.prop].splice(s, 1);
+      }
+    }
+  }
+}, p = {};
+var _ = /* @__PURE__ */ l(
+  c,
+  h,
+  u,
+  !1,
+  f,
+  null,
+  null,
+  null
+);
+function f(t) {
+  for (let e in p)
+    this[e] = p[e];
+}
+const g = /* @__PURE__ */ function() {
+  return _.exports;
+}();
+export {
+  g as default
+};