51 lines
1.7 KiB
Vue
51 lines
1.7 KiB
Vue
<script setup lang="ts">
|
|
import { iskFormater, percentFormater } from '@/formaters';
|
|
import { useStorage } from '@vueuse/core';
|
|
import { computed } from 'vue';
|
|
import { ReprocessItemValues } from './reprocess';
|
|
|
|
interface Props {
|
|
result?: ReprocessItemValues[];
|
|
}
|
|
|
|
const props = withDefaults(defineProps<Props>(), {
|
|
result: () => []
|
|
});
|
|
|
|
const computedResult = computed(() => props.result.map(r =>({
|
|
...r,
|
|
buy_ratio: (r.buy_reprocess / r.buy) - 1,
|
|
sell_ratio: (r.sell_reprocess / r.sell) - 1
|
|
})))
|
|
|
|
const threshold = useStorage('reprocess-threshold', 90);
|
|
</script>
|
|
|
|
<template>
|
|
<div class="grid mb-2 mt-4">
|
|
<div class="justify-self-end">
|
|
<span>Threshold: </span>
|
|
<input type="number" min="-100" max="1000" step="1" v-model="threshold" />
|
|
</div>
|
|
</div>
|
|
<table>
|
|
<thead>
|
|
<tr>
|
|
<th>Item</th>
|
|
<th>Buy</th>
|
|
<th>Buy reprocess</th>
|
|
<th>Sell</th>
|
|
<th>Sell reprocess</th>
|
|
</tr>
|
|
</thead>
|
|
<tbody>
|
|
<tr v-for="r in computedResult" :key="r.typeID" :class="{'bg-emerald-500': r.buy_ratio * threshold >= 100 }">
|
|
<td>{{ r.typeID }}</td>
|
|
<td class="text-right">{{ iskFormater.format(r.buy) }}</td>
|
|
<td class="text-right">{{ iskFormater.format(r.buy_reprocess) }} ({{percentFormater.format(r.buy_ratio)}})</td>
|
|
<td class="text-right">{{ iskFormater.format(r.sell) }}</td>
|
|
<td class="text-right">{{ iskFormater.format(r.sell_reprocess) }} ({{percentFormater.format(r.sell_ratio)}})</td>
|
|
</tr>
|
|
</tbody>
|
|
</table>
|
|
</template>@/formaters |