tms-vue3-ui
Version:
Vue3基础UI库，提供JSONSchema编辑器，支持基于JSONSchema生成表单。
105 lines (104 loc) • 2.65 kB
JavaScript
import { createVNode as e, mergeProps as d, resolveComponent as l } from "vue";
function y(u) {
u.component("tms-card", {
props: {
thumb: {
type: [String, Boolean]
},
title: {
type: String
},
desc: {
type: String
},
gap: {
type: Number,
default: 2
},
gapMain: {
type: Number,
default: 2
},
gapContent: {
type: Number,
default: 2
},
backColor: {
type: String,
default: "#ffffff"
},
descColor: {
type: String,
default: "#666666"
},
url: {
type: String
},
to: {
type: Object
}
},
render() {
const t = this.$slots, o = this.$props, {
title: m,
desc: p,
backColor: f,
descColor: h,
to: s,
url: a
} = o, n = o.thumb === "" ? null : o.thumb, r = this;
function g() {
a ? location.href = a : s && r.$parent && r.$parent.$router && r.$parent.$router.push(s);
}
return e("div", d({
class: "tms-card",
onClick: g
}, {
style: {
backgroundColor: f
}
}), [e(l("tms-flex"), {
direction: "column",
gap: this.gap
}, {
default: () => {
var c;
return [t.header ? e("header", null, [t.header()]) : "", e("main", null, [e(l("tms-flex"), {
elasticItems: [1],
gap: this.gapMain
}, {
default: () => [n === !1 ? "" : e("div", {
class: "tms-card__thumb"
}, [t.thumb ? t.thumb() : e("img", {
src: n
}, null)]), e("div", {
class: "tms-card__content"
}, [e(l("tms-flex"), {
direction: "column",
elasticItems: [1],
gap: this.gapContent
}, {
default: () => {
var i;
return [e("div", {
class: "tms-card__title"
}, [t.title ? t.title() : m]), e("div", d({
class: "tms-card__desc"
}, {
style: {
color: h
}
}), [t.desc ? t.desc() : p]), t.bottom ? e("div", {
class: "tms-card__bottom"
}, [(i = t.bottom) == null ? void 0 : i.call(t)]) : ""];
}
})])]
})]), t.footer ? e("footer", null, [(c = t.footer) == null ? void 0 : c.call(t)]) : ""];
}
})]);
}
});
}
export {
y as default
};