diff --git a/client/src/components/PdfPrint/PdfPrint.js b/client/src/components/PdfPrint/PdfPrint.js index bb2b9817..b1eb5239 100644 --- a/client/src/components/PdfPrint/PdfPrint.js +++ b/client/src/components/PdfPrint/PdfPrint.js @@ -18,11 +18,9 @@ import logo from "../../images/ladot.png"; const useStyles = createUseStyles({ Pdf: { - display: "flex", - flexDirection: "column", - flex: "1 1 auto", - minWidth: "85vw", - margin: "50px auto" + margin: "1em !important", + padding: "0 !important", + overflow: "hidden" }, rule: { display: "flex", @@ -148,7 +146,7 @@ export const PdfPrint = forwardRef((props, ref) => { ); return ( -
+

{ const classes = useStyles(); const componentRef = useRef(); + const projectNameRule = rules && rules.find(r => r.code === "PROJECT_NAME"); + const projectName = projectNameRule + ? projectNameRule.value + : "TDM Calculation Summary"; return ( <> @@ -83,6 +87,9 @@ const WizardFooter = ({ /> )} content={() => componentRef.current} + documentTitle={projectName} + bodyClass="printContainer" + pageStyle=".printContainer {overflow: hidden;}" />
- Print + Print Summary
  • handleClick(handleDownloadCsv)} @@ -138,18 +138,18 @@ const ProjectContextMenu = ({ - Remove from Trash + Restore from Trash ) : ( <> - Move to Trash + Delete )}
  • diff --git a/client/src/components/Projects/ProjectTableRow.js b/client/src/components/Projects/ProjectTableRow.js index 278bed0a..1274f14c 100644 --- a/client/src/components/Projects/ProjectTableRow.js +++ b/client/src/components/Projects/ProjectTableRow.js @@ -7,8 +7,7 @@ import Popup from "reactjs-popup"; import "reactjs-popup/dist/index.css"; import { FontAwesomeIcon } from "@fortawesome/react-fontawesome"; import { - faCamera, - faTrash, + faEye, faEyeSlash, faEllipsisV } from "@fortawesome/free-solid-svg-icons"; @@ -29,6 +28,10 @@ const useStyles = createUseStyles({ padding: "0.2em", textAlign: "right" }, + tdCenterAlign: { + padding: "0.2em", + textAlign: "center" + }, actionIcons: { display: "flex", justifyContent: "space-around", @@ -118,61 +121,65 @@ const ProjectTableRow = ({ }; const handlePrintPdf = useReactToPrint({ - content: () => printRef.current + content: () => printRef.current, + bodyClass: "printContainer", + pageStyle: ".printContainer {overflow: hidden;}" }); const fallbackToBlank = value => { return value !== "undefined" ? value : ""; }; + // Last Modified Date column should display the Last Modified date, unless the project is + // deleted, in which case it will show the deleted date followed by "-Deleted" in red. + const dateModifiedDisplay = () => { + if (project.dateTrashed) { + return ( + + {moment(project.dateTrashed).format("YYYY-MM-DD")} + -Deleted + + ); + } + return {moment(project.dateModified).format("YYYY-MM-DD")}; + }; + return ( - - {project.name} - - {project.address} - {fallbackToBlank(formInputs.VERSION_NO)} - - {fallbackToBlank(formInputs.BUILDING_PERMIT)} - - {`${project.firstName} ${project.lastName}`} - - {moment(project.dateCreated).format("MM/DD/YYYY")} - - - {momentModified.isSame(moment(), "day") - ? momentModified.format("h:mm A") - : momentModified.format("MM/DD/YYYY")} - - - {project.dateHidden && ( + + {project.dateHidden ? ( - )} - - - {project.dateTrashed && ( + ) : ( )} + + {project.dateSnapshotted ? "Snapshot" : "Draft"} + + + {project.name} + + {project.address} + {fallbackToBlank(formInputs.VERSION_NO)} + {`${project.firstName} ${project.lastName}`} - {project.dateSnapshotted && ( - - )} + {moment(project.dateCreated).format("YYYY-MM-DD")} + + {dateModifiedDisplay()} + {projectData && (
    diff --git a/client/src/components/Projects/ProjectsPage.js b/client/src/components/Projects/ProjectsPage.js index 32009914..4fa3b820 100644 --- a/client/src/components/Projects/ProjectsPage.js +++ b/client/src/components/Projects/ProjectsPage.js @@ -4,13 +4,7 @@ import { useNavigate } from "react-router-dom"; import { createUseStyles } from "react-jss"; import moment from "moment"; import { FontAwesomeIcon } from "@fortawesome/react-fontawesome"; -import { - faSortUp, - faSortDown, - faCamera, - faTrash, - faEye -} from "@fortawesome/free-solid-svg-icons"; +import { faSortUp, faSortDown } from "@fortawesome/free-solid-svg-icons"; import SearchIcon from "../../images/search.png"; import Pagination from "../ProjectWizard/Pagination.js"; @@ -76,7 +70,7 @@ const useStyles = createUseStyles({ borderBottom: "1px solid #E7EBF0" }, "& tr td": { - padding: "12px 18px", + padding: "12px", verticalAlign: "middle" }, "& tr:hover": { @@ -319,24 +313,23 @@ const ProjectsPage = ({ account, contentContainerRef }) => { }; const headerData = [ + { + id: "dateHidden", + label: "Visibility" + }, + { + id: "dateSnapshotted", + label: "Status" + }, { id: "name", label: "Name" }, { id: "address", label: "Address" }, { id: "VERSION_NO", label: "Alternative Number" }, - { id: "BUILDING_PERMIT", label: "Building Permit" }, { id: "firstName", label: "Created By" }, { id: "dateCreated", label: "Created On" }, { id: "dateModified", label: "Last Modified" }, { - id: "dateHidden", - label: - }, - { - id: "dateTrashed", - label: - }, - { - id: "dateSnapshotted", - label: + id: "contextMenu", + label: "" } ];