From 4b6d65a946f3db57b643f6feae81015387189230 Mon Sep 17 00:00:00 2001 From: OkunElya Date: Sun, 1 Mar 2026 16:23:58 +1000 Subject: [PATCH] filters working adding sorting --- current_site/src/components/mixins.pug | 18 ++-- current_site/src/pages/table.pug | 2 +- current_site/src/pages/table/data.js | 130 ++++++++++++------------ current_site/src/pages/table/filter.js | 15 +-- current_site/src/pages/table/main.js | 134 ++++++++++++++----------- current_site/src/pages/table/table.js | 3 +- current_site/webpack.config.js | 14 +-- 7 files changed, 166 insertions(+), 150 deletions(-) diff --git a/current_site/src/components/mixins.pug b/current_site/src/components/mixins.pug index d441904..07d13fc 100644 --- a/current_site/src/components/mixins.pug +++ b/current_site/src/components/mixins.pug @@ -27,10 +27,10 @@ mixin galleryMixin() mixin filtersMixin() details.filters summary.filters__summary Filters - form.filters__form + form(id='filters').filters__form p label(for='type') Type: - select(id ='type') + input(type='text' id='type') p label(for='name') Name: input(type='text' id='name') @@ -56,22 +56,22 @@ mixin filtersMixin() | to input(type='number' id='priceTo') input.filter-group__button--apply(type='button' id='applyFiltersButton' value="Apply Filters") - input.filter-group__button--reset(type='button' id='resetFiltersButton' value="Reset Filters") + input.filter-group__button--reset(type='button' id='clearFiltersButton' value="Reset Filters") mixin sortLevel(level) p select.sort-level__select(id=`sort_${level}`) | ascending? - input(type="checkbox", id=`sort_reverse_${level}`) + input(type="checkbox", id=`sort_${level}Desc`) mixin sortingMixin() - const sortLevels = ['1', '2', '3']; details.sorting summary.sorting__summary Sort - form.sorting__form - each level in sortLevels - +sortLevel(level) - input.sort-group__button--apply(type='button' id='applySortButton' value="Apply Sort") - input.sort-group__button--reset(type='button' id='resetSortButton' value="Reset Sort") + form(id='sorting') + each level in sortLevels + +sortLevel(level) + input.sort-group__button--apply(type='button' id='applySortButton' value="Apply Sort") + input.sort-group__button--reset(type='button' id='resetSortButton' value="Reset Sort") mixin graphXOption(option) diff --git a/current_site/src/pages/table.pug b/current_site/src/pages/table.pug index 7a84c0e..8ea49e2 100644 --- a/current_site/src/pages/table.pug +++ b/current_site/src/pages/table.pug @@ -16,4 +16,4 @@ body +sortingMixin() +graphMixin() - table.table + table(id='list') diff --git a/current_site/src/pages/table/data.js b/current_site/src/pages/table/data.js index 7b1e41d..a17a415 100644 --- a/current_site/src/pages/table/data.js +++ b/current_site/src/pages/table/data.js @@ -1,64 +1,68 @@ -buildings = [ - { "type": "DDR3", "name": "DDR3-1600-4GB-A1", "size": "4GB", "maker": "Kingston", "release": "2014-03", "price2026": 18, }, - { "type": "DDR3", "name": "DDR3-1600-8GB-A2", "size": "8GB", "maker": "Corsair", "release": "2015-06", "price2026": 26, }, - { "type": "DDR3", "name": "DDR3-1866-8GB-A3", "size": "8GB", "maker": "G.Skill", "release": "2016-02", "price2026": 29, }, - { "type": "DDR4", "name": "DDR4-2133-8GB-B1", "size": "8GB", "maker": "Crucial", "release": "2017-01", "price2026": 24, }, - { "type": "DDR4", "name": "DDR4-2400-8GB-B2", "size": "8GB", "maker": "Kingston", "release": "2017-09", "price2026": 27, }, - { "type": "DDR4", "name": "DDR4-2666-16GB-B3", "size": "16GB", "maker": "Corsair", "release": "2018-04", "price2026": 48, }, - { "type": "DDR4", "name": "DDR4-3000-16GB-B4", "size": "16GB", "maker": "G.Skill", "release": "2018-11", "price2026": 52, }, - { "type": "DDR4", "name": "DDR4-3200-16GB-B5", "size": "16GB", "maker": "HyperX", "release": "2019-03", "price2026": 55, }, - { "type": "DDR4", "name": "DDR4-3200-32GB-B6", "size": "32GB", "maker": "Crucial", "release": "2019-08", "price2026": 92, }, - { "type": "DDR4", "name": "DDR4-3600-32GB-B7", "size": "32GB", "maker": "Corsair", "release": "2020-02", "price2026": 99, }, - { "type": "DDR5", "name": "DDR5-4800-16GB-C1", "size": "16GB", "maker": "Kingston", "release": "2021-01", "price2026": 78, }, - { "type": "DDR5", "name": "DDR5-5200-16GB-C2", "size": "16GB", "maker": "Corsair", "release": "2021-06", "price2026": 84, }, - { "type": "DDR5", "name": "DDR5-5600-32GB-C3", "size": "32GB", "maker": "G.Skill", "release": "2022-02", "price2026": 145, }, - { "type": "DDR5", "name": "DDR5-6000-32GB-C4", "size": "32GB", "maker": "Crucial", "release": "2022-07", "price2026": 158, }, - { "type": "DDR5", "name": "DDR5-6400-32GB-C5", "size": "32GB", "maker": "Corsair", "release": "2023-01", "price2026": 172, }, - { "type": "DDR5", "name": "DDR5-6600-64GB-C6", "size": "64GB", "maker": "Kingston", "release": "2023-05", "price2026": 310, }, - { "type": "DDR5", "name": "DDR5-6800-64GB-C7", "size": "64GB", "maker": "G.Skill", "release": "2023-09", "price2026": 329, }, - { "type": "DDR5", "name": "DDR5-7200-64GB-C8", "size": "64GB", "maker": "Corsair", "release": "2024-02", "price2026": 355, }, - { "type": "DDR5", "name": "DDR5-7600-96GB-C9", "size": "96GB", "maker": "Crucial", "release": "2024-06", "price2026": 520, }, - { "type": "DDR5", "name": "DDR5-8000-96GB-C10", "size": "96GB", "maker": "Kingston", "release": "2024-10", "price2026": 560, }, - { "type": "LPDDR4", "name": "LP4-3200-8GB-D1", "size": "8GB", "maker": "Samsung", "release": "2019-01", "price2026": 34, }, - { "type": "LPDDR4", "name": "LP4-4266-8GB-D2", "size": "8GB", "maker": "Micron", "release": "2019-07", "price2026": 39, }, - { "type": "LPDDR5", "name": "LP5-5500-12GB-D3", "size": "12GB", "maker": "Samsung", "release": "2020-03", "price2026": 58, }, - { "type": "LPDDR5", "name": "LP5-6400-16GB-D4", "size": "16GB", "maker": "SKHynix", "release": "2021-01", "price2026": 74, }, - { "type": "LPDDR5X", "name": "LP5X-7500-24GB-D5", "size": "24GB", "maker": "Micron", "release": "2022-05", "price2026": 118, }, - { "type": "DDR4", "name": "DDR4-2666-8GB-E1", "size": "8GB", "maker": "Patriot", "release": "2018-05", "price2026": 25, }, - { "type": "DDR4", "name": "DDR4-3000-8GB-E2", "size": "8GB", "maker": "ADATA", "release": "2018-09", "price2026": 28, }, - { "type": "DDR4", "name": "DDR4-3200-8GB-E3", "size": "8GB", "maker": "TeamGroup", "release": "2019-04", "price2026": 30, }, - { "type": "DDR4", "name": "DDR4-3600-16GB-E4", "size": "16GB", "maker": "ADATA", "release": "2020-01", "price2026": 53, }, - { "type": "DDR4", "name": "DDR4-4000-16GB-E5", "size": "16GB", "maker": "Patriot", "release": "2020-06", "price2026": 61, }, - { "type": "DDR5", "name": "DDR5-5200-8GB-F1", "size": "8GB", "maker": "TeamGroup", "release": "2021-03", "price2026": 52, }, - { "type": "DDR5", "name": "DDR5-5600-16GB-F2", "size": "16GB", "maker": "ADATA", "release": "2021-10", "price2026": 88, }, - { "type": "DDR5", "name": "DDR5-6000-16GB-F3", "size": "16GB", "maker": "Patriot", "release": "2022-03", "price2026": 95, }, - { "type": "DDR5", "name": "DDR5-6400-32GB-F4", "size": "32GB", "maker": "TeamGroup", "release": "2022-09", "price2026": 168, }, - { "type": "DDR5", "name": "DDR5-7200-32GB-F5", "size": "32GB", "maker": "ADATA", "release": "2023-04", "price2026": 185, }, - { "type": "DDR3", "name": "DDR3-1333-4GB-G1", "size": "4GB", "maker": "Samsung", "release": "2013-02", "price2026": 15, }, - { "type": "DDR3", "name": "DDR3-1600-4GB-G2", "size": "4GB", "maker": "Micron", "release": "2014-08", "price2026": 17, }, - { "type": "DDR3", "name": "DDR3-1866-8GB-G3", "size": "8GB", "maker": "Samsung", "release": "2015-11", "price2026": 28, }, - { "type": "DDR5", "name": "DDR5-8400-128GB-H1", "size": "128GB", "maker": "Corsair", "release": "2025-01", "price2026": 890, }, - { "type": "DDR5", "name": "DDR5-8800-128GB-H2", "size": "128GB", "maker": "G.Skill", "release": "2025-03", "price2026": 940, }, - { "type": "DDR5", "name": "DDR5-9200-128GB-H3", "size": "128GB", "maker": "Kingston", "release": "2025-06", "price2026": 990, }, - { "type": "DDR5", "name": "DDR5-6000-48GB-X1", "size": "48GB", "maker": "Corsair", "release": "2024-01", "price2026": 210, }, - { "type": "DDR5", "name": "DDR5-6000-48GB-X2", "size": "48GB", "maker": "Kingston", "release": "2024-02", "price2026": 215, }, - { "type": "DDR5", "name": "DDR5-6000-48GB-X3", "size": "48GB", "maker": "G.Skill", "release": "2024-03", "price2026": 218, }, - { "type": "DDR5", "name": "DDR5-6000-48GB-X4", "size": "48GB", "maker": "ADATA", "release": "2024-04", "price2026": 222, }, - { "type": "DDR5", "name": "DDR5-6000-48GB-X5", "size": "48GB", "maker": "Patriot", "release": "2024-05", "price2026": 225, }, - { "type": "DDR5", "name": "DDR5-6000-48GB-X6", "size": "48GB", "maker": "TeamGroup", "release": "2024-06", "price2026": 228, }, - { "type": "DDR5", "name": "DDR5-6000-48GB-X7", "size": "48GB", "maker": "Crucial", "release": "2024-07", "price2026": 230, }, - { "type": "DDR5", "name": "DDR5-6000-48GB-X8", "size": "48GB", "maker": "Samsung", "release": "2024-08", "price2026": 235, }, - { "type": "DDR5", "name": "DDR5-6000-48GB-X9", "size": "48GB", "maker": "Micron", "release": "2024-09", "price2026": 238, }, - { "type": "DDR5", "name": "DDR5-6000-48GB-X10", "size": "48GB", "maker": "SKHynix", "release": "2024-10", "price2026": 240, }, - { "type": "DDR4", "name": "DDR4-3200-64GB-Y1", "size": "64GB", "maker": "Corsair", "release": "2021-01", "price2026": 180, }, - { "type": "DDR4", "name": "DDR4-3200-64GB-Y2", "size": "64GB", "maker": "Kingston", "release": "2021-02", "price2026": 182, }, - { "type": "DDR4", "name": "DDR4-3200-64GB-Y3", "size": "64GB", "maker": "G.Skill", "release": "2021-03", "price2026": 185, }, - { "type": "DDR4", "name": "DDR4-3200-64GB-Y4", "size": "64GB", "maker": "ADATA", "release": "2021-04", "price2026": 188, }, - { "type": "DDR4", "name": "DDR4-3200-64GB-Y5", "size": "64GB", "maker": "Patriot", "release": "2021-05", "price2026": 190, }, - { "type": "DDR4", "name": "DDR4-3200-64GB-Y6", "size": "64GB", "maker": "TeamGroup", "release": "2021-06", "price2026": 192, }, - { "type": "DDR4", "name": "DDR4-3200-64GB-Y7", "size": "64GB", "maker": "Crucial", "release": "2021-07", "price2026": 195, }, - { "type": "DDR4", "name": "DDR4-3200-64GB-Y8", "size": "64GB", "maker": "Samsung", "release": "2021-08", "price2026": 198, }, - { "type": "DDR4", "name": "DDR4-3200-64GB-Y9", "size": "64GB", "maker": "Micron", "release": "2021-09", "price2026": 200, }, - { "type": "DDR4", "name": "DDR4-3200-64GB-Y10", "size": "64GB", "maker": "SKHynix", "release": "2021-10", "price2026": 205, } +let ram_sticks = [ + { "type": "DDR3", "name": "DDR3-1600-4GB-A1", "size": 4, "maker": "Kingston", "release": "2014-03", "price": 18, }, + { "type": "DDR3", "name": "DDR3-1600-8GB-A2", "size": 8, "maker": "Corsair", "release": "2015-06", "price": 26, }, + { "type": "DDR3", "name": "DDR3-1866-8GB-A3", "size": 8, "maker": "G.Skill", "release": "2016-02", "price": 29, }, + { "type": "DDR4", "name": "DDR4-2133-8GB-B1", "size": 8, "maker": "Crucial", "release": "2017-01", "price": 24, }, + { "type": "DDR4", "name": "DDR4-2400-8GB-B2", "size": 8, "maker": "Kingston", "release": "2017-09", "price": 27, }, + { "type": "DDR4", "name": "DDR4-2666-16GB-B3", "size": 16, "maker": "Corsair", "release": "2018-04", "price": 48, }, + { "type": "DDR4", "name": "DDR4-3000-16GB-B4", "size": 16, "maker": "G.Skill", "release": "2018-11", "price": 52, }, + { "type": "DDR4", "name": "DDR4-3200-16GB-B5", "size": 16, "maker": "HyperX", "release": "2019-03", "price": 55, }, + { "type": "DDR4", "name": "DDR4-3200-32GB-B6", "size": 32, "maker": "Crucial", "release": "2019-08", "price": 92, }, + { "type": "DDR4", "name": "DDR4-3600-32GB-B7", "size": 32, "maker": "Corsair", "release": "2020-02", "price": 99, }, + { "type": "DDR5", "name": "DDR5-4800-16GB-C1", "size": 16, "maker": "Kingston", "release": "2021-01", "price": 78, }, + { "type": "DDR5", "name": "DDR5-5200-16GB-C2", "size": 16, "maker": "Corsair", "release": "2021-06", "price": 84, }, + { "type": "DDR5", "name": "DDR5-5600-32GB-C3", "size": 32, "maker": "G.Skill", "release": "2022-02", "price": 145, }, + { "type": "DDR5", "name": "DDR5-6000-32GB-C4", "size": 32, "maker": "Crucial", "release": "2022-07", "price": 158, }, + { "type": "DDR5", "name": "DDR5-6400-32GB-C5", "size": 32, "maker": "Corsair", "release": "2023-01", "price": 172, }, + { "type": "DDR5", "name": "DDR5-6600-64GB-C6", "size": 64, "maker": "Kingston", "release": "2023-05", "price": 310, }, + { "type": "DDR5", "name": "DDR5-6800-64GB-C7", "size": 64, "maker": "G.Skill", "release": "2023-09", "price": 329, }, + { "type": "DDR5", "name": "DDR5-7200-64GB-C8", "size": 64, "maker": "Corsair", "release": "2024-02", "price": 355, }, + { "type": "DDR5", "name": "DDR5-7600-96GB-C9", "size": 96, "maker": "Crucial", "release": "2024-06", "price": 520, }, + { "type": "DDR5", "name": "DDR5-8000-96GB-C10", "size": 96, "maker": "Kingston", "release": "2024-10", "price": 560, }, + { "type": "LPDDR4", "name": "LP4-3200-8GB-D1", "size": 8, "maker": "Samsung", "release": "2019-01", "price": 34, }, + { "type": "LPDDR4", "name": "LP4-4266-8GB-D2", "size": 8, "maker": "Micron", "release": "2019-07", "price": 39, }, + { "type": "LPDDR5", "name": "LP5-5500-12GB-D3", "size": 12, "maker": "Samsung", "release": "2020-03", "price": 58, }, + { "type": "LPDDR5", "name": "LP5-6400-16GB-D4", "size": 16, "maker": "SKHynix", "release": "2021-01", "price": 74, }, + { "type": "LPDDR5X", "name": "LP5X-7500-24GB-D5", "size": 24, "maker": "Micron", "release": "2022-05", "price": 118, }, + { "type": "DDR4", "name": "DDR4-2666-8GB-E1", "size": 8, "maker": "Patriot", "release": "2018-05", "price": 25, }, + { "type": "DDR4", "name": "DDR4-3000-8GB-E2", "size": 8, "maker": "ADATA", "release": "2018-09", "price": 28, }, + { "type": "DDR4", "name": "DDR4-3200-8GB-E3", "size": 8, "maker": "TeamGroup", "release": "2019-04", "price": 30, }, + { "type": "DDR4", "name": "DDR4-3600-16GB-E4", "size": 16, "maker": "ADATA", "release": "2020-01", "price": 53, }, + { "type": "DDR4", "name": "DDR4-4000-16GB-E5", "size": 16, "maker": "Patriot", "release": "2020-06", "price": 61, }, + { "type": "DDR5", "name": "DDR5-5200-8GB-F1", "size": 8, "maker": "TeamGroup", "release": "2021-03", "price": 52, }, + { "type": "DDR5", "name": "DDR5-5600-16GB-F2", "size": 16, "maker": "ADATA", "release": "2021-10", "price": 88, }, + { "type": "DDR5", "name": "DDR5-6000-16GB-F3", "size": 16, "maker": "Patriot", "release": "2022-03", "price": 95, }, + { "type": "DDR5", "name": "DDR5-6400-32GB-F4", "size": 32, "maker": "TeamGroup", "release": "2022-09", "price": 168, }, + { "type": "DDR5", "name": "DDR5-7200-32GB-F5", "size": 32, "maker": "ADATA", "release": "2023-04", "price": 185, }, + { "type": "DDR3", "name": "DDR3-1333-4GB-G1", "size": 4, "maker": "Samsung", "release": "2013-02", "price": 15, }, + { "type": "DDR3", "name": "DDR3-1600-4GB-G2", "size": 4, "maker": "Micron", "release": "2014-08", "price": 17, }, + { "type": "DDR3", "name": "DDR3-1866-8GB-G3", "size": 8, "maker": "Samsung", "release": "2015-11", "price": 28, }, + { "type": "DDR5", "name": "DDR5-8400-128GB-H1", "size": 128, "maker": "Corsair", "release": "2025-01", "price": 890, }, + { "type": "DDR5", "name": "DDR5-8800-128GB-H2", "size": 128, "maker": "G.Skill", "release": "2025-03", "price": 940, }, + { "type": "DDR5", "name": "DDR5-9200-128GB-H3", "size": 128, "maker": "Kingston", "release": "2025-06", "price": 990, }, + { "type": "DDR5", "name": "DDR5-6000-48GB-X1", "size": 48, "maker": "Corsair", "release": "2024-01", "price": 210, }, + { "type": "DDR5", "name": "DDR5-6000-48GB-X2", "size": 48, "maker": "Kingston", "release": "2024-02", "price": 215, }, + { "type": "DDR5", "name": "DDR5-6000-48GB-X3", "size": 48, "maker": "G.Skill", "release": "2024-03", "price": 218, }, + { "type": "DDR5", "name": "DDR5-6000-48GB-X4", "size": 48, "maker": "ADATA", "release": "2024-04", "price": 222, }, + { "type": "DDR5", "name": "DDR5-6000-48GB-X5", "size": 48, "maker": "Patriot", "release": "2024-05", "price": 225, }, + { "type": "DDR5", "name": "DDR5-6000-48GB-X6", "size": 48, "maker": "TeamGroup", "release": "2024-06", "price": 228, }, + { "type": "DDR5", "name": "DDR5-6000-48GB-X7", "size": 48, "maker": "Crucial", "release": "2024-07", "price": 230, }, + { "type": "DDR5", "name": "DDR5-6000-48GB-X8", "size": 48, "maker": "Samsung", "release": "2024-08", "price": 235, }, + { "type": "DDR5", "name": "DDR5-6000-48GB-X9", "size": 48, "maker": "Micron", "release": "2024-09", "price": 238, }, + { "type": "DDR5", "name": "DDR5-6000-48GB-X10", "size": 48, "maker": "SKHynix", "release": "2024-10", "price": 240, }, + { "type": "DDR4", "name": "DDR4-3200-64GB-Y1", "size": 64, "maker": "Corsair", "release": "2021-01", "price": 180, }, + { "type": "DDR4", "name": "DDR4-3200-64GB-Y2", "size": 64, "maker": "Kingston", "release": "2021-02", "price": 182, }, + { "type": "DDR4", "name": "DDR4-3200-64GB-Y3", "size": 64, "maker": "G.Skill", "release": "2021-03", "price": 185, }, + { "type": "DDR4", "name": "DDR4-3200-64GB-Y4", "size": 64, "maker": "ADATA", "release": "2021-04", "price": 188, }, + { "type": "DDR4", "name": "DDR4-3200-64GB-Y5", "size": 64, "maker": "Patriot", "release": "2021-05", "price": 190, }, + { "type": "DDR4", "name": "DDR4-3200-64GB-Y6", "size": 64, "maker": "TeamGroup", "release": "2021-06", "price": 192, }, + { "type": "DDR4", "name": "DDR4-3200-64GB-Y7", "size": 64, "maker": "Crucial", "release": "2021-07", "price": 195, }, + { "type": "DDR4", "name": "DDR4-3200-64GB-Y8", "size": 64, "maker": "Samsung", "release": "2021-08", "price": 198, }, + { "type": "DDR4", "name": "DDR4-3200-64GB-Y9", "size": 64, "maker": "Micron", "release": "2021-09", "price": 200, }, + { "type": "DDR4", "name": "DDR4-3200-64GB-Y10", "size": 64, "maker": "SKHynix", "release": "2021-10", "price": 205, } -] \ No newline at end of file +] +ram_sticks = ram_sticks.map((x) => ({ + ...x, + release: Number(x.release.split("-")[0]), +})) \ No newline at end of file diff --git a/current_site/src/pages/table/filter.js b/current_site/src/pages/table/filter.js index 82c32a5..59fb2de 100644 --- a/current_site/src/pages/table/filter.js +++ b/current_site/src/pages/table/filter.js @@ -1,10 +1,10 @@ const correspond = { - "Название": "structure", - "Тип": "category", - "Страна": "country", - "Город": "city", - "Год": ["yearFrom", "yearTo"], - "Высота": ["heightFrom", "heightTo"] + "type": "type", + "name": "name", + "maker": "manufacturer", + "size": ["sizeFrom", "sizeTo"], + "release": ["releaseDateFrom", "releaseDateTo"], + "price": ["priceFrom", "priceTo"] } @@ -41,6 +41,7 @@ const dataFilter = (dataForm) => { valInput = Number(valInput); } } + // формируем очередной элемент ассоциативного массива dictFilter[item.id] = valInput; } @@ -74,7 +75,7 @@ const filterTable = (data, idTable, dataForm) => { if (typeof val == 'number') { result &&= datafilter[correspond[key][0]] <= Number(val) && datafilter[correspond[key][1]] >= Number(val) } - + console.log(result, key, ) }); return result; diff --git a/current_site/src/pages/table/main.js b/current_site/src/pages/table/main.js index fd62a53..236ac4b 100644 --- a/current_site/src/pages/table/main.js +++ b/current_site/src/pages/table/main.js @@ -3,79 +3,111 @@ document.addEventListener("DOMContentLoaded", function () { }) function doInit() { - createTable(buildings, 'list'); + createTable(ram_sticks, 'list'); const clearFiltersButton = document.getElementById("clearFiltersButton"); clearFiltersButton.addEventListener("click", (event) => { - clearFilters(filter); - filterTable(buildings,'list',filter) - resetSort(sort); + clearFilters(filters); + createTable(ram_sticks, 'list'); + sortTable('list', ram_sticks) }) const applyFiltersButton = document.getElementById("applyFiltersButton"); applyFiltersButton.addEventListener("click", (event) => { - filterTable(buildings,'list',filter) - resetSort(sort); + filterTable(ram_sticks, 'list', filters) + sortTable('list', ram_sticks) }) - setSortSelects(buildings[0], sort) + setSortSelects(ram_sticks[0], sorting) + let i = 0; + for (const elem of sorting.querySelectorAll(`& select`)) { + const counter = i; + elem.addEventListener("change", () => { + updateOptions(counter, sorting) + }) + i+=1; + } - sort.fieldsFirst.addEventListener("change",()=>{ - changeNextSelect(sort.fieldsFirst,sort.fieldsSecond.id) - }) - - sort.doSortButton.addEventListener("click", ()=>{if (!sortTable('list',sort)){ + sorting.applySortButton.addEventListener("click", () => { + if (!sortTable('list', sorting)) { + clearTable('list'); + createTable(ram_sticks, 'list'); + sortTable('list', ram_sticks) + } + }); + sorting.resetSortButton.addEventListener("click", () => { + resetSort(sorting); clearTable('list'); - createTable(buildings, 'list'); - }}); - sort.resetSortButton.addEventListener("click", ()=>{resetSort(sort); - clearTable('list'); - createTable(buildings, 'list'); + createTable(ram_sticks, 'list'); }); } -// формирование полей элемента списка с заданным текстом и значением - const createOption = (str, val) => { let item = document.createElement('option'); item.text = str; item.value = val; return item; } - -// формирование поля со списком -// параметры – массив со значениями элементов списка и элемент select +const resetSortSelect = (sortSelect) => { + sortSelect.querySelectorAll(`& option`).forEach((elem) => { + elem.parentElement.removeChild(elem) + }) +} +const all_fields = Object.keys(ram_sticks[0]); const setSortSelect = (arr, sortSelect) => { - + // создаем OPTION Нет и добавляем ее в SELECT - sortSelect.append(createOption('Нет', 0)); + sortSelect.append(createOption('none', 0)); // перебираем массив со значениями опций - arr.forEach((item, index) => { - // создаем OPTION из очередного ключа и добавляем в SELECT - // значение атрибута VALUE увеличиваем на 1, так как значение 0 имеет опция Нет - sortSelect.append(createOption(item, index + 1)); + arr.forEach((item, index) => { + sortSelect.append(createOption(item, all_fields.indexOf(item) + 1)); }); } +const updateOptions = (current_index, sort_form) => { + const elem_collection = sort_form.querySelectorAll(`& select`); + let used_options_list = [] + let i = 0; + for (let elem_ of elem_collection) { + if (i++ < current_index) { + used_options_list.push(all_fields[elem_.value-1]) + } + } + if (current_index >= elem_collection.length) { + return; + } + const elem = elem_collection[current_index] + const available_options = all_fields.filter((x) => !used_options_list.includes(x)); + elem.disabled = available_options.length == 0; + if(current_index>0){ + elem.disabled |= elem_collection[current_index-1].value==0; + } + + save_val = 0; + if (!used_options_list.includes(all_fields[elem.value - 1])) { + save_val = elem.value; + } + resetSortSelect(elem) + setSortSelect(available_options, elem) + + elem.value = save_val; + + + updateOptions(current_index + 1, sort_form) + +} // формируем поля со списком для многоуровневой сортировки -const setSortSelects = (data, dataForm) => { - - // выделяем ключи словаря в массив +const setSortSelects = (data, dataForm) => { const head = Object.keys(data); - - // находим все SELECT в форме const allSelect = dataForm.getElementsByTagName('select'); - - for(const item of dataForm.elements){ - // формируем очередной SELECT + + for (const item of dataForm.elements) { setSortSelect(head, item); - - // САМОСТОЯТЕЛЬНО все SELECT, кроме первого, сделать неизменяемым } let skipped = false - for(const elem of allSelect){ - if(!skipped){ + for (const elem of allSelect) { + if (!skipped) { skipped = true; continue; } @@ -83,24 +115,6 @@ const setSortSelects = (data, dataForm) => { } } -const changeNextSelect = (curSelect, nextSelectId) => { - - let nextSelect = document.getElementById(nextSelectId); - - nextSelect.disabled = false; - - // в следующем SELECT выводим те же option, что и в текущем - nextSelect.innerHTML = curSelect.innerHTML; - - // удаляем в следующем SELECT уже выбранную в текущем опцию - // если это не первая опция - отсутствие сортировки - if (curSelect.value != 0) { - nextSelect.remove(curSelect.value); - } else { - nextSelect.disabled = true; - } -} - -const resetSort = (form)=>{ - form.querySelectorAll(`& select`).forEach((curSelect,index) => {if(index!=0){curSelect.disabled = true} curSelect.value = 0}) +const resetSort = (form) => { + form.querySelectorAll(`& select`).forEach((curSelect, index) => { if (index != 0) { curSelect.disabled = true } curSelect.value = 0 }) } diff --git a/current_site/src/pages/table/table.js b/current_site/src/pages/table/table.js index bd8d290..400b16b 100644 --- a/current_site/src/pages/table/table.js +++ b/current_site/src/pages/table/table.js @@ -27,7 +27,8 @@ const createHeaderRow = (headers) => { const tr = document.createElement('tr'); headers.forEach(header => { const th = document.createElement('th'); - th.innerHTML = header; + + th.innerHTML = header.slice(0,1).toUpperCase()+header.slice(1); tr.append(th); }); const thead = document.createElement('thead') diff --git a/current_site/webpack.config.js b/current_site/webpack.config.js index ce1e0b2..61aeb12 100644 --- a/current_site/webpack.config.js +++ b/current_site/webpack.config.js @@ -73,14 +73,10 @@ module.exports = { devServer: { watchFiles: path.join(__dirname, "src"), port: 9000, - static: [ - { - directory: path.join(__dirname, "dist"), - }, - { - directory: path.join(__dirname, "src", "pages"), - publicPath: "/", - }, - ], + static: { + directory: path.join(__dirname, "src", "pages"), + publicPath: "/", + watch: true, + }, }, };