Added login functionality for tech BOD-95

This commit is contained in:
Patrick Fic
2020-06-29 15:24:04 -07:00
parent 2edfadce3a
commit 0e9cc9620b
27 changed files with 552 additions and 115 deletions

View File

@@ -16659,6 +16659,53 @@
<folder_node>
<name>tech</name>
<children>
<folder_node>
<name>fields</name>
<children>
<concept_node>
<name>employeeid</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>pin</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>
<folder_node>
<name>labels</name>
<children>

View File

@@ -6,7 +6,7 @@ import { useTranslation } from "react-i18next";
export default function ShopEmployeesFormComponent({
form,
selectedEmployee,
handleFinish
handleFinish,
}) {
const { t } = useTranslation();
useEffect(() => {
@@ -27,79 +27,82 @@ export default function ShopEmployeesFormComponent({
: null,
termination_date: selectedEmployee.termination_date
? moment(selectedEmployee.termination_date)
: null
}}
>
<Button type="primary" htmlType="submit">
: null,
}}>
<Button type='primary' htmlType='submit'>
{t("general.actions.save")}
</Button>
<Form.Item
name="first_name"
name='first_name'
label={t("employees.fields.first_name")}
rules={[
{
required: true,
message: t("general.validation.required")
}
]}
>
message: t("general.validation.required"),
},
]}>
<Input />
</Form.Item>
<Form.Item
label={t("employees.fields.last_name")}
name="last_name"
name='last_name'
rules={[
{
required: true,
message: t("general.validation.required")
}
]}
>
message: t("general.validation.required"),
},
]}>
<Input />
</Form.Item>
<Form.Item
name="employee_number"
name='employee_number'
label={t("employees.fields.employee_number")}
rules={[
{
required: true,
message: t("general.validation.required")
}
]}
>
message: t("general.validation.required"),
},
]}>
<Input />
</Form.Item>
<Form.Item
label={t("employees.fields.pin")}
name='pin'
rules={[
{
required: true,
message: t("general.validation.required"),
},
]}>
<Input />
</Form.Item>
<Form.Item
label={t("employees.fields.active")}
valuePropName="checked"
name="active"
>
valuePropName='checked'
name='active'>
<Switch />
</Form.Item>
<Form.Item
label={t("employees.fields.flat_rate")}
name="flat_rate"
valuePropName="checked"
>
name='flat_rate'
valuePropName='checked'>
<Switch />
</Form.Item>
<Form.Item
name="hire_date"
name='hire_date'
label={t("employees.fields.hire_date")}
rules={[
{
required: true,
message: t("general.validation.required")
}
]}
>
message: t("general.validation.required"),
},
]}>
<DatePicker />
</Form.Item>
<Form.Item
label={t("employees.fields.termination_date")}
name="termination_date"
>
name='termination_date'>
<DatePicker />
</Form.Item>
{
@@ -107,26 +110,24 @@ export default function ShopEmployeesFormComponent({
}
<Form.Item
label={t("employees.fields.cost_center")}
name="cost_center"
name='cost_center'
rules={[
{
required: true,
message: t("general.validation.required")
}
]}
>
message: t("general.validation.required"),
},
]}>
<Input />
</Form.Item>
<Form.Item
label={t("employees.fields.base_rate")}
name="base_rate"
name='base_rate'
rules={[
{
required: true,
message: t("general.validation.required")
}
]}
>
message: t("general.validation.required"),
},
]}>
<InputNumber />
</Form.Item>
</Form>

View File

@@ -19,7 +19,9 @@ export function TechHeader({ technician }) {
<Header style={{ textAlign: "center" }}>
<Typography.Title style={{ color: "#fff" }}>
{!!technician
? t("tech.labels.loggedin", { name: technician.name })
? t("tech.labels.loggedin", {
name: `${technician.first_name} ${technician.last_name}`,
})
: t("tech.labels.notloggedin")}
</Typography.Title>
</Header>

View File

@@ -3,56 +3,72 @@ import React from "react";
import { useTranslation } from "react-i18next";
import { connect } from "react-redux";
import { createStructuredSelector } from "reselect";
import { loginStart } from "../../redux/tech/tech.actions";
import { techLoginStart } from "../../redux/tech/tech.actions";
import {
selectLoginError,
selectLoginLoading,
selectTechnician,
} from "../../redux/tech/tech.selectors";
import AlertComponent from "../alert/alert.component";
import "./tech-login.styles.scss";
import { Redirect } from "react-router-dom";
const mapStateToProps = createStructuredSelector({
technician: selectTechnician,
loginError: selectLoginError,
loginLoading: selectLoginLoading,
});
const mapDispatchToProps = (dispatch) => ({
loginStart: (user) => dispatch(loginStart(user)),
techLoginStart: (user) => dispatch(techLoginStart(user)),
});
export function TechLogin({ technician, loginError, loginStart }) {
export function TechLogin({
technician,
loginError,
loginLoading,
techLoginStart,
}) {
const { t } = useTranslation();
const handleFinish = (values) => {
loginStart(values);
techLoginStart(values);
};
return (
<div className='tech-login-container'>
<Form onFinish={handleFinish}>
{technician ? <Redirect to={`/tech/joblookup`} /> : null}
<Form
layout='vertical'
onFinish={handleFinish}
autoComplete='new-password'>
<Form.Item
label={t("tech.fields.username")}
name='date'
label={t("tech.fields.employeeid")}
name='employeeid'
rules={[
{
required: true,
message: t("general.validation.required"),
},
]}>
<Input size='large' />
<Input size='large' autoComplete='off' />
</Form.Item>
<Form.Item
label={t("tech.fields.password")}
name='date'
label={t("tech.fields.pin")}
name='pin'
rules={[
{
required: true,
message: t("general.validation.required"),
},
]}>
<Input.Password size='large' />
<Button htmlType='submit' className='login-btn'>
{t("general.actions.login")}
</Button>
<Input.Password size='large' autoComplete='off' />
</Form.Item>
<Button htmlType='submit' loading={loginLoading} className='login-btn'>
{t("general.actions.login")}
</Button>
</Form>
{loginError ? <AlertComponent type='error' message={loginError} /> : null}
</div>
);
}

View File

@@ -8,16 +8,17 @@ import { connect } from "react-redux";
import { Link } from "react-router-dom";
import { createStructuredSelector } from "reselect";
import { selectTechnician } from "../../redux/tech/tech.selectors";
import { techLogout } from "../../redux/tech/tech.actions";
const { Sider } = Layout;
const mapStateToProps = createStructuredSelector({
technician: selectTechnician,
});
const mapDispatchToProps = (dispatch) => ({
//setUserLanguage: language => dispatch(setUserLanguage(language))
techLogout: () => dispatch(techLogout()),
});
export function TechSider({ technician }) {
export function TechSider({ technician, techLogout }) {
const [collapsed, setCollapsed] = useState(true);
const { t } = useTranslation();
const onCollapse = (collapsed) => {
@@ -57,8 +58,9 @@ export function TechSider({ technician }) {
<Menu.Item
key='7'
disabled={!!!technician}
onClick={() => techLogout()}
icon={<Icon component={FiLogOut} />}>
<Link to={`/tech/logout`}>{t("menus.tech.logout")}</Link>
{t("menus.tech.logout")}
</Menu.Item>
</Menu>
</Sider>

View File

@@ -13,6 +13,7 @@ export const QUERY_EMPLOYEES = gql`
flat_rate
cost_center
base_rate
pin
}
}
`;
@@ -31,7 +32,17 @@ export const UPDATE_EMPLOYEE = gql`
mutation UPDATE_EMPLOYEE($id: uuid!, $employee: employees_set_input) {
update_employees(where: { id: { _eq: $id } }, _set: $employee) {
returning {
last_name
id
first_name
employee_number
active
termination_date
hire_date
flat_rate
cost_center
base_rate
pin
}
}
}

View File

@@ -1,19 +1,16 @@
import { BackTop, Layout } from "antd";
import React, { lazy, Suspense, useEffect } from "react";
import { useTranslation } from "react-i18next";
import { Route, Switch } from "react-router-dom";
import { connect } from "react-redux";
import { Redirect, Route, Switch } from "react-router-dom";
import { createStructuredSelector } from "reselect";
import ErrorBoundary from "../../components/error-boundary/error-boundary.component";
import FcmNotification from "../../components/fcm-notification/fcm-notification.component";
import LoadingSpinner from "../../components/loading-spinner/loading-spinner.component";
import TechHeader from "../../components/tech-header/tech-header.component";
import TechSider from "../../components/tech-sider/tech-sider.component";
import { selectTechnician } from "../../redux/tech/tech.selectors";
import "./tech.page.styles.scss";
const ManageRootPage = lazy(() =>
import("../manage-root/manage-root.page.container")
);
const JobsPage = lazy(() => import("../jobs/jobs.page"));
const TimeTicketModalContainer = lazy(() =>
import("../../components/time-ticket-modal/time-ticket-modal.container")
);
@@ -26,7 +23,14 @@ const TechLogin = lazy(() =>
const { Content } = Layout;
export default function TechPage({ match }) {
const mapStateToProps = createStructuredSelector({
technician: selectTechnician,
});
const mapDispatchToProps = (dispatch) => ({
//setUserLanguage: language => dispatch(setUserLanguage(language))
});
export function TechPage({ technician, match }) {
const { t } = useTranslation();
useEffect(() => {
@@ -37,6 +41,7 @@ export default function TechPage({ match }) {
<Layout className='tech-layout-container'>
<TechSider />
<Layout>
{technician ? null : <Redirect to={`${match.path}/login`} />}
<TechHeader />
<Content className='tech-content-container'>
<FcmNotification />
@@ -48,11 +53,6 @@ export default function TechPage({ match }) {
<TimeTicketModalContainer />
<PrintCenterModalContainer />
<Switch>
<Route
exact
path={`${match.path}`}
component={ManageRootPage}
/>
<Route
exact
path={`${match.path}/login`}
@@ -68,3 +68,4 @@ export default function TechPage({ match }) {
</Layout>
);
}
export default connect(mapStateToProps, mapDispatchToProps)(TechPage);

View File

@@ -1,16 +1,20 @@
import TechActionTypes from "./tech.types";
export const loginStart = ({ technician, password }) => ({
type: TechActionTypes.LOGIN_START,
payload: { technician, password },
export const techLoginStart = ({ employeeid, pin }) => ({
type: TechActionTypes.TECH_LOGIN_START,
payload: { employeeid, pin },
});
export const loginSuccess = (tech) => ({
type: TechActionTypes.LOGIN_SUCCESS,
export const techLoginSuccess = (tech) => ({
type: TechActionTypes.TECH_LOGIN_SUCCESS,
payload: tech,
});
export const loginFailure = (error) => ({
type: TechActionTypes.LOGIN_SUCCESS,
export const techLoginFailure = (error) => ({
type: TechActionTypes.TECH_LOGIN_FAILURE,
payload: error,
});
export const techLogout = () => ({
type: TechActionTypes.TECH_LOGOUT,
});

View File

@@ -1,20 +1,33 @@
import TechActionTypes from "./tech.types";
const INITIAL_STATE = {
technician: null,
loginLoading: false,
loginError: null,
};
const applicationReducer = (state = INITIAL_STATE, action) => {
switch (action.type) {
case TechActionTypes.LOGIN_SUCCESS:
case TechActionTypes.TECH_LOGOUT:
return {
...state,
technician: null,
};
case TechActionTypes.TECH_LOGIN_START:
return {
...state,
loginLoading: true,
};
case TechActionTypes.TECH_LOGIN_SUCCESS:
return {
...state,
technician: action.payload,
loginLoading: false,
};
case TechActionTypes.LOGIN_FAILURE:
case TechActionTypes.TECH_LOGIN_FAILURE:
return {
...state,
loginError: action.payload,
loginLoading: false,
};
default:

View File

@@ -1,16 +1,39 @@
import { all, takeLatest, call, put } from "redux-saga/effects";
import { all, takeLatest, call, put, select } from "redux-saga/effects";
import TechActionTypes from "./tech.types";
import { client } from "../../App/App.container";
import { loginSuccess, loginFailure } from "./tech.actions";
import { techLoginStart,techLoginSuccess, techLoginFailure } from "./tech.actions";
import axios from "axios";
import { selectBodyshop } from "../user/user.selectors";
export function* onSignInStart() {
yield takeLatest(TechActionTypes.LOGIN_START, signInStart);
yield takeLatest(TechActionTypes.TECH_LOGIN_START, signInStart);
}
export function* signInStart({ payload: { technician, password } }) {
export function* signInStart({ payload: { employeeid, pin } }) {
try {
yield put(loginSuccess({ username: "TECHNICIAN" }));
const bodyshop = yield select(selectBodyshop);
const response = yield call(axios.post, "/tech/login", {
shopid: bodyshop.id,
employeeid: employeeid,
pin: pin,
});
console.log("response", response);
const { valid, technician, error } = response.data;
console.log(
"function*signInStart -> valid, technician, erro",
valid,
technician,
error
);
if (valid) {
console.log("Valid in else");
yield put(techLoginSuccess(technician));
} else {
yield put(techLoginFailure(error));
}
} catch (error) {
yield put(loginFailure(error));
yield put(techLoginFailure(error));
}
}

View File

@@ -10,3 +10,7 @@ export const selectLoginError = createSelector(
[selectTechReducer],
(application) => application.loginError
);
export const selectLoginLoading = createSelector(
[selectTechReducer],
(application) => application.loginLoading
);

View File

@@ -1,6 +1,7 @@
const TechActionTypes = {
LOGIN_START: "LOGIN_START",
LOGIN_SUCCESS: "LOGIN_SUCCESS",
LOGIN_FAILURE: "LOGIN_FAILURE",
TECH_LOGIN_START: "TECH_LOGIN_START",
TECH_LOGIN_SUCCESS: "TECH_LOGIN_SUCCESS",
TECH_LOGIN_FAILURE: "TECH_LOGIN_FAILURE",
TECH_LOGOUT: "TECH_LOGOUT",
};
export default TechActionTypes;

View File

@@ -1047,6 +1047,10 @@
}
},
"tech": {
"fields": {
"employeeid": "Employee ID",
"pin": "PIN"
},
"labels": {
"loggedin": "Logged in as {{name}}",
"notloggedin": "Not logged in."

View File

@@ -1047,6 +1047,10 @@
}
},
"tech": {
"fields": {
"employeeid": "",
"pin": ""
},
"labels": {
"loggedin": "",
"notloggedin": ""

View File

@@ -1047,6 +1047,10 @@
}
},
"tech": {
"fields": {
"employeeid": "",
"pin": ""
},
"labels": {
"loggedin": "",
"notloggedin": ""

View File

@@ -0,0 +1,5 @@
- args:
cascade: false
read_only: false
sql: ALTER TABLE "public"."employees" DROP COLUMN "pin";
type: run_sql

View File

@@ -0,0 +1,5 @@
- args:
cascade: false
read_only: false
sql: ALTER TABLE "public"."employees" ADD COLUMN "pin" text NULL;
type: run_sql

View File

@@ -0,0 +1,37 @@
- args:
role: user
table:
name: employees
schema: public
type: drop_insert_permission
- args:
permission:
check:
bodyshop:
associations:
_and:
- user:
authid:
_eq: X-Hasura-User-Id
- active:
_eq: true
columns:
- id
- created_at
- updated_at
- first_name
- last_name
- employee_number
- shopid
- active
- hire_date
- termination_date
- base_rate
- cost_center
- flat_rate
set: {}
role: user
table:
name: employees
schema: public
type: create_insert_permission

View File

@@ -0,0 +1,38 @@
- args:
role: user
table:
name: employees
schema: public
type: drop_insert_permission
- args:
permission:
check:
bodyshop:
associations:
_and:
- user:
authid:
_eq: X-Hasura-User-Id
- active:
_eq: true
columns:
- active
- base_rate
- cost_center
- created_at
- employee_number
- first_name
- flat_rate
- hire_date
- id
- last_name
- pin
- shopid
- termination_date
- updated_at
set: {}
role: user
table:
name: employees
schema: public
type: create_insert_permission

View File

@@ -0,0 +1,37 @@
- args:
role: user
table:
name: employees
schema: public
type: drop_update_permission
- args:
permission:
columns:
- active
- flat_rate
- hire_date
- termination_date
- base_rate
- cost_center
- employee_number
- first_name
- last_name
- created_at
- updated_at
- id
- shopid
filter:
bodyshop:
associations:
_and:
- user:
authid:
_eq: X-Hasura-User-Id
- active:
_eq: true
set: {}
role: user
table:
name: employees
schema: public
type: create_update_permission

View File

@@ -0,0 +1,38 @@
- args:
role: user
table:
name: employees
schema: public
type: drop_update_permission
- args:
permission:
columns:
- active
- base_rate
- cost_center
- created_at
- employee_number
- first_name
- flat_rate
- hire_date
- id
- last_name
- pin
- shopid
- termination_date
- updated_at
filter:
bodyshop:
associations:
_and:
- user:
authid:
_eq: X-Hasura-User-Id
- active:
_eq: true
set: {}
role: user
table:
name: employees
schema: public
type: create_update_permission

View File

@@ -0,0 +1,38 @@
- args:
role: user
table:
name: employees
schema: public
type: drop_select_permission
- args:
permission:
allow_aggregations: false
columns:
- active
- flat_rate
- hire_date
- termination_date
- base_rate
- cost_center
- employee_number
- first_name
- last_name
- created_at
- updated_at
- id
- shopid
computed_fields: []
filter:
bodyshop:
associations:
_and:
- user:
authid:
_eq: X-Hasura-User-Id
- active:
_eq: true
role: user
table:
name: employees
schema: public
type: create_select_permission

View File

@@ -0,0 +1,39 @@
- args:
role: user
table:
name: employees
schema: public
type: drop_select_permission
- args:
permission:
allow_aggregations: false
columns:
- active
- base_rate
- cost_center
- created_at
- employee_number
- first_name
- flat_rate
- hire_date
- id
- last_name
- pin
- shopid
- termination_date
- updated_at
computed_fields: []
filter:
bodyshop:
associations:
_and:
- user:
authid:
_eq: X-Hasura-User-Id
- active:
_eq: true
role: user
table:
name: employees
schema: public
type: create_select_permission

View File

@@ -1201,36 +1201,38 @@ tables:
- active:
_eq: true
columns:
- id
- created_at
- updated_at
- first_name
- last_name
- employee_number
- shopid
- active
- hire_date
- termination_date
- base_rate
- cost_center
- created_at
- employee_number
- first_name
- flat_rate
- hire_date
- id
- last_name
- pin
- shopid
- termination_date
- updated_at
select_permissions:
- role: user
permission:
columns:
- active
- flat_rate
- hire_date
- termination_date
- base_rate
- cost_center
- created_at
- employee_number
- first_name
- last_name
- created_at
- updated_at
- flat_rate
- hire_date
- id
- last_name
- pin
- shopid
- termination_date
- updated_at
filter:
bodyshop:
associations:
@@ -1245,18 +1247,19 @@ tables:
permission:
columns:
- active
- flat_rate
- hire_date
- termination_date
- base_rate
- cost_center
- created_at
- employee_number
- first_name
- last_name
- created_at
- updated_at
- flat_rate
- hire_date
- id
- last_name
- pin
- shopid
- termination_date
- updated_at
filter:
bodyshop:
associations:

View File

@@ -84,6 +84,10 @@ app.post("/notifications/send", fb.sendNotification);
var stripe = require("./server/stripe/payment");
app.post("/stripe/payment", stripe.payment);
//Tech Console
var tech = require("./server/tech/tech");
app.post("/tech/login", tech.techLogin);
//Serve React App if in Production
if (process.env.NODE_ENV === "production") {
app.use(express.static(path.join(__dirname, "client/build")));

View File

@@ -143,6 +143,13 @@ query QUERY_UPCOMING_APPOINTMENTS($now: timestamptz!, $jobId: uuid!) {
larhrs
scheduled_completion
}
}
} `;
`;
exports.QUERY_EMPLOYEE_PIN = `query QUERY_EMPLOYEE_PIN($shopId: uuid!, $employeeId: String!) {
employees(where: {_and: {shopid: {_eq: $shopId}, employee_number: {_eq: $employeeId}}}) {
last_name
first_name
employee_number
pin
}
}`;

49
server/tech/tech.js Normal file
View File

@@ -0,0 +1,49 @@
const client = require("../graphql-client/graphql-client").client;
const queries = require("../graphql-client/queries");
const path = require("path");
require("dotenv").config({
path: path.resolve(
process.cwd(),
`.env.${process.env.NODE_ENV || "development"}`
),
});
exports.techLogin = async (req, res) => {
const { shopid, employeeid, pin } = req.body;
console.log(
"exports.techLogin -> shopid, employeeid, password",
shopid,
employeeid,
pin
);
try {
const result = await client.request(queries.QUERY_EMPLOYEE_PIN, {
shopId: shopid,
employeeId: employeeid,
});
console.log("exports.techLogin -> result", result);
let valid = false;
let error;
let technician;
if (result.employees && result.employees[0]) {
const dbRecord = result.employees[0];
console.log("exports.techLogin -> dbRecord", dbRecord);
if (dbRecord.pin === pin) {
valid = true;
delete dbRecord.pin;
technician = dbRecord;
} else {
error = "The employee ID and PIN combination are not correct.";
}
} else {
error = "The employee ID does not exist.";
}
res.json({ valid, technician, error });
} catch (error) {
console.log("error", error);
res.status(400).send(error);
}
};