character rule book front

src/pages/Ledgers.vue

@@ -2,7 +2,7 @@
 import {RouterView} from 'vue-router';
 import {CreateLedgerModal} from "@/ledger";
 import {ref} from "vue";
-import {processingControllerApi} from "@/mammon";
+import {processingApi} from "@/mammon";
 
 const createLedgerModal = ref<typeof CreateLedgerModal>();
 </script>
@@ -10,7 +10,7 @@ const createLedgerModal = ref<typeof CreateLedgerModal>();
 <template>
     <div class="mt-4">
       <div class="mb-4 border-b-1 flex justify-end">
-        <button class="mb-2 ms-2" @click="processingControllerApi.processNewActivities()">Process Activities</button>
+        <button class="mb-2 ms-2" @click="processingApi.processNewActivities()">Process Activities</button>
         <button class="mb-2 ms-2" @click="createLedgerModal?.open()">New Ledger</button>
       </div>
       <CreateLedgerModal ref="createLedgerModal" />

src/pages/rules/EditCharacterRuleBook.vue

@@ -0,0 +1,95 @@
+<script setup lang="ts">
+import {Character, CharacterLabel, useCharactersStore} from "@/characters";
+import {useRoute} from "vue-router";
+import {computed, ref, watch, watchEffect} from "vue";
+import log from "loglevel";
+import {
+  findCharacterRuleBookByCharacterId,
+  RuleBook,
+  setCharacterRuleBookForCharacter,
+  useRuleBooksStore
+} from "@/rules";
+import {storeToRefs} from "pinia";
+import {Ledger, LedgerSelect, systemLedger, useLedgersStore} from "@/ledger";
+
+type Bindings = { [key: string]: Ledger; };
+
+const ruleBookStore = useRuleBooksStore();
+const {findById: findCharacterRuleBookById} = ruleBookStore;
+const {ruleBooks} = storeToRefs(ruleBookStore);
+const {findById: findCharacterById} = useCharactersStore();
+const {ledgers} = storeToRefs(useLedgersStore());
+
+const ledgersToUse = computed(() => [systemLedger, ...ledgers.value]);
+
+const character = ref<Character>();
+const ruleBook = ref<RuleBook>();
+const bindings = ref<Bindings>({});
+
+watchEffect(async () => {
+  const characterId = character.value?.characterId;
+
+  if (characterId) {
+    const characterRuleBook = await findCharacterRuleBookByCharacterId(characterId);
+
+    ruleBook.value = findCharacterRuleBookById(characterRuleBook.ruleBookId);
+    bindings.value = Object.fromEntries(
+      Object.entries(characterRuleBook.bindings)
+        .map(([key, id]) => [key, ledgersToUse.value.find(l => l.ledgerId === id) ?? systemLedger])
+    );
+  }
+});
+
+const save = () => {
+  const characterId = character.value?.characterId;
+  const ruleBookId = ruleBook.value?.ruleBookId;
+
+  if (characterId && ruleBookId) {
+    setCharacterRuleBookForCharacter(characterId, {
+      ruleBookId,
+      bindings: Object.fromEntries(
+        Object.entries(bindings.value)
+          .map(([key, ledger]) => [key, ledger.ledgerId])
+      )
+    })
+  }
+}
+
+watch(useRoute(), async route => {
+  if (route.params.characterId) {
+    const id = parseInt(typeof route.params.characterId === 'string' ? route.params.characterId : route.params.characterId[0]);
+
+    character.value = await findCharacterById(id);
+    log.info('Loaded character:', character.value);
+  } else {
+    character.value = undefined;
+    log.info('No character to load');
+  }
+}, { immediate: true })
+</script>
+
+<template>
+  <div v-if="character" class="grid mb-2 mt-4">
+    <div class="mb-2 border-b-1 flex">
+      <CharacterLabel class="flex grow mb-2" :character="character" :size="64" />
+      <div>
+        <button @click="save">Save</button>
+      </div>
+    </div>
+    <div class="flex-col border-b-1">
+      Rule Book:
+      <select class="me-2 mb-2 w-50" v-model="ruleBook">
+        <option v-for="rb in ruleBooks" :key="rb.ruleBookId" :value="rb">{{ rb.name }}</option>
+      </select>
+    </div>
+    <div class="flex-col border-b-1">
+      Ledger Bindings:
+      <div class="flex flex-wrap items-center mb-2 mt-2">
+        <div class="me-2" v-for="ref in ruleBook.ledgerRefs" :ref="ref">
+          <span class="me-1">{{ref}}:</span>
+          <LedgerSelect :ledgers="ledgersToUse" :modelValue="bindings[ref] ?? systemLedger" @update:modelValue="value => bindings[ref] = value" />
+        </div>
+      </div>
+    </div>
+  </div>
+</template>

src/pages/rules/EditRuleBook.vue

@@ -56,7 +56,7 @@ watch(useRoute(), async route => {
     ruleBookId.value = id;
     name.value = ruleBook?.name ?? '';
     ledgerRefs.value = [...ruleBook?.ledgerRefs];
-    rules.value = {...ruleBook?.rules}; // todo fully clone rules
+    rules.value = {...ruleBook?.rules}; // TODO fully clone rules
     log.info('Loaded rule book:', ruleBook);
   } else {
     ruleBookId.value = undefined;