56 lines
1.9 KiB
TypeScript
56 lines
1.9 KiB
TypeScript
import ProInputCard from "components/ProInputCard/ProInputCard.tsx";
|
|
import ProPhoneInput from "components/ProPhoneInput";
|
|
import { selectCart, updateGiftDetails } from "features/order/orderSlice";
|
|
import { useTranslation } from "react-i18next";
|
|
import { useAppDispatch, useAppSelector } from "redux/hooks";
|
|
import { Checkbox, Form, Input } from "antd";
|
|
import styles from "./SenderformationCard.module.css";
|
|
import TextArea from "antd/es/input/TextArea";
|
|
import ProText from "components/ProText";
|
|
|
|
export default function SenderformationCard() {
|
|
const { t } = useTranslation();
|
|
const dispatch = useAppDispatch();
|
|
const { giftDetails } = useAppSelector(selectCart);
|
|
|
|
return (
|
|
<ProInputCard title={t("cardDetails.receiverInformation")}>
|
|
<div className={styles.customerInformationCard}>
|
|
<Form.Item name="receiverName">
|
|
<Input
|
|
placeholder={t("cardDetails.yourName")}
|
|
size="large"
|
|
autoFocus={false}
|
|
style={{ padding: "7px 11px", height: 48, borderRadius: 888 }}
|
|
value={giftDetails?.senderName}
|
|
onChange={(e) => {
|
|
dispatch(updateGiftDetails({ senderName: e.target.value }));
|
|
}}
|
|
/>
|
|
</Form.Item>
|
|
<ProPhoneInput
|
|
propName="yourPhone"
|
|
value={giftDetails?.senderPhone}
|
|
onChange={(e) => {
|
|
dispatch(updateGiftDetails({ senderPhone: e }));
|
|
}}
|
|
/>
|
|
<Form.Item name="isSecret" colon={false}>
|
|
<Checkbox
|
|
style={{
|
|
fontSize: 14,
|
|
}}
|
|
autoFocus={false}
|
|
checked={giftDetails?.isSecret}
|
|
onChange={(e) => {
|
|
dispatch(updateGiftDetails({ isSecret: e.target.checked }));
|
|
}}
|
|
>
|
|
<ProText>{t("cardDetails.keepMyNameSecret")}</ProText>
|
|
</Checkbox>
|
|
</Form.Item>
|
|
</div>
|
|
</ProInputCard>
|
|
);
|
|
}
|