Add enabled regions to store (#93)
Closes: #91 Signed-off-by: Justin Georgi <justin.georgi@gmail.com> Reviewed-on: Georgi_Lab/ALVINN_f7#93
This commit is contained in:
@@ -1,7 +1,8 @@
|
||||
import { reactive, computed } from 'vue';
|
||||
|
||||
const state = reactive({
|
||||
disclaimerAgreement: false
|
||||
disclaimerAgreement: false,
|
||||
enabledRegions: ['thorax','abdomen','limbs']
|
||||
})
|
||||
|
||||
const agree = () => {
|
||||
@@ -10,5 +11,6 @@ const agree = () => {
|
||||
|
||||
export default () => ({
|
||||
isAgreed: computed(() => state.disclaimerAgreement),
|
||||
getRegions: computed(() => state.enabledRegions),
|
||||
agree
|
||||
})
|
||||
|
||||
@@ -63,16 +63,16 @@
|
||||
|
||||
<f7-popover id="region-popover" class="popover-button-menu">
|
||||
<f7-segmented raised class="segment-button-menu">
|
||||
<f7-button style="height: auto; width: auto;" href="/detect/thorax/" popover-close="#region-popover">
|
||||
<f7-button :class="(getRegions.includes('thorax')) ? '' : ' disabled'" style="height: auto; width: auto;" href="/detect/thorax/" popover-close="#region-popover">
|
||||
<RegionIcon :region="0" />
|
||||
</f7-button>
|
||||
<f7-button style="height: auto; width: auto;" href="/detect/abdomen/" popover-close="#region-popover">
|
||||
<f7-button :class="(getRegions.includes('abdomen')) ? '' : ' disabled'" style="height: auto; width: auto;" href="/detect/abdomen/" popover-close="#region-popover">
|
||||
<RegionIcon :region="1" />
|
||||
</f7-button>
|
||||
<f7-button style="height: auto; width: auto;" href="/detect/limbs/" popover-close="#region-popover">
|
||||
<f7-button :class="(getRegions.includes('limbs')) ? '' : ' disabled'" style="height: auto; width: auto;" href="/detect/limbs/" popover-close="#region-popover">
|
||||
<RegionIcon :region="2" />
|
||||
</f7-button>
|
||||
<f7-button class="disabled" style="height: auto; width: auto;" href="/detect/head/" popover-close="#region-popover">
|
||||
<f7-button :class="(getRegions.includes('head')) ? '' : ' disabled'" style="height: auto; width: auto;" href="/detect/head/" popover-close="#region-popover">
|
||||
<RegionIcon :region="3" />
|
||||
</f7-button>
|
||||
</f7-segmented>
|
||||
@@ -281,6 +281,7 @@
|
||||
<script>
|
||||
import { f7 } from 'framework7-vue'
|
||||
|
||||
import store from '../js/store'
|
||||
import RegionIcon from '../components/region-icon.vue'
|
||||
import SvgIcon from '../components/svg-icon.vue'
|
||||
|
||||
@@ -316,6 +317,9 @@
|
||||
uploadDirty: false
|
||||
}
|
||||
},
|
||||
setup() {
|
||||
return store()
|
||||
},
|
||||
created () {
|
||||
switch (this.f7route.params.region) {
|
||||
case 'thorax':
|
||||
|
||||
@@ -13,20 +13,16 @@
|
||||
<h4 style="text-align: center; margin: 0;">Veterinary Anatomy Edition</h4>
|
||||
<p style="text-align: center; margin: 0;">Select a region to begin.</p>
|
||||
<div class="region-grid">
|
||||
<!--</f7-button><f7-button :class="`region-button thorax`" :href="'/detect/thorax/'">-->
|
||||
<f7-button :class="`region-button thorax${isAgreed ? '' : ' disabled'}`" :href="isAgreed && '/detect/thorax/'">
|
||||
<f7-button :class="`region-button thorax${isAgreed && getRegions.includes('thorax') ? '' : ' disabled'}`" :href="isAgreed && getRegions.includes('thorax') && '/detect/thorax/'">
|
||||
<RegionIcon class="region-image" :region="0" />
|
||||
</f7-button>
|
||||
<!--<f7-button :class="`region-button abdomen${siteSettings.siteAgreement ? '' : ' disabled'}`" :href="siteSettings.siteAgreement && '/detect/abdomen/'">-->
|
||||
<f7-button :class="`region-button abdomen${isAgreed ? '' : ' disabled'}`" :href="isAgreed && '/detect/abdomen/'">
|
||||
<f7-button :class="`region-button abdomen${isAgreed && getRegions.includes('abdomen') ? '' : ' disabled'}`" :href="isAgreed && getRegions.includes('abdomen') && '/detect/abdomen/'">
|
||||
<RegionIcon class="region-image" :region="1" />
|
||||
</f7-button>
|
||||
<!--<f7-button :class="`region-button limbs${siteSettings.siteAgreement ? '' : ' disabled'}`" :href="siteSettings.siteAgreement && '/detect/limbs/'">-->
|
||||
<f7-button :class="`region-button limbs${isAgreed ? '' : ' disabled'}`" :href="isAgreed && '/detect/limbs/'">
|
||||
<f7-button :class="`region-button limbs${isAgreed && getRegions.includes('limbs') ? '' : ' disabled'}`" :href="isAgreed && getRegions.includes('limbs') && '/detect/limbs/'">
|
||||
<RegionIcon class="region-image" :region="2" />
|
||||
</f7-button>
|
||||
<!--<f7-button class="region-button headneck disabled" :href="siteSettings.siteAgreement && '/detect/head/'">-->
|
||||
<f7-button class="region-button headneck disabled" :href="'/detect/head/'">
|
||||
<f7-button :class="`region-button headneck${isAgreed && getRegions.includes('head') ? '' : ' disabled'}`" :href="isAgreed && getRegions.includes('head') && '/detect/head/'">
|
||||
<RegionIcon class="region-image" :region="3" />
|
||||
</f7-button>
|
||||
</div>
|
||||
|
||||
Reference in New Issue
Block a user