@wfrog/vc/es/components/switch/index.mjs

`自用` 的基于 `element-plus` 二次封装的 `vue3` 组件库。追求在业务场景中，尽可能使用更少的代码量来实现需求。 因此在组件封装上，以 `方便` 为主，打包仅 `esm` 模式。

import './index.css'
// vue-script:D:\project\_my\vc\src\components\switch\index.vue?type=script
import { defineComponent as _defineComponent } from "vue";
import { unref as _unref, isRef as _isRef, mergeProps as _mergeProps, openBlock as _openBlock, createBlock as _createBlock, createVNode as _createVNode, normalizeClass as _normalizeClass, createElementVNode as _createElementVNode, withCtx as _withCtx } from "vue";
import { ElPopconfirm, ElSwitch } from "element-plus";
import { computed, onMounted, ref } from "vue";
var switch_default = /* @__PURE__ */ _defineComponent({
  __name: "index",
  props: {
    modelValue: { type: null, required: true },
    confirmTitle: { type: String, required: false, default: "\u786E\u8BA4\u5207\u6362\u5417\uFF1F" },
    disabled: { type: Boolean, required: false, default: false },
    className: { type: String, required: false, default: "" },
    confirm: { type: Boolean, required: false, default: false }
  },
  emits: ["update:modelValue", "change"],
  setup(__props, { emit }) {
    const props = __props;
    const mainEle = ref();
    const getSwitchEle = () => {
      if (!mainEle.value) {
        return;
      }
      const ele = mainEle.value.getElementsByClassName("h-switch")[0];
      return ele;
    };
    const handleConfirm = () => getSwitchEle()?.click();
    const myValue = computed({
      get: () => props.modelValue,
      set: (val) => emit("update:modelValue", val)
    });
    onMounted(() => {
      getSwitchEle()?.addEventListener("click", (event) => {
        event.stopPropagation();
      });
    });
    return (_ctx, _cache) => {
      return __props.disabled || !__props.confirm ? (_openBlock(), _createBlock(_unref(ElSwitch), _mergeProps({
        key: 0,
        modelValue: _unref(myValue),
        "onUpdate:modelValue": _cache[0] || (_cache[0] = ($event) => _isRef(myValue) ? myValue.value = $event : null),
        class: __props.className
      }, _ctx.$attrs, { disabled: __props.disabled }), null, 16, ["modelValue", "class", "disabled"])) : (_openBlock(), _createBlock(_unref(ElPopconfirm), {
        key: 1,
        title: __props.confirmTitle,
        onConfirm: handleConfirm
      }, {
        reference: _withCtx(() => [
          _createElementVNode("span", {
            ref_key: "mainEle",
            ref: mainEle,
            class: _normalizeClass(_ctx.$style.main)
          }, [
            _createVNode(_unref(ElSwitch), _mergeProps({
              modelValue: _unref(myValue),
              "onUpdate:modelValue": _cache[1] || (_cache[1] = ($event) => _isRef(myValue) ? myValue.value = $event : null),
              class: ["h-switch", __props.className]
            }, _ctx.$attrs), null, 16, ["modelValue", "class"])
          ], 2)
        ]),
        _: 1
      }, 8, ["title"]));
    };
  }
});

// vue-style:D:\project\_my\vc\src\components\switch\index.vue?type=style&index=0&isModule=true&isNameImport=true
var switch_default2 = { main: "_main_5oj5r_1" };

// src/components/switch/index.vue
var cssModules = {};
switch_default.__cssModules = cssModules = {};
cssModules["$style"] = switch_default2;
var switch_default3 = switch_default;
export {
  switch_default3 as default
};