Data row filtering

This commit is contained in:
Jiang Yio 2022-09-28 02:03:21 -04:00
parent f831f905a5
commit b3195bcd82

View File

@ -6,16 +6,16 @@
</thead>
<tbody v-for="report in reports">
<template v-for="name in report">
<tr v-if="names[name]">
<th>{{name}}</th>
<tr v-if="names[name]" @dblclick="toggle_filter_name(name)">
<th :class="{ filtered: name == filter_name }">{{name}}</th>
<td v-for="(group, idx) in groups" :class="{ first: (idx == 0) || (group.datehdr.datestr != groups[idx - 1].datehdr.datestr), abnormal_ref: abnormal_ref(group.values[name]), abnormal_ref_low: abnormal_ref_low(group.values[name]), abnormal_ref_high: abnormal_ref_high(group.values[name]), abnormal_iqr: abnormal_iqr(group.values[name]), abnormal_iqr_low: abnormal_iqr_low(group.values[name]), abnormal_iqr_high: abnormal_iqr_high(group.values[name]) }" :title="tooltip(group.values[name])">{{group.values[name] ? group.values[name].value : ''}}</td>
</tr>
</template>
</tbody>
<tbody>
<template v-for="name in names">
<tr v-if="!names_excluded[name]">
<th>{{name}}</th>
<tr v-if="!names_excluded[name]" @dblclick="toggle_filter_name(name)">
<th :class="{ filtered: name == filter_name }">{{name}}</th>
<td v-for="(group, idx) in groups" :class="{ first: (idx == 0) || (group.datehdr.datestr != groups[idx - 1].datehdr.datestr), abnormal_ref: abnormal_ref(group.values[name]), abnormal_ref_low: abnormal_ref_low(group.values[name]), abnormal_ref_high: abnormal_ref_high(group.values[name]), abnormal_iqr: abnormal_iqr(group.values[name]), abnormal_iqr_low: abnormal_iqr_low(group.values[name]), abnormal_iqr_high: abnormal_iqr_high(group.values[name]) }" :title="tooltip(group.values[name])">{{group.values[name] ? group.values[name].value : ''}}</td>
</tr>
</template>
@ -37,16 +37,25 @@
table.table-sticky tbody tr {
border-top: 1px dashed #dee2e6;
}
table.table-sticky tbody tr:hover {
border: 1px solid #6c757d;
}
td:nth-of-type(odd) {
background-color: rgba(0, 0, 0, 0.05);
}
table.table-sticky tbody th, table.table-sticky th.name {
cursor: default;
font-weight: bold;
text-align: center;
padding-left: 1rem;
padding-right: 1rem;
}
table.table-sticky th.filtered {
background-color: #6c757d;
color: #fff;
}
table.table-sticky th.date {
cursor: default;
font-size: 80%;
font-weight: normal;
text-align: center;
@ -147,11 +156,14 @@
}
},
data() {
return {};
return {
filter_name: null
};
},
computed: {
resultset_all() {
return this.resultset_calculated.length > 0 ? this.resultset.concat(this.resultset_calculated) : this.resultset;
var res = this.resultset_calculated.length > 0 ? this.resultset.concat(this.resultset_calculated) : this.resultset;
return this.filter_name ? res.filter(x => x.name == this.filter_name) : res;
},
resultset_calculated() {
var self = this, snapshots = [], results = [], history, update, item;
@ -230,6 +242,9 @@
return res.join('\n');
}
},
toggle_filter_name(name) {
this.filter_name = this.filter_name != name ? name : null;
},
abnormal_ref(item) {
return (item) && (item.flag);
},