From 142a583255154a2488f9c89dfbde38897fbaf549 Mon Sep 17 00:00:00 2001
From: Shariq Ansari <sharique.rik@gmail.com>
Date: Fri, 1 Sep 2023 11:42:50 +0530
Subject: [PATCH] fix: added icon for email/phone and formatted number to
 currency value in list view

---
 frontend/src/components/ListRowItem.vue | 11 ++++++++++-
 frontend/src/components/ListView.vue    |  6 ++++++
 frontend/src/pages/Deals.vue            |  4 ++--
 frontend/src/pages/Leads.vue            |  8 ++++----
 frontend/src/utils.js                   | 11 +++++++++++
 5 files changed, 33 insertions(+), 7 deletions(-)

diff --git a/frontend/src/components/ListRowItem.vue b/frontend/src/components/ListRowItem.vue
index f8bb3872..6a430e0a 100644
--- a/frontend/src/components/ListRowItem.vue
+++ b/frontend/src/components/ListRowItem.vue
@@ -13,7 +13,13 @@
   </Tooltip>
 </template>
 <script setup>
-import { dateFormat, timeAgo, dateTooltipFormat, htmlToText } from '@/utils'
+import {
+  dateFormat,
+  timeAgo,
+  dateTooltipFormat,
+  htmlToText,
+  formatNumberIntoCurrency,
+} from '@/utils'
 import { Tooltip } from 'frappe-ui'
 import { computed } from 'vue'
 
@@ -47,6 +53,9 @@ const label = computed(() => {
   if (props.type === 'html') {
     return htmlToText(props.value?.toString())
   }
+  if (props.type === 'currency') {
+    return formatNumberIntoCurrency(props.value)
+  }
   return props.value?.toString()
 })
 </script>
diff --git a/frontend/src/components/ListView.vue b/frontend/src/components/ListView.vue
index 9896510a..54288ab1 100644
--- a/frontend/src/components/ListView.vue
+++ b/frontend/src/components/ListView.vue
@@ -75,6 +75,12 @@
                     class="h-3 w-3"
                   />
                 </div>
+                <div v-else-if="column.type === 'email'">
+                  <FeatherIcon name="mail" class="h-3 w-3" />
+                </div>
+                <div v-else-if="column.type === 'phone'">
+                  <FeatherIcon name="phone" class="h-3 w-3" />
+                </div>
               </template>
               <div v-if="column.type === 'badge'">
                 <Badge
diff --git a/frontend/src/pages/Deals.vue b/frontend/src/pages/Deals.vue
index 65a7e682..d830a5cb 100644
--- a/frontend/src/pages/Deals.vue
+++ b/frontend/src/pages/Deals.vue
@@ -147,7 +147,7 @@ const columns = [
   {
     label: 'Amount',
     key: 'annual_revenue',
-    type: 'data',
+    type: 'currency',
     size: 'w-24',
   },
   {
@@ -166,7 +166,7 @@ const columns = [
     label: 'Mobile no',
     key: 'mobile_no',
     type: 'phone',
-    size: 'w-32',
+    size: 'w-36',
   },
   {
     label: 'Lead owner',
diff --git a/frontend/src/pages/Leads.vue b/frontend/src/pages/Leads.vue
index 75896818..07918928 100644
--- a/frontend/src/pages/Leads.vue
+++ b/frontend/src/pages/Leads.vue
@@ -153,25 +153,25 @@ const columns = [
     label: 'Organization',
     key: 'organization_name',
     type: 'logo',
-    size: 'w-40',
+    size: 'w-36',
   },
   {
     label: 'Status',
     key: 'status',
     type: 'indicator',
-    size: 'w-36',
+    size: 'w-32',
   },
   {
     label: 'Email',
     key: 'email',
     type: 'email',
-    size: 'w-40',
+    size: 'w-44',
   },
   {
     label: 'Mobile no',
     key: 'mobile_no',
     type: 'phone',
-    size: 'w-32',
+    size: 'w-36',
   },
   {
     label: 'Lead owner',
diff --git a/frontend/src/utils.js b/frontend/src/utils.js
index 272b8ebb..eac11ce7 100644
--- a/frontend/src/utils.js
+++ b/frontend/src/utils.js
@@ -122,3 +122,14 @@ export function secondsToDuration(seconds) {
   }
   return `${hours}h ${minutes}m ${_seconds}s`
 }
+
+export function formatNumberIntoCurrency(value) {
+  if (value) {
+    return value.toLocaleString('en-IN', {
+      maximumFractionDigits: 2,
+      style: 'currency',
+      currency: 'INR',
+    })
+  }
+  return ''
+}