@opendesign-plus/components 0.0.1-rc.10 → 0.0.1-rc.101

package/dist/treeshaking/components/activity/OActivityApproval.vue_vue_type_script_setup_true_lang.mjs

@@ -0,0 +1,586 @@
+import { CalendarDataType } from "../meeting/types.mjs";
+import { useI18n } from "../../i18n/index.mjs";
+import { useActivityConfig } from "./composables/useActivityConfig.mjs";
+import OMeetingDetail_default from "../meeting/components/OMeetingDetail.mjs";
+import { Fragment, computed, createBlock, createCommentVNode, createElementBlock, createElementVNode, createTextVNode, createVNode, defineComponent, normalizeClass, onMounted, openBlock, reactive, ref, renderList, toDisplayString, unref, watch, withCtx, withModifiers } from "vue";
+import { OCollapse, OCollapseItem, ODataTable, ODialog, OForm, OFormItem, OLink, OPagination, OTag, OTextarea, useMessage } from "@opensig/opendesign";
+import { useScreen } from "@opendesign-plus/composables";
+import dayjs from "dayjs";
+// src/components/activity/OActivityApproval.vue?vue&type=script&setup=true&lang.ts
+var _hoisted_1 = { class: "o-activity-table" };
+var _hoisted_2 = {
+	key: 0,
+	class: "table-wrapper"
+};
+var _hoisted_3 = { class: "expand-detail" };
+var _hoisted_4 = { class: "activity-btn" };
+var _hoisted_5 = {
+	key: 0,
+	class: "pagination-wrapper"
+};
+var _hoisted_6 = {
+	key: 1,
+	class: "collapse-wrapper"
+};
+var _hoisted_7 = { class: "title-top" };
+var _hoisted_8 = { class: "act-title" };
+var _hoisted_9 = { class: "act-sponsor" };
+var _hoisted_10 = { class: "sponsor" };
+var _hoisted_11 = { class: "activity-btn" };
+var _hoisted_12 = { class: "activity-detail" };
+var _hoisted_13 = {
+	key: 0,
+	class: "pagination"
+};
+var _hoisted_14 = { class: "dialog-content" };
+var _hoisted_15 = { class: "dialog-content" };
+var OActivityApproval_vue_vue_type_script_setup_true_lang_default = /*@__PURE__*/ defineComponent({
+	__name: "OActivityApproval",
+	props: {
+		getTableDataRequest: {},
+		applicantList: {},
+		cancelActivityRequest: {},
+		deleteActivityRequest: {},
+		approveActivityRequest: {},
+		rejectActivityRequest: {},
+		getActivityDetailRequest: {}
+	},
+	setup(__props) {
+		const { t, locale } = useI18n();
+		const isZh = computed(() => locale.value === "zh");
+		const { approvalStatusMap, statusMap, activityTypeMap } = useActivityConfig();
+		const message = useMessage(null);
+		const { isPhone, lePadV } = useScreen();
+		const props = __props;
+		const asItem = (row) => row;
+		const params = reactive({
+			page: 1,
+			size: 10,
+			status: "",
+			is_delete: 0,
+			search: "",
+			sponsor: "",
+			order_by: ""
+		});
+		const statusOptions = computed(() => {
+			const list = [];
+			approvalStatusMap.value.forEach((item) => {
+				list.push(item);
+			});
+			return list.slice(1);
+		});
+		const columns = computed(() => [
+			{
+				key: "title",
+				label: t("meeting.activityName")
+			},
+			{
+				key: "sponsor",
+				label: t("meeting.applicant"),
+				filter: {
+					optionsFn: () => props.applicantList.map((v) => ({
+						label: v,
+						value: v
+					})),
+					multiple: true
+				}
+			},
+			{
+				key: "create_time",
+				label: t("meeting.submissionTime"),
+				sortKey: "create_time"
+			},
+			{
+				key: "status",
+				label: t("meeting.status"),
+				width: 90,
+				filter: {
+					optionsFn: () => statusOptions.value,
+					multiple: false
+				}
+			},
+			{
+				key: "action",
+				label: t("meeting.action")
+			}
+		]);
+		const onConditionUpdate = (payload) => {
+			if (!payload) return;
+			const { key, newVal } = payload;
+			if (key === "sponsor") params.sponsor = newVal.join(",");
+			else if (key === "status") {
+				const val = newVal[0];
+				params.status = val ?? "";
+				if (val === "cancel") params.is_delete = 1;
+				else params.is_delete = 0;
+			}
+		};
+		const onSortUpdate = (payload) => {
+			const { newVal } = payload;
+			if (newVal === 1) params.order_by = "asc";
+			else if (newVal === -1) params.order_by = "desc";
+			else params.order_by = "";
+		};
+		const tableData = ref([]);
+		const total = ref(0);
+		const COUNT_PER_PAGE = [
+			10,
+			20,
+			30,
+			40
+		];
+		const getData = async () => {
+			const { page, size, status, sponsor, order_by, search, is_delete } = params;
+			let paramsData = {
+				page,
+				size,
+				sponsor,
+				order_by,
+				search
+			};
+			if (status !== "all" && status !== "") paramsData.is_delete = is_delete;
+			if (status === "cancel") paramsData.status = "";
+			else paramsData.status = status;
+			if (!props.getTableDataRequest) return;
+			const res = await props.getTableDataRequest(paramsData);
+			tableData.value = (res.data || []).map((item) => {
+				const { start_date, end_date, start, end, activity_type } = item;
+				return [{
+					...item,
+					time: `${start_date}-${end}`,
+					start_date_time: `${start_date} ${start}`,
+					end_date_time: `${end_date} ${end}`,
+					type: CalendarDataType.EVENTS,
+					dateRange: `${start_date} ${start}-${end_date} ${end}`,
+					activity_type: activityTypeMap.value.get(activity_type)?.label
+				}];
+			}).flat();
+			total.value = res.total;
+		};
+		const onPaginationChange = (val) => {
+			if (val.pageSize !== params.size) params.page = 1;
+			else params.page = val.page;
+			params.size = val.pageSize;
+			getData();
+		};
+		const form = ref({ reason: "" });
+		const formRef = ref();
+		const loading = ref(false);
+		const currentRow = ref(null);
+		const digTitle = ref("");
+		const reviewStatus = ref(0);
+		const reviewVisible = ref(false);
+		const rules = ref({ reason: [{
+			required: true,
+			message: t("meeting.enterReviewNotes")
+		}] });
+		const confirm = async () => {
+			if (!props.approveActivityRequest || !props.rejectActivityRequest) return;
+			try {
+				loading.value = true;
+				const valid = await formRef.value?.validate();
+				if (!valid || valid.some((v) => !!v)) {
+					loading.value = false;
+					return;
+				}
+				if (reviewStatus.value === 1) await props.approveActivityRequest(currentRow.value?.id, form.value);
+				else await props.rejectActivityRequest(currentRow.value?.id, form.value);
+				getData();
+				cancel();
+				message.success({ content: t("meeting.reviewSuccess", [currentRow.value?.title]) });
+			} finally {
+				reviewVisible.value = false;
+				loading.value = false;
+			}
+		};
+		const cancel = () => {
+			reviewVisible.value = false;
+			cancelVisible.value = false;
+			loading.value = false;
+			form.value.reason = "";
+		};
+		const confirmCancel = async () => {
+			if (props.deleteActivityRequest && props.cancelActivityRequest) try {
+				loading.value = true;
+				if (cancelStatus.value === 1) await props.cancelActivityRequest(currentRow.value.id, form.value);
+				else await props.deleteActivityRequest(currentRow.value.id, form.value);
+				getData();
+				cancel();
+				message.success({ content: t("meeting.activityActionSuccess", [currentRow.value?.title, cancelText.value]) });
+			} finally {
+				loading.value = false;
+				cancelVisible.value = false;
+			}
+		};
+		const cancelVisible = ref(false);
+		const cancelTitle = ref("");
+		const cancelText = ref("");
+		const cancelStatus = ref(0);
+		const deleteItem = (row) => {
+			cancelTitle.value = t("meeting.deleteActivity");
+			cancelText.value = t("meeting.deleteActivity").toLowerCase();
+			currentRow.value = row;
+			cancelStatus.value = 0;
+			cancelVisible.value = true;
+		};
+		const cancelItem = (row) => {
+			cancelTitle.value = t("meeting.cancelActivity");
+			cancelText.value = t("common.cancel").toLowerCase();
+			currentRow.value = row;
+			cancelStatus.value = 1;
+			cancelVisible.value = true;
+		};
+		const passItem = (row) => {
+			currentRow.value = row;
+			digTitle.value = t("meeting.approveReview");
+			reviewStatus.value = 1;
+			reviewVisible.value = true;
+		};
+		const rejectItem = (row) => {
+			currentRow.value = row;
+			digTitle.value = t("meeting.rejectReview");
+			reviewStatus.value = 0;
+			reviewVisible.value = true;
+		};
+		const expandedRowKeys = ref([]);
+		const fetchedDetailIds = ref(/* @__PURE__ */ new Set());
+		const fetchActivityDetail = (id) => {
+			const val = id.toString();
+			if (!props.getActivityDetailRequest || fetchedDetailIds.value.has(val)) return;
+			fetchedDetailIds.value.add(val);
+			props.getActivityDetailRequest(val).then((res) => {
+				tableData.value?.forEach((item) => {
+					if (item.id === res.id) {
+						item.approve_record = res.approve_record;
+						item.approver = res.approver;
+					}
+				});
+			});
+		};
+		const onExpandChange = (keys) => {
+			expandedRowKeys.value = keys;
+			keys.forEach((key) => fetchActivityDetail(key));
+		};
+		const expanded = ref([]);
+		const change = (val) => {
+			if (val.length) val.forEach((item) => {
+				fetchActivityDetail(item);
+			});
+		};
+		const detailRefs = ref({});
+		const getDetailRefs = (insRef, id) => {
+			if (insRef && id) detailRefs.value[id] = insRef;
+		};
+		onMounted(() => {
+			getData();
+		});
+		watch(() => [
+			params.status,
+			params.sponsor,
+			params.order_by,
+			params.search,
+			params.is_delete
+		], () => {
+			getData();
+		}, { deep: true });
+		const cancelActions = computed(() => {
+			return [{
+				id: "confirm",
+				loading: loading.value,
+				color: "primary",
+				variant: lePadV.value ? "text" : "solid",
+				round: "pill",
+				size: "large",
+				label: t("meeting.confirmBtn"),
+				onClick: () => {
+					confirmCancel();
+				}
+			}, {
+				id: "cancel",
+				color: "primary",
+				variant: lePadV.value ? "text" : "outline",
+				round: "pill",
+				size: "large",
+				label: t("meeting.cancelBtn"),
+				onClick: () => {
+					cancel();
+				}
+			}];
+		});
+		const reviewActions = computed(() => {
+			return [{
+				id: "confirm",
+				loading: loading.value,
+				color: "primary",
+				variant: lePadV.value ? "text" : "solid",
+				round: "pill",
+				size: "large",
+				label: t("meeting.confirmBtn"),
+				onClick: () => {
+					confirm();
+				}
+			}, {
+				id: "cancel",
+				color: "primary",
+				variant: lePadV.value ? "text" : "outline",
+				round: "pill",
+				size: "large",
+				label: t("meeting.cancelBtn"),
+				onClick: () => {
+					cancel();
+				}
+			}];
+		});
+		return (_ctx, _cache) => {
+			return openBlock(), createElementBlock("div", _hoisted_1, [
+				!unref(isPhone) ? (openBlock(), createElementBlock("div", _hoisted_2, [createVNode(unref(ODataTable), {
+					data: tableData.value,
+					columns: columns.value,
+					"row-key": "id",
+					border: "row-frame",
+					"min-table-width": 600,
+					"expanded-row-keys": expandedRowKeys.value,
+					"onUpdate:expandedRowKeys": onExpandChange,
+					onConditionUpdate,
+					onSortUpdate
+				}, {
+					expand: withCtx(({ row }) => [createElementVNode("div", _hoisted_3, [createVNode(OMeetingDetail_default, {
+						data: row,
+						page: unref(CalendarDataType).APPROVAL,
+						show: ""
+					}, null, 8, ["data", "page"])])]),
+					td_create_time: withCtx(({ row }) => [createTextVNode(toDisplayString(unref(dayjs)(asItem(row).create_time).format("YYYY/MM/DD HH:mm:ss")), 1)]),
+					td_status: withCtx(({ row }) => [asItem(row).is_delete !== 1 ? (openBlock(), createBlock(unref(OTag), {
+						key: 0,
+						color: "primary",
+						variant: "outline",
+						class: normalizeClass([`tag-${unref(statusMap).get(asItem(row).status)?.id}`])
+					}, {
+						default: withCtx(() => [createTextVNode(toDisplayString(unref(statusMap).get(asItem(row).status)?.text), 1)]),
+						_: 2
+					}, 1032, ["class"])) : (openBlock(), createBlock(unref(OTag), {
+						key: 1,
+						color: "primary",
+						variant: "outline",
+						class: "tag-cancel"
+					}, {
+						default: withCtx(() => [createTextVNode(toDisplayString(unref(t)("meeting.statusCanceled")), 1)]),
+						_: 1
+					}))]),
+					td_action: withCtx(({ row }) => [createElementVNode("div", _hoisted_4, [
+						asItem(row).status === 7 || asItem(row).is_delete ? (openBlock(), createBlock(unref(OLink), {
+							key: 0,
+							"hover-underline": false,
+							color: "danger",
+							onClick: ($event) => deleteItem(asItem(row))
+						}, {
+							default: withCtx(() => [createTextVNode(toDisplayString(unref(t)("meeting.deleteActivity")), 1)]),
+							_: 1
+						}, 8, ["onClick"])) : createCommentVNode("", true),
+						(asItem(row).status === 3 || asItem(row).status === 4) && asItem(row).is_delete !== 1 ? (openBlock(), createBlock(unref(OLink), {
+							key: 1,
+							"hover-underline": false,
+							color: "danger",
+							onClick: ($event) => cancelItem(asItem(row))
+						}, {
+							default: withCtx(() => [createTextVNode(toDisplayString(unref(t)("meeting.cancelActivity")), 1)]),
+							_: 1
+						}, 8, ["onClick"])) : createCommentVNode("", true),
+						asItem(row).status === 2 ? (openBlock(), createBlock(unref(OLink), {
+							key: 2,
+							"hover-underline": false,
+							color: "primary",
+							onClick: ($event) => passItem(asItem(row))
+						}, {
+							default: withCtx(() => [createTextVNode(toDisplayString(unref(t)("meeting.approve")), 1)]),
+							_: 1
+						}, 8, ["onClick"])) : createCommentVNode("", true),
+						asItem(row).status === 2 ? (openBlock(), createBlock(unref(OLink), {
+							key: 3,
+							"hover-underline": false,
+							color: "primary",
+							onClick: ($event) => rejectItem(asItem(row))
+						}, {
+							default: withCtx(() => [createTextVNode(toDisplayString(unref(t)("meeting.reject")), 1)]),
+							_: 1
+						}, 8, ["onClick"])) : createCommentVNode("", true)
+					])]),
+					_: 1
+				}, 8, [
+					"data",
+					"columns",
+					"expanded-row-keys"
+				]), total.value > COUNT_PER_PAGE[0] ? (openBlock(), createElementBlock("div", _hoisted_5, [createVNode(unref(OPagination), {
+					total: total.value,
+					page: params.page,
+					"page-size": params.size,
+					"page-sizes": COUNT_PER_PAGE,
+					layout: [
+						"total",
+						"jumper",
+						"pager",
+						"pagesize"
+					],
+					"show-more": false,
+					onChange: onPaginationChange
+				}, null, 8, [
+					"total",
+					"page",
+					"page-size"
+				])])) : createCommentVNode("", true)])) : (openBlock(), createElementBlock("div", _hoisted_6, [createVNode(unref(OCollapse), {
+					modelValue: expanded.value,
+					"onUpdate:modelValue": _cache[0] || (_cache[0] = ($event) => expanded.value = $event),
+					accordion: unref(isPhone),
+					onChange: change
+				}, {
+					default: withCtx(() => [(openBlock(true), createElementBlock(Fragment, null, renderList(tableData.value, (act) => {
+						return openBlock(), createElementBlock(Fragment, { key: act.id }, [createElementVNode("div", _hoisted_7, [createElementVNode("p", _hoisted_8, toDisplayString(act.title), 1), act.is_delete !== 1 ? (openBlock(), createBlock(unref(OTag), {
+							key: 0,
+							color: "primary",
+							variant: "outline",
+							class: normalizeClass([`tag-${unref(statusMap).get(act.status)?.id}`])
+						}, {
+							default: withCtx(() => [createTextVNode(toDisplayString(unref(statusMap).get(act.status)?.text), 1)]),
+							_: 2
+						}, 1032, ["class"])) : (openBlock(), createBlock(unref(OTag), {
+							key: 1,
+							color: "primary",
+							variant: "outline",
+							class: "tag-cancel"
+						}, {
+							default: withCtx(() => [createTextVNode(toDisplayString(unref(t)("meeting.statusCanceled")), 1)]),
+							_: 1
+						}))]), createVNode(unref(OCollapseItem), { value: act.id }, {
+							title: withCtx(() => [createElementVNode("div", _hoisted_9, [createElementVNode("p", _hoisted_10, toDisplayString(act.sponsor), 1), createElementVNode("p", null, toDisplayString(unref(dayjs)(act.create_time).format("YYYY/MM/DD HH:mm:ss")), 1)]), createElementVNode("div", _hoisted_11, [
+								act.status === 7 || act.is_delete ? (openBlock(), createBlock(unref(OLink), {
+									key: 0,
+									color: "danger",
+									variant: "text",
+									onClick: withModifiers(($event) => deleteItem(act), ["stop"])
+								}, {
+									default: withCtx(() => [createTextVNode(toDisplayString(unref(t)("meeting.deleteActivity")), 1)]),
+									_: 1
+								}, 8, ["onClick"])) : createCommentVNode("", true),
+								(act.status === 3 || act.status === 4) && act.is_delete !== 1 ? (openBlock(), createBlock(unref(OLink), {
+									key: 1,
+									color: "danger",
+									variant: "text",
+									onClick: withModifiers(($event) => cancelItem(act), ["stop"])
+								}, {
+									default: withCtx(() => [createTextVNode(toDisplayString(unref(t)("meeting.cancelActivity")), 1)]),
+									_: 1
+								}, 8, ["onClick"])) : createCommentVNode("", true),
+								act.status === 2 ? (openBlock(), createBlock(unref(OLink), {
+									key: 2,
+									color: "primary",
+									variant: "text",
+									onClick: withModifiers(($event) => passItem(act), ["stop"])
+								}, {
+									default: withCtx(() => [createTextVNode(toDisplayString(unref(t)("meeting.approve")), 1)]),
+									_: 1
+								}, 8, ["onClick"])) : createCommentVNode("", true),
+								act.status === 2 ? (openBlock(), createBlock(unref(OLink), {
+									key: 3,
+									color: "primary",
+									variant: "text",
+									onClick: withModifiers(($event) => rejectItem(act), ["stop"])
+								}, {
+									default: withCtx(() => [createTextVNode(toDisplayString(unref(t)("meeting.reject")), 1)]),
+									_: 1
+								}, 8, ["onClick"])) : createCommentVNode("", true)
+							])]),
+							default: withCtx(() => [createElementVNode("div", _hoisted_12, [createVNode(OMeetingDetail_default, {
+								show: expanded.value.includes(act.id),
+								data: act,
+								ref_for: true,
+								ref: (insRef) => getDetailRefs(insRef, act.id),
+								page: unref(CalendarDataType).APPROVAL
+							}, null, 8, [
+								"show",
+								"data",
+								"page"
+							])])]),
+							_: 2
+						}, 1032, ["value"])], 64);
+					}), 128))]),
+					_: 1
+				}, 8, ["modelValue", "accordion"]), total.value > COUNT_PER_PAGE[0] ? (openBlock(), createElementBlock("div", _hoisted_13, [createVNode(unref(OPagination), {
+					total: total.value,
+					page: params.page,
+					"page-size": params.size,
+					"page-sizes": COUNT_PER_PAGE,
+					layout: [
+						"total",
+						"jumper",
+						"pager",
+						"pagesize"
+					],
+					"show-more": false,
+					simple: true,
+					onChange: onPaginationChange
+				}, null, 8, [
+					"total",
+					"page",
+					"page-size"
+				])])) : createCommentVNode("", true)])),
+				createVNode(unref(ODialog), {
+					visible: reviewVisible.value,
+					"onUpdate:visible": _cache[2] || (_cache[2] = ($event) => reviewVisible.value = $event),
+					"phone-half-full": unref(lePadV),
+					"main-class": "handle-dialog-approval review-dialog",
+					actions: reviewActions.value
+				}, {
+					header: withCtx(() => [createTextVNode(toDisplayString(digTitle.value), 1)]),
+					default: withCtx(() => [createElementVNode("div", _hoisted_14, [createVNode(unref(OForm), {
+						model: form.value,
+						ref_key: "formRef",
+						ref: formRef,
+						"has-required": "",
+						layout: "v",
+						class: "form-wrapper"
+					}, {
+						default: withCtx(() => [createVNode(unref(OFormItem), {
+							rules: rules.value.reason,
+							label: `${unref(t)("meeting.reviewNotesLabel")}${isZh.value ? "：" : ": "}`,
+							field: "reason"
+						}, {
+							default: withCtx(() => [createVNode(unref(OTextarea), {
+								size: "large",
+								placeholder: unref(t)("meeting.enterReviewNotes"),
+								rows: 4,
+								resize: "none",
+								"max-length": 1e3,
+								"input-on-outlimit": false,
+								modelValue: form.value.reason,
+								"onUpdate:modelValue": _cache[1] || (_cache[1] = ($event) => form.value.reason = $event)
+							}, null, 8, ["placeholder", "modelValue"])]),
+							_: 1
+						}, 8, ["rules", "label"])]),
+						_: 1
+					}, 8, ["model"])])]),
+					_: 1
+				}, 8, [
+					"visible",
+					"phone-half-full",
+					"actions"
+				]),
+				createVNode(unref(ODialog), {
+					visible: cancelVisible.value,
+					"onUpdate:visible": _cache[3] || (_cache[3] = ($event) => cancelVisible.value = $event),
+					"phone-half-full": unref(lePadV),
+					"main-class": "handle-dialog-approval cancel-dialog",
+					actions: cancelActions.value
+				}, {
+					header: withCtx(() => [createTextVNode(toDisplayString(cancelTitle.value), 1)]),
+					default: withCtx(() => [createElementVNode("div", _hoisted_15, toDisplayString(cancelStatus.value === 1 ? unref(t)("meeting.confirmCancelActivity", [currentRow.value?.title]) : unref(t)("meeting.confirmDeleteActivity", [currentRow.value?.title])), 1)]),
+					_: 1
+				}, 8, [
+					"visible",
+					"phone-half-full",
+					"actions"
+				])
+			]);
+		};
+	}
+});
+export { OActivityApproval_vue_vue_type_script_setup_true_lang_default as default };