diff --git a/src/app.js b/src/app.js index 8ad1c64b4..9b92514e5 100644 --- a/src/app.js +++ b/src/app.js @@ -1,5 +1,6 @@ import React from 'react'; import { createElement } from './utils.js'; +import { WordFormRu } from './helpers.js'; import './styles.css'; /** @@ -27,7 +28,13 @@ function App({ store }) { onClick={() => store.selectItem(item.code)} >
{item.code}
-
{item.title}
+ +
+ {item.title} + {!!item.selectedCount && + `| Выделяли ${item.selectedCount} ${WordFormRu(item.selectedCount)}`} +
+
diff --git a/src/helpers.js b/src/helpers.js new file mode 100644 index 000000000..e2878fcd2 --- /dev/null +++ b/src/helpers.js @@ -0,0 +1,13 @@ +export const WordFormRu = (count, wordforms = ['раз', 'раза', 'раз']) => { + const [single, twoFour, many, ...rest] = wordforms; + + let value = count % 100; + + if (value >= 10 && value < 20) return many; + + value %= 10; + + if (value === 1) return single; + else if (value === 0 || value > 4) return many; + else return twoFour; +}; diff --git a/src/store.js b/src/store.js index 9afab7e81..efecd692c 100644 --- a/src/store.js +++ b/src/store.js @@ -4,6 +4,10 @@ class Store { constructor(initState = {}) { this.state = initState; + + this.codesItems = + Object.keys(initState).length > 0 ? initState.list.map(item => item.code) : []; + this.listeners = []; // Слушатели изменений состояния } @@ -42,10 +46,25 @@ class Store { * Добавление новой записи */ addItem() { + const newCode = this.getLastCodeALLItems() + 1; + this.setState({ ...this.state, - list: [...this.state.list, { code: this.state.list.length + 1, title: 'Новая запись' }], + list: [...this.state.list, { code: newCode, title: 'Новая запись' }], }); + + this.addCodeItem(newCode); + } + + /** + * Для сохранения всех codes, в том числе и удаленных + */ + getLastCodeALLItems() { + return this.codesItems.at(-1); + } + + addCodeItem(code) { + this.codesItems.push(code); } /** @@ -69,7 +88,13 @@ class Store { list: this.state.list.map(item => { if (item.code === code) { item.selected = !item.selected; + + if (!item.selected) item.selectedCount = item.selectedCount || 0; + else item.selectedCount = (item.selectedCount || 0) + 1; + } else { + item.selected = false; } + return item; }), });