const require_runtime = require("../../../_virtual/_rolldown/runtime.js");
const require_MapField = require("./components/MapField.js");
let react = require("react");
react = require_runtime.__toESM(react);
let antd = require("antd");
let _pisell_utils = require("@pisell/utils");
let _pisell_materials = require("@pisell/materials");
//#region src/plus/saasAttendance/settings/ClockInMethodTab.tsx
const ClockInMethodTab = (props) => {
	var _Form$useWatch, _Form$useWatch2;
	const { form } = props;
	const maxLocations = 200;
	const mapFieldRef = (0, react.useRef)(null);
	const defaultValidRangeMeters = (_Form$useWatch = antd.Form.useWatch(["place", "radius"], form)) !== null && _Form$useWatch !== void 0 ? _Form$useWatch : 100;
	const locations = (_Form$useWatch2 = antd.Form.useWatch(["place", "location"], form)) !== null && _Form$useWatch2 !== void 0 ? _Form$useWatch2 : [];
	const isMaxLocations = Array.isArray(locations) && locations.length >= maxLocations;
	const openAddLocation = () => {
		var _mapFieldRef$current;
		if (isMaxLocations) return;
		(_mapFieldRef$current = mapFieldRef.current) === null || _mapFieldRef$current === void 0 || _mapFieldRef$current.onAddLocation();
	};
	const approvedLocationsLabel = (0, react.useMemo)(() => _pisell_utils.locales.getText("pisell2.attendance.group-settings.clock-in-method.approved-locations.label")(maxLocations), [maxLocations]);
	return /* @__PURE__ */ react.default.createElement("div", {
		className: "saas-attendance-group-settings__panel",
		id: props.id
	}, /* @__PURE__ */ react.default.createElement("div", { className: "saas-attendance-group-settings__banner banner-green" }, /* @__PURE__ */ react.default.createElement("div", { className: "banner-icon" }, /* @__PURE__ */ react.default.createElement(_pisell_materials.Icon, {
		type: "pisell2-marker-pin-01",
		size: 20
	})), /* @__PURE__ */ react.default.createElement("div", { className: "banner-body" }, /* @__PURE__ */ react.default.createElement("div", { className: "banner-title" }, _pisell_utils.locales.getText("pisell2.attendance.group-settings.clock-in-method.gps.title")), /* @__PURE__ */ react.default.createElement("div", { className: "banner-desc" }, _pisell_utils.locales.getText("pisell2.attendance.group-settings.clock-in-method.gps.desc")))), /* @__PURE__ */ react.default.createElement("div", { className: "saas-attendance-group-settings__section" }, /* @__PURE__ */ react.default.createElement("div", { className: "saas-attendance-group-settings__section-head" }, /* @__PURE__ */ react.default.createElement("div", { className: "saas-attendance-group-settings__section-title" }, approvedLocationsLabel), /* @__PURE__ */ react.default.createElement(antd.Button, {
		type: "primary",
		icon: /* @__PURE__ */ react.default.createElement(_pisell_materials.Icon, {
			type: "pisell2-plus",
			size: 16
		}),
		onClick: openAddLocation,
		disabled: isMaxLocations
	}, _pisell_utils.locales.getText("pisell2.attendance.group-settings.actions.add-location"))), /* @__PURE__ */ react.default.createElement(antd.Form.Item, {
		name: ["place", "location"],
		style: { marginBottom: 0 }
	}, /* @__PURE__ */ react.default.createElement(require_MapField.default, {
		ref: mapFieldRef,
		defaultRadius: defaultValidRangeMeters
	}))), /* @__PURE__ */ react.default.createElement("div", { className: "saas-attendance-group-settings__section" }, /* @__PURE__ */ react.default.createElement("div", { className: "saas-attendance-group-settings__section-title" }, _pisell_utils.locales.getText("pisell2.attendance.group-settings.clock-in-method.default-valid-range.label")), /* @__PURE__ */ react.default.createElement("div", { className: "saas-attendance-group-settings__slider-row" }, /* @__PURE__ */ react.default.createElement(antd.Form.Item, {
		name: ["place", "radius"],
		style: {
			marginBottom: 0,
			flex: 1
		}
	}, /* @__PURE__ */ react.default.createElement(antd.Slider, {
		min: 0,
		max: 1e3
	})), /* @__PURE__ */ react.default.createElement("div", { className: "saas-attendance-group-settings__slider-value" }, _pisell_utils.locales.getText("pisell2.attendance.group-settings.clock-in-method.meters")(defaultValidRangeMeters || 0))), /* @__PURE__ */ react.default.createElement("div", { className: "saas-attendance-group-settings__help" }, _pisell_utils.locales.getText("pisell2.attendance.group-settings.clock-in-method.default-valid-range.desc"))));
};
//#endregion
exports.default = ClockInMethodTab;
