const require_runtime = require("../../_virtual/_rolldown/runtime.js");
const require_objectSpread2 = require("../../_virtual/_@oxc-project_runtime@0.122.0/helpers/objectSpread2.js");
const require_objectWithoutProperties = require("../../_virtual/_@oxc-project_runtime@0.122.0/helpers/objectWithoutProperties.js");
const require_useEngineContext = require("../../hooks/useEngineContext.js");
const require_useTranslationOriginal = require("../../hooks/useTranslationOriginal.js");
const require_index = require("../clientName/index.js");
const require_InfiniteScroll = require("./InfiniteScroll/InfiniteScroll.js");
const require_index$1 = require("../../pro/comprehensiveSearch/index.js");
const require_index$2 = require("./Add/index.js");
const require_locales = require("./locales.js");
let dayjs = require("dayjs");
dayjs = require_runtime.__toESM(dayjs);
let react = require("react");
react = require_runtime.__toESM(react);
let antd = require("antd");
let _pisell_utils = require("@pisell/utils");
require("./index.less");
//#region src/plus/clinetSearch/index.tsx
const _excluded = [
	"onRowClick",
	"resultProps",
	"onAddClient",
	"hasMore",
	"onLoadMore",
	"state",
	"resultLoading"
];
const ClientSearch = (0, react.forwardRef)((_ref, ref) => {
	var _context$appHelper, _state$bookingConfig, _context$appHelper2;
	let { onRowClick, resultProps, onAddClient, hasMore, onLoadMore, state, resultLoading } = _ref, props = require_objectWithoutProperties._objectWithoutProperties(_ref, _excluded);
	const [modalVisible, setModalVisible] = (0, react.useState)(false);
	const comprehensiveSearchRef = (0, react.useRef)(null);
	const addClientRef = (0, react.useRef)(null);
	const scrollContainerRef = (0, react.useRef)(null);
	const translationOriginal = require_useTranslationOriginal.default();
	const context = require_useEngineContext.default();
	_pisell_utils.locales.init(require_locales.default, ((_context$appHelper = context.appHelper) === null || _context$appHelper === void 0 || (_context$appHelper = _context$appHelper.utils) === null || _context$appHelper === void 0 || (_context$appHelper = _context$appHelper.storage) === null || _context$appHelper === void 0 ? void 0 : _context$appHelper.get("umi_locale")) || "en");
	const appointmentSubject = (state === null || state === void 0 || (_state$bookingConfig = state.bookingConfig) === null || _state$bookingConfig === void 0 || (_state$bookingConfig = _state$bookingConfig.config) === null || _state$bookingConfig === void 0 || (_state$bookingConfig = _state$bookingConfig.basic) === null || _state$bookingConfig === void 0 ? void 0 : _state$bookingConfig.appointment_subject) || {};
	const translation = context === null || context === void 0 || (_context$appHelper2 = context.appHelper) === null || _context$appHelper2 === void 0 || (_context$appHelper2 = _context$appHelper2.utils) === null || _context$appHelper2 === void 0 ? void 0 : _context$appHelper2.translationShop;
	const handleAdd = () => {
		setModalVisible(true);
	};
	const handleModalCancel = () => {
		var _addClientRef$current;
		setModalVisible(false);
		(_addClientRef$current = addClientRef.current) === null || _addClientRef$current === void 0 || _addClientRef$current.reset();
	};
	const renderListHeader = () => {
		return /* @__PURE__ */ react.default.createElement("div", { className: "client-search-list-header" }, /* @__PURE__ */ react.default.createElement("div", {
			className: "header-item",
			style: { width: 180 }
		}, _pisell_utils.locales.getText("pisell2.text.client-search.name")), /* @__PURE__ */ react.default.createElement("div", {
			className: "header-item",
			style: { width: 110 }
		}, _pisell_utils.locales.getText("pisell2.text.client-search.register-time")), /* @__PURE__ */ react.default.createElement("div", {
			className: "header-item",
			style: { width: 125 }
		}, _pisell_utils.locales.getText("pisell2.text.client-search.membership")), /* @__PURE__ */ react.default.createElement("div", {
			className: "header-item",
			style: { width: 180 }
		}, _pisell_utils.locales.getText("pisell2.text.client-search.contact-info")), /* @__PURE__ */ react.default.createElement("div", {
			className: "header-item",
			style: { width: 200 }
		}, translation(appointmentSubject === null || appointmentSubject === void 0 ? void 0 : appointmentSubject.form_name) || _pisell_utils.locales.getText("pisell2.text.client-search.holder")));
	};
	const renderResults = (searchResults) => {
		return /* @__PURE__ */ react.default.createElement(react.default.Fragment, null, (searchResults === null || searchResults === void 0 ? void 0 : searchResults.length) ? renderListHeader() : null, /* @__PURE__ */ react.default.createElement("div", {
			ref: scrollContainerRef,
			id: "client-search_infinite-scroll",
			style: {
				position: "relative",
				height: "calc(100% - 40px)",
				overflowY: "auto",
				overflowX: "hidden",
				display: "flex"
			}
		}, resultLoading && /* @__PURE__ */ react.default.createElement(antd.Spin, {
			spinning: resultLoading || false,
			className: "pisell-client-search-result-loading",
			size: "large"
		}), /* @__PURE__ */ react.default.createElement(require_InfiniteScroll.default, {
			dataLength: searchResults.length,
			next: () => {
				console.log("loading more");
				onLoadMore === null || onLoadMore === void 0 || onLoadMore();
			},
			hasMore: hasMore || false,
			style: { width: "100%" },
			loader: /* @__PURE__ */ react.default.createElement("div", { style: {
				textAlign: "center",
				padding: "20px",
				color: "#999"
			} }, _pisell_utils.locales.getText("pisell2.text.loading")),
			endMessage: /* @__PURE__ */ react.default.createElement("div", { style: {
				textAlign: "center",
				color: "#999"
			} }, (searchResults === null || searchResults === void 0 ? void 0 : searchResults.length) ? _pisell_utils.locales.getText("pisell2.text.no-more-data") : null),
			scrollableTarget: "client-search_infinite-scroll",
			scrollThreshold: "180px"
		}, /* @__PURE__ */ react.default.createElement(antd.List, {
			dataSource: searchResults,
			renderItem: (item, index) => {
				var _latest_wallet_detail, _item$contacts_info, _item$contacts_info2, _item$contacts_info3, _item$form_record, _item$form_record2;
				const membershipText = (_latest_wallet_detail = item.latest_wallet_detail) === null || _latest_wallet_detail === void 0 || (_latest_wallet_detail = _latest_wallet_detail.wallet) === null || _latest_wallet_detail === void 0 ? void 0 : _latest_wallet_detail.name;
				return /* @__PURE__ */ react.default.createElement(antd.List.Item, {
					key: item.id,
					className: "client-search-list-item"
				}, /* @__PURE__ */ react.default.createElement("div", {
					className: "list-item-content",
					onClick: () => onRowClick === null || onRowClick === void 0 ? void 0 : onRowClick(item, index || 0),
					style: { cursor: "pointer" }
				}, /* @__PURE__ */ react.default.createElement("div", {
					className: "item-cell",
					style: { width: 180 }
				}, /* @__PURE__ */ react.default.createElement(require_index.default, { dataSource: item }), /* @__PURE__ */ react.default.createElement("div", null, item.phone || "-"), /* @__PURE__ */ react.default.createElement("div", { style: {
					overflow: "hidden",
					textOverflow: "ellipsis",
					whiteSpace: "nowrap"
				} }, item.email || "-")), /* @__PURE__ */ react.default.createElement("div", {
					className: "item-cell",
					style: { width: 110 }
				}, (0, dayjs.default)(item.created_at).format("YYYY-MM-DD") || "-"), /* @__PURE__ */ react.default.createElement("div", {
					className: "item-cell",
					style: { width: 125 }
				}, membershipText && (translationOriginal === null || translationOriginal === void 0 ? void 0 : translationOriginal(membershipText)) ? /* @__PURE__ */ react.default.createElement(antd.Tag, {
					color: "gold",
					style: {
						overflow: "hidden",
						whiteSpace: "nowrap",
						textOverflow: "ellipsis",
						width: "auto",
						maxWidth: "100%",
						display: "inline-block",
						borderRadius: 16,
						marginRight: 0
					}
				}, translationOriginal === null || translationOriginal === void 0 ? void 0 : translationOriginal(membershipText)) : "-"), /* @__PURE__ */ react.default.createElement("div", {
					className: "item-cell",
					style: { width: 180 }
				}, /* @__PURE__ */ react.default.createElement(require_index.default, { dataSource: item === null || item === void 0 || (_item$contacts_info = item.contacts_info) === null || _item$contacts_info === void 0 ? void 0 : _item$contacts_info.value }), (item === null || item === void 0 || (_item$contacts_info2 = item.contacts_info) === null || _item$contacts_info2 === void 0 || (_item$contacts_info2 = _item$contacts_info2.value) === null || _item$contacts_info2 === void 0 || (_item$contacts_info2 = _item$contacts_info2.phone) === null || _item$contacts_info2 === void 0 ? void 0 : _item$contacts_info2.phone) || "-", /* @__PURE__ */ react.default.createElement("div", { style: {
					overflow: "hidden",
					textOverflow: "ellipsis",
					whiteSpace: "nowrap"
				} }, (item === null || item === void 0 || (_item$contacts_info3 = item.contacts_info) === null || _item$contacts_info3 === void 0 || (_item$contacts_info3 = _item$contacts_info3.value) === null || _item$contacts_info3 === void 0 ? void 0 : _item$contacts_info3.email) || "-")), /* @__PURE__ */ react.default.createElement("div", {
					className: "item-cell",
					style: { width: 200 }
				}, (item === null || item === void 0 || (_item$form_record = item.form_record) === null || _item$form_record === void 0 ? void 0 : _item$form_record.length) > 0 ? item === null || item === void 0 || (_item$form_record2 = item.form_record) === null || _item$form_record2 === void 0 ? void 0 : _item$form_record2.map((itemForm) => {
					return /* @__PURE__ */ react.default.createElement("div", {
						key: itemForm === null || itemForm === void 0 ? void 0 : itemForm.id,
						style: {
							overflow: "hidden",
							textOverflow: "ellipsis",
							whiteSpace: "nowrap"
						}
					}, (itemForm === null || itemForm === void 0 ? void 0 : itemForm.main_field) || "-");
				}) : "-")));
			}
		}))));
	};
	const handleAddClient = (record, isChecked) => {
		onAddClient === null || onAddClient === void 0 || onAddClient(record, isChecked);
		handleModalCancel();
	};
	(0, react.useImperativeHandle)(ref, () => ({ resetScrollPosition: () => {
		if (scrollContainerRef.current) scrollContainerRef.current.scrollTop = 0;
	} }));
	return /* @__PURE__ */ react.default.createElement(react.default.Fragment, null, /* @__PURE__ */ react.default.createElement(require_index$1.default, require_objectSpread2._objectSpread2(require_objectSpread2._objectSpread2({}, props), {}, {
		ref: comprehensiveSearchRef,
		renderType: "modal",
		onAdd: handleAdd,
		resultDisplay: renderResults
	})), /* @__PURE__ */ react.default.createElement(require_index$2.default, {
		containerProps: {
			className: "pisell-client-search__new-client-modal",
			title: _pisell_utils.locales.getText("pisell2.text.create-new-client"),
			open: modalVisible,
			onCancel: handleModalCancel,
			width: 680
		},
		onChange: handleAddClient,
		ref: addClientRef
	}));
});
//#endregion
exports.default = ClientSearch;
