Danovin
/
application_17
5
0
Fork 0
Code Issues 3 Pull Requests Projects Releases Wiki Activity

update src/views/Address/index.js

Browse Source
master
Reza_ashrafi 2 years ago
parent ea659e0ac0
commit ef69dbe468
1 changed files with 126 additions and 241 deletions
Whitespace
Show all changes Ignore whitespace when comparing lines Ignore changes in amount of whitespace Ignore changes in whitespace at EOL
Split View
Diff Options
Show Stats Download Patch File Download Diff File
  1. 193
      src/views/Address/index.js

193
src/views/Address/index.js
Unescape View File

@ -1,7 +1,13 @@
import React, { useState, useEffect } from "react";
import { connect } from "react-redux";
import { useNavigate, useLocation } from "react-router-dom";
import { publicApi, userAddress, dialog, user } from "../../redux/actions";
import {
publicApi,
userAddress,
dialog,
user,
dashboard,
} from "../../redux/actions";
import onInput from "../../utils/onInput";
import location from "../../utils/location";
@ -33,18 +39,14 @@ export const Address = ({
isMobile,
isDark,
setDialog,
profilePage,
editPage,
setProfileFields,
profileFields,
setProfile,
user,
setHeaderOptions,
headerOptions,
getAddress,
addressInfo,
updateAddress,
isDashboard,
setDashboardPage,
}) => {
const [addressFields, setAddressFields] = useState({});
const [mapAddress, setMapAddress] = useState(null);
@ -57,7 +59,7 @@ export const Address = ({
getProvince();
}
if (isMobile) {
if (editPage || profilePage) {
if (editPage) {
setHeaderOptions(headerOptions);
} else {
setHeaderOptions({
@ -106,61 +108,10 @@ export const Address = ({
}
}, [addressFields]);
useEffect(() => {
if (profileFields?.provinceId) {
getCity({
provinceId: profileFields?.provinceId,
});
}
}, [profileFields]);
const onChange = (name, value) => {
setAddressFields({ ...addressFields, [name]: value });
};
const submitProfile = () => {
if (user.cellphone && user.cellphone.length < 11) {
setDialog({
text: window.t("شماره موبایل خود را وارد کنید."),
type: "alert",
accept: () => {},
open: true,
});
return;
}
const postalCode = profileFields?.postalCode || user.postalCode;
if (postalCode && postalCode.length < 10) {
setDialog({
text: window.t("شماره کد پستی خود را وارد کنید."),
type: "alert",
accept: () => {},
open: true,
});
return;
}
const data = {
firstName: profileFields?.firstName || user.firstName,
lastName: profileFields?.lastName || user.lastName,
username: profileFields?.username || user.username,
cellphone: user.cellphone,
password: profileFields?.password || user.password,
postalCode,
address: profileFields?.address || user.address,
email: profileFields?.email || user.email,
phone: profileFields?.phone || user.phone,
nationalId: profileFields?.nationalId || user.nationalId,
picFileId: profileFields?.picFileId || user.picFileId,
gender: profileFields?.gender || user.gender,
birthDate: profileFields?.birthDate || user.birthDate,
schools: profileFields?.schools || user.schools,
gradeIds: profileFields?.gradeIds || user.gradeIds,
provinceId: profileFields?.provinceId || user.provinceId,
cityId: profileFields?.cityId || user.cityId,
docFileIds: profileFields?.docFileIds || user.docFileIds,
};
setProfile(data);
};
const [activeCheckbox, setActiveCheckbox] = useState(true);
const submit = () => {
@ -300,11 +251,10 @@ export const Address = ({
return (
<div
className={`flex flex-col lg:flex-row-reverse px-4 flex-1 lg:pt-0 pb-20 gap-5 lg:divide-x lg:divide-solid lg:divide-gray-200 ${
location?.state?.panel === isMobile ? "mt-2" : "lg:mt-32 lg:px-10"
location?.state?.panel === isMobile ? "mt-2" : "lg:pt-10 lg:px-10"
} `}
// style={{ minHeight: "calc(100vh - 500px)" }}
>
{!profilePage && (
<div className="flex flex-col w-full lg:w-1/2">
<Input
width="100%"
@ -336,8 +286,12 @@ export const Address = ({
<button
className="bg-transparent mt-4 text-base lg:text-tiny border border-blueC0 text-blueC0 font-bold rounded-md py-3.5 lg:py-4 flex justify-center items-center"
onClick={() => {
if (isDashboard) {
setDashboardPage("addresses");
} else {
setPhase("deliveryForm");
navigation(-1);
}
}}
>
{window.t("بازگشت")}
@ -350,15 +304,8 @@ export const Address = ({
</div>
</div>
</div>
)}
<div
className={`flex flex-col w-full lg:w-1/2 lg:pl-4 ${
profilePage ? "mx-auto" : ""
}`}
>
{!profilePage && (
<>
<div className={`flex flex-col w-full lg:w-1/2 lg:pl-4`}>
<div className="flex item-center gap-x-4">
{/* my self */}
<div
@ -397,10 +344,8 @@ export const Address = ({
</p>
</div>
</div>
</>
)}
{profilePage || activeCheckbox === false ? (
{activeCheckbox === false ? (
<>
<Header
title={window.t("اطلاعات هویتی")}
@ -415,16 +360,8 @@ export const Address = ({
label={window.t("نام")}
regex={(val) => val}
name="firstName"
onChange={(name, value) =>
profilePage
? setProfileFields({ ...profileFields, firstName: value })
: onChange(name, value)
}
value={
profilePage
? profileFields.firstName || user.firstName
: addressFields?.firstName
}
onChange={(name, value) => onChange(name, value)}
value={addressFields?.firstName}
align="text-right"
direction="rtl"
/>
@ -434,16 +371,8 @@ export const Address = ({
label={window.t("نام خانوادگی")}
regex={(val) => val}
name="lastName"
onChange={(name, value) =>
profilePage
? setProfileFields({ ...profileFields, lastName: value })
: onChange(name, value)
}
value={
profilePage
? profileFields.lastName || user.lastName
: addressFields?.lastName
}
onChange={(name, value) => onChange(name, value)}
value={addressFields?.lastName}
align="text-right"
direction="rtl"
/>
@ -462,11 +391,7 @@ export const Address = ({
label={window.t("شماره موبایل")}
regex={(val) => onInput.phonenumber(val)}
name="cellphone"
value={
profilePage
? profileFields.cellphone || user.cellphone
: addressFields?.cellphone
}
value={addressFields?.cellphone}
onChange={(name, value) => onChange(name, value)}
align="text-right"
direction="ltr"
@ -477,16 +402,8 @@ export const Address = ({
label={window.t("شماره تلفن")}
regex={(val) => onInput.numberOnly(val)}
name="phone"
value={
profilePage
? profileFields.phone || user.phone
: addressFields?.phone
}
onChange={(name, value) =>
profilePage
? setProfileFields({ ...profileFields, phone: value })
: onChange(name, value)
}
value={addressFields?.phone}
onChange={(name, value) => onChange(name, value)}
align="text-right"
direction="ltr"
maxLength={11}
@ -507,17 +424,9 @@ export const Address = ({
selectProvince={"استان"}
options={provinces.map((e) => ({ value: e.id, name: e.name }))}
name="provinceId"
defaultValue={
profilePage
? profileFields.provinceId || provinces[0]?.id
: provinces[0]?.id
}
defaultValue={provinces[0]?.id}
onChange={(name, value) =>
value === window.t("استان")
? {}
: profilePage
? setProfileFields({ ...profileFields, provinceId: value })
: onChange(name, value)
value === window.t("استان") ? {} : onChange(name, value)
}
width={isMobile ? "w-full" : "w-1/2"}
backgroundColor={
@ -530,17 +439,9 @@ export const Address = ({
selectProvince={"شهر"}
options={cities.map((e) => ({ value: e.id, name: e.name }))}
name="cityId"
defaultValue={
profilePage
? profileFields.cityId || cities[0]?.id
: cities[0]?.id
}
defaultValue={cities[0]?.id}
onChange={(name, value) =>
value === window.t("شهر")
? {}
: profilePage
? setProfileFields({ ...profileFields, cityId: value })
: onChange(name, value)
value === window.t("شهر") ? {} : onChange(name, value)
}
width={isMobile ? "w-full" : "w-1/2"}
backgroundColor={
@ -567,16 +468,8 @@ export const Address = ({
label={window.t("کد پستی")}
regex={(val) => onInput.numberOnly(val)}
name="postalCode"
value={
profilePage
? profileFields.postalCode || user.postalCode
: addressFields?.postalCode
}
onChange={(name, value) =>
profilePage
? setProfileFields({ ...profileFields, postalCode: value })
: onChange(name, value)
}
value={addressFields?.postalCode}
onChange={(name, value) => onChange(name, value)}
align="text-right"
direction="ltr"
maxLength={10}
@ -584,31 +477,26 @@ export const Address = ({
<div className="lg:w-1/2"></div>
</div>
<div
className={`flex ${
profilePage ? "mt-10" : "lg:hidden"
} flex-col items-end w-full mt-3`}
>
<div className={`flex lg:hidden flex-col items-end w-full mt-3`}>
<Button
loading={loading}
title={
!profilePage
? `${window.t("ذخیره اطلاعات و بازگشت به صفحه قبل")}`
: `${window.t("ارسال")}`
}
title={window.t("ذخیره اطلاعات و بازگشت به صفحه قبل")}
backgroundColor="bg-blueC0"
border={{ color: "#196EC055", width: "0px" }}
width={profilePage ? "30%" : "100%"}
width={"100%"}
color="text-white"
onClick={() => (profilePage ? submitProfile() : submit())}
onClick={() => submit()}
/>
{!isMobile && (
<button
style={{ width: "30%" }}
className="flex justify-center items-center mt-4 py-3 text-blueC0 text-base lg:text-tiny border-2 border-blueC0 cursor-pointer rounded-md"
className="hidden lg:flex justify-center items-center mt-4 py-3 text-blueC0 text-base lg:text-tiny border-2 border-blueC0 cursor-pointer rounded-md"
onClick={() => {
if (isDashboard) {
setDashboardPage("addresses");
} else {
setPhase("deliveryForm");
navigation(-1);
}
}}
>
{window.t("بازگشت")}
@ -618,7 +506,6 @@ export const Address = ({
className="w-3.5 transform rotate-90"
/>
</button>
)}
</div>
</div>
</div>
@ -635,7 +522,6 @@ const mapStateToProps = (state) => ({
cityLoading: state.publicApi.loading,
isMobile: state.config.device === "mobile",
isDark: state.publicApi.isDark,
profileFields: state.user.profileFields,
addressInfo: state.userAddress.info,
});
@ -646,9 +532,8 @@ const mapDispatchToProps = {
updateAddress: userAddress.update,
getAddress: userAddress.info,
setDialog: dialog.set,
setProfileFields: user.setProfileFields,
setProfile: user.setProfile,
setHeaderOptions: publicApi.setHeaderOptions,
setDashboardPage: dashboard.setPage,
};
export default connect(mapStateToProps, mapDispatchToProps)(Address);

Write Preview
Loading…
Cancel
Save