fix: fix rtl in Report and ChartOfAccount

src/components/Report/ListReport.vue

@@ -95,6 +95,7 @@ import WithScroll from '../WithScroll.vue';
 export default defineComponent({
   props: {
     report: Report,
+    direction: String,
   },
   data() {
     return {
@@ -140,9 +141,9 @@ export default defineComponent({
     getCellStyle(cell, i) {
       const styles = {};
       const width = cell.width ?? 1;
-      const align = cell.align ?? 'left';
+      // const align = cell.align ?? this.direction == 'rtl' ? 'right' : 'left';
       styles['width'] = `${width * this.wconst}rem`;
-      styles['text-align'] = align;
+      styles['text-align'] = this.direction == 'rtl' ? 'right' : 'left';
 
       if (cell.bold) {
         styles['font-weight'] = 'bold';
@@ -153,7 +154,11 @@ export default defineComponent({
       }
 
       if (i === 0) {
-        styles['padding-left'] = '0px';
+        if(this.direction == 'rtl'){
+          styles['padding-right'] = '0px'; 
+        }else{
+          styles['padding-left'] = '0px';
+        }
       }
 
       if (
@@ -164,15 +169,23 @@ export default defineComponent({
           FieldTypeEnum.Float,
         ].includes(cell.fieldtype)
       ) {
-        styles['text-align'] = 'right';
+        styles['text-align'] = this.direction == 'rtl' ? 'right' : 'left';
       }
 
       if (i === this.report.columns.length - 1) {
-        styles['padding-right'] = '0px';
+        if(this.direction == 'rtl'){
+          styles['padding-left'] = '0px';
+        }else{
+          styles['padding-right'] = '0px';
+        }
       }
 
       if (cell.indent) {
-        styles['padding-left'] = `${cell.indent * 2}rem`;
+        if(this.direction == 'rtl'){
+          styles['padding-right'] = `${cell.indent * 2}rem`;
+        }else{
+          styles['padding-left'] = `${cell.indent * 2}rem`;
+        }
       }
 
       return styles;

src/pages/ChartOfAccounts.vue

@@ -31,7 +31,7 @@
             account.level !== 0 ? 'text-base' : 'text-lg',
             isQuickEditOpen(account) ? 'bg-gray-200' : '',
           ]"
-          :style="`height: calc(var(--h-row-mid) + 1px); padding-left: calc(1rem + 2rem * ${account.level})`"
+          :style="getItemStyle(account.level)"
           @click="onClick(account)"
         >
           <component :is="getIconComponent(account)" />
@@ -88,9 +88,7 @@
             items-center
             text-base
           "
-          :style="`height: calc(var(--h-row-mid) + 1px); padding-left: calc(1rem + 2rem * ${
-            account.level + 1
-          })`"
+          :style="getGroupStyle(account.level+1)"
           :key="account.name + '-adding-account'"
         >
           <component
@@ -148,6 +146,7 @@ import { isCredit } from 'models/helpers';
 import { ModelNameEnum } from 'models/types';
 import PageHeader from 'src/components/PageHeader.vue';
 import { fyo } from 'src/initFyo';
+import { RTL_LAGNUAGES } from 'fyo/utils/consts';
 import { docsPathMap } from 'src/utils/misc';
 import { docsPath, openQuickEdit } from 'src/utils/ui';
 import { getMapFromList, removeAtIndex } from 'utils/index';
@@ -171,9 +170,12 @@ export default {
       insertingAccount: false,
       totals: {},
       refetchTotals: false,
+      direction: 'ltr'
     };
   },
   async mounted() {
+    const language = fyo.config.get("language");
+    this.direction = RTL_LAGNUAGES.includes(language) ? 'rtl' : 'ltr';
     await this.setTotalDebitAndCredit();
     fyo.doc.observer.on('sync:AccountingLedgerEntry', () => {
       this.refetchTotals = true;
@@ -460,6 +462,28 @@ export default {
         template: icons[account.name] || icon,
       };
     },
+    getItemStyle(level){
+      const styles = {
+        "height": "calc(var(--h-row-mid) + 1px)"
+      };
+      if(this.direction == 'rtl'){
+        styles['padding-right'] = `calc(1rem + 2rem * ${level})`;
+      }else{
+        styles['padding-left'] = `calc(1rem + 2rem * ${level})`;
+      }
+      return styles
+    },
+    getGroupStyle(level){
+      const styles = {
+        "height": "height: calc(var(--h-row-mid) + 1px)"
+      };
+      if(this.direction == 'rtl'){
+        styles['padding-right'] = `calc(1rem + 2rem * ${level})`;
+      }else{
+        styles['padding-left'] = `calc(1rem + 2rem * ${level})`;
+      }
+      return styles
+    }
   },
   computed: {
     allAccounts() {

src/pages/Report.vue

@@ -33,7 +33,7 @@
     </div>
 
     <!-- Report Body -->
-    <ListReport v-if="report" :report="report" class="" />
+    <ListReport v-if="report" :report="report" class="" :direction="direction" />
   </div>
 </template>
 <script>
@@ -45,6 +45,7 @@ import DropdownWithActions from 'src/components/DropdownWithActions.vue';
 import PageHeader from 'src/components/PageHeader.vue';
 import ListReport from 'src/components/Report/ListReport.vue';
 import { fyo } from 'src/initFyo';
+import { RTL_LAGNUAGES } from 'fyo/utils/consts';
 import { docsPathMap } from 'src/utils/misc';
 import { docsPath } from 'src/utils/ui';
 import { defineComponent } from 'vue';
@@ -61,6 +62,7 @@ export default defineComponent({
     return {
       loading: false,
       report: null,
+      direction: 'ltr',
     };
   },
   provide() {
@@ -117,6 +119,8 @@ export default defineComponent({
   },
   methods: {
     async setReportData() {
+      const language = fyo.config.get("language");
+      this.direction = RTL_LAGNUAGES.includes(language) ? 'rtl' : 'ltr';
       const Report = reports[this.reportClassName];
 
       if (this.report === null) {