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

update 5 files

Browse Source
master
Reza_ashrafi 2 years ago
parent 0e6c073a99
commit 82d7aec1df
5 changed files with 239 additions and 270 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. 4
      src/components/Input/index.js
  2. 2
      src/components/Select/index.js
  3. 2
      src/components/Textarea/index.js
  4. 19
      src/router.js
  5. 482
      src/views/Auth/Profile/index.js

4
src/components/Input/index.js
Unescape View File

@ -19,11 +19,11 @@ export default function Input(props) {
return ( return (
<div <div
className="input flex flex-col relative my-2 dark:bg-opacity-10 w-full" className="input flex flex-col relative dark:bg-opacity-10 w-full"
style={{ width }} style={{ width }}
> >
<label <label
className={`absolute right-2 transform bg-white -translate-y-1/2 dark:text-white px-2 text-xs transition-all duration-300 pointer-events-none ${value || focusToggle ? "top-0 text-xs" : "top-1/2 text-sm"} ${focusToggle ? "text-blueC0" : "text-gray1"}`} className={`absolute right-2 transform bg-white -translate-y-1/2 dark:text-white px-2 text-xs transition-all duration-300 pointer-events-none ${value || focusToggle ? "top-0 lg:text-xs text-sm" : "top-1/2 text-tiny lg:text-sm"} ${focusToggle ? "text-blueC0" : "text-gray1"}`}
> >
{label} {label}
</label> </label>

2
src/components/Select/index.js
Unescape View File

@ -10,7 +10,7 @@ function Select({
onChange, onChange,
name, name,
defaultValue, defaultValue,
width = "w-1/2", width = "w-full",
selectProvince, selectProvince,
}) { }) {
return ( return (

2
src/components/Textarea/index.js
Unescape View File

@ -7,7 +7,7 @@ export default function Textarea({ placeholder, onChange, value, name }) {
<textarea <textarea
className={_.join( className={_.join(
[ [
"my-2 border border-gray-300 rounded-md text-xs lg:text-sm py-6 px-3 outline-none focus:border-greenB9", "border w-full border-gray-300 rounded-md text-xs lg:text-sm py-6 px-3 outline-none focus:border-greenB9",
// backgroundColor, // backgroundColor,
], ],
" " " "

19
src/router.js
Unescape View File

@ -34,6 +34,7 @@ import Dialog from "./components/Dialog";
import Address from "./views/Address"; import Address from "./views/Address";
import Favorites from "./views/Favorites"; import Favorites from "./views/Favorites";
import Addresses from "./views/Dashboard/layouts/Mobile/ProfileAddress"; import Addresses from "./views/Dashboard/layouts/Mobile/ProfileAddress";
import Profile from "./views/Auth/Profile"
function Router({ function Router({
isDark, isDark,
@ -567,6 +568,24 @@ function Router({
/> />
} }
/> />
<Route
path="/profile"
exact
element={
<Profile
headerOptions={{
logo: false,
hamburgerMenu: false,
qr: false,
title: false,
back: true,
shown: true,
menu: false,
// bookmark: "contentId",
}}
/>
}
/>
<Route <Route
path="*" path="*"
exact exact

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

@ -29,6 +29,7 @@ function Profile({
provinceList, provinceList,
cityList, cityList,
setHeaderOptions, setHeaderOptions,
headerOptions,
loading, loading,
}) { }) {
let navigate = useNavigate(); let navigate = useNavigate();
@ -69,18 +70,7 @@ function Profile({
}, [user]); }, [user]);
useEffect(() => { useEffect(() => {
if (!isMobile) { setHeaderOptions(headerOptions);
setHeaderOptions({
logo: true,
hamburgerMenu: true,
qr: true,
title: false,
back: false,
shown: true,
menu: false,
});
}
getProvince(); getProvince();
getCity({ provinceId: profile.provinceId }); getCity({ provinceId: profile.provinceId });
}, []); }, []);
@ -216,259 +206,215 @@ function Profile({
// if (setDone) return <Navigate path="/" />; // if (setDone) return <Navigate path="/" />;
return isMobile ? ( return isMobile ? (
<div className="profile main d-flex justify-content-center"> <div className="flex flex-col gap-6 lg:hidden px-4 pb-20">
<main> <header className="flex flex-col gap-2 w-full">
<header className="d-flex align-items-center justify-content-between"> <h1 className="text-base text-gray1">{window.t("حساب کاربری")}</h1>
<div> <p className="text-sm text-gray1">
<h1>{window.t("حساب کاربری")}</h1> {window.t("لطفا مشخصات خود را به صورت کامل نمایید.")}
<p>{window.t("لطفا مشخصات خود را به صورت کامل نمایید.")}</p> </p>
</div> </header>
<div className="mobile justify-content-center"> <form
<Upload className="flex flex-col items-center w-full gap-4"
name="file" onSubmit={(e) => e.preventDefault()}
value={formData?.file} >
onChange={onChange} <Upload
label={window.t("فایل")} name="file"
/> value={formData?.file}
</div> onChange={onChange}
</header> label={window.t("فایل")}
<div className="profile__box d-flex" onSubmit={(e) => onSubmit()}> />
<div className="profile__box--section"> <Input
<div className="mb-2 desktop justify-content-center"> name="firstName"
<Upload label={window.t("نام")}
name="file" align="right"
value={formData?.file} onInput={onInput.persianOnly}
onChange={onChange} value={formData?.firstName}
label={window.t("فایل")} onChange={(name, value) =>
/> setFormData({ ...formData, [name]: value })
</div> }
<div className="mb-2"> regex={(val) => val}
<Input />
name="firstName" <Input
label={window.t("نام")} name="lastName"
align="right" label={window.t("نام نام خانوادگی")}
onInput={onInput.persianOnly} align="right"
value={formData?.firstName} value={formData?.lastName}
onChange={(name, value) => onChange={(name, value) =>
setFormData({ ...formData, [name]: value }) setFormData({ ...formData, [name]: value })
} }
regex={(val) => val} onInput={onInput.persianOnly}
/> regex={(val) => val}
</div> />
<div className="mb-2"> <Input
<Input name="username"
name="lastName" label={window.t("نام کاربری")}
label={window.t("نام نام خانوادگی")} value={formData?.username}
align="right" onChange={(name, value) =>
value={formData?.lastName} setFormData({ ...formData, [name]: value })
onChange={(name, value) => }
setFormData({ ...formData, [name]: value }) align="left"
} regex={(val) => onInput.englishAndNumberWithoutSpace(val)}
onInput={onInput.persianOnly} />
regex={(val) => val} <Gender
/> options={[window.t("دختر"), window.t("پسر")]}
</div> name="gender"
<div className="mb-2"> selectedOption={formData?.gender}
<Input onChange={(name, value) =>
name="username" setFormData({ ...formData, [name]: value })
label={window.t("نام کاربری")} }
value={formData?.username} label="جنسیت"
onChange={(name, value) => />
setFormData({ ...formData, [name]: value }) <Input
} name="nationalId"
align="left" label={window.t("کد ملی/اتباع")}
regex={(val) => onInput.englishAndNumberWithoutSpace(val)} align="left"
/> maxLength={13}
</div> value={formData?.nationalId}
<div className="mb-2"> onChange={(name, value) =>
<Gender setFormData({ ...formData, [name]: value })
options={[window.t("دختر"), window.t("پسر")]} }
name="gender" regex={(val) => onInput.numberOnly(val)}
selectedOption={formData?.gender} />
onChange={(name, value) => <Birthdate
setFormData({ ...formData, [name]: value }) name="birthDate"
} onChange={(name, value) =>
label="" setFormData({ ...formData, [name]: value })
/> }
</div> value={formData?.birthDate}
<div className="mb-2"> />
<Input <Input
name="nationalId" name="password"
label={window.t("کد ملی/اتباع")} label={window.t("رمز عبور")}
align="left" onChange={(name, value) =>
maxLength={13} setFormData({ ...formData, [name]: value })
value={formData?.nationalId} }
onChange={(name, value) => value={formData?.password}
setFormData({ ...formData, [name]: value }) align="left"
} regex={(val) => onInput.englishAndNumberWithoutSpace(val)}
regex={(val) => onInput.numberOnly(val)} />
/> <Gender
</div> options={[window.t("معلم"), window.t("دانش آموز")]}
<div className="mb-2"> name="status"
<Birthdate label={window.t("عنوان")}
name="birthDate" selectedOption={formData?.status}
onChange={(name, value) => onChange={onChange}
setFormData({ ...formData, [name]: value }) />
} {formData?.status === 1 ? (
value={formData?.birthDate} <Select
/> options={grades}
</div> name="gradeIds"
<div className="mb-2"> label={window.t("پایه تحصیلی")}
<Input selectedOptions={formData?.gradeIds}
name="password" onChange={(name, value) =>
label={window.t("رمز عبور")} setFormData({ ...formData, [name]: value })
onChange={(name, value) => }
setFormData({ ...formData, [name]: value }) />
} ) : null}
value={formData?.password} {formData?.status === 2 ? (
align="left" <MultipleSelector
regex={(val) => onInput.englishAndNumberWithoutSpace(val)} options={grades}
/> name="gradeIds"
</div> label={window.t("پایه تحصیلی")}
</div> selectedOptions={formData?.gradeIds}
<div className="profile__box--section"> onChange={(name, value) =>
<div className="mb-2" style={{ minWidth: "100%" }}> setFormData({ ...formData, [name]: value })
<Gender }
options={[window.t("معلم"), window.t("دانش آموز")]} align="right"
name="status" defaultValue={profile}
label={window.t("عنوان")} />
selectedOption={formData?.status} ) : null}
onChange={onChange}
/>
</div>
{formData?.status === 1 ? (
<div className="mb-2">
<Select
options={grades}
name="gradeIds"
label={window.t("پایه تحصیلی")}
selectedOptions={formData?.gradeIds}
onChange={(name, value) =>
setFormData({ ...formData, [name]: value })
}
/>
</div>
) : null}
{formData?.status === 2 ? (
<div className="mb-2">
<MultipleSelector
options={grades}
name="gradeIds"
label={window.t("پایه تحصیلی")}
selectedOptions={formData?.gradeIds}
onChange={(name, value) =>
setFormData({ ...formData, [name]: value })
}
align="right"
defaultValue={profile}
/>
</div>
) : null}
{formData?.status === window.t("دانش آموز") && {formData?.status === window.t("دانش آموز") &&
formData?.gradeIds > 9 ? ( formData?.gradeIds > 9 ? (
<div className="mb-2"> <Select
<Select options={[
options={[ window.t("ریاضی"),
window.t("ریاضی"), window.t("تجربی"),
window.t("تجربی"), window.t("انسانی"),
window.t("انسانی"), window.t("فنی حرفه‌ای"),
window.t("فنی حرفه‌ای"), window.t("کاردانش"),
window.t("کاردانش"), window.t("معارف"),
window.t("معارف"), ]}
]} name="field"
name="field" label={window.t("رشته تحصیلی")}
label={window.t("رشته تحصیلی")} selectedOptions={formData?.gradeIds}
selectedOptions={formData?.gradeIds} onChange={(name, value) =>
onChange={(name, value) => setFormData({ ...formData, [name]: value })
setFormData({ ...formData, [name]: value }) }
} />
/> ) : null}
</div> <Select
) : null} options={provinceList}
<div className="mb-2" style={{ minWidth: "100%" }}> name="provinceId"
<Select label={window.t("استان")}
options={provinceList} selectedOptions={formData?.provinceId}
name="provinceId" onChange={(name, value) =>
label={window.t("استان")} setFormData({ ...formData, [name]: value })
selectedOptions={formData?.provinceId} }
onChange={(name, value) => />
setFormData({ ...formData, [name]: value }) <Select
} options={cityList}
/> name="cityId"
</div> label={window.t("شهرستان")}
<div className="mb-2"> selectedOptions={formData?.cityId}
<Select onChange={(name, value) =>
options={cityList} setFormData({ ...formData, [name]: value })
name="cityId" }
label={window.t("شهرستان")} />
selectedOptions={formData?.cityId} {formData?.status == 1 ? (
onChange={(name, value) => <Input
setFormData({ ...formData, [name]: value }) name="schools"
} label={window.t("نام مدرسه")}
/> value={formData?.schoolId}
</div> regex={(val) => onInput.persianOnly(val)}
{formData?.status == 1 ? ( onChange={(name, value) =>
<div className="mb-2"> setFormData({ ...formData, [name]: value })
<Input }
name="schools" />
label={window.t("نام مدرسه")} ) : null}
value={formData?.schoolId} {formData?.status == 2 ? (
regex={(val) => onInput.persianOnly(val)} <Input
onChange={(name, value) => name="schools"
setFormData({ ...formData, [name]: value }) label={window.t("محل تدریس")}
} defaultValue={formData}
/> regex={(val) => onInput.persianOnly(val)}
</div> onChange={onChange}
) : null} />
{formData?.status == 2 ? ( ) : null}
<div className="mb-2"> {formData?.status == 2 ? (
<Input <Document
name="schools" onChange={(name, value) =>
label={window.t("محل تدریس")} setFormData({ ...formData, [name]: value })
defaultValue={formData} }
regex={(val) => onInput.persianOnly(val)} value={formData?.docFileIds}
onChange={onChange} name="docFileIds"
/> />
</div> ) : null}
) : null} <Input
{formData?.status == 2 ? ( name="postalCode"
<Document placeholder={window.t("کد پستی")}
onChange={(name, value) => align="left"
setFormData({ ...formData, [name]: value }) onChange={onChange}
} maxLength={10}
value={formData?.docFileIds} inputMode="numeric"
name="docFileIds" value={formData?.postalCode}
/> regex={(val) => onInput.numberOnly(val)}
) : null} />
<div className="mb-2"> <TextArea
<Input placeholder={window.t("آدرس محل سکونت")}
name="postalCode" name="address"
placeholder={window.t("کد پستی")} value={formData?.address}
align="left" onChange={(name, value) =>
onChange={onChange} setFormData({ ...formData, [name]: value })
maxLength={10} }
inputMode="numeric" />
value={formData?.postalCode} <button
regex={(val) => onInput.numberOnly(val)} className="w-full bg-blueC0 py-3 text-base text-white rounded-sm"
/> onClick={() => onSubmit()}
</div> >
<div className="mb-2"> {window.t("ذخیره")}
<TextArea </button>
placeholder={window.t("آدرس محل سکونت")} </form>
name="address"
value={formData?.address}
onChange={(name, value) =>
setFormData({ ...formData, [name]: value })
}
/>
</div>
<div className="profile__box--form__footer d-flex justify-content-center">
<button onClick={() => onSubmit()}>{window.t("ذخیره")}</button>
</div>
</div>
</div>
</main>
</div> </div>
) : ( ) : (
<div <div
@ -504,7 +450,6 @@ function Profile({
setFormData({ ...formData, [name]: value }) setFormData({ ...formData, [name]: value })
} }
regex={(val) => val} regex={(val) => val}
padding="py-4"
value={formData?.lastName} value={formData?.lastName}
/> />
</div> </div>
@ -569,7 +514,12 @@ function Profile({
/> />
<div className="w-full"></div> <div className="w-full"></div>
</div> </div>
<button className="w-full bg-blueC0 py-3 text-tiny text-white rounded-sm" onClick={() => onSubmit()}>{window.t("ذخیره")}</button> <button
className="w-full bg-blueC0 py-3 text-tiny text-white rounded-sm"
onClick={() => onSubmit()}
>
{window.t("ذخیره")}
</button>
</div> </div>
); );
} }

Write Preview
Loading…
Cancel
Save