render passed validation areas

form/res-judicata/src/views/Upload.vue

@@ -4,9 +4,19 @@
       <input id="file" type="file" name="file">
       <input type="submit" value="Submit">
     </form>
+    <div id="content"></div>
   </div>
 </template>
 
+<style>
+  .court {
+    background-color: #55acee;
+  }
+  .date_and_place {
+    background-color: yellow;
+  }
+</style>
+
 <script>
 // @ is an alias to /src
 
@@ -20,10 +30,29 @@ export default {
       fetch("http://localhost:5000/validator", {method: "POST", body: formData})
       .then(response => response.json())
       .then(result => {
-        console.log(result);
+        console.log(Object.entries(result.checks));
+        const passed = Object.entries(result.checks).filter(([, val]) => {return val !== false}).map(([key, val]) => [val, key]).sort();
+        console.log(passed);
+
+        const content = document.getElementById("content");
+        let i = 0;
+        for (const detection of passed) {
+          const span1 = document.createElement("span");
+          span1.innerText = result.parsed_content.slice(i,detection[0][0]);
+          content.appendChild(span1);
+
+          const span2 = document.createElement("span");
+          span2.innerText = result.parsed_content.slice(detection[0][0], detection[0][1]);
+          span2.classList.add(detection[1]);
+          content.appendChild(span2);
+          i = detection[0][1];
+        }
+        const span = document.createElement("span");
+        span.innerText = result.parsed_content.slice(i);
+        content.appendChild(span);
       })
       .catch(err => {
-        alert(err); //TODO
+        console.error(err); //TODO
       })
     },
   },

validator/validator.py

@@ -64,8 +64,11 @@ def validate_date_and_place(text_content: str) -> Union[Tuple[int, int], Literal
 
 def validate(text_content: str) -> object:
     return {
-        "court": validate_court(text_content),
+        "checks": {
-        "date_and_place": validate_date_and_place(text_content),
+            "court": validate_court(text_content),
+            "date_and_place": validate_date_and_place(text_content),
+        },
+        "parsed_content": text_content,
     }
 
 # debug