@camera.ui/server 2.4.0 → 2.4.1

package/dist/interface/ha/SettingsUsers-66Bn-ZuP.js

@@ -0,0 +1,370 @@
+import { c as e } from "./ripple-CGl9oC16.js";
+import { D as t, Et as n, H as r, J as i, Kt as a, M as o, Ot as s, St as c, Xt as l, Yt as u, d, f, jt as p, l as m, lt as h, p as g, rt as _, u as v, ut as y, v as b, vt as x, x as S, y as C } from "./runtime-core.esm-bundler-CrWKbcD2.js";
+import { $i as w, Rt as T, Tt as E, Xi as D, Zn as O, ci as k, j as A, k as j, ni as M, nr as N, rr as P } from "./api-BCqn9EdE.js";
+import { l as F, n as I, r as L, s as R, t as z } from "./vee-validate-DWIY1QrX.js";
+import { n as B } from "./vue-i18n-DzDRu5NH.js";
+import { t as V } from "./CuiButton-CGAd8xvo.js";
+import { r as H } from "./button-D9sS6H0w.js";
+import { t as U } from "./inputtext-DfgvQQt_.js";
+import { t as W } from "./select-Ba_XFods.js";
+import { i as G, t as ee } from "./CuiDataTable-CV5ePNzg.js";
+import { t as te } from "./delete-Bn7AbDKs.js";
+import { n as K, t as ne } from "./auth-DhFoGtmO.js";
+//#region ~icons/mdi/account-edit
+var q = {
+	viewBox: "0 0 24 24",
+	width: "1.2em",
+	height: "1.2em"
+};
+function J(e, t) {
+	return r(), g("svg", q, [...t[0] ||= [v("path", {
+		fill: "currentColor",
+		d: "m21.7 13.35l-1 1l-2.05-2.05l1-1a.55.55 0 0 1 .77 0l1.28 1.28c.21.21.21.56 0 .77M12 18.94l6.06-6.06l2.05 2.05L14.06 21H12zM12 14c-4.42 0-8 1.79-8 4v2h6v-1.89l4-4c-.66-.08-1.33-.11-2-.11m0-10a4 4 0 0 0-4 4a4 4 0 0 0 4 4a4 4 0 0 0 4-4a4 4 0 0 0-4-4"
+	}, null, -1)]]);
+}
+var Y = x({
+	name: "mdi-account-edit",
+	render: J
+}), X = {
+	for: "username",
+	class: "cui-label"
+}, Z = {
+	for: "password",
+	class: "cui-label"
+}, Q = {
+	for: "passwordConfirm",
+	class: "cui-label"
+}, re = {
+	for: "role",
+	class: "cui-label"
+}, ie = /* @__PURE__ */ S({
+	__name: "UserForm",
+	props: { user: {} },
+	setup(n, { expose: i }) {
+		let a = new D(), u = n, g = F(), y = w(), { t: b } = B(), x = t("dialogRefProps"), { mutateAsync: S, isPending: O } = a.createUserQuery(), { mutateAsync: k, isPending: M } = a.patchUserQuery(), { user: N } = s(u), P = _("formRef"), R = c({}), V = c(["user", "admin"]), H = m(() => !!(x.loading?.value || O.value || M.value));
+		async function G() {
+			let e = await P.value?.validate();
+			if (!e?.valid) return g.error("Validation failed", e), y.add({
+				severity: "error",
+				detail: b("components.toast.validation_failed"),
+				life: 3e3
+			}), null;
+			N.value ? await k({
+				username: N.value.username,
+				userData: R.value
+			}) : await S({ userData: R.value });
+		}
+		return i({
+			isLoading: H,
+			onConfirm: G
+		}), (t, n) => {
+			let i = U, a = T, s = E, c = W;
+			return r(), d(p(L), {
+				ref_key: "formRef",
+				ref: P,
+				class: "flex flex-col gap-6",
+				"validation-schema": p(N) ? p(A) : p(j)
+			}, {
+				default: h(() => [
+					C(p(I), {
+						modelValue: p(R).username,
+						"onUpdate:modelValue": n[0] ||= (e) => p(R).username = e,
+						modelModifiers: { trim: !0 },
+						value: p(N)?.username ?? p(R).username,
+						name: "username",
+						as: "div",
+						class: "flex flex-col field-gap"
+					}, {
+						default: h(({ field: n, errors: r }) => [
+							v("label", X, l(t.$t("components.form.label.username")), 1),
+							C(a, null, {
+								default: h(() => [C(i, o(n, {
+									invalid: r.length > 0,
+									loading: p(H),
+									type: "text"
+								}), null, 16, ["invalid", "loading"])]),
+								_: 2
+							}, 1024),
+							C(e, { name: "fade" }, {
+								default: h(() => [C(p(z), {
+									name: "username",
+									class: "cui-input-error"
+								})]),
+								_: 1
+							})
+						]),
+						_: 1
+					}, 8, ["modelValue", "value"]),
+					C(p(I), {
+						modelValue: p(R).password,
+						"onUpdate:modelValue": n[1] ||= (e) => p(R).password = e,
+						name: "password",
+						as: "div",
+						class: "flex flex-col field-gap"
+					}, {
+						default: h(({ field: n, errors: r }) => [
+							v("label", Z, l(t.$t("components.form.label.new_password")), 1),
+							C(a, null, {
+								default: h(() => [C(s, o({ invalid: r.length > 0 }, n, {
+									loading: p(H),
+									feedback: !1,
+									"toggle-mask": ""
+								}), null, 16, ["invalid", "loading"])]),
+								_: 2
+							}, 1024),
+							C(e, { name: "fade" }, {
+								default: h(() => [C(p(z), {
+									name: "password",
+									class: "cui-input-error"
+								})]),
+								_: 1
+							})
+						]),
+						_: 1
+					}, 8, ["modelValue"]),
+					C(p(I), {
+						modelValue: p(R).passwordConfirm,
+						"onUpdate:modelValue": n[2] ||= (e) => p(R).passwordConfirm = e,
+						name: "passwordConfirm",
+						as: "div",
+						class: "flex flex-col field-gap"
+					}, {
+						default: h(({ field: n, errors: r }) => [
+							v("label", Q, l(t.$t("components.form.label.new_password_confirm")), 1),
+							C(a, null, {
+								default: h(() => [C(s, o({ invalid: r.length > 0 }, n, {
+									loading: p(H),
+									feedback: !1,
+									"toggle-mask": ""
+								}), null, 16, ["invalid", "loading"])]),
+								_: 2
+							}, 1024),
+							C(e, { name: "fade" }, {
+								default: h(() => [C(p(z), {
+									name: "passwordConfirm",
+									class: "cui-input-error"
+								})]),
+								_: 1
+							})
+						]),
+						_: 1
+					}, 8, ["modelValue"]),
+					p(N)?.role === "master" ? f("", !0) : (r(), d(p(I), {
+						key: 0,
+						"model-value": p(R).role,
+						name: "role",
+						as: "div",
+						class: "flex flex-col field-gap"
+					}, {
+						default: h(({ errors: r }) => [
+							v("label", re, l(t.$t("components.form.label.role")), 1),
+							C(a, null, {
+								default: h(() => [C(c, {
+									"model-value": p(N)?.role ?? p(R).role,
+									options: p(V),
+									invalid: r.length > 0,
+									loading: p(H),
+									type: "text",
+									onValueChange: n[3] ||= (e) => p(R).role = e
+								}, null, 8, [
+									"model-value",
+									"options",
+									"invalid",
+									"loading"
+								])]),
+								_: 2
+							}, 1024),
+							C(e, { name: "fade" }, {
+								default: h(() => [C(p(z), {
+									name: "role",
+									class: "cui-input-error"
+								})]),
+								_: 1
+							})
+						]),
+						_: 1
+					}, 8, ["model-value"]))
+				]),
+				_: 1
+			}, 8, ["validation-schema"]);
+		};
+	}
+}), ae = { class: "flex flex-col w-full gap-6" }, oe = { class: "card-title" }, se = { class: "flex flex-col gap-6" }, ce = { class: "flex items-center gap-2" }, $ = { class: "flex flex-col" }, le = { class: "text-sm font-semibold text-color" }, ue = { class: "text-xs text-muted" }, de = { class: "relative w-6 h-6" }, fe = { class: "flex flex-row items-end justify-end gap-2" }, pe = { class: "card-title" }, me = { class: "flex items-center justify-center" }, he = { class: "font-medium block max-w-[200px] truncate" }, ge = { class: "text-muted text-sm" }, _e = /* @__PURE__ */ S({
+	__name: "SettingsUsers",
+	setup(e) {
+		let t = new ne(), o = new D(), s = O(), { mdBreakpoint: f } = k(), { t: x } = B(), S = c({
+			pageSize: 15,
+			page: 1
+		}), w = c({
+			page: 1,
+			pageSize: -1
+		}), { data: T, isBusy: E } = o.getUsersQuery(S), { mutate: A, isPending: j } = o.removeUserQuery(), { data: F, isBusy: I } = t.listAllSessionsQuery(w), { mutate: L, isPending: z } = t.revokeSessionQuery(), U = {
+			bodyRow: { class: "text-sm text-secondary" },
+			column: { columnTitle: { class: "text-sm" } }
+		}, W = _("menuRef"), q = m(() => E.value || j.value), J = m(() => F.value ?? []), X = m(() => !!I.value), Z = m(() => [{
+			label: x("views.settings.edit"),
+			icon: Y,
+			buttonProps: { disabled: q.value },
+			onClick: (e) => {
+				Q(e);
+			}
+		}, {
+			label: x("views.settings.remove"),
+			icon: te,
+			iconProps: { class: "text-red-500" },
+			labelProps: { class: "text-red-500" },
+			buttonProps: {
+				disabled: q.value,
+				severity: "danger"
+			},
+			onClick: (e) => {
+				A({ username: e.username });
+			}
+		}]);
+		function Q(e) {
+			s.openComponentDialog(ie, { data: {
+				title: x(e ? "components.dialog.title.edit_user" : "components.dialog.title.create_new_user"),
+				confirmText: x(e ? "components.form.button.save" : "components.form.button.add"),
+				loading: q,
+				contentProps: { user: n(e) }
+			} });
+		}
+		return (e, t) => {
+			let n = M, o = P, s = G, c = V, m = ee, _ = R, x = H, w = K, E = i("tooltip");
+			return r(), g("div", null, [v("div", ae, [v("div", null, [v("span", oe, l(e.$t("views.settings.registered_users")), 1), C(_, { class: "cui-card" }, {
+				content: h(() => [v("div", se, [C(m, {
+					value: p(T)?.result,
+					paginator: p(S).page > 1 || p(T)?.result && p(T).result.length > 15,
+					"data-key": "id",
+					loading: p(q),
+					pt: U,
+					"striped-rows": "",
+					scrollable: ""
+				}, {
+					loading: h(() => [C(n, {
+						class: "w-[30px] h-[30px] m-0",
+						"stroke-width": "5"
+					})]),
+					default: h(() => [C(s, {
+						field: "username",
+						"align-frozen": "left",
+						frozen: !p(f),
+						header: e.$t("views.settings.title_user"),
+						"header-class": "p-2 h-7 min-h-7 max-h-7 w-40 min-w-40 max-w-40",
+						class: "p-2 h-7 min-h-7 max-h-7 w-40 min-w-40 max-w-40"
+					}, {
+						body: h(({ data: e }) => [v("div", ce, [C(o, {
+							src: e.avatar,
+							size: 54
+						}, null, 8, ["src"]), v("div", $, [v("span", le, l(e.username), 1), v("span", ue, l(e.role), 1)])])]),
+						_: 1
+					}, 8, ["frozen", "header"]), C(s, {
+						field: "action",
+						"header-class": "p-2 h-7 min-h-7 max-h-7",
+						class: "p-2 h-7 min-h-7 max-h-7 text-right"
+					}, {
+						body: h(({ data: e }) => [v("div", null, [C(c, {
+							severity: "secondary",
+							text: "",
+							rounded: "",
+							loading: p(q),
+							class: "cui-icon-md",
+							onClick: (t) => p(W)?.toggleMenu(t, void 0, e)
+						}, {
+							icon: h(() => [v("div", de, [
+								v("div", { class: a(["absolute top-1 left-1/2 -translate-x-1/2 w-1 h-1 rounded-full transform transition-all duration-100 origin-center bg-current", { "w-4 h-[2px] rotate-45 top-1/2 -translate-y-1/2 rounded-none": p(W)?.isOpen && p(W)?.data?._id === e._id }]) }, null, 2),
+								v("div", { class: a(["absolute top-1/2 left-1/2 -translate-x-1/2 -translate-y-1/2 w-1 h-1 rounded-full transition-all duration-100 bg-current", { "opacity-0 scale-0": p(W)?.isOpen && p(W)?.data?._id === e._id }]) }, null, 2),
+								v("div", { class: a(["absolute bottom-1 left-1/2 -translate-x-1/2 w-1 h-1 rounded-full transform transition-all duration-100 origin-center bg-current", { "w-4 h-[2px] -rotate-45 bottom-1/2 translate-y-1/2 rounded-none": p(W)?.isOpen && p(W)?.data?._id === e._id }]) }, null, 2)
+							])]),
+							_: 2
+						}, 1032, ["loading", "onClick"])])]),
+						_: 1
+					})]),
+					_: 1
+				}, 8, [
+					"value",
+					"paginator",
+					"loading"
+				]), v("div", fe, [C(c, {
+					severity: "success",
+					loading: p(q),
+					class: "cui-button-medium mr-4 md:mr-0",
+					label: e.$t("components.form.button.create_new_user"),
+					onClick: t[0] ||= (e) => Q()
+				}, null, 8, ["loading", "label"])])])]),
+				_: 1
+			})]), v("div", null, [v("span", pe, l(e.$t("views.settings.logged_in_users")), 1), C(_, { class: "cui-card" }, {
+				content: h(() => [C(m, {
+					value: p(J),
+					loading: p(X),
+					pt: U,
+					"striped-rows": "",
+					scrollable: ""
+				}, {
+					loading: h(() => [C(n, {
+						class: "w-[30px] h-[30px] m-0",
+						"stroke-width": "5"
+					})]),
+					empty: h(() => [v("span", ge, l(e.$t("views.settings.no_sessions")), 1)]),
+					default: h(() => [
+						C(s, {
+							field: "status",
+							header: "",
+							style: { width: "3rem" }
+						}, {
+							body: h(({ data: t }) => [v("div", me, [y(C(x, { style: u({ background: t.is_current ? "var(--primary-500)" : "transparent" }) }, null, 8, ["style"]), [[E, { value: t.is_current ? e.$t("components.user_table.you") : void 0 }]])])]),
+							_: 1
+						}),
+						C(s, {
+							field: "device.name",
+							header: e.$t("components.user_table.title_device")
+						}, {
+							body: h(({ data: e }) => [v("span", he, l(e.device.name), 1)]),
+							_: 1
+						}, 8, ["header"]),
+						C(s, {
+							field: "device.ip",
+							header: e.$t("components.user_table.title_address")
+						}, {
+							body: h(({ data: e }) => [b(l(e.device.ip ?? "-"), 1)]),
+							_: 1
+						}, 8, ["header"]),
+						C(s, {
+							field: "device.kind",
+							header: e.$t("components.user_table.title_kind")
+						}, null, 8, ["header"]),
+						C(s, {
+							field: "action",
+							class: "text-right"
+						}, {
+							body: h(({ data: t }) => [y((r(), d(c, {
+								severity: "danger",
+								text: "",
+								rounded: "",
+								loading: p(z),
+								class: "cui-icon-md",
+								onClick: (e) => p(L)({ id: t.id })
+							}, {
+								icon: h(() => [C(w, {
+									width: "100%",
+									height: "100%"
+								})]),
+								_: 1
+							}, 8, ["loading", "onClick"])), [[E, { value: e.$t("views.settings.active_sessions.revoke") }]])]),
+							_: 1
+						})
+					]),
+					_: 1
+				}, 8, ["value", "loading"])]),
+				_: 1
+			})])]), C(N, {
+				ref_key: "menuRef",
+				ref: W,
+				items: p(Z),
+				popover: { pt: { content: { class: "p-0! rounded-xl! overflow-hidden!" } } }
+			}, null, 8, ["items"])]);
+		};
+	}
+});
+//#endregion
+export { _e as default };