diff --git a/public/index.html b/public/index.html index ecae82c..987754d 100644 --- a/public/index.html +++ b/public/index.html @@ -1,15 +1,16 @@ - - - - - - Zgłoszenie praktyki studenckiej - - - - -
- + + + + + + Zgłoszenie praktyki studenckiej + + + + +
+
+ diff --git a/src/components/acceptance-action.tsx b/src/components/acceptance-action.tsx new file mode 100644 index 0000000..670e2b9 --- /dev/null +++ b/src/components/acceptance-action.tsx @@ -0,0 +1,115 @@ +import React, { useState } from "react"; +import { Button, ButtonGroup, Dialog, DialogActions, DialogContent, DialogTitle, Menu, MenuItem, TextField, Typography } from "@material-ui/core"; +import { MenuDown, StickerCheckOutline, StickerRemoveOutline } from "mdi-material-ui"; +import { useTranslation } from "react-i18next"; +import { useVerticalSpacing } from "@/styles"; +import { createPortal } from "react-dom"; + +type AcceptanceActionsProps = { + onAccept: (comment?: string) => void; + onDiscard: (comment: string) => void; + label: string; +} + +export function AcceptanceActions({ onAccept, onDiscard, label }: AcceptanceActionsProps) { + const { t } = useTranslation(); + + const [isDiscardModalOpen, setDiscardModelOpen] = useState(false); + const [isAcceptModalOpen, setAcceptModelOpen] = useState(false); + + const [comment, setComment] = useState(""); + const [menuAnchor, setMenuAnchor] = useState(null); + + const classes = useVerticalSpacing(3); + + const handleAccept = () => { + onAccept(comment); + } + + const handleDiscard = () => { + onDiscard(comment); + } + + const handleAcceptModalClose = () => { + setAcceptModelOpen(false); + } + + const handleDiscardModalClose = () => { + setDiscardModelOpen(false); + } + + const handleDiscardAction = () => { + setDiscardModelOpen(true); + } + + const handleAcceptMenuOpen = (ev: React.MouseEvent) => { + setMenuAnchor(ev.currentTarget); + } + + const handleAcceptMenuClose = () => { + setMenuAnchor(null); + } + + const handleAcceptWithComment = () => { + setAcceptModelOpen(true); + setMenuAnchor(null); + } + + const handleAcceptWithoutComment = () => { + onAccept(); + } + + return <> + + + + + + + { t("accept-without-comments") } + { t("accept-with-comments") } + + + + + { createPortal(<> + + { t(label + ".discard.title") } + + { t(label + ".discard.info") } + setComment(ev.target.value) } fullWidth label={ t("comments") } rows={3}/> + + + + + + + + + + { t(label + ".accept.title") } + + { t(label + ".accept.info") } + setComment(ev.target.value) } fullWidth label={ t("comments") } rows={3}/> + + + + + + + + , document.getElementById("modals") as Element) } + +} diff --git a/src/pages/internship/proposal.tsx b/src/pages/internship/proposal.tsx index 59ae0ee..a108399 100644 --- a/src/pages/internship/proposal.tsx +++ b/src/pages/internship/proposal.tsx @@ -28,6 +28,7 @@ import { Actions } from "@/components"; import { InternshipProposalActions, useDispatch } from "@/state/actions"; import { MenuDown, StickerCheckOutline, StickerRemoveOutline } from "mdi-material-ui/index"; import { useVerticalSpacing } from "@/styles"; +import { AcceptanceActions } from "@/components/acceptance-action"; export const InternshipProposalFormPage = () => { const { t } = useTranslation(); @@ -54,49 +55,13 @@ export const InternshipProposalPreviewPage = () => { const dispatch = useDispatch(); const history = useHistory(); - const [isDiscardModalOpen, setDiscardModelOpen] = useState(false); - const [isAcceptModalOpen, setAcceptModelOpen] = useState(false); - - const [comment, setComment] = useState(""); - const [menuAnchor, setMenuAnchor] = useState(null); - - const handleAccept = () => { - dispatch({ type: InternshipProposalActions.Approve, comment }); + const handleAccept = (comment?: string) => { + dispatch({ type: InternshipProposalActions.Approve, comment: comment || null }); history.push(route("home")); } - const handleDiscard = () => { - dispatch({ type: InternshipProposalActions.Decline, comment }); - history.push(route("home")); - } - - const handleAcceptModalClose = () => { - setAcceptModelOpen(false); - } - - const handleDiscardModalClose = () => { - setDiscardModelOpen(false); - } - - const handleDiscardAction = () => { - setDiscardModelOpen(true); - } - - const handleAcceptMenuOpen = (ev: React.MouseEvent) => { - setMenuAnchor(ev.currentTarget); - } - - const handleAcceptMenuClose = () => { - setMenuAnchor(null); - } - - const handleAcceptWithComment = () => { - setAcceptModelOpen(true); - setMenuAnchor(null); - } - - const handleAcceptWithoutComment = () => { - dispatch({ type: InternshipProposalActions.Approve, comment: null }); + const handleDiscard = (comment: string) => { + dispatch({ type: InternshipProposalActions.Decline, comment: comment }); history.push(route("home")); } @@ -115,59 +80,13 @@ export const InternshipProposalPreviewPage = () => { { proposal && } - - - - - - - { t("accept-without-comments") } - { t("accept-with-comments") } - - - + - - { t("internship.discard.title") } - - { t("internship.discard.info") } - setComment(ev.target.value) } fullWidth label={ t("comments") } rows={3}/> - - - - - - - - - { t("internship.accept.title") } - - { t("internship.accept.info") } - setComment(ev.target.value) } fullWidth label={ t("comments") } rows={3}/> - - - - - - - } diff --git a/src/pages/steps/plan.tsx b/src/pages/steps/plan.tsx index 1e885ce..b437403 100644 --- a/src/pages/steps/plan.tsx +++ b/src/pages/steps/plan.tsx @@ -5,7 +5,7 @@ import { useTranslation } from "react-i18next"; import { Box, Button, ButtonProps, StepProps } from "@material-ui/core"; import { FileDownloadOutline, FileUploadOutline } from "mdi-material-ui/index"; import { route } from "@/routing"; -import { Link as RouterLink } from "react-router-dom"; +import { Link as RouterLink, useHistory } from "react-router-dom"; import { Actions, Step } from "@/components"; import React, { HTMLProps } from "react"; import { Alert, AlertTitle } from "@material-ui/lab"; @@ -15,15 +15,19 @@ import { useDeadlines } from "@/hooks"; import { InternshipDocument } from "@/api/dto/internship-registration"; import { FileInfo } from "@/components/fileinfo"; import { useSpacing } from "@/styles"; +import { AcceptanceActions } from "@/components/acceptance-action"; +import { InternshipPlanActions, useDispatch } from "@/state/actions"; const PlanActions = () => { const status = useSelector(state => getSubmissionStatus(state.plan)); const { t } = useTranslation(); + const dispatch = useDispatch(); + const history = useHistory(); - const FormAction = ({ children = t('steps.plan.form'), ...props }: ButtonProps) => + const FormAction = ({ children = t('steps.plan.submit'), ...props }: ButtonProps) => const TemplateAction = (props: ButtonProps) => @@ -31,9 +35,21 @@ const PlanActions = () => { { t('steps.plan.template') } + const handleAccept = (comment?: string) => { + dispatch({ type: InternshipPlanActions.Approve, comment: comment || null }); + history.push(route("home")); + } + + const handleDiscard = (comment: string) => { + dispatch({ type: InternshipPlanActions.Decline, comment: comment }); + history.push(route("home")); + } + switch (status) { case "awaiting": - return + return + + case "accepted": return { t('send-again') } diff --git a/translations/pl.yaml b/translations/pl.yaml index 5301dbc..5df1221 100644 --- a/translations/pl.yaml +++ b/translations/pl.yaml @@ -148,6 +148,14 @@ internship: title: "Zaakceptuj zgłoszenie praktyki" info: "Poniższa informacja zostanie przekazana praktykantowi." +plan: + discard: + title: "Odrzuć indywidualny program praktyki" + info: "Poniższa informacja zostanie przekazana praktykantowi w celu poprawy zgłoszenia." + accept: + title: "Zaakceptuj indywidualny program praktyki" + info: "Poniższa informacja zostanie przekazana praktykantowi." + steps: personal-data: header: "Uzupełnienie danych"