Files
web-menu-react-version-/src/pages/checkout/components/phoneCard.tsx

28 lines
950 B
TypeScript

import { Form, Input } from "antd";
import ProInputCard from "components/ProInputCard/ProInputCard.tsx";
import { selectCart, updatePhone } from "features/order/orderSlice";
import { useTranslation } from "react-i18next";
import { useAppDispatch, useAppSelector } from "redux/hooks";
export default function PhoneCard() {
const { t } = useTranslation();
const dispatch = useAppDispatch();
const { phone } = useAppSelector(selectCart);
return (
<>
<ProInputCard title={t("checkout.phoneNumber")}>
<Form.Item name="phone" required rules={[{ required: true }]}>
<Input
placeholder={t("checkout.phoneNumber")}
size="large"
autoFocus={false}
style={{ padding: "7px 11px", height: 50, borderRadius: 888 }}
value={phone}
onChange={(e) => dispatch(updatePhone(e.target.value))}
/>
</Form.Item>
</ProInputCard>
</>
);
}