diff options
author | Thomas Duval <thomas.duval@orange.com> | 2020-06-03 10:06:52 +0200 |
---|---|---|
committer | Thomas Duval <thomas.duval@orange.com> | 2020-06-03 10:06:52 +0200 |
commit | 7bb53c64da2dcf88894bfd31503accdd81498f3d (patch) | |
tree | 4310e12366818af27947b5e2c80cb162da93a4b5 /dashboard/src/components/model/Model.vue | |
parent | cbea4e360e9bfaa9698cf7c61c83c96a1ba89b8c (diff) |
Update to new version 5.4HEADstable/jermamaster
Signed-off-by: Thomas Duval <thomas.duval@orange.com>
Change-Id: Idcd868133d75928a1ffd74d749ce98503e0555ea
Diffstat (limited to 'dashboard/src/components/model/Model.vue')
-rw-r--r-- | dashboard/src/components/model/Model.vue | 112 |
1 files changed, 112 insertions, 0 deletions
diff --git a/dashboard/src/components/model/Model.vue b/dashboard/src/components/model/Model.vue new file mode 100644 index 00000000..82ad992d --- /dev/null +++ b/dashboard/src/components/model/Model.vue @@ -0,0 +1,112 @@ +<template> + <div> + <template v-if="edit"> + <form> + <div class="form-group"> + <label for="modelName">Name</label> + <input + type="text" + name="name" + v-model="modelEdit.name" + v-validate="'alpha_dash|required|min:3'" + class="form-control" + id="modelName" + > + </div> + <div class="form-group"> + <label for="modelDescription">Description</label> + <textarea + name="description" + v-model="modelEdit.description" + v-validate="'required|min:3'" + class="form-control" + ></textarea> + </div> + <ul> + <li v-for="error in errors.all()" :key="error.id">{{ error }}</li> + </ul> + <button type="button" class="btn btn-secondary" @click="edit = false">Cancel</button> + <span> </span> + <button type="button" :disabled="errors.any()" class="btn btn-primary" @click="updateModel()">Update</button> + </form> + </template> + <template v-else> + <h3 class="list-group-item-heading inline">{{ model.name }}</h3> + <div class="pull-right"> + <button type="button" class="fa fa-trash btn btn-dark btn-sm" @click="removeModel()" title="Remove Model"></button> + <button type="button" class="fa fa-edit btn btn-dark btn-sm" @click="updatingModel()" title="Edit Model"></button> + </div> + <p class="list-group-item-text">{{ model.description }}</p> + + <AddMetarule v-if="addMetarule" :model="model" @close="addMetarule = false"></AddMetarule> + <details class="list-group-item-text" v-else> + <summary> + <h4 class="inline-block width-200"> + {{ model.meta_rules.length + ' meta rule' + (model.meta_rules.length > 1 ? 's' : ' ') }} + <i class="fa fa-question-circle" v-if="modelHelpStrings.metarule" data-toggle="tooltip" :title="modelHelpStrings.metarule"></i> + </h4> + <button + type="button" + class="fa fa-plus btn btn-dark btn-sm" + @click="addMetarule = true" + title="Add Meta Rule" + ></button> + </summary> + <div class="list-group"> + <Metarule + v-for="metarule in model.meta_rules" + :key="metarule.id" + :metarule="metarule" + :model="model" + ></Metarule> + </div> + </details> + </template> + <hr> + </div> +</template> + +<script> +import Metarule from "./Metarule.vue"; +import ModelService from "./../../services/Model.service.js"; +import AddMetarule from "./AddMetarule.vue"; +import util from "./../../services/Util.service.js"; +import helpstrings from "../../helpstrings"; + +export default { + name: "model", + data: function() { + return { + edit: false, + addMetarule: false, + modelEdit: {}, + modelHelpStrings: {} + }; + }, + components: { + Metarule, + AddMetarule + }, + props: { + model: Object + }, + mounted() { + this.modelHelpStrings = helpstrings.model; + }, + methods: { + updatingModel() { + this.modelEdit = util.clone(this.model); + this.edit = true; + }, + updateModel() { + this.edit = false; + ModelService.updateModel(this.modelEdit); + }, + removeModel() { + if (confirm('Are you sure to delete this Model?')) { + ModelService.removeModel(this.model); + } + } + } +}; +</script> |