script.js 3.6 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124
  1. function reducer(state, {type, ШО, СКОКА, касса, ДЕНЕГ }){
  2. if (!state){
  3. return {
  4. пиво: {
  5. count: 100,
  6. СКОКА: 20
  7. },
  8. чипсы: 100,
  9. сиги: 100,
  10. касса: 0,
  11. ДЕНЕГ: 80
  12. }
  13. }
  14. if (type === 'КУПИТЬ'){
  15. console.log( state[ШО] )
  16. if ( state[ШО] < СКОКА || ДЕНЕГ == 0){
  17. alert('NETU!')
  18. return state;
  19. } else {
  20. if (typeof state[ШО] === 'object' && СКОКА){
  21. let {пиво} = state;
  22. if (пиво.count < СКОКА) {
  23. alert('NETU!')
  24. return state;
  25. } else
  26. return {
  27. ...state, пиво:{...пиво, count: пиво.count - СКОКА} ,
  28. ДЕНЕГ : ДЕНЕГ - пиво.count,
  29. касса : state[касса] + пиво.price
  30. }
  31. }
  32. // console.log(ШО);
  33. return {
  34. ...state,
  35. [ШО]: state[ШО] - СКОКА,
  36. }
  37. }
  38. }
  39. return state
  40. }
  41. function createStore(reducer){
  42. let state = reducer(undefined, {})
  43. let cbs = []
  44. const getState = () => state
  45. const subscribe = cb => (cbs.push(cb),
  46. () => cbs = cbs.filter(c => c !== cb))
  47. const dispatch = action => {
  48. const newState = reducer(state, action)
  49. if (newState !== state){
  50. state = newState
  51. for (let cb of cbs) cb()
  52. }
  53. }
  54. return {
  55. getState,
  56. dispatch,
  57. subscribe
  58. }
  59. }
  60. const store = createStore(reducer);
  61. let select = document.querySelector('#goods');
  62. function createSelectItems(selectId, store){
  63. for (let key of Object.keys(store.getState())){
  64. if ( key === 'касса'){
  65. return;
  66. } else {
  67. let option = document.createElement('option');
  68. option.value = key;
  69. option.innerText = key;
  70. select.append(option);
  71. }
  72. }
  73. }
  74. createSelectItems('goods', store);
  75. btn.addEventListener('click',() => {
  76. store.dispatch({type: 'КУПИТЬ', 'ШО': select.value, 'СКОКА': input.value})
  77. // console.log(store.getState());
  78. });
  79. function drawTable(root, store) {
  80. root.innerHTML = ''
  81. for (let [item, pcs] of Object.entries(store.getState())) {
  82. let tr = document.createElement('tr');
  83. let td = document.createElement('td');
  84. let th = document.createElement('th');
  85. if (typeof pcs === 'object'){
  86. let th = document.createElement('th');
  87. let tr = document.createElement('td');
  88. th.innerText = item;
  89. tr.append(th);
  90. for (let [el, price] of Object.entries(pcs)){
  91. let td = document.createElement('td');
  92. let td1 = document.createElement('td');
  93. // console.log(el, price)
  94. td.innerText = el;
  95. td1.innerText = price;
  96. tr.append(td, td1);
  97. root.append(th, tr);
  98. }
  99. } else {
  100. th.innerText = item;
  101. td.innerText = pcs;
  102. tr.append(th, td);
  103. root.append(tr);
  104. }
  105. }
  106. }
  107. drawTable(table,store);
  108. store.subscribe(() =>drawTable(table,store))