btwedutech/hoppscotch
5
0
Fork 0
Code Issues Pull Requests Packages Projects Releases 6 Wiki Activity

Fixed tab switch

Browse Source
This commit is contained in:
Liyas Thomas
2020-03-08 09:11:25 +05:30
parent 799c650f32
commit 995e0c6c51
1 changed files with 25 additions and 23 deletions
Download Patch File Download Diff File Expand all files Collapse all files

48
pages/graphql.vue
View File

@@ -261,30 +261,32 @@
<aside class="sticky-inner inner-right"> <aside class="sticky-inner inner-right">
<pw-section class="purple" :label="$t('docs')" ref="docs"> <pw-section class="purple" :label="$t('docs')" ref="docs">
<section> <section>
<tabs> <tabs ref="gqlTabs">
<tab v-if="queryFields.length > 0" :name="$t('queries')" :selected="true"> <div class="gqlTabs">
<div v-for="field in queryFields" :key="field.name"> <tab v-if="queryFields.length > 0" :name="$t('queries')" :selected="true">
<gql-field :gqlField="field" :jumpTypeCallback="handleJumpToType" /> <div v-for="field in queryFields" :key="field.name">
</div> <gql-field :gqlField="field" :jumpTypeCallback="handleJumpToType" />
</tab> </div>
</tab>
<tab v-if="mutationFields.length > 0" :name="$t('mutations')"> <tab v-if="mutationFields.length > 0" :name="$t('mutations')">
<div v-for="field in mutationFields" :key="field.name"> <div v-for="field in mutationFields" :key="field.name">
<gql-field :gqlField="field" :jumpTypeCallback="handleJumpToType" /> <gql-field :gqlField="field" :jumpTypeCallback="handleJumpToType" />
</div> </div>
</tab> </tab>
<tab v-if="subscriptionFields.length > 0" :name="$t('subscriptions')"> <tab v-if="subscriptionFields.length > 0" :name="$t('subscriptions')">
<div v-for="field in subscriptionFields" :key="field.name"> <div v-for="field in subscriptionFields" :key="field.name">
<gql-field :gqlField="field" :jumpTypeCallback="handleJumpToType" /> <gql-field :gqlField="field" :jumpTypeCallback="handleJumpToType" />
</div> </div>
</tab> </tab>
<tab v-if="gqlTypes.length > 0" :name="$t('types')"> <tab v-if="gqlTypes.length > 0" :name="$t('types')" ref="typesTab">
<div v-for="type in gqlTypes" :key="type.name" :id="`type_${type.name}`"> <div v-for="type in gqlTypes" :key="type.name" :id="`type_${type.name}`">
<gql-type :gqlType="type" :jumpTypeCallback="handleJumpToType" /> <gql-type :gqlType="type" :jumpTypeCallback="handleJumpToType" />
</div> </div>
</tab> </tab>
</div>
</tabs> </tabs>
</section> </section>
@@ -306,7 +308,7 @@
</template> </template>
<style scoped lang="scss"> <style scoped lang="scss">
.tab { .gqlTabs {
max-height: calc(100vh - 186px); max-height: calc(100vh - 186px);
overflow: auto; overflow: auto;
} }
@@ -427,7 +429,7 @@ export default {
this.$refs.queryEditor.prettifyQuery() this.$refs.queryEditor.prettifyQuery()
}, },
handleJumpToType(type) { handleJumpToType(type) {
// TODO: switch to gqltypes tab this.$refs.gqlTabs.selectTab(this.$refs.typesTab)
const rootTypeName = this.resolveRootType(type).name const rootTypeName = this.resolveRootType(type).name