Skip to content

Commit

Permalink
Manage indicator parameters
Browse files Browse the repository at this point in the history
  • Loading branch information
alexisrolland committed Nov 10, 2019
1 parent e5a6a8e commit d2c7d19
Show file tree
Hide file tree
Showing 19 changed files with 746 additions and 11 deletions.
35 changes: 35 additions & 0 deletions app/init/src/components/indicator/IndicatorButtonAddParameter.vue
Original file line number Diff line number Diff line change
@@ -0,0 +1,35 @@
<template>
<span>
<button v-if="show"
type="button"
class="btn btn-success"
v-on:click="editParameter"
data-toggle="modal"
data-target="#ParameterModalBox">
Create Parameter
</button>
</span>
</template>

<script>
import ParameterModalBox from "../parameter/ParameterModalBox.vue";
import Mixins from "../utils/Mixins.vue";
export default {
mixins: [Mixins],
components: {
"add-parameter-modal-box": ParameterModalBox,
},
computed: {
show() {
let roles = ["standard", "advanced", "admin"];
return roles.includes(this.$store.state.currentUser.role);
}
},
methods: {
editParameter() {
this.$emit("editParameter", null);
}
}
};
</script>
Original file line number Diff line number Diff line change
Expand Up @@ -11,7 +11,7 @@
export default {
computed: {
show() {
let roles = ["admin"];
let roles = ["standard", "advanced", "admin"];
return roles.includes(this.$store.state.currentUser.role);
}
}
Expand Down
4 changes: 2 additions & 2 deletions app/init/src/components/indicator/IndicatorButtonSave.vue
Original file line number Diff line number Diff line change
Expand Up @@ -50,7 +50,7 @@ export default {
}
);
}
// If indicator.id does not exist, create a new data source
// If indicator.id does not exist, create a new indicator
else {
let payload = {
query: this.$store.state.mutationCreateIndicator,
Expand All @@ -60,7 +60,7 @@ export default {
description: this.indicator.description,
indicatorTypeId: this.indicator.indicatorTypeId,
indicatorGroupId: this.indicator.indicatorGroupId,
executionOrder: this.indicator.executionOrder,
executionOrder: parseInt(this.indicator.executionOrder),
flagActive: this.indicator.flagActive
}
}
Expand Down
72 changes: 69 additions & 3 deletions app/init/src/components/indicator/IndicatorForm.vue
Original file line number Diff line number Diff line change
Expand Up @@ -5,7 +5,7 @@
<form>
<div class="form-row">
<div class="col-md-4">
<!-- Data Source Form -->
<!-- Indicator Form -->
<div class="form-group required">
<label for="indicatorName" class="col-form-label">
Name:
Expand Down Expand Up @@ -82,6 +82,33 @@
</div>
</div>
</form>

<!-- Parameters -->
<h1 class="mt-5" v-if="indicator.id">Indicator Parameters</h1>
<p>
<indicator-button-create-parameter
v-if="indicator.id"
v-on:editParameter="getParameter">
</indicator-button-create-parameter>
</p>

<!-- Parameter table -->
<parameter-table
v-if="indicator.id"
v-bind:parameters="parameters"
v-on:editParameter="getParameter"
v-bind:key="refreshTable">
</parameter-table>

<!-- Modal box to update parameters -->
<parameter-modal-box
v-if="indicator.id"
v-bind:indicatorId="indicator.id"
v-bind:indicatorTypeId="indicator.indicatorTypeId"
v-bind:parameter="selectedParameter"
v-on:addParameter="addParameter"
v-on:removeParameter="removeParameter">
</parameter-modal-box>
</div>
</template>

Expand All @@ -92,7 +119,11 @@ import IndicatorButtonSave from "./IndicatorButtonSave.vue";
import IndicatorButtonClose from "./IndicatorButtonClose.vue";
import IndicatorButtonDelete from "./IndicatorButtonDelete.vue";
import MetaDataCard from "../utils/MetaDataCard.vue";
import IndicatorButtonAddParameter from "./IndicatorButtonAddParameter.vue";
import IndicatorParameterTable from "./IndicatorParameterTable.vue";
import ParameterModalBox from "../parameter/ParameterModalBox.vue";
import Mixins from "../utils/Mixins.vue";
import remove from "lodash/remove";
export default {
mixins: [Mixins],
Expand All @@ -102,16 +133,29 @@ export default {
"indicator-meta-data": MetaDataCard,
"indicator-button-save": IndicatorButtonSave,
"indicator-button-close": IndicatorButtonClose,
"indicator-button-delete": IndicatorButtonDelete
"indicator-button-delete": IndicatorButtonDelete,
"indicator-button-create-parameter": IndicatorButtonAddParameter,
"parameter-table": IndicatorParameterTable,
"parameter-modal-box": ParameterModalBox
},
data: function() {
return {
indicator: {}
indicator: {},
selectedParameter: {
id: null,
parameterTypeId: null,
value: null,
indicatorId: null
},
refreshTable: 0 // Key used to force refresh of parameter table when deleting parameter
};
},
computed: {
indicatorId() {
return this.$route.params.indicatorId;
},
parameters() {
return this.indicator.parametersByIndicatorId.nodes;
}
},
created: function() {
Expand Down Expand Up @@ -158,6 +202,28 @@ export default {
} else {
this.indicator["indicatorGroupId"] = null;
}
},
getParameter(value) {
// Get parameter to be created or updated
if (value != null) {
this.selectedParameter = value;
} else {
this.selectedParameter['id'] = null;
this.selectedParameter['parameterTypeId'] = null;
this.selectedParameter['value'] = null;
this.selectedParameter['indicatorId'] = null;
}
},
addParameter(value) {
// Add parameter to parameter table
this.indicator.parametersByIndicatorId.nodes.push(value);
},
removeParameter(value) {
// Remove parameter from parameter table
remove(this.indicator.parametersByIndicatorId.nodes, function(parameter) {
return parameter.id == value;
});
this.refreshTable += 1; // Force refresh of parameter table
}
}
};
Expand Down
65 changes: 65 additions & 0 deletions app/init/src/components/indicator/IndicatorParameterTable.vue
Original file line number Diff line number Diff line change
@@ -0,0 +1,65 @@
<template>
<div>
<table class="table table-striped table-dark table-hover table-borderless">
<thead>
<tr>
<th scope="col">
Parameter Type
</th>
<th scope="col">
Parameter Value
</th>
<th scope="col">
Actions
</th>
</tr>
</thead>
<tbody>
<tr v-for="parameter in parameters" v-bind:key="parameter.id">
<td>
{{ parameter.parameterTypeByParameterTypeId.name }}
</td>
<td>
{{ parameter.value }}
</td>
<td>
<span v-if="showEditParameter"
class="badge badge-secondary"
v-on:click="editParameter(parameter)"
data-toggle="modal"
data-target="#ParameterModalBox">
Edit Parameter
</span>
</td>
</tr>
</tbody>
</table>
</div>
</template>

<script>
import Mixins from "../utils/Mixins.vue";
export default {
mixins: [Mixins],
props: {
parameters: Array
},
data: function() {
return {
selectedParameter: null
};
},
computed: {
showEditParameter() {
let roles = ["standard", "advanced", "admin"];
return roles.includes(this.$store.state.currentUser.role);
}
},
methods: {
editParameter(parameter) {
this.$emit("editParameter", parameter);
}
}
};
</script>
Original file line number Diff line number Diff line change
Expand Up @@ -4,7 +4,7 @@
Indicator Group:
</label>
<treeselect
placeholder="Select data source type"
placeholder="Select indicator group"
v-model="selectedValue"
v-bind:options="options"
v-bind:multiple="false"
Expand Down
Original file line number Diff line number Diff line change
Expand Up @@ -45,7 +45,7 @@ export default {
}
);
}
// If indicatorGroup.id does not exist, create a new data source
// If indicatorGroup.id does not exist, create a new indicator group
else {
let payload = {
query: this.$store.state.mutationCreateIndicatorGroup,
Expand Down
Original file line number Diff line number Diff line change
Expand Up @@ -5,7 +5,7 @@
<form>
<div class="form-row">
<div class="col-md-4">
<!-- Data Source Form -->
<!-- Indicator Group Form -->
<div class="form-group required">
<label for="indicatorGroupName" class="col-form-label">
Name:
Expand Down
5 changes: 5 additions & 0 deletions app/init/src/components/parameter/ParameterButtonClose.vue
Original file line number Diff line number Diff line change
@@ -0,0 +1,5 @@
<template>
<button class="btn btn-outline-secondary float-right ml-1" type="button" data-dismiss="modal">
Close
</button>
</template>
51 changes: 51 additions & 0 deletions app/init/src/components/parameter/ParameterButtonDelete.vue
Original file line number Diff line number Diff line change
@@ -0,0 +1,51 @@
<template>
<button v-if="show" type="button" class="btn btn-danger" v-on:click="deleteObject" data-dismiss="modal">
Delete
</button>
</template>

<script>
import Mixins from "../utils/Mixins.vue";
export default {
mixins: [Mixins],
props: {
parameterId: Number
},
computed: {
show() {
let roles = ["standard", "advanced", "admin"];
return roles.includes(this.$store.state.currentUser.role);
}
},
methods: {
deleteObject() {
// Method to delete object
let payload = {
query: this.$store.state.mutationDeleteParameter,
variables: {
id: this.parameterId
}
};
let headers = {};
if (this.$session.exists()) {
headers = { Authorization: "Bearer " + this.$session.get("jwt") };
}
this.$http.post(this.$store.state.graphqlUrl, payload, { headers }).then(
function(response) {
if (response.data.errors) {
this.displayError(response);
} else {
// Send new parameter to parent to update parameter table
this.$emit("removeParameter", this.parameterId);
}
},
// Error callback
function(response) {
this.displayError(response);
}
);
}
}
};
</script>
Loading

0 comments on commit d2c7d19

Please sign in to comment.