HW16 fixed done

Dz16 js/Dz16js.html

@@ -183,6 +183,7 @@ footer{
     width: 100%;
     height: 100px;
 }
+
 </style>
 </head>
 

Dz16 js/index.js

@@ -412,6 +412,10 @@ const actionCartDelete = (good) => ({
 const actionCartClear = () => ({
     type: "CART_CLEAR"
 });
+const actionCartRemove = (good) =>({
+    type: "CART_REMOVE",
+    good
+})
 
 const actionFullLogin = (login, password) => async (dispatch) => {
     let token = await dispatch(actionLogin(login, password))
@@ -467,8 +471,17 @@ store.subscribe(() => {
             cards.innerHTML = `<h2>${name}</h2>
                                 <img src="${backendURL}/${images[0].url}"/>    
                                  <strong>Ціна ${price} грн</strong>                          
-                                 <a href="#/good/${_id}">Перейти</a> `;
+                                 <a href="#/good/${_id}">Перейти</a>
+                                 `;
             main.append(cards);
+            const batonchikMars = document.createElement("button")
+            batonchikMars.innerText = "Придбати" 
+            cards.append(batonchikMars)
+            
+
+            batonchikMars.onclick = () => {
+                store.dispatch(actionCartAdd({_id, name, price, images }))
+            }
 
 
 
@@ -481,10 +494,12 @@ store.subscribe(() => {
             // main.append(a)
             // main.append(p)
         }
+        
     }
 })
 
 
+
 store.subscribe(() => {
     const { goodByID } = store.getState().promise
     const [, route, _id] = location.hash.split('/')
@@ -503,12 +518,14 @@ store.subscribe(() => {
         var btn = document.getElementById('buy')
         btn.onclick = () => {
             store.dispatch(actionCartAdd(goodByID.payload))
-
+            
         }
+        
     }
 })
 
 
+
 const bPopupContent = document.createElement("div");
 const obertkaDlyaTovara = document.createElement("div")
 
@@ -534,13 +551,16 @@ store.subscribe(() => {
         const divDlyaKnopok = document.createElement("div")
         const plus = document.createElement("button")
         const minus = document.createElement("button")
+        const deletGoods = document.createElement('button')
         plus.innerText = "+"
         minus.innerText = "-"
+        deletGoods.innerText = "Видалити товар"
         tovar.append(name)
         tovar.append(price)
         tovar.append(countById)
         divDlyaKnopok.append(plus)
         divDlyaKnopok.append(minus)
+        divDlyaKnopok.append(deletGoods)
         tovar.append(divDlyaKnopok)
         name.innerHTML = good.name
         price.innerHTML = good.price
@@ -554,6 +574,11 @@ store.subscribe(() => {
         minus.onclick = () => {
             store.dispatch(actionCartDelete(good))
         }
+        deletGoods.onclick =() => {
+            store.dispatch(actionCartRemove(good))
+        }
+        
+
         
     }
         clearToCart.id = "clearToCart"
@@ -585,6 +610,8 @@ store.subscribe(() => {
             store.dispatch(orderHistory());
             
         }
+
+        korzina.innerHTML = "Кошик: "  + productCount
     })
 
 
@@ -652,22 +679,29 @@ store.subscribe(() => {
        
 
         for (let [key, value] of Object.entries(history.payload)) {
-            const { _id, createdAt, total, orderGoods } = value;
+            const { _id, good, createdAt, total, orderGoods } = value;
             const h2 = document.createElement("h2");
             h2.className = "h2History"
             const dateOfOrder = new Date(+createdAt);
-            h2.innerHTML = `${dateOfOrder.toLocaleDateString()} ${dateOfOrder.toLocaleTimeString()}
-                            Order ID: ${_id} от , c ${orderGoods.length} goods worth: ${total}`;
+            for( let {good,count} of orderGoods){
+            h2.innerHTML = `Дата: ${dateOfOrder.toLocaleDateString()} </br>
+                            Час:${dateOfOrder.toLocaleTimeString()} </br>
+                            Товар: ${good.name} </br>
+                            Кількість: ${count}</br>
+                            Ціна одного товару: ${good.price} </br>
+                            Загальна ціна: ${total}`;
                             bPopupContent.append(h2);
         
-            
+                            h2.style.border = "blue solid 2px" 
         }
+        
 
         if (Object.keys(history.payload).length == 0) {
             const p = document.createElement("p");
             p.innerHTML = "<p>Ще немає покупок</p>";
             card.append(p);
         }
+        }
 
        
     };

React Dz/my-app/src/App.js

@@ -30,8 +30,6 @@ const LoginForm = () => {
       )
 }
 
-
-
 const rootCats =[
   {
     'name': 'Tools'

React/React1/.vscode/settings.json

@@ -1,22 +0,0 @@
-{
-    "workbench.colorCustomizations": {
-        "activityBar.activeBackground": "#d6b672",
-        "activityBar.background": "#d6b672",
-        "activityBar.foreground": "#15202b",
-        "activityBar.inactiveForeground": "#15202b99",
-        "activityBarBadge.background": "#247b5f",
-        "activityBarBadge.foreground": "#e7e7e7",
-        "commandCenter.border": "#15202b99",
-        "sash.hoverBorder": "#d6b672",
-        "statusBar.background": "#caa14b",
-        "statusBar.foreground": "#15202b",
-        "statusBarItem.hoverBackground": "#af8733",
-        "statusBarItem.remoteBackground": "#caa14b",
-        "statusBarItem.remoteForeground": "#15202b",
-        "titleBar.activeBackground": "#caa14b",
-        "titleBar.activeForeground": "#15202b",
-        "titleBar.inactiveBackground": "#caa14b99",
-        "titleBar.inactiveForeground": "#15202b99"
-    },
-    "peacock.color": "#caa14b"
-}

React/React1/my-app

@@ -1 +0,0 @@
-Subproject commit 8860f4590894f3e953bacedf70ff6af846e19fbc