[New] changes to default facet generation

This commit is contained in:
Robert von Burg 2022-02-28 15:59:15 +01:00
parent fc8e340d05
commit d49127bf82
2 changed files with 72 additions and 93 deletions

View File

@ -1,7 +1,7 @@
{ {
"name": "strolch-wc-reports", "name": "strolch-wc-reports",
"description": "Strolch WebComponent Reports", "description": "Strolch WebComponent Reports",
"version": "0.4.1", "version": "0.5.0",
"authors": [ "authors": [
"Robert von Burg" "Robert von Burg"
], ],

View File

@ -146,7 +146,7 @@
justify-content: space-between; justify-content: space-between;
} }
.footer p { .footer p, .duration {
color: #b5b5b5; color: #b5b5b5;
} }
@ -242,38 +242,14 @@
</style> </style>
<!-- Requests --> <!-- Requests -->
<iron-ajax id="ajaxGetReports" <iron-ajax id="ajaxGetReports" url="[[baseRestPath]]/strolch/reports" content-type="application/json" handle-as="json" method="GET"
url="[[baseRestPath]]/strolch/reports" on-response="onGetReportResponse" on-error="onAjaxError" loading="{{loadingGetReports}}"></iron-ajax>
content-type="application/json" <iron-ajax id="ajaxGetFacets" url="[[baseRestPath]]/strolch/reports/[[reportId]]/facets" content-type="application/json" handle-as="json" method="GET"
handle-as="json" on-response="onGetFacetResponse" on-error="onAjaxError" loading="{{loadingGetFacets}}"></iron-ajax>
method="GET" <iron-ajax id="ajaxPostCsv" url="[[baseRestPath]]/strolch/reports/[[reportId]]/csv" content-type="application/json" handle-as="text" method="POST"
on-response="onGetReportResponse" on-response="onPostCsvResponse" on-error="onAjaxError" loading="{{loadingPostCsv}}"></iron-ajax>
on-error="onAjaxError" <iron-ajax id="ajaxPostReport" url="[[baseRestPath]]/strolch/reports/[[reportId]]" content-type="application/json" handle-as="json" method="POST"
loading="{{loadingGetReports}}"></iron-ajax> on-response="onPostReportResponse" on-error="onAjaxError" loading="{{loadingPostReport}}"></iron-ajax>
<iron-ajax id="ajaxGetFacets"
url="[[baseRestPath]]/strolch/reports/[[reportId]]/facets"
content-type="application/json"
handle-as="json"
method="GET"
on-response="onGetFacetResponse"
on-error="onAjaxError"
loading="{{loadingGetFacets}}"></iron-ajax>
<iron-ajax id="ajaxPostCsv"
url="[[baseRestPath]]/strolch/reports/[[reportId]]/csv"
content-type="application/json"
handle-as="text"
method="POST"
on-response="onPostCsvResponse"
on-error="onAjaxError"
loading="{{loadingPostCsv}}"></iron-ajax>
<iron-ajax id="ajaxPostReport"
url="[[baseRestPath]]/strolch/reports/[[reportId]]"
content-type="application/json"
handle-as="json"
method="POST"
on-response="onPostReportResponse"
on-error="onAjaxError"
loading="{{loadingPostReport}}"></iron-ajax>
<!-- Content --> <!-- Content -->
<div class="overlay-loading" hidden$="[[hideOverlay]]"> <div class="overlay-loading" hidden$="[[hideOverlay]]">
@ -285,9 +261,7 @@
<paper-material id="actionBar"> <paper-material id="actionBar">
<paper-dropdown-menu label="[[localize('reportType')]]"> <paper-dropdown-menu label="[[localize('reportType')]]">
<paper-listbox class="dropdown-content" <paper-listbox class="dropdown-content" selected="{{selectedReportIndex}}" on-iron-select="onReportSelected">
selected="{{selectedReportIndex}}"
on-iron-select="onReportSelected">
<template is="dom-repeat" items="[[reports]]" as="report"> <template is="dom-repeat" items="[[reports]]" as="report">
<paper-item class="dropdown-item">[[localize(report.name)]]</paper-item> <paper-item class="dropdown-item">[[localize(report.name)]]</paper-item>
</template> </template>
@ -296,15 +270,8 @@
<template is="dom-if" if="[[reportId]]"> <template is="dom-if" if="[[reportId]]">
<div id="dateContainer"> <div id="dateContainer">
<vaadin-date-picker label="[[localize('From')]]" value="{{fromDate}}" i18n="{{vaadinI18n}}"></vaadin-date-picker>
<vaadin-date-picker label="[[localize('From')]]" <vaadin-date-picker label="[[localize('To')]]" value="{{toDate}}" i18n="{{vaadinI18n}}"></vaadin-date-picker>
value="{{fromDate}}"
i18n="{{vaadinI18n}}"></vaadin-date-picker>
<vaadin-date-picker label="[[localize('To')]]"
value="{{toDate}}"
i18n="{{vaadinI18n}}"></vaadin-date-picker>
</div> </div>
</template> </template>
@ -317,17 +284,10 @@
<iron-icon icon="print"></iron-icon> <iron-icon icon="print"></iron-icon>
{{localize('buttonPrintLabel')}} {{localize('buttonPrintLabel')}}
</paper-button> </paper-button>
<paper-icon-button id="refreshButton" <paper-icon-button id="refreshButton" on-tap="onRefreshTapped" icon="refresh" disabled$="[[!reportId]]"></paper-icon-button>
on-tap="onRefreshTapped"
icon="refresh"
disabled$="[[!reportId]]"></paper-icon-button>
</div> </div>
<paper-tooltip for="exportButton" position="top" offset="4"> <paper-tooltip for="exportButton" position="top" offset="4">{{localize('buttonExportDesc')}}</paper-tooltip>
{{localize('buttonExportDesc')}} <paper-tooltip for="refreshButton" position="top" offset="4">{{localize('refreshView')}}</paper-tooltip>
</paper-tooltip>
<paper-tooltip for="refreshButton" position="top" offset="4">
{{localize('refreshView')}}
</paper-tooltip>
</paper-material> </paper-material>
</div> </div>
@ -343,19 +303,20 @@
</div> </div>
</template> </template>
<div id="facetContainer" <div id="facetContainer" class="light-border noprint" on-iron-select="onSelectionChanged" on-iron-deselect="onSelectionChanged"
class="light-border noprint" hidden$="[[!showFacets]]" restamp>
on-iron-select="onSelectionChanged"
on-iron-deselect="onSelectionChanged"
hidden$="[[!showFacets]]"
restamp>
<paper-icon-button icon="chevron-left" on-tap="onToggleShowFacets"></paper-icon-button> <paper-icon-button icon="chevron-left" on-tap="onToggleShowFacets"></paper-icon-button>
<template is="dom-if" if="[[arrayEmpty(facets)]]"> <template is="dom-if" if="[[arrayEmpty(facets)]]">
<p class="facetInfo"><i>[[localize('noFacetsAvailable')]]</i></p> <p class="facetInfo"><i>[[localize('noFacetsAvailable')]]</i></p>
</template> </template>
<template is="dom-if" if="[[arrayFilled(facets)]]"> <template is="dom-if" if="[[arrayFilled(facets)]]">
<p class="facetInfo"><i>[[localize('showingMaxNrOfFacets', 'facets', facetLimit)]]</i></p> <template is="dom-if" if="[[areRowFacetsLimited]]">
<p class="facetInfo"><i>[[localize('facetsAreBeingTrimmed')]]</i></p>
</template>
<template is="dom-if" if="[[!areRowFacetsLimited]]">
<p class="facetInfo"><i>[[localize('showingMaxNrOfFacets', 'facets', maxFacetValues)]]</i></p>
</template>
</template> </template>
<template is="dom-repeat" items="[[facets]]" as="facet"> <template is="dom-repeat" items="[[facets]]" as="facet">
@ -366,9 +327,11 @@
facet-id="[[facet.type]]" facet-id="[[facet.type]]"
fields="[[facet.values]]" fields="[[facet.values]]"
filter="[[allFilters]]" filter="[[allFilters]]"
facet-limit="[[facetLimit]]" facet-limit="[[maxFacetValues]]"
on-facet-loading="onFacetLoading"></strolch-wc-reports-facet> on-facet-loading="onFacetLoading"></strolch-wc-reports-facet>
</template> </template>
<p class="facetInfo duration"><i>[[localize('duration')]] [[facetLoadDuration]]</i></p>
</div> </div>
<div id="tableContainer"> <div id="tableContainer">
@ -376,25 +339,19 @@
locales-path="[[localesPath]]" locales-path="[[localesPath]]"
data="[[data]]"></strolch-wc-reports-table> data="[[data]]"></strolch-wc-reports-table>
<template is="dom-if" if="[[data]]"> <template is="dom-if" if="[[data]]">
<div class="footer noprint"> <div class="footer noprint">
<div> <div>
<paper-button class$="[[getLimitBtnClass(25, data.limit)]]" on-tap="setLimit">25 <paper-button class$="[[getLimitBtnClass(25, data.limit)]]" on-tap="setLimit">25</paper-button>
</paper-button> <paper-button class$="[[getLimitBtnClass(50, data.limit)]]" on-tap="setLimit">50</paper-button>
<paper-button class$="[[getLimitBtnClass(50, data.limit)]]" on-tap="setLimit">50 <paper-button class$="[[getLimitBtnClass(100, data.limit)]]" on-tap="setLimit">100</paper-button>
</paper-button>
<paper-button class$="[[getLimitBtnClass(100, data.limit)]]" on-tap="setLimit">100
</paper-button>
</div> </div>
<div> <div>
<div class="g-center"> <div class="g-center">
<paper-icon-button icon="first-page" on-tap="_toFirstPage"></paper-icon-button> <paper-icon-button icon="first-page" on-tap="_toFirstPage"></paper-icon-button>
<paper-icon-button icon="chevron-left" <paper-icon-button icon="chevron-left" on-tap="_toPreviousPage"></paper-icon-button>
on-tap="_toPreviousPage"></paper-icon-button>
<span>[[data.offset]] [[localize('to')]] [[_getEnd(data)]] [[localize('of')]] [[_getSize(data)]]</span> <span>[[data.offset]] [[localize('to')]] [[_getEnd(data)]] [[localize('of')]] [[_getSize(data)]]</span>
<paper-icon-button icon="chevron-right" <paper-icon-button icon="chevron-right" on-tap="_toNextPage"></paper-icon-button>
on-tap="_toNextPage"></paper-icon-button>
<paper-icon-button icon="last-page" on-tap="_toLastPage"></paper-icon-button> <paper-icon-button icon="last-page" on-tap="_toLastPage"></paper-icon-button>
</div> </div>
</div> </div>
@ -446,10 +403,20 @@
value: true, value: true,
observer: 'showFacetsChanged' observer: 'showFacetsChanged'
}, },
facetLimit: {
type: Number
},
maxFacetValues: {
type: Number
},
maxRowsForFacetGeneration: { maxRowsForFacetGeneration: {
type: Number, type: Number,
value: false value: false
}, },
areRowFacetsLimited: {
type: Boolean,
computed: "computeAreRowFacetsLimited(maxRowsForFacetGeneration)"
},
facets: { facets: {
type: Array, type: Array,
value: [] value: []
@ -520,6 +487,9 @@
}, },
/* Computations */ /* Computations */
computeAreRowFacetsLimited: function (maxRowsForFacetGeneration) {
return maxRowsForFacetGeneration > 0;
},
getLimitBtnClass: function (expected, actual) { getLimitBtnClass: function (expected, actual) {
return expected !== actual ? "limitBtn" : "limitBtn bold"; return expected !== actual ? "limitBtn" : "limitBtn bold";
}, },
@ -532,6 +502,9 @@
arrayFilled: function (arr) { arrayFilled: function (arr) {
return !this.arrayEmpty(arr); return !this.arrayEmpty(arr);
}, },
greater: function (v1, v2) {
return v1 > v2;
},
/* Observers */ /* Observers */
observers: [ observers: [
@ -615,10 +588,16 @@
if (this.reportToLoad != null) { if (this.reportToLoad != null) {
for (var i = 0; i < this.reports.length; i++) { for (var i = 0; i < this.reports.length; i++) {
if (this.reports[i].id === this.reportToLoad) { if (this.reports[i].id === this.reportToLoad) {
this.selectedReportIndex = i; if (this.selectedReportIndex === i)
this.onReportSelected();
else {
this.selectedReportIndex = i;
}
break; break;
} }
} }
this.reportToLoad = null;
} }
this.hideLoadingOverlay(); this.hideLoadingOverlay();
@ -635,9 +614,11 @@
// remove all filters // remove all filters
this.allFilters = []; this.allFilters = [];
this.facetLoadDuration = response.data.duration;
// directly set this as the available facets // directly set this as the available facets
this.facets = response.data; this.facets = response.data.facets;
if (response.data.length === 0) { if (this.facets.length === 0) {
this.showFacets = false; this.showFacets = false;
} }
@ -756,21 +737,15 @@
// set the new report id // set the new report id
var report = this.reports[this.selectedReportIndex]; var report = this.reports[this.selectedReportIndex];
this.reportId = report.id; this.reportId = report.id;
var maxRowsForFacetGeneration = report.maxRowsForFacetGeneration;
if (!Strolch.isInteger(maxRowsForFacetGeneration))
this.maxRowsForFacetGeneration = -1;
else
this.maxRowsForFacetGeneration = maxRowsForFacetGeneration;
this.$.ajaxGetFacets.params.limit = this.facetLimit;
this.$.ajaxGetFacets.generateRequest();
Strolch.setQueryParamValue("reportId", this.reportId);
},
reloadFacets: function () { this.maxRowsForFacetGeneration = report.maxRowsForFacetGeneration ? report.maxRowsForFacetGeneration : -1;
if (Strolch.isInteger(this.facetLimit)) { this.maxFacetValues = report.maxFacetValues ? report.maxFacetValues : this.facetLimit;
this.$.ajaxGetFacets.params.limit = this.facetLimit;
this.$.ajaxGetFacets.params.limit = this.maxFacetValues;
Strolch.setQueryParamValue("reportId", this.reportId);
this.async(function () {
this.$.ajaxGetFacets.generateRequest(); this.$.ajaxGetFacets.generateRequest();
} }, 10);
}, },
onSelectionChanged: function (event) { onSelectionChanged: function (event) {
@ -797,7 +772,11 @@
}, },
onRefreshTapped: function (event) { onRefreshTapped: function (event) {
this.$.ajaxPostReport.generateRequest(); var reportId = Strolch.getQueryParamValue("reportId");
if (reportId != null && reportId !== "") {
this.reportToLoad = reportId;
}
this.$.ajaxGetReports.generateRequest();
}, },
onPrintTapped: function (elem) { onPrintTapped: function (elem) {
@ -806,7 +785,7 @@
}, },
reload: function () { reload: function () {
this.$.ajaxGetReports.generateRequest(); this.onRefreshTapped();
}, },
/* Private */ /* Private */