40 lines
1.4 KiB
TypeScript
40 lines
1.4 KiB
TypeScript
import ProInputCard from "components/ProInputCard/ProInputCard.tsx";
|
|
import ProPhoneInput from "components/ProPhoneInput";
|
|
import { selectCart, updateCustomerName } from "features/order/orderSlice";
|
|
import { OrderType } from "pages/checkout/hooks/types.ts";
|
|
import { useTranslation } from "react-i18next";
|
|
import { useAppDispatch, useAppSelector } from "redux/hooks";
|
|
import { Form, Input } from "antd";
|
|
import styles from "./CustomerInformationCard.module.css";
|
|
|
|
export default function CustomerInformationCard() {
|
|
const { t } = useTranslation();
|
|
const { orderType } = useAppSelector(selectCart);
|
|
const dispatch = useAppDispatch();
|
|
const customerName = useAppSelector((state) => state.order.customerName);
|
|
|
|
return (
|
|
orderType !== OrderType.Gift && (
|
|
<>
|
|
<ProInputCard title={t("checkout.customerInformation")}>
|
|
<div className={styles.customerInformationCard}>
|
|
<Form.Item name="customerName">
|
|
<Input
|
|
placeholder={t("checkout.customerName")}
|
|
size="large"
|
|
autoFocus={false}
|
|
style={{ padding: "7px 11px", height: 48, borderRadius: 888 }}
|
|
value={customerName}
|
|
onChange={(e) => {
|
|
dispatch(updateCustomerName(e.target.value));
|
|
}}
|
|
/>
|
|
</Form.Item>
|
|
<ProPhoneInput propName="phone" />
|
|
</div>
|
|
</ProInputCard>
|
|
</>
|
|
)
|
|
);
|
|
}
|