eveal/gemory
2
0
Fork 0
Code Issues 3 Pull Requests Packages Projects Releases Wiki Activity

buy/sel double slider

Browse Source
This commit is contained in:
Sirttas
2023-10-13 20:11:20 +02:00
parent 4cb3de356f
commit c2c8f2a65b
1 changed files with 25 additions and 18 deletions
Download Patch File Download Diff File Expand all files Collapse all files

43
src/reprocess/ReprocessResultTable.vue
View File

@@ -16,24 +16,32 @@ const props = withDefaults(defineProps<Props>(), {
});
const threshold = useStorage('reprocess-threshold', 0);
const useSellOrder = useStorage('reprocess-use-sell-order', false);
const useSellOrderForMarket = useStorage('reprocess-market-use-sell-order', false);
const useSellOrderForMaterials = useStorage('reprocess-materials-use-sell-order', false);
const { sortedArray, headerProps } = useSort(computed(() => props.result.map(r => ({
...r,
buy_ratio: r.buy === 0 ? 1 : (r.buy_reprocess / r.buy) - 1,
sell_ratio: r.sell === 0 ? 1 : (r.sell_reprocess / r.sell) - 1
}))), {
const { sortedArray, headerProps } = useSort(computed(() => props.result.map(r => {
const market = useSellOrderForMarket.value ? r.sell : r.buy;
const materials = useSellOrderForMaterials.value ? r.sell_reprocess : r.buy_reprocess;
const ratio = market === 0 ? 1 : ((materials / market) - 1);
return { ...r, market, materials, ratio };
})), {
defaultSortKey: 'name',
defaultSortDirection: 'asc'
})
</script>
<template>
<div class="grid grid-cols-2 mb-2 mt-4 ms-auto">
<div class="justify-self-end">
<BuySellSlider v-model="useSellOrder" />
<div class="flex justify-self-end mb-2 mt-4 ms-auto">
<div class="justify-self-end me-4 flex flex-col">
<div class="flex mb-1">
<BuySellSlider v-model="useSellOrderForMarket" class="me-2" /> Market
</div>
<div class="flex">
<BuySellSlider v-model="useSellOrderForMaterials" class="me-2" /> Materials
</div>
</div>
<div class="justify-self-end ms-2">
<div class="justify-self-end mt-auto mb-auto">
<span>Threshold: </span>
<input type="number" min="-100" max="100" step="1" v-model="threshold" />
</div>
@@ -42,21 +50,20 @@ const { sortedArray, headerProps } = useSort(computed(() => props.result.map(r =
<thead>
<tr>
<SortableHeader v-bind="headerProps" sortKey="name">Item</SortableHeader>
<SortableHeader v-bind="headerProps" :sortKey="useSellOrder ? 'sell' : 'buy'">Market</SortableHeader>
<SortableHeader v-bind="headerProps" :sortKey="useSellOrder ? 'sell_reprocess' : 'buy_reprocess'">Reprocess</SortableHeader>
<SortableHeader v-bind="headerProps" :sortKey="useSellOrder ? 'sell_ratio' : 'buy_ratio'">Percent</SortableHeader>
<SortableHeader v-bind="headerProps" sortKey="market">Market</SortableHeader>
<SortableHeader v-bind="headerProps" sortKey="materials">Materials</SortableHeader>
<SortableHeader v-bind="headerProps" sortKey="ratio">Percent</SortableHeader>
</tr>
</thead>
<tbody>
<tr v-for="r in sortedArray" :key="r.typeID" :class="{'line-green': (useSellOrder ? r.sell_ratio : r.buy_ratio) >= threshold / 100 }">
<tr v-for="r in sortedArray" :key="r.typeID" :class="{'line-green': r.ratio >= threshold / 100 }">
<td>
<MarketTypeLabel :id="r.typeID" :name="r.name" />
</td>
<td class="text-right">{{ formatIsk(useSellOrder ? r.sell : r.buy) }}</td>
<td class="text-right">{{ formatIsk(useSellOrder ? r.sell_reprocess : r.buy_reprocess) }}</td>
<td class="text-right">{{ percentFormater.format(useSellOrder ? r.sell_ratio : r.buy_ratio) }}</td>
<td class="text-right">{{ formatIsk(r.market) }}</td>
<td class="text-right">{{ formatIsk(r.materials) }}</td>
<td class="text-right">{{ percentFormater.format(r.ratio) }}</td>
</tr>
</tbody>
</table>
</template>
@/components/table