PMCORE-3616

This commit is contained in:
Henry Jordan
2022-01-04 20:12:31 +00:00
committed by Julio Cesar Laura Avendaño
parent dfe0c80606
commit e6afdfcdb0
2 changed files with 83 additions and 114 deletions

View File

@@ -70,7 +70,7 @@ export default {
label: that.$i18n.t("ID_INBOX"), label: that.$i18n.t("ID_INBOX"),
onClick() { onClick() {
that.$emit("updateDataLevel", { that.$emit("updateDataLevel", {
id: that.$i18n.t("ID_INBOX"), id: "inbox",
name: that.$i18n.t("ID_INBOX"), name: that.$i18n.t("ID_INBOX"),
level: 1, level: 1,
color: "#179a6e", color: "#179a6e",
@@ -82,7 +82,7 @@ export default {
label: this.$i18n.t("ID_DRAFT"), label: this.$i18n.t("ID_DRAFT"),
onClick() { onClick() {
that.$emit("updateDataLevel", { that.$emit("updateDataLevel", {
id: that.$i18n.t("ID_DRAFT"), id: "draft",
name: that.$i18n.t("ID_DRAFT"), name: that.$i18n.t("ID_DRAFT"),
level: 1, level: 1,
color: "#feb019", color: "#feb019",
@@ -94,7 +94,7 @@ export default {
label: this.$i18n.t("ID_PAUSED"), label: this.$i18n.t("ID_PAUSED"),
onClick() { onClick() {
that.$emit("updateDataLevel", { that.$emit("updateDataLevel", {
id: that.$i18n.t("ID_PAUSED"), id:"paused",
name: that.$i18n.t("ID_PAUSED"), name: that.$i18n.t("ID_PAUSED"),
level: 1, level: 1,
color: "#008ffb", color: "#008ffb",
@@ -106,7 +106,7 @@ export default {
label: this.$i18n.t("ID_UNASSIGNED"), label: this.$i18n.t("ID_UNASSIGNED"),
onClick() { onClick() {
that.$emit("updateDataLevel", { that.$emit("updateDataLevel", {
id: that.$i18n.t("ID_UNASSIGNED"), id: "unassigned",
name: that.$i18n.t("ID_UNASSIGNED"), name: that.$i18n.t("ID_UNASSIGNED"),
level: 1, level: 1,
color: "#8f99a0", color: "#8f99a0",

View File

@@ -1,25 +1,28 @@
<template> <template>
<div id="v-pm-charts" ref="v-pm-charts" class="v-pm-charts vp-inline-block"> <div id="v-pm-charts" ref="v-pm-charts" class="v-pm-charts vp-inline-block">
<vue-chart-lv-zero v-if="level === 0" @updateDataLevel="updateDataLevel" /> <vue-chart-lv-zero
<vue-chart-lv-one v-if="level === 0"
:key="key1" @updateDataLevel="updateDataLevel"
v-if="level === 1" />
:data="levels" <vue-chart-lv-one
@updateDataLevel="updateDataLevel" :key="key1"
/> v-if="level === 1"
<vue-chart-lv-two :data="levels"
:key="key2" @updateDataLevel="updateDataLevel"
v-if="level === 2" />
:data="levels" <vue-chart-lv-two
@updateDataLevel="updateDataLevel" :key="key2"
/> v-if="level === 2"
<vue-chart-lv-three :data="levels"
:key="key3" @updateDataLevel="updateDataLevel"
v-if="level === 3" />
:data="levels" <vue-chart-lv-three
@updateDataLevel="updateDataLevel" :key="key3"
/> v-if="level === 3"
</div> :data="levels"
@updateDataLevel="updateDataLevel"
/>
</div>
</template> </template>
<script> <script>
@@ -30,97 +33,63 @@ import VueChartLvThree from "./VueChartLvThree.vue";
import _ from "lodash"; import _ from "lodash";
export default { export default {
name: "VueCharts", name: "VueCharts",
mixins: [], mixins: [],
components: { components: {
VueChartLvZero, VueChartLvZero,
VueChartLvOne, VueChartLvOne,
VueChartLvTwo, VueChartLvTwo,
VueChartLvThree, VueChartLvThree,
}, },
props: ["levels"], props: ["levels"],
data() { data() {
let that = this; let that = this;
return { return {
key1: _.random(0, 100), key1: _.random(0, 100),
key2: _.random(0, 100), key2: _.random(0, 100),
key3: _.random(0, 100), key3: _.random(0, 100),
settingsBreadCrumbs: [ settingsBreadCrumbs: [
{ {
class: "fas fa-info-circle", class: "fas fa-info-circle",
onClick() {}, onClick() {},
},
],
};
},
created() {},
mounted() {},
watch: {},
computed: {
level: function() {
return _.find(this.levels, { active: true }).level;
}, },
],
};
},
created() {},
mounted() {},
watch: {},
computed: {
level: function () {
return _.find(this.levels, { active: true }).level;
}, },
}, updated() {},
updated() {}, beforeCreate() {},
beforeCreate() {}, methods: {
methods: { /**
/** * Set data level 0
* Set data level 0 */
*/ updateDataLevel(data) {
updateDataLevel(data) { this.$emit("onChangeLevel", data);
this.$emit("onChangeLevel", data); this.updateKey(data.level);
this.updateKey(data.level); },
updateKey(level) {
switch (level) {
case 0:
break;
case 1:
this.key1++;
break;
case 2:
this.key2++;
break;
case 3:
this.key3++;
break;
}
},
}, },
updateKey(level) {
switch (level) {
case 0:
break;
case 1:
this.key1++;
break;
case 2:
this.key2++;
break;
case 3:
this.key3++;
break;
}
},
/**
* Format data for data beadcrumbs
*/
dataBreadCrumbs() {
let res = [],
that = this,
index = 0;
_.each(this.levels, (el) => {
if (index <= that.level && el.data) {
res.push({
label: el.name,
onClick() {
this.$emit("onChangeLevel", el);
},
data: el,
});
}
});
switch (this.level) {
case 0:
return {
data: res,
settings: this.settingsBreadCrumbs,
};
break;
default:
return {
data: res,
settings: this.settingsBreadCrumbs,
};
break;
}
},
},
}; };
</script> </script>
<style> <style></style>
</style>