@octavianlab/olab-ui
Version:
Octavianlab UX/UI components
278 lines (277 loc) • 10.2 kB
JavaScript
import { resolveComponent as g, resolveDirective as x, openBlock as a, createBlock as y, resolveDynamicComponent as B, createSlots as k, withCtx as i, createElementVNode as s, createElementBlock as o, toDisplayString as c, createCommentVNode as u, createVNode as f, withKeys as D, Fragment as E, renderList as $, createTextVNode as U, withDirectives as S } from "vue";
import { _ as R } from "./obannerbrowsersupport-8a97766f.js";
const L = {
name: "OPageSetting",
inject: {
checkTranslate: { default: () => {
} }
},
props: {
mode: { type: String, default: () => "export" },
results: { type: Array, default: () => [] }
},
data() {
return {
expandedRows: [],
editStates: {}
};
},
methods: {
doHandleEditTemplate(e, r, n) {
if (n === "edit") {
const b = this.editStates[e];
this.$emit("onEditTemplate", {
data: r,
name: b.name,
mode: b.mode
}), delete this.editStates[e];
return;
}
if (typeof e != "number") {
this.editStates = {};
return;
}
this.editStates[e] = {
name: r.name,
mode: r.mode
};
}
}
}, H = { class: "font-bold" }, N = /* @__PURE__ */ s("i", { class: "fad fa-floppy-disk-circle-arrow-right mr-2" }, null, -1), j = { class: "mb-3 flex align-items-center" }, A = /* @__PURE__ */ s("i", { class: "fad fa-circle-info fa-xl mr-2" }, null, -1), K = { key: 0 }, O = { key: 1 }, P = { class: "col-12 cx font-bold" }, I = { class: "flex justify-content-between align-items-center" }, F = /* @__PURE__ */ s("i", { class: "ml-3 fad fa-floppy-disk-circle-arrow-right fa-3x" }, null, -1), q = { class: "flex justify-content-between align-items-center" }, z = { class: "font-bold px-3" }, G = { class: "px-3" }, J = {
key: 0,
class: "font-bold"
}, M = { key: 0 }, Q = { key: 1 }, W = {
key: 0,
class: "font-bold"
}, X = {
key: 0,
class: "fad fa-globe fa-2xl"
}, Y = {
key: 1,
class: "fad fa-user fa-2xl"
}, Z = {
key: 0,
class: "fad fa-globe"
}, ee = {
key: 1,
class: "fad fa-user"
}, te = { key: 0 }, ae = {
key: 1,
class: "flex"
};
function ne(e, r, n, b, m, h) {
const _ = g("Button"), p = g("Column"), w = g("InputText"), C = g("SelectButton"), T = g("SplitButton"), V = g("DataTable"), v = x("tooltip");
return a(), y(B(n.mode === "export" ? "Panel" : "div"), {
toggleable: n.mode === "export",
collapsed: n.mode === "export"
}, k({
default: i(() => [
s("div", j, [
A,
n.mode === "export" ? (a(), o("span", K, c(e.$translate("admin.global.page.setting.export.info.text.api")), 1)) : u("", !0),
n.mode === "filter" ? (a(), o("span", O, c(e.$translate("admin.global.page.setting.filter.info.text.api")), 1)) : u("", !0)
]),
f(V, {
value: n.results,
autoLayout: "",
paginator: n.results.length > 9,
rows: 10,
paginatorTemplate: e.getDtTemplate("paginator"),
expandedRows: m.expandedRows,
"onUpdate:expandedRows": r[2] || (r[2] = (t) => m.expandedRows = t),
loading: e.$loading.isLoading("search"),
stripedRows: ""
}, k({
empty: i(() => [
s("div", P, c(e.$translate("admin.generic.empty.results")), 1)
]),
default: i(() => [
n.mode === "filter" ? (a(), y(p, {
key: 0,
expander: "",
class: "w-3 text-center"
})) : u("", !0),
f(p, {
field: "name",
header: e.$translate("admin.generic.name"),
bodyClass: "cx"
}, {
body: i(({ index: t, data: l }) => [
m.editStates[t] ? (a(), y(w, {
key: 1,
modelValue: m.editStates[t].name,
"onUpdate:modelValue": (d) => m.editStates[t].name = d,
placeholder: e.$translate("admin.generic.enter.name"),
onKeyup: D((d) => h.doHandleEditTemplate(t, l, "edit"), ["enter"])
}, null, 8, ["modelValue", "onUpdate:modelValue", "placeholder", "onKeyup"])) : (a(), o("div", J, c(l.name), 1))
]),
_: 1
}, 8, ["header"]),
n.mode === "export" ? (a(), y(p, {
key: 1,
field: "value",
header: e.$translate("admin.generic.value"),
bodyClass: "cx"
}, {
body: i(({ data: t }) => [
n.mode === "export" ? (a(), o("div", M, [
(a(!0), o(E, null, $(t.value, (l, d) => (a(), o("span", { key: d }, c(`${h.checkTranslate(l)}; `), 1))), 128))
])) : u("", !0),
n.mode === "filter" ? (a(), o("div", Q, c(t.value), 1)) : u("", !0)
]),
_: 1
}, 8, ["header"])) : u("", !0),
f(p, {
field: "lastUpdate",
header: e.$translate("admin.generic.last.update"),
headerClass: "cx",
bodyClass: "cx"
}, {
body: i(({ data: t }) => [
U(c(e.$filters.asDate(t.lastUpdate)), 1)
]),
_: 1
}, 8, ["header"]),
f(p, {
field: "author",
header: e.$translate("admin.generic.author"),
bodyClass: "cx"
}, null, 8, ["header"]),
f(p, {
field: "mode",
header: e.$translate("admin.field.type"),
bodyClass: "cx"
}, {
body: i(({ data: t, index: l }) => [
m.editStates[l] ? (a(), y(C, {
key: 1,
modelValue: m.editStates[l].mode,
"onUpdate:modelValue": (d) => m.editStates[l].mode = d,
options: [0, 1],
"aria-labelledby": "basic"
}, {
option: i((d) => [
d.option === 0 ? (a(), o("i", Z)) : u("", !0),
d.option === 1 ? (a(), o("i", ee)) : u("", !0)
]),
_: 2
}, 1032, ["modelValue", "onUpdate:modelValue"])) : (a(), o("div", W, [
t.mode === 0 ? S((a(), o("i", X, null, 512)), [
[
v,
e.$translate("admin.field.type.global"),
void 0,
{ bottom: !0 }
]
]) : u("", !0),
t.mode === 1 ? S((a(), o("i", Y, null, 512)), [
[
v,
e.$translate("admin.field.type.personal"),
void 0,
{ bottom: !0 }
]
]) : u("", !0)
]))
]),
_: 1
}, 8, ["header"]),
f(p, {
header: e.$translate("admin.generic.operations"),
headerClass: "w-10 cx",
bodyClass: "w-10 cx"
}, {
body: i(({ index: t, data: l }) => [
m.editStates[t] ? (a(), o("div", ae, [
f(_, {
icon: "fad fa-save",
class: "p-button-sm mr-3",
label: e.$translate("admin.generic.action.save"),
disabled: !m.editStates[t].name,
onClick: (d) => h.doHandleEditTemplate(t, l, "edit"),
loading: e.$loading.isLoading("edit")
}, null, 8, ["label", "disabled", "onClick", "loading"]),
f(_, {
icon: "fad fa-xmark",
class: "p-button-danger p-button-sm p-button-outlined",
onClick: r[1] || (r[1] = (d) => h.doHandleEditTemplate())
})
])) : (a(), o("div", te, [
f(T, {
icon: "fas fa-arrow-down",
class: "p-button-sm mr-3",
label: e.$translate("admin.generic.action.use"),
onClick: (d) => e.$emit("onUseTemplate", l.value),
model: [
{
label: e.$translate("admin.generic.action.edit"),
icon: "fad fa-edit",
command: () => {
h.doHandleEditTemplate(t, l);
}
},
{
label: e.$translate("admin.generic.action.delete"),
icon: "fad fa-trash text-danger",
command: () => {
e.$emit("onDeleteTemplate", l.id);
},
loading: e.$loading.isLoading("delete")
}
]
}, null, 8, ["label", "onClick", "model"])
]))
]),
_: 1
}, 8, ["header"])
]),
_: 2
}, [
n.mode === "filter" ? {
name: "header",
fn: i(() => [
s("div", I, [
F,
s("div", null, [
f(_, {
class: "mr-3 p-button-secondary",
onClick: r[0] || (r[0] = (t) => e.$emit("onAddTemplate")),
label: e.$translate("admin.filter.store.search"),
icon: "fad fa-floppy-disk mr-2",
loading: e.$loading.isLoading("add")
}, null, 8, ["label", "loading"])
])
])
]),
key: "0"
} : void 0,
n.mode === "filter" ? {
name: "expansion",
fn: i((t) => [
s("div", q, [
s("div", z, c(e.$translate("admin.generic.value")), 1),
s("div", G, c(t.data.value), 1)
])
]),
key: "1"
} : void 0
]), 1032, ["value", "paginator", "paginatorTemplate", "expandedRows", "loading"])
]),
_: 2
}, [
n.mode === "export" ? {
name: "header",
fn: i(() => [
s("div", H, [
N,
s("span", null, c(e.$translate("admin.title.stored.export")), 1)
])
]),
key: "0"
} : void 0
]), 1032, ["toggleable", "collapsed"]);
}
const de = /* @__PURE__ */ R(L, [["render", ne]]);
export {
de as O
};