Autoformat modalComponents

This commit is contained in:
Julian Stirling 2025-10-23 00:15:08 +01:00
parent 958b28aa94
commit 7c0badb1af
13 changed files with 85 additions and 84 deletions

View file

@ -14,7 +14,6 @@
@next="nextTask"
@back="previousTask"
/>
</div>
</div>
</template>
@ -61,10 +60,10 @@ export default {
camera_stage_mapping: cameraStageMappingTask
};
this.availableCalibrationTasks = Object.fromEntries(
Object.entries(allCalibrationTasks)
.filter(([thing]) => this.thingAvailable(thing))
Object.entries(allCalibrationTasks).filter(([thing]) =>
this.thingAvailable(thing)
)
);
},
methods: {
@ -73,7 +72,7 @@ export default {
*
* Iterates over `this.availableCalibrationTasks` (set during mounted()) and reads the
* `calibration_required` property.
*
*
* Returns a list of thing names that report calibration is required.
*/
async check_things_needing_calibration() {
@ -82,7 +81,10 @@ export default {
for (const name of calibrateableThings) {
try {
const thingNeedsCal = await this.readThingProperty(name, "calibration_required");
const thingNeedsCal = await this.readThingProperty(
name,
"calibration_required"
);
if (thingNeedsCal) {
needsCalibration.push(name);
}
@ -100,14 +102,17 @@ export default {
},
/**
* Create the calibration wizard task list dynamically.
*/
create_task_list: function(thingsToCal, includeWelcome=true) {
* Create the calibration wizard task list dynamically.
*/
create_task_list: function(thingsToCal, includeWelcome = true) {
const tasks = [];
// Optionally include the welcome screen
if (includeWelcome) {
tasks.push({ component: singleStepTask, props: { stepComponent: welcomeStep } });
tasks.push({
component: singleStepTask,
props: { stepComponent: welcomeStep }
});
}
// Add calibration task for each thing
@ -117,14 +122,17 @@ export default {
}
// Always include the final step
tasks.push({ component: singleStepTask, props: { stepComponent: finalStep } });
tasks.push({
component: singleStepTask,
props: { stepComponent: finalStep }
});
this.tasks = tasks;
},
show_if_needed: async function() {
// Check if the calibration modal is needed, and only show it if it is.
let thingsToCal = await this. check_things_needing_calibration()
let thingsToCal = await this.check_things_needing_calibration();
const needed = thingsToCal.length > 0;
// Check if this calibration wizard can actually do anything useful
@ -141,7 +149,7 @@ export default {
// Forces modal to show on button press
force_show: function() {
const allThings = Object.keys(this.availableCalibrationTasks);
this.resetData();
this.create_task_list(allThings, false);
this.show();
@ -181,8 +189,7 @@ export default {
if (this.taskIndex < this.tasks.length - 1) {
this.taskIndex = this.taskIndex + 1;
return true;
}
else {
} else {
this.hide();
}
}

View file

@ -39,7 +39,6 @@ Tasks can be divided into multiple steps.
</template>
<script>
export default {
name: "calibrationWizardTask",
@ -62,7 +61,7 @@ export default {
data() {
return {
stepIndex: this.startOnLast ? this.steps.length-1 : 0
stepIndex: this.startOnLast ? this.steps.length - 1 : 0
};
},
@ -74,7 +73,9 @@ export default {
return !this.first || this.stepIndex > 0;
},
nextButtonText() {
return this.final && this.stepIndex === this.steps.length - 1 ? "Finish" : "Next";
return this.final && this.stepIndex === this.steps.length - 1
? "Finish"
: "Next";
}
},
@ -102,5 +103,5 @@ export default {
}
}
}
}
};
</script>

View file

@ -13,8 +13,7 @@
</template>
<script>
export default {
name: "camCalibrationExplanation"
}
};
</script>

View file

@ -16,7 +16,7 @@
</template>
<script>
import stepTemplateWithStream from "../stepTemplateWithStream.vue"
import stepTemplateWithStream from "../stepTemplateWithStream.vue";
import cameraCalibrationSettings from "../../../tabContentComponents/settingsComponents/cameraSettingsComponents/cameraCalibrationSettings.vue";
export default {
@ -32,11 +32,10 @@ export default {
return `${this.$store.getters.baseUri}/camera/`;
}
}
}
};
</script>
<style scoped>
.action-button-container {
padding: 4px;
}

View file

@ -17,7 +17,7 @@ import cameraMainCalibrationStep from "./cameraCalibrationSteps/cameraMainCalibr
export default {
name: "cameraCalibrationTask",
components: {calibrationWizardTask},
components: { calibrationWizardTask },
props: {
// Standard calibrationWizardTask props below:
first: Boolean,
@ -31,11 +31,10 @@ export default {
data: function() {
return {
steps: [
{component: camCalibrationExplanation},
{component: cameraMainCalibrationStep},
{ component: camCalibrationExplanation },
{ component: cameraMainCalibrationStep }
]
};
}
}
};
</script>

View file

@ -18,7 +18,7 @@ import runCsmStep from "./csmSteps/runCsmStep.vue";
export default {
name: "cameraCalibrationTask",
components: {calibrationWizardTask},
components: { calibrationWizardTask },
props: {
// Standard calibrationWizardTask props below:
first: Boolean,
@ -32,12 +32,11 @@ export default {
data: function() {
return {
steps: [
{component: csmExplanation},
{component: focusStep},
{component: runCsmStep}
{ component: csmExplanation },
{ component: focusStep },
{ component: runCsmStep }
]
};
}
}
};
</script>

View file

@ -18,5 +18,5 @@
<script>
export default {
name: "csmExplanation"
}
};
</script>

View file

@ -4,29 +4,30 @@
Use the buttons below to bring the sample into focus.
</p>
<p>
You may also adjust the z position with <b>page up</b> and <b>page down</b>.
You may also adjust the z position with <b>page up</b> and
<b>page down</b>.
</p>
<template #below-stream>
<div class="action-button-container">
<action-button
class="moveZ"
thing="stage"
action="move_relative"
:button-primary="false"
:submit-data="{ x: 0, y: 0, z: -100}"
:submit-label="' - '"
:hideOnRun="false"
:can-terminate="false"
class="moveZ"
thing="stage"
action="move_relative"
:button-primary="false"
:submit-data="{ x: 0, y: 0, z: -100 }"
:submit-label="' - '"
:hideOnRun="false"
:can-terminate="false"
/>
<action-button
class="moveZ"
thing="stage"
action="move_relative"
:button-primary="false"
:submit-data="{ x: 0, y: 0, z: 100}"
:submit-label="'+'"
:can-terminate="false"
:hideOnRun="false"
class="moveZ"
thing="stage"
action="move_relative"
:button-primary="false"
:submit-data="{ x: 0, y: 0, z: 100 }"
:submit-label="'+'"
:can-terminate="false"
:hideOnRun="false"
/>
</div>
</template>
@ -34,7 +35,7 @@
</template>
<script>
import stepTemplateWithStream from "../stepTemplateWithStream.vue"
import stepTemplateWithStream from "../stepTemplateWithStream.vue";
import ActionButton from "../../../labThingsComponents/actionButton.vue";
export default {
name: "cameraMainCalibrationStep",
@ -43,24 +44,23 @@ export default {
stepTemplateWithStream,
ActionButton
}
}
};
</script>
<style scoped>
.action-button-container {
display: flex;
flex-direction: row; /* Stack vertically */
justify-content: center; /* Left align */
gap: 8px; /* Small space between buttons */
margin-top: 4px; /* Gap from image */
flex-direction: row; /* Stack vertically */
justify-content: center; /* Left align */
gap: 8px; /* Small space between buttons */
margin-top: 4px; /* Gap from image */
}
.moveZ >>> .uk-button.uk-width-1-1 {
line-height: 50px;
font-size: 50px !important;
height: 60px;
height: 60px;
padding-bottom: 46px;
margin: 0; /* Remove default margin */
margin: 0; /* Remove default margin */
width: 120px;
min-width: 80px;
}
</style>
</style>

View file

@ -12,7 +12,7 @@
</template>
<script>
import stepTemplateWithStream from "../stepTemplateWithStream.vue"
import stepTemplateWithStream from "../stepTemplateWithStream.vue";
import CSMCalibrationSettings from "../../../tabContentComponents/settingsComponents/CSMSettingsComponents/CSMCalibrationSettings.vue";
export default {
@ -28,11 +28,10 @@ export default {
return `${this.$store.getters.baseUri}/camera/`;
}
}
}
};
</script>
<style scoped>
.action-button-container {
padding: 4px;
}

View file

@ -1,17 +1,16 @@
<template>
<div>
<p>
<b>Calibration complete</b>
<b>Calibration complete</b>
</p>
<p>
Click Finish to return to your microscope.
Click Finish to return to your microscope.
</p>
</div>
</template>
<script>
export default {
name: "finalStep"
}
};
</script>

View file

@ -15,10 +15,13 @@ import calibrationWizardTask from "./calibrationWizardTask.vue";
export default {
name: "singleStepTask",
components: {calibrationWizardTask},
components: { calibrationWizardTask },
props: {
// This must be sent
stepComponent: Object,
stepComponent: {
type: Object,
required: true
},
// This is optional.
stepProps: {
type: Object,
@ -34,15 +37,13 @@ export default {
startOnLast: {
type: Boolean,
default: false
},
}
},
data: function() {
return {
steps: [
{component: this.stepComponent, props: this.stepProps}
]
steps: [{ component: this.stepComponent, props: this.stepProps }]
};
},
}
}
};
</script>

View file

@ -7,7 +7,6 @@
</template>
<script>
import miniStreamDisplay from "../../genericComponents/miniStreamDisplay.vue";
export default {
@ -16,7 +15,7 @@ export default {
components: {
miniStreamDisplay
}
}
};
</script>
<style scoped>

View file

@ -6,8 +6,8 @@
</b>
</p>
<p>
Your microscope will still function, however some functionality will
be limited, and image quality will likely suffer.
Your microscope will still function, however some functionality will be
limited, and image quality will likely suffer.
</p>
<p>
<b>Click Next to begin microscope calibration.</b>
@ -16,8 +16,7 @@
</template>
<script>
export default {
name: "welcomeStep"
}
};
</script>