UNPKG

@layui/layui-vue

Version:

a component library for Vue 3 base on layui-vue

26 lines (25 loc) 5.83 kB
import { defineComponent as F, inject as O, computed as y, resolveComponent as X, openBlock as d, createElementBlock as s, Fragment as r, createElementVNode as N, normalizeStyle as Y, normalizeClass as I, withModifiers as _, unref as t, renderList as M, createBlock as o, withCtx as c, mergeProps as p, createCommentVNode as x, createTextVNode as B, toDisplayString as S, createVNode as f } from "vue"; import k from "../../../_components/render.js"; import $ from "../../../checkboxV2/index2.js"; import q from "../../../radio/index2.js"; import E from "../../../tooltip/index2.js"; import { LAY_TABLE_CONTEXT as G, columnsTypeList as H } from "../../constant.js"; import g from "./TableMainTd.js"; const J = { key: 1 }, Q = { key: 0, class: "layui-table-cell-expand" }, U = ["colspan"], le = F({ name: "LayTableMain", __name: "TableMain", props: { id: {}, index: {}, data: {}, page: {}, columns: {}, indentSize: {}, currentIndentSize: {}, expandSpace: { type: Boolean }, expandIndex: {}, cellStyle: {}, cellClassName: {}, rowStyle: {}, rowClassName: {}, spanMethod: {}, defaultExpandAll: { type: Boolean }, getCheckboxProps: {}, getRadioProps: {}, childrenColumnName: { default: "children" } }, setup(P) { const n = P, { tableEmits: w, tableSlots: u, selectedState: m, expandState: L } = O(G), C = y(() => L.checkExpand(n.data[n.id])); function A(e, l) { return typeof n.rowClassName == "string" ? n.rowClassName : n.rowClassName(e, l); } const V = y(() => n.currentIndentSize + n.indentSize), D = y(() => n.getRadioProps(n.data, n.index)), K = y(() => n.getCheckboxProps(n.data, n.index)); return (e, l) => { const R = X("LayTableMain"); return d(), s(r, null, [N("tr", { style: Y([(h = e.data, z = e.index, typeof n.rowStyle == "string" ? n.rowStyle : n.rowStyle(h, z))]), class: I([A(e.data, e.index)]), onClick: l[2] || (l[2] = _((a) => t(w)("row", e.data, a), ["stop"])), onDblclick: l[3] || (l[3] = (a) => t(w)("row-double", e.data, a)), onContextmenu: l[4] || (l[4] = _((a) => t(w)("row-contextmenu", e.data, a), ["stop"])) }, [(d(!0), s(r, null, M(e.columns, (a, i) => (d(), s(r, { key: a.key || a.type }, [a.type && t(H).includes(a.type) ? (d(), o(t(g), { key: 0, class: I(`layui-table-cell-${a.type}`), data: e.data, column: a, "data-index": e.index, "column-index": i, "expand-space": e.expandSpace, "expand-index": e.expandIndex, "current-indent-size": e.currentIndentSize }, { default: c(() => { var b, v, T; return [a.type === "radio" ? (d(), o(q, p({ key: 0, "model-value": t(m).tableSelectedKey.value }, D.value, { value: e.data[e.id], onChange: l[0] || (l[0] = () => t(m).toggleSelected(e.data[e.id])) }), null, 16, ["model-value", "value"])) : x("", !0), a.type === "checkbox" ? (d(), o($, p({ key: 1, "model-value": t(m).tableMSelectedKeys.includes(e.data[e.id]) }, K.value, { value: e.data[e.id], skin: "primary", onChange: l[1] || (l[1] = (j) => t(m).toggleMSelected(e.data, j)) }), null, 16, ["model-value", "value"])) : x("", !0), a.type === "number" ? (d(), s(r, { key: 2 }, [B(S((b = e.page) != null && b.current ? (((v = e.page) == null ? void 0 : v.current) - 1) * ((T = e.page) == null ? void 0 : T.limit) + e.index + 1 : e.index + 1), 1)], 64)) : x("", !0)]; }), _: 2 }, 1032, ["class", "data", "column", "data-index", "column-index", "expand-space", "expand-index", "current-indent-size"])) : (d(), s(r, { key: 1 }, [a.customSlot ? (d(), o(t(g), { key: 0, data: e.data, column: a, "data-index": e.index, "column-index": i, "expand-space": e.expandSpace, "expand-index": e.expandIndex, "current-indent-size": e.currentIndentSize }, { default: c(() => [a.ellipsisTooltip ? (d(), o(E, p({ key: 0, "is-auto-show": !0, "is-dark": a.ellipsisTooltipTheme === "dark" }, a.ellipsisTooltipProps), { content: c(() => [f(t(k), { row: e.data, data: e.data, column: a, "row-index": e.index, "column-index": i, render: a.customSlot, slots: t(u) }, null, 8, ["row", "data", "column", "row-index", "column-index", "render", "slots"])]), default: c(() => [f(t(k), { row: e.data, data: e.data, column: a, "row-index": e.index, "column-index": i, render: a.customSlot, slots: t(u) }, null, 8, ["row", "data", "column", "row-index", "column-index", "render", "slots"])]), _: 2 }, 1040, ["is-dark"])) : (d(), o(t(k), { key: 1, row: e.data, data: e.data, column: a, "row-index": e.index, "column-index": i, render: a.customSlot, slots: t(u) }, null, 8, ["row", "data", "column", "row-index", "column-index", "render", "slots"]))]), _: 2 }, 1032, ["data", "column", "data-index", "column-index", "expand-space", "expand-index", "current-indent-size"])) : (d(), o(t(g), { key: 1, data: e.data, column: a, "data-index": e.index, "column-index": i, "expand-space": e.expandSpace, "expand-index": e.expandIndex, "current-indent-size": e.currentIndentSize }, { default: c(() => [a.ellipsisTooltip ? (d(), o(E, p({ key: 0, "is-dark": a.ellipsisTooltipTheme === "dark", "is-auto-show": !0 }, a.ellipsisTooltipProps, { content: e.data[a.key] }), { default: c(() => [B(S(e.data[a.key]), 1)]), _: 2 }, 1040, ["is-dark", "content"])) : (d(), s("span", J, S(e.data[a.key]), 1))]), _: 2 }, 1032, ["data", "column", "data-index", "column-index", "expand-space", "expand-index", "current-indent-size"]))], 64))], 64))), 128))], 38), t(u).expand && C.value ? (d(), s("tr", Q, [N("td", { class: "layui-table-cell", colspan: e.columns.length }, [f(t(k), { slots: t(u), render: "expand", data: e.data, row: e.data }, null, 8, ["slots", "data", "row"])], 8, U)])) : x("", !0), e.data[e.childrenColumnName] && C.value ? (d(!0), s(r, { key: 1 }, M(e.data[e.childrenColumnName], (a, i) => (d(), o(R, p({ key: a[e.id] }, n, { index: i, data: a, "current-indent-size": V.value }), null, 16, ["index", "data", "current-indent-size"]))), 128)) : x("", !0)], 64); var h, z; }; } }); export { le as default };