style = treshold
This commit is contained in:
@@ -1,5 +1,5 @@
|
||||
<!doctype html>
|
||||
<html lang="en">
|
||||
<html lang="en" clas="dark">
|
||||
<head>
|
||||
<meta charset="UTF-8" />
|
||||
<link rel="icon" type="image/svg+xml" href="/vite.svg" />
|
||||
|
||||
@@ -19,7 +19,7 @@ const send = async () => result.value = await reprocess(items.value, minerals.va
|
||||
<div class="grid mb-2 mt-4 px-4">
|
||||
<div class="justify-self-end">
|
||||
<span>Reprocess efficiency: </span>
|
||||
<input type="number" min="0" max="1" step="0.05" class="border rounded" v-model="efficiency" />
|
||||
<input type="number" min="0" max="1" step="0.05" v-model="efficiency" />
|
||||
</div>
|
||||
</div>
|
||||
<div class="flex items-stretch px-4">
|
||||
@@ -27,7 +27,7 @@ const send = async () => result.value = await reprocess(items.value, minerals.va
|
||||
<ReprocessInput name="Mineral JSON" v-model="minerals" />
|
||||
</div>
|
||||
<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>
|
||||
<button class="justify-self-end" @click="send">Send</button>
|
||||
</div>
|
||||
<template v-if="result.length > 0">
|
||||
<hr />
|
||||
|
||||
@@ -38,7 +38,7 @@ const loadFromId = async (e: Event) => {
|
||||
|
||||
<template>
|
||||
<div class="flex-1 mx-1">
|
||||
<span>{{ name }}</span><input type="text" class="border rounded ms-2 px-1" @change="loadFromId" placeholder="id evepraisal" />
|
||||
<textarea class="w-full border rounded mt-1" v-model="value" />
|
||||
<span>{{ name }}</span><input type="text" class="ms-2" @change="loadFromId" placeholder="id evepraisal" />
|
||||
<textarea class="mt-1" v-model="value" />
|
||||
</div>
|
||||
</template>
|
||||
@@ -1,6 +1,7 @@
|
||||
<script setup lang="ts">
|
||||
import { iskFormater, percentFormater } from '@/formaters';
|
||||
import { computed, ref } from 'vue';
|
||||
import { useStorage } from '@vueuse/core';
|
||||
import { computed } from 'vue';
|
||||
import { ReprocessItemValues } from './reprocess';
|
||||
|
||||
interface Props {
|
||||
@@ -17,33 +18,33 @@ const computedResult = computed(() => props.result.map(r =>({
|
||||
sell_ratio: (r.sell_reprocess / r.sell) - 1
|
||||
})))
|
||||
|
||||
const threshold = ref(10);
|
||||
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" class="border rounded" v-model="threshold" />
|
||||
<input type="number" min="-100" max="1000" step="1" v-model="threshold" />
|
||||
</div>
|
||||
</div>
|
||||
<table class="table-auto border-collapse border w-full">
|
||||
<table>
|
||||
<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>
|
||||
<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-green-200': r.buy_ratio >= threshold / 100 || r.sell_ratio >= threshold / 100 }">
|
||||
<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 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>
|
||||
|
||||
@@ -1,3 +1,44 @@
|
||||
@tailwind base;
|
||||
@tailwind components;
|
||||
@tailwind utilities;
|
||||
|
||||
@layer base {
|
||||
* {
|
||||
@apply border-slate-600 text-slate-100 placeholder-slate-400;
|
||||
}
|
||||
|
||||
body {
|
||||
@apply bg-slate-800;
|
||||
}
|
||||
|
||||
button {
|
||||
@apply py-0.5 px-2 border rounded bg-slate-600 hover:bg-slate-800;
|
||||
}
|
||||
input {
|
||||
@apply border bg-slate-500 rounded px-1;
|
||||
}
|
||||
textarea {
|
||||
@apply border rounded bg-slate-500 w-full;
|
||||
}
|
||||
|
||||
table {
|
||||
@apply table-auto border-collapse border-slate-500 w-full;
|
||||
}
|
||||
th {
|
||||
@apply border bg-slate-600 px-1;
|
||||
}
|
||||
td {
|
||||
@apply border px-1;
|
||||
}
|
||||
|
||||
::-webkit-scrollbar {
|
||||
@apply w-3;
|
||||
}
|
||||
::-webkit-scrollbar-track {
|
||||
@apply bg-slate-500;
|
||||
}
|
||||
::-webkit-scrollbar-thumb {
|
||||
@apply bg-slate-600 hover:bg-slate-800;
|
||||
border-radius: 5px;
|
||||
}
|
||||
}
|
||||
Reference in New Issue
Block a user