reading table:
This commit is contained in:
Tyrel Souza
parent
1eb2924e53
commit
50cb23ccec
@ -7,11 +7,12 @@
|
|||||||
<br>
|
<br>
|
||||||
<br>
|
<br>
|
||||||
<div :class="{ hide: hide }" class="px666">
|
<div :class="{ hide: hide }" class="px666">
|
||||||
|
<div v-for="table of tables">
|
||||||
<div id="pdf" ref="document">
|
<div id="pdf" ref="document">
|
||||||
<div class="header">
|
<div class="header">
|
||||||
<div class="flex-container">
|
<div class="flex-container">
|
||||||
<div class="column pct-25">
|
<div class="column pct-25">
|
||||||
<img :src="BenchTopLogoUrl" />
|
<img :src="BenchTopLogoUrl"/>
|
||||||
</div>
|
</div>
|
||||||
<div class="column pct-50">
|
<div class="column pct-50">
|
||||||
<div>Customer: {{ props.customer?.customer_name }}</div>
|
<div>Customer: {{ props.customer?.customer_name }}</div>
|
||||||
@ -20,7 +21,7 @@
|
|||||||
<div>Technician: {{ props.customer?.technician }}</div>
|
<div>Technician: {{ props.customer?.technician }}</div>
|
||||||
</div>
|
</div>
|
||||||
<div class="column pct-25">
|
<div class="column pct-25">
|
||||||
<img :src="Al2pCertUrl" />
|
<img :src="Al2pCertUrl"/>
|
||||||
</div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
@ -91,203 +92,13 @@
|
|||||||
</div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
<br />
|
<br/>
|
||||||
<!-- End InstrumentInfo -->
|
<!-- End InstrumentInfo -->
|
||||||
<!-- As Found -->
|
<!-- As Found -->
|
||||||
<div class="readings">
|
<ReadingTable />
|
||||||
<table class="table table-striped">
|
<br/>
|
||||||
<thead>
|
|
||||||
<tr>
|
|
||||||
<th>Gauge Reading</th>
|
|
||||||
<th>Accuracy (+/- FS)</th>
|
|
||||||
<th>Low Limit</th>
|
|
||||||
<th>High Limit</th>
|
|
||||||
<th>As Found (units)</th>
|
|
||||||
<th>OOT</th>
|
|
||||||
</tr>
|
|
||||||
</thead>
|
|
||||||
<tbody>
|
|
||||||
<tr>
|
|
||||||
<td>TBD</td>
|
|
||||||
<td>TBD</td>
|
|
||||||
<td>TBD</td>
|
|
||||||
<td>TBD</td>
|
|
||||||
<td>TBD</td>
|
|
||||||
<td>TBD</td>
|
|
||||||
</tr>
|
|
||||||
<tr>
|
|
||||||
<td>TBD</td>
|
|
||||||
<td>TBD</td>
|
|
||||||
<td>TBD</td>
|
|
||||||
<td>TBD</td>
|
|
||||||
<td>TBD</td>
|
|
||||||
<td>TBD</td>
|
|
||||||
</tr>
|
|
||||||
<tr>
|
|
||||||
<td>TBD</td>
|
|
||||||
<td>TBD</td>
|
|
||||||
<td>TBD</td>
|
|
||||||
<td>TBD</td>
|
|
||||||
<td>TBD</td>
|
|
||||||
<td>TBD</td>
|
|
||||||
</tr>
|
|
||||||
<tr>
|
|
||||||
<td>TBD</td>
|
|
||||||
<td>TBD</td>
|
|
||||||
<td>TBD</td>
|
|
||||||
<td>TBD</td>
|
|
||||||
<td>TBD</td>
|
|
||||||
<td>TBD</td>
|
|
||||||
</tr>
|
|
||||||
<tr>
|
|
||||||
<td> </td>
|
|
||||||
<td> </td>
|
|
||||||
<td> </td>
|
|
||||||
<td> </td>
|
|
||||||
<td> </td>
|
|
||||||
<td> </td>
|
|
||||||
</tr>
|
|
||||||
<tr>
|
|
||||||
<td> </td>
|
|
||||||
<td> </td>
|
|
||||||
<td> </td>
|
|
||||||
<td> </td>
|
|
||||||
<td> </td>
|
|
||||||
<td> </td>
|
|
||||||
</tr>
|
|
||||||
<tr>
|
|
||||||
<td> </td>
|
|
||||||
<td> </td>
|
|
||||||
<td> </td>
|
|
||||||
<td> </td>
|
|
||||||
<td> </td>
|
|
||||||
<td> </td>
|
|
||||||
</tr>
|
|
||||||
<tr>
|
|
||||||
<td> </td>
|
|
||||||
<td> </td>
|
|
||||||
<td> </td>
|
|
||||||
<td> </td>
|
|
||||||
<td> </td>
|
|
||||||
<td> </td>
|
|
||||||
</tr>
|
|
||||||
<tr>
|
|
||||||
<td> </td>
|
|
||||||
<td> </td>
|
|
||||||
<td> </td>
|
|
||||||
<td> </td>
|
|
||||||
<td> </td>
|
|
||||||
<td> </td>
|
|
||||||
</tr>
|
|
||||||
<tr>
|
|
||||||
<td> </td>
|
|
||||||
<td> </td>
|
|
||||||
<td> </td>
|
|
||||||
<td> </td>
|
|
||||||
<td> </td>
|
|
||||||
<td> </td>
|
|
||||||
</tr>
|
|
||||||
</tbody>
|
|
||||||
</table>
|
|
||||||
</div>
|
|
||||||
<br />
|
|
||||||
<!-- As Left -->
|
<!-- As Left -->
|
||||||
<div class="readings">
|
<ReadingTable />
|
||||||
<table class="table table-striped">
|
|
||||||
<thead>
|
|
||||||
<tr>
|
|
||||||
<th>Gauge Reading</th>
|
|
||||||
<th>Accuracy (+/- FS)</th>
|
|
||||||
<th>Low Limit</th>
|
|
||||||
<th>High Limit</th>
|
|
||||||
<th>As Left (units)</th>
|
|
||||||
<th>OOT</th>
|
|
||||||
</tr>
|
|
||||||
</thead>
|
|
||||||
<tbody>
|
|
||||||
<tr>
|
|
||||||
<td>TBD</td>
|
|
||||||
<td>TBD</td>
|
|
||||||
<td>TBD</td>
|
|
||||||
<td>TBD</td>
|
|
||||||
<td>TBD</td>
|
|
||||||
<td>TBD</td>
|
|
||||||
</tr>
|
|
||||||
<tr>
|
|
||||||
<td>TBD</td>
|
|
||||||
<td>TBD</td>
|
|
||||||
<td>TBD</td>
|
|
||||||
<td>TBD</td>
|
|
||||||
<td>TBD</td>
|
|
||||||
<td>TBD</td>
|
|
||||||
</tr>
|
|
||||||
<tr>
|
|
||||||
<td>TBD</td>
|
|
||||||
<td>TBD</td>
|
|
||||||
<td>TBD</td>
|
|
||||||
<td>TBD</td>
|
|
||||||
<td>TBD</td>
|
|
||||||
<td>TBD</td>
|
|
||||||
</tr>
|
|
||||||
<tr>
|
|
||||||
<td>TBD</td>
|
|
||||||
<td>TBD</td>
|
|
||||||
<td>TBD</td>
|
|
||||||
<td>TBD</td>
|
|
||||||
<td>TBD</td>
|
|
||||||
<td>TBD</td>
|
|
||||||
</tr>
|
|
||||||
<tr>
|
|
||||||
<td> </td>
|
|
||||||
<td> </td>
|
|
||||||
<td> </td>
|
|
||||||
<td> </td>
|
|
||||||
<td> </td>
|
|
||||||
<td> </td>
|
|
||||||
</tr>
|
|
||||||
<tr>
|
|
||||||
<td> </td>
|
|
||||||
<td> </td>
|
|
||||||
<td> </td>
|
|
||||||
<td> </td>
|
|
||||||
<td> </td>
|
|
||||||
<td> </td>
|
|
||||||
</tr>
|
|
||||||
<tr>
|
|
||||||
<td> </td>
|
|
||||||
<td> </td>
|
|
||||||
<td> </td>
|
|
||||||
<td> </td>
|
|
||||||
<td> </td>
|
|
||||||
<td> </td>
|
|
||||||
</tr>
|
|
||||||
<tr>
|
|
||||||
<td> </td>
|
|
||||||
<td> </td>
|
|
||||||
<td> </td>
|
|
||||||
<td> </td>
|
|
||||||
<td> </td>
|
|
||||||
<td> </td>
|
|
||||||
</tr>
|
|
||||||
<tr>
|
|
||||||
<td> </td>
|
|
||||||
<td> </td>
|
|
||||||
<td> </td>
|
|
||||||
<td> </td>
|
|
||||||
<td> </td>
|
|
||||||
<td> </td>
|
|
||||||
</tr>
|
|
||||||
<tr>
|
|
||||||
<td> </td>
|
|
||||||
<td> </td>
|
|
||||||
<td> </td>
|
|
||||||
<td> </td>
|
|
||||||
<td> </td>
|
|
||||||
<td> </td>
|
|
||||||
</tr>
|
|
||||||
</tbody>
|
|
||||||
</table>
|
|
||||||
</div>
|
|
||||||
<!-- End Instruments-->
|
<!-- End Instruments-->
|
||||||
<div class="box">
|
<div class="box">
|
||||||
<p>
|
<p>
|
||||||
@ -303,20 +114,24 @@
|
|||||||
</div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
|
</div>
|
||||||
<div>
|
<div>
|
||||||
{{ output() }}
|
{{ output() }}
|
||||||
</div>
|
</div>
|
||||||
</template>
|
</template>
|
||||||
|
|
||||||
<script setup>
|
<script setup>
|
||||||
import { ref, defineProps } from "vue";
|
import {defineProps, ref} from "vue";
|
||||||
import html2pdf from "html2pdf.js";
|
import html2pdf from "html2pdf.js";
|
||||||
import BenchTopLogoUrl from "../../assets/BenchTopLogo.png";
|
import BenchTopLogoUrl from "../../assets/BenchTopLogo.png";
|
||||||
import Al2pCertUrl from "../../assets/al2pCert.png";
|
import Al2pCertUrl from "../../assets/al2pCert.png";
|
||||||
|
|
||||||
import parseTransducer from "../../parsers/Transducer"
|
import ParseTransducer from "../../parsers/Transducer"
|
||||||
|
import ParseHardwareCalibration from "../../parsers/Hardware.js"
|
||||||
|
import ReadingTable from "./ReadingTable.vue";
|
||||||
|
|
||||||
const hide = ref(false);
|
const hide = ref(false);
|
||||||
|
const tables = ref([])
|
||||||
|
|
||||||
const props = defineProps({
|
const props = defineProps({
|
||||||
upload: Object,
|
upload: Object,
|
||||||
@ -382,24 +197,33 @@ const exportToPDF = () => {
|
|||||||
var opt = {
|
var opt = {
|
||||||
margin: 0.4,
|
margin: 0.4,
|
||||||
filename: `${props.instrument.model}_${i_date()}.pdf`,
|
filename: `${props.instrument.model}_${i_date()}.pdf`,
|
||||||
image: { type: "jpeg", quality: 0.98 },
|
image: {type: "jpeg", quality: 0.98},
|
||||||
html2canvas: { scale: 2 },
|
html2canvas: {scale: 2},
|
||||||
jsPDF: { unit: "in", format: "letter", orientation: "portrait" },
|
jsPDF: {unit: "in", format: "letter", orientation: "portrait"},
|
||||||
};
|
};
|
||||||
html2pdf().from(element).set(opt).save();
|
html2pdf().from(element).set(opt).save();
|
||||||
};
|
};
|
||||||
|
|
||||||
|
|
||||||
const output = () => {
|
const output = () => {
|
||||||
let content = ""
|
let content = ""
|
||||||
|
tables.value = []
|
||||||
|
|
||||||
if (props.upload !== undefined && props.upload.files.length > 0) {
|
if (props.upload !== undefined && props.upload.files.length > 0) {
|
||||||
const acc = props.environment.accuracy
|
const acc = props.environment.accuracy
|
||||||
content = parseTransducer(props.upload.files[0]["value"], acc)
|
if (props.upload.report_type === "Transducer Verify") {
|
||||||
|
for (const idx in props.upload.files) {
|
||||||
|
content = ParseTransducer(props.upload.files[idx]["value"], acc)
|
||||||
|
tables.value = [...tables.value, ...content]
|
||||||
|
}
|
||||||
|
} else if (props.upload.report_type === "Hardware Calibration") {
|
||||||
|
for (const idx in props.upload.files) {
|
||||||
|
content = ParseHardwareCalibration(props.upload.files[idx]["value"], acc)
|
||||||
|
tables.value = [...tables.value, ...[content]]
|
||||||
|
}
|
||||||
|
}
|
||||||
}
|
}
|
||||||
|
|
||||||
return {
|
return tables
|
||||||
"form1": content
|
|
||||||
}
|
|
||||||
}
|
}
|
||||||
|
|
||||||
|
|
||||||
@ -411,6 +235,7 @@ const output = () => {
|
|||||||
display: none;
|
display: none;
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
|
||||||
body {
|
body {
|
||||||
margin: 1rem;
|
margin: 1rem;
|
||||||
}
|
}
|
||||||
@ -418,27 +243,33 @@ body {
|
|||||||
.hide {
|
.hide {
|
||||||
display: none;
|
display: none;
|
||||||
}
|
}
|
||||||
|
|
||||||
.pdf-container {
|
.pdf-container {
|
||||||
max-width: 960px;
|
max-width: 960px;
|
||||||
margin: auto;
|
margin: auto;
|
||||||
}
|
}
|
||||||
|
|
||||||
h1 {
|
h1 {
|
||||||
text-align: center;
|
text-align: center;
|
||||||
font-size: 1.75rem;
|
font-size: 1.75rem;
|
||||||
font-weight: bold;
|
font-weight: bold;
|
||||||
}
|
}
|
||||||
|
|
||||||
.ul {
|
.ul {
|
||||||
font-size: 12pt;
|
font-size: 12pt;
|
||||||
text-decoration: underline;
|
text-decoration: underline;
|
||||||
}
|
}
|
||||||
|
|
||||||
.box {
|
.box {
|
||||||
border: 1px solid;
|
border: 1px solid;
|
||||||
}
|
}
|
||||||
|
|
||||||
.label {
|
.label {
|
||||||
font-size: 12pt;
|
font-size: 12pt;
|
||||||
font-weight: bold;
|
font-weight: bold;
|
||||||
padding-right: 0.25rem;
|
padding-right: 0.25rem;
|
||||||
}
|
}
|
||||||
|
|
||||||
.flex-container {
|
.flex-container {
|
||||||
display: flex;
|
display: flex;
|
||||||
justify-content: space-between;
|
justify-content: space-between;
|
||||||
@ -451,9 +282,11 @@ h1 {
|
|||||||
.pct-50 {
|
.pct-50 {
|
||||||
width: 45%;
|
width: 45%;
|
||||||
}
|
}
|
||||||
|
|
||||||
.pct-33 {
|
.pct-33 {
|
||||||
width: 33%;
|
width: 33%;
|
||||||
}
|
}
|
||||||
|
|
||||||
.pct-25 {
|
.pct-25 {
|
||||||
width: 25%;
|
width: 25%;
|
||||||
}
|
}
|
||||||
@ -466,11 +299,13 @@ tr td {
|
|||||||
padding: 0 !important;
|
padding: 0 !important;
|
||||||
margin: 0 !important;
|
margin: 0 !important;
|
||||||
}
|
}
|
||||||
|
|
||||||
tr th {
|
tr th {
|
||||||
padding: 0 !important;
|
padding: 0 !important;
|
||||||
margin: 0 !important;
|
margin: 0 !important;
|
||||||
width: 18%;
|
width: 18%;
|
||||||
}
|
}
|
||||||
|
|
||||||
.table {
|
.table {
|
||||||
font-size: 9pt;
|
font-size: 9pt;
|
||||||
}
|
}
|
||||||
|
|||||||
139
benchtop-fe/src/components/PDF/ReadingTable.vue
Normal file
139
benchtop-fe/src/components/PDF/ReadingTable.vue
Normal file
@ -0,0 +1,139 @@
|
|||||||
|
<template>
|
||||||
|
<div class="readings">
|
||||||
|
<table class="table table-striped">
|
||||||
|
<thead>
|
||||||
|
<tr>
|
||||||
|
<th>Gauge Reading</th>
|
||||||
|
<th>Accuracy (+/- FS)</th>
|
||||||
|
<th>Low Limit</th>
|
||||||
|
<th>High Limit</th>
|
||||||
|
<th>As Found (units)</th>
|
||||||
|
<th>OOT</th>
|
||||||
|
</tr>
|
||||||
|
</thead>
|
||||||
|
<tbody>
|
||||||
|
<tr>
|
||||||
|
<td>TBD</td>
|
||||||
|
<td>TBD</td>
|
||||||
|
<td>TBD</td>
|
||||||
|
<td>TBD</td>
|
||||||
|
<td>TBD</td>
|
||||||
|
<td>TBD</td>
|
||||||
|
</tr>
|
||||||
|
<tr>
|
||||||
|
<td>TBD</td>
|
||||||
|
<td>TBD</td>
|
||||||
|
<td>TBD</td>
|
||||||
|
<td>TBD</td>
|
||||||
|
<td>TBD</td>
|
||||||
|
<td>TBD</td>
|
||||||
|
</tr>
|
||||||
|
<tr>
|
||||||
|
<td>TBD</td>
|
||||||
|
<td>TBD</td>
|
||||||
|
<td>TBD</td>
|
||||||
|
<td>TBD</td>
|
||||||
|
<td>TBD</td>
|
||||||
|
<td>TBD</td>
|
||||||
|
</tr>
|
||||||
|
<tr>
|
||||||
|
<td>TBD</td>
|
||||||
|
<td>TBD</td>
|
||||||
|
<td>TBD</td>
|
||||||
|
<td>TBD</td>
|
||||||
|
<td>TBD</td>
|
||||||
|
<td>TBD</td>
|
||||||
|
</tr>
|
||||||
|
<tr>
|
||||||
|
<td> </td>
|
||||||
|
<td> </td>
|
||||||
|
<td> </td>
|
||||||
|
<td> </td>
|
||||||
|
<td> </td>
|
||||||
|
<td> </td>
|
||||||
|
</tr>
|
||||||
|
<tr>
|
||||||
|
<td> </td>
|
||||||
|
<td> </td>
|
||||||
|
<td> </td>
|
||||||
|
<td> </td>
|
||||||
|
<td> </td>
|
||||||
|
<td> </td>
|
||||||
|
</tr>
|
||||||
|
<tr>
|
||||||
|
<td> </td>
|
||||||
|
<td> </td>
|
||||||
|
<td> </td>
|
||||||
|
<td> </td>
|
||||||
|
<td> </td>
|
||||||
|
<td> </td>
|
||||||
|
</tr>
|
||||||
|
<tr>
|
||||||
|
<td> </td>
|
||||||
|
<td> </td>
|
||||||
|
<td> </td>
|
||||||
|
<td> </td>
|
||||||
|
<td> </td>
|
||||||
|
<td> </td>
|
||||||
|
</tr>
|
||||||
|
<tr>
|
||||||
|
<td> </td>
|
||||||
|
<td> </td>
|
||||||
|
<td> </td>
|
||||||
|
<td> </td>
|
||||||
|
<td> </td>
|
||||||
|
<td> </td>
|
||||||
|
</tr>
|
||||||
|
<tr>
|
||||||
|
<td> </td>
|
||||||
|
<td> </td>
|
||||||
|
<td> </td>
|
||||||
|
<td> </td>
|
||||||
|
<td> </td>
|
||||||
|
<td> </td>
|
||||||
|
</tr>
|
||||||
|
</tbody>
|
||||||
|
</table>
|
||||||
|
</div>
|
||||||
|
</template>
|
||||||
|
<script>
|
||||||
|
export default {
|
||||||
|
name: 'ReadingTable'
|
||||||
|
}
|
||||||
|
</script>
|
||||||
|
<style scoped>
|
||||||
|
@media print {
|
||||||
|
.custom-button {
|
||||||
|
display: none;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
body {
|
||||||
|
margin: 1rem;
|
||||||
|
}
|
||||||
|
|
||||||
|
h1 {
|
||||||
|
text-align: center;
|
||||||
|
font-size: 1.75rem;
|
||||||
|
font-weight: bold;
|
||||||
|
}
|
||||||
|
|
||||||
|
.column img {
|
||||||
|
width: 150px;
|
||||||
|
}
|
||||||
|
|
||||||
|
tr td {
|
||||||
|
padding: 0 !important;
|
||||||
|
margin: 0 !important;
|
||||||
|
}
|
||||||
|
|
||||||
|
tr th {
|
||||||
|
padding: 0 !important;
|
||||||
|
margin: 0 !important;
|
||||||
|
width: 18%;
|
||||||
|
}
|
||||||
|
|
||||||
|
.table {
|
||||||
|
font-size: 9pt;
|
||||||
|
}
|
||||||
|
</style>
|
||||||
Loading…
Reference in New Issue
Block a user