77 lines
5.0 KiB
JavaScript
77 lines
5.0 KiB
JavaScript
|
import { w as withInstall } from "../badge/index2.js";
|
||
|
import { defineComponent, computed, openBlock, createElementBlock, normalizeClass, unref, normalizeStyle, createCommentVNode, renderSlot } from "vue";
|
||
|
var index = /* @__PURE__ */ (() => ":root{--button-primary-text-color: #fff;--button-primary-background-color: var(--global-primary-color);--button-primary-border-color: var(--global-primary-color);--button-normal-text-color: #fff;--button-normal-background-color: var(--global-normal-color);--button-normal-border-color: var(--global-normal-color);--button-warm-text-color: #fff;--button-warm-background-color: var(--global-warm-color);--button-warm-border-color: var(--global-warm-color);--button-danger-text-color: #fff;--button-danger-background-color: var(--global-danger-color);--button-danger-border-color: var(--global-danger-color);--button-border-radius: var(--global-border-radius);--button-border-color: var(--global-neutral-color-6);--button-background-color: 0 0;--button-text-color: #666}.layui-btn{height:38px;line-height:36px;padding:0 18px;font-size:14px;text-align:center;white-space:nowrap;color:var(--button-text-color);background:var(--button-background-color);border-radius:var(--button-border-radius);border-color:var(--button-border-color);border-width:1px;border-style:solid;cursor:pointer}.layui-btn-primary{color:var(--button-primary-text-color);background-color:var(--button-primary-background-color);border-color:var(--button-primary-border-color)}.layui-btn-normal{color:var(--button-normal-text-color);background-color:var(--button-normal-background-color);border-color:var(--button-normal-border-color)}.layui-btn-warm{color:var(--button-warm-text-color);background-color:var(--button-warm-background-color);border-color:var(--button-warm-border-color)}.layui-btn-danger{color:var(--button-danger-text-color);background-color:var(--button-danger-background-color);border-color:var(--button-danger-border-color)}.layui-btn:hover{opacity:.8;filter:alpha(opacity=80)}.layui-btn:active{opacity:1;filter:alpha(opacity=100)}.layui-btn-lg{height:44px;line-height:44px;padding:0 25px;font-size:16px}.layui-btn-sm{height:30px;line-height:30px;padding:0 10px;font-size:12px}.layui-btn-xs{height:22px;line-height:22px;padding:0 5px;font-size:12px}.layui-btn-xs i{font-size:12px!important}.layui-btn-fluid{width:100%}.layui-btn-radius{border-radius:100px}.layui-btn-disabled,.layui-btn-disabled:active,.layui-btn-disabled:hover{border-color:#eee!important;background-color:#fbfbfb!important;color:#d2d2d2!important;cursor:not-allowed!important;opacity:1}.layui-btn+.layui-btn{margin-left:10px}.layui-btn .layui-icon{padding:0 2px;vertical-align:middle\\ ;vertical-align:bottom}\n")();
|
||
|
const ButtonEmits = {
|
||
|
click: (evt) => evt instanceof MouseEvent
|
||
|
};
|
||
|
const _hoisted_1 = ["type"];
|
||
|
const __default__ = {
|
||
|
name: "LayButton"
|
||
|
};
|
||
|
const _sfc_main = defineComponent({
|
||
|
...__default__,
|
||
|
props: {
|
||
|
type: null,
|
||
|
size: null,
|
||
|
prefixIcon: null,
|
||
|
suffixIcon: null,
|
||
|
loadingIcon: { default: "layui-icon-loading-one" },
|
||
|
borderStyle: { default: "soild" },
|
||
|
border: null,
|
||
|
fluid: { type: Boolean, default: false },
|
||
|
radius: { type: Boolean, default: false },
|
||
|
loading: { type: Boolean, default: false },
|
||
|
disabled: { type: Boolean },
|
||
|
nativeType: { default: "button" }
|
||
|
},
|
||
|
emits: ButtonEmits,
|
||
|
setup(__props, { emit: emits }) {
|
||
|
const props = __props;
|
||
|
const onClick = (event) => {
|
||
|
if (!props.disabled) {
|
||
|
emits("click", event);
|
||
|
}
|
||
|
};
|
||
|
const styles = computed(() => {
|
||
|
return {
|
||
|
border: `1px ${props.borderStyle}`
|
||
|
};
|
||
|
});
|
||
|
const classes = computed(() => {
|
||
|
return [
|
||
|
{
|
||
|
"layui-btn-fluid": props.fluid,
|
||
|
"layui-btn-radius": props.radius,
|
||
|
"layui-btn-disabled": props.disabled
|
||
|
},
|
||
|
props.type ? `layui-btn-${props.type}` : "",
|
||
|
props.size ? `layui-btn-${props.size}` : "",
|
||
|
props.border ? `layui-border-${props.border}` : ""
|
||
|
];
|
||
|
});
|
||
|
return (_ctx, _cache) => {
|
||
|
return openBlock(), createElementBlock("button", {
|
||
|
class: normalizeClass(["layui-btn", unref(classes)]),
|
||
|
style: normalizeStyle(unref(styles)),
|
||
|
type: __props.nativeType,
|
||
|
onClick
|
||
|
}, [
|
||
|
__props.prefixIcon ? (openBlock(), createElementBlock("i", {
|
||
|
key: 0,
|
||
|
class: normalizeClass(`layui-icon ${__props.prefixIcon}`)
|
||
|
}, null, 2)) : createCommentVNode("", true),
|
||
|
__props.loading ? (openBlock(), createElementBlock("i", {
|
||
|
key: 1,
|
||
|
class: normalizeClass([__props.loadingIcon, "layui-icon layui-anim layui-anim-rotate layui-anim-loop"])
|
||
|
}, null, 2)) : renderSlot(_ctx.$slots, "default", { key: 2 }),
|
||
|
__props.suffixIcon ? (openBlock(), createElementBlock("i", {
|
||
|
key: 3,
|
||
|
class: normalizeClass(`layui-icon ${__props.suffixIcon}`)
|
||
|
}, null, 2)) : createCommentVNode("", true)
|
||
|
], 14, _hoisted_1);
|
||
|
};
|
||
|
}
|
||
|
});
|
||
|
const component = withInstall(_sfc_main);
|
||
|
export { _sfc_main as _, component as c };
|