Copy from old repo
This commit is contained in:
parent
7aab9ffce0
commit
5088e4cb6e
135
.gitignore
vendored
Normal file
135
.gitignore
vendored
Normal file
@ -0,0 +1,135 @@
|
||||
# VSCodeCounter
|
||||
.vscodecounter/
|
||||
|
||||
# ---> Node
|
||||
# Logs
|
||||
logs
|
||||
*.log
|
||||
npm-debug.log*
|
||||
yarn-debug.log*
|
||||
yarn-error.log*
|
||||
lerna-debug.log*
|
||||
.pnpm-debug.log*
|
||||
|
||||
# Diagnostic reports (https://nodejs.org/api/report.html)
|
||||
report.[0-9]*.[0-9]*.[0-9]*.[0-9]*.json
|
||||
|
||||
# Runtime data
|
||||
pids
|
||||
*.pid
|
||||
*.seed
|
||||
*.pid.lock
|
||||
|
||||
# Directory for instrumented libs generated by jscoverage/JSCover
|
||||
lib-cov
|
||||
|
||||
# Coverage directory used by tools like istanbul
|
||||
coverage
|
||||
*.lcov
|
||||
|
||||
# nyc test coverage
|
||||
.nyc_output
|
||||
|
||||
# Grunt intermediate storage (https://gruntjs.com/creating-plugins#storing-task-files)
|
||||
.grunt
|
||||
|
||||
# Bower dependency directory (https://bower.io/)
|
||||
bower_components
|
||||
|
||||
# node-waf configuration
|
||||
.lock-wscript
|
||||
|
||||
# Compiled binary addons (https://nodejs.org/api/addons.html)
|
||||
build/Release
|
||||
|
||||
# Dependency directories
|
||||
node_modules/
|
||||
jspm_packages/
|
||||
|
||||
# Snowpack dependency directory (https://snowpack.dev/)
|
||||
web_modules/
|
||||
|
||||
# TypeScript cache
|
||||
*.tsbuildinfo
|
||||
|
||||
# Optional npm cache directory
|
||||
.npm
|
||||
|
||||
# Optional eslint cache
|
||||
.eslintcache
|
||||
|
||||
# Optional stylelint cache
|
||||
.stylelintcache
|
||||
|
||||
# Microbundle cache
|
||||
.rpt2_cache/
|
||||
.rts2_cache_cjs/
|
||||
.rts2_cache_es/
|
||||
.rts2_cache_umd/
|
||||
|
||||
# Optional REPL history
|
||||
.node_repl_history
|
||||
|
||||
# Output of 'npm pack'
|
||||
*.tgz
|
||||
|
||||
# Yarn Integrity file
|
||||
.yarn-integrity
|
||||
|
||||
# dotenv environment variable files
|
||||
.env
|
||||
.env.development.local
|
||||
.env.test.local
|
||||
.env.production.local
|
||||
.env.local
|
||||
|
||||
# parcel-bundler cache (https://parceljs.org/)
|
||||
.cache
|
||||
.parcel-cache
|
||||
|
||||
# Next.js build output
|
||||
.next
|
||||
out
|
||||
|
||||
# Nuxt.js build / generate output
|
||||
.nuxt
|
||||
dist
|
||||
|
||||
# Gatsby files
|
||||
.cache/
|
||||
# Comment in the public line in if your project uses Gatsby and not Next.js
|
||||
# https://nextjs.org/blog/next-9-1#public-directory-support
|
||||
# public
|
||||
|
||||
# vuepress build output
|
||||
.vuepress/dist
|
||||
|
||||
# vuepress v2.x temp and cache directory
|
||||
.temp
|
||||
.cache
|
||||
|
||||
# Docusaurus cache and generated files
|
||||
.docusaurus
|
||||
|
||||
# Serverless directories
|
||||
.serverless/
|
||||
|
||||
# FuseBox cache
|
||||
.fusebox/
|
||||
|
||||
# DynamoDB Local files
|
||||
.dynamodb/
|
||||
|
||||
# TernJS port file
|
||||
.tern-port
|
||||
|
||||
# Stores VSCode versions used for testing VSCode extensions
|
||||
.vscode-test
|
||||
|
||||
# yarn v2
|
||||
.yarn/cache
|
||||
.yarn/unplugged
|
||||
.yarn/build-state.yml
|
||||
.yarn/install-state.gz
|
||||
.pnp.*
|
||||
|
||||
22
README.md
22
README.md
@ -1,3 +1,21 @@
|
||||
# mccs-thermal
|
||||
# ITS Thermal Printer
|
||||
Local client-only tool, will generate a PDF for the client to print as needed.
|
||||
|
||||
Code for a local-only utility for generating and printing slips on thermal receipt paper.
|
||||
Grab the latest version (`ITThermal vX.Y.Z.zip`) from the [Releases section](https://git.vfsh.dev/helpd_admin/it-thermal/releases).
|
||||
|
||||
# Usage
|
||||
1. Extract the `ITThermal.zip` file to a local directory
|
||||
2. Open `index.html` in a modern web browser (Chrome, Firefox, Edge, etc.)
|
||||
3. Fill out one of the available forms and click "Generate Receipt"
|
||||
4. A PDF of the receipt will be generated and displayed on the page
|
||||
5. If you're using FireFox the print dialog will open automatically. For other browsers, use the print functionality of your browser's PDF viewer.
|
||||
#### Important Note: The scaling must be set to **100%** or **Actual Size** to ensure proper formatting on the thermal printer. FireFox should do this automatically, but other browsers (namely Edge and Chrome) will default to "Fit to Page" which will mess up the formatting and print approximately 500 miles of white space before the receipt.
|
||||
|
||||
# Notes
|
||||
- Uses jsPDF library for PDF generation:
|
||||
- https://rawgit.com/MrRio/jsPDF/master/docs/jsPDF.html
|
||||
|
||||
# To Do
|
||||
- Add error handling on the front end for missing/invalid fields
|
||||
- Make notes on DT actually optional
|
||||
- Add a class for better font handling
|
||||
286
src/assets/ITThermal.js
Normal file
286
src/assets/ITThermal.js
Normal file
File diff suppressed because one or more lines are too long
BIN
src/assets/images/favicon.ico
Normal file
BIN
src/assets/images/favicon.ico
Normal file
Binary file not shown.
|
After Width: | Height: | Size: 318 B |
BIN
src/assets/images/itslogo_color.png
Normal file
BIN
src/assets/images/itslogo_color.png
Normal file
Binary file not shown.
|
After Width: | Height: | Size: 77 KiB |
163
src/index.html
Normal file
163
src/index.html
Normal file
@ -0,0 +1,163 @@
|
||||
<!DOCTYPE html>
|
||||
<html lang="en">
|
||||
<head>
|
||||
<meta charset="UTF-8">
|
||||
<meta name="viewport" content="width=device-width, initial-scale=1.0">
|
||||
<title>ITS Thermal Printer</title>
|
||||
<link rel="icon" type="image/x-icon" href="./assets/images/favicon.ico">
|
||||
</head>
|
||||
<body class="bg-gray-100 leading-normal tracking-normal dark:bg-gray-900">
|
||||
<!-- Logo -->
|
||||
<div class="flex justify-center mt-6">
|
||||
<img src="./assets/images/itslogo_color.png" alt="ITS Logo" class="h-24 w-auto">
|
||||
</div>
|
||||
<!-- Title -->
|
||||
<div class="flex flex-col justify-center mt-6">
|
||||
<h1 class="dark:text-gray-300 text-4xl font-bold text-center">ITS Thermal Printer</h1><br />
|
||||
<h4 class="dark:text-gray-300 text-lg text-center">v<span id="versionNumber"></span> Developed for MCCS by <a href="https://git.vfsh.dev/helpd_admin/it-thermal/src/branch/client-only" class="text-blue-700">Skylar Grant</a></h4>
|
||||
</div>
|
||||
|
||||
<!-- Parent container to hold flex columns -->
|
||||
<div class="flex justify-center mt-10 space-x-6">
|
||||
<!-- Left column -->
|
||||
<div class="flex flex-col space-y-6 w-full max-w-md">
|
||||
<!-- Temporary Password -->
|
||||
<div class="bg-white dark:bg-gray-800 p-5 rounded-lg shadow-lg">
|
||||
<!-- Title -->
|
||||
<h1 class="dark:text-gray-300 text-2xl font-bold text-center mb-4">Temporary Password</h1>
|
||||
<!-- Fields -->
|
||||
<div>
|
||||
<!-- Username -->
|
||||
<label for="tempPwUsername" class="dark:text-gray-300 block text-md font-medium text-gray-700">Username: (optional)</label>
|
||||
<input type="text" id="tempPwUsername" name="tempPwUsername"
|
||||
class="dark:border-gray-700 dark:bg-gray-700 dark:text-white mt-1 ml-2 block w-full px-3 py-2 border border-gray-300 rounded-md shadow-sm focus:outline-none focus:ring-indigo-500 focus:border-indigo-500 sm:text-sm">
|
||||
<!-- Password -->
|
||||
<label for="tempPwPassword" class="dark:text-gray-300 block text-md font-medium text-gray-700">Password:</label>
|
||||
<input type="text" id="tempPwPassword" name="tempPwPassword" required
|
||||
class="dark:border-gray-700 dark:bg-gray-700 dark:text-white mt-1 ml-2 block w-full px-3 py-2 border border-gray-300 rounded-md shadow-sm focus:outline-none focus:ring-indigo-500 focus:border-indigo-500 sm:text-sm">
|
||||
</div>
|
||||
<!-- Submit Button -->
|
||||
<div class="text-center">
|
||||
<button type="submit"
|
||||
id="tempPasswordBtn"
|
||||
style="background-color: #4b7839;"
|
||||
class="dark:bg-indigo-600 dark:hover:bg-indigo-700 w-full text-white py-2 px-4 rounded-md hover:bg-indigo-700 focus:outline-none focus:ring-2 focus:ring-indigo-500 focus:ring-opacity-50 mt-4">
|
||||
Generate Receipt
|
||||
</button>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<!-- Custom Note -->
|
||||
<div class="bg-white dark:bg-gray-800 p-5 rounded-lg shadow-lg">
|
||||
<!-- Title -->
|
||||
<h1 class="dark:text-gray-300 text-2xl font-bold text-center mb-4">Custom Note</h1>
|
||||
<!-- Fields -->
|
||||
<div>
|
||||
<!-- Notes -->
|
||||
<label for="customNoteTextArea" class="dark:text-gray-300 block text-md font-medium text-gray-700">Notes:</label>
|
||||
<textarea id="customNoteTextArea" name="customNoteTextArea" cols="35" rows="10" required
|
||||
class="dark:border-gray-700 dark:bg-gray-700 dark:text-white mt-1 ml-2 block w-full px-3 py-2 border border-gray-300 rounded-md shadow-sm focus:outline-none focus:ring-indigo-500 focus:border-indigo-500 sm:text-sm"></textarea>
|
||||
</div>
|
||||
<!-- Submit Button -->
|
||||
<div class="text-center">
|
||||
<button type="submit"
|
||||
id="customNoteBtn"
|
||||
style="background-color: #4b7839;"
|
||||
class="dark:bg-indigo-600 dark:hover:bg-indigo-700 w-full text-white py-2 px-4 rounded-md hover:bg-indigo-700 focus:outline-none focus:ring-2 focus:ring-indigo-500 focus:ring-opacity-50 mt-4">
|
||||
Generate Receipt
|
||||
</button>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<!-- Right column -->
|
||||
<div class="flex flex-col space-y-6 w-full max-w-md">
|
||||
<!-- Device Tracker -->
|
||||
<div class="bg-white dark:bg-gray-800 p-5 rounded-lg shadow-lg">
|
||||
<!-- Title -->
|
||||
<h1 class="dark:text-gray-300 text-2xl font-bold text-center mb-4">Device Tracker</h1>
|
||||
<!-- Fields -->
|
||||
<div>
|
||||
<!-- Ticket field -->
|
||||
<label for="dtticket" class="dark:text-gray-300 block text-md font-medium text-gray-700">Ticket:</label>
|
||||
<input type="text" id="dtticket" name="dtticket" required
|
||||
class="dark:border-gray-700 dark:bg-gray-700 dark:text-white mt-1 ml-2 block w-full px-3 py-2 border border-gray-300 rounded-md shadow-sm focus:outline-none focus:ring-indigo-500 focus:border-indigo-500 sm:text-sm">
|
||||
<!-- User field -->
|
||||
<label for="dtuser" class="dark:text-gray-300 block text-md font-medium text-gray-700">User:</label>
|
||||
<input type="text" id="dtuser" name="dtuser" required
|
||||
class="dark:border-gray-700 dark:bg-gray-700 dark:text-white mt-1 ml-2 block w-full px-3 py-2 border border-gray-300 rounded-md shadow-sm focus:outline-none focus:ring-indigo-500 focus:border-indigo-500 sm:text-sm">
|
||||
<!-- Radio buttons to pick from "Stock", "Deploy", "Image", "E-Waste", "Repair/Parts" and "Other" -->
|
||||
<label for="dtservice" class="dark:text-gray-300 block text-md font-medium text-gray-700 mb-2">Service:</label>
|
||||
<div class="flex flex-row space-x-20 pl-2">
|
||||
<div class="flex flex-col space-y-2">
|
||||
<label class="inline-flex items-center">
|
||||
<input type="radio" name="dtservice" value="Stock" required
|
||||
class="dark:bg-gray-700 dark:border-gray-700 dark:text-white text-indigo-600 focus:ring-indigo-500">
|
||||
<span class="ml-2 dark:text-gray-300">Stock</span>
|
||||
</label>
|
||||
<label class="inline-flex items-center">
|
||||
<input type="radio" name="dtservice" value="Deploy"
|
||||
class="dark:bg-gray-700 dark:border-gray-700 dark:text-white text-indigo-600 focus:ring-indigo-500">
|
||||
<span class="ml-2 dark:text-gray-300">Deploy</span>
|
||||
</label>
|
||||
<label class="inline-flex items-center">
|
||||
<input type="radio" name="dtservice" value="Image"
|
||||
class="dark:bg-gray-700 dark:border-gray-700 dark:text-white text-indigo-600 focus:ring-indigo-500">
|
||||
<span class="ml-2 dark:text-gray-300">Image</span>
|
||||
</label>
|
||||
</div>
|
||||
<div class="flex flex-col space-y-2">
|
||||
<label class="inline-flex items-center">
|
||||
<input type="radio" name="dtservice" value="E-Waste"
|
||||
class="dark:bg-gray-700 dark:border-gray-700 dark:text-white text-indigo-600 focus:ring-indigo-500">
|
||||
<span class="ml-2 dark:text-gray-300">E-Waste</span>
|
||||
</label>
|
||||
<label class="inline-flex items-center">
|
||||
<input type="radio" name="dtservice" value="Repair/Parts"
|
||||
class="dark:bg-gray-700 dark:border-gray-700 dark:text-white text-indigo-600 focus:ring-indigo-500">
|
||||
<span class="ml-2 dark:text-gray-300">Repair/Parts</span>
|
||||
</label>
|
||||
<label class="inline-flex items-center">
|
||||
<input type="radio" name="dtservice" value="Other"
|
||||
class="dark:bg-gray-700 dark:border-gray-700 dark:text-white text-indigo-600 focus:ring-indigo-500">
|
||||
<span class="ml-2 dark:text-gray-300">Other</span>
|
||||
</label>
|
||||
</div>
|
||||
</div>
|
||||
<!-- Notes field -->
|
||||
<label for="dtnotes" class="dark:text-gray-300 block text-md font-medium text-gray-700">Notes: (optional)</label>
|
||||
<textarea id="dtnotes" name="dtnotes" cols="35" rows="4"
|
||||
class="dark:border-gray-700 dark:bg-gray-700 dark:text-white mt-1 ml-2 block w-full px-3 py-2 border border-gray-300 rounded-md shadow-sm focus:outline-none focus:ring-indigo-500 focus:border-indigo-500 sm:text-sm"></textarea>
|
||||
</div>
|
||||
<!-- Submit Button -->
|
||||
<div class="text-center">
|
||||
<button type="submit"
|
||||
id="deviceTrackerBtn"
|
||||
style="background-color: #4b7839;"
|
||||
class="dark:bg-indigo-600 dark:hover:bg-indigo-700 w-full text-white py-2 px-4 rounded-md hover:bg-indigo-700 focus:outline-none focus:ring-2 focus:ring-indigo-500 focus:ring-opacity-50 mt-4">
|
||||
Generate Receipt
|
||||
</button>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<!-- (Hidden) PDF Viewer -->
|
||||
<div class="flex flex-col space-y-6 w-full max-w-md" id="pdfViewerContainer" style="display:none">
|
||||
<div class="rounded-md">
|
||||
<iframe id="pdfViewer" src="" width="400px" height="500px"
|
||||
class="rounded-md"></iframe>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<!-- Version / Footer -->
|
||||
<div id="footer" class="flex justify-center">
|
||||
<span id="version"
|
||||
class="dark:text-gray-300 text-sm text-center mt-8">(c) 2025 Skylar Grant</span>
|
||||
</div>
|
||||
<!-- Script Calls -->
|
||||
<script src="https://cdnjs.cloudflare.com/ajax/libs/jspdf/1.5.3/jspdf.debug.js" integrity="sha384-NaWTHo/8YCBYJ59830LTz/P4aQZK1sS0SneOgAvhsIl3zBu8r9RevNg5lHCHAuQ/" crossorigin="anonymous"></script>
|
||||
<script src="./assets/ITThermal.js"></script>
|
||||
<script src="https://cdn.tailwindcss.com"></script>
|
||||
</body>
|
||||
</html>
|
||||
Loading…
Reference in New Issue
Block a user