rework store usage
This commit is contained in:
@@ -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>
|
||||
|
||||
@@ -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)})
|
||||
}
|
||||
}
|
||||
|
||||
|
||||
@@ -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)
|
||||
|
||||
@@ -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};
|
||||
}
|
||||
|
||||
@@ -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>
|
||||
|
||||
|
||||
@@ -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>
|
||||
@@ -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>
|
||||
|
||||
|
||||
@@ -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 ?? "",
|
||||
|
||||
@@ -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("");
|
||||
|
||||
@@ -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">
|
||||
|
||||
@@ -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,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>
|
||||
|
||||
@@ -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;
|
||||
|
||||
|
||||
Reference in New Issue
Block a user