import { Document, Page, Text, View, Image } from "@react-pdf/renderer"; import { TransactionType } from "../Types/Types"; import { colors } from "../../styles"; import { StatusTextColor, StatusBGColor, } from "../StatusTextColor/StatusTextColor"; import ustplogo from "../../assets/ustp-logo.png"; type props = { transaction: TransactionType | null; }; export default function TransactionPDF(props: props) { if (!props.transaction) { return ( Invalid transaction PDF specified ); } return ( {/* Whole Page */} {/* Header */} University of Science and Technology of Southern Philippines{" "} {"\n"} Lapasan, Cagayan de Oro City {"\n"} College of Science and Mathematics {" "} BORROWER'S SLIP{" "} {/* Status */} Status: {`${props.transaction.transaction_status}`} {/* Transaction ID */} Transaction ID: #{props.transaction.id} Borrower Details {/* Top Details */} {/* Borrower Details */} Name:{" "} {props.transaction.borrower.name} {" "} Course:{" "} {`${props.transaction.borrower.course}`}{" "} {"\n"} Section:{" "} {props.transaction.section} Timestamp:{" "} {props.transaction.timestamp} {"\n"} Lab instructor:{" "} {props.transaction.teacher.name} {" "} Subject:{" "} {props.transaction.subject} {/* Equipment Section */} Selected Equipment {props.transaction.equipments.map((equipment) => ( {` - ${equipment.name} (ID:${equipment.id})`} ))} {/* total Equipment */} Total Equipment: {props.transaction.equipments.length} {/* Consumables Area */} Consumables {props.transaction?.consumables} {/* Members here */} Members {props.transaction?.additional_members} {/* Remarks */} Remarks {props.transaction.remarks} ); }