tass-ui
Version:
A high quality UI Toolkit built on Vue.js3+.
102 lines (101 loc) • 3.61 kB
JavaScript
import { defineComponent, useSlots, openBlock, createElementBlock, normalizeClass, createElementVNode, Fragment, renderList, normalizeStyle, unref, renderSlot, toDisplayString, createCommentVNode } from "vue";
import "../../../theme-chalk/src/table.scss.mjs";
const _hoisted_1 = { key: 0 };
const _hoisted_2 = { key: 1 };
const _hoisted_3 = { key: 1 };
const _sfc_main = /* @__PURE__ */ defineComponent({
__name: "table",
props: {
// 传入数据,object类型
options: {
type: Object,
default: () => {
return {
// options定义的参数名字,对应name
fileds: [],
// 数据
datas: []
};
}
},
// 尺寸
size: {
type: String,
default: "default"
},
// 是否显示表头
showHeader: {
type: Boolean,
default: true
},
// 表头样式
headStyle: {
type: Object,
default: () => {
return {};
}
},
// 表格内容样式
rowStyle: {
type: Object,
default: () => {
return {};
}
},
customClass: String
},
setup(__props) {
const $slot = useSlots();
return (_ctx, _cache) => {
return openBlock(), createElementBlock("div", {
class: normalizeClass([`tas-table-${__props.size}`, __props.customClass])
}, [
createElementVNode("table", null, [
__props.showHeader ? (openBlock(), createElementBlock("thead", _hoisted_1, [
createElementVNode("tr", null, [
(openBlock(true), createElementBlock(Fragment, null, renderList(__props.options.fileds, (x, index) => {
return openBlock(), createElementBlock("th", {
key: index,
style: normalizeStyle([__props.headStyle, { "text-align": x.align }])
}, [
unref($slot)["head-" + x.field] ? renderSlot(_ctx.$slots, "head-" + x.field, {
key: 0,
scope: x
}) : (openBlock(), createElementBlock("div", _hoisted_2, toDisplayString(x.title), 1))
], 4);
}), 128))
])
])) : createCommentVNode("", true),
createElementVNode("tbody", null, [
(openBlock(true), createElementBlock(Fragment, null, renderList(__props.options.datas, (v, i) => {
return openBlock(), createElementBlock("tr", { key: i }, [
(openBlock(true), createElementBlock(Fragment, null, renderList(__props.options.fileds, (m, j) => {
return openBlock(), createElementBlock("td", {
key: j,
style: normalizeStyle(
[
__props.rowStyle,
{
width: __props.options.fileds[j].width ? __props.options.fileds[j].width : "",
"text-align": __props.options.fileds[j].align
}
]
)
}, [
unref($slot)[__props.options.fileds[j].field] ? renderSlot(_ctx.$slots, __props.options.fileds[j].field, {
key: 0,
scope: { rowIndex: i, cellIndex: j, row: v }
}) : (openBlock(), createElementBlock("div", _hoisted_3, toDisplayString(__props.options.datas[i][__props.options.fileds[j].field]), 1))
], 4);
}), 128))
]);
}), 128))
])
])
], 2);
};
}
});
export {
_sfc_main as default
};