From 21847397411700be7a5878092c19ab2a15af5835 Mon Sep 17 00:00:00 2001
From: Henry Jordan <jonathan.quispe@processmaker.com>
Date: Mon, 13 Sep 2021 20:00:12 +0000
Subject: [PATCH 1/4] PMCORE-3312

---
 .../js/home/TaskMetrics/ProcessPopover.vue    | 28 +++++++------------
 .../js/home/TaskMetrics/VueChartLvOne.vue     | 12 ++++++--
 2 files changed, 20 insertions(+), 20 deletions(-)

diff --git a/resources/assets/js/home/TaskMetrics/ProcessPopover.vue b/resources/assets/js/home/TaskMetrics/ProcessPopover.vue
index 248089870..aa6e3fc31 100644
--- a/resources/assets/js/home/TaskMetrics/ProcessPopover.vue
+++ b/resources/assets/js/home/TaskMetrics/ProcessPopover.vue
@@ -35,7 +35,7 @@
         <b-form-group>
           <b-form-checkbox-group
             v-model="localSelected"
-            :options="results"
+            :options="options"
             value-field="key"
             text-field="value"
             name="flavour-2a"
@@ -60,19 +60,17 @@
 <script>
 export default {
   name: "ProcessPopover",
-  props: ["target"],
+  props: ["target", "options"],
   data() {
     return {
-      options: [],
+      timeCounter:"",
       text: "",
-      results: [],
       allColumns: false,
       localSelected: [],
       selected: [],
     };
   },
   mounted() {
-    this.results = this.options;
     this.localSelected = this.selected;
   },
   methods: {
@@ -82,7 +80,6 @@ export default {
      */
     setOptions(options) {
       this.options = options;
-      this.results = options;
     },
     /**
      * Setter the selected options
@@ -118,29 +115,24 @@ export default {
      * Search in the column name
      */
     search() {
-      let txt = this.text.toLowerCase(),
-        val,
-        opts = [];
-
-      opts = _.filter(this.options, function (o) {
-        val = o.value.toLowerCase();
-
-        return val.search(txt) != -1;
-      });
-
-      this.results = opts;
+      let that = this;
+      clearTimeout(this.timeCounter);
+      this.timeCounter = setTimeout(()=>{
+          that.$emit("onChange", this.text.toLowerCase())
+      }, 500);
     },
     /**
      * Toogle all options in popover
      */
     toogleAllColumns() {
+
       let res = [];
       if (this.allColumns) {
         _.each(this.options, function (o) {
           res.push(o.key);
         });
       }
-      this.selected = res;
+      this.localSelected = res;
     },
     /**
      * Handler when change options event
diff --git a/resources/assets/js/home/TaskMetrics/VueChartLvOne.vue b/resources/assets/js/home/TaskMetrics/VueChartLvOne.vue
index 8f716b39f..1be8793f6 100644
--- a/resources/assets/js/home/TaskMetrics/VueChartLvOne.vue
+++ b/resources/assets/js/home/TaskMetrics/VueChartLvOne.vue
@@ -11,6 +11,7 @@
         />
         <ProcessPopover
           :options="optionsProcesses"
+          @onChange="onChangeSearchPopover"
           target="pm-task-process"
           ref="pm-task-process"
           @onUpdateColumnSettings="onUpdateColumnSettings"
@@ -184,10 +185,10 @@ export default {
     /**
      * Get Processes form API
      */
-    getProcesses() {
+    getProcesses(query) {
       let that = this;
       Api.filters
-        .processList("")
+        .processList(query || "")
         .then((response) => {
           that.formatDataProcesses(response.data);
           that.changeOption({
@@ -334,6 +335,13 @@ export default {
         id: 0,
       });
     },
+    /**
+     * Event handler change input search popover
+     * @param {string} query - value in popover search input
+     */
+    onChangeSearchPopover(query){
+      this.getProcesses(query);
+    }
   },
 };
 </script>

From b98c02df8596bc8db4de52058bf40b73526f7195 Mon Sep 17 00:00:00 2001
From: Henry Jordan <jonathan.quispe@processmaker.com>
Date: Mon, 13 Sep 2021 20:01:45 +0000
Subject: [PATCH 2/4] PMCORE-3312

---
 resources/assets/js/home/TaskMetrics/ProcessPopover.vue | 1 -
 1 file changed, 1 deletion(-)

diff --git a/resources/assets/js/home/TaskMetrics/ProcessPopover.vue b/resources/assets/js/home/TaskMetrics/ProcessPopover.vue
index aa6e3fc31..68c8e24ea 100644
--- a/resources/assets/js/home/TaskMetrics/ProcessPopover.vue
+++ b/resources/assets/js/home/TaskMetrics/ProcessPopover.vue
@@ -125,7 +125,6 @@ export default {
      * Toogle all options in popover
      */
     toogleAllColumns() {
-
       let res = [];
       if (this.allColumns) {
         _.each(this.options, function (o) {

From 6ded42411d95cb5a5148dc12622d92a20a116f7f Mon Sep 17 00:00:00 2001
From: Henry Jordan <jonathan.quispe@processmaker.com>
Date: Tue, 14 Sep 2021 13:54:19 +0000
Subject: [PATCH 3/4] update

---
 resources/assets/js/home/TaskMetrics/VueCharts.vue | 7 ++++---
 1 file changed, 4 insertions(+), 3 deletions(-)

diff --git a/resources/assets/js/home/TaskMetrics/VueCharts.vue b/resources/assets/js/home/TaskMetrics/VueCharts.vue
index 063ff49c2..2313fb54c 100644
--- a/resources/assets/js/home/TaskMetrics/VueCharts.vue
+++ b/resources/assets/js/home/TaskMetrics/VueCharts.vue
@@ -36,6 +36,7 @@ import VueChartLvZero from "./VueChartLvZero.vue";
 import VueChartLvOne from "./VueChartLvOne.vue";
 import VueChartLvTwo from "./VueChartLvTwo.vue";
 import VueChartLvThree from "./VueChartLvThree.vue";
+import _ from "lodash";
 
 export default {
   name: "VueCharts",
@@ -51,9 +52,9 @@ export default {
     let that = this;
     return {
       level: 0,
-      key1: 1,
-      key2: 1,
-      key3: 1,
+      key1: _.random(0,100),
+      key2: _.random(0,100),
+      key3: _.random(0,100),
       data: [],
       settingsBreadCrumbs: [
         {

From d68e91dfb558169ee8576c2b462b877a920b5312 Mon Sep 17 00:00:00 2001
From: Henry Jordan <jonathan.quispe@processmaker.com>
Date: Tue, 14 Sep 2021 13:55:53 +0000
Subject: [PATCH 4/4] update

---
 resources/assets/js/home/TaskMetrics/VueChartLvOne.vue | 1 +
 1 file changed, 1 insertion(+)

diff --git a/resources/assets/js/home/TaskMetrics/VueChartLvOne.vue b/resources/assets/js/home/TaskMetrics/VueChartLvOne.vue
index 1be8793f6..b1ffe31f3 100644
--- a/resources/assets/js/home/TaskMetrics/VueChartLvOne.vue
+++ b/resources/assets/js/home/TaskMetrics/VueChartLvOne.vue
@@ -184,6 +184,7 @@ export default {
     },
     /**
      * Get Processes form API
+     * @param {string} query - Text value in search popover
      */
     getProcesses(query) {
       let that = this;