DigiFi/digifi-www
1
0
Fork 0
Code Issues Pull Requests Releases Activity

All State added #67

Merged
ameye merged 1 commits from all-state-added into master 2024-09-03 16:43:41 +00:00
Conversation 0 Commits 1 Files Changed 4
+189 -24
4 changed files with 189 additions and 24 deletions
Download Patch File Download Diff File Expand all files Collapse all files
src/components/Dashboard/employmentDetails/EmploymentDetails.tsx
+23 -12
View File
@@ -20,12 +20,12 @@ type Props = {
const initialValues = {
job_title: "",
name: "",
sector: "",
job_sector: "",
industry: "",
start_date: "",
official_email:"",
annual_salary: "",
monthly_salary: "",
net_montlty: "",
salary_date: "",
employee_id: "",
highest_eductaion: "",
@@ -44,7 +44,7 @@ const validationSchema = Yup.object().shape({
then: () => Yup.string().required('required'),
otherwise: () => Yup.string(),
}),
sector: Yup.string().when('isChecked', {
job_sector: Yup.string().when('isChecked', {
is: true,
then: () => Yup.string().required('required'),
}),
@@ -67,7 +67,7 @@ const validationSchema = Yup.object().shape({
}
return true;
}),
monthly_salary: Yup.string()
net_montlty: Yup.string()
.required("Required")
.test("no-e", "Invalid", (value:any) => {
if (value && /^[0-9]*$/.test(value) == false) {
@@ -173,6 +173,7 @@ export default function EmploymentDetail({handleNextStep}:Props) {
floatLabel="Employer name"
// labelClass="font-bold text-[1.125rem]"
input
disabled={true}
inputClass="w-full h-[3.625rem] bg-[#EFEFEF] px-4 rounded-[.375rem]"
placeholder="Mr. Mark John"
value={props.values.name}
@@ -185,6 +186,7 @@ export default function EmploymentDetail({handleNextStep}:Props) {
floatLabel="Employers official email"
// labelClass="font-bold text-[1.125rem]"
input
disabled={true}
inputClass="w-full h-[3.625rem] bg-[#EFEFEF] px-4 rounded-[.375rem]"
placeholder="example@gmail.com"
value={props.values.official_email}
@@ -197,23 +199,25 @@ export default function EmploymentDetail({handleNextStep}:Props) {
floatLabel="Select your industry"
// labelClass="font-bold text-[1.125rem]"
select={true}
disabled={true}
selectClass="w-full h-[3.625rem] bg-[#EFEFEF] px-4 rounded-[.375rem]"
selectOptions={industry}
selectOptions={props.values.industry}
selectValue={props.values.industry}
onChange={props.handleChange}
error={(props.errors.industry && props.touched.industry) ? props.errors.industry : ''}
/>
<InputCompOne
parentClass="w-full"
name="sector"
name="job_sector"
floatLabel="Job Sector"
// labelClass="font-bold text-[1.125rem]"
select={true}
disabled={true}
selectClass="w-full h-[3.625rem] bg-[#EFEFEF] px-4 rounded-[.375rem]"
selectOptions={jobSector}
selectValue={props.values.sector}
selectOptions={props.values.job_sector}
selectValue={props.values.job_sector}
onChange={props.handleChange}
error={(props.errors.sector && props.touched.sector) ? props.errors.sector : ''}
error={(props.errors.job_sector && props.touched.job_sector) ? props.errors.job_sector : ''}
/>
</div>
</div>
@@ -225,6 +229,7 @@ export default function EmploymentDetail({handleNextStep}:Props) {
floatLabel="Job Title"
// labelClass="font-bold text-[1.125rem]"
input
disabled={true}
inputClass="w-full h-[3.625rem] bg-[#EFEFEF] px-4 rounded-[.375rem]"
placeholder="Software Engineer"
value={props.values.job_title}
@@ -237,6 +242,7 @@ export default function EmploymentDetail({handleNextStep}:Props) {
floatLabel="Highest level of education"
// labelClass="font-bold text-[1.125rem]"
select={true}
disabled={true}
selectClass="w-full h-[3.625rem] bg-[#EFEFEF] px-4 rounded-[.375rem]"
selectOptions={highestEductaion}
selectValue={props.values.highest_eductaion}
@@ -250,6 +256,7 @@ export default function EmploymentDetail({handleNextStep}:Props) {
floatLabel="Date of resumption"
// labelClass="font-bold text-[1.125rem]"
input
disabled={true}
inputType='text'
inputClass="w-full h-[3.625rem] bg-[#EFEFEF] px-4 rounded-[.375rem]"
placeholder="12/12/2015"
@@ -263,6 +270,7 @@ export default function EmploymentDetail({handleNextStep}:Props) {
floatLabel="Salary payment date"
// labelClass="font-bold text-[1.125rem]"
input
disabled={true}
inputType='text'
inputClass="w-full h-[3.625rem] bg-[#EFEFEF] px-4 rounded-[.375rem]"
placeholder="30th of every month"
@@ -278,6 +286,7 @@ export default function EmploymentDetail({handleNextStep}:Props) {
floatLabel="Annual Income"
// labelClass="font-bold text-[1.125rem]"
input
disabled={true}
inputClass="w-full h-[3.625rem] bg-[#EFEFEF] px-4 rounded-[.375rem] text-right"
placeholder="1,200,000"
value={FormatAmount(props.values.annual_salary)}
@@ -286,15 +295,16 @@ export default function EmploymentDetail({handleNextStep}:Props) {
/>
<InputCompOne
parentClass="w-full"
name="monthly_salary"
name="net_montlty"
floatLabel="Net monthly salary"
// labelClass="font-bold text-[1.125rem]"
input
disabled={true}
inputClass="w-full h-[3.625rem] bg-[#EFEFEF] px-4 rounded-[.375rem] text-right"
placeholder="100,000"
value={FormatAmount(props.values.monthly_salary)}
value={FormatAmount(props.values.net_montlty)}
onChange={props.handleChange}
error={(props.errors.monthly_salary && props.touched.monthly_salary) ? props.errors.monthly_salary : ''}
error={(props.errors.net_montlty && props.touched.net_montlty) ? props.errors.net_montlty : ''}
/>
</div>
<InputCompOne
@@ -303,6 +313,7 @@ export default function EmploymentDetail({handleNextStep}:Props) {
floatLabel="Employee ID"
// labelClass="font-bold text-[1.125rem]"
input
disabled={true}
inputClass="w-full h-[3.625rem] bg-[#EFEFEF] px-4 rounded-[.375rem]"
placeholder="LS/001/005"
value={props.values.employee_id}
src/components/Dashboard/home/DashboardHomeDetail.tsx
+3 -11
View File
@@ -1,5 +1,7 @@
import { Button, InputCompOne, Stepper } from '../../shared/index';
import { state } from '../../../utils/states';
import {Formik, Form} from 'formik'
import * as Yup from "yup";
@@ -13,7 +15,7 @@ const initialValues = {
marital_status: "",
state: "",
email:"",
country:""
country:"NG"
};
// To get the validation schema
@@ -171,16 +173,6 @@ const maritalStatus: SelectOption = {
]
}
const state: SelectOption = {
loading: false,
data: [
{ value: "", label: "Please Select" },
{ value: "abia", label: "Abia" },
{ value: "imo", label: "Imo" },
{ value: "lagos", label: "Lagos" },
]
}
const country: SelectOption = {
loading: false,
data: [
src/components/shared/InputCompOne.tsx
+3 -1
View File
@@ -103,7 +103,9 @@ const InputCompOne = forwardRef<HTMLInputElement, InputCompOneProps>(
onChange={onChange}
disabled={disabled}
>
{selectOptions.loading ?
{typeof(selectOptions) == 'string' ?
<option value={selectValue}>{selectValue}</option>
:selectOptions.loading ?
<option value=''>Loading...</option>
: selectOptions.data.length && name == 'employer_uid' ?
<>
src/utils/states.ts
+160
View File
@@ -0,0 +1,160 @@
interface SelectOption {
loading: boolean;
data: {value: string;
label: string}[]
}
export const state: SelectOption = {
loading: false,
data: [
{ value: "", label: "Please Select" },
{
"value": "abia",
"label": "Abia"
},
{
"value": "adamawa",
"label": "Adamawa"
},
{
"value": "akwa ibom",
"label": "Akwa Ibom"
},
{
"value": "anambra",
"label": "Anambra"
},
{
"value": "bauchi",
"label": "Bauchi"
},
{
"value": "bayelsa",
"label": "Bayelsa"
},
{
"value": "benue",
"label": "Benue"
},
{
"value": "borno",
"label": "Borno"
},
{
"value": "cross river",
"label": "Cross River"
},
{
"value": "delta",
"label": "Delta"
},
{
"value": "ebonyi",
"label": "Ebonyi"
},
{
"value": "edo",
"label": "Edo"
},
{
"value": "ekiti",
"label": "Ekiti"
},
{
"value": "enugu",
"label": "Enugu"
},
{
"value": "fct - abuja",
"label": "FCT - Abuja"
},
{
"value": "gombe",
"label": "Gombe"
},
{
"value": "imo",
"label": "Imo"
},
{
"value": "jigawa",
"label": "Jigawa"
},
{
"value": "kaduna",
"label": "Kaduna"
},
{
"value": "kano",
"label": "Kano"
},
{
"value": "katsina",
"label": "Katsina"
},
{
"value": "kebbi",
"label": "Kebbi"
},
{
"value": "kogi",
"label": "Kogi"
},
{
"value": "kwara",
"label": "Kwara"
},
{
"value": "lagos",
"label": "Lagos"
},
{
"value": "nasarawa",
"label": "Nasarawa"
},
{
"value": "niger",
"label": "Niger"
},
{
"value": "ogun",
"label": "Ogun"
},
{
"value": "ondo",
"label": "Ondo"
},
{
"value": "osun",
"label": "Osun"
},
{
"value": "oyo",
"label": "Oyo"
},
{
"value": "plateau",
"label": "Plateau"
},
{
"value": "rivers",
"label": "Rivers"
},
{
"value": "sokoto",
"label": "Sokoto"
},
{
"value": "taraba",
"label": "Taraba"
},
{
"value": "yobe",
"label": "Yobe"
},
{
"value": "zamfara",
"label": "Zamfara"
}
]
}