l-element-components/Trend/index.js

import { defineComponent as p, useSlots as f, computed as g, createElementBlock as a, openBlock as n, createElementVNode as s, renderSlot as C, unref as l, normalizeStyle as d, toDisplayString as m, createBlock as u, resolveDynamicComponent as i } from "vue";
const y = (e) => e.replace(/(A-Z)g/, "-$1").toLocaleLowerCase(), v = { class: "trend" }, x = { class: "text" }, S = { class: "icon" }, w = /* @__PURE__ */ p({
  __name: "index",
  props: {
    //标记当前的趋势是上升还是下降
    type: {
      type: String,
      default: "up"
    },
    upIcon: {
      type: String,
      default: "arrowupbold"
    },
    downIcon: {
      type: String,
      default: "arrowdownbold"
    },
    //趋势显示文字
    //1.父组件传递过来的数据
    //2.插槽
    text: {
      type: String,
      default: "文字"
    },
    //颜色翻转只在默认的颜色下生效，如果使用了自定义颜色，这个属性就不生效了
    reverseColor: {
      type: Boolean,
      default: !1
    },
    //上升趋势图标颜色
    upIconColor: {
      type: String,
      default: "red"
    },
    downIconColor: {
      type: String,
      default: "green"
    },
    upTextColor: {
      type: String,
      default: "rgb(0,0,0)"
    },
    downTextColor: {
      type: String,
      default: "rgb(0,0,0)"
    }
  },
  setup(e) {
    let t = e, o = f(), r = g(() => t.type === "up" ? t.upTextColor : t.downTextColor);
    return (c, T) => (n(), a("div", v, [
      s("div", x, [
        l(o).default ? C(c.$slots, "default", { key: 0 }, void 0, !0) : (n(), a(
          "div",
          {
            key: 1,
            style: d({ color: l(r) })
          },
          m(e.text),
          5
          /* TEXT, STYLE */
        ))
      ]),
      s("div", S, [
        e.type === "up" ? (n(), u(i(`el-icon-${l(y)(e.upIcon)}`), {
          key: 0,
          style: d({ color: e.reverseColor ? "green" : e.upIconColor })
        }, null, 8, ["style"])) : (n(), u(i(`el-icon-${l(y)(e.downIcon)}`), {
          key: 1,
          style: d({ color: e.reverseColor ? "red" : e.downIconColor })
        }, null, 8, ["style"]))
      ])
    ]));
  }
}), I = (e, t) => {
  const o = e.__vccOpts || e;
  for (const [r, c] of t)
    o[r] = c;
  return o;
}, k = /* @__PURE__ */ I(w, [["__scopeId", "data-v-62892805"]]), h = {
  install(e) {
    e.component("l-trend", k);
  }
};
export {
  h as default
};