incr: clean up coa markup, show balance on leaf ac

fyo/core/converter.ts

@@ -152,11 +152,11 @@ export class Converter {
 }
 
 function toDocString(value: RawValue, field: Field) {
-  if (typeof value === 'string') {
+  if (value === null) {
-    return value;
+    return null;
   }
 
-  if (value === null) {
+  if (typeof value === 'string') {
     return value;
   }
 
@@ -164,6 +164,10 @@ function toDocString(value: RawValue, field: Field) {
 }
 
 function toDocDate(value: RawValue, field: Field) {
+  if (value === null) {
+    return null;
+  }
+
   if (typeof value !== 'number' && typeof value !== 'string') {
     throwError(value, field, 'doc');
   }
@@ -189,6 +193,10 @@ function toDocCurrency(value: RawValue, field: Field, fyo: Fyo) {
     return fyo.pesa(Number(value));
   }
 
+  if (value === null) {
+    return fyo.pesa(0);
+  }
+
   throwError(value, field, 'doc');
 }
 
@@ -209,6 +217,10 @@ function toDocFloat(value: RawValue, field: Field): number {
     value = parseFloat(value);
   }
 
+  if (value === null) {
+    value = 0;
+  }
+
   if (typeof value === 'number' && !Number.isNaN(value)) {
     return value;
   }

models/baseModels/PurchaseInvoice/PurchaseInvoice.ts

@@ -1,10 +1,8 @@
 import { Fyo } from 'fyo';
 import { Action, ListViewSettings } from 'fyo/model/types';
 import { LedgerPosting } from 'models/ledgerPosting/ledgerPosting';
-import {
+import { ModelNameEnum } from 'models/types';
-  getTransactionActions,
+import { getInvoiceActions, getTransactionStatusColumn } from '../../helpers';
-  getTransactionStatusColumn,
-} from '../../helpers';
 import { Invoice } from '../Invoice/Invoice';
 import { PurchaseInvoiceItem } from '../PurchaseInvoiceItem/PurchaseInvoiceItem';
 
@@ -37,7 +35,7 @@ export class PurchaseInvoice extends Invoice {
   }
 
   static getActions(fyo: Fyo): Action[] {
-    return getTransactionActions('PurchaseInvoice', fyo);
+    return getInvoiceActions(ModelNameEnum.PurchaseInvoice, fyo);
   }
 
   static getListViewSettings(): ListViewSettings {

models/baseModels/SalesInvoice/SalesInvoice.ts

@@ -1,10 +1,8 @@
 import { Fyo } from 'fyo';
 import { Action, ListViewSettings } from 'fyo/model/types';
 import { LedgerPosting } from 'models/ledgerPosting/ledgerPosting';
-import {
+import { ModelNameEnum } from 'models/types';
-  getTransactionActions,
+import { getInvoiceActions, getTransactionStatusColumn } from '../../helpers';
-  getTransactionStatusColumn,
-} from '../../helpers';
 import { Invoice } from '../Invoice/Invoice';
 import { SalesInvoiceItem } from '../SalesInvoiceItem/SalesInvoiceItem';
 
@@ -35,7 +33,7 @@ export class SalesInvoice extends Invoice {
   }
 
   static getActions(fyo: Fyo): Action[] {
-    return getTransactionActions('SalesInvoice', fyo);
+    return getInvoiceActions(ModelNameEnum.SalesInvoice, fyo);
   }
 
   static getListViewSettings(): ListViewSettings {

models/helpers.ts

@@ -5,7 +5,7 @@ import { NotFoundError } from 'fyo/utils/errors';
 import { DateTime } from 'luxon';
 import Money from 'pesa/dist/types/src/money';
 import { Router } from 'vue-router';
-import { InvoiceStatus } from './types';
+import { InvoiceStatus, ModelNameEnum } from './types';
 
 export function getLedgerLinkAction(fyo: Fyo): Action {
   return {
@@ -27,7 +27,10 @@ export function getLedgerLinkAction(fyo: Fyo): Action {
   };
 }
 
-export function getTransactionActions(schemaName: string, fyo: Fyo): Action[] {
+export function getInvoiceActions(
+  schemaName: ModelNameEnum.PurchaseInvoice | ModelNameEnum.SalesInvoice,
+  fyo: Fyo
+): Action[] {
   return [
     {
       label: fyo.t`Make Payment`,
@@ -64,13 +67,6 @@ export function getTransactionActions(schemaName: string, fyo: Fyo): Action[] {
         });
       },
     },
-    {
-      label: fyo.t`Print`,
-      condition: (doc: Doc) => doc.submitted as boolean,
-      action: async (doc: Doc, router: Router) => {
-        router.push({ path: `/print/${doc.schemaName}/${doc.name}` });
-      },
-    },
     getLedgerLinkAction(fyo),
   ];
 }

src/pages/ChartOfAccounts.vue

@@ -1,9 +1,12 @@
 <template>
   <div class="flex flex-col overflow-y-hidden">
     <PageHeader :title="t`Chart of Accounts`" />
-    <div class="flex-1 flex px-8 overflow-y-auto">
+
-      <div class="flex-1" v-if="root">
+    <!-- Chart of Accounts -->
-        <div v-for="account in allAccounts" :key="account.name">
+    <div class="flex-1 flex flex-col px-8 overflow-y-auto" v-if="root">
+      <!-- Chart of Accounts Indented List -->
+      <template v-for="account in allAccounts" :key="account.name">
+        <!-- Account List Item -->
         <div
           class="
             mt-2
@@ -13,14 +16,16 @@
             hover:bg-gray-100
             rounded-md
             group
+            flex
+            items-center
           "
           :class="[
             account.level !== 0 ? 'text-base' : 'text-lg',
             isQuickEditOpen(account) ? 'bg-gray-200' : '',
+            `pl-${account.level * 8}`,
           ]"
           @click="onClick(account)"
         >
-            <div class="flex items-center" :class="`pl-${account.level * 8}`">
           <component :is="getIconComponent(account)" />
           <div class="flex items-baseline">
             <div
@@ -29,10 +34,9 @@
             >
               {{ account.name }}
             </div>
-                <div
+
-                  v-if="account.isGroup"
+            <!-- Add Account Buttons on Group Hover -->
-                  class="ml-6 hidden group-hover:block"
+            <div v-if="account.isGroup" class="ml-6 hidden group-hover:block">
-                >
               <button
                 class="
                   text-xs text-gray-800
@@ -56,8 +60,14 @@
               </button>
             </div>
           </div>
+
+          <!-- Account Balance String -->
+          <p class="ml-auto text-base text-gray-800" v-if="!account.isGroup">
+            {{ getBalanceString(account) }}
+          </p>
         </div>
-          </div>
+
+        <!-- Add Account/Group -->
         <div
           v-if="account.addingAccount || account.addingGroupAccount"
           class="
@@ -68,19 +78,18 @@
             hover:bg-gray-100
             rounded-md
             group
+            flex
+            items-center
           "
-            :class="[account.level !== 0 ? 'text-base' : 'text-lg']"
+          :class="`${account.level !== 0 ? 'text-base' : 'text-lg'} pl-${
+            (account.level + 1) * 8
+          }`"
           :key="account.name + '-adding-account'"
-          >
-            <div
-              class="flex items-center"
-              :class="`pl-${(account.level + 1) * 8}`"
         >
           <component
             :is="getIconComponent({ isGroup: account.addingGroupAccount })"
           />
-              <div class="flex items-baseline">
+          <div class="flex items-baseline ml-3">
-                <div class="ml-3">
             <input
               class="focus:outline-none bg-transparent"
               :class="{ 'text-gray-600': insertingAccount }"
@@ -112,14 +121,13 @@
             </button>
           </div>
         </div>
-            </div>
+      </template>
-          </div>
-        </div>
-      </div>
     </div>
   </div>
 </template>
 <script>
+import { t } from 'fyo';
+import { AccountRootTypeEnum } from 'models/baseModels/Account/types';
 import { ModelNameEnum } from 'models/types';
 import PageHeader from 'src/components/PageHeader';
 import { fyo } from 'src/initFyo';
@@ -146,6 +154,26 @@ export default {
     }
   },
   methods: {
+    isCredit(rootType) {
+      switch (rootType) {
+        case AccountRootTypeEnum.Asset:
+          return false;
+        case AccountRootTypeEnum.Liability:
+          return true;
+        case AccountRootTypeEnum.Equity:
+          return true;
+        case AccountRootTypeEnum.Expense:
+          return false;
+        case AccountRootTypeEnum.Income:
+          return true;
+        default:
+          return true;
+      }
+    },
+    getBalanceString(account) {
+      const suffix = this.isCredit(account.rootType) ? t`Cr.` : t`Dr.`;
+      return `${fyo.format(account.balance, 'Currency')} ${suffix}`;
+    },
     async fetchAccounts() {
       this.settings = fyo.models[ModelNameEnum.Account].getTreeSettings(fyo);
       const { currency } = await fyo.doc.getSingle('AccountingSettings');

src/utils/ui.ts

@@ -258,7 +258,7 @@ function getCancelAction(doc: Doc): Action {
     component: {
       template: '<span class="text-red-700">{{ t`Cancel` }}</span>',
     },
-    condition: (doc: Doc) => !doc.cancelled,
+    condition: (doc: Doc) => !!doc.submitted && !doc.cancelled,
     action: () => {
       cancelDocWithPrompt(doc).then((res) => {
         if (res) {
@@ -276,10 +276,7 @@ function getDeleteAction(doc: Doc): Action {
       template: '<span class="text-red-700">{{ t`Delete` }}</span>',
     },
     condition: (doc: Doc) =>
-      !doc.notInserted &&
+      !doc.notInserted && !doc.submitted && !doc.schema.isSingle,
-      !doc.submitted &&
-      !doc.schema.isSingle &&
-      !doc.cancelled,
     action: () =>
       deleteDocWithPrompt(doc).then((res) => {
         if (res) {
@@ -296,7 +293,7 @@ function getDuplicateAction(doc: Doc): Action {
     condition: (doc: Doc) =>
       !!(
         ((isSubmittable && doc && doc.submitted) || !isSubmittable) &&
-        !doc._notInserted &&
+        !doc.notInserted &&
         !(doc.cancelled || false)
       ),
     action: () => {