@web-utils/component 2.0.13 → 2.2.0

package/card/index.mjs

@@ -0,0 +1,126 @@
+import { n as r } from "../chunks/vueComponentNormalizer.JwmUNtgn.mjs";
+var o = function() {
+  var t = this, e = t.$createElement, a = t._self._c || e;
+  return a("div", {
+    staticClass: "avue-card"
+  }, [a("ElRow", {
+    attrs: {
+      span: 24,
+      gutter: t.gutter
+    }
+  }, [t.option.addBtn ? a("ElCol", {
+    attrs: {
+      span: t.span
+    }
+  }, [a("div", {
+    staticClass: "avue-card__item avue-card__item--add",
+    on: {
+      click: function(s) {
+        return t.rowAdd();
+      }
+    }
+  }, [a("i", {
+    staticClass: "el-icon-plus"
+  }), a("span", [t._v("添加")])])]) : t._e(), t._l(t.data, function(s, i) {
+    return a("ElCol", {
+      key: i,
+      attrs: {
+        span: t.span
+      }
+    }, [a("div", {
+      staticClass: "avue-card__item",
+      on: {
+        click: function(p) {
+          return t.rowClick(s, i);
+        }
+      }
+    }, [a("div", {
+      staticClass: "avue-card__body"
+    }, [a("div", {
+      staticClass: "avue-card__avatar"
+    }, [a("img", {
+      attrs: {
+        src: s[t.imgKey],
+        alt: ""
+      }
+    })]), a("div", {
+      staticClass: "avue-card__detail"
+    }, [a("div", {
+      staticClass: "avue-card__title"
+    }, [t._v(" " + t._s(s[t.titleKey]) + " ")]), a("div", {
+      staticClass: "avue-card__info"
+    }, [t._v(" " + t._s(s[t.infoKey]) + " ")])])]), a("div", {
+      staticClass: "avue-card__menu"
+    }, [t._t("menu", null, {
+      index: i,
+      row: s
+    })], 2)])]);
+  })], 2)], 1);
+}, c = [];
+const l = {
+  img: "img",
+  title: "title",
+  info: "info"
+}, u = {
+  name: "Card",
+  props: {
+    option: {
+      type: Object,
+      default: () => ({})
+    },
+    data: {
+      type: Array,
+      default: () => []
+    }
+  },
+  data() {
+    return {
+      propsDefault: l
+    };
+  },
+  computed: {
+    imgKey: function() {
+      return this.option.props.img || this.propsDefault.img;
+    },
+    titleKey: function() {
+      return this.option.props.title || this.propsDefault.title;
+    },
+    infoKey: function() {
+      return this.option.props.info || this.propsDefault.info;
+    },
+    span() {
+      return this.option.span || 8;
+    },
+    gutter() {
+      return this.option.gutter || 20;
+    }
+  },
+  methods: {
+    rowAdd() {
+      this.$emit("row-add");
+    },
+    rowClick(t, e) {
+      this.$emit("row-click", t, e);
+    }
+  }
+}, n = {};
+var d = /* @__PURE__ */ r(
+  u,
+  o,
+  c,
+  !1,
+  _,
+  null,
+  null,
+  null
+);
+function _(t) {
+  for (let e in n)
+    this[e] = n[e];
+}
+const f = /* @__PURE__ */ function() {
+  return d.exports;
+}();
+export {
+  f as default
+};

package/card/style.css

@@ -0,0 +1 @@
+.avue-card__item{box-sizing:border-box;color:rgba(0,0,0,.65);font-variant:tabular-nums;cursor:pointer;font-feature-settings:"tnum";background-color:#fff;border:1px solid #e8e8e8;height:200px;margin-bottom:16px;font-size:14px;line-height:1.5;list-style:none}.avue-card__item:hover{border-color:rgba(0,0,0,.09);box-shadow:0 2px 8px rgba(0,0,0,.09)}.avue-card__item--add{color:rgba(0,0,0,.45);background-color:#fff;border:1px dashed #d9d9d9;border-radius:2px;justify-content:center;align-items:center;width:100%;font-size:16px;display:flex}.avue-card__item--add i{margin-right:10px}.avue-card__item--add:hover{color:#40a9ff;background-color:#fff;border-color:#40a9ff}.avue-card__body{padding:24px;display:flex}.avue-card__detail{flex:1}.avue-card__avatar{border-radius:48px;width:48px;height:48px;margin-right:12px;overflow:hidden}.avue-card__avatar img{width:100%;height:100%}.avue-card__title{color:rgba(0,0,0,.85);margin-bottom:12px;font-size:16px}.avue-card__title:hover{color:#1890ff}.avue-card__info{color:rgba(0,0,0,.45);-webkit-line-clamp:3;-webkit-box-orient:vertical;height:64px;display:flex;overflow:hidden}.avue-card__menu{color:rgba(0,0,0,.45);text-align:center;background:#f7f9fa;justify-content:space-around;height:50px;line-height:50px;display:flex}.avue-card__menu:hover{color:#1890ff}

package/carousel/index.mjs

@@ -0,0 +1,70 @@
+import { n } from "../chunks/vueComponentNormalizer.JwmUNtgn.mjs";
+var l = function() {
+  var t = this, o = t.$createElement, e = t._self._c || o;
+  return e("div", {
+    class: ["avue-carousel", {
+      "avue-carousel--fullscreen": t.option.fullscreen
+    }]
+  }, [e("ElCarousel", {
+    attrs: {
+      type: t.option.type,
+      height: `${t.option.height}px`,
+      autoplay: t.option.autoplay,
+      interval: t.option.interval,
+      "indicator-position": "outside"
+    }
+  }, t._l(t.data, function(a, s) {
+    return e("ElCarouselItem", {
+      key: s
+    }, [e("div", {
+      staticClass: "avue-carousel__item"
+    }, [e("a", {
+      attrs: {
+        href: a.href ? a.href : "javascript:void(0);",
+        target: a.target
+      }
+    }, [e("div", {
+      staticClass: "avue-carousel__img",
+      style: {
+        backgroundImage: `url(${a.src})`
+      }
+    }), a.title ? e("div", {
+      staticClass: "avue-carousel__title"
+    }, [t._v(t._s(a.title))]) : t._e()])])]);
+  }), 1)], 1);
+}, i = [];
+const u = {
+  name: "Carousel",
+  props: {
+    option: {
+      type: Object,
+      default: () => {
+      }
+    }
+  },
+  computed: {
+    data() {
+      return this.option.data || [];
+    }
+  }
+}, r = {};
+var c = /* @__PURE__ */ n(
+  u,
+  l,
+  i,
+  !1,
+  _,
+  null,
+  null,
+  null
+);
+function _(t) {
+  for (let o in r)
+    this[o] = r[o];
+}
+const v = /* @__PURE__ */ function() {
+  return c.exports;
+}();
+export {
+  v as default
+};

package/carousel/style.css

@@ -0,0 +1 @@
+.avue-carousel--fullscreen{height:100%}.avue-carousel--fullscreen .el-carousel,.avue-carousel--fullscreen .el-carousel__container{height:90%}.avue-carousel__item{width:100%;height:100%;position:relative}.avue-carousel__item a{width:100%;height:100%;display:block}.avue-carousel__img{background-position:50%;background-size:cover;height:100%}.avue-carousel__title{z-index:1024;color:#fff;text-align:center;background-color:rgba(0,0,0,.6);width:100%;height:50px;font-size:16px;line-height:50px;position:absolute;bottom:0;left:0}