Acquisitions in typeinfo

src/pages/market/TypeInfo.vue

@@ -1,7 +1,7 @@
 <script setup lang="ts">
 import { ClipboardButton } from '@/components';
 import { MarketType, MarketTypeInput, getMarketType, useApraisalStore } from "@/market";
-import { BuyModal } from '@/market/acquisition';
+import { AcquisitionResultTable, BuyModal, useAcquiredTypesStore } from '@/market/acquisition';
 import { TrackingResultTable, createResult, useMarketTrackingStore } from '@/market/tracking';
 import { BookmarkIcon, BookmarkSlashIcon, ShoppingCartIcon } from '@heroicons/vue/24/outline';
 import { computedAsync } from '@vueuse/core/index.cjs';
@@ -20,8 +20,21 @@ const apraisalStore = useApraisalStore();
 const price = computedAsync(() => item.value ? apraisalStore.getPrice(item.value) : undefined);
 const marketTrackingStore = useMarketTrackingStore();
 const result = computedAsync(async () => item.value && price.value ? await createResult(item.value?.id, price.value) : undefined);
+const acquiredTypesStore = useAcquiredTypesStore();
 
 const isTracked = computed(() => item.value ? marketTrackingStore.types.includes(item.value.id) : false);
+const acquisitions = computed(() => {
+    const p = price.value;
+    
+    return !p ?[] : acquiredTypesStore.types
+        .filter(t => t.type === item.value?.id)
+        .map(i => ({
+            ...i,
+            type: p.type,
+            buy: p.buy,
+            sell: p.sell
+        }));
+});
 const toogleTracking = () => {
     if (!item.value) {
         return;
@@ -88,7 +101,14 @@ watch(useRoute(), async route => {
                 <p v-if="item.description" class="text-sm">{{ item.description }}</p>
             </div>
         </div>
-        <TrackingResultTable v-if="result" :items="[result]" infoOnly />
+        <div v-if="result" class="mb-4">
+            <span>Market Info:</span>
+            <TrackingResultTable :items="[result]" infoOnly />
+        </div>
+        <div v-if="acquisitions">
+            <span>Acquisitions:</span>
+            <AcquisitionResultTable :items="acquisitions" infoOnly />
+        </div>
     </template>
     <BuyModal ref="buyModal" />
 </template>