initila commit

src/App.vue

@@ -0,0 +1,7 @@
+<script setup lang="ts">
+import { Reprocess } from './reprocess';
+</script>
+
+<template>
+    <Reprocess />
+</template>

src/main.ts

@@ -0,0 +1,5 @@
+import { createApp } from 'vue'
+import App from './App.vue'
+import './style.css'
+
+createApp(App).mount('#app')

src/reprocess/Reprocess.vue

@@ -0,0 +1,53 @@
+<script setup lang="ts">
+import { iskFormat } from '@/utils';
+import { ref } from 'vue';
+import ReprocessInput from './ReprocessInput.vue';
+import { ReprocessItemValues, reprocess } from './reprocess';
+
+const items = ref("");
+const minerals = ref("");
+const efficiency = ref(0.55);
+
+const result = ref<ReprocessItemValues[]>([]);
+
+const send = async () => result.value = await reprocess(items.value, minerals.value, efficiency.value);
+
+</script>
+
+<template>
+    <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" />
+        </div>
+    </div>
+    <div class="flex items-stretch px-4">
+        <ReprocessInput name="Item JSON" v-model="items" />
+        <ReprocessInput name="Mineral JSON" v-model="minerals" />
+    </div>
+    <div class="grid mt-2 px-4">
+        <button class="py-0.5 px-2 justify-self-end border rounded bg-slate-200" @click="send">Send</button>
+    </div>
+    <div class="grid mt-2 px-4">
+        <table v-if="result.length > 0" 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">
+                    <td class="border px-1">{{ r.typeID }}</td>
+                    <td class="border text-right px-1">{{ iskFormat(r.buy) }}</td>
+                    <td class="border text-right px-1">{{ iskFormat(r.buy_reprocess) }}</td>
+                    <td class="border text-right px-1">{{ iskFormat(r.sell) }}</td>
+                    <td class="border text-right px-1">{{ iskFormat(r.sell_reprocess) }}</td>
+                </tr>
+            </tbody>
+        </table>
+    </div>
+</template>

src/reprocess/ReprocessInput.vue

@@ -0,0 +1,26 @@
+<script setup lang="ts">
+import { useVModel } from '@vueuse/core';
+
+interface Props {
+    name: string;
+    modelValue?: string;
+}
+
+interface Emits {
+    (e: 'update:modelValue', value: string): void;
+}
+
+const props = withDefaults(defineProps<Props>(), {
+    modelValue: ''
+});
+const emit = defineEmits<Emits>();
+
+const value = useVModel(props, 'modelValue', emit);
+</script>
+
+<template>
+    <div class="flex-1 mx-1">
+        <span>{{ name }}</span>
+        <textarea class="w-full border rounded" v-model="value" />
+    </div>
+</template>

src/reprocess/index.ts

@@ -0,0 +1,2 @@
+export { default as Reprocess } from './Reprocess.vue'
+export * from './reprocess'

src/reprocess/reprocess.ts

@@ -0,0 +1,27 @@
+import { apiAxiosInstance } from "../service";
+
+export type ReprocessItemValues = {
+    typeID: number;
+    buy: number;
+    buy_reprocess: number;
+    sell: number;
+    sell_reprocess: number;
+}
+
+export const reprocess = async (items: string, minerals: string, efficiency?: number): Promise<ReprocessItemValues[]> => {
+    if (!items || !minerals || (efficiency && (efficiency < 0 || efficiency > 1))) {
+        return [];
+    }
+
+    const itemsJson = JSON.parse(items);
+    const mineralsJson = JSON.parse(minerals);
+    const sourceJson = {
+        "ep_items": itemsJson,
+        "ep_mat": mineralsJson
+    };
+    const source = JSON.stringify(sourceJson);
+
+    const response = await apiAxiosInstance.post('/reprocess', source, {params: {efficiency: efficiency ?? 0.55}});
+
+    return response.data;
+};

src/service.ts

@@ -0,0 +1,9 @@
+import axios from 'axios';
+
+export const apiAxiosInstance = axios.create({
+    baseURL: '/api',
+    headers: {
+        'accept': 'application/json',
+        "Content-Type": "application/json"
+    },
+})

src/style.css

@@ -0,0 +1,3 @@
+@tailwind base;
+@tailwind components;
+@tailwind utilities;

src/utils.ts

@@ -0,0 +1,7 @@
+const iskFormater = new Intl.NumberFormat("is-IS", {
+    style: "currency",
+    currency: "ISK",
+    minimumFractionDigits: 0,
+});
+
+export const iskFormat = (value: number): string => iskFormater.format(value);

src/vite-env.d.ts

@@ -0,0 +1 @@
+/// <reference types="vite/client" />