tass-ui
Version:
A high quality UI Toolkit built on Vue.js3+.
93 lines (92 loc) • 2.94 kB
JavaScript
import { defineComponent, ref, computed, resolveComponent, openBlock, createBlock, Transition, withCtx, createElementBlock, normalizeClass, unref, createCommentVNode, createElementVNode, toDisplayString } from "vue";
import "../../../theme-chalk/src/alert.scss.mjs";
const _hoisted_1 = { class: "tas-alert__content" };
const _hoisted_2 = { class: "tas-alert__title tas-global-ellipsis" };
const _hoisted_3 = {
key: 0,
class: "tas-alert__desc"
};
const _sfc_main = /* @__PURE__ */ defineComponent({
__name: "alert",
props: {
type: {
type: String,
default: () => "info",
validator: (val) => ["info", "success", "error", "warning"].includes(val)
},
title: {
type: String,
default: "请绑定title"
},
showIcon: {
type: Boolean,
default: false
},
closeable: {
type: Boolean,
default: false
},
content: {
type: String,
default: ""
},
center: {
type: Boolean,
default: false
}
},
emits: ["close"],
setup(__props, { emit }) {
const props = __props;
const isShow = ref(true);
const alertClassNames = computed(() => {
const { type, center } = props;
return [{ [`tas-alert--${type}`]: type }, { "is-center": center }];
});
const iconMaps = {
info: "info",
success: "success",
error: "danger",
warning: "warning"
};
const iconName = computed(() => {
const { type } = props;
return iconMaps[type];
});
const handltaslose = () => {
isShow.value = false;
emit("close");
};
return (_ctx, _cache) => {
const _component_tass_icon = resolveComponent("tass-icon");
return openBlock(), createBlock(Transition, { name: "tas-alert-fade" }, {
default: withCtx(() => [
isShow.value ? (openBlock(), createElementBlock("div", {
key: 0,
class: normalizeClass([unref(alertClassNames), "tas-alert"])
}, [
__props.showIcon ? (openBlock(), createBlock(_component_tass_icon, {
key: 0,
name: unref(iconName),
class: "tas-alert__icon"
}, null, 8, ["name"])) : createCommentVNode("", true),
createElementVNode("div", _hoisted_1, [
createElementVNode("h3", _hoisted_2, toDisplayString(__props.title), 1),
__props.content ? (openBlock(), createElementBlock("p", _hoisted_3, toDisplayString(__props.content), 1)) : createCommentVNode("", true),
__props.closeable ? (openBlock(), createBlock(_component_tass_icon, {
key: 1,
name: "cross",
class: "tas-alert__close-btn",
onClick: handltaslose
})) : createCommentVNode("", true)
])
], 2)) : createCommentVNode("", true)
]),
_: 1
});
};
}
});
export {
_sfc_main as default
};