Jump to content

patricktsg

Members
  • Content Count

    27
  • Joined

  • Last visited

Community Reputation

28 Excellent

About patricktsg

  • Rank
    Jr. Member

Recent Profile Visitors

The recent visitors block is disabled and is not being shown to other users.

  1. Hi Folks, We've soft launched a client's site, https://canadia.ie Short summary of ingredients: UIKit based UI Some Vue.js sprinkles: Axios, GrahpQl, lot of methods for the product filtering Usual arsenal of PW modules like AOIM, AllInOneSeo, AutoSmush LeafletMaps, etc DO Server + a new tool 'RunCloud' to handle server config and the time consuming bits like SSL, DB setup etc Considering we only rolled to production today for the soft launch the site is very fast - especially filtering products, it's by far running 20x faster than the staging server. I'll post a more detailed update once we have finished fine tuning and installing any other post production modules.
  2. I've turned on nearly every field in the module setting now and still no joy unless I tick those Template and Field access checkboxes
  3. // Build the query passing in the filters productQuery: function(args) { const PARAMS = args; var data = { query: ` query Products { product_single (s: ${PARAMS}) { list { title httpUrl product_code body_plain_text body product_primary_thumb { httpUrl size(width: 800, height: 600) { httpUrl } } } getTotal } } ` } return data; }, FYI: The {PARAMS} part is where I am taking in some vue object data from checkboxes, I set some default params through PHP. I then use axios post like so // Axios request the products fetchProducts: function () { console.log('Get Products...'); this.loading = true; var data = this.productQuery(this.filters); axios.post("someendpoint.dev/graphql/", data) .then((response) => { console.log(response.data); ... ... ...
  4. If I enabled the bottom two check it works...
  5. I think I have the correct fields on / enabled and templates in the module settings but when not logged in I get that item.X related error in console the minute it hits the first item reference in my v-for loop, when I look at the conole where I am logging the response from the GraphQl endpoint it is not showing the data array, <div v-for="(item,index) in products.list" :key="index"> <div class="uk-card uk-card-default uk-card-small"> <div class="uk-card-media-top uk-animation-toggle"> <div class="uk-overflow-hidden"> <a :href="item.httpUrl"> <div v-if="item.product_primary_thumb.length"> <img class="uk-animation-kenburns" :src="item.product_primary_thumb[0].size.httpUrl" :alt="item.title"> </div> <div v-else> <img class="uk-animation-kenburns" src="<?=$config->urls->templates?>/img/placeholder.jpg" :alt="item.title"> </div> </a> </div> </div> <div class="uk-card-header"> <h4 class="uk-card-title uk-text-small uk-text-uppercase"> {{item.title}} </h4> </div> <div class="uk-card-body"> {{item.product_code}} <i class="fas fa-info-circle pull-right mimic-link" @click="focusProduct(item)" uk-toggle="target: #quickview"></i> </div> </div> </div> If I remove the above from my code so the error does not block the rest of the load I get null returned for all the product data from the GraphQL endpoint (in a browser I'm not logged into the admin with), seems that unless logged in it's not permitting the correct response.
  6. I have httpUrl as a legal field but I get an error when trying to access this field in my page (using Vue) when not logged in When I am logged in this error does not occur and the page rendering works fine. Is this a bug on the legal field?
  7. I've figured this out after some trail and error - new to GraphQL in vue so what I did was create a const that looks at this.filters than use that in my query like this: The important part is using ${yourvar} inside the `` enclosed query myQuery: function(args) { console.log('Build query', args); const PARAMS = args; console.log('const', PARAMS); var data = { query: ` query Products { product_single (s: ${PARAMS}) { list { title product_code product_primary_thumb { httpUrl } } } } ` } return data; }, // Axios request the products fetchProducts: function () { console.log('Get Products...'); this.loading = true; var data = this.myQuery(this.filters); axios.post("http:/yourendpoint.local/graphql/", data) .then((response) => { console.log(response); this.products = response.data.data.product_single; // dig deep to target the list data make template cleaner this.loading = false; }, (error) => { this.loading = false; }) } I could probably merge this back into the one get function the reason I split it was to try and get an arg passing when I was doing the trial and error.
  8. Ok I figured that out, just pass limit=x into the s: I'm trying to build a list of filters from checkboxes and pass them into the s: for example- below how would you pass the pf_shade value into here? { product_single (s: "pf_shade=dark,limit=1") { list { title product_code product_primary_thumb { httpUrl } } } }
  9. How would one go about limiting results in the s: selector query and also paginate?
  10. Sorted! thanks, I had not enabled the options page doh!
  11. Thanks for getting back to me - tried that code but I just get an empty array for the list { "data": { "product_single": { "list": [ { "title": "Widget", "product_code": "12345", "colour": { "getTotal": 1, "getLimit": 0, "getStart": 0, "list": [] } } ] } } }
  12. How do you get the name of Pages from a Page Reference field? I have one called 'colors' and it only lets me get the following total, limit, start - no means to get colors -> name or title? { product_single (s: "parent=X") { list { title product_code colors { getTotal getLimit getStart } } } }
  13. It's in vogue at the moment I used the vue.js component for it but here is the script for the plugin: https://mattboldt.com/demos/typed-js/
  14. Thanks Dave - I will do some reading into that and play around on a DO Droplet to benchmark.
×
×
  • Create New...