search item

src/pages/market/Scan.vue

@@ -1,13 +1,14 @@
 <script setup lang="ts">
-import { MarketType, MarketTypePrice, getHistory, getMarketType, getMarketTypes, jitaId, useApraisalStore } from "@/market";
+import { MarketType, MarketTypePrice, getHistory, getMarketTypes, jitaId, useApraisalStore } from "@/market";
 import { ScanResult, ScanResultTable, useMarketScanStore } from '@/market/scan';
 import { BuyModal } from '@/market/track';
+import MarketTypeInput from "@/market/type/MarketTypeInput.vue";
 import { ref, watch } from 'vue';
 
 
 const buyModal = ref<typeof BuyModal>();
 
-const item = ref("");
+const item = ref<MarketType>();
 
 const apraisalStore = useApraisalStore();
 const markeyScanStore = useMarketScanStore();
@@ -18,7 +19,7 @@ const addOrRelaod = async (type: MarketType) => {
         getHistory(jitaId, typeID),
         apraisalStore.getPrice(type)
     ]);
-    const item = {
+    const itm = {
         type,
         history,
         buy: price.buy,
@@ -27,20 +28,19 @@ const addOrRelaod = async (type: MarketType) => {
     };
 
     if (items.value.some(i => i.type.id === typeID)) {
-        items.value = items.value.map(i => i.type.id === typeID ? item : i);
+        items.value = items.value.map(i => i.type.id === typeID ? itm : i);
     } else {
-        items.value = [ ...items.value, item];
+        items.value = [ ...items.value, itm];
     }
 }
 const addItem = async () => {
-    const type = await getMarketType(item.value.split('\t')[0]);
-    
-    item.value = "";
-    if (!type) {
-        // TODO: Show error
+    if (!item.value) {
+        // TODO error
         return;
     }
-    addOrRelaod(type);
+
+    addOrRelaod(item.value);
+    item.value = undefined;
 }
 const removeItem = (type: MarketType) => {
     items.value = items.value.filter(i => i.type.id !== type.id);
@@ -68,9 +68,9 @@ watch(() => markeyScanStore.types, async t => {
 
 <template>
     <div class="grid mb-2 mt-4">
-        <div class="w-auto">
+        <div class="w-auto flex">
             <span>Item: </span>
-            <input type="text" class="w-96" v-model="item" @keyup.enter="addItem" />
+            <MarketTypeInput class="ms-2" v-model="item" @submit="addItem"/>
             <button class="justify-self-end ms-2" @click="addItem">Add</button>
         </div>
     </div>