fix: show formatted date, datetime in list, kanban & group by views

frontend/src/pages/CallLogs.vue

@@ -82,7 +82,7 @@ const rows = computed(() => {
   return callLogs.value?.data.data.map((callLog) => {
     let _rows = {}
     callLogs.value?.data.rows.forEach((row) => {
-      _rows[row] = getCallLogDetail(row, callLog)
+      _rows[row] = getCallLogDetail(row, callLog, callLogs.value?.data.columns)
     })
     return _rows
   })

frontend/src/pages/Contacts.vue

@@ -109,6 +109,18 @@ const rows = computed(() => {
     contacts.value?.data.rows.forEach((row) => {
       _rows[row] = contact[row]
 
+      let fieldType = contacts.value?.data.columns?.find(
+        (col) => (col.key || col.value) == row,
+      )?.type
+
+      if (
+        fieldType &&
+        ['Date', 'Datetime'].includes(fieldType) &&
+        !['modified', 'creation'].includes(row)
+      ) {
+        _rows[row] = formatDate(contact[row], '', true, fieldType == 'Datetime')
+      }
+
       if (row == 'full_name') {
         _rows[row] = {
           label: contact.full_name,

frontend/src/pages/Deals.vue

@@ -335,15 +335,16 @@ const rows = computed(() => {
     return getGroupedByRows(
       deals.value?.data.data,
       deals.value?.data.group_by_field,
+      deals.value.data.columns,
     )
   } else if (deals.value.data.view_type === 'kanban') {
-    return getKanbanRows(deals.value.data.data)
+    return getKanbanRows(deals.value.data.data, deals.value.data.fields)
   } else {
-    return parseRows(deals.value?.data.data)
+    return parseRows(deals.value?.data.data, deals.value.data.columns)
   }
 })
 
-function getGroupedByRows(listRows, groupByField) {
+function getGroupedByRows(listRows, groupByField, columns) {
   let groupedRows = []
 
   groupByField.options?.forEach((option) => {
@@ -359,7 +360,7 @@ function getGroupedByRows(listRows, groupByField) {
       label: groupByField.label,
       group: option || __(' '),
       collapsed: false,
-      rows: parseRows(filteredRows),
+      rows: parseRows(filteredRows, columns),
     }
     if (groupByField.name == 'status') {
       groupDetail.icon = () =>
@@ -373,22 +374,34 @@ function getGroupedByRows(listRows, groupByField) {
   return groupedRows || listRows
 }
 
-function getKanbanRows(data) {
+function getKanbanRows(data, columns) {
   let _rows = []
   data.forEach((column) => {
     column.data?.forEach((row) => {
       _rows.push(row)
     })
   })
-  return parseRows(_rows)
+  return parseRows(_rows, columns)
 }
 
-function parseRows(rows) {
+function parseRows(rows, columns = []) {
   return rows.map((deal) => {
     let _rows = {}
     deals.value.data.rows.forEach((row) => {
       _rows[row] = deal[row]
 
+      let fieldType = columns?.find(
+        (col) => (col.key || col.value) == row,
+      )?.type
+
+      if (
+        fieldType &&
+        ['Date', 'Datetime'].includes(fieldType) &&
+        !['modified', 'creation'].includes(row)
+      ) {
+        _rows[row] = formatDate(deal[row], '', true, fieldType == 'Datetime')
+      }
+
       if (row == 'organization') {
         _rows[row] = {
           label: deal.organization,

frontend/src/pages/EmailTemplates.vue

@@ -98,6 +98,23 @@ const rows = computed(() => {
     emailTemplates.value?.data.rows.forEach((row) => {
       _rows[row] = emailTemplate[row]
 
+      let fieldType = emailTemplates.value?.data.columns?.find(
+        (col) => (col.key || col.value) == row,
+      )?.type
+
+      if (
+        fieldType &&
+        ['Date', 'Datetime'].includes(fieldType) &&
+        !['modified', 'creation'].includes(row)
+      ) {
+        _rows[row] = formatDate(
+          emailTemplate[row],
+          '',
+          true,
+          fieldType == 'Datetime',
+        )
+      }
+
       if (['modified', 'creation'].includes(row)) {
         _rows[row] = {
           label: formatDate(emailTemplate[row]),

frontend/src/pages/Leads.vue

@@ -349,15 +349,16 @@ const rows = computed(() => {
     return getGroupedByRows(
       leads.value?.data.data,
       leads.value?.data.group_by_field,
+      leads.value.data.columns,
     )
   } else if (leads.value.data.view_type === 'kanban') {
-    return getKanbanRows(leads.value.data.data)
+    return getKanbanRows(leads.value.data.data, leads.value.data.fields)
   } else {
-    return parseRows(leads.value?.data.data)
+    return parseRows(leads.value?.data.data, leads.value.data.columns)
   }
 })
 
-function getGroupedByRows(listRows, groupByField) {
+function getGroupedByRows(listRows, groupByField, columns) {
   let groupedRows = []
 
   groupByField.options?.forEach((option) => {
@@ -373,7 +374,7 @@ function getGroupedByRows(listRows, groupByField) {
       label: groupByField.label,
       group: option || __(' '),
       collapsed: false,
-      rows: parseRows(filteredRows),
+      rows: parseRows(filteredRows, columns),
     }
     if (groupByField.name == 'status') {
       groupDetail.icon = () =>
@@ -387,22 +388,34 @@ function getGroupedByRows(listRows, groupByField) {
   return groupedRows || listRows
 }
 
-function getKanbanRows(data) {
+function getKanbanRows(data, columns) {
   let _rows = []
   data.forEach((column) => {
     column.data?.forEach((row) => {
       _rows.push(row)
     })
   })
-  return parseRows(_rows)
+  return parseRows(_rows, columns)
 }
 
-function parseRows(rows) {
+function parseRows(rows, columns = []) {
   return rows.map((lead) => {
     let _rows = {}
     leads.value?.data.rows.forEach((row) => {
       _rows[row] = lead[row]
 
+      let fieldType = columns?.find(
+        (col) => (col.key || col.value) == row,
+      )?.type
+
+      if (
+        fieldType &&
+        ['Date', 'Datetime'].includes(fieldType) &&
+        !['modified', 'creation'].includes(row)
+      ) {
+        _rows[row] = formatDate(lead[row], '', true, fieldType == 'Datetime')
+      }
+
       if (row == 'lead_name') {
         _rows[row] = {
           label: lead.lead_name,

frontend/src/pages/Organizations.vue

@@ -103,6 +103,23 @@ const rows = computed(() => {
     organizations.value?.data.rows.forEach((row) => {
       _rows[row] = organization[row]
 
+      let fieldType = organizations.value?.data.columns?.find(
+        (col) => (col.key || col.value) == row,
+      )?.type
+
+      if (
+        fieldType &&
+        ['Date', 'Datetime'].includes(fieldType) &&
+        !['modified', 'creation'].includes(row)
+      ) {
+        _rows[row] = formatDate(
+          organization[row],
+          '',
+          true,
+          fieldType == 'Datetime',
+        )
+      }
+
       if (row === 'organization_name') {
         _rows[row] = {
           label: organization.organization_name,

frontend/src/pages/Tasks.vue

@@ -237,28 +237,40 @@ const rows = computed(() => {
   if (!tasks.value?.data?.data) return []
 
   if (tasks.value.data.view_type === 'kanban') {
-    return getKanbanRows(tasks.value.data.data)
+    return getKanbanRows(tasks.value.data.data, tasks.value.data.fields)
   }
 
-  return parseRows(tasks.value?.data.data)
+  return parseRows(tasks.value?.data.data, tasks.value?.data.columns)
 })
 
-function getKanbanRows(data) {
+function getKanbanRows(data, columns) {
   let _rows = []
   data.forEach((column) => {
     column.data?.forEach((row) => {
       _rows.push(row)
     })
   })
-  return parseRows(_rows)
+  return parseRows(_rows, columns)
 }
 
-function parseRows(rows) {
+function parseRows(rows, columns = []) {
   return rows.map((task) => {
     let _rows = {}
     tasks.value?.data.rows.forEach((row) => {
       _rows[row] = task[row]
 
+      let fieldType = columns?.find(
+        (col) => (col.key || col.value) == row,
+      )?.type
+
+      if (
+        fieldType &&
+        ['Date', 'Datetime'].includes(fieldType) &&
+        !['modified', 'creation'].includes(row)
+      ) {
+        _rows[row] = formatDate(task[row], '', true, fieldType == 'Datetime')
+      }
+
       if (['modified', 'creation'].includes(row)) {
         _rows[row] = {
           label: formatDate(task[row]),

frontend/src/utils/callLog.js

@@ -5,7 +5,7 @@ import { contactsStore } from '@/stores/contacts'
 const { getUser } = usersStore()
 const { getContact, getLeadContact } = contactsStore()
 
-export function getCallLogDetail(row, log) {
+export function getCallLogDetail(row, log, columns = []) {
   let incoming = log.type === 'Incoming'
 
   if (row === 'caller') {
@@ -51,6 +51,13 @@ export function getCallLogDetail(row, log) {
       timeAgo: __(timeAgo(log[row])),
     }
   }
+
+  let fieldType = columns?.find((col) => (col.key || col.value) == row)?.type
+
+  if (fieldType && ['Date', 'Datetime'].includes(fieldType)) {
+    return formatDate(log[row], '', true, fieldType == 'Datetime')
+  }
+
   return log[row]
 }