ALVINN/ALVINN_f7
1
0
Fork 0
Code Issues 8 Pull Requests Actions Packages Projects Releases 7 Wiki Activity

Add mini models to tech specs and improve styling (#142)

Browse Source 
Closes: #133

Signed-off-by: Justin Georgi <justin.georgi@gmail.com>

Reviewed-on: #142
This commit is contained in:
Justin Georgi
2024-03-24 08:06:28 -07:00
parent c16e44016b
commit f09180875a
1 changed files with 22 additions and 6 deletions
Download Patch File Download Diff File Expand all files Collapse all files

28
src/pages/specs.vue
View File

@@ -3,7 +3,7 @@
<f7-navbar :sliding="false" back-link="Back"> <f7-navbar :sliding="false" back-link="Back">
<f7-nav-title sliding>Tech Specs</f7-nav-title> <f7-nav-title sliding>Tech Specs</f7-nav-title>
</f7-navbar> </f7-navbar>
<f7-block style="display: flex; flex-direction: column; align-items: center;"> <f7-block style="display: flex; flex-direction: column; align-items: stretch;">
<div style="display: flex; flex-direction: column; align-items: center;"> <div style="display: flex; flex-direction: column; align-items: center;">
<f7-block-title medium>Details</f7-block-title> <f7-block-title medium>Details</f7-block-title>
<f7-list> <f7-list>
@@ -11,7 +11,8 @@
</f7-list> </f7-list>
<f7-block-title medium>Models</f7-block-title> <f7-block-title medium>Models</f7-block-title>
<f7-list style="width: 100%;"> <f7-list style="width: 100%;">
<f7-list-item title="Thorax" :after="thoraxDetails.version"></f7-list-item> <f7-list-item :class="otherSettings.mini ? 'unused-model' : ''" title="Thorax" :after="thoraxDetails.version"></f7-list-item>
<f7-list-item title="Thorax-m" :after="miniThoraxDetails.version"></f7-list-item>
<f7-list-item title="Abdomen/Pelvis" :after="abdomenDetails.version"></f7-list-item> <f7-list-item title="Abdomen/Pelvis" :after="abdomenDetails.version"></f7-list-item>
<f7-list-item title="Limbs" :after="limbsDetails.version"></f7-list-item> <f7-list-item title="Limbs" :after="limbsDetails.version"></f7-list-item>
<f7-list-item title="Head/Neck" :after="headneckDetails.version"></f7-list-item> <f7-list-item title="Head/Neck" :after="headneckDetails.version"></f7-list-item>
@@ -21,6 +22,15 @@
</f7-page> </f7-page>
</template> </template>
<style>
.unused-model {
opacity: .75;
}
.unused-model .item-title {
color: var(--f7-list-item-after-text-color)
}
</style>
<script> <script>
import store from '../js/store' import store from '../js/store'
@@ -28,9 +38,10 @@
data () { data () {
return { return {
thoraxDetails: {}, thoraxDetails: {},
abdomenDetails: { "version": "Model not available" }, miniThoraxDetails: {},
limbsDetails: { "version": "Model not available" }, abdomenDetails: { "version": "N/A" },
headneckDetails: { "version": "Model not available" }, limbsDetails: { "version": "N/A" },
headneckDetails: { "version": "N/A" },
alvinnVersion: store().getVersion, alvinnVersion: store().getVersion,
otherSettings: {} otherSettings: {}
} }
@@ -41,10 +52,15 @@
created () { created () {
var loadOtherSettings = localStorage.getItem('otherSettings') var loadOtherSettings = localStorage.getItem('otherSettings')
if (loadOtherSettings) this.otherSettings = JSON.parse(loadOtherSettings) if (loadOtherSettings) this.otherSettings = JSON.parse(loadOtherSettings)
import(`../models/thorax${this.otherSettings.mini ? '-mini' : ''}/descript.json`) import('../models/thorax/descript.json')
.then((mod) => { .then((mod) => {
this.thoraxDetails = mod.default this.thoraxDetails = mod.default
}) })
import('../models/thorax-mini/descript.json')
.then((mod) => {
this.miniThoraxDetails = mod.default
})
}, },
methods: { methods: {
} }