mine-h5-ui/es/MeNoticeBar/index.vue.js

一款轻量级、模块化基于 Vue3.x 的 H5 前端 UI 组件库 👍

import { defineComponent as v, openBlock as i, createElementBlock as c, normalizeStyle as a, createElementVNode as l, unref as n, normalizeClass as k, Fragment as x, renderList as B, toDisplayString as m, createBlock as b, Transition as z, withCtx as I } from "vue";
import { useAnimate as L, useBtns as S } from "./hooks.js";
const A = { class: "notice" }, D = ["onClick"], M = /* @__PURE__ */ v({
  name: "MeNoticeBar",
  __name: "index",
  props: {
    list: {},
    scroll: { default: "horizontal" },
    loop: { type: Boolean, default: !1 },
    delay: { default: 3e3 },
    preappendIcon: { default: "notice" },
    preappendColor: { default: "#f56c6c" },
    appendIcon: { default: "right1" },
    appendColor: { default: "#c8c7cc" },
    height: { default: 40 },
    radius: { default: 4 },
    background: { default: "#f6f6f6" },
    color: { default: "#494949" }
  },
  emits: ["click", "click:preappend", "click:append"],
  setup(e, { emit: C }) {
    const y = C, $ = e, { noticeList: g, left: h, listData: d, listIndex: r } = L($), { onClick: s, onClickPreappend: u, onClickAppend: p } = S(y);
    return (E, o) => (i(), c("div", {
      class: "me-notice-bar",
      style: a(`height:${e.height}px;border-radius:${e.radius + (String(e.radius).includes("px") ? "" : "px")};background:${e.background};`)
    }, [
      l("div", {
        class: "icon icon-preappend",
        style: a(`color:${e.preappendColor};`),
        onClick: o[0] || (o[0] = //@ts-ignore
        (...t) => n(u) && n(u)(...t))
      }, [
        l("i", {
          class: k(`iconfont icon-${e.preappendIcon}`)
        }, null, 2)
      ], 4),
      l("div", A, [
        e.scroll === "horizontal" ? (i(), c("ul", {
          key: 0,
          ref_key: "noticeList",
          ref: g,
          class: "notice-horizontal",
          style: a(`left:${n(h)}px;color:${e.color};`)
        }, [
          (i(!0), c(x, null, B(n(d), (t, f) => (i(), c("li", {
            key: f,
            onClick: (N) => n(s)(f)
          }, [
            l("span", null, m(t), 1)
          ], 8, D))), 128))
        ], 4)) : (i(), b(z, {
          key: 1,
          name: "slide",
          mode: "out-in"
        }, {
          default: I(() => [
            (i(), c("div", {
              key: n(r),
              class: "notice-vertical",
              style: a(`color:${e.color};`),
              onClick: o[1] || (o[1] = (t) => n(s)(n(r)))
            }, [
              l("span", null, m(n(d)[n(r)]), 1)
            ], 4))
          ]),
          _: 1
        }))
      ]),
      l("div", {
        class: "icon icon-append",
        style: a(`color:${e.appendColor};`),
        onClick: o[2] || (o[2] = //@ts-ignore
        (...t) => n(p) && n(p)(...t))
      }, [
        l("i", {
          class: k(`iconfont icon-${e.appendIcon}`)
        }, null, 2)
      ], 4)
    ], 4));
  }
});
export {
  M as default
};