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

update src/views/Auth/Profile/Document/index.js, src/views/Auth/Profile/Document/index.scss, src/views/Auth/Profile/Upload/index.js and src/views/Auth/Profile/index.js

Browse Source
master
Reza_ashrafi 2 years ago
parent 82d7aec1df
commit 92e000e0d5
4 changed files with 96 additions and 120 deletions
Whitespace
Show all changes Ignore whitespace when comparing lines Ignore changes in amount of whitespace Ignore changes in whitespace at EOL
Unified View
Diff Options
Show Stats Download Patch File Download Diff File
  1. 7
      src/views/Auth/Profile/Document/index.js
  2. 5
      src/views/Auth/Profile/Document/index.scss
  3. 2
      src/views/Auth/Profile/Upload/index.js
  4. 202
      src/views/Auth/Profile/index.js

7
src/views/Auth/Profile/Document/index.js
Unescape View File

@ -1,9 +1,10 @@
import React from "react"; import React from "react";
import './index.scss';
export default function Document({ defaultValue, name, onChange }) { export default function Document({ value, name, onChange }) {
return ( return (
<div className="mobile-auth-profile__document d-flex justify-content-center align-items-center mb-3"> <div className="mobile-auth-profile__document flex justify-center items-center mb-3">
{defaultValue.docFileIds === "" ? ( {!value?.docFileIds ? (
<> <>
<input <input
type="file" type="file"

5
src/views/Auth/Profile/Document/index.scss
Unescape View File

@ -4,7 +4,7 @@
width: 100%; width: 100%;
height: 50px; height: 50px;
border-radius: 10px; border-radius: 10px;
border: 2px dashed $gray1; border: 2px dashed #aaa;
position: relative; position: relative;
input { input {
width: 100%; width: 100%;
@ -21,8 +21,7 @@
border-radius: 50%; border-radius: 50%;
} }
span { span {
color: #afafaf; color: #444;
font-family: numeralLight;
} }
} }
} }

2
src/views/Auth/Profile/Upload/index.js
Unescape View File

@ -27,7 +27,7 @@ function Upload({ name, value: initValue, onChange }) {
value value
? value?.indexOf("data") > -1 ? value?.indexOf("data") > -1
? value ? value
: "https://iranesch.com/api/v1/file/" + value : "https://dnvn.ir/api/v1/file/" + value
: camera : camera
} }
alt="" alt=""

202
src/views/Auth/Profile/index.js
Unescape View File

@ -5,10 +5,10 @@ import { user, file, publicApi } from "../../../redux/actions";
import { connect } from "react-redux"; import { connect } from "react-redux";
import moment from "jalali-moment"; import moment from "jalali-moment";
//components
import Select from "../../../components/Select"; import Select from "../../../components/Select";
import Input from "../../../components/Input"; import Input from "../../../components/Input";
import TextArea from "../../../components/Textarea"; import TextArea from "../../../components/Textarea";
import Button from "../../../components/Button";
import Upload from "./Upload"; import Upload from "./Upload";
import Gender from "./GenderSwitch"; import Gender from "./GenderSwitch";
import Birthdate from "./Birthdate"; import Birthdate from "./Birthdate";
@ -40,47 +40,43 @@ function Profile({
const momentDate = moment(profile?.birthDate); const momentDate = moment(profile?.birthDate);
const isValid = momentDate.isValid(); const isValid = momentDate.isValid();
setFormData({ setFormData({
file: uploads["file"] || profile.picFileId, // file: uploads["file"] || profile.picFileId,
picFileId: uploads["file"] || profile.picFileId, picFileId: uploads["file"] || profile?.picFileId,
docFileIds: uploads["docFileIds"] || profile.docFileIds, docFileIds: uploads["docFileIds"] || profile?.docFileIds,
firstName: profile.firstName, firstName: profile?.firstName,
lastName: profile.lastName, lastName: profile?.lastName,
password: profile.password, password: profile?.password,
username: profile.username, username: profile?.username,
address: profile.address, address: profile?.address,
email: profile.email, email: profile?.email,
birthDate: { birthDate: {
day: isValid ? moment(profile?.birthDate).format("jDD") : null, day: isValid ? moment(profile?.birthDate).format("jDD") : null,
month: isValid ? moment(profile?.birthDate).format("jMM") : null, month: isValid ? moment(profile?.birthDate).format("jMM") : null,
year: isValid ? moment(profile?.birthDate).format("jYYYY") : null, year: isValid ? moment(profile?.birthDate).format("jYYYY") : null,
}, },
gender: profile.gender || 1, gender: profile?.gender || 1,
status: profile.status || 1, status: profile?.status || 1,
nationalId: profile.nationalId || "", nationalId: profile?.nationalId || "",
phone: profile.phone || "", phone: profile?.phone || "",
schools: profile.schools || null, cellphone: profile?.cellphone || "",
zoneId: profile.zoneId || "", schools: profile?.schools || null,
schoolId: profile.schoolId || "", zoneId: profile?.zoneId || "",
postalCode: profile.postalCode || "", schoolId: profile?.schoolId || "",
gradeIds: profile.gradeIds || [], postalCode: profile?.postalCode || "",
provinceId: profile.provinceId || null, gradeIds: profile?.gradeIds || [],
cityId: profile.cityId || null, provinceId: profile?.provinceId || null,
cityId: profile?.cityId || null,
}); });
} }
}, [user]); }, [user]);
useEffect(() => { useEffect(() => {
setHeaderOptions(headerOptions); if(isMobile){
setHeaderOptions(headerOptions);
}
getProvince(); getProvince();
getCity({ provinceId: profile.provinceId });
}, []); }, []);
useEffect(() => {
if (setDone) {
navigate("/");
}
}, [setDone]);
const grades = [ const grades = [
{ {
name: window.t("پیش دبستانی"), name: window.t("پیش دبستانی"),
@ -136,77 +132,41 @@ function Profile({
}, },
]; ];
const onChange = (name, value) => { const onSubmit = React.useCallback(async () => {
if (name === "provinceId") {
getCity({ provinceId: value });
setFormData({ ...formData, cityId: null, [name]: value });
} else if (name === "status") {
setFormData({
...formData,
gradeIds: formData?.gradeIds?.slice(0, 1) || [],
[name]: value,
});
} else if (name === "docFileIds") {
upload({ file: value, target: name });
setFormData({ ...formData, [name]: value });
} else if (name === "file") {
upload({ file: value, target: name });
setFormData({ ...formData, [name]: value });
} else {
setFormData({ ...formData, [name]: value });
}
};
const onSubmit = async () => {
const {
firstName,
lastName,
username,
//cellphone,
password,
postalCode,
address,
email,
phone,
picFileId,
gender,
nationalId,
birthDate,
schools,
gradeIds,
status,
provinceId,
cityId,
docFileIds,
} = formData;
const data = { const data = {
firstName: firstName || profile.firstName, firstName: formData?.firstName,
lastName: lastName || profile.lastName, lastName: formData?.lastName,
username: username || profile.username, username: formData?.username,
cellphone: profile.cellphone, cellphone: formData?.cellphone,
password: password || profile.password, password: formData?.password,
postalCode: postalCode || profile.postalCode, postalCode: formData?.postalCode,
address: address || profile.address, address: formData?.address,
email: email || profile.email, email: formData?.email,
phone: phone || profile.phone, phone: formData?.phone,
nationalId: nationalId || profile.nationalId, cellphone: formData?.cellphone,
picFileId: uploads["file"] || picFileId || profile.picFileId, nationalId: formData?.nationalId,
gender: gender || profile.gender, picFileId: uploads["picFileId"] || formData?.picFileId,
birthDate: birthDate || profile.birthDate, birthDate: moment
schools: schools || profile.schools, .from(
gradeIds: gradeIds || profile.gradeIds, `${formData?.birthDate?.year}/${formData?.birthDate?.month}/${formData?.birthDate?.day}`,
status: status || profile.status, "fa",
provinceId: provinceId || profile.provinceId, "YYYY/MM/DD"
cityId: cityId || profile.cityId, )
docFileIds: uploads["docFileIds"] || docFileIds || profile.docFileIds, .locale("en"),
gender: formData?.gender,
schools: formData?.schools,
gradeIds: formData?.gradeIds,
status: formData?.status,
provinceId: formData?.provinceId,
cityId: formData?.cityId,
docFileIds: uploads["docFileIds"] || formData?.docFileIds,
}; };
await setProfile(data);
};
// if (setDone) return <Navigate path="/" />; await setProfile(data);
}, [formData, uploads]);
return isMobile ? ( return isMobile ? (
<div className="flex flex-col gap-6 lg:hidden px-4 pb-20"> <div className="lg:hidden flex flex-col gap-6 px-4 pb-20">
<header className="flex flex-col gap-2 w-full"> <header className="flex flex-col gap-2 w-full">
<h1 className="text-base text-gray1">{window.t("حساب کاربری")}</h1> <h1 className="text-base text-gray1">{window.t("حساب کاربری")}</h1>
<p className="text-sm text-gray1"> <p className="text-sm text-gray1">
@ -218,9 +178,14 @@ function Profile({
onSubmit={(e) => e.preventDefault()} onSubmit={(e) => e.preventDefault()}
> >
<Upload <Upload
name="file" name="picFileId"
value={formData?.file} value={String(
onChange={onChange} uploads["picFileId"] || uploadId || formData?.picFileId
)}
onChange={(name, value) => {
upload({ file: value, target: name });
setFormData({ ...formData, [name]: value });
}}
label={window.t("فایل")} label={window.t("فایل")}
/> />
<Input <Input
@ -293,11 +258,17 @@ function Profile({
regex={(val) => onInput.englishAndNumberWithoutSpace(val)} regex={(val) => onInput.englishAndNumberWithoutSpace(val)}
/> />
<Gender <Gender
options={[window.t("معلم"), window.t("دانش آموز")]} options={[window.t("دانش آموز"), window.t("معلم")]}
name="status" name="status"
label={window.t("عنوان")} label={window.t("عنوان")}
selectedOption={formData?.status} selectedOption={formData?.status}
onChange={onChange} onChange={(name, value) => {
setFormData({
...formData,
gradeIds: formData?.gradeIds?.slice(0, 1) || [],
[name]: value,
});
}}
/> />
{formData?.status === 1 ? ( {formData?.status === 1 ? (
<Select <Select
@ -348,9 +319,10 @@ function Profile({
name="provinceId" name="provinceId"
label={window.t("استان")} label={window.t("استان")}
selectedOptions={formData?.provinceId} selectedOptions={formData?.provinceId}
onChange={(name, value) => onChange={(name, value) => {
setFormData({ ...formData, [name]: value }) setFormData({ ...formData, cityId: null, [name]: value });
} getCity({ provinceId: provinceList.find((province) => province.name === value)?.id });
}}
/> />
<Select <Select
options={cityList} options={cityList}
@ -378,23 +350,28 @@ function Profile({
label={window.t("محل تدریس")} label={window.t("محل تدریس")}
defaultValue={formData} defaultValue={formData}
regex={(val) => onInput.persianOnly(val)} regex={(val) => onInput.persianOnly(val)}
onChange={onChange} onChange={(name, value) =>
setFormData({ ...formData, [name]: value })
}
/> />
) : null} ) : null}
{formData?.status == 2 ? ( {formData?.status == 2 ? (
<Document <Document
onChange={(name, value) => onChange={(name, value) => {
setFormData({ ...formData, [name]: value }) upload({ file: value, target: name });
} setFormData({ ...formData, [name]: value });
value={formData?.docFileIds} }}
value={String(uploads["docFileIds"] || formData?.docFileIds)}
name="docFileIds" name="docFileIds"
/> />
) : null} ) : null}
<Input <Input
name="postalCode" name="postalCode"
placeholder={window.t("کد پستی")} label={window.t("کد پستی")}
align="left" align="left"
onChange={onChange} onChange={(name, value) =>
setFormData({ ...formData, [name]: value })
}
maxLength={10} maxLength={10}
inputMode="numeric" inputMode="numeric"
value={formData?.postalCode} value={formData?.postalCode}
@ -418,16 +395,15 @@ function Profile({
</div> </div>
) : ( ) : (
<div <div
className="flex flex-col items-center gap-5 w-full pt-5 select-none" className="hidden lg:flex flex-col items-center gap-5 w-full pt-5 select-none"
onSubmit={(e) => onSubmit()} onSubmit={(e) => onSubmit()}
> >
<Upload <Upload
name="file" name="file"
value={String(uploadId || formData?.picFileId)} value={String(uploadId || formData?.picFileId)}
onChange={onChange} onChange={(name, value) => setFormData({ ...formData, [name]: value })}
label="فایل" label="فایل"
/> />
<br />
<div <div
className={`w-full gap-5 lg:flex lg:flex-row lg:my-2 lg:items-center flex flex-col`} className={`w-full gap-5 lg:flex lg:flex-row lg:my-2 lg:items-center flex flex-col`}
> >

Write Preview
Loading…
Cancel
Save