skillbox/client/src/pages/test.vue

78 lines
1.2 KiB
Vue

<template>
<div>
<button @click="makeQuery">Normal Query</button>
<pre>
{{ module }}
</pre>
</div>
</template>
<script>
import gql from 'graphql-tag';
// import MODULE_DETAILS_QUERY from '@/graphql/gql/moduleDetailsQuery.gql';
// import MODULE_PARTS from '@/graphql/gql/fragments/moduleParts.gql';
const moduleParts = gql`
fragment ModuleParts on ModuleNode {
id
title
}
`;
const moduleQuery = gql`
${moduleParts}
query ModuleQuery {
module(slug: "lohn-und-budget") {
...ModuleParts
}
}
`;
const moduleAndObjectivesQuery = gql`
${moduleParts}
query ModuleQuery {
module(slug: "lohn-und-budget") {
...ModuleParts
objectiveGroups {
edges {
node {
id
}
}
}
}
}
`;
export default {
data() {
return {
objectiveGroups: {},
module: {},
};
},
methods: {
makeQuery() {
console.log('click');
this.$apollo.query({query: moduleQuery});
},
},
apollo: {
// me: ME_QUERY
// objectiveGroups: gql,
module: moduleAndObjectivesQuery,
},
};
</script>
<style scoped lang="scss">
@import '~styles/helpers';
</style>