pretyness

src/ledger/LedgerSelect.vue

@@ -1,5 +1,5 @@
 <script setup lang="ts">
-import {Ledger, useLedgersStore} from "@/ledger/ledger.ts";
+import {Ledger, systemLedger, useLedgersStore} from "@/ledger/ledger.ts";
 import {storeToRefs} from "pinia";
 import {computed} from "vue";
 
@@ -12,11 +12,24 @@ const ledger = defineModel<Ledger>();
 const {ledgers: allLedgers} = storeToRefs(useLedgersStore());
 
 const ledgersToUse = computed(() => props.ledgers || allLedgers);
+const legerId = computed({
+  get: () => ledger.value?.ledgerId,
+  set: value => ledger.value = ledgersToUse.value[ledgersToUse.value.findIndex(x => x.value === value)]
+})
 
 </script>
 
 <template>
-  <select v-model="ledger">
-    <option v-for="ledger in ledgersToUse" :key="ledger.ledgerId" :value="ledger">{{ ledger.name }}</option>
+  <select v-model="legerId" :class="{'system-ledger': ledger === systemLedger}">
+    <option v-for="ledger in ledgersToUse" :key="ledger.ledgerId" :value="ledger.ledgerId" :class="{'system-ledger': ledger === systemLedger}">{{ ledger.name }}</option>
   </select>
 </template>
+
+<style scoped>
+@reference "tailwindcss";
+
+.system-ledger {
+  @apply text-emerald-400;
+}
+
+</style>

src/ledger/ledger.ts

@@ -20,6 +20,14 @@ export type MainLedger = MainLedgerResponse & {type: MainLedgerResponseTypeEnum}
 export type CombinedLedger = CombinedLedgerResponse & {type: CombinedLedgerResponseTypeEnum}
 export type Ledger = MainLedger | CombinedLedger;
 
+export const systemLedger = {
+    type: LedgerTypes.Main,
+    ledgerId: "",
+    name: "Eve Economy",
+    balance: 0,
+    _system: true
+} as MainLedger;
+
 export const isMain = (ledger: Ledger): ledger is MainLedger => {
     return ledger.type === LedgerTypes.Main;
 }

src/pages/rules/EditRuleBook.vue

@@ -48,9 +48,9 @@ watch(useRoute(), async route => {
       </div>
     </div>
     <div v-if="ruleBook" class="flex-col">
-      <div class="flex-col grow border-b-1" v-for="activityType in activityTypes" :key="activityType">
-        <span>{{ activityType }}</span>
-        <RuleSetInput v-model="ruleBook.ruleSets[activityType]" />
+      <div class="flex-col grow border-b-1" v-for="activityType in activityTypes" :key="activityType.key">
+        <span>{{ activityType.name }}</span>
+        <RuleSetInput v-model="ruleBook.ruleSets[activityType.key]" />
       </div>
     </div>
   </div>

src/rules/RuleInput.vue

@@ -1,20 +1,21 @@
 <script setup lang="ts">
 
-import {RuleResponse, RuleResponseRateEnum} from "@/generated/mammon";
+import {RuleResponse} from "@/generated/mammon";
 import {computed} from "vue";
-import {isMain, Ledger, LedgerSelect, useLedgersStore} from "@/ledger";
+import {isMain, Ledger, LedgerSelect, systemLedger, useLedgersStore} from "@/ledger";
+import {ratesTypes} from "@/rules/rules.ts";
 
 const rule = defineModel<RuleResponse>();
 
 const ledgersStore = useLedgersStore();
 const {findById} = ledgersStore;
-const ledgers = computed(() => ledgersStore.ledgers.filter(isMain));
+const ledgers = computed<Ledger[]>(() => [systemLedger, ...ledgersStore.ledgers.filter(isMain)]);
 
-const ledgerComputed = (key: 'fromLedgerId' | 'toLedgerId') => computed<Ledger | undefined>({
-  get: () => rule.value && rule.value[key] ? findById(rule.value[key]) : undefined,
+const ledgerComputed = (key: 'fromLedgerId' | 'toLedgerId') => computed<Ledger>({
+  get: () => rule.value && rule.value[key] ? findById(rule.value[key]) ?? systemLedger : systemLedger,
   set: value => {
     if (value) {
-      rule.value = {...rule.value, [key]: value.ledgerId}
+      rule.value = {...rule.value, [key]: value.ledgerId.length ? value.ledgerId : undefined}
     }
   }
 })
@@ -26,7 +27,7 @@ const toLedger = ledgerComputed('toLedgerId')
 
 <template>
   <select class="me-2 grow" v-model="rule.rate">
-    <option v-for="rateType in RuleResponseRateEnum" :key="rateType" :value="rateType">{{ rateType }}</option>
+    <option v-for="rateType in ratesTypes" :key="rateType.key" :value="rateType.key">{{ rateType.name }}</option>
   </select>
  <LedgerSelect class="me-2 grow" v-model="fromLedger" :ledgers="ledgers" />
  <LedgerSelect class="me-2 grow" v-model="toLedger" :ledgers="ledgers" />

src/rules/rules.ts

@@ -1,16 +1,27 @@
 import {ruleBookControllerApi} from "@/mammon";
-import {RuleBookResponse, RuleSetResponse} from "@/generated/mammon";
+import {RuleBookResponse, RuleResponseRateEnum, RuleSetResponse} from "@/generated/mammon";
 
 export const activityTypes = {
-    itemBought: "ITEM_BOUGHT",
-    itemSold: "ITEM_SOLD",
-    // bountyEarned: "BOUNTY_EARNED",
-    // itemManufactured: "ITEM_MANUFACTURED"
+    itemBought: {key: "ITEM_BOUGHT", name: "Item Bought"},
+    itemSold: {key: "ITEM_SOLD", name: "Item Sold"},
+    // bountyEarned:  {id: "BOUNTY_EARNED", name: "Bounty Earned"},
+    // itemManufactured:  {id: "ITEM_MANUFACTURED", name: "Item Manufactured"}
 } as const;
 
-export type ActivityType = typeof activityTypes[keyof typeof activityTypes];
+export type Activity = { key: ActivityType, name: string }
+export type ActivityType = typeof activityTypes[keyof typeof activityTypes]['key'];
 export type RuleBook = RuleBookResponse & { ruleSets: { [key: ActivityType]: RuleSetResponse; } }
 
+export const ratesTypes = {
+    None: {key: "NONE", name: "0 ISK"},
+    Value: {key: "VALUE", name: "Value"},
+    JitaBuy: {key: "JITA_BUY", name: "Jita Buy Order"},
+    JitaSell: {key: "JITA_SELL", name: "Jita Sell Order"},
+    EveEstimate: {key: "EVE_ESTIMATE", name: "Eve Estimate"},
+} as const;
+
+export type Rate = { key: RuleResponseRateEnum, name: string }
+
 export const findByCharacterId = (characterId: number): Promise<RuleBook> => ruleBookControllerApi.findByCharacterId(characterId)
     .then(response => response.data)
     .catch(() => ({characterId, ruleSets: {}}));