update src/components/Input/index.js, src/views/Auth/Profile/GenderSwitch/index.js and src/views/Auth/Profile/index.js

master
Reza_ashrafi 2 years ago
parent 92e000e0d5
commit 00d0aad208
  1. 2
      src/components/Input/index.js
  2. 2
      src/views/Auth/Profile/GenderSwitch/index.js
  3. 136
      src/views/Auth/Profile/index.js

@ -19,7 +19,7 @@ export default function Input(props) {
return (
<div
className="input flex flex-col relative dark:bg-opacity-10 w-full"
className="flex flex-col relative dark:bg-opacity-10 w-full"
style={{ width }}
>
<label

@ -14,7 +14,7 @@ export default function GenderSwitch({
<div className="flex w-full items-center gap-4">
{options?.map((option, index) => (
<div
className={`rounded-sm py-3 flex-1 transition-all border border-solid border-blueC0 duration-500 cursor-pointer text-center ${
className={`rounded-sm py-4 w-1/2 text-tiny lg:flex-auto transition-all border border-solid border-blueC0 duration-500 cursor-pointer text-center ${
selectedOption === index + 1
? "bg-blueC0 text-white"
: " text-blueC0"

@ -71,7 +71,7 @@ function Profile({
}, [user]);
useEffect(() => {
if(isMobile){
if (isMobile) {
setHeaderOptions(headerOptions);
}
getProvince();
@ -321,7 +321,11 @@ function Profile({
selectedOptions={formData?.provinceId}
onChange={(name, value) => {
setFormData({ ...formData, cityId: null, [name]: value });
getCity({ provinceId: provinceList.find((province) => province.name === value)?.id });
getCity({
provinceId: provinceList.find(
(province) => province.name === value
)?.id,
});
}}
/>
<Select
@ -457,6 +461,63 @@ function Profile({
direction={"ltr"}
/>
</div>
<div
className={`w-full flex lg:justify-between lg:flex-row flex-col gap-5 lg:my-2 lg:items-end`}
>
<Gender
options={[window.t("دانش آموز"), window.t("معلم")]}
name="status"
label={window.t("عنوان")}
selectedOption={formData?.status}
onChange={(name, value) => {
setFormData({
...formData,
gradeIds: formData?.gradeIds?.slice(0, 1) || [],
[name]: value,
});
}}
/>
</div>
{formData?.status === 1 ? (
<div
className={`w-full flex lg:flex-row items-center flex-col gap-5 lg:my-2 lg:items-center`}
>
<Input
name="schools"
label={window.t("نام مدرسه")}
value={formData?.schoolId}
regex={(val) => onInput.persianOnly(val)}
onChange={(name, value) =>
setFormData({ ...formData, [name]: value })
}
/>
<div className="w-full"></div>
</div>
) : null}
{formData?.status === 2 ? (
<div
className={`w-full flex lg:flex-row items-center flex-col gap-5 lg:my-2 lg:items-center`}
>
<Input
name="schools"
label={window.t("محل تدریس")}
defaultValue={formData}
regex={(val) => onInput.persianOnly(val)}
onChange={(name, value) =>
setFormData({ ...formData, [name]: value })
}
/>
<Document
onChange={(name, value) => {
upload({ file: value, target: name });
setFormData({ ...formData, [name]: value });
}}
value={String(uploads["docFileIds"] || formData?.docFileIds)}
name="docFileIds"
/>
</div>
) : null}
<div
className={`w-full flex lg:flex-row flex-col gap-5 lg:my-2 lg:items-center`}
>
@ -477,7 +538,7 @@ function Profile({
/>
</div>
<div
className={`w-full flex lg:flex-row flex-col gap-5 lg:my-2 lg:items-center`}
className={`w-full flex lg:flex-row items-center flex-col gap-5 lg:my-2 lg:items-center`}
>
<Gender
options={[window.t("دختر"), window.t("پسر")]}
@ -488,10 +549,77 @@ function Profile({
}
label="جنسیت"
/>
</div>
<div
className={`w-full flex lg:flex-row flex-col gap-5 lg:my-2 lg:items-center`}
>
<Input
name="username"
label={window.t("نام کاربری")}
value={formData?.username}
onChange={(name, value) =>
setFormData({ ...formData, [name]: value })
}
align="left"
regex={(val) => onInput.englishAndNumberWithoutSpace(val)}
/>
<Input
name="password"
label={window.t("رمز عبور")}
onChange={(name, value) =>
setFormData({ ...formData, [name]: value })
}
value={formData?.password}
align="left"
regex={(val) => onInput.englishAndNumberWithoutSpace(val)}
/>
</div>
<div
className={`w-full flex lg:flex-row flex-col gap-5 lg:my-2 lg:items-center`}
>
<Select
options={provinceList}
name="provinceId"
label={window.t("استان")}
selectedOptions={formData?.provinceId}
onChange={(name, value) => {
setFormData({ ...formData, cityId: null, [name]: value });
getCity({
provinceId: provinceList.find(
(province) => province.name === value
)?.id,
});
}}
/>
<Select
options={cityList}
name="cityId"
label={window.t("شهرستان")}
selectedOptions={formData?.cityId}
onChange={(name, value) =>
setFormData({ ...formData, [name]: value })
}
/>
</div>
<div
className={`w-full flex lg:flex-row flex-col gap-5 lg:my-2 lg:items-center`}
>
<Input
name="postalCode"
label={window.t("کد پستی")}
align="left"
onChange={(name, value) =>
setFormData({ ...formData, [name]: value })
}
maxLength={10}
inputMode="numeric"
value={formData?.postalCode}
regex={(val) => onInput.numberOnly(val)}
/>
<div className="w-full"></div>
</div>
<button
className="w-full bg-blueC0 py-3 text-tiny text-white rounded-sm"
className="w-full bg-blueC0 py-4 text-tiny text-white rounded-sm"
onClick={() => onSubmit()}
>
{window.t("ذخیره")}

Loading…
Cancel
Save