diff --git a/resources/assets/js/home/MyCases.vue b/resources/assets/js/home/MyCases.vue
index e40bf2b59..3950cf301 100644
--- a/resources/assets/js/home/MyCases.vue
+++ b/resources/assets/js/home/MyCases.vue
@@ -16,6 +16,11 @@
             :options="options"
             ref="vueTable"
         >
+            <div slot="detail" slot-scope="props">
+                <div class="btn-default" @click="openCaseDetail(props.row)">
+                <i class="fas fa-info-circle"></i>
+                </div>
+            </div>
             <div slot="case_number" slot-scope="props">
                 {{ props.row.CASE_NUMBER }}
             </div>
@@ -84,6 +89,7 @@ export default {
                 },
             },
             columns: [
+                "detail",
                 "case_number",
                 "case_title",
                 "process_name",
@@ -144,6 +150,24 @@ export default {
     updated() {},
     beforeCreate() {},
     methods: {
+        /**
+         * Open case detail
+         *
+         * @param {object} item
+         */
+        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,
+                });
+                that.$emit("onUpdatePage", "case-detail");
+            });
+        },
         /**
          * Get Cases Headers from BE
          */