component changes, non-new for instrument and calibration

benchtop-fe/src/components/CalibrationDevice/CalibrationDeviceForm.vue

@@ -0,0 +1,36 @@
+<template>
+  <div class="card-header">Primary Cal Device</div>
+  <div class="card-body">
+    <table class="table">
+      <tbody>
+        <tr>
+          <td>Serial #</td>
+          <td>
+            <input
+              type="text"
+              name="serial"
+              maxlength="100"
+              v-model="serial"
+              required
+              id="id_serial"
+            />
+          </td>
+        </tr>
+      </tbody>
+    </table>
+  </div>
+</template>
+<script setup>
+import { ref, defineEmits, watchEffect } from "vue";
+
+const
+  serial = ref("")
+
+
+const emit = defineEmits();
+watchEffect(() => {
+  emit("calibration-form", {
+    serial,
+  });
+});
+</script>

benchtop-fe/src/components/CalibrationDevice/NewCalibrationDeviceForm.vue

@@ -1,5 +1,5 @@
 <template>
-  <div class="card-header">Primary Calibration Device</div>
+  <div class="card-header">Primary Cal Device</div>
   <div class="card-body">
     <table class="table">
       <tbody>

benchtop-fe/src/components/Instrument/InstrumentForm.vue

@@ -0,0 +1,36 @@
+<template>
+  <div class="card-header">Instrument</div>
+  <div class="card-body">
+    <table class="table">
+      <tbody>
+        <tr>
+          <td>Serial #</td>
+          <td>
+            <input
+              type="text"
+              name="serial"
+              maxlength="100"
+              v-model="serial"
+              required
+              id="id_serial"
+            />
+          </td>
+        </tr>
+      </tbody>
+    </table>
+  </div>
+</template>
+<script setup>
+import { ref, defineEmits, watchEffect } from "vue";
+
+const
+  serial = ref("")
+
+
+const emit = defineEmits();
+watchEffect(() => {
+  emit("instrument-form", {
+    serial,
+  });
+});
+</script>

benchtop-fe/src/components/Sheet.vue

@@ -14,11 +14,14 @@
     </div>
 
     <div class="item card">
-      <NewInstrumentForm @newInstrumentForm="newInstrumentForm" />
+      <InstrumentForm @instrumentForm="instrumentForm" />
+      <!-- <NewInstrumentForm @newInstrumentForm="newInstrumentForm" /> -->
     </div>
     <div class="item card">
-      <NewCalibrationDeviceForm @newCalibrationForm="newCalibrationForm" />
+      <CalibrationDeviceForm @calibrationForm="calibrationForm" />
+      <!-- <NewCalibrationDeviceForm @newCalibrationForm="newCalibrationForm" /> -->
     </div>
+
   </div>
 </template>
 
@@ -27,7 +30,9 @@ import { ref, defineEmits } from "vue";
 
 import CustomerForm from "./CustomerForm.vue";
 import NewInstrumentForm from "./Instrument/NewInstrumentForm.vue";
+import InstrumentForm from "./Instrument/InstrumentForm.vue";
 import NewCalibrationDeviceForm from "./CalibrationDevice/NewCalibrationDeviceForm.vue";
+import CalibrationDeviceForm from "./CalibrationDevice/CalibrationDeviceForm.vue";
 import EnvironmentForm from "./EnvironmentForm.vue";
 import UploadForm from "./UploadForm.vue";
 

benchtop-fe/src/components/UploadForm.vue

@@ -81,8 +81,7 @@
 <script setup>
 import { ref, computed, watchEffect } from "vue";
 
-const
-  report_type = ref(""),
+const report_type = ref(""),
   files = ref([]),
   current_file = ref(null),
   doc = ref();

benchtop-fe/src/style.css

@@ -5,6 +5,7 @@ body {
 
 .card {
     border: 1px solid;
+    min-height: 300px;
 }
 .card-header{
     font-size: 2rem;