Sfoglia il codice sorgente

added register, redoned login, added dasboard but have some problems, fixed button for buying from category and cart count

kurkabein 2 anni fa
parent
commit
6c6e38eb14
1 ha cambiato i file con 114 aggiunte e 23 eliminazioni
  1. 114 23
      GraphQl_and_updated_redux/main.js

+ 114 - 23
GraphQl_and_updated_redux/main.js

@@ -285,6 +285,7 @@ const actionPromise = (name,promise) =>
             }
         }
 const actionAuthLogin = (tokennn) => ({type:'AUTH_LOGIN',token:tokennn})
+
 const actionRootCats = () => 
         actionPromise('rootCats', gql(`query {
             CategoryFind(query: "[{\\"parent\\":null}]"){
@@ -311,18 +312,32 @@ const actionGoodById = (_id) =>
               description
             }
           }`,{goodId: JSON.stringify([{_id}])}))
-const actionFullRegister = (login,password) =>
+const actionFullRegister = (Login,password) =>
           actionPromise('fullRegister', gql(`mutation register($Login:String,$password:String){
             UserUpsert(user:{login:$Login,password:$password}){
               _id login
             }
-          }`,{login: login, Password: password}))
-const actionFullLogin = (Login,password) => 
-          actionPromise('fullLogin', gql(`query login($Login:String,$password:String){
-            login(login:$Login,password:$password)
-        }`,{Login:Login,password:password}))
+          }`,{Login: Login, password: password}))
+
+const actionFullLogin = (Login,password) => async (dispatch) => {
+   const tokennn = await dispatch(
+    actionPromise('fullLogin', gql(`query login($Login:String,$password:String){
+        login(login:$Login,password:$password)
+    }`,{Login:Login,password:password}))
+   );
+   await dispatch(actionAuthLogin(tokennn)); 
+}
 
-    store.dispatch(actionRootCats())
+const actionAllOrders = () => 
+        actionPromise('allOrders',gql(`query orders{
+            OrderFind(query:"[{}]"){
+              _id total
+              orderGoods{
+                count total good{name}
+              }
+            }
+          }`))
+store.dispatch(actionRootCats())
     
 store.subscribe(() => {
         const {promise:{rootCats}} = store.getState()
@@ -362,23 +377,49 @@ window.onhashchange = () => {
                         logButton.addEventListener('click', function Login(){
                             console.log(login.value, password.value);
                             store.dispatch(actionFullLogin(login.value, password.value))
-                            store.dispatch(actionAuthLogin(store.getState().promise.fullLogin.payload))
+                            store.getState();
+                           /*  store.dispatch(actionAuthLogin(store.getState().promise.fullLogin.payload))
+                            store.getState(); */
                         })
+
                                 }
                 
                 /* }) */
                 //по кнопке - store.dispatch(actionFullLogin(login, password))
             },
             register(){
+                const [,route,id] = location.hash.split('/');
+                if(route === 'register'){
+                    main.innerHTML = `<h1>Register</h1>`
+                    let registerForm = document.createElement('div');
+                    /* registerForm.innerHTML = `<label>login <input id="login"></label>
+                                              <label>password <input id="password" type="paasword"></label>
+                                              <button id="registerButton">Register</button>` */
+                    let labelLog = document.createElement('label');
+                    labelLog.innerText = 'login';
+                    let login = document.createElement('input');
+                    labelLog.append(login);
+                    let labelPswd = document.createElement('label');
+                    labelPswd.innerText = 'Password';
+                    let password = document.createElement('input');
+                    password.type = 'password';
+                    labelPswd.append(password);
+                    let registerButton = document.createElement('button');
+                    registerButton.innerText = 'Register';
+                    registerForm.append(labelLog);
+                    registerForm.append(labelPswd);
+                    registerForm.append(registerButton);                         
+                    main.append(registerForm);
+                    registerButton.addEventListener('click', function register(){
+                        console.log(login.value, password.value);
+                        store.dispatch(actionFullRegister(login.value, password.value))
+                    })
+                }
                 //отрисовка тут
                 //по кнопке - store.dispatch(actionFullRegister(login, password))
             },
             dashboard(){
-                const[,route,id] = location.hash.split('/')
-                if(route === 'dashboard'){
-                    main.innerHTML = `<h1>Dashboard</h1>`
-
-                }
+                store.dispatch(actionAllOrders());
             },
             cart(){
                 const[,route,id] = location.hash.split('/')
@@ -428,7 +469,7 @@ window.onhashchange = () => {
                     removeBtn.onclick = () => {
                         store.dispatch(actionCartDelete(cart[good].good))
                         window.onhashchange()
-                        cartIcon.innerHTML = `Cart`
+                        cartIcon.innerHTML = `Cart ${cart[good].count}`
                     }
                     goods.append(img);
                     goods.append(name);
@@ -455,14 +496,35 @@ store.subscribe(() => {
         main.innerHTML = `<h1>${name}</h1> TYT PODCATEGORII`;
         for(const {_id,name,price,images} of catById.payload.goods){
             const card = document.createElement('div')
-            card.innerHTML = `<h2>${name}</h2>
+            /* card.innerHTML = `<h2>${name}</h2>
                             <img src="${backendURL}/${images[0].url}">
                             <strong>${price}UAH</strong>
                             <a href="#/good/${_id}">ссылка на товарчик</a>
                             <button id="buyGood">Купить</button>
             
-            `
-        main.append(card);
+            ` */   
+          let named = document.createElement('h2');
+          named.innerText = `${name}`;
+          let imaged = document.createElement('img');
+          imaged.src = `${backendURL}/${images[0].url}`;
+          let priced = document.createElement('strong');
+          priced.innerText = `${price}`;
+          let link = document.createElement('a');
+          link.href = `#/good/${_id}`;
+          link.innerText = 'ссылка на товарчик';
+          let buttonBuy = document.createElement('button');
+          buttonBuy.innerText = 'Купить';
+          buttonBuy.onclick = () => {
+              store.dispatch(actionGoodById(_id));
+              store.dispatch(actionCartAdd({_id,name,price,images}));   
+          }
+          card.append(named);
+          card.append(imaged);
+          card.append(priced);
+          card.append(link);
+          card.append(buttonBuy);
+
+          main.append(card);
         }
     }
 })
@@ -493,16 +555,45 @@ store.subscribe(() => {
     const orders = store.getState().cart;
     for (let order in orders){
         counts += orders[order].count
-        cartIcon.innerHTML = `Cart ${counts}`
-        if(orders === {}){
-            console.log('donned');
-            counts = 0;
+        cartIcon.innerHTML = `<a href="#/cart">Cart ${counts}</a>`
+        /* if(!orders[order].count){
             cartIcon.innerHTML = `Cart ${counts}`
-        }
+        } */
     }
 
 })
-
+store.subscribe(() => {
+                const[,route,id] = location.hash.split('/')
+                const {promise: {allOrders}} = store.getState();
+                if(route === 'dashboard'){
+                    main.innerHTML = `<h1>Dashboard</h1>`
+                    for(const{_id,total,orderGoods} of allOrders.payload){
+                       let order = document.createElement('div');
+                       let idOfOrder = document.createElement('h2');
+                       idOfOrder.innerText = `${_id}`;
+                       let totalCost = document.createElement('label');
+                       totalCost.innerText = `${total}`
+                       order.append(idOfOrder);
+                       order.append(totalCost);
+                       for(const{count,good,totall} of orderGoods){
+                           let card = document.createElement('div');
+                           let counted = document.createElement('label');
+                           counted.innerHtml = `${count}`
+                           let totaled = document.createElement('label');
+                           totaled.innerHtml = `${totall}`
+                           let name = document.createElement('h2');
+                           name.innerText = `${good.name}`
+                           card.append(count);
+                           card.append(total);
+                           card.append(name);
+                           order.append(card);
+                       }
+                       
+                       
+                        main.append(order);         
+                    }
+                }
+})
     let token = 'eyJhbGciOiJIUzI1NiIsInR5cCI6IkpXVCJ9.eyJzdWIiOnsiaWQiOiI2MWJiNjNjOWM3NTBjMTJiYTZiYTRiMzgiLCJsb2dpbiI6IkFub24iLCJhY2wiOlsiNjFiYjYzYzljNzUwYzEyYmE2YmE0YjM4IiwidXNlciJdfSwiaWF0IjoxNjQwMjAwNTU2fQ.P_JXFko7OFObxVn8uB6TR3R1V9aB1MMQrgX58MpEq5E';
     /* store.dispatch(actionPromise('delay1000', delay(1000)))
     store.dispatch(actionPromise('delay2000', delay(2000))) */