@pisell/private-materials 6.3.220 → 6.3.222

package/lib/plus/panpacificTask/JobDrawer.js

@@ -0,0 +1,368 @@
+const require_runtime = require("../../_virtual/_rolldown/runtime.js");
+const require_objectSpread2 = require("../../_virtual/_@oxc-project_runtime@0.122.0/helpers/objectSpread2.js");
+const require_asyncToGenerator = require("../../_virtual/_@oxc-project_runtime@0.122.0/helpers/asyncToGenerator.js");
+const require_attachments = require("./attachments.js");
+const require_model = require("./model.js");
+const require_serve = require("./serve.js");
+const require_JobForm = require("./JobForm.js");
+const require_PhotoPreview = require("./PhotoPreview.js");
+const require_JobStatus = require("./JobStatus.js");
+let react = require("react");
+react = require_runtime.__toESM(react);
+let antd = require("antd");
+let _ant_design_icons = require("@ant-design/icons");
+//#region src/plus/panpacificTask/JobDrawer.tsx
+function JobDrawer({ id, request, jobs, base, getText, uploadPhoto, confirm, onClose, onChanged, onDuplicate, startEditing }) {
+	var _base$categories$find, _related$photos, _related$payments;
+	const [job, setJob] = (0, react.useState)();
+	const [related, setRelated] = (0, react.useState)({});
+	const [loading, setLoading] = (0, react.useState)(true);
+	const [editing, setEditing] = (0, react.useState)(!!startEditing);
+	const [busy, setBusy] = (0, react.useState)(false);
+	const [error, setError] = (0, react.useState)("");
+	const [recordUncertain, setRecordUncertain] = (0, react.useState)(false);
+	const locked = (0, react.useRef)(false);
+	const formRef = (0, react.useRef)(null);
+	const [direction, setDirection] = (0, react.useState)("payment");
+	const [amount, setAmount] = (0, react.useState)(null);
+	const [reference, setReference] = (0, react.useState)("");
+	const [photo, setPhoto] = (0, react.useState)();
+	const pendingPhoto = (0, react.useRef)();
+	const mounted = (0, react.useRef)(true);
+	const sequence = (0, react.useRef)(0);
+	const dirtyPayment = !!amount || !!reference || !!photo;
+	const refresh = function() {
+		var _ref = require_asyncToGenerator._asyncToGenerator(function* () {
+			const token = ++sequence.current;
+			setLoading(true);
+			try {
+				const result = yield require_serve.getJobDetail(request, id);
+				if (!mounted.current || token !== sequence.current) return;
+				setJob(result);
+				const records = yield require_serve.getJobRelated(request, id);
+				if (mounted.current && token === sequence.current) setRelated((previous) => {
+					var _records$photos, _records$payments;
+					return {
+						photos: (_records$photos = records.photos) !== null && _records$photos !== void 0 ? _records$photos : previous.photos,
+						payments: (_records$payments = records.payments) !== null && _records$payments !== void 0 ? _records$payments : previous.payments
+					};
+				});
+			} catch (cause) {
+				console.warn("[PanpacificTask] Detail load failed", cause);
+			} finally {
+				if (mounted.current && token === sequence.current) setLoading(false);
+			}
+		});
+		return function refresh() {
+			return _ref.apply(this, arguments);
+		};
+	}();
+	(0, react.useEffect)(() => {
+		mounted.current = true;
+		refresh();
+		return () => {
+			mounted.current = false;
+			sequence.current++;
+		};
+	}, [id, request]);
+	const close = function() {
+		var _ref2 = require_asyncToGenerator._asyncToGenerator(function* () {
+			if (locked.current) return;
+			if (editing && job) {
+				var _formRef$current;
+				(_formRef$current = formRef.current) === null || _formRef$current === void 0 || _formRef$current.close();
+				return;
+			}
+			if (dirtyPayment && !(yield confirm("discardConfirm"))) return;
+			onClose();
+		});
+		return function close() {
+			return _ref2.apply(this, arguments);
+		};
+	}();
+	const run = function() {
+		var _ref3 = require_asyncToGenerator._asyncToGenerator(function* (operation) {
+			if (locked.current) return;
+			locked.current = true;
+			setBusy(true);
+			setError("");
+			try {
+				yield operation();
+			} catch (cause) {
+				if (mounted.current) {
+					if (cause === null || cause === void 0 ? void 0 : cause.uncertainCreate) setRecordUncertain(true);
+					setError((cause === null || cause === void 0 ? void 0 : cause.uncertainCreate) ? getText("pisell2.panpacific.task.uncertain") : getText(require_serve.errorText(cause)));
+				}
+			} finally {
+				locked.current = false;
+				if (mounted.current) setBusy(false);
+			}
+		});
+		return function run(_x) {
+			return _ref3.apply(this, arguments);
+		};
+	}();
+	const mark = (status) => run(require_asyncToGenerator._asyncToGenerator(function* () {
+		if (status === "cancel" && !(yield confirm("cancelConfirm"))) return;
+		if (!job) return;
+		yield require_serve.updateJob(request, id, require_model.statusPayload(job, status));
+		onChanged(id);
+		yield refresh();
+	}));
+	const remove = () => run(require_asyncToGenerator._asyncToGenerator(function* () {
+		if (!(yield confirm("removeConfirm"))) return;
+		yield require_serve.removeJob(request, id);
+		onChanged(id);
+		onClose();
+	}));
+	const section = (title, children) => /* @__PURE__ */ react.default.createElement("section", { className: "pp-task-section" }, /* @__PURE__ */ react.default.createElement("h3", null, getText(`pisell2.panpacific.task.${title}`)), children);
+	const details = (rows) => /* @__PURE__ */ react.default.createElement("dl", { className: "pp-task-details" }, rows.map(([key, value]) => /* @__PURE__ */ react.default.createElement("div", { key }, /* @__PURE__ */ react.default.createElement("dt", null, getText(`pisell2.panpacific.task.${key}`)), /* @__PURE__ */ react.default.createElement("dd", null, value || "—"))));
+	const groups = require_model.jobLineGroups(job || {});
+	const lines = (kind, status) => {
+		const rows = groups[kind][status];
+		return rows.length ? /* @__PURE__ */ react.default.createElement("ul", { className: "pp-task-item-summary" }, rows.map((row, i) => {
+			var _row$id;
+			return /* @__PURE__ */ react.default.createElement("li", { key: String((_row$id = row.id) !== null && _row$id !== void 0 ? _row$id : i) }, require_model.jobLineText(row, kind, base));
+		})) : "—";
+	};
+	const chooseFile = (event, receipt) => {
+		var _event$target$files;
+		const file = (_event$target$files = event.target.files) === null || _event$target$files === void 0 ? void 0 : _event$target$files[0];
+		event.target.value = "";
+		if (!file) return;
+		run(require_asyncToGenerator._asyncToGenerator(function* () {
+			const image = yield uploadPhoto(require_attachments.preparePhoto(file));
+			if (!require_attachments.attachments(image).length) throw new Error("pisell2.panpacific.task.uploadFailed");
+			if (receipt) {
+				if (mounted.current) setPhoto(image);
+			} else {
+				pendingPhoto.current = image;
+				yield savePickup(image);
+			}
+		}));
+	};
+	const savePickup = function() {
+		var _ref4 = require_asyncToGenerator._asyncToGenerator(function* (image) {
+			const prefix = `${String((job === null || job === void 0 ? void 0 : job.job_number) || id).replace(/[^a-zA-Z0-9]+/g, "_")}_pickup_`;
+			const next = (related.photos || []).reduce((max, row) => {
+				const suffix = String(row.name || "").startsWith(prefix) ? row.name.slice(prefix.length) : "";
+				return /^\d+$/.test(suffix) ? Math.max(max, Number(suffix)) : max;
+			}, 0) + 1;
+			yield require_serve.createJobPickupPhoto(request, {
+				job_id: id,
+				name: prefix + (related.photos ? String(next).padStart(2, "0") : String(Date.now())),
+				photo: image
+			});
+			pendingPhoto.current = void 0;
+			yield refresh();
+			onChanged(id);
+		});
+		return function savePickup(_x2) {
+			return _ref4.apply(this, arguments);
+		};
+	}();
+	const savePayment = () => run(require_asyncToGenerator._asyncToGenerator(function* () {
+		if (recordUncertain) return;
+		if (!amount || !/^\d+(\.\d{1,2})?$/.test(amount) || Number(amount) <= 0 || Number(amount) >= 0xe8d4a51000) throw new Error("pisell2.panpacific.task.invalidAmount");
+		yield require_serve.createJobPayment(request, {
+			job_id: id,
+			direction,
+			amount,
+			ref_number: reference.trim() || null,
+			photo: photo || null
+		});
+		if (mounted.current) {
+			setAmount(null);
+			setReference("");
+			setPhoto(void 0);
+		}
+		yield refresh();
+		onChanged(id);
+	}));
+	const primary = job && require_model.nextStatus(job.status);
+	const menus = job ? [
+		...require_model.statuses.filter((status) => status !== job.status && status !== primary && status !== "cancel").map((status) => ({
+			key: status,
+			label: `${getText("pisell2.panpacific.task.mark")} ${getText(`pisell2.panpacific.task.${status}`)}`
+		})),
+		...job.status === "cancel" ? [] : [{
+			key: "cancel",
+			label: getText("pisell2.panpacific.task.cancelJob")
+		}],
+		{
+			key: "duplicate",
+			label: getText("pisell2.panpacific.task.duplicate")
+		},
+		{
+			key: "remove",
+			label: getText("pisell2.panpacific.task.remove"),
+			danger: true
+		}
+	] : [];
+	return /* @__PURE__ */ react.default.createElement(antd.Drawer, {
+		open: true,
+		width: editing ? "min(820px, 96vw)" : "min(520px, 96vw)",
+		rootClassName: "pp-task-overlay pp-task-drawer",
+		closable: false,
+		destroyOnClose: true,
+		title: /* @__PURE__ */ react.default.createElement("div", null, editing ? getText("pisell2.panpacific.task.editJob") : (job === null || job === void 0 ? void 0 : job.supplier_name) || getText("pisell2.panpacific.task.job"), /* @__PURE__ */ react.default.createElement("small", null, job === null || job === void 0 ? void 0 : job.job_number)),
+		onClose: close,
+		extra: /* @__PURE__ */ react.default.createElement("div", { className: "pp-task-drawer-head-actions" }, !editing && job && /* @__PURE__ */ react.default.createElement(antd.Button, {
+			type: "primary",
+			disabled: busy || loading,
+			onClick: require_asyncToGenerator._asyncToGenerator(function* () {
+				if (dirtyPayment && !(yield confirm("discardConfirm"))) return;
+				setAmount(null);
+				setReference("");
+				setPhoto(void 0);
+				setEditing(true);
+			})
+		}, getText("pisell2.panpacific.task.edit")), /* @__PURE__ */ react.default.createElement(antd.Button, {
+			"aria-label": getText("pisell2.panpacific.task.close"),
+			icon: /* @__PURE__ */ react.default.createElement(_ant_design_icons.CloseOutlined, null),
+			disabled: busy,
+			onClick: close
+		})),
+		footer: !editing && job && /* @__PURE__ */ react.default.createElement("div", { className: "pp-task-drawer-actions" }, primary && /* @__PURE__ */ react.default.createElement(antd.Button, {
+			type: "primary",
+			loading: busy,
+			disabled: loading,
+			onClick: () => mark(primary)
+		}, getText("pisell2.panpacific.task.mark"), " ", getText(`pisell2.panpacific.task.${primary}`)), /* @__PURE__ */ react.default.createElement(antd.Dropdown, {
+			trigger: ["click"],
+			disabled: busy || loading,
+			menu: {
+				items: menus,
+				onClick: function() {
+					var _ref5 = require_asyncToGenerator._asyncToGenerator(function* ({ key }) {
+						if (key === "remove") {
+							yield remove();
+							return;
+						}
+						if (key === "duplicate") {
+							if (dirtyPayment && !(yield confirm("discardConfirm"))) return;
+							onDuplicate(require_model.draftFor(job, void 0, true));
+							return;
+						}
+						yield mark(key);
+					});
+					return function onClick(_x3) {
+						return _ref5.apply(this, arguments);
+					};
+				}()
+			}
+		}, /* @__PURE__ */ react.default.createElement(antd.Button, null, getText("pisell2.panpacific.task.more"), " ▾")))
+	}, /* @__PURE__ */ react.default.createElement(antd.Spin, { spinning: loading }, !job && /* @__PURE__ */ react.default.createElement(antd.Button, { onClick: refresh }, getText("pisell2.panpacific.task.refresh")), job && editing ? /* @__PURE__ */ react.default.createElement(require_JobForm.JobForm, {
+		ref: formRef,
+		key: String(job.id),
+		initial: require_model.draftFor(job),
+		jobs,
+		base,
+		request,
+		getText,
+		confirmDiscard: () => confirm("discardConfirm"),
+		onCancel: () => setEditing(false),
+		onSaved: () => {
+			setEditing(false);
+			onChanged(id);
+			refresh();
+		}
+	}) : job && /* @__PURE__ */ react.default.createElement("div", { className: "pp-task-drawer-view" }, /* @__PURE__ */ react.default.createElement("div", { className: "pp-task-section pp-task-drawer-hero" }, /* @__PURE__ */ react.default.createElement(require_JobStatus.JobStatus, {
+		job,
+		getText
+	})), section("supplier", details([
+		["state", job.supplier_state],
+		["supplier", job.supplier_name],
+		["branchPostcode", job.supplier_sub_name],
+		["contact", job.company_contact],
+		["phone", job.supplier_phone],
+		["email", job.supplier_email],
+		["lead", job.lead_source]
+	])), section("basicInfo", details([
+		["category", ((_base$categories$find = base.categories.find((row) => String(row.id) === String(job.task_category_id))) === null || _base$categories$find === void 0 ? void 0 : _base$categories$find.name) || job.task_category_id],
+		["created", require_model.dateText(job.job_created_date)],
+		["dateRange", require_model.scheduleText(job)],
+		["due", require_model.dateText(job.due_date)],
+		["pickupDate", require_model.dateText(job.pickup_date)],
+		["invoiceDate", require_model.dateText(job.invoice_date)]
+	])), section("logistics", details([["logisticType", job.logistic_type && getText(`pisell2.panpacific.task.${job.logistic_type}`)], ["logisticsNote", job.logistics_note]])), section("materials", details([["scheduledMaterials", lines("materials", "scheduled")], ["confirmedMaterials", lines("materials", "confirmed")]])), section("products", details([["scheduledItems", lines("products", "scheduled")], ["confirmedItems", lines("products", "confirmed")]])), section("paymentTerm", details([["paymentTerm", [require_model.paymentTerm(job, base), job.payment_term_days != null ? `${job.payment_term_days} ${getText("pisell2.panpacific.task.dayUnit")}` : ""].filter(Boolean).join(" · ")], ["termsNote", job.terms_note]])), section("pickupPhotos", /* @__PURE__ */ react.default.createElement(react.default.Fragment, null, /* @__PURE__ */ react.default.createElement("div", { className: "pp-task-photos" }, ((_related$photos = related.photos) === null || _related$photos === void 0 ? void 0 : _related$photos.length) ? related.photos.map((row) => /* @__PURE__ */ react.default.createElement(require_PhotoPreview.PhotoPreview, {
+		key: String(row.id),
+		value: row.photo,
+		label: row.name,
+		getText,
+		disabled: busy || loading,
+		onRemove: (index) => run(require_asyncToGenerator._asyncToGenerator(function* () {
+			yield require_serve.removeJobPickupPhoto(request, row, index);
+			const remaining = require_attachments.attachments(row.photo).filter((_, i) => i !== index);
+			if (mounted.current) setRelated((previous) => {
+				var _previous$photos;
+				return require_objectSpread2._objectSpread2(require_objectSpread2._objectSpread2({}, previous), {}, { photos: (_previous$photos = previous.photos) === null || _previous$photos === void 0 ? void 0 : _previous$photos.flatMap((item) => String(item.id) !== String(row.id) ? [item] : remaining.length ? [require_objectSpread2._objectSpread2(require_objectSpread2._objectSpread2({}, item), {}, { photo: remaining })] : []) });
+			});
+			onChanged(id);
+			yield refresh();
+		}))
+	})) : "—"), /* @__PURE__ */ react.default.createElement("label", { className: `pp-task-upload${busy || recordUncertain ? " is-disabled" : ""}` }, /* @__PURE__ */ react.default.createElement("input", {
+		type: "file",
+		accept: "image/*",
+		capture: "environment",
+		disabled: busy || recordUncertain,
+		onChange: (event) => chooseFile(event, false)
+	}), getText("pisell2.panpacific.task.uploadPickup")), pendingPhoto.current && !recordUncertain && /* @__PURE__ */ react.default.createElement(antd.Button, {
+		disabled: busy,
+		onClick: () => run(() => savePickup(pendingPhoto.current))
+	}, getText("pisell2.panpacific.task.save")))), section("records", /* @__PURE__ */ react.default.createElement(react.default.Fragment, null, /* @__PURE__ */ react.default.createElement("div", { className: "pp-task-payment-records" }, ((_related$payments = related.payments) === null || _related$payments === void 0 ? void 0 : _related$payments.length) ? related.payments.map((row) => /* @__PURE__ */ react.default.createElement("div", { key: String(row.id) }, /* @__PURE__ */ react.default.createElement("strong", null, getText(`pisell2.panpacific.task.${row.direction === "receive" ? "receive" : "payment"}`), " ", "· $", row.amount), row.ref_number && /* @__PURE__ */ react.default.createElement("span", null, " · ", row.ref_number), /* @__PURE__ */ react.default.createElement("small", null, row.created_at && require_model.dateText(row.created_at), " ", row.operator_name), /* @__PURE__ */ react.default.createElement("div", { className: "pp-task-photos" }, /* @__PURE__ */ react.default.createElement(require_PhotoPreview.PhotoPreview, {
+		value: row.photo,
+		getText
+	})))) : "—"), /* @__PURE__ */ react.default.createElement("p", { className: "pp-task-payment-caption" }, getText("pisell2.panpacific.task.createRecord")), /* @__PURE__ */ react.default.createElement(antd.Radio.Group, {
+		value: direction,
+		disabled: busy || recordUncertain,
+		onChange: (event) => setDirection(event.target.value),
+		optionType: "button",
+		options: [{
+			label: getText("pisell2.panpacific.task.payment"),
+			value: "payment"
+		}, {
+			label: getText("pisell2.panpacific.task.receive"),
+			value: "receive"
+		}]
+	}), /* @__PURE__ */ react.default.createElement("div", { className: "pp-task-payment-inputs" }, photo ? /* @__PURE__ */ react.default.createElement("div", { className: "pp-task-photos pp-task-receipt-preview" }, /* @__PURE__ */ react.default.createElement(require_PhotoPreview.PhotoPreview, {
+		value: photo,
+		compact: true,
+		getText,
+		disabled: busy || recordUncertain,
+		onRemove: () => setPhoto(void 0)
+	})) : /* @__PURE__ */ react.default.createElement("label", { className: `pp-task-upload${busy || recordUncertain ? " is-disabled" : ""}` }, /* @__PURE__ */ react.default.createElement("input", {
+		type: "file",
+		accept: "image/*",
+		disabled: busy || recordUncertain,
+		onChange: (event) => chooseFile(event, true)
+	}), getText("pisell2.panpacific.task.photo")), /* @__PURE__ */ react.default.createElement(antd.InputNumber, {
+		stringMode: true,
+		min: "0.01",
+		max: "999999999999.99",
+		precision: 2,
+		value: amount,
+		onChange: setAmount,
+		placeholder: getText("pisell2.panpacific.task.amount"),
+		"aria-label": getText("pisell2.panpacific.task.amount"),
+		disabled: busy || recordUncertain
+	}), /* @__PURE__ */ react.default.createElement(antd.Input, {
+		value: reference,
+		maxLength: 255,
+		onChange: (event) => setReference(event.target.value),
+		placeholder: getText("pisell2.panpacific.task.reference"),
+		"aria-label": getText("pisell2.panpacific.task.reference"),
+		disabled: busy || recordUncertain
+	})), /* @__PURE__ */ react.default.createElement(antd.Button, {
+		type: "primary",
+		loading: busy,
+		disabled: recordUncertain,
+		onClick: savePayment
+	}, getText("pisell2.panpacific.task.saveRecord")))), error && /* @__PURE__ */ react.default.createElement(antd.Alert, {
+		type: "error",
+		showIcon: true,
+		message: error
+	}))));
+}
+//#endregion
+exports.JobDrawer = JobDrawer;