tass-ui
Version:
A high quality UI Toolkit built on Vue.js3+.
93 lines (92 loc) • 2.98 kB
JavaScript
;
Object.defineProperties(exports, { __esModule: { value: true }, [Symbol.toStringTag]: { value: "Module" } });
const vue = require("vue");
require("../../../theme-chalk/src/alert.scss.js");
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__ */ vue.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 = vue.ref(true);
const alertClassNames = vue.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 = vue.computed(() => {
const { type } = props;
return iconMaps[type];
});
const handltaslose = () => {
isShow.value = false;
emit("close");
};
return (_ctx, _cache) => {
const _component_tass_icon = vue.resolveComponent("tass-icon");
return vue.openBlock(), vue.createBlock(vue.Transition, { name: "tas-alert-fade" }, {
default: vue.withCtx(() => [
isShow.value ? (vue.openBlock(), vue.createElementBlock("div", {
key: 0,
class: vue.normalizeClass([vue.unref(alertClassNames), "tas-alert"])
}, [
__props.showIcon ? (vue.openBlock(), vue.createBlock(_component_tass_icon, {
key: 0,
name: vue.unref(iconName),
class: "tas-alert__icon"
}, null, 8, ["name"])) : vue.createCommentVNode("", true),
vue.createElementVNode("div", _hoisted_1, [
vue.createElementVNode("h3", _hoisted_2, vue.toDisplayString(__props.title), 1),
__props.content ? (vue.openBlock(), vue.createElementBlock("p", _hoisted_3, vue.toDisplayString(__props.content), 1)) : vue.createCommentVNode("", true),
__props.closeable ? (vue.openBlock(), vue.createBlock(_component_tass_icon, {
key: 1,
name: "cross",
class: "tas-alert__close-btn",
onClick: handltaslose
})) : vue.createCommentVNode("", true)
])
], 2)) : vue.createCommentVNode("", true)
]),
_: 1
});
};
}
});
exports.default = _sfc_main;