|
|
@@ -0,0 +1,48 @@
|
|
|
+<!DOCTYPE html>
|
|
|
+<html>
|
|
|
+<head>
|
|
|
+ <meta charset="utf-8">
|
|
|
+ <title>GraphQL</title>
|
|
|
+</head>
|
|
|
+<body>
|
|
|
+
|
|
|
+ <script>
|
|
|
+ const gql=(url,query, variables)=>fetch(url, {method:"POST",headers:{'content-type':'application/json'}, body: JSON.stringify({query,variables})}).then(res=>res.json());
|
|
|
+
|
|
|
+ (async ()=>{
|
|
|
+ let data=await gql("http://shop-roles.asmer.fs.a-level.com.ua/graphql", `query cats($q:String){
|
|
|
+ CategoryFind(query:$q){
|
|
|
+ name goods{
|
|
|
+ name images{
|
|
|
+ url
|
|
|
+ }
|
|
|
+ }
|
|
|
+ }
|
|
|
+ }`, {q: "[{}]"});
|
|
|
+ console.log(data);
|
|
|
+ console.log(data.data)
|
|
|
+ let div = document.createElement('div');
|
|
|
+ for (const key in data.data) {
|
|
|
+ for(let keys of data.data[key]){
|
|
|
+ let p = document.createElement('h3');
|
|
|
+ p.innerHTML=keys.name;
|
|
|
+ div.append(p);
|
|
|
+ if(Array.isArray(keys.goods)){
|
|
|
+ for(let i of keys.goods){
|
|
|
+ let p2=document.createElement('p');
|
|
|
+ p2.style.marginLeft=50+'px';
|
|
|
+ p2.innerHTML=' - '+i.name;
|
|
|
+ div.append(p2);
|
|
|
+ }
|
|
|
+ }else{
|
|
|
+ let p2=document.createElement('p');
|
|
|
+ p2.innerHTML=' - '+keys.goods;
|
|
|
+ }
|
|
|
+ }
|
|
|
+ }
|
|
|
+ document.body.append(div);
|
|
|
+ })();
|
|
|
+
|
|
|
+ </script>
|
|
|
+</body>
|
|
|
+</html>
|
