precents
This commit is contained in:
@@ -1,8 +1,8 @@
|
||||
<script setup lang="ts">
|
||||
import { iskFormater } from '@/utils';
|
||||
import { useStorage } from '@vueuse/core';
|
||||
import { ref } from 'vue';
|
||||
import ReprocessInput from './ReprocessInput.vue';
|
||||
import ReprocessResultTable from './ReprocessResultTable.vue';
|
||||
import { ReprocessItemValues, reprocess } from './reprocess';
|
||||
|
||||
const items = ref("");
|
||||
@@ -26,29 +26,13 @@ const send = async () => result.value = await reprocess(items.value, minerals.va
|
||||
<ReprocessInput name="Item JSON" v-model="items" />
|
||||
<ReprocessInput name="Mineral JSON" v-model="minerals" />
|
||||
</div>
|
||||
<div class="grid mt-2 px-4">
|
||||
<div class="grid my-2 px-4">
|
||||
<button class="py-0.5 px-2 justify-self-end border rounded bg-slate-200" @click="send">Send</button>
|
||||
</div>
|
||||
<div v-if="result.length > 0" class="grid mt-2 px-4">
|
||||
<table class="table-auto border-collapse border w-full">
|
||||
<thead>
|
||||
<tr>
|
||||
<th class="border bg-slate-200">Item</th>
|
||||
<th class="border bg-slate-200">Buy</th>
|
||||
<th class="border bg-slate-200">Buy reprocess</th>
|
||||
<th class="border bg-slate-200">Sell</th>
|
||||
<th class="border bg-slate-200">Sell reprocess</th>
|
||||
</tr>
|
||||
</thead>
|
||||
<tbody>
|
||||
<tr v-for="r in result" :key="r.typeID" :class="{'bg-green-200': r.buy_reprocess >= r.sell}">
|
||||
<td class="border px-1">{{ r.typeID }}</td>
|
||||
<td class="border text-right px-1">{{ iskFormater.format(r.buy) }}</td>
|
||||
<td class="border text-right px-1">{{ iskFormater.format(r.buy_reprocess) }}</td>
|
||||
<td class="border text-right px-1">{{ iskFormater.format(r.sell) }}</td>
|
||||
<td class="border text-right px-1">{{ iskFormater.format(r.sell_reprocess) }}</td>
|
||||
</tr>
|
||||
</tbody>
|
||||
</table>
|
||||
</div>
|
||||
<template v-if="result.length > 0">
|
||||
<hr />
|
||||
<div class="grid mt-2 px-4">
|
||||
<ReprocessResultTable :result="result" />
|
||||
</div>
|
||||
</template>
|
||||
</template>
|
||||
42
src/reprocess/ReprocessResultTable.vue
Normal file
42
src/reprocess/ReprocessResultTable.vue
Normal file
@@ -0,0 +1,42 @@
|
||||
<script setup lang="ts">
|
||||
import { iskFormater, percentFormater } from '@/formaters';
|
||||
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
|
||||
})))
|
||||
</script>
|
||||
|
||||
<template>
|
||||
<table class="table-auto border-collapse border w-full">
|
||||
<thead>
|
||||
<tr>
|
||||
<th class="border bg-slate-200">Item</th>
|
||||
<th class="border bg-slate-200">Buy</th>
|
||||
<th class="border bg-slate-200">Buy reprocess</th>
|
||||
<th class="border bg-slate-200">Sell</th>
|
||||
<th class="border bg-slate-200">Sell reprocess</th>
|
||||
</tr>
|
||||
</thead>
|
||||
<tbody>
|
||||
<tr v-for="r in computedResult" :key="r.typeID" :class="{'bg-green-200': r.buy_reprocess >= r.sell}">
|
||||
<td class="border px-1">{{ r.typeID }}</td>
|
||||
<td class="border text-right px-1">{{ iskFormater.format(r.buy) }}</td>
|
||||
<td class="border text-right px-1">{{ iskFormater.format(r.buy_reprocess) }} ({{percentFormater.format(r.buy_ratio)}})</td>
|
||||
<td class="border text-right px-1">{{ iskFormater.format(r.sell) }}</td>
|
||||
<td class="border text-right px-1">{{ iskFormater.format(r.sell_reprocess) }} ({{percentFormater.format(r.sell_ratio)}})</td>
|
||||
</tr>
|
||||
</tbody>
|
||||
</table>
|
||||
</template>@/formaters
|
||||
Reference in New Issue
Block a user