IO-1612 Add employee vacation tracking.
This commit is contained in:
@@ -13183,6 +13183,27 @@
|
||||
<folder_node>
|
||||
<name>actions</name>
|
||||
<children>
|
||||
<concept_node>
|
||||
<name>addvacation</name>
|
||||
<definition_loaded>false</definition_loaded>
|
||||
<description></description>
|
||||
<comment></comment>
|
||||
<default_text></default_text>
|
||||
<translations>
|
||||
<translation>
|
||||
<language>en-US</language>
|
||||
<approved>false</approved>
|
||||
</translation>
|
||||
<translation>
|
||||
<language>es-MX</language>
|
||||
<approved>false</approved>
|
||||
</translation>
|
||||
<translation>
|
||||
<language>fr-CA</language>
|
||||
<approved>false</approved>
|
||||
</translation>
|
||||
</translations>
|
||||
</concept_node>
|
||||
<concept_node>
|
||||
<name>new</name>
|
||||
<definition_loaded>false</definition_loaded>
|
||||
@@ -13571,6 +13592,74 @@
|
||||
</translation>
|
||||
</translations>
|
||||
</concept_node>
|
||||
<folder_node>
|
||||
<name>vacation</name>
|
||||
<children>
|
||||
<concept_node>
|
||||
<name>end</name>
|
||||
<definition_loaded>false</definition_loaded>
|
||||
<description></description>
|
||||
<comment></comment>
|
||||
<default_text></default_text>
|
||||
<translations>
|
||||
<translation>
|
||||
<language>en-US</language>
|
||||
<approved>false</approved>
|
||||
</translation>
|
||||
<translation>
|
||||
<language>es-MX</language>
|
||||
<approved>false</approved>
|
||||
</translation>
|
||||
<translation>
|
||||
<language>fr-CA</language>
|
||||
<approved>false</approved>
|
||||
</translation>
|
||||
</translations>
|
||||
</concept_node>
|
||||
<concept_node>
|
||||
<name>length</name>
|
||||
<definition_loaded>false</definition_loaded>
|
||||
<description></description>
|
||||
<comment></comment>
|
||||
<default_text></default_text>
|
||||
<translations>
|
||||
<translation>
|
||||
<language>en-US</language>
|
||||
<approved>false</approved>
|
||||
</translation>
|
||||
<translation>
|
||||
<language>es-MX</language>
|
||||
<approved>false</approved>
|
||||
</translation>
|
||||
<translation>
|
||||
<language>fr-CA</language>
|
||||
<approved>false</approved>
|
||||
</translation>
|
||||
</translations>
|
||||
</concept_node>
|
||||
<concept_node>
|
||||
<name>start</name>
|
||||
<definition_loaded>false</definition_loaded>
|
||||
<description></description>
|
||||
<comment></comment>
|
||||
<default_text></default_text>
|
||||
<translations>
|
||||
<translation>
|
||||
<language>en-US</language>
|
||||
<approved>false</approved>
|
||||
</translation>
|
||||
<translation>
|
||||
<language>es-MX</language>
|
||||
<approved>false</approved>
|
||||
</translation>
|
||||
<translation>
|
||||
<language>fr-CA</language>
|
||||
<approved>false</approved>
|
||||
</translation>
|
||||
</translations>
|
||||
</concept_node>
|
||||
</children>
|
||||
</folder_node>
|
||||
</children>
|
||||
</folder_node>
|
||||
<folder_node>
|
||||
@@ -13597,6 +13686,27 @@
|
||||
</translation>
|
||||
</translations>
|
||||
</concept_node>
|
||||
<concept_node>
|
||||
<name>endmustbeafterstart</name>
|
||||
<definition_loaded>false</definition_loaded>
|
||||
<description></description>
|
||||
<comment></comment>
|
||||
<default_text></default_text>
|
||||
<translations>
|
||||
<translation>
|
||||
<language>en-US</language>
|
||||
<approved>false</approved>
|
||||
</translation>
|
||||
<translation>
|
||||
<language>es-MX</language>
|
||||
<approved>false</approved>
|
||||
</translation>
|
||||
<translation>
|
||||
<language>fr-CA</language>
|
||||
<approved>false</approved>
|
||||
</translation>
|
||||
</translations>
|
||||
</concept_node>
|
||||
<concept_node>
|
||||
<name>flat_rate</name>
|
||||
<definition_loaded>false</definition_loaded>
|
||||
|
||||
@@ -10,6 +10,7 @@ import ScheduleCalendarComponent from "./schedule-calendar.component";
|
||||
import { calculateScheduleLoad } from "../../redux/application/application.actions";
|
||||
import { connect } from "react-redux";
|
||||
import { createStructuredSelector } from "reselect";
|
||||
import moment from "moment";
|
||||
const mapStateToProps = createStructuredSelector({
|
||||
//currentUser: selectCurrentUser
|
||||
});
|
||||
@@ -26,7 +27,12 @@ export function ScheduleCalendarContainer({ calculateScheduleLoad }) {
|
||||
const { loading, error, data, refetch } = useQuery(
|
||||
QUERY_ALL_ACTIVE_APPOINTMENTS,
|
||||
{
|
||||
variables: { start: range.start.toDate(), end: range.end.toDate() },
|
||||
variables: {
|
||||
start: range.start.toDate(),
|
||||
end: range.end.toDate(),
|
||||
startd: range.start,
|
||||
endd: range.end,
|
||||
},
|
||||
skip: !!!range.start || !!!range.end,
|
||||
fetchPolicy: "network-only",
|
||||
nextFetchPolicy: "network-only",
|
||||
@@ -39,15 +45,29 @@ export function ScheduleCalendarContainer({ calculateScheduleLoad }) {
|
||||
|
||||
if (loading) return <LoadingSpinner />;
|
||||
if (error) return <AlertComponent message={error.message} type="error" />;
|
||||
let normalizedData = data.appointments.map((e) => {
|
||||
//Required becuase Hasura returns a string instead of a date object.
|
||||
return Object.assign(
|
||||
{},
|
||||
e,
|
||||
{ start: new Date(e.start) },
|
||||
{ end: new Date(e.end) }
|
||||
);
|
||||
});
|
||||
let normalizedData = [
|
||||
...data.appointments.map((e) => {
|
||||
//Required becuase Hasura returns a string instead of a date object.
|
||||
return Object.assign(
|
||||
{},
|
||||
e,
|
||||
{ start: new Date(e.start) },
|
||||
{ end: new Date(e.end) }
|
||||
);
|
||||
}),
|
||||
...data.employee_vacation.map((e) => {
|
||||
//Required becuase Hasura returns a string instead of a date object.
|
||||
return {
|
||||
...e,
|
||||
title: `${
|
||||
(e.employee.first_name && e.employee.first_name.substr(0, 1)) || ""
|
||||
} ${e.employee.last_name || ""} OUT`,
|
||||
color: "red",
|
||||
start: moment(e.start).startOf("day").toDate(),
|
||||
end: moment(e.end).startOf("day").toDate(),
|
||||
};
|
||||
}),
|
||||
];
|
||||
|
||||
return (
|
||||
<ScheduleCalendarComponent
|
||||
|
||||
@@ -11,6 +11,8 @@ export default function ScheduleDayViewContainer({ day }) {
|
||||
variables: {
|
||||
start: moment(day).startOf("day"),
|
||||
end: moment(day).endOf("day"),
|
||||
startd: moment(day).startOf("day").format("YYYY-MM-DD"),
|
||||
endd: moment(day).add(1, "day").format("YYYY-MM-DD"),
|
||||
},
|
||||
skip: !moment(day).isValid(),
|
||||
fetchPolicy: "network-only",
|
||||
@@ -23,15 +25,29 @@ export default function ScheduleDayViewContainer({ day }) {
|
||||
let normalizedData;
|
||||
|
||||
if (data) {
|
||||
normalizedData = data.appointments.map((e) => {
|
||||
//Required becuase Hasura returns a string instead of a date object.
|
||||
return Object.assign(
|
||||
{},
|
||||
e,
|
||||
{ start: new Date(e.start) },
|
||||
{ end: new Date(e.end) }
|
||||
);
|
||||
});
|
||||
normalizedData = [
|
||||
...data.appointments.map((e) => {
|
||||
//Required becuase Hasura returns a string instead of a date object.
|
||||
return Object.assign(
|
||||
{},
|
||||
e,
|
||||
{ start: new Date(e.start) },
|
||||
{ end: new Date(e.end) }
|
||||
);
|
||||
}),
|
||||
...data.employee_vacation.map((e) => {
|
||||
//Required becuase Hasura returns a string instead of a date object.
|
||||
return {
|
||||
...e,
|
||||
title: `${
|
||||
(e.employee.first_name && e.employee.first_name.substr(0, 1)) || ""
|
||||
} ${e.employee.last_name || ""} OUT`,
|
||||
color: "red",
|
||||
start: moment(e.start).startOf("day").toDate(),
|
||||
end: moment(e.end).startOf("day").toDate(),
|
||||
};
|
||||
}),
|
||||
];
|
||||
}
|
||||
|
||||
return (
|
||||
|
||||
@@ -190,7 +190,6 @@ export function ScheduleJobModalComponent({
|
||||
<Col span={12}>
|
||||
<Form.Item shouldUpdate={(prev, cur) => prev.start !== cur.start}>
|
||||
{() => {
|
||||
console.log("render");
|
||||
const values = form.getFieldsValue();
|
||||
return (
|
||||
<div className="schedule-job-modal">
|
||||
|
||||
@@ -0,0 +1,124 @@
|
||||
import { useMutation } from "@apollo/client";
|
||||
import { Button, Card, Form, notification, Popover, Space } from "antd";
|
||||
import moment from "moment";
|
||||
import React, { useState } from "react";
|
||||
import { useTranslation } from "react-i18next";
|
||||
import { logImEXEvent } from "../../firebase/firebase.utils";
|
||||
import { INSERT_VACATION } from "../../graphql/employees.queries";
|
||||
import FormDatePicker from "../form-date-picker/form-date-picker.component";
|
||||
|
||||
export default function ShopEmployeeAddVacation({ employee }) {
|
||||
const { t } = useTranslation();
|
||||
const [insertVacation] = useMutation(INSERT_VACATION);
|
||||
|
||||
const [loading, setLoading] = useState(false);
|
||||
const [form] = Form.useForm();
|
||||
const [visibility, setVisibility] = useState(false);
|
||||
|
||||
const handleFinish = async (values) => {
|
||||
logImEXEvent("employee_add_vacation");
|
||||
|
||||
setLoading(true);
|
||||
let result;
|
||||
|
||||
result = await insertVacation({
|
||||
variables: { vacation: { ...values, employeeid: employee.id } },
|
||||
update(cache, { data }) {
|
||||
cache.modify({
|
||||
id: cache.identify({ id: employee.id, __typename: "employees" }),
|
||||
fields: {
|
||||
employee_vacations(ex) {
|
||||
return [data.insert_employee_vacation_one, ...ex];
|
||||
},
|
||||
},
|
||||
});
|
||||
},
|
||||
});
|
||||
|
||||
if (!!result.errors) {
|
||||
notification["error"]({
|
||||
message: t("employees.errors.adding", {
|
||||
message: JSON.stringify(result.errors),
|
||||
}),
|
||||
});
|
||||
} else {
|
||||
notification["success"]({
|
||||
message: t("employees.successes.added"),
|
||||
});
|
||||
}
|
||||
setLoading(false);
|
||||
setVisibility(false);
|
||||
};
|
||||
|
||||
const overlay = (
|
||||
<Card>
|
||||
<Form form={form} layout="vertical" onFinish={handleFinish}>
|
||||
<Form.Item
|
||||
label={t("employees.fields.vacation.start")}
|
||||
name="start"
|
||||
rules={[
|
||||
{
|
||||
required: true,
|
||||
//message: t("general.validation.required"),
|
||||
},
|
||||
]}
|
||||
>
|
||||
<FormDatePicker />
|
||||
</Form.Item>
|
||||
<Form.Item
|
||||
label={t("employees.fields.vacation.end")}
|
||||
name="end"
|
||||
rules={[
|
||||
{
|
||||
required: true,
|
||||
//message: t("general.validation.required"),
|
||||
},
|
||||
({ getFieldValue }) => ({
|
||||
async validator(rule, value) {
|
||||
if (value) {
|
||||
const { start } = form.getFieldsValue();
|
||||
if (moment(start).isAfter(moment(value))) {
|
||||
return Promise.reject(
|
||||
t("employees.labels.endmustbeafterstart")
|
||||
);
|
||||
} else {
|
||||
return Promise.resolve();
|
||||
}
|
||||
} else {
|
||||
return Promise.resolve();
|
||||
}
|
||||
},
|
||||
}),
|
||||
]}
|
||||
>
|
||||
<FormDatePicker />
|
||||
</Form.Item>
|
||||
|
||||
<Space wrap>
|
||||
<Button type="primary" htmlType="submit">
|
||||
{t("general.actions.save")}
|
||||
</Button>
|
||||
<Button onClick={() => setVisibility(false)}>
|
||||
{t("general.actions.cancel")}
|
||||
</Button>
|
||||
</Space>
|
||||
</Form>
|
||||
</Card>
|
||||
);
|
||||
|
||||
const handleClick = (e) => {
|
||||
setVisibility(true);
|
||||
};
|
||||
|
||||
return (
|
||||
<Popover content={overlay} visible={visibility}>
|
||||
<Button
|
||||
loading={loading}
|
||||
disabled={!employee?.active}
|
||||
onClick={handleClick}
|
||||
>
|
||||
{t("employees.actions.addvacation")}
|
||||
</Button>
|
||||
</Popover>
|
||||
);
|
||||
}
|
||||
@@ -1,20 +1,41 @@
|
||||
import { DeleteFilled } from "@ant-design/icons";
|
||||
import { Button, Card, Form, Input, InputNumber, Select, Switch } from "antd";
|
||||
import { useApolloClient, useMutation, useQuery } from "@apollo/client";
|
||||
import {
|
||||
Button,
|
||||
Card,
|
||||
Form,
|
||||
Input,
|
||||
InputNumber,
|
||||
notification,
|
||||
Select,
|
||||
Switch,
|
||||
Table,
|
||||
} from "antd";
|
||||
import { useForm } from "antd/es/form/Form";
|
||||
import moment from "moment";
|
||||
import querystring from "query-string";
|
||||
import React, { useEffect } from "react";
|
||||
import { useApolloClient } from "@apollo/client";
|
||||
import { useTranslation } from "react-i18next";
|
||||
import { connect } from "react-redux";
|
||||
import { useHistory, useLocation } from "react-router-dom";
|
||||
import { createStructuredSelector } from "reselect";
|
||||
import { logImEXEvent } from "../../firebase/firebase.utils";
|
||||
import {
|
||||
CHECK_EMPLOYEE_NUMBER,
|
||||
DELETE_VACATION,
|
||||
INSERT_EMPLOYEES,
|
||||
QUERY_EMPLOYEE_BY_ID,
|
||||
QUERY_USERS_BY_EMAIL,
|
||||
UPDATE_EMPLOYEE,
|
||||
} from "../../graphql/employees.queries";
|
||||
import { selectBodyshop } from "../../redux/user/user.selectors";
|
||||
import CiecaSelect from "../../utils/Ciecaselect";
|
||||
import { DateFormatter } from "../../utils/DateFormatter";
|
||||
import AlertComponent from "../alert/alert.component";
|
||||
import FormDatePicker from "../form-date-picker/form-date-picker.component";
|
||||
import FormListMoveArrows from "../form-list-move-arrows/form-list-move-arrows.component";
|
||||
import LayoutFormRow from "../layout-form-row/layout-form-row.component";
|
||||
import CiecaSelect from "../../utils/Ciecaselect";
|
||||
import ShopEmployeeAddVacation from "./shop-employees-add-vacation.component";
|
||||
|
||||
const mapStateToProps = createStructuredSelector({
|
||||
bodyshop: selectBodyshop,
|
||||
@@ -23,20 +44,129 @@ const mapDispatchToProps = (dispatch) => ({
|
||||
//setUserLanguage: language => dispatch(setUserLanguage(language))
|
||||
});
|
||||
|
||||
export function ShopEmployeesFormComponent({
|
||||
bodyshop,
|
||||
form,
|
||||
selectedEmployee,
|
||||
handleFinish,
|
||||
}) {
|
||||
export function ShopEmployeesFormComponent({ bodyshop }) {
|
||||
const { t } = useTranslation();
|
||||
const [form] = useForm();
|
||||
const history = useHistory();
|
||||
const search = querystring.parse(useLocation().search);
|
||||
const [deleteVacation] = useMutation(DELETE_VACATION);
|
||||
const { error, data } = useQuery(QUERY_EMPLOYEE_BY_ID, {
|
||||
variables: { id: search.employeeId },
|
||||
skip: !search.employeeId || search.employeeId === "new",
|
||||
fetchPolicy: "network-only",
|
||||
nextFetchPolicy: "network-only",
|
||||
});
|
||||
|
||||
const client = useApolloClient();
|
||||
useEffect(() => {
|
||||
if (selectedEmployee) form.resetFields();
|
||||
}, [selectedEmployee, form]);
|
||||
if (data && data.employees_by_pk) form.setFieldsValue(data.employees_by_pk);
|
||||
else {
|
||||
form.resetFields();
|
||||
}
|
||||
}, [form, data, search.employeeId]);
|
||||
|
||||
if (!selectedEmployee) return null;
|
||||
const [updateEmployee] = useMutation(UPDATE_EMPLOYEE);
|
||||
const [insertEmployees] = useMutation(INSERT_EMPLOYEES);
|
||||
|
||||
const handleFinish = (values) => {
|
||||
if (search.employeeId && search.employeeId !== "new") {
|
||||
//Update a record.
|
||||
logImEXEvent("shop_employee_update");
|
||||
|
||||
updateEmployee({
|
||||
variables: {
|
||||
id: search.employeeId,
|
||||
employee: {
|
||||
...values,
|
||||
user_email: values.user_email === "" ? null : values.user_email,
|
||||
},
|
||||
},
|
||||
})
|
||||
.then((r) => {
|
||||
notification["success"]({
|
||||
message: t("employees.successes.save"),
|
||||
});
|
||||
})
|
||||
.catch((error) => {
|
||||
notification["error"]({
|
||||
message: t("employees.errors.save", {
|
||||
message: JSON.stringify(error),
|
||||
}),
|
||||
});
|
||||
});
|
||||
} else {
|
||||
//New record, insert it.
|
||||
logImEXEvent("shop_employee_insert");
|
||||
|
||||
insertEmployees({
|
||||
variables: { employees: [{ ...values, shopid: bodyshop.id }] },
|
||||
refetchQueries: ["QUERY_EMPLOYEES"],
|
||||
}).then((r) => {
|
||||
search.employeeId = r.data.insert_employees.returning[0].id;
|
||||
history.push({ search: querystring.stringify(search) });
|
||||
notification["success"]({
|
||||
message: t("employees.successes.save"),
|
||||
});
|
||||
});
|
||||
}
|
||||
};
|
||||
|
||||
if (!search.employeeId) return null;
|
||||
if (error) return <AlertComponent message={error.message} type="error" />;
|
||||
|
||||
const columns = [
|
||||
{
|
||||
title: t("employees.fields.vacation.start"),
|
||||
dataIndex: "start",
|
||||
key: "start",
|
||||
render: (text, record) => <DateFormatter>{text}</DateFormatter>,
|
||||
},
|
||||
{
|
||||
title: t("employees.fields.vacation.end"),
|
||||
dataIndex: "end",
|
||||
key: "end",
|
||||
render: (text, record) => <DateFormatter>{text}</DateFormatter>,
|
||||
},
|
||||
{
|
||||
title: t("employees.fields.vacation.length"),
|
||||
dataIndex: "length",
|
||||
key: "length",
|
||||
render: (text, record) =>
|
||||
moment(record.end).diff(moment(record.start), "days", true).toFixed(1),
|
||||
},
|
||||
{
|
||||
title: t("general.labels.actions"),
|
||||
dataIndex: "actions",
|
||||
key: "actions",
|
||||
render: (text, record) => (
|
||||
<Button
|
||||
onClick={async () => {
|
||||
await deleteVacation({
|
||||
variables: { id: record.id },
|
||||
update(cache) {
|
||||
cache.modify({
|
||||
id: cache.identify({
|
||||
id: data.employees_by_pk.id,
|
||||
__typename: "employees",
|
||||
}),
|
||||
|
||||
fields: {
|
||||
employee_vacations(ex, { readField }) {
|
||||
return ex.filter(
|
||||
(vacaref) => record.id !== readField("id", vacaref)
|
||||
);
|
||||
},
|
||||
},
|
||||
});
|
||||
},
|
||||
});
|
||||
}}
|
||||
>
|
||||
<DeleteFilled />
|
||||
</Button>
|
||||
),
|
||||
},
|
||||
];
|
||||
|
||||
return (
|
||||
<Card
|
||||
@@ -51,15 +181,6 @@ export function ShopEmployeesFormComponent({
|
||||
autoComplete={"off"}
|
||||
layout="vertical"
|
||||
form={form}
|
||||
initialValues={{
|
||||
...selectedEmployee,
|
||||
hire_date: selectedEmployee.hire_date
|
||||
? moment(selectedEmployee.hire_date)
|
||||
: null,
|
||||
termination_date: selectedEmployee.termination_date
|
||||
? moment(selectedEmployee.termination_date)
|
||||
: null,
|
||||
}}
|
||||
>
|
||||
<LayoutFormRow>
|
||||
<Form.Item
|
||||
@@ -288,6 +409,15 @@ export function ShopEmployeesFormComponent({
|
||||
}}
|
||||
</Form.List>
|
||||
</Form>
|
||||
|
||||
<Table
|
||||
title={() => (
|
||||
<ShopEmployeeAddVacation employee={data && data.employees_by_pk} />
|
||||
)}
|
||||
columns={columns}
|
||||
rowKey={"id"}
|
||||
dataSource={data ? data.employees_by_pk.employee_vacations : []}
|
||||
/>
|
||||
</Card>
|
||||
);
|
||||
}
|
||||
|
||||
@@ -1,19 +1,22 @@
|
||||
import { Button, Table } from "antd";
|
||||
import queryString from "query-string";
|
||||
import React from "react";
|
||||
import { useTranslation } from "react-i18next";
|
||||
export default function ShopEmployeesListComponent({
|
||||
loading,
|
||||
employees,
|
||||
selectedEmployee,
|
||||
setSelectedEmployee,
|
||||
handleDelete,
|
||||
}) {
|
||||
import { useHistory, useLocation } from "react-router-dom";
|
||||
|
||||
export default function ShopEmployeesListComponent({ loading, employees }) {
|
||||
const { t } = useTranslation();
|
||||
const history = useHistory();
|
||||
const search = queryString.parse(useLocation().search);
|
||||
|
||||
const handleOnRowClick = (record) => {
|
||||
if (record) {
|
||||
setSelectedEmployee(record);
|
||||
} else setSelectedEmployee({});
|
||||
search.employeeId = record.id;
|
||||
history.push({ search: queryString.stringify(search) });
|
||||
} else {
|
||||
delete search.employeeId;
|
||||
history.push({ search: queryString.stringify(search) });
|
||||
}
|
||||
};
|
||||
const columns = [
|
||||
{
|
||||
@@ -41,18 +44,6 @@ export default function ShopEmployeesListComponent({
|
||||
? t("employees.labels.flat_rate")
|
||||
: t("employees.labels.straight_time"),
|
||||
},
|
||||
// {
|
||||
// title: t("employees.labels.actions"),
|
||||
// dataIndex: "actions",
|
||||
// key: "actions",
|
||||
// render: (text, record) => (
|
||||
// <div>
|
||||
// <Button key="delete" onClick={() => handleDelete(record.id)}>
|
||||
// {t("general.actions.delete")}
|
||||
// </Button>
|
||||
// </div>
|
||||
// )
|
||||
// }
|
||||
];
|
||||
return (
|
||||
<div>
|
||||
@@ -62,7 +53,8 @@ export default function ShopEmployeesListComponent({
|
||||
<Button
|
||||
type="primary"
|
||||
onClick={() => {
|
||||
setSelectedEmployee({});
|
||||
search.employeeId = "new";
|
||||
history.push({ search: queryString.stringify(search) });
|
||||
}}
|
||||
>
|
||||
{t("employees.actions.new")}
|
||||
@@ -76,10 +68,11 @@ export default function ShopEmployeesListComponent({
|
||||
dataSource={employees}
|
||||
rowSelection={{
|
||||
onSelect: (props) => {
|
||||
setSelectedEmployee(props);
|
||||
search.employeeId = props.id;
|
||||
history.push({ search: queryString.stringify(search) });
|
||||
},
|
||||
type: "radio",
|
||||
selectedRowKeys: [(selectedEmployee && selectedEmployee.id) || null],
|
||||
selectedRowKeys: [search.employeeId],
|
||||
}}
|
||||
onRow={(record, rowIndex) => {
|
||||
return {
|
||||
|
||||
@@ -1,29 +0,0 @@
|
||||
import React from "react";
|
||||
import ShopEmployeesFormComponent from "./shop-employees-form.component";
|
||||
import ShopEmployeesListComponent from "./shop-employees-list.component";
|
||||
export default function ShopEmployeeComponent({
|
||||
form,
|
||||
loading,
|
||||
employees,
|
||||
employeeState,
|
||||
handleFinish,
|
||||
handleDelete
|
||||
}) {
|
||||
const [selectedEmployee, setSelectedEmployee] = employeeState;
|
||||
return (
|
||||
<div>
|
||||
<ShopEmployeesListComponent
|
||||
employees={employees}
|
||||
loading={loading}
|
||||
selectedEmployee={selectedEmployee}
|
||||
setSelectedEmployee={setSelectedEmployee}
|
||||
handleDelete={handleDelete}
|
||||
/>
|
||||
<ShopEmployeesFormComponent
|
||||
handleFinish={handleFinish}
|
||||
form={form}
|
||||
selectedEmployee={selectedEmployee}
|
||||
/>
|
||||
</div>
|
||||
);
|
||||
}
|
||||
@@ -1,120 +1,32 @@
|
||||
import { useMutation, useQuery } from "@apollo/client";
|
||||
import { Form, notification } from "antd";
|
||||
import React, { useState } from "react";
|
||||
import { useTranslation } from "react-i18next";
|
||||
import { useQuery } from "@apollo/client";
|
||||
import React from "react";
|
||||
import { connect } from "react-redux";
|
||||
import { createStructuredSelector } from "reselect";
|
||||
import { logImEXEvent } from "../../firebase/firebase.utils";
|
||||
import {
|
||||
DELETE_EMPLOYEE,
|
||||
INSERT_EMPLOYEES,
|
||||
QUERY_EMPLOYEES,
|
||||
UPDATE_EMPLOYEE,
|
||||
} from "../../graphql/employees.queries";
|
||||
import { QUERY_EMPLOYEES } from "../../graphql/employees.queries";
|
||||
import { selectBodyshop } from "../../redux/user/user.selectors";
|
||||
import AlertComponent from "../alert/alert.component";
|
||||
import ShopEmployeeComponent from "./shop-employees.component";
|
||||
|
||||
import ShopEmployeesFormComponent from "./shop-employees-form.component";
|
||||
import ShopEmployeesListComponent from "./shop-employees-list.component";
|
||||
const mapStateToProps = createStructuredSelector({
|
||||
bodyshop: selectBodyshop,
|
||||
});
|
||||
|
||||
function ShopEmployeesContainer({ bodyshop }) {
|
||||
const [form] = Form.useForm();
|
||||
const { t } = useTranslation();
|
||||
const employeeState = useState(null);
|
||||
const { loading, error, data, refetch } = useQuery(QUERY_EMPLOYEES, {
|
||||
const { loading, error, data } = useQuery(QUERY_EMPLOYEES, {
|
||||
fetchPolicy: "network-only",
|
||||
nextFetchPolicy: "network-only",
|
||||
});
|
||||
|
||||
const [updateEmployee] = useMutation(UPDATE_EMPLOYEE);
|
||||
const [insertEmployees] = useMutation(INSERT_EMPLOYEES);
|
||||
const [deleteEmployee] = useMutation(DELETE_EMPLOYEE);
|
||||
|
||||
const handleDelete = (id) => {
|
||||
logImEXEvent("shop_employee_delete");
|
||||
|
||||
deleteEmployee({ variables: { id: id } })
|
||||
.then((r) => {
|
||||
notification["success"]({
|
||||
message: t("employees.successes.delete"),
|
||||
});
|
||||
|
||||
employeeState[1](null);
|
||||
refetch().then((r) => form.resetFields());
|
||||
})
|
||||
.catch((error) => {
|
||||
notification["error"]({
|
||||
message: t("employees.errors.delete", {
|
||||
message: JSON.stringify(error),
|
||||
}),
|
||||
});
|
||||
});
|
||||
};
|
||||
|
||||
const handleFinish = (values) => {
|
||||
if (employeeState[0].id) {
|
||||
//Update a record.
|
||||
logImEXEvent("shop_employee_update");
|
||||
|
||||
updateEmployee({
|
||||
variables: {
|
||||
id: employeeState[0].id,
|
||||
employee: {
|
||||
...values,
|
||||
user_email: values.user_email === "" ? null : values.user_email,
|
||||
},
|
||||
},
|
||||
})
|
||||
.then((r) => {
|
||||
notification["success"]({
|
||||
message: t("employees.successes.save"),
|
||||
});
|
||||
|
||||
employeeState[1](null);
|
||||
refetch().then((r) => form.resetFields());
|
||||
})
|
||||
.catch((error) => {
|
||||
notification["error"]({
|
||||
message: t("employees.errors.save", {
|
||||
message: JSON.stringify(error),
|
||||
}),
|
||||
});
|
||||
});
|
||||
} else {
|
||||
//New record, insert it.
|
||||
logImEXEvent("shop_employee_insert");
|
||||
|
||||
insertEmployees({
|
||||
variables: { employees: [{ ...values, shopid: bodyshop.id }] },
|
||||
}).then((r) => {
|
||||
notification["success"]({
|
||||
message: t("employees.successes.save"),
|
||||
});
|
||||
employeeState[1](null);
|
||||
refetch().catch((error) => {
|
||||
notification["error"]({
|
||||
message: t("employees.errors.save", {
|
||||
message: JSON.stringify(error),
|
||||
}),
|
||||
});
|
||||
});
|
||||
});
|
||||
}
|
||||
};
|
||||
|
||||
if (error) return <AlertComponent message={error.message} type="error" />;
|
||||
|
||||
return (
|
||||
<ShopEmployeeComponent
|
||||
handleFinish={handleFinish}
|
||||
handleDelete={handleDelete}
|
||||
form={form}
|
||||
loading={loading}
|
||||
employeeState={employeeState}
|
||||
employees={data ? data.employees : []}
|
||||
/>
|
||||
<div>
|
||||
<ShopEmployeesListComponent
|
||||
employees={data ? data.employees : []}
|
||||
loading={loading}
|
||||
/>
|
||||
<ShopEmployeesFormComponent />
|
||||
</div>
|
||||
);
|
||||
}
|
||||
export default connect(mapStateToProps, null)(ShopEmployeesContainer);
|
||||
|
||||
@@ -4,7 +4,21 @@ export const QUERY_ALL_ACTIVE_APPOINTMENTS = gql`
|
||||
query QUERY_ALL_ACTIVE_APPOINTMENTS(
|
||||
$start: timestamptz!
|
||||
$end: timestamptz!
|
||||
$startd: date!
|
||||
$endd: date!
|
||||
) {
|
||||
employee_vacation(
|
||||
where: { _or: [{ start: { _gte: $startd } }, { end: { _lte: $endd } }] }
|
||||
) {
|
||||
id
|
||||
start
|
||||
end
|
||||
employee {
|
||||
id
|
||||
last_name
|
||||
first_name
|
||||
}
|
||||
}
|
||||
appointments(
|
||||
where: {
|
||||
canceled: { _eq: false }
|
||||
@@ -109,7 +123,24 @@ export const INSERT_APPOINTMENT = gql`
|
||||
`;
|
||||
|
||||
export const QUERY_APPOINTMENT_BY_DATE = gql`
|
||||
query QUERY_APPOINTMENT_BY_DATE($start: timestamptz, $end: timestamptz) {
|
||||
query QUERY_APPOINTMENT_BY_DATE(
|
||||
$start: timestamptz
|
||||
$end: timestamptz
|
||||
$startd: date!
|
||||
$endd: date!
|
||||
) {
|
||||
employee_vacation(
|
||||
where: { _or: [{ start: { _gte: $startd } }, { end: { _lte: $endd } }] }
|
||||
) {
|
||||
id
|
||||
start
|
||||
end
|
||||
employee {
|
||||
id
|
||||
last_name
|
||||
first_name
|
||||
}
|
||||
}
|
||||
appointments(
|
||||
where: { start: { _lte: $end, _gte: $start }, canceled: { _eq: false } }
|
||||
) {
|
||||
|
||||
@@ -3,6 +3,17 @@ import { gql } from "@apollo/client";
|
||||
export const QUERY_EMPLOYEES = gql`
|
||||
query QUERY_EMPLOYEES {
|
||||
employees(order_by: { employee_number: asc }) {
|
||||
last_name
|
||||
id
|
||||
first_name
|
||||
flat_rate
|
||||
employee_number
|
||||
}
|
||||
}
|
||||
`;
|
||||
export const QUERY_EMPLOYEE_BY_ID = gql`
|
||||
query QUERY_EMPLOYEE_BY_ID($id: uuid!) {
|
||||
employees_by_pk(id: $id) {
|
||||
last_name
|
||||
id
|
||||
first_name
|
||||
@@ -14,6 +25,11 @@ export const QUERY_EMPLOYEES = gql`
|
||||
rates
|
||||
pin
|
||||
user_email
|
||||
employee_vacations(order_by: { start: desc }) {
|
||||
id
|
||||
start
|
||||
end
|
||||
}
|
||||
}
|
||||
}
|
||||
`;
|
||||
@@ -55,7 +71,17 @@ export const INSERT_EMPLOYEES = gql`
|
||||
mutation INSERT_EMPLOYEES($employees: [employees_insert_input!]!) {
|
||||
insert_employees(objects: $employees) {
|
||||
returning {
|
||||
last_name
|
||||
id
|
||||
first_name
|
||||
employee_number
|
||||
active
|
||||
termination_date
|
||||
hire_date
|
||||
flat_rate
|
||||
rates
|
||||
pin
|
||||
user_email
|
||||
}
|
||||
}
|
||||
}
|
||||
@@ -98,3 +124,21 @@ export const QUERY_USERS_BY_EMAIL = gql`
|
||||
}
|
||||
}
|
||||
`;
|
||||
|
||||
export const INSERT_VACATION = gql`
|
||||
mutation INSERT_VACATION($vacation: employee_vacation_insert_input!) {
|
||||
insert_employee_vacation_one(object: $vacation) {
|
||||
id
|
||||
start
|
||||
end
|
||||
}
|
||||
}
|
||||
`;
|
||||
|
||||
export const DELETE_VACATION = gql`
|
||||
mutation DELETE_VACATION($id: uuid!) {
|
||||
delete_employee_vacation_by_pk(id: $id) {
|
||||
id
|
||||
}
|
||||
}
|
||||
`;
|
||||
|
||||
@@ -833,6 +833,7 @@
|
||||
},
|
||||
"employees": {
|
||||
"actions": {
|
||||
"addvacation": "Add Vacation",
|
||||
"new": "New Employee",
|
||||
"newrate": "New Rate"
|
||||
},
|
||||
@@ -854,10 +855,16 @@
|
||||
"pin": "Tech Console PIN",
|
||||
"rate": "Rate",
|
||||
"termination_date": "Termination Date",
|
||||
"user_email": "User Email"
|
||||
"user_email": "User Email",
|
||||
"vacation": {
|
||||
"end": "Vacation End",
|
||||
"length": "Vacation Length",
|
||||
"start": "Vacation Start"
|
||||
}
|
||||
},
|
||||
"labels": {
|
||||
"actions": "Actions",
|
||||
"endmustbeafterstart": "End date must be after start date.Ï",
|
||||
"flat_rate": "Flat Rate",
|
||||
"name": "Name",
|
||||
"rate_type": "Rate Type",
|
||||
|
||||
@@ -833,6 +833,7 @@
|
||||
},
|
||||
"employees": {
|
||||
"actions": {
|
||||
"addvacation": "",
|
||||
"new": "Nuevo empleado",
|
||||
"newrate": ""
|
||||
},
|
||||
@@ -854,10 +855,16 @@
|
||||
"pin": "",
|
||||
"rate": "",
|
||||
"termination_date": "Fecha de conclusión",
|
||||
"user_email": ""
|
||||
"user_email": "",
|
||||
"vacation": {
|
||||
"end": "",
|
||||
"length": "",
|
||||
"start": ""
|
||||
}
|
||||
},
|
||||
"labels": {
|
||||
"actions": "",
|
||||
"endmustbeafterstart": "",
|
||||
"flat_rate": "",
|
||||
"name": "",
|
||||
"rate_type": "",
|
||||
|
||||
@@ -833,6 +833,7 @@
|
||||
},
|
||||
"employees": {
|
||||
"actions": {
|
||||
"addvacation": "",
|
||||
"new": "Nouvel employé",
|
||||
"newrate": ""
|
||||
},
|
||||
@@ -854,10 +855,16 @@
|
||||
"pin": "",
|
||||
"rate": "",
|
||||
"termination_date": "Date de résiliation",
|
||||
"user_email": ""
|
||||
"user_email": "",
|
||||
"vacation": {
|
||||
"end": "",
|
||||
"length": "",
|
||||
"start": ""
|
||||
}
|
||||
},
|
||||
"labels": {
|
||||
"actions": "",
|
||||
"endmustbeafterstart": "",
|
||||
"flat_rate": "",
|
||||
"name": "",
|
||||
"rate_type": "",
|
||||
|
||||
@@ -1773,6 +1773,88 @@
|
||||
_eq: X-Hasura-User-Id
|
||||
- active:
|
||||
_eq: true
|
||||
- table:
|
||||
schema: public
|
||||
name: employee_vacation
|
||||
object_relationships:
|
||||
- name: employee
|
||||
using:
|
||||
foreign_key_constraint_on: employeeid
|
||||
insert_permissions:
|
||||
- role: user
|
||||
permission:
|
||||
check:
|
||||
employee:
|
||||
bodyshop:
|
||||
associations:
|
||||
_and:
|
||||
- user:
|
||||
authid:
|
||||
_eq: X-Hasura-User-Id
|
||||
- active:
|
||||
_eq: true
|
||||
columns:
|
||||
- id
|
||||
- created_at
|
||||
- updated_at
|
||||
- employeeid
|
||||
- start
|
||||
- end
|
||||
backend_only: false
|
||||
select_permissions:
|
||||
- role: user
|
||||
permission:
|
||||
columns:
|
||||
- end
|
||||
- start
|
||||
- created_at
|
||||
- updated_at
|
||||
- employeeid
|
||||
- id
|
||||
filter:
|
||||
employee:
|
||||
bodyshop:
|
||||
associations:
|
||||
_and:
|
||||
- user:
|
||||
authid:
|
||||
_eq: X-Hasura-User-Id
|
||||
- active:
|
||||
_eq: true
|
||||
update_permissions:
|
||||
- role: user
|
||||
permission:
|
||||
columns:
|
||||
- end
|
||||
- start
|
||||
- created_at
|
||||
- updated_at
|
||||
- employeeid
|
||||
- id
|
||||
filter:
|
||||
employee:
|
||||
bodyshop:
|
||||
associations:
|
||||
_and:
|
||||
- user:
|
||||
authid:
|
||||
_eq: X-Hasura-User-Id
|
||||
- active:
|
||||
_eq: true
|
||||
check: null
|
||||
delete_permissions:
|
||||
- role: user
|
||||
permission:
|
||||
filter:
|
||||
employee:
|
||||
bodyshop:
|
||||
associations:
|
||||
_and:
|
||||
- user:
|
||||
authid:
|
||||
_eq: X-Hasura-User-Id
|
||||
- active:
|
||||
_eq: true
|
||||
- table:
|
||||
schema: public
|
||||
name: employees
|
||||
@@ -1791,6 +1873,13 @@
|
||||
table:
|
||||
schema: public
|
||||
name: allocations
|
||||
- name: employee_vacations
|
||||
using:
|
||||
foreign_key_constraint_on:
|
||||
column: employeeid
|
||||
table:
|
||||
schema: public
|
||||
name: employee_vacation
|
||||
- name: jobsByEmployeeBody
|
||||
using:
|
||||
foreign_key_constraint_on:
|
||||
|
||||
@@ -0,0 +1 @@
|
||||
DROP TABLE "public"."employee_vacation";
|
||||
@@ -0,0 +1,18 @@
|
||||
CREATE TABLE "public"."employee_vacation" ("id" uuid NOT NULL DEFAULT gen_random_uuid(), "created_at" timestamptz NOT NULL DEFAULT now(), "updated_at" timestamptz NOT NULL DEFAULT now(), "employeeid" uuid NOT NULL, "start" date NOT NULL, "end" date NOT NULL, PRIMARY KEY ("id") , FOREIGN KEY ("employeeid") REFERENCES "public"."employees"("id") ON UPDATE cascade ON DELETE cascade);
|
||||
CREATE OR REPLACE FUNCTION "public"."set_current_timestamp_updated_at"()
|
||||
RETURNS TRIGGER AS $$
|
||||
DECLARE
|
||||
_new record;
|
||||
BEGIN
|
||||
_new := NEW;
|
||||
_new."updated_at" = NOW();
|
||||
RETURN _new;
|
||||
END;
|
||||
$$ LANGUAGE plpgsql;
|
||||
CREATE TRIGGER "set_public_employee_vacation_updated_at"
|
||||
BEFORE UPDATE ON "public"."employee_vacation"
|
||||
FOR EACH ROW
|
||||
EXECUTE PROCEDURE "public"."set_current_timestamp_updated_at"();
|
||||
COMMENT ON TRIGGER "set_public_employee_vacation_updated_at" ON "public"."employee_vacation"
|
||||
IS 'trigger to set value of column "updated_at" to current timestamp on row update';
|
||||
CREATE EXTENSION IF NOT EXISTS pgcrypto;
|
||||
Reference in New Issue
Block a user