tracking

src/market/track/SellModal.vue

@@ -0,0 +1,68 @@
+<script setup lang="ts">
+import Modal from '@/Modal.vue';
+import { MarketType } from '@/market';
+import { useTrackedItemsStorage } from '@/market/track';
+import { ref } from 'vue';
+
+interface Emit {
+    (e: 'removed'): void;
+}
+
+const emit = defineEmits<Emit>();
+
+const itemsStorage = useTrackedItemsStorage();
+
+const modalOpen = ref<boolean>(false);
+const type = ref<MarketType>();
+const count = ref(1);
+
+const open = (t: MarketType) => {
+    type.value = t;
+    count.value = 1;
+    modalOpen.value = true;
+}
+const remove = () => { 
+    const id = type.value?.id;
+
+    if (!id) {
+        modalOpen.value = false;
+        return;
+    }
+
+    const oldItem = itemsStorage.value.find(i => i.typeID === id);
+
+    if (!oldItem) {
+        modalOpen.value = false;
+        return;
+    }
+
+    const c = oldItem.count - count.value;
+
+    if (c > 0) {
+        const item = {
+            typeID: id,
+            count: oldItem.count - count.value,
+            averagePrice: oldItem.averagePrice
+        };
+        itemsStorage.value = itemsStorage.value.map(i => i.typeID === id ? item : i);
+    } else {
+        itemsStorage.value = itemsStorage.value.filter(i => i.typeID !== id);
+    }
+    emit('removed');
+    modalOpen.value = false;
+}
+
+defineExpose({ open });
+</script>
+
+<template>
+    <Modal v-model:open="modalOpen">
+        <div class="p-4 bg-slate-800 rounded mt-20 flex">
+            <div class="flex me-2 mb-auto">
+                <span>Count: </span>
+                <input class="ms-2" type="number" min="0" step="1" v-model="count" />
+            </div>
+            <button class="mb-auto" @click="remove">Remove</button>
+        </div>
+    </Modal>
+</template>