finished table controls

This commit is contained in:
2025-12-12 11:35:56 +10:00
parent a4f511cb45
commit 4316ac1636
4 changed files with 56 additions and 50 deletions

View File

@@ -4,10 +4,10 @@ mixin navbarMixin(selectedItem)
.navbar
each navbarUrl,navbarName in navbarItems
if navbarName == selectedItem
a.navbar__link__wrapper(href=navbarUrl)
a.navbar__link-wrapper(href=navbarUrl)
.navbar__item.navbar__item_selected #{navbarName}
else
a.navbar__link__wrapper(href=navbarUrl)
a.navbar__link-wrapper(href=navbarUrl)
.navbar__item #{navbarName}
mixin infoCardsMinxin()
@@ -36,7 +36,7 @@ mixin filtersMixin()
.filter-group__items
each filter in locationFilters
input.filter-group__checkbox(type="checkbox" id=filter.id name="location" value=filter.value)
| #{filter.label}
span #{filter.label}
br
.filter-group
@@ -46,7 +46,7 @@ mixin filtersMixin()
.filter-group__items
each filter in sensorTypeFilters
input.filter-group__checkbox(type="checkbox" id=filter.id name="sensor_type" value=filter.value)
| #{filter.label}
span #{filter.label}
br
.filter-group
@@ -54,14 +54,14 @@ mixin filtersMixin()
b Numeric Values
br
.filter-group__range
| Temperature from:
span Temperature from:
input.filter-group__input(type="number" name="temp_min" placeholder="20")
| to:
span to:
input.filter-group__input(type="number" name="temp_max" placeholder="30")
br
| Humidity from:
span Humidity from:
input.filter-group__input(type="number" name="humidity_min" placeholder="40")
| to:
span to:
input.filter-group__input(type="number" name="humidity_max" placeholder="60")
br
@@ -70,10 +70,10 @@ mixin filtersMixin()
b Device Specific Filters
br
.filter-group__items
| Sensor Name:
span Sensor Name:
input.filter-group__input(type="text" name="sensor_name")
br
| Days Since Calibration (max):
span Days Since Calibration (max):
input.filter-group__input(type="number" name="calibration_days" placeholder="30")
br
@@ -82,10 +82,10 @@ mixin filtersMixin()
b Measurement Period
br
.filter-group__dates
| From:
span From:
input.filter-group__input(type="date" name="date_from")
br
| To:
span To:
input.filter-group__input(type="date" name="date_to")
br
@@ -93,6 +93,24 @@ mixin filtersMixin()
input.filter-group__button.filter-group__button--submit(type="submit" value="Apply Filters")
input.filter-group__button.filter-group__button--reset(type="reset" value="Reset Filters")
mixin sortLevel(level)
.sort-level
i.sort-level__label
b Sort Level #{level}
br
label.sort-level__field-label(for=`sort${level}`) Field:
select.sort-level__select(id=`sort${level}` name=`sort${level}`)
each option in sortOptions
option(value=option.value) #{option.label}
label.sort-level__reverse-label(for=`sort${level}_reverse`)
input.sort-level__checkbox(type="checkbox" id=`sort${level}_reverse` name=`sort${level}_reverse`)
span Reverse
br
if level === '3'
input.sort-level__submit(type="submit" value="Sort")
else
br
mixin sortingMixin()
- const sortLevels = ['1', '2', '3'];
details.sorting
@@ -100,22 +118,23 @@ mixin sortingMixin()
form.sorting__form
fieldset.sorting__fieldset
each level in sortLevels
.sort-level
i.sort-level__label
b Sort Level #{level}
br
label.sort-level__field-label(for=`sort${level}`) Field:
select.sort-level__select(id=`sort${level}` name=`sort${level}`)
each option in sortOptions
option(value=option.value) #{option.label}
label.sort-level__reverse-label(for=`sort${level}_reverse`)
input.sort-level__checkbox(type="checkbox" id=`sort${level}_reverse` name=`sort${level}_reverse`)
| Reverse
br
if level === '3'
input.sort-level__submit(type="submit" value="Sort")
else
br
+sortLevel(level)
mixin graphXOption(option)
if option.checked
input.axis-group__radio(type="radio" id=option.id name="x_axis" value=option.value checked)
else
input.axis-group__radio(type="radio" id=option.id name="x_axis" value=option.value)
label.axis-group__option-label(for=option.id) #{option.label}
br
mixin graphYOption(option)
if option.checked
input.values-group__checkbox(type="checkbox" id=option.id name="values" value=option.value checked)
else
input.values-group__checkbox(type="checkbox" id=option.id name="values" value=option.value)
label.values-group__option-label(for=option.id) #{option.label}
br
mixin graphMixin()
details.graph
@@ -128,23 +147,12 @@ mixin graphMixin()
br
.axis-group__options
each option in axisOptions
if option.checked
input.axis-group__radio(type="radio" id=option.id name="x_axis" value=option.value checked)
else
input.axis-group__radio(type="radio" id=option.id name="x_axis" value=option.value)
label.axis-group__option-label(for=option.id) #{option.label}
br
+graphXOption(option)
.values-group
i.values-group__label
b Values
br
.values-group__options
each option in valueOptions
if option.checked
input.values-group__checkbox(type="checkbox" id=option.id name="values" value=option.value checked)
else
input.values-group__checkbox(type="checkbox" id=option.id name="values" value=option.value)
label.values-group__option-label(for=option.id) #{option.label}
br
+graphYOption(option)
button.values-group__button(type="submit" id="build_graph" name="build_graph") Build

View File

@@ -1,3 +1,3 @@
import './styles/main.styl'
import './styles/index.styl'
import './styles/details.styl'
import './styles/table.styl'

View File

@@ -1,4 +1,5 @@
// Миксины для переиспользования
item_h=3em;
double-border()
border-top double thick silver
border-bottom double thick silver
@@ -18,26 +19,25 @@ grid-responsive(columns)
grid-template-columns columns
grid-template-rows 1fr
// Основные стили
.navbar
double-border()
font-size 0
grid-responsive(repeat(7, min-content))
justify-items start
&__link__wrapper
&__link-wrapper
color black
text-decoration none
&__item
display inline-block
width max-content
height 3em
line-height 3em
height item_h
line-height item_h
text-align center
vertical-align middle
padding 0 10px
margin 0 10px
margin @padding
overflow hidden
text-overflow ellipsis
font-size medium

View File

@@ -1,2 +0,0 @@
// Импорт стилей для главной страницы
@import 'index.styl'