import { _objectSpread2 } from "../../../_virtual/_@oxc-project_runtime@0.122.0/helpers/objectSpread2.js";
import { _objectWithoutProperties } from "../../../_virtual/_@oxc-project_runtime@0.122.0/helpers/objectWithoutProperties.js";
import useEngineContext from "../../../hooks/useEngineContext.js";
import { request } from "../../../utils/index.js";
import PhoneField from "./PhoneField/index.js";
import GenderField from "./GenderField/index.js";
import { addCustomer } from "../serve.js";
import React, { forwardRef, useEffect, useImperativeHandle } from "react";
import { Button, Col, DatePicker, Form, Input, Row, message } from "antd";
import { locales } from "@pisell/utils";
import { PisellContainer } from "@pisell/materials";
import { useRequest } from "ahooks";
import "./index.less";
//#region src/plus/clinetSearch/Add/index.tsx
const _excluded = ["phone"];
const AddClient = forwardRef((props, ref) => {
	var _context$appHelper;
	const context = useEngineContext();
	request.setRequest((_context$appHelper = context.appHelper) === null || _context$appHelper === void 0 || (_context$appHelper = _context$appHelper.utils) === null || _context$appHelper === void 0 ? void 0 : _context$appHelper.request);
	const { onChange, phone, containerProps } = props;
	const [form] = Form.useForm();
	const useIsChecked = Form.useWatch("is_checked", form);
	useEffect(() => {
		form.setFieldsValue({ phone: {
			code: "+61",
			phone
		} });
	}, [phone]);
	useImperativeHandle(ref, () => ({ reset: () => {
		form.resetFields();
	} }));
	const _addClient = useRequest(addCustomer, {
		manual: true,
		onSuccess: (res, param) => {
			var _param$;
			onChange(_objectSpread2(_objectSpread2({}, (_param$ = param[0]) === null || _param$ === void 0 ? void 0 : _param$.customer), {}, { id: res.customer_id }), useIsChecked);
		}
	});
	const onFinish = (values) => {
		var _values$phone;
		const { phone } = values, rest = _objectWithoutProperties(values, _excluded);
		if (!values.first_name && !values.last_name && !values.email && !(values === null || values === void 0 || (_values$phone = values.phone) === null || _values$phone === void 0 ? void 0 : _values$phone.phone)) {
			message.info(locales.getText("pisell2.text.add-client.confirm"));
			return;
		}
		_addClient.run({
			customer: _objectSpread2(_objectSpread2({
				accepts_marketing: 0,
				register_channel: "pos",
				tax_exempt: 1
			}, rest), {}, {
				first_name: rest.first_name || "",
				last_name: rest.last_name || "",
				note: rest.note || "",
				email: rest.email || "",
				country_calling_code: phone.code || "",
				phone: phone.phone || ""
			}),
			address: {
				first_name: "",
				last_name: "",
				company: "",
				address1: "",
				address2: "",
				city: "",
				country_code: "AU",
				province_code: "ACT",
				phone: "",
				country: "澳大利亚",
				province: "Australian Capital Territory",
				country_calling_code: "+61"
			},
			tags: []
		});
	};
	const renderContent = () => {
		return /* @__PURE__ */ React.createElement(Form, {
			form,
			onFinish,
			layout: "vertical",
			initialValues: {
				is_checked: 0,
				phone: {
					code: "+61",
					phone: ""
				}
			},
			size: "large"
		}, /* @__PURE__ */ React.createElement(Row, { gutter: [16, 0] }, /* @__PURE__ */ React.createElement(Col, { span: 12 }, /* @__PURE__ */ React.createElement(Form.Item, {
			label: locales.getText("pisell2.text.firstname"),
			name: "first_name"
		}, /* @__PURE__ */ React.createElement(Input, {
			placeholder: locales.getText("pisell2.text.firstname"),
			size: "large"
		}))), /* @__PURE__ */ React.createElement(Col, { span: 12 }, /* @__PURE__ */ React.createElement(Form.Item, {
			label: locales.getText("pisell2.text.lastname"),
			name: "last_name"
		}, /* @__PURE__ */ React.createElement(Input, {
			placeholder: locales.getText("pisell2.text.lastname"),
			size: "large"
		}))), /* @__PURE__ */ React.createElement(Col, { span: 12 }, /* @__PURE__ */ React.createElement(Form.Item, {
			label: locales.getText("pisell2.text.gender"),
			name: "gender"
		}, /* @__PURE__ */ React.createElement(GenderField, null))), /* @__PURE__ */ React.createElement(Col, { span: 12 }, /* @__PURE__ */ React.createElement(Form.Item, {
			label: locales.getText("pisell2.text.birthday"),
			name: "birthday"
		}, /* @__PURE__ */ React.createElement(DatePicker, {
			style: { width: "100%" },
			size: "large",
			format: "DD/MM/YYYY",
			inputReadOnly: true,
			placeholder: locales.getText("pisell2.text.birthday"),
			placement: "bottomLeft"
		}))), /* @__PURE__ */ React.createElement(Col, { span: 12 }, /* @__PURE__ */ React.createElement(Form.Item, {
			label: locales.getText("pisell2.text.phone"),
			name: "phone"
		}, /* @__PURE__ */ React.createElement(PhoneField, null))), /* @__PURE__ */ React.createElement(Col, { span: 12 }, /* @__PURE__ */ React.createElement(Form.Item, {
			label: locales.getText("pisell2.text.email"),
			name: "email",
			rules: [{
				pattern: /^([a-zA-Z0-9_\-\.+])+@([a-zA-Z0-9-]+\.)+([a-zA-Z]{2,63})+$/,
				message: locales.getText("pisell2.text.email-error-message")
			}]
		}, /* @__PURE__ */ React.createElement(Input, {
			placeholder: locales.getText("pisell2.text.email"),
			size: "large"
		}))), /* @__PURE__ */ React.createElement(Form.Item, {
			hidden: true,
			name: "is_checked"
		}, /* @__PURE__ */ React.createElement(Input, null))));
	};
	const renderFooter = () => {
		return /* @__PURE__ */ React.createElement("div", { className: "select-customer-right-panel-add-client__footer" }, /* @__PURE__ */ React.createElement(Button, {
			size: "large",
			style: { flex: 1 },
			onClick: () => {
				form.setFieldsValue({ is_checked: 0 });
				form.submit();
			},
			loading: _addClient.loading && !useIsChecked
		}, locales.getText("pisell2.text.save")), /* @__PURE__ */ React.createElement(Button, {
			type: "primary",
			size: "large",
			style: { flex: 1 },
			onClick: () => {
				form.setFieldsValue({ is_checked: 1 });
				form.submit();
			},
			loading: _addClient.loading && useIsChecked
		}, locales.getText("pisell2.text.save-and-select")));
	};
	return /* @__PURE__ */ React.createElement(PisellContainer, {
		renderType: "modal",
		props: _objectSpread2(_objectSpread2({}, containerProps), {}, {
			bodyStyle: { padding: "24px 24px 0" },
			footer: renderFooter(),
			destroyOnClose: true
		})
	}, renderContent());
});
//#endregion
export { AddClient as default };
