removing batchCodesSelect
This commit is contained in:
@@ -2,7 +2,6 @@ class BatchCodeDetailsView {
|
|||||||
|
|
||||||
#uiContainer;
|
#uiContainer;
|
||||||
#headingElement;
|
#headingElement;
|
||||||
#batchCodesSelectElement;
|
|
||||||
#adverseReactionReportsChartView;
|
#adverseReactionReportsChartView;
|
||||||
#histogramChartView;
|
#histogramChartView;
|
||||||
#chartWithSlider;
|
#chartWithSlider;
|
||||||
@@ -10,7 +9,6 @@ class BatchCodeDetailsView {
|
|||||||
constructor(uiContainer) {
|
constructor(uiContainer) {
|
||||||
this.#uiContainer = uiContainer
|
this.#uiContainer = uiContainer
|
||||||
this.#headingElement = this.#uiContainer.querySelector(".heading");
|
this.#headingElement = this.#uiContainer.querySelector(".heading");
|
||||||
this.#batchCodesSelectElement = new ElementWithSingleChangeEventListener(this.#uiContainer.querySelector("#batchCodesSelect"));
|
|
||||||
this.#adverseReactionReportsChartView = new AdverseReactionReportsChartView(this.#uiContainer.querySelector('#adverseReactionReportsChartView'));
|
this.#adverseReactionReportsChartView = new AdverseReactionReportsChartView(this.#uiContainer.querySelector('#adverseReactionReportsChartView'));
|
||||||
this.#chartWithSlider = this.#uiContainer.querySelector('.chartWithSlider');
|
this.#chartWithSlider = this.#uiContainer.querySelector('.chartWithSlider');
|
||||||
this.#histogramChartView = new HistogramChartView(this.#chartWithSlider.querySelector("canvas"));
|
this.#histogramChartView = new HistogramChartView(this.#chartWithSlider.querySelector("canvas"));
|
||||||
@@ -36,8 +34,7 @@ class BatchCodeDetailsView {
|
|||||||
#displayHistogramViewForHistoDescrs(histoDescrs) {
|
#displayHistogramViewForHistoDescrs(histoDescrs) {
|
||||||
this.#displayHeading(histoDescrs.batchcode, histoDescrs['Company']);
|
this.#displayHeading(histoDescrs.batchcode, histoDescrs['Company']);
|
||||||
this.#displayAdverseReactionReportsChart(histoDescrs);
|
this.#displayAdverseReactionReportsChart(histoDescrs);
|
||||||
this.#displaySelectBatchcodeCombination(histoDescrs.histograms);
|
this.#displayHistogram(histoDescrs);
|
||||||
this.#displayHistogram(histoDescrs.histograms[0]);
|
|
||||||
}
|
}
|
||||||
|
|
||||||
#displayHeading(batchcode, company) {
|
#displayHeading(batchcode, company) {
|
||||||
@@ -54,15 +51,6 @@ class BatchCodeDetailsView {
|
|||||||
});
|
});
|
||||||
}
|
}
|
||||||
|
|
||||||
#displaySelectBatchcodeCombination(histograms) {
|
|
||||||
BatchcodeCombinationSelection.configureSelectBatchcodeCombinationElement(
|
|
||||||
{
|
|
||||||
batchCodesSelectElement: this.#batchCodesSelectElement,
|
|
||||||
histograms: histograms,
|
|
||||||
onSelect: histoDescr => this.#displayHistogram(histoDescr)
|
|
||||||
});
|
|
||||||
}
|
|
||||||
|
|
||||||
#displayHistogram(histoDescr) {
|
#displayHistogram(histoDescr) {
|
||||||
this.#histogramChartView.displayChart(histoDescr);
|
this.#histogramChartView.displayChart(histoDescr);
|
||||||
this.#createSlider(
|
this.#createSlider(
|
||||||
@@ -80,7 +68,7 @@ class BatchCodeDetailsView {
|
|||||||
|
|
||||||
#slice(histoDescr, { start, endInclusive }) {
|
#slice(histoDescr, { start, endInclusive }) {
|
||||||
return {
|
return {
|
||||||
batchcodes: histoDescr.batchcodes,
|
batchcode: histoDescr.batchcode,
|
||||||
histogram: Utils.sliceDict(histoDescr.histogram, start, endInclusive + 1)
|
histogram: Utils.sliceDict(histoDescr.histogram, start, endInclusive + 1)
|
||||||
};
|
};
|
||||||
}
|
}
|
||||||
|
|||||||
@@ -1,28 +0,0 @@
|
|||||||
class BatchcodeCombinationSelection {
|
|
||||||
|
|
||||||
static configureSelectBatchcodeCombinationElement({ batchCodesSelectElement, histograms, onSelect }) {
|
|
||||||
this.#setBatchcodeCombinationOptions(batchCodesSelectElement.element, histograms);
|
|
||||||
batchCodesSelectElement.setSingleChangeEventListener(
|
|
||||||
event => {
|
|
||||||
const histoDescr = histograms[event.target.value];
|
|
||||||
onSelect(histoDescr);
|
|
||||||
});
|
|
||||||
onSelect(histograms[0]);
|
|
||||||
}
|
|
||||||
|
|
||||||
static #setBatchcodeCombinationOptions(batchCodesSelectElement, histograms) {
|
|
||||||
UIUtils.clear(batchCodesSelectElement);
|
|
||||||
this.#getBatchcodeCombinationOptions(histograms).forEach(option => batchCodesSelectElement.add(option));
|
|
||||||
}
|
|
||||||
|
|
||||||
static #getBatchcodeCombinationOptions(histograms) {
|
|
||||||
return histograms.map(this.#getBatchcodeCombinationOption);
|
|
||||||
}
|
|
||||||
|
|
||||||
static #getBatchcodeCombinationOption(histoDescr, index) {
|
|
||||||
const option = document.createElement("option");
|
|
||||||
option.text = histoDescr.batchcodes.join(', ');
|
|
||||||
option.value = index;
|
|
||||||
return option;
|
|
||||||
}
|
|
||||||
}
|
|
||||||
@@ -1,18 +0,0 @@
|
|||||||
class ElementWithSingleChangeEventListener {
|
|
||||||
|
|
||||||
element;
|
|
||||||
#changeEventListenerOfElement;
|
|
||||||
|
|
||||||
constructor(element) {
|
|
||||||
this.element = element;
|
|
||||||
}
|
|
||||||
|
|
||||||
setSingleChangeEventListener(singleChangeEventListener) {
|
|
||||||
const eventType = 'change';
|
|
||||||
if (this.#changeEventListenerOfElement !== undefined) {
|
|
||||||
this.element.removeEventListener(eventType, this.#changeEventListenerOfElement);
|
|
||||||
}
|
|
||||||
this.element.addEventListener(eventType, singleChangeEventListener);
|
|
||||||
this.#changeEventListenerOfElement = singleChangeEventListener;
|
|
||||||
}
|
|
||||||
}
|
|
||||||
@@ -5,6 +5,8 @@ class HistoDescrsProvider {
|
|||||||
.then(response => response.json())
|
.then(response => response.json())
|
||||||
.then(histoDescrs => {
|
.then(histoDescrs => {
|
||||||
histoDescrs.histograms.sort((histoDescr1, histoDescr2) => histoDescr1.batchcodes.length - histoDescr2.batchcodes.length);
|
histoDescrs.histograms.sort((histoDescr1, histoDescr2) => histoDescr1.batchcodes.length - histoDescr2.batchcodes.length);
|
||||||
|
histoDescrs.histogram = histoDescrs.histograms[0].histogram;
|
||||||
|
delete histoDescrs.histograms;
|
||||||
return histoDescrs;
|
return histoDescrs;
|
||||||
});
|
});
|
||||||
}
|
}
|
||||||
|
|||||||
@@ -31,7 +31,7 @@ class HistogramChartView {
|
|||||||
return {
|
return {
|
||||||
labels: symptoms,
|
labels: symptoms,
|
||||||
datasets: [{
|
datasets: [{
|
||||||
label: histoDescr.batchcodes.join(', '),
|
label: histoDescr.batchcode,
|
||||||
data: frequencies
|
data: frequencies
|
||||||
}]
|
}]
|
||||||
};
|
};
|
||||||
|
|||||||
@@ -30,13 +30,11 @@
|
|||||||
<script src="https://cdn.jsdelivr.net/npm/chart.js@4.2.0/dist/chart.umd.min.js"></script>
|
<script src="https://cdn.jsdelivr.net/npm/chart.js@4.2.0/dist/chart.umd.min.js"></script>
|
||||||
<script src="./Utils.js"></script>
|
<script src="./Utils.js"></script>
|
||||||
<script src="./UIUtils.js"></script>
|
<script src="./UIUtils.js"></script>
|
||||||
<script src="./ElementWithSingleChangeEventListener.js"></script>
|
|
||||||
<script src="./GoogleAnalytics.js"></script>
|
<script src="./GoogleAnalytics.js"></script>
|
||||||
<script src="./BatchCodeSelectInitializer.js"></script>
|
<script src="./BatchCodeSelectInitializer.js"></script>
|
||||||
<script src="./HistoDescrsProvider.js"></script>
|
<script src="./HistoDescrsProvider.js"></script>
|
||||||
<script src="./HistogramChartView.js"></script>
|
<script src="./HistogramChartView.js"></script>
|
||||||
<script src="./AdverseReactionReportsChartView.js"></script>
|
<script src="./AdverseReactionReportsChartView.js"></script>
|
||||||
<script src="./BatchcodeCombinationSelection.js"></script>
|
|
||||||
<script src="./BatchCodeDetailsView.js"></script>
|
<script src="./BatchCodeDetailsView.js"></script>
|
||||||
<script>
|
<script>
|
||||||
$(document).ready(function () {
|
$(document).ready(function () {
|
||||||
@@ -49767,10 +49765,6 @@
|
|||||||
<h3 class="heading"></h3>
|
<h3 class="heading"></h3>
|
||||||
<canvas id="adverseReactionReportsChartView"></canvas>
|
<canvas id="adverseReactionReportsChartView"></canvas>
|
||||||
<div id="selectBatchcodeCombination">
|
<div id="selectBatchcodeCombination">
|
||||||
<label>Select batchcode combination:
|
|
||||||
<select id="batchCodesSelect" name="batchcodes">
|
|
||||||
</select>
|
|
||||||
</label>
|
|
||||||
<div class="chartWithSlider">
|
<div class="chartWithSlider">
|
||||||
<div class="chartContainer">
|
<div class="chartContainer">
|
||||||
<canvas class="canvas"></canvas>
|
<canvas class="canvas"></canvas>
|
||||||
|
|||||||
Reference in New Issue
Block a user