mutiple fixes

opus_submitter/src/components/AdminPanel.vue

@@ -151,10 +151,6 @@
         <img :src="file.file_url" />
       </div>
 
-      <div class="mockup-code w-full">
-        <pre><code>{{ validationModal}}</code></pre>
-      </div>
-
       <div v-if="validationModal.response" class="space-y-4">
         <div class="alert alert-info">
           <i class="mdi mdi-information-outline"></i>
@@ -194,7 +190,9 @@
               v-model="validationModal.data.validated_cost"
               type="text"
               class="input input-bordered input-sm"
-              :placeholder="validationModal.response.cost || 'Enter cost'"
+              :placeholder="
+                validationModal.response.cost?.toString() || 'Enter cost'
+              "
             />
           </div>
 
@@ -206,7 +204,9 @@
               v-model="validationModal.data.validated_cycles"
               type="text"
               class="input input-bordered input-sm"
-              :placeholder="validationModal.response.cycles || 'Enter cycles'"
+              :placeholder="
+                validationModal.response.cycles?.toString() || 'Enter cycles'
+              "
             />
           </div>
 
@@ -218,7 +218,9 @@
               v-model="validationModal.data.validated_area"
               type="text"
               class="input input-bordered input-sm"
-              :placeholder="validationModal.response.area || 'Enter area'"
+              :placeholder="
+                validationModal.response.area?.toString() || 'Enter area'
+              "
             />
           </div>
         </div>
@@ -239,6 +241,10 @@
             {{ isValidating ? "Validating..." : "Validate" }}
           </button>
         </div>
+
+        <div class="mockup-code w-full">
+          <pre><code>{{ validationModal}}</code></pre>
+        </div>
       </div>
     </div>
     <div class="modal-backdrop" @click="closeValidationModal"></div>
@@ -270,9 +276,9 @@ const validationModal = ref({
   response: null as PuzzleResponse | null,
   data: {
     puzzle: -1,
-    validated_cost: "",
-    validated_cycles: "",
-    validated_area: "",
+    validated_cost: 0,
+    validated_cycles: 0,
+    validated_area: 0,
   },
 });
 
@@ -332,10 +338,10 @@ const autoValidationResponse = async () => {
 const openValidationModal = (response: PuzzleResponse) => {
   validationModal.value.response = response;
   validationModal.value.data = {
-    puzzle: response.puzzle || -1,
-    validated_cost: response.cost || "",
-    validated_cycles: response.cycles || "",
-    validated_area: response.area || "",
+    puzzle: response.puzzle_id || -1,
+    validated_cost: response.cost || 0,
+    validated_cycles: response.cycles || 0,
+    validated_area: response.area || 0,
   };
   validationModal.value.show = true;
 };
@@ -345,9 +351,9 @@ const closeValidationModal = () => {
   validationModal.value.response = null;
   validationModal.value.data = {
     puzzle: -1,
-    validated_cost: "",
-    validated_cycles: "",
-    validated_area: "",
+    validated_cost: 0,
+    validated_cycles: 0,
+    validated_area: 0,
   };
 };