diff --git a/resources/assets/js/api/Cases.js b/resources/assets/js/api/Cases.js
index d890f5851..21f380c18 100644
--- a/resources/assets/js/api/Cases.js
+++ b/resources/assets/js/api/Cases.js
@@ -125,6 +125,14 @@ export let cases = {
             window.config.SYS_URI +
             `cases/ajaxListener`, params);
     },
+    actions(data) {
+        var params = new URLSearchParams();
+        params.append('action', 'getCaseMenu');
+        params.append('app_status', 'TO_DO');
+        return axios.post(window.config.SYS_SERVER +
+            window.config.SYS_URI +
+            `cases/ajaxListener`, params);
+    },
     unpause(data) {
         var params = new URLSearchParams();
         params.append('action', 'unpauseCase');
diff --git a/resources/assets/js/components/home/caseDetail/CaseSummary.vue b/resources/assets/js/components/home/caseDetail/CaseSummary.vue
index 29b3bfcf0..0dd0e9301 100644
--- a/resources/assets/js/components/home/caseDetail/CaseSummary.vue
+++ b/resources/assets/js/components/home/caseDetail/CaseSummary.vue
@@ -52,8 +52,9 @@
         </div>
       </div>
       <br />
+      <div v-if="data.onClick">
       <h6 class="card-subtitle mb-2 text-muted">{{ data.titleActions }}</h6>
-      <div v-if="data.btnType" class="container v-case-summary-center">
+      <div class="container v-case-summary-center">
         <button
           type="button"
           class="btn btn-success btn-sm"
@@ -62,14 +63,6 @@
           {{ data.btnLabel }}
         </button>
       </div>
-      <div v-else class="container v-case-summary-center">
-        <button
-          type="button"
-          class="btn btn-success btn-sm"
-          @click="data.onClick"
-        >
-          {{ data.btnLabel }}
-        </button>
       </div>
     </div>
   </div>
diff --git a/resources/assets/js/home/CaseDetail.vue b/resources/assets/js/home/CaseDetail.vue
index 0bd9e9e45..7fc2b5ada 100644
--- a/resources/assets/js/home/CaseDetail.vue
+++ b/resources/assets/js/home/CaseDetail.vue
@@ -241,7 +241,9 @@ export default {
       this.dataAttachedDocuments.items = att;
     },
     getDataCaseSummary() {
-      let that = this;
+      let action,
+          option, 
+          that = this;
       Api.cases
         .casesummary(this.dataCase)
         .then((response) => {
@@ -252,9 +254,7 @@ export default {
             titleActions: this.$i18n.t("ID_ACTIONS"),
             btnLabel: this.$i18n.t("ID_CANCEL_CASE"),
             btnType: false,
-            onClick: () => {
-              that.$refs["modal-cancel-case"].show();
-            },
+            onClick: null,
             label: {
               numberCase: data[2].label,
               process: data[0].label,
@@ -274,6 +274,19 @@ export default {
               duration: response.data[11].value.split(" ")[1],
             },
           };
+          // Hack for identify the cancel case button
+          Api.cases
+            .actions(this.dataCase).then((response)=>{
+              action = _.find(response.data, function(o) { return o.id == "ACTIONS"; });
+              if(action){
+                option = _.find(action.options, function(o) { return o.fn == "cancelCase"; });
+                if(!option.hide){
+                  that.dataCaseSummary.onClick = () => {
+                    that.$refs["modal-cancel-case"].show();
+                  };      
+                }
+              }
+            });
         })
         .catch((err) => {
           throw new Error(err);
diff --git a/resources/assets/js/home/Draft.vue b/resources/assets/js/home/Draft.vue
index e8e78b600..13017eb64 100644
--- a/resources/assets/js/home/Draft.vue
+++ b/resources/assets/js/home/Draft.vue
@@ -196,15 +196,17 @@ export default {
      */
     openCaseDetail(item) {
       let that = this;
-      api.cases.cases_open(_.extend({ ACTION: "todo" }, item)).then(() => {
-        that.$emit("onUpdateDataCase", {
-          APP_UID: item.APP_UID,
-          DEL_INDEX: item.DEL_INDEX,
-          PRO_UID: item.PRO_UID,
-          TAS_UID: item.TAS_UID,
-          APP_NUMBER: item.CASE_NUMBER,
+      api.cases.open(_.extend({ ACTION: "todo" }, item)).then(() => {
+        api.cases.cases_open(_.extend({ ACTION: "todo" }, item)).then(() => {
+          that.$emit("onUpdateDataCase", {
+            APP_UID: item.APP_UID,
+            DEL_INDEX: item.DEL_INDEX,
+            PRO_UID: item.PRO_UID,
+            TAS_UID: item.TAS_UID,
+            APP_NUMBER: item.CASE_NUMBER,
+          });
+          that.$emit("onUpdatePage", "case-detail");
         });
-        that.$emit("onUpdatePage", "case-detail");
       });
     },
     onRemoveFilter(data) {},
diff --git a/resources/assets/js/home/MyCases.vue b/resources/assets/js/home/MyCases.vue
index 3950cf301..5699742f6 100644
--- a/resources/assets/js/home/MyCases.vue
+++ b/resources/assets/js/home/MyCases.vue
@@ -157,15 +157,17 @@ export default {
          */
         openCaseDetail(item) {
             let that = this;
-            api.cases.cases_open(_.extend({ ACTION: "todo" }, item)).then(() => {
-                that.$emit("onUpdateDataCase", {
-                APP_UID: item.APP_UID,
-                DEL_INDEX: item.DEL_INDEX,
-                PRO_UID: item.PRO_UID,
-                TAS_UID: item.TAS_UID,
-                APP_NUMBER: item.CASE_NUMBER,
+            api.cases.open(_.extend({ ACTION: "todo" }, item)).then(() => {
+                api.cases.cases_open(_.extend({ ACTION: "todo" }, item)).then(() => {
+                    that.$emit("onUpdateDataCase", {
+                    APP_UID: item.APP_UID,
+                    DEL_INDEX: item.DEL_INDEX,
+                    PRO_UID: item.PRO_UID,
+                    TAS_UID: item.TAS_UID,
+                    APP_NUMBER: item.CASE_NUMBER,
+                    });
+                    that.$emit("onUpdatePage", "case-detail");
                 });
-                that.$emit("onUpdatePage", "case-detail");
             });
         },
         /**
diff --git a/resources/assets/js/home/Paused.vue b/resources/assets/js/home/Paused.vue
index 9c322de8d..cf0016e14 100644
--- a/resources/assets/js/home/Paused.vue
+++ b/resources/assets/js/home/Paused.vue
@@ -249,15 +249,17 @@ export default {
      */
     openCaseDetail(item) {
       let that = this;
-      api.cases.cases_open(_.extend({ ACTION: "todo" }, item)).then(() => {
-        that.$emit("onUpdateDataCase", {
-          APP_UID: item.APP_UID,
-          DEL_INDEX: item.DEL_INDEX,
-          PRO_UID: item.PRO_UID,
-          TAS_UID: item.TAS_UID,
-          APP_NUMBER: item.CASE_NUMBER,
+      api.cases.open(_.extend({ ACTION: "todo" }, item)).then(() => {
+        api.cases.cases_open(_.extend({ ACTION: "todo" }, item)).then(() => {
+          that.$emit("onUpdateDataCase", {
+            APP_UID: item.APP_UID,
+            DEL_INDEX: item.DEL_INDEX,
+            PRO_UID: item.PRO_UID,
+            TAS_UID: item.TAS_UID,
+            APP_NUMBER: item.CASE_NUMBER,
+          });
+          that.$emit("onUpdatePage", "case-detail");
         });
-        that.$emit("onUpdatePage", "case-detail");
       });
     },
     showModalUnpauseCase(item) {
diff --git a/resources/assets/js/home/Todo.vue b/resources/assets/js/home/Todo.vue
index cebeb6bed..17538a18a 100644
--- a/resources/assets/js/home/Todo.vue
+++ b/resources/assets/js/home/Todo.vue
@@ -256,16 +256,18 @@ export default {
      */
     openCaseDetail(item) {
       let that = this;
-      api.cases.cases_open(_.extend({ ACTION: "todo" }, item)).then(() => {
-        that.$emit("onUpdateDataCase", {
-          APP_UID: item.APP_UID,
-          DEL_INDEX: item.DEL_INDEX,
-          PRO_UID: item.PRO_UID,
-          TAS_UID: item.TAS_UID,
-          APP_NUMBER: item.CASE_NUMBER,
+      api.cases.open(_.extend({ ACTION: "todo" }, item)).then(() => {
+        api.cases.cases_open(_.extend({ ACTION: "todo" }, item)).then(() => {
+          that.$emit("onUpdateDataCase", {
+            APP_UID: item.APP_UID,
+            DEL_INDEX: item.DEL_INDEX,
+            PRO_UID: item.PRO_UID,
+            TAS_UID: item.TAS_UID,
+            APP_NUMBER: item.CASE_NUMBER,
+          });
+          that.$emit("onUpdatePage", "case-detail");
         });
-        that.$emit("onUpdatePage", "case-detail");
-      });
+      });  
     },
     onRemoveFilter(data) {},
     onUpdateFilters(data) {
diff --git a/resources/assets/js/home/Unassigned.vue b/resources/assets/js/home/Unassigned.vue
index 08b5f428e..6aef3bff9 100644
--- a/resources/assets/js/home/Unassigned.vue
+++ b/resources/assets/js/home/Unassigned.vue
@@ -262,15 +262,17 @@ export default {
      */
     openCaseDetail(item) {
       let that = this;
-      api.cases.cases_open(_.extend({ ACTION: "todo" }, item)).then(() => {
-        that.$emit("onUpdateDataCase", {
-          APP_UID: item.APP_UID,
-          DEL_INDEX: item.DEL_INDEX,
-          PRO_UID: item.PRO_UID,
-          TAS_UID: item.TAS_UID,
-          APP_NUMBER: item.CASE_NUMBER,
+      api.cases.open(_.extend({ ACTION: "todo" }, item)).then(() => {
+        api.cases.cases_open(_.extend({ ACTION: "todo" }, item)).then(() => {
+          that.$emit("onUpdateDataCase", {
+            APP_UID: item.APP_UID,
+            DEL_INDEX: item.DEL_INDEX,
+            PRO_UID: item.PRO_UID,
+            TAS_UID: item.TAS_UID,
+            APP_NUMBER: item.CASE_NUMBER,
+          });
+          that.$emit("onUpdatePage", "case-detail");
         });
-        that.$emit("onUpdatePage", "case-detail");
       });
     },
     onRemoveFilter(data) {},