Made scan parameters editable (dev only for now)

This commit is contained in:
Joel Collins 2020-09-09 13:21:58 +01:00
parent 41eff92e7d
commit 9a3ba335c1

View file

@ -1,17 +1,16 @@
<template> <template>
<div class="medscan"> <div class="uk-padding-small">
<div v-show="!scanUri">No scan extension found</div> <div v-show="!scanUri">No scan extension found</div>
<div v-show="scanUri"> <div v-show="scanUri">
<h1>Sample Scan Wizard</h1>
<form @submit.prevent @keyup.enter="increment()"> <form @submit.prevent @keyup.enter="increment()">
<div v-show="stepValue == 0" id="step-user"> <div v-show="stepValue == 0" id="step-user">
<h2>User information (1/4)</h2> <h3>User information (1/4)</h3>
<label for="username">Your name:</label> <label for="username">Your name:</label>
<input <input
id="username" id="username"
v-model="username" v-model="username"
class="uk-input"
type="text" type="text"
name="username" name="username"
required required
@ -21,18 +20,20 @@
<input <input
id="currentTime" id="currentTime"
v-model="currentTimeForm" v-model="currentTimeForm"
class="uk-input"
type="datetime-local" type="datetime-local"
name="currentTime" name="currentTime"
/> />
</div> </div>
<div v-show="stepValue == 1" id="step-patient"> <div v-show="stepValue == 1" id="step-patient">
<h2>Patient information (2/4)</h2> <h3>Patient information (2/4)</h3>
<label for="patientID">Patient ID:</label> <label for="patientID">Patient ID:</label>
<input <input
id="patientID" id="patientID"
v-model="patientID" v-model="patientID"
class="uk-input"
type="text" type="text"
name="patientID" name="patientID"
required required
@ -41,16 +42,23 @@
</div> </div>
<div v-show="stepValue == 2" id="step-sample"> <div v-show="stepValue == 2" id="step-sample">
<h2>Sample information (3/4)</h2> <h3>Sample information (3/4)</h3>
<label>Sample type:</label> <label>Sample type:</label>
<br /> <br />
<input id="typeThin" v-model="sampleType" type="radio" value="thin" /> <input
id="typeThin"
v-model="sampleType"
class="uk-radio"
type="radio"
value="thin"
/>
<label for="typeThin">Thin smear</label> <label for="typeThin">Thin smear</label>
<br /> <br />
<input <input
id="typeThick" id="typeThick"
v-model="sampleType" v-model="sampleType"
class="uk-radio"
type="radio" type="radio"
value="thick" value="thick"
/> />
@ -59,7 +67,7 @@
</div> </div>
<div v-show="stepValue == 3" id="step-scan"> <div v-show="stepValue == 3" id="step-scan">
<h2>Start scan (4/4)</h2> <h3>Start scan (4/4)</h3>
<label>Check details:</label> <label>Check details:</label>
<p> <p>
@ -82,7 +90,6 @@
<taskSubmitter <taskSubmitter
v-if="scanUri" v-if="scanUri"
v-show="stepValue == 3" v-show="stepValue == 3"
:base-url="baseURL"
:submit-url="scanUri" :submit-url="scanUri"
:submit-data="payload" :submit-data="payload"
submit-label="Start scan" submit-label="Start scan"
@ -92,16 +99,18 @@
></taskSubmitter> ></taskSubmitter>
<br /> <br />
<div class="grid-container"> <div v-show="!scanRunning" class="grid-container">
<button <button
:disabled="stepValue <= 0 || scanRunning" class="uk-button uk-button-primary"
:disabled="stepValue <= 0"
type="button" type="button"
@click="decrement()" @click="decrement()"
> >
Previous Previous
</button> </button>
<button <button
:disabled="stepValue >= 3 || scanRunning" class="uk-button uk-button-primary"
:disabled="stepValue >= 3"
type="button" type="button"
@click="increment()" @click="increment()"
> >
@ -110,7 +119,8 @@
</div> </div>
<p> <p>
<button <button
v-show="stepValue == 3" v-show="stepValue == 3 && !scanRunning"
class="uk-button uk-button-danger uk-width-1-1"
:disabled="scanRunning" :disabled="scanRunning"
type="button" type="button"
@click="restart()" @click="restart()"
@ -138,12 +148,19 @@ export default {
stepValue: 0, stepValue: 0,
hostDeviceName: null, hostDeviceName: null,
message: null, message: null,
// Scan info
username: "", username: "",
currentTime: this.getLocalDatetimeString(), currentTime: this.getLocalDatetimeString(),
patientID: "", patientID: "",
sampleType: "thin", sampleType: "thin",
scanRunning: false, scanRunning: false,
baseURL: `${window.location.origin}/api/v2` // Scan settings
bayer: false,
grid: [10, 10, 9],
stride_size: [800, 600, 10],
fast_autofocus: true,
autofocus_dz: 2000,
use_video_port: false
}; };
}, },
@ -176,39 +193,25 @@ export default {
return { return {
filename: `${this.patientID}_${this.sampleType}`, filename: `${this.patientID}_${this.sampleType}`,
temporary: false, temporary: false,
bayer: false, bayer: this.bayer,
grid: [10, 10, 9], grid: this.grid,
stride_size: [800, 600, 10], stride_size: this.stride_size,
fast_autofocus: true, fast_autofocus: this.fast_autofocus,
autofocus_dz: 2000, autofocus_dz: this.autofocus_dz,
use_video_port: false, use_video_port: this.use_video_port,
annotations: { annotations: {
patientID: this.patientID, patientID: this.patientID,
username: this.username, username: this.username,
clientDatetime: this.currentTime clientDatetime: this.currentTime
}, },
tags: ["medscan"] tags: ["slidescan"]
}; };
} }
} }
}, },
watch: {
baseURL: function(val) {
if (this.baseURL) {
this.updateScanUri();
} else {
this.message = "No baseURL given";
}
}
},
mounted: function() { mounted: function() {
if (this.baseURL) { this.updateScanUri();
this.updateScanUri();
} else {
this.message = "No baseURL given";
}
}, },
methods: { methods: {
@ -296,12 +299,6 @@ export default {
</script> </script>
<style> <style>
.medscan {
font-family: sans-serif;
color: #444;
text-align: left;
}
.grid-container { .grid-container {
display: grid; display: grid;
grid-template-columns: auto auto; grid-template-columns: auto auto;