rework store usage

This commit is contained in:
Sirttas
2026-06-11 20:02:15 +02:00
parent f3cb4798d5
commit dd031551ca
13 changed files with 46 additions and 63 deletions
+6 -9
View File
@@ -1,18 +1,15 @@
<script setup lang="ts">
import {computed} from "vue";
import {storeToRefs} from "pinia";
import {Modal} from "@/components";
import {useConfirmStore} from "./useConfirm";
const confirmStore = useConfirmStore();
const {open, options} = storeToRefs(confirmStore);
const {accept, cancel} = confirmStore;
const modalOpen = computed({
get: () => open.value,
get: () => confirmStore.open,
set: value => {
if (!value) {
cancel();
confirmStore.cancel();
}
},
});
@@ -21,12 +18,12 @@ const modalOpen = computed({
<template>
<Modal v-model:open="modalOpen">
<div class="bg-slate-800 rounded pb-4 w-96">
<span class="m-2">{{ options.title ?? "Confirm" }}</span>
<span class="m-2">{{ confirmStore.options.title ?? "Confirm" }}</span>
<hr />
<div class="m-4">{{ options.message }}</div>
<div class="m-4">{{ confirmStore.options.message }}</div>
<div class="flex justify-end">
<button class="me-2" @click="cancel">{{ options.cancelLabel ?? "Cancel" }}</button>
<button class="confirm me-4" :class="options.danger ? 'danger' : ''" @click="accept">{{ options.confirmLabel ?? "Confirm" }}</button>
<button class="me-2" @click="confirmStore.cancel">{{ confirmStore.options.cancelLabel ?? "Cancel" }}</button>
<button class="confirm me-4" :class="confirmStore.options.danger ? 'danger' : ''" @click="confirmStore.accept">{{ confirmStore.options.confirmLabel ?? "Confirm" }}</button>
</div>
</div>
</Modal>
+7 -10
View File
@@ -1,7 +1,6 @@
<script setup lang="ts">
import {computed, ref} from "vue";
import {storeToRefs} from "pinia";
import {isCombined, Ledger, LedgerType, LedgerTypes, useLedgersStore} from "./ledger";
import {Modal} from "@/components";
import LedgerLabel from "./LedgerLabel.vue";
@@ -15,8 +14,6 @@ interface Props {
const props = defineProps<Props>();
const ledgersStore = useLedgersStore();
const {ledgers} = storeToRefs(ledgersStore);
const {findById, findAllById, createMain, createCombined, updateMain, updateCombined} = ledgersStore;
const modalOpen = ref<boolean>(false);
@@ -24,7 +21,7 @@ const type = ref<LedgerType>(LedgerTypes.Main);
const name = ref("");
const members = ref<Ledger[]>([]);
const selectedLedger = ref<Ledger>();
const availableLedgers = computed(() => ledgers.value
const availableLedgers = computed(() => ledgersStore.ledgers
.filter(l => l.ledgerId !== props.ledgerId)
.filter(l => !members.value.includes(l)));
@@ -37,12 +34,12 @@ const addMember = () => {
}
const open = () => {
const ledger = isCreating.value ? undefined : findById(props.ledgerId);
const ledger = isCreating.value ? undefined : ledgersStore.findById(props.ledgerId);
if (ledger) {
type.value = ledger.type;
name.value = ledger.name;
members.value = isCombined(ledger) ? findAllById(ledger.memberLedgerIds) : [];
members.value = isCombined(ledger) ? ledgersStore.findAllById(ledger.memberLedgerIds) : [];
} else {
type.value = LedgerTypes.Main;
name.value = "";
@@ -62,17 +59,17 @@ const title = computed(() => {
const create = () => {
if (type.value === LedgerTypes.Main) {
createMain({name: name.value})
ledgersStore.createMain({name: name.value})
} else {
createCombined({name: name.value, memberLedgerIds: members.value.map(l => l.ledgerId)})
ledgersStore.createCombined({name: name.value, memberLedgerIds: members.value.map(l => l.ledgerId)})
}
}
const update = () => {
if (type.value === LedgerTypes.Main) {
updateMain(props.ledgerId, {name: name.value})
ledgersStore.updateMain(props.ledgerId, {name: name.value})
} else {
updateCombined(props.ledgerId, {name: name.value, memberLedgerIds: members.value.map(l => l.ledgerId)})
ledgersStore.updateCombined(props.ledgerId, {name: name.value, memberLedgerIds: members.value.map(l => l.ledgerId)})
}
}
+2 -3
View File
@@ -1,6 +1,5 @@
<script setup lang="ts">
import {Ledger, systemLedger, useLedgersStore} from "@/ledger/ledger.ts";
import {storeToRefs} from "pinia";
import {computed} from "vue";
interface Props {
@@ -9,9 +8,9 @@ interface Props {
const props = defineProps<Props>()
const ledger = defineModel<Ledger>();
const {ledgers: allLedgers} = storeToRefs(useLedgersStore());
const ledgersStore = useLedgersStore();
const ledgersToUse = computed(() => props.ledgers || allLedgers);
const ledgersToUse = computed(() => props.ledgers || ledgersStore.ledgers);
const ledgerId = computed({
get: () => ledger.value?.ledgerId,
set: value => ledger.value = ledgersToUse.value.find(l => l.ledgerId === value)
+2 -2
View File
@@ -80,9 +80,9 @@ export const findAllTransactionInLeger = (ledger: Ledger | string): Promise<Tran
export const getLedgerBalance = (ledger: Ledger | string): Promise<BalanceResponse> => ledgerApi.findBalanceByLedgerId(getLedgerId(ledger)).then(response => response.data)
export const useLedgerParam = () => {
const {findById} = useLedgersStore();
const ledgersStore = useLedgersStore();
const ledgerId = useRouteParams<string, string>('ledgerId', '', { transform: v => typeof v === 'string' ? v : v[0]});
const ledger = computed(() => findById(ledgerId.value))
const ledger = computed(() => ledgersStore.findById(ledgerId.value))
return {ledgerId, ledger};
}
+3 -4
View File
@@ -1,19 +1,18 @@
<script setup lang="ts">
import {storeToRefs} from "pinia";
import {useMarketTaxStore} from "./tax";
const { brokerFee, scc } = storeToRefs(useMarketTaxStore());
const marketTaxStore = useMarketTaxStore();
</script>
<template>
<div class="end">
<span>Broker Fee: </span>
<input type="number" min="1" max="3" step="0.01" v-model="brokerFee" />
<input type="number" min="1" max="3" step="0.01" v-model="marketTaxStore.brokerFee" />
</div>
<div class="end">
<span>SCC: </span>
<input type="number" min="3.6" max="8" step="0.01" v-model="scc" >
<input type="number" min="3.6" max="8" step="0.01" v-model="marketTaxStore.scc" >
</div>
</template>
+2 -5
View File
@@ -1,13 +1,10 @@
<script setup lang="ts">
import {mammonAddCharacterUrl} from "@/mammon";
import {storeToRefs} from "pinia";
import {CharacterLabel, useCharactersStore} from "@/characters";
import {ArrowPathIcon} from '@heroicons/vue/24/outline';
const charactersStore = useCharactersStore()
const {characters} = storeToRefs(charactersStore);
const {reloadActivities} = charactersStore;
const addCharacter = () => {
window.location.replace(mammonAddCharacterUrl);
@@ -19,9 +16,9 @@ const addCharacter = () => {
<div class="mb-4 border-b-1 flex justify-end">
<button class="mb-2" @click="addCharacter">Add chacarcter</button>
</div>
<div v-for="character in characters" :key="character.characterId" class="flex items-center mb-2">
<div v-for="character in charactersStore.characters" :key="character.characterId" class="flex items-center mb-2">
<CharacterLabel class="grow" :character="character" />
<button class="btn-icon" @click="reloadActivities(character.characterId)"><ArrowPathIcon /></button>
<button class="btn-icon" @click="charactersStore.reloadActivities(character.characterId)"><ArrowPathIcon /></button>
</div>
</div>
</template>
+2 -2
View File
@@ -4,14 +4,14 @@ import {EditLedgerModal, useLedgersStore} from "@/ledger";
import {ref} from "vue";
import {activityApi, processingApi} from "@/mammon";
const {refresh} = useLedgersStore();
const ledgersStore = useLedgersStore();
const editLedgerModal = ref<typeof EditLedgerModal>();
const processActivities = async () => {
await activityApi.fetchAllNewActivities();
await processingApi.processNewActivities();
await refresh();
await ledgersStore.refresh();
}
</script>
+2 -2
View File
@@ -11,7 +11,7 @@ import {CharacterLabel, useCharactersStore} from "@/characters";
import {formatEveDate} from "@/formaters.ts";
const {ledgerId} = useLedgerParam();
const {findById} = useCharactersStore();
const charactersStore = useCharactersStore();
const transactions = computedAsync<TransactionResponse[]>(async () => {
if (ledgerId.value) {
@@ -21,7 +21,7 @@ const transactions = computedAsync<TransactionResponse[]>(async () => {
}, []);
const { sortedArray, headerProps } = useSort(computedAsync(() => Promise.all(transactions.value.map(async transaction => {
const character = await findById(transaction.characterId);
const character = await charactersStore.findById(transaction.characterId);
return {
character,
characterName: character?.name ?? "",
+2 -3
View File
@@ -1,15 +1,14 @@
<script setup lang="ts">
import {EditLedgerModal, Ledger, LedgerLabel, useLedgersStore} from "@/ledger";
import {storeToRefs} from "pinia";
import {nextTick, ref} from "vue";
import {PencilSquareIcon} from "@heroicons/vue/24/outline";
import {IskLabel} from "@/market";
import {SortableHeader, useSort, VirtualScrollTable} from "@/components/table";
const {ledgers} = storeToRefs(useLedgersStore());
const ledgersStore = useLedgersStore();
const { sortedArray, headerProps } = useSort<Ledger>(ledgers);
const { sortedArray, headerProps } = useSort<Ledger>(() => ledgersStore.ledgers);
const editModal = ref<typeof EditLedgerModal>();
const editingLedgerId = ref("");
+9 -12
View File
@@ -8,19 +8,16 @@ import {
useCharacterRuleBooksStore,
useRuleBooksStore
} from "@/rules";
import {storeToRefs} from "pinia";
import {isMain, Ledger, LedgerSelect, systemLedger, useLedgersStore} from "@/ledger";
type Bindings = { [key: string]: Ledger; };
const ruleBookStore = useRuleBooksStore();
const {findById: findRuleBookById} = ruleBookStore;
const {ruleBooks} = storeToRefs(ruleBookStore);
const {findByCharacterId, setForCharacter} = useCharacterRuleBooksStore();
const {findById: findCharacterById} = useCharactersStore();
const {ledgers} = storeToRefs(useLedgersStore());
const characterRuleBooksStore = useCharacterRuleBooksStore();
const charactersStore = useCharactersStore();
const ledgersStore = useLedgersStore();
const ledgersToUse = computed(() => [systemLedger, ...ledgers.value.filter(isMain)]);
const ledgersToUse = computed(() => [systemLedger, ...ledgersStore.ledgers.filter(isMain)]);
const character = ref<Character>();
const ruleBook = ref<RuleBook>();
@@ -31,9 +28,9 @@ watchEffect(async () => {
const characterId = character.value?.characterId;
if (characterId) {
const characterRuleBook = findByCharacterId(characterId);
const characterRuleBook = characterRuleBooksStore.findByCharacterId(characterId);
ruleBook.value = findRuleBookById(characterRuleBook?.ruleBook.ruleBookId ?? '');
ruleBook.value = ruleBookStore.findById(characterRuleBook?.ruleBook.ruleBookId ?? '');
bindings.value = Object.fromEntries(
Object.entries(characterRuleBook?.bindings ?? {})
.map(([key, id]) => [key, ledgersToUse.value.find(l => l.ledgerId === id) ?? systemLedger])
@@ -46,7 +43,7 @@ const save = () => {
const ruleBookId = ruleBook.value?.ruleBookId;
if (characterId && ruleBookId) {
setForCharacter(characterId, {
characterRuleBooksStore.setForCharacter(characterId, {
ruleBookId,
bindings: Object.fromEntries(
Object.entries(bindings.value)
@@ -60,7 +57,7 @@ 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);
character.value = await charactersStore.findById(id);
log.info('Loaded character:', character.value);
} else {
character.value = undefined;
@@ -80,7 +77,7 @@ watch(useRoute(), async route => {
<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>
<option v-for="rb in ruleBookStore.ruleBooks" :key="rb.ruleBookId" :value="rb">{{ rb.name }}</option>
</select>
</div>
<div class="flex-col border-b-1">
+5 -5
View File
@@ -14,12 +14,12 @@ const usedForAcquisitions = ref<boolean>(false);
const ledgerRefs = ref<string[]>([]);
const script = ref<string>('');
const {findById, create, update, refresh} = useRuleBooksStore();
const ruleBooksStore = useRuleBooksStore();
const router = useRouter();
const save = async () => {
if (!ruleBookId.value) {
const created = await create({
const created = await ruleBooksStore.create({
name: name.value,
usedForAcquisitions: usedForAcquisitions.value,
ledgerRefs: ledgerRefs.value,
@@ -28,7 +28,7 @@ const save = async () => {
await router.push({ name: routeNames.editRuleBook, params: {ruleBookId: created.ruleBookId}})
} else {
await update(ruleBookId.value, {
await ruleBooksStore.update(ruleBookId.value, {
name: name.value,
usedForAcquisitions: usedForAcquisitions.value,
ledgerRefs: ledgerRefs.value,
@@ -57,13 +57,13 @@ const removeLedgerRef = (index: number) => {
watch(useRoute(), async route => {
if (route.params.ruleBookId) {
const promise = refresh(); // FIXME don't call refresh
const promise = ruleBooksStore.refresh(); // FIXME don't call refresh
const id = typeof route.params.ruleBookId === 'string' ? route.params.ruleBookId : route.params.ruleBookId[0];
await promise;
const ruleBook = findById(id);
const ruleBook = ruleBooksStore.findById(id);
ruleBookId.value = id;
name.value = ruleBook?.name ?? '';
+1 -3
View File
@@ -1,12 +1,10 @@
<script setup lang="ts">
import {storeToRefs} from "pinia";
import {DocumentDuplicateIcon, PencilSquareIcon, TrashIcon} from "@heroicons/vue/24/outline";
import {confirm} from "@/confirm";
import {RuleBook, useRuleBooksStore} from "@/rules";
import {routeNames} from "@/routes";
const ruleBooksStore = useRuleBooksStore();
const {ruleBooks} = storeToRefs(ruleBooksStore);
const duplicate = async (ruleBook: RuleBook) => {
if (await confirm({title: "Duplicate Rule Book", message: `Duplicate ${ruleBook.name}?`, confirmLabel: "Duplicate"})) {
@@ -27,7 +25,7 @@ const remove = async (ruleBook: RuleBook) => {
<div class="flex justify-end border-b-1">
<RouterLink class="button mb-2 ms-2" :to="{ name: routeNames.newRuleBook}">New Rule Book</RouterLink>
</div>
<div v-for="ruleBook in ruleBooks" :key="ruleBook.ruleBookId" class="flex items-center mt-2">
<div v-for="ruleBook in ruleBooksStore.ruleBooks" :key="ruleBook.ruleBookId" class="flex items-center mt-2">
<span class="flex grow me-2">{{ruleBook.name}}</span>
<RouterLink class="btn-icon me-1" :to="{ name: routeNames.editRuleBook, params: { ruleBookId: ruleBook.ruleBookId } }"><PencilSquareIcon /></RouterLink>
<button class="btn-icon me-1" @click="duplicate(ruleBook)"><DocumentDuplicateIcon /></button>
+3 -3
View File
@@ -14,7 +14,7 @@ interface Props {
const props = defineProps<Props>();
const {findById} = useLedgersStore();
const ledgersStore = useLedgersStore();
const sortedArray = computedAsync(async () => {
if (!props.transfers) {
@@ -22,8 +22,8 @@ const sortedArray = computedAsync(async () => {
}
return (await Promise.all(props.transfers.map(async (transfer: TransferWithValue, index) => {
const fromLedger = findById(transfer.fromLedgerId) ?? systemLedger
const toLedger = findById(transfer.toLedgerId) ?? systemLedger
const fromLedger = ledgersStore.findById(transfer.fromLedgerId) ?? systemLedger
const toLedger = ledgersStore.findById(transfer.toLedgerId) ?? systemLedger
const item = transfer.marketTypeId ? await getMarketType(transfer.marketTypeId) : undefined;