uv-ui/es/components/popup/popup.js

基于vue3的移动端组件库

import { computed as g, openBlock as l, createElementBlock as n, withModifiers as i, createVNode as u, unref as s, Transition as k, withCtx as C, withDirectives as S, createElementVNode as a, normalizeClass as V, normalizeStyle as B, toDisplayString as d, createCommentVNode as c, renderSlot as b, vShow as w } from "vue";
import N from "../icon/index.js";
import E from "../overlay/index.js";
import "./popup.vue_vue_type_style_index_0_lang.js";
const O = { class: "uv-popup-content" }, x = {
  key: 0,
  class: "uv-popup-content-top"
}, z = {
  key: 0,
  class: "uv-popup-content-title"
}, $ = {
  key: 1,
  class: "uv-popup-content-close"
}, D = { class: "uv-popup-content-item" }, P = {
  key: 1,
  class: "uv-popup-content-button"
}, T = ["onClick"], U = ["onClick"], j = {
  name: "UvPopup"
}, F = /* @__PURE__ */ Object.assign(j, {
  props: {
    modelValue: {
      type: Boolean,
      default: !1
    },
    position: {
      type: String,
      default: "bottom"
    },
    bgColor: {
      type: String,
      default: "#fff"
    },
    round: {
      type: Boolean,
      default: !1
    },
    padding: {
      type: Boolean,
      default: !0
    },
    overlay: {
      type: Boolean,
      default: !0
    },
    clickOverlayClose: {
      type: Boolean,
      default: !0
    },
    height: {
      type: String,
      default: "auto"
    },
    action: {
      type: Boolean,
      default: !1
    },
    title: {
      type: String,
      default: ""
    },
    close: {
      type: Boolean,
      default: !1
    },
    leftName: {
      type: String,
      default: "\u53D6\u6D88"
    },
    rightName: {
      type: String,
      default: "\u786E\u5B9A"
    }
  },
  emits: ["update:modelValue", "cancle", "confim", "close"],
  setup(e, { emit: t }) {
    const o = e, r = g(() => [
      "uv-popup-wrap",
      o.position ? `uv-popup-${o.position}` : "",
      o.round ? `uv-popup-${o.position}-round` : ""
    ]), v = () => {
      o.clickOverlayClose && t("update:modelValue", !1);
    }, f = () => {
      t("cancle"), t("update:modelValue", !1);
    }, m = () => {
      t("confim");
    }, y = () => {
      t("close"), t("update:modelValue", !1);
    };
    return (h, p) => (l(), n("div", {
      class: "uv-popup",
      onTouchmove: p[0] || (p[0] = i(() => {
      }, ["prevent"]))
    }, [
      u(s(E), {
        overlay: e.overlay,
        show: e.modelValue,
        onClick: v
      }, null, 8, ["overlay", "show"]),
      u(k, {
        name: "uv-popup-slide-" + e.position
      }, {
        default: C(() => [
          S(a("div", {
            class: V(s(r)),
            style: B({ height: e.height, backgroundColor: e.bgColor, padding: e.padding ? "10px" : "none" })
          }, [
            a("div", O, [
              e.title || e.close ? (l(), n("div", x, [
                e.title ? (l(), n("div", z, d(e.title), 1)) : c("", !0),
                e.close ? (l(), n("div", $, [
                  u(s(N), {
                    onClick: y,
                    name: "close",
                    size: "28",
                    color: "#c8c9cc"
                  })
                ])) : c("", !0)
              ])) : c("", !0),
              a("div", D, [
                b(h.$slots, "default")
              ]),
              e.action ? (l(), n("div", P, [
                a("div", {
                  class: "uv-popup-content-button-cancle",
                  onClick: i(f, ["stop"])
                }, d(e.leftName), 9, T),
                a("div", {
                  class: "uv-popup-content-button-confim",
                  onClick: i(m, ["stop"])
                }, d(e.rightName), 9, U)
              ])) : c("", !0)
            ])
          ], 6), [
            [w, e.modelValue]
          ])
        ]),
        _: 3
      }, 8, ["name"])
    ], 32));
  }
});
export {
  F as default
};