github.com/covergates/covergates@v0.2.2-0.20201009050117-42ef8a19fb95/web/src/components/ReportSetting.vue (about) 1 <template> 2 <v-tabs :vertical="verticalTabs" class="mt-1" slider-color="accent"> 3 <v-tab class="accent--text"> 4 <v-icon left>mdi-cog</v-icon>General 5 </v-tab> 6 <v-tab class="accent--text"> 7 <v-icon left>mdi-key</v-icon>Tokens 8 </v-tab> 9 10 <v-tab-item> 11 <setting-general /> 12 </v-tab-item> 13 <v-tab-item> 14 <setting-tokens /> 15 </v-tab-item> 16 </v-tabs> 17 </template> 18 19 <script lang="ts"> 20 import { Component } from 'vue-property-decorator'; 21 import Vue from '@/vue'; 22 import SettingGeneral from '@/components/SettingGenertal.vue'; 23 import SettingTokens from '@/components/SettingTokens.vue'; 24 25 @Component({ 26 name: 'report-setting', 27 components: { 28 SettingGeneral, 29 SettingTokens 30 } 31 }) 32 export default class ReportSetting extends Vue { 33 get verticalTabs(): boolean { 34 switch (this.$vuetify.breakpoint.name) { 35 case 'xs': 36 return false; 37 38 case 'sm': 39 return false; 40 41 default: 42 return true; 43 } 44 } 45 } 46 </script>