import { isAllDay } from "../../schedules/utils.js";
import dayjs from "dayjs";
import React, { useMemo } from "react";
import { Button, Skeleton } from "antd";
import { locales } from "@pisell/utils";
import "./index.less";
//#region src/components/schedules/components/ScheduleDetailList/index.tsx
const formatTimeAmPm = (str) => {
	return dayjs(str).format("hh:mm A");
};
const startEndTime = (start, end) => {
	return `${formatTimeAmPm(start)} - ${formatTimeAmPm(end)}`;
};
const ScheduleTimeItem = (props) => {
	var _scheduleMap$item$id;
	const { item, scheduleMap } = props;
	const renderFormat = ((_scheduleMap$item$id = scheduleMap[item.id]) === null || _scheduleMap$item$id === void 0 ? void 0 : _scheduleMap$item$id.dateRangeFormat) || [];
	if (!renderFormat.length || renderFormat.some((item) => isAllDay({
		start_time: item.start,
		end_time: item.end
	}))) return /* @__PURE__ */ React.createElement("div", { className: "pisell-lowcode__schedule-detail-item-time-item" }, locales.getText("pisell2.text.schedules.all-day"));
	return renderFormat.map((item) => {
		return /* @__PURE__ */ React.createElement("div", {
			className: "pisell-lowcode__schedule-detail-item-time-item",
			key: item.start + item.end
		}, isAllDay({
			start_time: item.start,
			end_time: item.end
		}) ? locales.getText("pisell2.text.schedules.all-day") : startEndTime(item.start, item.end));
	});
};
/**
* 日程列表 展示日程中详细时间段信息
* @param props
* @constructor
*/
const ScheduleDetailList = (props) => {
	const { dataSource, onOpenDetail, loading, scheduleMap } = props;
	const content = useMemo(() => {
		return dataSource.map((item) => {
			return /* @__PURE__ */ React.createElement("div", {
				className: "pisell-lowcode__schedule-detail-item",
				key: item.id
			}, /* @__PURE__ */ React.createElement("div", { className: "pisell-lowcode__schedule-detail-item-title" }, /* @__PURE__ */ React.createElement("div", {
				className: "pisell-lowcode__schedule-detail-item-title-color",
				style: { backgroundColor: item.color }
			}), /* @__PURE__ */ React.createElement("div", { className: "pisell-lowcode__schedule-detail-item-title-name" }, item.name)), /* @__PURE__ */ React.createElement(ScheduleTimeItem, {
				item,
				scheduleMap
			}), /* @__PURE__ */ React.createElement(Button, {
				className: "pisell-lowcode__schedule-detail-item-button",
				onClick: () => onOpenDetail === null || onOpenDetail === void 0 ? void 0 : onOpenDetail(item.id),
				size: "large"
			}, locales.getText("pisell2.text.schedules.edit-schedule")));
		});
	}, [dataSource, scheduleMap]);
	return /* @__PURE__ */ React.createElement("div", { className: "pisell-lowcode__schedule-detail-list" }, loading ? /* @__PURE__ */ React.createElement("div", { className: "pisell-lowcode__schedule-detail-item" }, /* @__PURE__ */ React.createElement(Skeleton, null)) : content);
};
//#endregion
export { ScheduleDetailList as default };
