@@ -55,31 +55,25 @@ const createCustomInputs: CreateCustomInputs = { | |||
const CreateStaff: React.FC = async () => { | |||
const { t } = await getServerI18n("createStaff"); | |||
const title = ['', 'Additional Info'] | |||
const fieldLists = [ | |||
[ | |||
{ | |||
id: "name", | |||
label: t("Staff Name"), | |||
label: t("Staff Id"), | |||
type: "text", | |||
value: "asdasd", | |||
// required: "asdasd", | |||
// option: "asdasd", | |||
}, | |||
{ | |||
id: "currentPosition", | |||
label: t("Current Position"), | |||
type: "combo-Obj", | |||
// value: "asdasd", | |||
// required: "asdasd", | |||
options: [{id: 1, key: 1, value: 1, label: "Potato"}, {id: 2, key: 2, value: 2, label: "Tomato"}], | |||
}, | |||
{ | |||
id: "joinPosition", | |||
label: t("Join Position"), | |||
type: "combo-Obj", | |||
// value: "asdasd", | |||
id: "name", | |||
label: t("Staff Name"), | |||
type: "text", | |||
value: "asdasd", | |||
// required: "asdasd", | |||
options: [{id: 1, key: 1, value: 1, label: "Potato"}, {id: 2, key: 2, value: 2, label: "Tomato"}], | |||
// option: "asdasd", | |||
}, | |||
{ | |||
id: "companyId", | |||
@@ -89,6 +83,12 @@ const CreateStaff: React.FC = async () => { | |||
// required: "asdasd", | |||
options: [{id: 1, key: 1, value: 1, label: "Company A"}, {id: 2, key: 2, value: 2, label: "Company B"}], | |||
}, | |||
{ | |||
id: "teamId", | |||
label: t("Team"), | |||
type: "combo-Obj", | |||
options: [{id: 1, key: 1, value: 1, label: "A"}, {id: 2, key: 2, value: 2, label: "B"}], | |||
}, | |||
{ | |||
id: "gradeId", | |||
label: t("Grade"), | |||
@@ -96,10 +96,10 @@ const CreateStaff: React.FC = async () => { | |||
options: [{id: 1, key: 1, value: 1, label: "A"}, {id: 2, key: 2, value: 2, label: "B"}], | |||
}, | |||
{ | |||
id: "teamId", | |||
label: t("Team"), | |||
id: "currentPosition", | |||
label: t("Current Position"), | |||
type: "combo-Obj", | |||
options: [{id: 1, key: 1, value: 1, label: "A"}, {id: 2, key: 2, value: 2, label: "B"}], | |||
options: [{id: 1, key: 1, value: 1, label: "pos1"}, {id: 2, key: 2, value: 2, label: "pos2"}], | |||
}, | |||
{ | |||
id: "salaryEffId", | |||
@@ -112,6 +112,13 @@ const CreateStaff: React.FC = async () => { | |||
label: t("Hourly Rate"), | |||
type: "numeric", | |||
value: "", | |||
}, | |||
{ | |||
id: "employType", | |||
label: t("Employ Type"), | |||
type: "combo-Obj", | |||
options: [{id: 1, key: "FT", value: "FT", label: t("FT")}, {id: 2, key: "PT", value: "PT", label: t("PT")}], | |||
value: "", | |||
}, | |||
{ | |||
id: "email", | |||
@@ -131,6 +138,8 @@ const CreateStaff: React.FC = async () => { | |||
type: "numeric", | |||
value: "", | |||
}, | |||
], | |||
[ | |||
{ | |||
id: "emergContactName", | |||
label: t("Emergency Contact Name"), | |||
@@ -144,12 +153,17 @@ const CreateStaff: React.FC = async () => { | |||
value: "", | |||
}, | |||
{ | |||
id: "employType", | |||
label: t("Employ Type"), | |||
type: "combo-Obj", | |||
options: [{id: 1, key: "FT", value: "FT", label: t("FT")}, {id: 2, key: "PT", value: "PT", label: t("PT")}], | |||
id: "joinDate", | |||
label: t("Join Date"), | |||
type: "multiDate", | |||
value: "", | |||
}, | |||
{ | |||
id: "joinPosition", | |||
label: t("Join Position"), | |||
type: "combo-Obj", | |||
options: [{id: 1, key: 1, value: 1, label: "pos1"}, {id: 2, key: 2, value: 2, label: "pos2"}], | |||
}, | |||
{ | |||
id: "departDate", | |||
label: t("Depart Date"), | |||
@@ -158,7 +172,7 @@ const CreateStaff: React.FC = async () => { | |||
}, | |||
{ | |||
id: "departReason", | |||
label: t("Depart Reason"), | |||
label: t("Reason"), | |||
type: "text", | |||
value: "", | |||
}, | |||
@@ -168,15 +182,17 @@ const CreateStaff: React.FC = async () => { | |||
type: "remarks", | |||
value: "", | |||
}, | |||
], | |||
] | |||
]; | |||
return ( | |||
<> | |||
<Typography variant="h4">{t("Create Staff")}</Typography> | |||
<I18nProvider namespaces={["createStaff"]}> | |||
{/* <CreateStaffForm/>/ */} | |||
<CreateStaffForm fieldLists={fieldLists}/> | |||
<CreateStaffForm | |||
Title={title} | |||
fieldLists={fieldLists} | |||
/> | |||
</I18nProvider> | |||
</> | |||
); | |||
@@ -10,6 +10,7 @@ export interface CreateCustomInputs { | |||
// Miscellaneous | |||
expectedProjectFee: string; | |||
} | |||
export interface CreateStaffInputs { | |||
name: string; | |||
currentPositionId: number; | |||
@@ -28,7 +29,6 @@ export interface CreateStaffInputs { | |||
departReason: string; | |||
remark: string; | |||
} | |||
export const saveStaff = async (data: CreateStaffInputs) => { | |||
return serverFetchJson(`${BASE_API_URL}/staffs/new`, { | |||
@@ -12,37 +12,26 @@ export interface Staff { | |||
code: string; | |||
}; | |||
} | |||
export interface resultObj { | |||
records: StaffResult[] | |||
} | |||
export interface StaffResult { | |||
id: number; | |||
created: string; | |||
name: string; | |||
cost: number; | |||
team: string; | |||
staffId: string; | |||
type: string; | |||
currPos: string; | |||
joinPos: string; | |||
companyId: string; | |||
skillSetId: number; | |||
departmentId: number; | |||
phone1: string; | |||
phone2: string; | |||
email: string; | |||
emergContactName: string; | |||
emergContactPhone: string; | |||
employType: string; | |||
departDate: string; | |||
departReason: string; | |||
remarks: string; | |||
grade: string; | |||
joinPosition: string; | |||
currentPosition: string; | |||
} | |||
export interface searchInput { | |||
staffId: string; | |||
name: string; | |||
team: string; | |||
grade: string; | |||
currentPosition: string; | |||
} | |||
export const preloadTeamLeads = () => { | |||
fetchTeamLeads(); | |||
fetchStaff(); | |||
// fetchStaff(); | |||
}; | |||
export const fetchTeamLeads = cache(async () => { | |||
@@ -56,8 +45,8 @@ export const preloadStaff = () => { | |||
}; | |||
export const fetchStaff = cache(async () => { | |||
return serverFetchJson<resultObj>(`${BASE_API_URL}/staffs/newlist`, { | |||
next: { tags: ["teamLeads"] }, | |||
}); | |||
return serverFetchJson<StaffResult[]>(`${BASE_API_URL}/staffs`, { | |||
next: { tags: ["staffs"] }, | |||
}); | |||
}); | |||
@@ -29,10 +29,14 @@ interface formProps { | |||
// resetForm: () => void; | |||
// Title?: string[]; | |||
// isActive: boolean; | |||
Title?: string[] | |||
fieldLists: Field[][]; | |||
} | |||
const CreateStaffForm: React.FC<formProps> = ({ fieldLists }) => { | |||
const CreateStaffForm: React.FC<formProps> = ({ | |||
Title, | |||
fieldLists | |||
}) => { | |||
// const [formData, setFormData] = useState<any>(null); | |||
const router = useRouter(); | |||
const { t } = useTranslation(); | |||
@@ -67,6 +71,7 @@ const CreateStaffForm: React.FC<formProps> = ({ fieldLists }) => { | |||
</Typography> | |||
)} | |||
<CustomInputForm | |||
Title={Title} | |||
fieldLists={fieldLists} | |||
isActive={true} | |||
onSubmit={onSubmit} | |||
@@ -18,102 +18,39 @@ const StaffSearch: React.FC<Props> = ({ staff }) => { | |||
const { t } = useTranslation("staff"); | |||
// If claim searching is done on the server-side, then no need for this. | |||
const [filteredClaims, setFilteredClaims] = useState(staff); | |||
const [filteredStaff, setFilteredStaff] = useState(staff); | |||
// const [filteredStaffRef, setFilteredStaffRef] = useState(staff); | |||
const searchCriteria: Criterion<SearchParamNames>[] = useMemo( | |||
() => [ | |||
{ | |||
label: t("Staff Name"), | |||
paramName: "name", | |||
type: "text" | |||
}, | |||
{ | |||
label: t("Cost (HKD)"), | |||
paramName: "cost", | |||
type: "text", | |||
}, | |||
{ | |||
label: t("Expense Type"), | |||
paramName: "type", | |||
label: t("Team"), | |||
paramName: "team", | |||
type: "select", | |||
options: ["Expense", "Petty Cash"], | |||
options: ["1", "2"], | |||
}, | |||
{ | |||
label: t("Current Position"), | |||
paramName: "currPos", | |||
type: "select", | |||
options: ["Small Potato", "CEO"], | |||
label: t("Staff Name"), | |||
paramName: "name", | |||
type: "text", | |||
}, | |||
{ | |||
label: t("Staff ID"), | |||
paramName: "staffId", | |||
type: "text" | |||
}, | |||
{ | |||
label: t("Join Position"), | |||
paramName: "joinPos", | |||
label: t("Grade"), | |||
paramName: "grade", | |||
type: "select", | |||
options: ["Small Potato", "CEO"], | |||
options: ["pos1", "CEO"], | |||
}, | |||
{ | |||
label: t("Company"), | |||
paramName: "companyId", | |||
label: t("Current Position"), | |||
paramName: "currentPosition", | |||
type: "select", | |||
options: ["1", "2"], | |||
options: ["pos1", "CEO"], | |||
}, | |||
// { | |||
// label: t("Skillset"), | |||
// paramName: "skillSetId", | |||
// type: "select", | |||
// options: ["Fly", "Boxing"], | |||
// }, | |||
// { | |||
// label: t("Department"), | |||
// paramName: "departmentId", | |||
// type: "select", | |||
// options: ["Fly", "Boxing"], | |||
// }, | |||
// { | |||
// label: t("phone1"), | |||
// paramName: "phone1", | |||
// type: "text", | |||
// }, | |||
// { | |||
// label: t("phone2"), | |||
// paramName: "phone2", | |||
// type: "text", | |||
// }, | |||
// { | |||
// label: t("email"), | |||
// paramName: "email", | |||
// type: "text", | |||
// }, | |||
// { | |||
// label: t("Emergency Contact Name"), | |||
// paramName: "emergContactName", | |||
// type: "text", | |||
// }, | |||
// { | |||
// label: t("Emergency Contact Phone"), | |||
// paramName: "emergContactPhone", | |||
// type: "text", | |||
// }, | |||
// { | |||
// label: t("Employ Type"), | |||
// paramName: "employType", | |||
// type: "select", | |||
// options: ["Full-time", "Part-time"], | |||
// }, | |||
// { | |||
// label: t("Depart Date"), | |||
// paramName: "departDate", | |||
// type: "date", | |||
// }, | |||
// { | |||
// label: t("Depart Reason"), | |||
// paramName: "departReason", | |||
// type: "text", | |||
// }, | |||
// { | |||
// label: t("Remarks"), | |||
// paramName: "remarks", | |||
// type: "text", | |||
// }, | |||
], | |||
[t], | |||
); | |||
@@ -130,12 +67,11 @@ const StaffSearch: React.FC<Props> = ({ staff }) => { | |||
// onClick: onClaimClick, | |||
// buttonIcon: <EditNote />, | |||
// }, | |||
{ name: "created", label: t("Creation Date") }, | |||
{ name: "name", label: t("Related Project Name") }, | |||
{ name: "staffId", label: t("Staff Id") }, | |||
{ name: "type", label: t("Expense Type") }, | |||
// { name: "status", label: t("Status") }, | |||
{ name: "remarks", label: t("Remarks") }, | |||
{ name: "team", label: t("Team") }, | |||
{ name: "name", label: t("Staff Name") }, | |||
{ name: "staffId", label: t("Staff ID") }, | |||
{ name: "grade", label: t("Grade") }, | |||
{ name: "currentPosition", label: t("Current Position") }, | |||
], | |||
[t, onStaffClick], | |||
); | |||
@@ -145,10 +81,19 @@ const StaffSearch: React.FC<Props> = ({ staff }) => { | |||
<SearchBox | |||
criteria={searchCriteria} | |||
onSearch={(query) => { | |||
console.log(query); | |||
setFilteredStaff( | |||
staff.filter( | |||
(s) => | |||
s.staffId.toLowerCase().includes(query.staffId.toLowerCase()) && | |||
s.name.toLowerCase().includes(query.name.toLowerCase()) | |||
// (query.team === "All" || s.team === query.team) && | |||
// (query.category === "All" || s.category === query.category) && | |||
// (query.team === "All" || s.team === query.team), | |||
) | |||
) | |||
}} | |||
/> | |||
<SearchResults<StaffResult> items={filteredClaims} columns={columns} /> | |||
<SearchResults<StaffResult> items={filteredStaff} columns={columns} /> | |||
</> | |||
); | |||
}; | |||
@@ -12,9 +12,9 @@ const StaffSearchWrapper: React.FC & SubComponents = async () => { | |||
const staff = await fetchStaff(); | |||
// const try = ...staff | |||
console.log(staff) | |||
const records = staff.records; | |||
// const records = staff.records; | |||
return <StaffSearch staff={staff.records} />; | |||
return <StaffSearch staff={staff} />; | |||
}; | |||
StaffSearchWrapper.Loading = StaffSearchLoading; | |||