From 538885cffba891a1b88b47da71df6c7b687250a8 Mon Sep 17 00:00:00 2001
From: Shariq Ansari <sharique.rik@gmail.com>
Date: Wed, 25 Dec 2024 18:42:59 +0530
Subject: [PATCH] fix: align right - currency, int, float & percent fields

---
 crm/fcrm/doctype/crm_deal/crm_deal.py                       | 1 +
 frontend/src/components/ColumnSettings.vue                  | 6 +++++-
 frontend/src/components/ListViews/CallLogsListView.vue      | 2 +-
 frontend/src/components/ListViews/ContactsListView.vue      | 2 +-
 frontend/src/components/ListViews/DealsListView.vue         | 2 +-
 .../src/components/ListViews/EmailTemplatesListView.vue     | 2 +-
 frontend/src/components/ListViews/LeadsListView.vue         | 2 +-
 frontend/src/components/ListViews/OrganizationsListView.vue | 2 +-
 frontend/src/components/ListViews/TasksListView.vue         | 2 +-
 9 files changed, 13 insertions(+), 8 deletions(-)

diff --git a/crm/fcrm/doctype/crm_deal/crm_deal.py b/crm/fcrm/doctype/crm_deal/crm_deal.py
index dc18c133..04bf74fd 100644
--- a/crm/fcrm/doctype/crm_deal/crm_deal.py
+++ b/crm/fcrm/doctype/crm_deal/crm_deal.py
@@ -139,6 +139,7 @@ class CRMDeal(Document):
 				'label': 'Amount',
 				'type': 'Currency',
 				'key': 'annual_revenue',
+				'align': 'right',
 				'width': '9rem',
 			},
 			{
diff --git a/frontend/src/components/ColumnSettings.vue b/frontend/src/components/ColumnSettings.vue
index d91ce735..438e7eaf 100644
--- a/frontend/src/components/ColumnSettings.vue
+++ b/frontend/src/components/ColumnSettings.vue
@@ -49,7 +49,9 @@
               </div>
             </template>
           </Draggable>
-          <div class="mt-1.5 flex flex-col gap-1 border-t border-outline-gray-modals pt-1.5">
+          <div
+            class="mt-1.5 flex flex-col gap-1 border-t border-outline-gray-modals pt-1.5"
+          >
             <Autocomplete
               value=""
               :options="fields"
@@ -213,11 +215,13 @@ const fields = computed(() => {
 })
 
 function addColumn(c) {
+  let align = ['Float', 'Int', 'Percent', 'Currency'].includes(c.type) ? 'right' : 'left'
   let _column = {
     label: c.label,
     type: c.type,
     key: c.value,
     width: '10rem',
+    align,
   }
   columns.value.push(_column)
   rows.value.push(c.value)
diff --git a/frontend/src/components/ListViews/CallLogsListView.vue b/frontend/src/components/ListViews/CallLogsListView.vue
index 4331237b..1522e0a5 100644
--- a/frontend/src/components/ListViews/CallLogsListView.vue
+++ b/frontend/src/components/ListViews/CallLogsListView.vue
@@ -38,7 +38,7 @@
       v-slot="{ idx, column, item }"
       doctype="CRM Call Log"
     >
-      <ListRowItem :item="item">
+      <ListRowItem :item="item" :align="column.align">
         <template #prefix>
           <div v-if="['caller', 'receiver'].includes(column.key)">
             <Avatar
diff --git a/frontend/src/components/ListViews/ContactsListView.vue b/frontend/src/components/ListViews/ContactsListView.vue
index c944dcc8..aeecb7c8 100644
--- a/frontend/src/components/ListViews/ContactsListView.vue
+++ b/frontend/src/components/ListViews/ContactsListView.vue
@@ -42,7 +42,7 @@
       v-slot="{ idx, column, item }"
       doctype="Contact"
     >
-      <ListRowItem :item="item">
+      <ListRowItem :item="item" :align="column.align">
         <template #prefix>
           <div v-if="column.key === 'full_name'">
             <Avatar
diff --git a/frontend/src/components/ListViews/DealsListView.vue b/frontend/src/components/ListViews/DealsListView.vue
index 03dd100e..ddd0df51 100644
--- a/frontend/src/components/ListViews/DealsListView.vue
+++ b/frontend/src/components/ListViews/DealsListView.vue
@@ -57,7 +57,7 @@
           "
         />
       </div>
-      <ListRowItem v-else :item="item">
+      <ListRowItem v-else :item="item" :align="column.align">
         <template #prefix>
           <div v-if="column.key === 'status'">
             <IndicatorIcon :class="item.color" />
diff --git a/frontend/src/components/ListViews/EmailTemplatesListView.vue b/frontend/src/components/ListViews/EmailTemplatesListView.vue
index 52931cbb..2d937cb8 100644
--- a/frontend/src/components/ListViews/EmailTemplatesListView.vue
+++ b/frontend/src/components/ListViews/EmailTemplatesListView.vue
@@ -37,7 +37,7 @@
       v-slot="{ idx, column, item }"
       doctype="Email Template"
     >
-      <ListRowItem :item="item">
+      <ListRowItem :item="item" :align="column.align">
         <!-- <template #prefix>
 
           </template> -->
diff --git a/frontend/src/components/ListViews/LeadsListView.vue b/frontend/src/components/ListViews/LeadsListView.vue
index ea79c83a..dccfe438 100644
--- a/frontend/src/components/ListViews/LeadsListView.vue
+++ b/frontend/src/components/ListViews/LeadsListView.vue
@@ -57,7 +57,7 @@
           "
         />
       </div>
-      <ListRowItem v-else :item="item">
+      <ListRowItem v-else :item="item" :align="column.align">
         <template #prefix>
           <div v-if="column.key === 'status'">
             <IndicatorIcon :class="item.color" />
diff --git a/frontend/src/components/ListViews/OrganizationsListView.vue b/frontend/src/components/ListViews/OrganizationsListView.vue
index 5cc57e49..8dfc0ae6 100644
--- a/frontend/src/components/ListViews/OrganizationsListView.vue
+++ b/frontend/src/components/ListViews/OrganizationsListView.vue
@@ -41,7 +41,7 @@
       v-slot="{ idx, column, item }"
       doctype="CRM Organization"
     >
-      <ListRowItem :item="item">
+      <ListRowItem :item="item" :align="column.align">
         <template #prefix>
           <div v-if="column.key === 'organization_name'">
             <Avatar
diff --git a/frontend/src/components/ListViews/TasksListView.vue b/frontend/src/components/ListViews/TasksListView.vue
index dc85354e..7109449f 100644
--- a/frontend/src/components/ListViews/TasksListView.vue
+++ b/frontend/src/components/ListViews/TasksListView.vue
@@ -47,7 +47,7 @@
           </div>
         </Tooltip>
       </div>
-      <ListRowItem v-else :item="item">
+      <ListRowItem v-else :item="item" :align="column.align">
         <template #prefix>
           <div v-if="column.key === 'status'">
             <TaskStatusIcon :status="item" />