Viktor97 1 rok pred
commit
79a55ef364
2 zmenil súbory, kde vykonal 134 pridanie a 0 odobranie
  1. 36 0
      index.html
  2. 98 0
      index.js

+ 36 - 0
index.html

@@ -0,0 +1,36 @@
+<!DOCTYPE html>
+<html lang="en">
+<head>
+    <meta charset="UTF-8">
+    <meta http-equiv="X-UA-Compatible" content="IE=edge">
+    <meta name="viewport" content="width=device-width, initial-scale=1.0">
+    <title>Document</title>
+
+</head>
+<body>
+    
+<div>
+    <p id="Sigi"></p>
+    <p id="Chips"></p>
+    <p id="Beer"></p>
+</div>
+
+<div>
+    <input type="number" id="input">
+<select name="sele" id="Select"> 
+    <option value="сиги">Сиги</option>
+    <option value="чипсы">Чипсы</option>
+    <option value="пиво">Пиво</option>
+ </select> 
+    <button id="button"> Купить </button>
+ 
+    <input type="number" id="Kasa">
+    <p id="sdacha">Ваша сдача</p>
+    <p id="Kassa"> Касса</p>
+</div>
+
+
+
+<script src="index.js">  </script>
+</body>
+</html>

+ 98 - 0
index.js

@@ -0,0 +1,98 @@
+let sigi = document.getElementById("Sigi")
+let chips = document.getElementById("Chips")
+let beer = document.getElementById("Beer")
+let button = document.getElementById("button")
+let input =  document.getElementById("input")
+let select = document.getElementById("Select")
+let bablo = document.getElementById("Kasa")
+let sdacha = document.getElementById("sdacha")
+let kasa = document.getElementById("Kassa")
+
+
+function reducer(state, {type, ШО, СКОКА, БАБЛО}){ //объект action деструктуризируется на три переменных
+    if (!state){ //начальная уборка в ларьке:
+        return {
+            пиво: {
+                Сколько: 100,
+                Цена: 30,
+            },
+            чипсы: {
+                Сколько: 100,
+                Цена: 20,
+            },
+            сиги: {
+                Сколько: 100,
+                Цена: 75,
+            },
+            Касса: 0,
+            Сдача : 0,
+            
+        }
+    }
+    if (type === 'КУПИТЬ') {         //если тип action - КУПИТЬ, то:
+        if (СКОКА <= state[ШО].Сколько && БАБЛО - (СКОКА * state[ШО].Цена) >= 0 )    
+            return {
+                ...state, //берем все что было из ассортимента
+                [ШО]: {
+                    Сколько: state[ШО].Сколько - СКОКА,
+                    Цена: state[ШО].Цена                       //и уменьшаем то, что покупается на количество
+                },
+                Касса: state.Касса + (СКОКА * state[ШО].Цена),
+                Сдача: БАБЛО - (СКОКА * state[ШО].Цена)
+
+            
+            
+        }
+    }
+    
+    return state //если мы не поняли, что от нас просят в `action` - оставляем все как есть
+}
+
+
+function createStore(reducer){
+    let state       = reducer(undefined, {}) //стартовая инициализация состояния, запуск редьюсера со state === undefined
+    let cbs         = []                     //массив подписчиков
+    
+    const getState  = () => state            //функция, возвращающая переменную из замыкания
+    const subscribe = cb => (cbs.push(cb),   //запоминаем подписчиков в массиве
+                             () => cbs = cbs.filter(c => c !== cb)) //возвращаем функцию unsubscribe, которая удаляет подписчика из списка
+                             
+    const dispatch  = action => { 
+        const newState = reducer(state, action) //пробуем запустить редьюсер
+        if (newState !== state){ //проверяем, смог ли редьюсер обработать action
+            state = newState //если смог, то обновляем state 
+            for (let cb of cbs)  cb() //и запускаем подписчиков
+        }
+    }
+    
+    return {
+        getState, //добавление функции getState в результирующий объект
+        dispatch,
+        subscribe //добавление subscribe в объект
+    }
+}
+
+const store = createStore(reducer)
+
+ let шоЛежит = () => {
+     let objectStore = store.getState()
+     sigi.innerText = `Сиги :  ${objectStore.сиги ['Сколько']} цена : ${objectStore.сиги['Цена']}`
+     chips.innerText = `Чипсы :  ${objectStore.чипсы['Сколько']} цена : ${objectStore.чипсы['Цена']}`
+     beer.innerText = `Пиво :  ${objectStore.пиво['Сколько']} цена : ${objectStore.пиво['Цена']}`
+     sdacha.innerText = `Ваша сдача : ${objectStore['Сдача']}`
+     kasa.innerText = `Касса : ${objectStore['Касса']}`
+     bablo.value = `${objectStore['Сдача']}`
+
+
+ }
+
+let купиШОнибудь = () => ({ type: 'КУПИТЬ', ШО: select.value, СКОКА: input.value, БАБЛО: bablo.value})
+
+button.onclick = () => {
+    store.dispatch(купиШОнибудь())
+    шоЛежит()
+}
+
+window.onload = () => {
+    шоЛежит()
+}