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

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

import { defineComponent as f, useModel as y, openBlock as l, createElementBlock as o, normalizeStyle as n, Fragment as k, renderList as C, unref as i, createBlock as g, toDisplayString as h, createCommentVNode as z, mergeModels as d } from "vue";
import B from "../MeIcon/index.vue.js";
import { useHandler as V } from "./hooks.js";
const b = ["data-disabled"], D = /* @__PURE__ */ f({
  name: "MeRate",
  __name: "index",
  props: /* @__PURE__ */ d({
    icon: { default: "icon-star4" },
    iconSelect: { default: "icon-star3" },
    color: { default: "#fed835" },
    count: { default: 5 },
    readonly: { type: Boolean, default: !1 },
    disabled: { type: Boolean, default: !1 },
    tips: { default: () => ["非常不满意", "不满意", "一般", "满意", "非常满意"] },
    tipsColor: { default: "" },
    size: { default: "" }
  }, {
    modelValue: { default: 0 },
    modelModifiers: {}
  }),
  emits: /* @__PURE__ */ d(["change"], ["update:modelValue"]),
  setup(e, { emit: s }) {
    const c = s, r = e, a = y(e, "modelValue"), { listData: u, onClick: m } = V({ props: r, emit: c, modelValue: a });
    return (p, v) => (l(), o("div", {
      class: "me-rate",
      style: n(`font-size:${e.size};`),
      "data-disabled": e.disabled
    }, [
      (l(!0), o(k, null, C(i(u), (t) => (l(), g(B, {
        key: t.id,
        name: t.state ? e.iconSelect : e.icon,
        size: "inherit",
        color: t.state ? e.color : "#949494",
        onClick: (M) => i(m)(t)
      }, null, 8, ["name", "color", "onClick"]))), 128)),
      e.tips.length > 0 && a.value > 0 ? (l(), o("span", {
        key: 0,
        class: "tips",
        style: n(`color:${e.tipsColor};`)
      }, h(e.tips[a.value - 1]), 5)) : z("", !0)
    ], 12, b));
  }
});
export {
  D as default
};