Adds "Pending Payment" badge for receivables

Improves user experience by visually indicating entries that represent outstanding payments owed by users.

This change introduces a "Pending Payment" badge for receivable entries in the transaction list. A receivable entry is determined by checking if the entry contains a debit line item against an account receivable account. This provides immediate visual feedback to the user, highlighting transactions requiring their action.

static/js/index.js

@@ -531,6 +531,23 @@ window.app = Vue.createApp({
         }
       }
       return null
+    },
+    isReceivable(entry) {
+      // Check if this is a receivable entry (user owes castle)
+      // Receivables have a debit to an "Accounts Receivable" account with the user's ID
+      if (!entry.lines || entry.lines.length === 0) return false
+
+      for (const line of entry.lines) {
+        // Look for a line with positive debit on an accounts receivable account
+        if (line.debit > 0) {
+          // Check if the account is associated with this user's receivables
+          const account = this.accounts.find(a => a.id === line.account_id)
+          if (account && account.name && account.name.includes('Accounts Receivable') && account.account_type === 'asset') {
+            return true
+          }
+        }
+      }
+      return false
     }
   },
   async created() {

templates/castle/index.html

@@ -200,7 +200,12 @@
         <q-list v-if="transactions.length > 0" separator>
           <q-item v-for="entry in transactions" :key="entry.id">
             <q-item-section>
-              <q-item-label>{% raw %}{{ entry.description }}{% endraw %}</q-item-label>
+              <q-item-label>
+                {% raw %}{{ entry.description }}{% endraw %}
+                <q-badge v-if="isReceivable(entry)" color="orange" class="q-ml-sm">
+                  Pending Payment
+                </q-badge>
+              </q-item-label>
               <q-item-label caption>
                 {% raw %}{{ formatDate(entry.entry_date) }}{% endraw %}
               </q-item-label>