Archives/device-epd
2
0
Fork 0
mirror of https://github.com/paperdash/device-epd.git synced 2024-11-10 07:10:32 +00:00
Code Issues Projects Releases Wiki Activity

refactor country setup page to use setup panel component

Browse Source
This commit is contained in:
Thomas Ballmann 2021-02-07 10:02:43 +01:00
parent 223c89fff7
commit aeb36b69dc
1 changed files with 56 additions and 78 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

58
app/src/views/Setup/Country.vue
View File

@ -1,38 +1,23 @@
<template> <template>
<v-container <setup-panel
class="_fill-height" back
fluid @back="stepBack"
> >
<div> <template #icon>
<v-btn $language
text </template>
color="primary"
class="px-0" <template #headline>
@click="stepBack" <template v-if="currentStep === 0">
> Select Your Country or Region
<v-icon>$prev</v-icon> </template>
Back <template v-else-if="currentStep === 1">
</v-btn> Select Your Timezone
</div> </template>
</template>
<v-row
no-gutters
justify="center"
>
<v-col
lg="5"
md="6"
sm="8"
>
<template v-if="currentStep === 0"> <template v-if="currentStep === 0">
<!-- country --> <!-- country -->
<v-card flat>
<v-card-title
class="display-1 font-weight-bold mb-12 px-0 justify-center text-center"
>
Select Your Country or Region
</v-card-title>
<v-list class="pa-0"> <v-list class="pa-0">
<template v-for="(country, code) in availableCountries"> <template v-for="(country, code) in availableCountries">
<div :key="code"> <div :key="code">
@ -52,15 +37,10 @@
</div> </div>
</template> </template>
</v-list> </v-list>
</v-card>
</template> </template>
<template v-else-if="currentStep === 1"> <template v-else-if="currentStep === 1">
<!-- timezone if needed --> <!-- timezone if needed -->
<v-card flat>
<v-card-title class="display-1 font-weight-bold mb-12 px-0 justify-center text-center">
Select Your Timezone
</v-card-title>
<v-list class="pa-0"> <v-list class="pa-0">
<template v-for="(zone, i) in availableTimeZones"> <template v-for="(zone, i) in availableTimeZones">
@ -81,20 +61,18 @@
</template> </template>
<v-divider /> <v-divider />
</v-list> </v-list>
</v-card>
</template> </template>
</v-col> </setup-panel>
</v-row>
</v-container>
</template> </template>
<script> <script>
import { mapState, mapActions, mapMutations } from 'vuex' import { mapState, mapActions, mapMutations } from 'vuex'
// import apiDevice from '@/api/device'
import { countries } from 'countries-list' import { countries } from 'countries-list'
import timezones from 'countries-and-timezones' import timezones from 'countries-and-timezones'
import SetupPanel from '@/components/Setup/BasePanel'
export default { export default {
components: { SetupPanel },
data: () => ({ data: () => ({
currentStep: 0, currentStep: 0,