| @@ -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; | |||