import { h as F, resolveComponent as m, resolveDirective as w, openBlock as i, createElementBlock as r, createElementVNode as d, toDisplayString as v, Fragment as W, renderList as M, withDirectives as p, createBlock as y, withCtx as f, resolveDynamicComponent as P, createCommentVNode as a, createTextVNode as b, vShow as g, renderSlot as u, normalizeStyle as h, createVNode as k, createStaticVNode as R } from "vue"; import { S as T } from "./index19.js"; import { l as z, U as D, a9 as L } from "./index2.js"; const N = { name: "SListLayout", components: { STable: T }, data() { return { _: this, tableScrollPx: 0, isFilter: !1, isMoreFilter: !1, layoutHeight: 0, spinning: !1, pageSize: 20, sideWidth: 232, showSelection: !1, selectedRowKeys: [], startX: 0, dragWidth: 0, renderButtons: [], iconMap: { add: "PlusCircleOutlined", edit: "FormOutlined", delete: "DeleteOutlined", remove: "DeleteOutlined", import: "UploadOutlined", export: "DownloadOutlined", assign: "ClusterOutlined", execute: "PlayOircleOutlined", pause: "PauseOircleOutlined", resume: "PoweroffOutlined", approve: "HighlightOutlined", setting: "SettingOutlined", TopOfType: "VerticalAlignTopOutlined", TOP: "VerticalAlignTopOutlined", synchronize: "SyncOutlined" } }; }, props: { col: { type: [Number, String], default: 4 }, cardHeight: { type: Number, default: 300 }, // 页面标题 title: { type: String, required: !0 }, buttons: { type: Array, default() { return [ { name: "添加", key: "add", show: !0, type: "primary", icon: !0, api: null }, { name: "批量删除", key: "remove", action: "remove", show: !0, icon: !0, api: null }, { name: "导入", key: "import", show: !0, icon: !0, api: null, templateApi: null }, { name: "导出", key: "export", show: !0, icon: !0, api: null } ]; } }, showPagination: { type: Boolean, default: !0 }, loadData: { type: Function, required: !0 }, pSize: { type: [String, Number], default: 20 } }, watch: { buttons: { handler(e) { e.length && this.initRenderButtons(e); }, immediate: !0, deep: !0 } }, methods: { isFunction(e, t = "") { return !!(e && typeof e == "function"); }, renderIcon(e) { return typeof e.icon == "string" ? e.icon : typeof e.icon == "boolean" && e.icon ? this.iconMap[e.key] : ""; }, initRenderButtons(e) { this.renderButtons = e.map((t) => (t.key === "remove" && (this.showSelection = !0), t)); }, initComponent() { this.$nextTick(() => { this.layoutHeight = this.$refs.layout.parentNode.offsetHeight - 50, this.pageSize = this.pSize, this.setLayoutHeight(); }); }, toggleFilter() { this.isMoreFilter = !this.isMoreFilter, this.setLayoutHeight(); }, // 查询条件重置 filterReset() { this.$emit("reset"); }, reload() { this.$refs.table.refresh(!0); }, // 设置列表路由地址 sethsitoryPath() { const e = this.$route; sessionStorage.setItem("backPath", e.path); }, // 按钮回调 btnCallback(e) { this.$emit("btnCallback", e.key, this.selectedRowKeys), this[e.key] ? this[e.key](e) : this.handAction(e); }, // 其他未定义按钮方法生成 handAction(e) { if (e.selection !== !1 && !this.selectedRowKeys.length) { this.$message.warn(`请选择要${e.name}的数据`); return; } if (this.isFunction(e.api, e.name, e.key)) { if (e.confirm) { this.$confirm({ title: `${e.name}`, content: () => F("div", { style: "color:red" }, `确认要{${e.name}}数据吗?`), onOk: () => { this.spinning = !0, e.api(this.selectedRowKeys).then(() => { this.$message.success(`${e.name}成功`), this.$emit("reset"); }).finally(() => { this.spinning = !1; }); } }); return; } this.spinning = !0, e.api(this.selectedRowKeys).then(() => { this.$message.success(`${e.name}成功`), this.$emit("reset"); }).finally(() => { this.spinning = !1; }); } }, // 变更按钮状态 setStateBtn(e, t) { typeof e == "string" ? this.setStateBtnItem(e, t) : e.forEach((s) => { this.setStateBtnItem(s, t); }); }, setStateBtnItem(e, t) { const s = this.renderButtons.find((c) => c.key === e); if (!s) { console.error(`按钮(${e})未定义, 请确认该变更状态按钮是否设置正确`); return; } Object.keys(t).forEach((c) => { s[c] = t[c]; }); }, // 添加方法 add() { }, // 删除方法 delete(e) { this.handAction(e); }, // 设置表格滚动条高度 setLayoutHeight() { this.$nextTick(() => { const t = this.$refs.filters && this.$refs.filters.offsetHeight || 0, s = this.$refs.tabs && this.$refs.tabs.offsetHeight || 0; this.tableScrollPx = this.layoutHeight - t - 0 - s; }); } }, mounted() { this.initComponent(); }, directives: { sidedrag: { mounted(e, t) { e.style.cursor = "e-resize"; const s = t.value; document.addEventListener("selectstart", (c) => { c.preventDefault(); }), e.onmousedown = (c) => { s.startX = c.clientX, s.dragWidth = s.sideWidth, document.onmousemove = (o) => { const l = o.clientX - s.startX; if (l < 0) { if (s.dragWidth + l <= 232) return; s.sideWidth = s.dragWidth + l; } else { if (s.dragWidth + l >= 500) return; s.sideWidth = s.dragWidth + l; } }, document.onmouseup = () => { document.onmousemove = document.onmousedown = null; }; }; } } } }, I = { class: "list-layout", ref: "layout" }, x = { class: "tools" }, A = { class: "title" }, V = { class: "btns" }, K = { key: 0, style: { "margin-left": "8px" } }, E = { class: "list-filter-wrap", ref: "filters" }, X = { key: 0, class: "filter-content" }, q = { class: "filter" }, U = { key: 1, class: "reset-wrap" }, j = { key: 1, class: "filter-more-content" }, G = { key: 2, class: "desc-wrap" }, J = { class: "table-content" }, Q = { key: 0, class: "tabs-wrap", ref: "tabs" }, Y = { class: "other" }; function Z(e, t, s, c, o, l) { const _ = D, S = m("down-outlined"), $ = m("up-outlined"), O = m("sync-outlined"), C = L, H = w("action"), B = w("sidedrag"); return i(), r("div", I, [ d("div", x, [ d("div", A, v(s.title), 1), d("div", V, [ (i(!0), r(W, null, M(o.renderButtons, (n) => (i(), r("span", { class: "item-btn", key: n.key }, [ p((i(), y(_, { class: "btn", disabled: !!n.disabled, type: n.type || n.key === "add" ? "primary" : "default", onClick: (ee) => l.btnCallback(n) }, { icon: f(() => [ l.renderIcon(n) ? (i(), y(P(l.renderIcon(n)), { key: 0 })) : a("", !0) ]), default: f(() => [ b(" " + v(n.name), 1) ]), _: 2 }, 1032, ["disabled", "type", "onClick"])), [ [H, n.action || n.key], [g, n.show !== !1] ]) ]))), 128)), e.$slots.otherBtns ? (i(), r("span", K, [ u(e.$slots, "otherBtns", { selections: o.selectedRowKeys }, void 0, !0) ])) : a("", !0) ]) ]), d("div", { class: "list-layout-main", style: h({ height: o.layoutHeight + "px" }) }, [ e.$slots.tree ? (i(), r("div", { key: 0, class: "side", ref: "side", style: h([{ height: o.layoutHeight + "px", width: o.sideWidth + "px" }, { "overflow-y": "auto" }]) }, [ u(e.$slots, "tree", {}, void 0, !0) ], 4)) : a("", !0), e.$slots.tree ? p((i(), r("div", { key: 1, class: "side-bar", style: h({ height: o.layoutHeight + "px", backgroundColor: e.$theme.bgColor }) }, null, 4)), [ [B, o._] ]) : a("", !0), e.$slots.empty ? (i(), r("div", { key: 3, class: "layout-list-content", style: h({ height: o.layoutHeight + "px" }) }, [ u(e.$slots, "empty", {}, void 0, !0) ], 4)) : (i(), r("div", { key: 2, class: "layout-list-content", style: h({ height: o.layoutHeight - 1 + "px" }) }, [ p(d("div", E, [ e.$slots.filter ? (i(), r("div", X, [ d("div", q, [ u(e.$slots, "filter", {}, void 0, !0) ]), e.$slots.filterMore ? (i(), r("a", { key: 0, class: "filter-more-btn", onClick: t[0] || (t[0] = (...n) => l.toggleFilter && l.toggleFilter(...n)) }, [ b(v(o.isMoreFilter ? "收起" : "更多") + " ", 1), o.isMoreFilter ? (i(), y($, { key: 1, style: { "font-size": "12px" } })) : (i(), y(S, { key: 0, style: { "font-size": "12px" } })) ])) : a("", !0), e.$slots.filter ? (i(), r("div", U, [ k(C, { placement: "top", overlayStyle: { maxWidth: "500px" } }, { title: f(() => t[1] || (t[1] = [ d("span", null, "条件重置", -1) ])), default: f(() => [ k(_, { style: { "padding-bottom": "2px" }, onClick: l.filterReset }, { icon: f(() => [ k(O) ]), _: 1 }, 8, ["onClick"]) ]), _: 1 }) ])) : a("", !0) ])) : a("", !0), e.$slots.filterMore ? p((i(), r("div", j, [ u(e.$slots, "filterMore", {}, void 0, !0) ], 512)), [ [g, o.isMoreFilter] ]) : a("", !0), e.$slots.desc ? (i(), r("div", G, [ u(e.$slots, "desc", {}, void 0, !0) ])) : a("", !0) ], 512), [ [g, e.$slots.filter] ]), d("div", J, [ e.$slots.tabs ? (i(), r("div", Q, [ u(e.$slots, "tabs", {}, void 0, !0) ], 512)) : a("", !0), d("div", { class: "table-container", style: h({ display: "grid", gridTemplateColumns: `repeat(${s.col}, 1fr)`, gap: "12px", height: o.tableScrollPx - 1 + "px" }) }, t[2] || (t[2] = [ R('
', 15) ]), 4) ]) ], 4)) ], 4), d("div", Y, [ u(e.$slots, "other", {}, void 0, !0) ]) ], 512); } const oe = /* @__PURE__ */ z(N, [["render", Z], ["__scopeId", "data-v-83eef4d8"]]); export { oe as default };