@rytass/bpm-core-react 0.20.1 → 0.21.0

package/dist/chunks/approval-instance-list-page-Bth7Raya.js

@@ -0,0 +1,724 @@
+"use client";
+import { r as e } from "./router-adapter-CkxCyzf5.js";
+import { r as t } from "./routes-config-BcNaWJWJ.js";
+import { t as n } from "./format-date-time-B0LdmWg4.js";
+import { useCallback as r, useEffect as i, useMemo as a, useRef as ee, useState as o } from "react";
+import { DateRangePicker as s, DateTimeRangePicker as te, Filter as c, FilterArea as ne, FilterLine as l, FormField as u, Input as d, PageHeader as re, RadioGroup as ie, Section as ae, SectionGroup as oe, Select as f, Table as se, Typography as p } from "@mezzanine-ui/react";
+import { resolveMembers as ce } from "@rytass/bpm-core-client";
+import { Fragment as le, jsx as m, jsxs as h } from "react/jsx-runtime";
+import { listApprovalInstancesPage as ue, readApprovalInstanceCaseTitle as de, readApprovalTemplateCurrentFormSchema as fe } from "@rytass/bpm-core-client/workflow";
+import { ControlFieldSlotLayout as g, FormFieldLayout as _ } from "@mezzanine-ui/core/form";
+import pe from "@mezzanine-ui/react/ContentHeader";
+import { listApprovalTemplates as me } from "@rytass/bpm-core-client/template";
+import { APPROVAL_INSTANCE_SORT_TIME_FIELDS as v, isFilterableFieldSortable as he, readFilterableFieldPaths as ge } from "@rytass/bpm-core-shared";
+import { formatDatePickerValue as y, formatDateTimePickerValue as b } from "@rytass/bpm-core-client/form";
+import '../approval-instance-list-page.css';// src/components/approval-instance-field-filters.ts
+function x(e) {
+	switch (e.kind) {
+		case "number": return { kind: "number-range" };
+		case "date": return { kind: "date-range" };
+		case "datetime": return { kind: "datetime-range" };
+		case "boolean": return { kind: "boolean" };
+		case "member":
+		case "org_unit": return { kind: "id-in" };
+		case "option": return e.staticOptions ? {
+			kind: "option-in",
+			options: e.staticOptions
+		} : { kind: "contains" };
+		case "text": return { kind: "contains" };
+	}
+}
+var S = {
+	from: "",
+	text: "",
+	to: "",
+	values: []
+}, C = /^-?\d+(\.\d+)?$/u;
+function w(e) {
+	return T(e) !== null;
+}
+function T(e) {
+	let t = e.trim().replace(/,/gu, "");
+	return C.test(t) ? t : null;
+}
+function E(e) {
+	return e.split(",").map((e) => e.trim()).filter((e) => e.length > 0);
+}
+function D(e, t) {
+	switch (x(e).kind) {
+		case "contains": {
+			let n = t.text.trim();
+			return n ? {
+				fieldKey: e.path,
+				operator: "CONTAINS",
+				values: [n]
+			} : null;
+		}
+		case "option-in": return t.values.length > 0 ? {
+			fieldKey: e.path,
+			operator: "IN",
+			values: [...t.values]
+		} : null;
+		case "id-in": {
+			let n = E(t.text);
+			return n.length > 0 ? {
+				fieldKey: e.path,
+				operator: "IN",
+				values: n
+			} : null;
+		}
+		case "number-range": {
+			let n = T(t.from), r = T(t.to);
+			return n || r ? {
+				fieldKey: e.path,
+				operator: "RANGE",
+				...n ? { from: n } : {},
+				...r ? { to: r } : {}
+			} : null;
+		}
+		case "date-range":
+		case "datetime-range": {
+			let n = t.from.trim(), r = t.to.trim();
+			return n || r ? {
+				fieldKey: e.path,
+				operator: "RANGE",
+				...n ? { from: n } : {},
+				...r ? { to: r } : {}
+			} : null;
+		}
+		case "boolean": {
+			let n = t.values[0];
+			return n === "true" || n === "false" ? {
+				fieldKey: e.path,
+				operator: "EQUALS",
+				values: [n]
+			} : null;
+		}
+	}
+}
+function _e(e, t) {
+	return e.flatMap((e) => {
+		let n = D(e, t[e.path] ?? S);
+		return n ? [n] : [];
+	});
+}
+var O = {
+	direction: "DESC",
+	field: ""
+}, ve = {
+	id: "",
+	label: "預設（建立時間，新到舊）"
+}, k = {
+	completedAt: "完成時間",
+	submittedAt: "送出時間",
+	updatedAt: "最後更新"
+};
+function ye(e, t) {
+	let n = v.map((e) => ({
+		id: e,
+		label: k[e]
+	})), r = t ? e.filter(he).map((e) => ({
+		id: e.path,
+		label: e.label
+	})) : [];
+	return [
+		ve,
+		...n,
+		...r
+	];
+}
+function be(e, t, n) {
+	return e === "" || v.includes(e) ? !0 : n && t.some((t) => t.path === e);
+}
+function xe(e) {
+	return e.field === "" ? void 0 : [{
+		direction: e.direction,
+		field: e.field
+	}];
+}
+// src/components/approval-instance-field-filter-controls.tsx
+var A = [{
+	id: "true",
+	name: "是"
+}, {
+	id: "false",
+	name: "否"
+}];
+function Se(e, t, n) {
+	return e.flatMap((e) => {
+		let r = t[e.path] ?? S, i = (t) => {
+			n(e.path, t);
+		}, a = x(e);
+		return a.kind === "number-range" ? [j(`${e.path}:from`, `${e.label}（下限）`, /* @__PURE__ */ m(d, {
+			fullWidth: !0,
+			onChange: (e) => {
+				i({
+					...r,
+					from: e.target.value
+				});
+			},
+			placeholder: `${e.label}：下限`,
+			size: "sub",
+			value: r.from,
+			variant: "base"
+		}), N(r.from)), j(`${e.path}:to`, `${e.label}（上限）`, /* @__PURE__ */ m(d, {
+			fullWidth: !0,
+			onChange: (e) => {
+				i({
+					...r,
+					to: e.target.value
+				});
+			},
+			placeholder: `${e.label}：上限`,
+			size: "sub",
+			value: r.to,
+			variant: "base"
+		}), N(r.to))] : [j(e.path, e.label, P(e, r, i, e.label), a.kind === "id-in" ? `多個${M(e)}以逗號分隔` : void 0)];
+	});
+}
+function j(e, t, n, r) {
+	return /* @__PURE__ */ m(c, {
+		span: 2,
+		children: /* @__PURE__ */ m(u, {
+			fullWidth: !0,
+			hintText: r,
+			controlFieldSlotLayout: g.SUB,
+			layout: _.VERTICAL,
+			label: t,
+			name: `fieldFilter-${e}`,
+			children: n
+		})
+	}, e);
+}
+function M(e) {
+	return e.kind === "org_unit" ? "組織" : "成員";
+}
+function N(e) {
+	return !e || w(e) ? void 0 : "請輸入數字";
+}
+function P(e, t, n, r) {
+	let i = x(e);
+	if (i.kind === "option-in") {
+		let e = i.options.map((e) => ({
+			id: e.value,
+			name: e.label
+		}));
+		return /* @__PURE__ */ m(f, {
+			clearable: !0,
+			fullWidth: !0,
+			mode: "multiple",
+			onChange: (e) => {
+				n({
+					...t,
+					values: e.map((e) => e.id)
+				});
+			},
+			options: [...e],
+			placeholder: `${r}：全部`,
+			size: "sub",
+			value: e.filter((e) => t.values.includes(e.id))
+		});
+	}
+	if (i.kind === "boolean") {
+		let e = A.find((e) => t.values.includes(e.id));
+		return /* @__PURE__ */ m(f, {
+			clearable: !0,
+			fullWidth: !0,
+			onChange: (e) => {
+				n({
+					...t,
+					values: e ? [e.id] : []
+				});
+			},
+			options: [...A],
+			placeholder: `${r}：全部`,
+			size: "sub",
+			value: e ?? null
+		});
+	}
+	return i.kind === "date-range" ? /* @__PURE__ */ m(s, {
+		clearable: !0,
+		fullWidth: !0,
+		inputFromPlaceholder: `${r}：起`,
+		inputToPlaceholder: "迄",
+		onChange: (e) => {
+			n({
+				...t,
+				from: y(e?.[0]) ?? "",
+				to: y(e?.[1]) ?? ""
+			});
+		},
+		size: "sub",
+		value: t.from && t.to ? [t.from, t.to] : []
+	}) : i.kind === "datetime-range" ? /* @__PURE__ */ m(te, {
+		clearable: !0,
+		fullWidth: !0,
+		onChange: (e) => {
+			n({
+				...t,
+				from: b(e[0]) ?? "",
+				to: b(e[1]) ?? ""
+			});
+		},
+		size: "sub",
+		value: [t.from || void 0, t.to || void 0]
+	}) : i.kind === "id-in" ? /* @__PURE__ */ m(d, {
+		fullWidth: !0,
+		onChange: (e) => {
+			n({
+				...t,
+				text: e.target.value
+			});
+		},
+		placeholder: `${r}：${M(e)} ID`,
+		size: "sub",
+		value: t.text,
+		variant: "base"
+	}) : /* @__PURE__ */ m(d, {
+		fullWidth: !0,
+		onChange: (e) => {
+			n({
+				...t,
+				text: e.target.value
+			});
+		},
+		placeholder: `${r}：包含`,
+		size: "sub",
+		value: t.text,
+		variant: "base"
+	});
+}
+var Ce = { instanceFilterArea: "bpm_instanceFilterArea_qpvJq" }, we = [
+	10,
+	20,
+	50
+], Te = 3, F = [
+	{
+		id: "ALL",
+		name: "全部狀態",
+		state: null
+	},
+	{
+		id: "RUNNING",
+		name: "進行中",
+		state: "RUNNING"
+	},
+	{
+		id: "APPROVED",
+		name: "已通過",
+		state: "APPROVED"
+	},
+	{
+		id: "REJECTED",
+		name: "已拒絕",
+		state: "REJECTED"
+	},
+	{
+		id: "RETURNED",
+		name: "已退回",
+		state: "RETURNED"
+	},
+	{
+		id: "CANCELLED",
+		name: "已取消",
+		state: "CANCELLED"
+	},
+	{
+		id: "EXPIRED",
+		name: "已逾期",
+		state: "EXPIRED"
+	},
+	{
+		id: "DRAFT",
+		name: "草稿",
+		state: "DRAFT"
+	}
+], Ee = [{
+	id: "DESC",
+	name: "新到舊"
+}, {
+	id: "ASC",
+	name: "舊到新"
+}];
+function I({ defaultState: s, description: te, emptyMessage: de, searchPlaceholder: v, title: he, view: y }) {
+	let b = e(), x = t(), [S, C] = o(null), [w, T] = o(/* @__PURE__ */ new Map()), [E, D] = o(1), [k, A] = o(10), [j, M] = o(0), [N, P] = o(!0), [I, R] = o([]), [z, Fe] = o(""), [B, Ie] = o(L(s)), [Le, Re] = o([]), [V, ze] = o(null), [H, U] = o(null), [Be, W] = o(!1), [G, K] = o(null), [q, J] = o({}), [Y, X] = o(O), Z = ee(0), Q = a(() => H ? ge(H) : [], [H]), Ve = a(() => V === null ? void 0 : _e(Q, q), [
+		q,
+		Q,
+		V
+	]), He = a(() => xe(Y), [Y]), Ue = a(() => ye(Q, V !== null), [Q, V]), $ = r(async () => {
+		let e = Z.current + 1;
+		Z.current = e, P(!0), C(null);
+		try {
+			let t = await ue({
+				fieldFilters: Ve,
+				page: E,
+				pageSize: k,
+				searchText: z,
+				sort: He,
+				state: B.state,
+				templateId: V,
+				view: y
+			});
+			if (e !== Z.current) return;
+			R(t.instances.map(ke)), M(t.totalCount);
+		} catch (t) {
+			e === Z.current && C(Pe(t));
+		} finally {
+			e === Z.current && P(!1);
+		}
+	}, [
+		Ve,
+		E,
+		k,
+		z,
+		He,
+		B,
+		V,
+		y
+	]);
+	i(() => {
+		$();
+	}, [$]), i(() => {
+		let e = !1;
+		return (async () => {
+			try {
+				let t = await me();
+				e || Re(t);
+			} catch {
+				e || Re([]);
+			}
+		})(), () => {
+			e = !0;
+		};
+	}, []), i(() => {
+		if (V === null) {
+			U(null), W(!1), K(null);
+			return;
+		}
+		let e = !1;
+		return W(!0), K(null), (async () => {
+			try {
+				let t = await fe(V);
+				e || U(t);
+			} catch (t) {
+				e || (U(null), K(Pe(t)));
+			} finally {
+				e || W(!1);
+			}
+		})(), () => {
+			e = !0;
+		};
+	}, [V]), i(() => {
+		let e = Array.from(new Set(I.map((e) => e.initiatorMemberId).filter(Boolean)));
+		if (e.length === 0) {
+			T(/* @__PURE__ */ new Map());
+			return;
+		}
+		let t = !1;
+		return (async () => {
+			try {
+				let n = await ce(e);
+				if (t) return;
+				T(new Map(n.map((e) => [e.memberId, e])));
+			} catch {
+				if (t) return;
+				T(/* @__PURE__ */ new Map());
+			}
+		})(), () => {
+			t = !0;
+		};
+	}, [I]);
+	let We = r((e) => {
+		ze(e?.id ?? null), U(null), J({}), D(1), X((e) => be(e.field, [], !1) ? e : {
+			...e,
+			field: O.field
+		});
+	}, []), Ge = r(() => {
+		Fe(""), Ie(L(s)), ze(null), U(null), J({}), X(O), D(1);
+	}, [s]), Ke = r(() => {
+		$();
+	}, [$]), qe = r((e, t) => {
+		J((n) => ({
+			...n,
+			[e]: t
+		})), D(1);
+	}, []), Je = a(() => [
+		{
+			dataIndex: "caseTitle",
+			key: "caseTitle",
+			title: "案件",
+			width: 300
+		},
+		{
+			key: "state",
+			render: (e) => /* @__PURE__ */ m(p, {
+				color: Me(e.state),
+				component: "span",
+				variant: "body",
+				children: e.stateLabel
+			}),
+			title: "狀態",
+			width: 120
+		},
+		{
+			key: "initiatorMemberId",
+			render: (e) => /* @__PURE__ */ m(p, {
+				component: "span",
+				variant: "body",
+				children: Ne(e.initiatorMemberId, w)
+			}),
+			title: "發起人",
+			width: 180
+		},
+		{
+			key: "startedAt",
+			render: (e) => /* @__PURE__ */ m(p, {
+				component: "span",
+				variant: "body",
+				children: n(e.startedAt)
+			}),
+			title: "發起時間",
+			width: 220
+		},
+		{
+			key: "completedAt",
+			render: (e) => /* @__PURE__ */ m(p, {
+				component: "span",
+				variant: "body",
+				children: n(e.completedAt)
+			}),
+			title: "完成時間",
+			width: 220
+		}
+	], [w]), Ye = a(() => ({
+		render: (e) => [{
+			name: "查看",
+			onClick: () => b.push(x.caseDetail(e.id))
+		}],
+		variant: "base-secondary",
+		width: 88
+	}), [b]), Xe = a(() => Le.map((e) => ({
+		id: e.id,
+		name: e.name
+	})), [Le]), Ze = Xe.find((e) => e.id === V), Qe = a(() => De(Se(Q, q, qe), Te).map((e, t) => /* @__PURE__ */ m(l, { children: [...e] }, `field-filter-line-${t}`)), [
+		q,
+		Q,
+		qe
+	]), $e = a(() => Ue.map((e) => ({
+		id: e.id,
+		name: e.label
+	})), [Ue]), et = $e.find((e) => e.id === Y.field) ?? $e.find((e) => e.id === ve.id), tt = /* @__PURE__ */ h(l, { children: [
+		/* @__PURE__ */ m(c, {
+			span: 2,
+			children: /* @__PURE__ */ m(u, {
+				fullWidth: !0,
+				controlFieldSlotLayout: g.SUB,
+				layout: _.VERTICAL,
+				name: "instanceSearchText",
+				children: /* @__PURE__ */ m(d, {
+					fullWidth: !0,
+					onChange: (e) => {
+						Fe(e.target.value), D(1);
+					},
+					placeholder: v,
+					size: "sub",
+					value: z,
+					variant: "base"
+				})
+			})
+		}),
+		/* @__PURE__ */ m(c, {
+			span: 2,
+			children: /* @__PURE__ */ m(u, {
+				fullWidth: !0,
+				controlFieldSlotLayout: g.SUB,
+				layout: _.VERTICAL,
+				name: "instanceState",
+				children: /* @__PURE__ */ m(f, {
+					clearable: !1,
+					fullWidth: !0,
+					onChange: (e) => {
+						Ie(Ae(e)), D(1);
+					},
+					options: [...F],
+					placeholder: "狀態",
+					renderValue: (e) => `狀態：${je(e)}`,
+					size: "sub",
+					value: B
+				})
+			})
+		}),
+		/* @__PURE__ */ m(c, {
+			span: 2,
+			children: /* @__PURE__ */ m(u, {
+				fullWidth: !0,
+				controlFieldSlotLayout: g.SUB,
+				layout: _.VERTICAL,
+				label: "範本",
+				name: "instanceTemplate",
+				children: /* @__PURE__ */ m(f, {
+					clearable: !0,
+					fullWidth: !0,
+					onChange: We,
+					options: [...Xe],
+					placeholder: "全部範本",
+					size: "sub",
+					value: Ze ?? null
+				})
+			})
+		})
+	] }, "search"), nt = /* @__PURE__ */ h(l, { children: [/* @__PURE__ */ m(c, {
+		span: 2,
+		children: /* @__PURE__ */ m(u, {
+			fullWidth: !0,
+			controlFieldSlotLayout: g.SUB,
+			layout: _.VERTICAL,
+			label: "排序欄位",
+			name: "instanceSortField",
+			children: /* @__PURE__ */ m(f, {
+				clearable: !1,
+				fullWidth: !0,
+				onChange: (e) => {
+					X((t) => ({
+						...t,
+						field: e?.id ?? O.field
+					})), D(1);
+				},
+				options: [...$e],
+				placeholder: "排序欄位",
+				size: "sub",
+				value: et ?? null
+			})
+		})
+	}), /* @__PURE__ */ m(c, {
+		span: 2,
+		children: /* @__PURE__ */ m(u, {
+			fullWidth: !0,
+			controlFieldSlotLayout: g.SUB,
+			layout: _.VERTICAL,
+			label: "排序方向",
+			name: "instanceSortDirection",
+			children: /* @__PURE__ */ m(ie, {
+				name: "instanceSortDirection",
+				onChange: (e) => {
+					X((t) => ({
+						...t,
+						direction: Oe(e.target.value)
+					})), D(1);
+				},
+				options: [...Ee],
+				size: "sub",
+				type: "segment",
+				value: Y.direction
+			})
+		})
+	})] }, "sort");
+	return /* @__PURE__ */ h(le, { children: [/* @__PURE__ */ m(re, { children: /* @__PURE__ */ m(pe, {
+		description: te,
+		title: he
+	}) }), /* @__PURE__ */ m(oe, { children: /* @__PURE__ */ h(ae, {
+		filterArea: /* @__PURE__ */ m(ne, {
+			className: Ce.instanceFilterArea,
+			onReset: Ge,
+			onSubmit: Ke,
+			resetText: "清除條件",
+			rowAlign: "end",
+			size: "sub",
+			submitText: "重新查詢",
+			children: [
+				tt,
+				...Qe,
+				nt
+			]
+		}),
+		children: [
+			S ? /* @__PURE__ */ m(p, {
+				color: "text-error",
+				variant: "body",
+				children: S
+			}) : null,
+			G ? /* @__PURE__ */ m(p, {
+				color: "text-error",
+				variant: "body",
+				children: G
+			}) : null,
+			V !== null && !Be && !G && H && Q.length === 0 ? /* @__PURE__ */ m(p, {
+				color: "text-neutral",
+				variant: "body",
+				children: "此範本沒有可篩選的欄位。"
+			}) : null,
+			!S && !N && I.length === 0 ? /* @__PURE__ */ m(p, {
+				color: "text-neutral",
+				variant: "body",
+				children: de
+			}) : null,
+			/* @__PURE__ */ m(se, {
+				actions: Ye,
+				columns: Je,
+				dataSource: [...I],
+				fullWidth: !0,
+				loading: N,
+				pagination: {
+					current: E,
+					onChange: (e) => {
+						D(e);
+					},
+					onChangePageSize: (e) => {
+						D(1), A(e);
+					},
+					pageSize: k,
+					pageSizeLabel: "每頁筆數",
+					pageSizeOptions: we,
+					renderResultSummary: (e, t, n) => `顯示 ${e}-${t} 筆，共 ${n} 筆`,
+					showPageSizeOptions: !0,
+					total: j
+				}
+			})
+		]
+	}) })] });
+}
+function De(e, t) {
+	return e.reduce((e, n) => {
+		let r = e[e.length - 1];
+		return r && r.length < t ? [...e.slice(0, -1), [...r, n]] : [...e, [n]];
+	}, []);
+}
+function Oe(e) {
+	return e === "ASC" ? "ASC" : "DESC";
+}
+function ke(e) {
+	return {
+		...e,
+		caseTitle: de(e),
+		key: e.id,
+		stateLabel: z(e.state)
+	};
+}
+function Ae(e) {
+	return R(e) ? L(e.state) : F[0];
+}
+function L(e) {
+	return F.find((t) => t.state === e) ?? F[0];
+}
+function je(e) {
+	return R(e) ? e.name : F[0].name;
+}
+function R(e) {
+	return typeof e == "object" && !!e && "id" in e && "name" in e && "state" in e;
+}
+function z(e) {
+	return e === "RUNNING" ? "進行中" : e === "APPROVED" ? "已通過" : e === "REJECTED" ? "已拒絕" : e === "RETURNED" ? "已退回" : e === "CANCELLED" ? "已取消" : e === "EXPIRED" ? "已逾期" : "草稿";
+}
+function Me(e) {
+	return e === "APPROVED" ? "text-success" : e === "REJECTED" || e === "CANCELLED" || e === "EXPIRED" ? "text-error" : "text-neutral";
+}
+function Ne(e, t) {
+	let n = (e ?? "").trim();
+	return n ? t.get(n)?.name ?? n : "未知發起人";
+}
+function Pe(e) {
+	return e instanceof Error ? e.message : "讀取簽核案件失敗。";
+}
+export { I as t };
+
+//# sourceMappingURL=approval-instance-list-page-Bth7Raya.js.map