diff --git a/config/view.php b/config/view.php
index e5823f73b..0b15354d0 100644
--- a/config/view.php
+++ b/config/view.php
@@ -1,4 +1,5 @@
 <?php
+
 return [
     /*
     |--------------------------------------------------------------------------
@@ -23,5 +24,5 @@ return [
     | directory. However, as usual, you are free to change this value.
     |
     */
-    'compiled' => realpath(PATH_TRUNK . 'bootstrap/cache/views')
-];
\ No newline at end of file
+    'compiled' => base_path('bootstrap/cache/views')
+];
diff --git a/resources/assets/js/api/Cases.js b/resources/assets/js/api/Cases.js
index 1c03d01cc..0c6195c53 100644
--- a/resources/assets/js/api/Cases.js
+++ b/resources/assets/js/api/Cases.js
@@ -45,6 +45,48 @@ export let cases = {
             keys: {}
         });
     },
+    inputdocuments(data) {
+        var params = new FormData();
+        params.append('appUid', data.APP_UID);
+        params.append('delIndex', data.DEL_INDEX);
+        params.append('action', "getCasesInputDocuments");
+
+        return axios.post(window.config.SYS_SERVER +
+            window.config.SYS_URI +
+            `cases/cases_Ajax.php?action=getCasesInputDocuments`, params);
+    },
+    outputdocuments(data) {
+        var params = new FormData();
+        params.append('appUid', data.APP_UID);
+        params.append('delIndex', data.DEL_INDEX);
+        params.append('action', "getCasesOutputDocuments");
+
+        return axios.post(window.config.SYS_SERVER +
+            window.config.SYS_URI +
+            `cases/cases_Ajax.php?action=getCasesOutputDocuments`, params);
+    },
+    casesummary(data) {
+        var params = new FormData();
+        params.append('appUid', data.APP_UID);
+        params.append('delIndex', data.DEL_INDEX);
+        params.append('action', "todo");
+
+        return axios.post(window.config.SYS_SERVER +
+            window.config.SYS_URI +
+            `appProxy/getSummary`, params);
+    },
+    casenotes(data) {
+        var params = new FormData();
+        params.append('appUid', data.APP_UID);
+        params.append('delIndex', data.DEL_INDEX);
+        params.append('pro', "6161281705fc91129328391060454559");
+        params.append('tas', "2076843175fc911573db050062710755");
+        params.append('start', "0");
+        params.append('limit', "30");
+        return axios.post(window.config.SYS_SERVER +
+            window.config.SYS_URI +
+            `appProxy/getNotesList`, params);
+    },
     start(dt) {
         var params = new URLSearchParams();
         params.append('action', 'startCase');
diff --git a/resources/assets/js/components/Tabs.vue b/resources/assets/js/components/Tabs.vue
index d3ce226a8..e2fee1c22 100644
--- a/resources/assets/js/components/Tabs.vue
+++ b/resources/assets/js/components/Tabs.vue
@@ -12,29 +12,27 @@
 </template>
 
 <script>
-import { Tabs, Tab } from 'vue-slim-tabs'
+import { Tabs, Tab } from "vue-slim-tabs";
 
 export default {
   props: {
-    data: Object
+    data: Object,
   },
   components: {
-    Tabs, Tab
+    Tabs,
+    Tab,
   },
   data() {
     return {
-      0: function() {
-        console.log(this.data.items[0].appUid);
-      }
+      0: function () {},
     };
   },
   methods: {
     selectedTab(e, index) {
       if (index === 0) {
-        console.log("fabio")
       }
-    }
+    },
   },
-}
+};
 </script>
 <style src="vue-slim-tabs/themes/default.css"></style>
\ No newline at end of file
diff --git a/resources/assets/js/components/home/caseDetail/AttachedDocuments.vue b/resources/assets/js/components/home/caseDetail/AttachedDocuments.vue
index 8990d9cf7..ecf18047c 100644
--- a/resources/assets/js/components/home/caseDetail/AttachedDocuments.vue
+++ b/resources/assets/js/components/home/caseDetail/AttachedDocuments.vue
@@ -37,6 +37,7 @@ export default {
       icon: {
         pdf: "fas fa-file-pdf",
         doc: "fas fa-file-word",
+        png: "fas fa-image",
       },
     };
   },
diff --git a/resources/assets/js/components/home/caseDetail/CaseComment.vue b/resources/assets/js/components/home/caseDetail/CaseComment.vue
new file mode 100644
index 000000000..d679276ed
--- /dev/null
+++ b/resources/assets/js/components/home/caseDetail/CaseComment.vue
@@ -0,0 +1,48 @@
+<template>
+  <div class="comment mb-2 row" @click="onClick(data)">
+    <div class="comment-avatar col-md-1 col-sm-2 text-center pr-1">
+      <a href=""
+        ><img
+          class="mx-auto rounded-circle v-img-fluid"
+          src="http://demos.themes.guide/bodeo/assets/images/users/m103.jpg"
+          alt="avatar"
+      /></a>
+    </div>
+    <div class="comment-content col-md-11 col-sm-10 v-comment">
+      <div class="comment-meta">
+        <a href="#">{{ data.user }}</a> {{ data.date }}
+      </div>
+      <div class="comment-body">
+        <p>{{ data.comment }}</p>
+      </div>
+    </div>
+  </div>
+</template>
+
+<script>
+export default {
+  name: "CaseComment",
+  props: {
+    data: Object,
+    onClick: Function,
+  },
+  data() {
+    return {};
+  },
+  methods: {
+    classBtn(cls) {
+      return "btn v-btn-request " + cls;
+    },
+    classIcon(icon) {
+      return this.icon[icon];
+    },
+  },
+};
+</script>
+
+<style>
+.v-img-fluid {
+  max-width: 30px;
+  height: auto;
+}
+</style>
\ No newline at end of file
diff --git a/resources/assets/js/components/home/caseDetail/CaseComments.vue b/resources/assets/js/components/home/caseDetail/CaseComments.vue
new file mode 100644
index 000000000..8daa8f8e4
--- /dev/null
+++ b/resources/assets/js/components/home/caseDetail/CaseComments.vue
@@ -0,0 +1,85 @@
+<template>
+  <div class="container py-2">
+    <div class="row"></div>
+    <div class="comments col-md-12" id="comments">
+      <p>
+        <b>{{ data.title }}</b>
+      </p>
+      <div v-for="item in data.items" :key="item.date">
+        <case-comment :data="item" :onClick="onClick" />
+      </div>
+    </div>
+    <div class="comments col-md-12">
+      <div class="comment mb-2 row">
+        <div class="comment-avatar col-md-1 col-sm-2 text-center pr-1">
+          <a href=""
+            ><img
+              class="mx-auto rounded-circle v-img-fluid"
+              src="http://demos.themes.guide/bodeo/assets/images/users/m103.jpg"
+              alt="avatar"
+          /></a>
+        </div>
+        <div class="comment-content col-md-11 col-sm-10 v-comment">
+          <div class="comment-meta">
+            <a href="#">{{ data.user }}</a> {{ data.date }}
+          </div>
+          <div class="comment-body">
+            <div class="form-group">
+              <textarea
+                class="form-control"
+                name="comments"
+                id="comments"
+                cols="80"
+                rows="5"
+              ></textarea>
+            </div>
+          </div>
+        </div>
+      </div>
+      <div class="comment mb-2 row float-right">
+        <div class="form-check v-check-comment">
+          <input type="checkbox" class="form-check-input" id="sendEmail" />
+          <label class="form-check-label" for="sendEmail">
+            {{ $t("ID_SEND_EMAIL") }}</label
+          >
+        </div>
+
+        <button class="btn btn-secondary btn-sm">
+          {{ $t("ID_COMMENT") }}
+        </button>
+      </div>
+    </div>
+  </div>
+</template>
+
+<script>
+import CaseComment from "./CaseComment.vue";
+
+export default {
+  name: "CaseComments",
+  props: {
+    data: Object,
+    onClick: Function,
+  },
+  components: {
+    CaseComment,
+  },
+  data() {
+    return {};
+  },
+  methods: {
+    classBtn(cls) {
+      return "btn v-btn-request " + cls;
+    },
+    classIcon(icon) {
+      return this.icon[icon];
+    },
+  },
+};
+</script>
+
+<style>
+.v-check-comment {
+  padding-right: 20px;
+}
+</style>
\ No newline at end of file
diff --git a/resources/assets/js/components/home/caseDetail/Tabs.vue b/resources/assets/js/components/home/caseDetail/Tabs.vue
index dabc640bf..d3329cbbb 100644
--- a/resources/assets/js/components/home/caseDetail/Tabs.vue
+++ b/resources/assets/js/components/home/caseDetail/Tabs.vue
@@ -25,14 +25,13 @@ export default {
   data() {
     return {
       0: function () {
-        console.log(this.data.items[0].appUid);
       },
     };
   },
   methods: {
     selectedTab(e, index) {
       if (index === 0) {
-        console.log("fabio");
+
       }
     },
   },
diff --git a/resources/assets/js/home/AdvancedSearch.vue b/resources/assets/js/home/AdvancedSearch.vue
index f9195e6e1..22fa6a50d 100644
--- a/resources/assets/js/home/AdvancedSearch.vue
+++ b/resources/assets/js/home/AdvancedSearch.vue
@@ -1,408 +1,391 @@
 <template>
-    <div id="v-mycases3" ref="v-mycases2" class="v-container-mycases">
-        <button-fleft :data="newCase"></button-fleft>
-        <GenericFilter/>
-        <modal-new-request ref="newRequest"></modal-new-request>
+  <div id="v-mycases3" ref="v-mycases2" class="v-container-mycases">
+    <button-fleft :data="newCase"></button-fleft>
+    <GenericFilter />
+    <modal-new-request ref="newRequest"></modal-new-request>
 
-        <v-server-table
-            :data="tableData"
-            :columns="columns"
-            :options="options"
-            ref="test"
-        >
-            <div slot="info" slot-scope="props">
-                <b-icon
-                    icon="exclamation-circle-fill"
-                    variant="primary"
-                    @click="caseDetail(props)"
-                ></b-icon>
-            </div>
-            <div slot="case_number" slot-scope="props">
-                 {{ props.row.CASE_NUMBER }}
-            </div>
-            <div slot="case_title" slot-scope="props">
-                {{ props.row.CASE_TITLE }}
-            </div>
-            <div slot="process_name" slot-scope="props">
-                {{ props.row.PROCESS_NAME }}
-            </div>
-            <!-- <div slot="pending_taks" slot-scope="props">
+    <v-server-table
+      :data="tableData"
+      :columns="columns"
+      :options="options"
+      ref="test"
+    >
+      <div slot="info" slot-scope="props">
+        <b-icon
+          icon="exclamation-circle-fill"
+          variant="primary"
+          @click="caseDetail(props)"
+        ></b-icon>
+      </div>
+      <div slot="case_number" slot-scope="props">
+        {{ props.row.CASE_NUMBER }}
+      </div>
+      <div slot="case_title" slot-scope="props">
+        {{ props.row.CASE_TITLE }}
+      </div>
+      <div slot="process_name" slot-scope="props">
+        {{ props.row.PROCESS_NAME }}
+      </div>
+      <!-- <div slot="pending_taks" slot-scope="props">
                 <GroupedCell :data="props.row.PENDING_TASKS" />
             </div> -->
-            <div slot="status" slot-scope="props">{{ props.row.STATUS }}</div>
-            <div slot="start_date" slot-scope="props">
-                {{ props.row.START_DATE }}
-            </div>
-            <div slot="finish_date" slot-scope="props">
-                {{ props.row.FINISH_DATE }}
-            </div>
-            <div slot="duration" slot-scope="props">
-                {{ props.row.DURATION }}
-            </div>
-            <div slot="actions" slot-scope="props">
-                <div class="btn-default">
-                    <i class="fas fa-comments"></i>
-                    <span class="badge badge-light">9</span>
-                    <span class="sr-only">unread messages</span>
-                </div>
-            </div>
-        </v-server-table>
-    </div>
+      <div slot="status" slot-scope="props">{{ props.row.STATUS }}</div>
+      <div slot="start_date" slot-scope="props">
+        {{ props.row.START_DATE }}
+      </div>
+      <div slot="finish_date" slot-scope="props">
+        {{ props.row.FINISH_DATE }}
+      </div>
+      <div slot="duration" slot-scope="props">
+        {{ props.row.DURATION }}
+      </div>
+      <div slot="actions" slot-scope="props">
+        <div class="btn-default">
+          <i class="fas fa-comments"></i>
+          <span class="badge badge-light">9</span>
+          <span class="sr-only">unread messages</span>
+        </div>
+      </div>
+    </v-server-table>
+  </div>
 </template>
 <script>
-
 import ButtonFleft from "../components/home/ButtonFleft.vue";
 import ModalNewRequest from "./ModalNewRequest.vue";
-import GenericFilter from "../components/search/GenericFilter"
+import GenericFilter from "../components/search/GenericFilter";
 import api from "./../api/index";
 
-
 export default {
-    name: "AdvancedSearch",
-    components: {
-        GenericFilter,
-        ButtonFleft,
-        ModalNewRequest
+  name: "AdvancedSearch",
+  components: {
+    GenericFilter,
+    ButtonFleft,
+    ModalNewRequest,
+  },
+  props: {},
+  data() {
+    return {
+      metrics: [],
+      filter: "CASES_INBOX",
+      allView: [],
+      filterHeader: "STARTED_BY_ME",
+      headers: [],
+      newCase: {
+        title: "New Case",
+        class: "btn-success",
+        onClick: () => {
+          this.$refs["newRequest"].show();
+        },
+      },
+      columns: [
+        "info",
+        "case_number",
+        "case_title",
+        "process_name",
+        "status",
+        "start_date",
+        "finish_date",
+        "duration",
+        "actions",
+      ],
+      tableData: [],
+      options: {
+        filterable: false,
+        headings: {
+          info: "",
+          case_number: this.$i18n.t("ID_MYCASE_NUMBER"),
+          case_title: this.$i18n.t("ID_CASE_TITLE"),
+          process_name: this.$i18n.t("ID_PROCESS_NAME"),
+          pending_taks: this.$i18n.t("PENDdING_TASKS"),
+          status: this.$i18n.t("ID_CASESLIST_APP_STATUS"),
+          start_date: this.$i18n.t("ID_START_DATE"),
+          finish_date: this.$i18n.t("ID_FINISH_DATE"),
+          duration: this.$i18n.t("ID_DURATION"),
+          actions: "",
+        },
+        selectable: {
+          mode: "single",
+          only: function (row) {
+            return true;
+          },
+          selectAllMode: "page",
+          programmatic: false,
+        },
+        requestFunction(data) {
+          return this.$parent.$parent.getCasesForVueTable();
+        },
+      },
+      translations: null,
+      pmDateFormat: "Y-m-d H:i:s",
+      apiParams: {
+        action: "todo",
+        list: "inbox",
+        filter: "",
+        search: "",
+        sort: "APP_NUMBER",
+        dir: "DESC",
+        category: "",
+        process: "",
+        filterStatus: "",
+        paged: true,
+        start: 0,
+        limit: 10,
+      },
+    };
+  },
+  mounted() {
+    //  this.$refs.vueTable24.refresh();
+    this.$refs.test.refresh();
+    this.getHeaders();
+  },
+  watch: {},
+  computed: {
+    ProcessMaker() {
+      return window.ProcessMaker;
     },
-    props: {},
-    data() {
-        return {
-            metrics: [],
-            filter: "CASES_INBOX",
-            allView: [],
-            filterHeader: "STARTED_BY_ME",
-            headers: [],
-            newCase: {
-                title: "New Case",
-                class: "btn-success",
-                onClick: () => {
-                    this.$refs["newRequest"].show();
-                },
-            },
-            columns: [
-                "info",
-                "case_number",
-                "case_title",
-                "process_name",
-                "status",
-                "start_date",
-                "finish_date",
-                "duration",
-                "actions",
-            ],
-            tableData: [],
-            options: {
-                filterable: false,
-                headings: {
-                    info: "",
-                    case_number: this.$i18n.t("ID_MYCASE_NUMBER"),
-                    case_title: this.$i18n.t("ID_CASE_TITLE"),
-                    process_name: this.$i18n.t("ID_PROCESS_NAME"),
-                    pending_taks: this.$i18n.t("PENDdING_TASKS"),
-                    status: this.$i18n.t("ID_CASESLIST_APP_STATUS"),
-                    start_date: this.$i18n.t("ID_START_DATE"),
-                    finish_date: this.$i18n.t("ID_FINISH_DATE"),
-                    duration: this.$i18n.t("ID_DURATION"),
-                    actions: "",
-                },
-                selectable: {
-                    mode: "single",
-                    only: function(row) {
-                        return true;
-                    },
-                    selectAllMode: "page",
-                    programmatic: false,
-                },
-                requestFunction(data) {
-                    return this.$parent.$parent.getCasesForVueTable();
-                },
-            },
-            translations: null,
-            pmDateFormat: "Y-m-d H:i:s",
-            apiParams: {
-                action: "todo",
-                list: "inbox",
-                filter: "",
-                search: "",
-                sort: "APP_NUMBER",
-                dir: "DESC",
-                category: "",
-                process: "",
-                filterStatus: "",
-                paged: true,
-                start: 0,
-                limit: 10,
-            },
-        };
+  },
+  updated() {},
+  beforeCreate() {},
+  methods: {
+    /**
+     * Get Cases Headers from BE
+     */
+    getHeaders() {
+      let that = this;
+      api.casesHeader.get().then((response) => {
+        that.headers = that.formatCasesHeaders(response.data);
+      });
     },
-    mounted() {
-        //  this.$refs.vueTable24.refresh();
-        this.$refs.test.refresh();
-        this.getHeaders();
+    /**
+     * Get cases data by header
+     */
+    getCasesForVueTable() {
+      let that = this,
+        dt;
+      return new Promise((resolutionFunc, rejectionFunc) => {
+        api.cases
+          .search({
+            type: that.filterHeader,
+          })
+          .then((response) => {
+            dt = that.formatDataResponse(response.data);
+            resolutionFunc({
+              data: dt,
+              count: response.total,
+            });
+          })
+          .catch((e) => {
+            rejectionFunc(e);
+          });
+      });
     },
-    watch: {},
-    computed: {
-        ProcessMaker() {
-            return window.ProcessMaker;
-        },
+    /**
+     * Format Response API TODO to grid inbox and columns
+     */
+    formatDataResponse(response) {
+      let data = [];
+      _.forEach(response, (v) => {
+        data.push({
+          CASE_NUMBER: v.APP_NUMBER,
+          CASE_TITLE: v.APP_TITLE,
+          PROCESS_NAME: v.PRO_TITLE,
+          STATUS: v.APP_STATUS,
+          START_DATE: v.DEL_DELEGATE_DATE_LABEL,
+          FINISH_DATE: v.DEL_DELEGATE_DATE_LABEL,
+          PENDING_TASKS: v.PENDING_TASKS,
+          DURATION: v.DURATION_LABEL,
+        });
+      });
+      return data;
     },
-    updated() {},
-    beforeCreate() {},
-    methods: {
-        /**
-         * Get Cases Headers from BE
-         */
-        getHeaders() {
-            let that = this;
-            api.casesHeader.get().then((response) => {
-                that.headers = that.formatCasesHeaders(response.data);
-            });
-        },
-        /**
-         * Get cases data by header
-         */
-        getCasesForVueTable() {
-            let that = this,
-                dt;
-            return new Promise((resolutionFunc, rejectionFunc) => {
-                api.cases
-                    .search({
-                        type: that.filterHeader,
-                    })
-                    .then((response) => {
-                        dt = that.formatDataResponse(response.data);
-                        resolutionFunc({
-                            data: dt,
-                            count: response.total,
-                        });
-                    })
-                    .catch((e) => {
-                        rejectionFunc(e);
-                    });
-            });
-        },
-        /**
-         * Format Response API TODO to grid inbox and columns
-         */
-        formatDataResponse(response) {
-            let data = [];
-            _.forEach(response, (v) => {
-                data.push({
-                    CASE_NUMBER: v.APP_NUMBER,
-                    CASE_TITLE: v.APP_TITLE,
-                    PROCESS_NAME: v.PRO_TITLE,
-                    STATUS: v.APP_STATUS,
-                    START_DATE: v.DEL_DELEGATE_DATE_LABEL,
-                    FINISH_DATE: v.DEL_DELEGATE_DATE_LABEL,
-                    PENDING_TASKS: v.PENDING_TASKS,
-                    DURATION: v.DURATION_LABEL,
-                });
-            });
-            return data;
-        },
-        /**
-         * Get for user format name configured in Processmaker Environment Settings
-         *
-         * @param {string} name
-         * @param {string} lastName
-         * @param {string} userName
-         * @return {string} nameFormat
-         */
-        nameFormatCases(name, lastName, userName) {
-            let nameFormat = "";
-            if (/^\s*$/.test(name) && /^\s*$/.test(lastName)) {
-                return nameFormat;
-            }
-            if (this.nameFormat === "@firstName @lastName") {
-                nameFormat = name + " " + lastName;
-            } else if (this.nameFormat === "@firstName @lastName (@userName)") {
-                nameFormat = name + " " + lastName + " (" + userName + ")";
-            } else if (this.nameFormat === "@userName") {
-                nameFormat = userName;
-            } else if (this.nameFormat === "@userName (@firstName @lastName)") {
-                nameFormat = userName + " (" + name + " " + lastName + ")";
-            } else if (this.nameFormat === "@lastName @firstName") {
-                nameFormat = lastName + " " + name;
-            } else if (this.nameFormat === "@lastName, @firstName") {
-                nameFormat = lastName + ", " + name;
-            } else if (
-                this.nameFormat === "@lastName, @firstName (@userName)"
-            ) {
-                nameFormat = lastName + ", " + name + " (" + userName + ")";
-            } else {
-                nameFormat = name + " " + lastName;
-            }
-            return nameFormat;
-        },
-        /**
-         * Convert string to date format
-         *
-         * @param {string} value
-         * @return {date} myDate
-         */
-        convertDate(value) {
-            myDate = new Date(1900, 0, 1, 0, 0, 0);
-            try {
-                if (!isNaN(Date.parse(value))) {
-                    var myArray = value.split(" ");
-                    var myArrayDate = myArray[0].split("-");
-                    if (myArray.length > 1) {
-                        var myArrayHour = myArray[1].split(":");
-                    } else {
-                        var myArrayHour = new Array("0", "0", "0");
-                    }
-                    var myDate = new Date(
-                        myArrayDate[0],
-                        myArrayDate[1] - 1,
-                        myArrayDate[2],
-                        myArrayHour[0],
-                        myArrayHour[1],
-                        myArrayHour[2]
-                    );
-                }
-            } catch (err) {
-                throw new Error(err);
-            }
-            return myDate;
-        },
-        /**
-         * Get a format for specific date
-         *
-         * @param {string} d
-         * @return {string} dateToConvert
-         */
-        dateFormatCases(d) {
-            let dateToConvert = d;
-            const stringToDate = this.convertDate(dateToConvert);
-            if (this.pmDateFormat === "Y-m-d H:i:s") {
-                dateToConvert = dateFormat(stringToDate, "yyyy-mm-dd HH:MM:ss");
-            } else if (this.pmDateFormat === "d/m/Y") {
-                dateToConvert = dateFormat(stringToDate, "dd/mm/yyyy");
-            } else if (this.pmDateFormat === "m/d/Y") {
-                dateToConvert = dateFormat(stringToDate, "mm/dd/yyyy");
-            } else if (this.pmDateFormat === "Y/d/m") {
-                dateToConvert = dateFormat(stringToDate, "yyyy/dd/mm");
-            } else if (this.pmDateFormat === "Y/m/d") {
-                dateToConvert = dateFormat(stringToDate, "yyyy/mm/dd");
-            } else if (this.pmDateFormat === "F j, Y, g:i a") {
-                dateToConvert = dateFormat(
-                    stringToDate,
-                    "mmmm d, yyyy, h:MM tt"
-                );
-            } else if (this.pmDateFormat === "m.d.y") {
-                dateToConvert = dateFormat(stringToDate, "mm.dd.yy");
-            } else if (this.pmDateFormat === "j, n, Y") {
-                dateToConvert = dateFormat(stringToDate, "d,m,yyyy");
-            } else if (this.pmDateFormat === "D M j G:i:s T Y") {
-                dateToConvert = dateFormat(
-                    stringToDate,
-                    "ddd mmm d HH:MM:ss Z yyyy"
-                );
-            } else if (this.pmDateFormat === "M d, Y") {
-                dateToConvert = dateFormat(stringToDate, "mmm dd, yyyy");
-            } else if (this.pmDateFormat === "m D, Y") {
-                dateToConvert = dateFormat(stringToDate, "mm ddd, yyyy");
-            } else if (this.pmDateFormat === "D d M, Y") {
-                dateToConvert = dateFormat(stringToDate, "ddd dd mmm, yyyy");
-            } else if (this.pmDateFormat === "D M, Y") {
-                dateToConvert = dateFormat(stringToDate, "ddd mmm, yyyy");
-            } else if (this.pmDateFormat === "d M, Y") {
-                dateToConvert = dateFormat(stringToDate, "dd mmm, yyyy");
-            } else if (this.pmDateFormat === "d m, Y") {
-                dateToConvert = dateFormat(stringToDate, "dd mm, yyyy");
-            } else if (this.pmDateFormat === "d.m.Y") {
-                dateToConvert = dateFormat(stringToDate, "mm.dd.yyyy");
-            } else {
-                dateToConvert = dateFormat(
-                    stringToDate,
-                    'dd "de" mmmm "de" yyyy'
-                );
-            }
-            return dateToConvert;
-        },
-        /**
-         * Open selected cases in the inbox
-         *
-         * @param {object} item
-         */
-        openCase(item) {
-            const action = "todo";
-            if (this.isIE) {
-                window.open(
-                    "../../../cases/open?APP_UID=" +
-                        item.row.APP_UID +
-                        "&DEL_INDEX=" +
-                        item.row.DEL_INDEX +
-                        "&action=" +
-                        action
-                );
-            } else {
-                window.location.href =
-                    "../../../cases/open?APP_UID=" +
-                    item.row.APP_UID +
-                    "&DEL_INDEX=" +
-                    item.row.DEL_INDEX +
-                    "&action=" +
-                    action;
-            }
-        },
-        /**
-         * Format Response from HEADERS
-         * @param {*} response
-         */
-        formatCasesHeaders(response) {
-            let data = [],
-                that = this,
-                info = {
-                    STARTED_BY_ME: {
-                        icon: "fas fa-inbox",
-                        class: "btn-primary",
-                    },
-                    COMPLETED: {
-                        icon: "fas fa-check-square",
-                        class: "btn-success",
-                    },
-                    IN_PROGRESS: {
-                        icon: "fas fa-tasks",
-                        class: "btn-danger",
-                    },
-                    SUPERVISING: {
-                        icon: "fas fa-binoculars",
-                        class: "btn-warning",
-                    },
-                };
-            _.forEach(response, (v) => {
-                data.push({
-                    title: v.name,
-                    counter: v.count,
-                    item: v.item,
-                    icon: info[v.item].icon,
-                    onClick: (obj) => {
-                        that.filterHeader = obj.item;
-                        that.$refs["vueTable"].getData();
-                    },
-                    class: info[v.item].class,
-                });
-            });
-            return data;
-        },
-        /**
-         * Open case detail
-         * @param {*} item
-         */
-        caseDetail(item) {
-            console.log("CaseDetail");
-            console.log("item");
+    /**
+     * Get for user format name configured in Processmaker Environment Settings
+     *
+     * @param {string} name
+     * @param {string} lastName
+     * @param {string} userName
+     * @return {string} nameFormat
+     */
+    nameFormatCases(name, lastName, userName) {
+      let nameFormat = "";
+      if (/^\s*$/.test(name) && /^\s*$/.test(lastName)) {
+        return nameFormat;
+      }
+      if (this.nameFormat === "@firstName @lastName") {
+        nameFormat = name + " " + lastName;
+      } else if (this.nameFormat === "@firstName @lastName (@userName)") {
+        nameFormat = name + " " + lastName + " (" + userName + ")";
+      } else if (this.nameFormat === "@userName") {
+        nameFormat = userName;
+      } else if (this.nameFormat === "@userName (@firstName @lastName)") {
+        nameFormat = userName + " (" + name + " " + lastName + ")";
+      } else if (this.nameFormat === "@lastName @firstName") {
+        nameFormat = lastName + " " + name;
+      } else if (this.nameFormat === "@lastName, @firstName") {
+        nameFormat = lastName + ", " + name;
+      } else if (this.nameFormat === "@lastName, @firstName (@userName)") {
+        nameFormat = lastName + ", " + name + " (" + userName + ")";
+      } else {
+        nameFormat = name + " " + lastName;
+      }
+      return nameFormat;
+    },
+    /**
+     * Convert string to date format
+     *
+     * @param {string} value
+     * @return {date} myDate
+     */
+    convertDate(value) {
+      myDate = new Date(1900, 0, 1, 0, 0, 0);
+      try {
+        if (!isNaN(Date.parse(value))) {
+          var myArray = value.split(" ");
+          var myArrayDate = myArray[0].split("-");
+          if (myArray.length > 1) {
+            var myArrayHour = myArray[1].split(":");
+          } else {
+            var myArrayHour = new Array("0", "0", "0");
+          }
+          var myDate = new Date(
+            myArrayDate[0],
+            myArrayDate[1] - 1,
+            myArrayDate[2],
+            myArrayHour[0],
+            myArrayHour[1],
+            myArrayHour[2]
+          );
         }
+      } catch (err) {
+        throw new Error(err);
+      }
+      return myDate;
     },
-   
+    /**
+     * Get a format for specific date
+     *
+     * @param {string} d
+     * @return {string} dateToConvert
+     */
+    dateFormatCases(d) {
+      let dateToConvert = d;
+      const stringToDate = this.convertDate(dateToConvert);
+      if (this.pmDateFormat === "Y-m-d H:i:s") {
+        dateToConvert = dateFormat(stringToDate, "yyyy-mm-dd HH:MM:ss");
+      } else if (this.pmDateFormat === "d/m/Y") {
+        dateToConvert = dateFormat(stringToDate, "dd/mm/yyyy");
+      } else if (this.pmDateFormat === "m/d/Y") {
+        dateToConvert = dateFormat(stringToDate, "mm/dd/yyyy");
+      } else if (this.pmDateFormat === "Y/d/m") {
+        dateToConvert = dateFormat(stringToDate, "yyyy/dd/mm");
+      } else if (this.pmDateFormat === "Y/m/d") {
+        dateToConvert = dateFormat(stringToDate, "yyyy/mm/dd");
+      } else if (this.pmDateFormat === "F j, Y, g:i a") {
+        dateToConvert = dateFormat(stringToDate, "mmmm d, yyyy, h:MM tt");
+      } else if (this.pmDateFormat === "m.d.y") {
+        dateToConvert = dateFormat(stringToDate, "mm.dd.yy");
+      } else if (this.pmDateFormat === "j, n, Y") {
+        dateToConvert = dateFormat(stringToDate, "d,m,yyyy");
+      } else if (this.pmDateFormat === "D M j G:i:s T Y") {
+        dateToConvert = dateFormat(stringToDate, "ddd mmm d HH:MM:ss Z yyyy");
+      } else if (this.pmDateFormat === "M d, Y") {
+        dateToConvert = dateFormat(stringToDate, "mmm dd, yyyy");
+      } else if (this.pmDateFormat === "m D, Y") {
+        dateToConvert = dateFormat(stringToDate, "mm ddd, yyyy");
+      } else if (this.pmDateFormat === "D d M, Y") {
+        dateToConvert = dateFormat(stringToDate, "ddd dd mmm, yyyy");
+      } else if (this.pmDateFormat === "D M, Y") {
+        dateToConvert = dateFormat(stringToDate, "ddd mmm, yyyy");
+      } else if (this.pmDateFormat === "d M, Y") {
+        dateToConvert = dateFormat(stringToDate, "dd mmm, yyyy");
+      } else if (this.pmDateFormat === "d m, Y") {
+        dateToConvert = dateFormat(stringToDate, "dd mm, yyyy");
+      } else if (this.pmDateFormat === "d.m.Y") {
+        dateToConvert = dateFormat(stringToDate, "mm.dd.yyyy");
+      } else {
+        dateToConvert = dateFormat(stringToDate, 'dd "de" mmmm "de" yyyy');
+      }
+      return dateToConvert;
+    },
+    /**
+     * Open selected cases in the inbox
+     *
+     * @param {object} item
+     */
+    openCase(item) {
+      const action = "todo";
+      if (this.isIE) {
+        window.open(
+          "../../../cases/open?APP_UID=" +
+            item.row.APP_UID +
+            "&DEL_INDEX=" +
+            item.row.DEL_INDEX +
+            "&action=" +
+            action
+        );
+      } else {
+        window.location.href =
+          "../../../cases/open?APP_UID=" +
+          item.row.APP_UID +
+          "&DEL_INDEX=" +
+          item.row.DEL_INDEX +
+          "&action=" +
+          action;
+      }
+    },
+    /**
+     * Format Response from HEADERS
+     * @param {*} response
+     */
+    formatCasesHeaders(response) {
+      let data = [],
+        that = this,
+        info = {
+          STARTED_BY_ME: {
+            icon: "fas fa-inbox",
+            class: "btn-primary",
+          },
+          COMPLETED: {
+            icon: "fas fa-check-square",
+            class: "btn-success",
+          },
+          IN_PROGRESS: {
+            icon: "fas fa-tasks",
+            class: "btn-danger",
+          },
+          SUPERVISING: {
+            icon: "fas fa-binoculars",
+            class: "btn-warning",
+          },
+        };
+      _.forEach(response, (v) => {
+        data.push({
+          title: v.name,
+          counter: v.count,
+          item: v.item,
+          icon: info[v.item].icon,
+          onClick: (obj) => {
+            that.filterHeader = obj.item;
+            that.$refs["vueTable"].getData();
+          },
+          class: info[v.item].class,
+        });
+      });
+      return data;
+    },
+    /**
+     * Open case detail
+     * @param {*} item
+     */
+    caseDetail(item) {},
+  },
 };
 </script>
 <style>
 .v-container-mycases {
-    padding-top: 20px;
-    padding-bottom: 20px;
-    padding-left: 50px;
-    padding-right: 50px;
+  padding-top: 20px;
+  padding-bottom: 20px;
+  padding-left: 50px;
+  padding-right: 50px;
 }
 </style>
diff --git a/resources/assets/js/home/CaseDetail.vue b/resources/assets/js/home/CaseDetail.vue
index 5f2cbb73d..2ca1e10d3 100644
--- a/resources/assets/js/home/CaseDetail.vue
+++ b/resources/assets/js/home/CaseDetail.vue
@@ -1,5 +1,5 @@
 <template>
-  <div id="case-detail" ref="case-detail" class="v-container-mycases">
+  <div id="case-detail" ref="case-detail" class="v-container-case-detail">
     <div>
       <p class="mb-2">
         <b-icon icon="arrow-left" @click="backSearch()"></b-icon
@@ -41,35 +41,27 @@
           </v-server-table>
         </div>
         <Tabs :data="dataTabs"></Tabs>
-        <div>
-          <p><b>Comments</b></p>
-          <div class="form-group">
-            <textarea
-              class="form-control"
-              name="comments"
-              id="comments"
-              cols="80"
-              rows="5"
-            ></textarea>
-            <div class="form-check">
-              <input type="checkbox" class="form-check-input" id="sendEmail" />
-              <label class="form-check-label" for="sendEmail"
-                >Send email to Participants</label
-              >
-              <button
-                class="btn btn-secondary btn-sm"
-                id="comment"
-                name="comment"
-              >
-                Comment
-              </button>
-            </div>
-          </div>
-        </div>
       </div>
       <div class="col-sm4">
-        <case-summary :data="dataCaseSummary"></case-summary>
-        <io-documents :data="dataIoDocuments"></io-documents>
+        <case-summary
+          v-if="dataCaseSummary"
+          :data="dataCaseSummary"
+        ></case-summary>
+        <io-documents
+          v-if="
+            dataIoDocuments.inputDocuments.length > 0 ||
+            dataIoDocuments.outputDocuments.length > 0
+          "
+          :data="dataIoDocuments"
+        ></io-documents>
+      </div>
+    </div>
+
+    <div class="row">
+      <div class="col-sm-8">
+        <case-comments :data="dataComments" :onClick="onClickComment" />
+      </div>
+      <div class="col-sm4">
         <attached-documents :data="dataAttachedDocuments"></attached-documents>
       </div>
     </div>
@@ -81,6 +73,10 @@ import Tabs from "../components/home/caseDetail/Tabs.vue";
 import IoDocuments from "../components/home/caseDetail/IoDocuments.vue";
 import CaseSummary from "../components/home/caseDetail/CaseSummary.vue";
 import AttachedDocuments from "../components/home/caseDetail/AttachedDocuments.vue";
+import CaseComment from "../components/home/caseDetail/CaseComment";
+import CaseComments from "../components/home/caseDetail/CaseComments";
+
+import Api from "../api/index";
 
 export default {
   name: "CaseDetail",
@@ -89,10 +85,13 @@ export default {
     IoDocuments,
     CaseSummary,
     AttachedDocuments,
+    CaseComment,
+    CaseComments,
   },
   props: {},
   data() {
     return {
+      dataCase: null,
       columns: [
         "task",
         "case_title",
@@ -129,66 +128,16 @@ export default {
         },
         filterable: false,
       },
-      dataCaseSummary: {
-        title: "Case Summary",
-        titleActions: "Actions",
-        btnLabel: "Cancel Request",
-        btnType: false,
-        onClick: () => {
-          console.log("acitons");
-        },
-        label: {
-          numberCase: "Case #",
-          process: "Process",
-          status: "Status",
-          caseTitle: "Case title",
-          created: "Created",
-          delegationDate: "Delegation Date",
-          duration: "Duration",
-        },
-        text: {
-          numberCase: "",
-          process: "",
-          status: "",
-          caseTitle: "",
-          created: "",
-          delegationDate: "",
-          duration: "",
-        },
-      },
+      dataCaseSummary: null,
       dataIoDocuments: {
-        titleInput: "Input Document",
-        inputDocuments: [
-          {
-            title: "Invoice January 2018.pdf",
-            extension: "pdf",
-            onClick: () => {
-              console.log("Attached document");
-            },
-          },
-        ],
-        titleOutput: "Output Document",
-        outputDocuments: [
-          {
-            title: "Invoice January 2018.pdf",
-            extension: "pdf",
-            onClick: () => {
-              console.log("Attached document");
-            },
-          },
-        ],
+        titleInput: this.$i18n.t("ID_REQUEST_DOCUMENTS"),
+        titleOutput: this.$i18n.t("ID_OUTPUT_DOCUMENTS"),
+        inputDocuments: [],
+        outputDocuments: [],
       },
       dataAttachedDocuments: {
         title: "Attached Documents",
-        items: [
-          {
-            title: "Invoice January 2018.pdf",
-            extension: "pdf",
-            onClick: () => {
-              console.log("Attached document");
-            },
-          },
-        ],
+        items: [],
       },
       dataTabs: {
         items: [
@@ -216,24 +165,39 @@ export default {
           },
         ],
       },
+      dataComments: {
+        title: "Comments",
+        items: [],
+      },
     };
   },
 
   mounted() {
     let that = this;
+    this.dataCase = this.$parent.dataCase;
     this.$el.getElementsByClassName("VuePagination__count")[0].remove();
     this.getDataCaseSummary();
-    this.getDataIODocuments();
+    this.getInputDocuments();
+    this.getOutputDocuments();
+    this.getCasesNotes();
   },
   methods: {
+    onClickComment(data) {
+      let att = [];
+      this.dataAttachedDocuments.items = [];
+      _.each(data.data.attachments, (a) => {
+        att.push({
+          data: a,
+          title: a.APP_DOC_FILENAME,
+          extension: a.APP_DOC_FILENAME.split(".").pop(),
+          onClick: () => {},
+        });
+      });
+      this.dataAttachedDocuments.items = att;
+    },
     getDataCaseSummary() {
-      var data = new FormData();
-      data.append("appUid", APP_UID);
-      data.append("delIndex", DEL_INDEX);
-      data.append("action", "todo");
-
-      ProcessMaker.apiClient
-        .post("../../../appProxy/getSummary", data)
+      Api.cases
+        .casesummary(this.dataCase)
         .then((response) => {
           var data = response.data;
           this.dataCaseSummary = {
@@ -241,9 +205,7 @@ export default {
             titleActions: "Actions",
             btnLabel: "Cancel Request",
             btnType: false,
-            onClick: () => {
-              console.log("acitons");
-            },
+            onClick: () => {},
             label: {
               numberCase: data[2].label,
               process: data[0].label,
@@ -268,21 +230,11 @@ export default {
           throw new Error(err);
         });
     },
-    getDataIODocuments() {
-      this.getInputDocuments();
-      this.getOutputDocuments();
-    },
     getInputDocuments() {
-      var data = new FormData();
-      data.append("appUid", APP_UID);
-      data.append("delIndex", DEL_INDEX);
-      ProcessMaker.apiClient
-        .post(
-          "../../../cases/cases_Ajax.php?action=getCasesInputDocuments",
-          data
-        )
+      Api.cases
+        .inputdocuments(this.dataCase)
         .then((response) => {
-          var data = response.data,
+          let data = response.data,
             document = data.data,
             i,
             info;
@@ -304,14 +256,8 @@ export default {
         });
     },
     getOutputDocuments() {
-      var data = new FormData();
-      data.append("appUid", APP_UID);
-      data.append("delIndex", DEL_INDEX);
-      ProcessMaker.apiClient
-        .post(
-          "../../../cases/cases_Ajax.php?action=getCasesOutputDocuments",
-          data
-        )
+      Api.cases
+        .outputdocuments(this.dataCase)
         .then((response) => {
           var data = response.data,
             document = data.data,
@@ -334,6 +280,76 @@ export default {
           throw new Error(err);
         });
     },
+    /**
+     * Get for user format name configured in Processmaker Environment Settings
+     *
+     * @param {string} name
+     * @param {string} lastName
+     * @param {string} userName
+     * @return {string} nameFormat
+     */
+    nameFormatCases(name, lastName, userName) {
+      let nameFormat = "";
+      if (/^\s*$/.test(name) && /^\s*$/.test(lastName)) {
+        return nameFormat;
+      }
+      if (this.nameFormat === "@firstName @lastName") {
+        nameFormat = name + " " + lastName;
+      } else if (this.nameFormat === "@firstName @lastName (@userName)") {
+        nameFormat = name + " " + lastName + " (" + userName + ")";
+      } else if (this.nameFormat === "@userName") {
+        nameFormat = userName;
+      } else if (this.nameFormat === "@userName (@firstName @lastName)") {
+        nameFormat = userName + " (" + name + " " + lastName + ")";
+      } else if (this.nameFormat === "@lastName @firstName") {
+        nameFormat = lastName + " " + name;
+      } else if (this.nameFormat === "@lastName, @firstName") {
+        nameFormat = lastName + ", " + name;
+      } else if (this.nameFormat === "@lastName, @firstName (@userName)") {
+        nameFormat = lastName + ", " + name + " (" + userName + ")";
+      } else {
+        nameFormat = name + " " + lastName;
+      }
+      return nameFormat;
+    },
+
+    getCasesNotes() {
+      let that = this;
+      Api.cases
+        .casenotes(this.dataCase)
+        .then((response) => {
+          that.formatResponseCaseNotes(response.data.notes);
+        })
+        .catch((err) => {
+          throw new Error(err);
+        });
+    },
+    formatResponseCaseNotes(notes) {
+      let that = this,
+        notesArray = [];
+      _.each(notes, (n) => {
+        notesArray.push({
+          user: that.nameFormatCases(
+            n.USR_FIRSTNAME,
+            n.USR_LASTNAME,
+            n.USR_USERNAME
+          ),
+          date: n.NOTE_DATE,
+          comment: n.NOTE_CONTENT,
+          data: n,
+        });
+      });
+
+      this.dataComments.items = notesArray;
+    },
   },
 };
-</script>
\ No newline at end of file
+</script>
+<style>
+.v-container-case-detail {
+  padding-top: 20px;
+  padding-bottom: 20px;
+  padding-left: 50px;
+  padding-right: 0px;
+}
+</style>
\ No newline at end of file
diff --git a/resources/assets/js/home/Todo.vue b/resources/assets/js/home/Todo.vue
index bbddf36bc..63cbe38e5 100644
--- a/resources/assets/js/home/Todo.vue
+++ b/resources/assets/js/home/Todo.vue
@@ -10,7 +10,7 @@
       ref="vueTable"
     >
       <div slot="detail" slot-scope="props">
-        <div class="btn-default" @click="openCaseDetail(props)">
+        <div class="btn-default" @click="openCaseDetail(props.row)">
           <i class="fas fa-info-circle"></i>
         </div>
       </div>
@@ -173,6 +173,8 @@ export default {
           DUE_DATE: v.DEL_TASK_DUE_DATE,
           DELEGATION_DATE: v.DEL_DELEGATE_DATE,
           PRIORITY: v.DEL_PRIORITY_LABEL,
+          DEL_INDEX: v.DEL_INDEX,
+          APP_UID: v.APP_UID,
         });
       });
       return data;
@@ -231,7 +233,6 @@ export default {
       this.$parent.dataCase = {
         APP_UID: item.APP_UID,
         DEL_INDEX: item.DEL_INDEX,
-        ACTION: "todo",
       };
       this.$parent.page = "case-detail";
     },
diff --git a/workflow/engine/methods/cases/cases_Ajax.php b/workflow/engine/methods/cases/cases_Ajax.php
index eeef88eee..cd089384c 100644
--- a/workflow/engine/methods/cases/cases_Ajax.php
+++ b/workflow/engine/methods/cases/cases_Ajax.php
@@ -252,7 +252,7 @@ switch (($_POST['action']) ? $_POST['action'] : $_REQUEST['action']) {
     case 'showUsers':
         $_POST['TAS_ASSIGN_TYPE'] = $filter->xssFilterHard($_POST['TAS_ASSIGN_TYPE']);
         switch ($_POST['TAS_ASSIGN_TYPE']) {
-            // switch verify $_POST['TAS_ASSIGN_TYPE']
+                // switch verify $_POST['TAS_ASSIGN_TYPE']
             case 'BALANCED':
                 $USR_UID = $filter->xssFilterHard($_POST['USR_UID']);
                 $oUser = new User(new DBConnection());
@@ -513,7 +513,7 @@ switch (($_POST['action']) ? $_POST['action'] : $_REQUEST['action']) {
             $Fields['CREATOR'] = '***';
         }
         switch ($Fields['INP_DOC_FORM_NEEDED']) {
-            // switch verify $Fields['INP_DOC_FORM_NEEDED']
+                // switch verify $Fields['INP_DOC_FORM_NEEDED']
             case 'REAL':
                 $sXmlForm = 'cases/cases_ViewAnyInputDocument2';
                 break;
@@ -550,6 +550,7 @@ switch (($_POST['action']) ? $_POST['action'] : $_REQUEST['action']) {
         $oCase = new Cases();
         $fields = $oCase->loadCase($_POST['appUid']);
         $sProcessUID = $fields['PRO_UID'];
+        $aProcesses = [];
         $criteria = $oCase->getAllUploadedDocumentsCriteria(
             $sProcessUID,
             $_POST['appUid'],
@@ -612,7 +613,7 @@ switch (($_POST['action']) ? $_POST['action'] : $_REQUEST['action']) {
         //!dateFormat
         $conf = new Configurations();
         try {
-            $globaleneralConfCasesList = $conf->getConfiguration('ENVIRONMENT_SETTINGS', '');   
+            $globaleneralConfCasesList = $conf->getConfiguration('ENVIRONMENT_SETTINGS', '');
         } catch (Exception $e) {
             $generalConfCasesList = array();
         }
@@ -834,8 +835,7 @@ switch (($_POST['action']) ? $_POST['action'] : $_REQUEST['action']) {
 
         global $G_PUBLISH;
         $G_PUBLISH = new Publisher();
-        $G_PUBLISH->AddContent('propeltable', 'paged-table', 'processes/processes_viewreassignCase', $oCriteria, array('THETYPE' => 'ADHOC'
-        ));
+        $G_PUBLISH->AddContent('propeltable', 'paged-table', 'processes/processes_viewreassignCase', $oCriteria, array('THETYPE' => 'ADHOC'));
         G::RenderPage('publish', 'raw');
         break;
     case 'showHistoryMessages':
@@ -866,7 +866,7 @@ switch (($_POST['action']) ? $_POST['action'] : $_REQUEST['action']) {
         $oCase = new Cases();
         $oCase->getAllGeneratedDocumentsCriteria($_SESSION['PROCESS'], $_SESSION['APPLICATION'], $_SESSION['TASK'], $_SESSION['USER_LOGGED']);
         break;
-    /* @Author Erik Amaru Ortiz <erik@colosa.com> */
+        /* @Author Erik Amaru Ortiz <erik@colosa.com> */
     case 'resendMessage':
         //require_once 'classes/model/Configuration.php';
 
@@ -909,17 +909,16 @@ switch (($_POST['action']) ? $_POST['action'] : $_REQUEST['action']) {
                 'OAUTH_REFRESH_TOKEN' => $aSetup['OAUTH_REFRESH_TOKEN']
             )
         );
-        $oSpool->create(array('msg_uid' => $data['MSG_UID'], 'app_uid' => $data['APP_UID'], 'del_index' => $data['DEL_INDEX'], 'app_msg_type' => $data['APP_MSG_TYPE'], 'app_msg_subject' => $data['APP_MSG_SUBJECT'], 'app_msg_from' => $data['APP_MSG_FROM'], 'app_msg_to' => $data['APP_MSG_TO'], 'app_msg_body' => $data['APP_MSG_BODY'], 'app_msg_cc' => $data['APP_MSG_CC'], 'app_msg_bcc' => $data['APP_MSG_BCC'], 'app_msg_attach' => $data['APP_MSG_ATTACH'], 'app_msg_template' => $data['APP_MSG_TEMPLATE'], 'app_msg_status' => 'pending'
-        ));
+        $oSpool->create(array('msg_uid' => $data['MSG_UID'], 'app_uid' => $data['APP_UID'], 'del_index' => $data['DEL_INDEX'], 'app_msg_type' => $data['APP_MSG_TYPE'], 'app_msg_subject' => $data['APP_MSG_SUBJECT'], 'app_msg_from' => $data['APP_MSG_FROM'], 'app_msg_to' => $data['APP_MSG_TO'], 'app_msg_body' => $data['APP_MSG_BODY'], 'app_msg_cc' => $data['APP_MSG_CC'], 'app_msg_bcc' => $data['APP_MSG_BCC'], 'app_msg_attach' => $data['APP_MSG_ATTACH'], 'app_msg_template' => $data['APP_MSG_TEMPLATE'], 'app_msg_status' => 'pending'));
         $oSpool->sendMail();
         break;
-    /* @Author Erik Amaru Ortiz <erik@colosa.com> */
+        /* @Author Erik Amaru Ortiz <erik@colosa.com> */
     case 'showdebug':
         $G_PUBLISH = new Publisher();
         $G_PUBLISH->AddContent('view', 'cases/showDebugFrame');
         G::RenderPage('publish', 'raw');
         break;
-    /* @Author Erik Amaru Ortiz <erik@colosa.com> */
+        /* @Author Erik Amaru Ortiz <erik@colosa.com> */
     case 'reassignByUserList':
         $APP_UIDS = explode(',', $_POST['APP_UIDS']);
         $sReassignFromUser = $_POST['FROM_USR_ID'];
@@ -963,11 +962,9 @@ switch (($_POST['action']) ? $_POST['action'] : $_REQUEST['action']) {
             array_push($aCasesList, $aCase);
         }
 
-        $filedNames = array("APP_UID", "APP_NUMBER", "APP_UPDATE_DATE", "DEL_PRIORITY", "DEL_INDEX", "TAS_UID", "DEL_INIT_DATE", "DEL_FINISH_DATE", "USR_UID", "APP_STATUS", "DEL_TASK_DUE_DATE", "APP_CURRENT_USER", "APP_TITLE", "APP_PRO_TITLE", "APP_TAS_TITLE", "APP_DEL_PREVIOUS_USER", "USERS"
-        );
+        $filedNames = array("APP_UID", "APP_NUMBER", "APP_UPDATE_DATE", "DEL_PRIORITY", "DEL_INDEX", "TAS_UID", "DEL_INIT_DATE", "DEL_FINISH_DATE", "USR_UID", "APP_STATUS", "DEL_TASK_DUE_DATE", "APP_CURRENT_USER", "APP_TITLE", "APP_PRO_TITLE", "APP_TAS_TITLE", "APP_DEL_PREVIOUS_USER", "USERS");
 
-        $aCasesList = array_merge(array($filedNames
-        ), $aCasesList);
+        $aCasesList = array_merge(array($filedNames), $aCasesList);
 
         global $_DBArray;
         $_DBArray['reassign_byuser'] = $aCasesList;
@@ -1079,7 +1076,7 @@ switch (($_POST['action']) ? $_POST['action'] : $_REQUEST['action']) {
                     $response['exists'] = false;
                     $response['message'] = G::LoadTranslation('ID_NO_PERMISSION_NO_PARTICIPATED');
                 }
-            } else {//Check if the user participated in this case
+            } else { //Check if the user participated in this case
                 if (!$aUserCanAccess['participated'] && !$aUserCanAccess['rolesPermissions']['PM_ALLCASES'] && !$aUserCanAccess['objectPermissions']['SUMMARY_FORM']) {
                     $response['exists'] = false;
                     $response['message'] = G::LoadTranslation('ID_NO_PERMISSION_NO_PARTICIPATED');