R40fendt/hausarbeit
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases 1 Wiki Activity

final styling

Browse Source
This commit is contained in:
R40fendt
2026-10-07 20:57:46 +02:00
parent 133fe52a64
commit a24949a2f7
11 changed files with 45 additions and 148 deletions
Download Patch File Download Diff File Expand all files Collapse all files
src/App.vue
+2 -1
View File
@@ -1,6 +1,7 @@
<script setup lang="ts">
import { ref } from 'vue';
import Input from './components/Input.vue';
import MyButton from './components/MyButton.vue';
import {load, Store} from "@tauri-apps/plugin-store";
import { invoke } from '@tauri-apps/api/core';
@@ -51,7 +52,7 @@ init();
<Input placeholder="Ollama URL (z.B. http://localhost:11434)" class="w-full" v-model="ollama_url"/> <br>
<Input placeholder="API Key (optional)" class="w-full" type="password" v-model="ollama_api_key"/> <br>
<br>
<input value="Weiter" class="w-full border" type="submit"/>
<MyButton class="w-full" type="submit">Weiter</MyButton>
</form>
</div>
<router-view v-slot="{ Component, route }" v-else>
src/components/ContextView.vue
+10 -3
View File
@@ -1,8 +1,15 @@
<script setup lang="ts"></script>
<script setup lang="ts">
import MyRouterLink from './MyRouterLink.vue';
</script>
<template>
<div>
<RouterLink to="/">Zurück zur Startseite</RouterLink>
<h1>Context Window einstellen</h1>
<h1 class="text-2xl font-bold">Context Window einstellen</h1>
<br>
<div class="w-xs">
<MyRouterLink to="/" :left="true">Zurück zur Startseite</MyRouterLink>
</div>
<br><br>
Das Context Window muss beim Start des Ollama Servers als Environment-Variable gesetzt werden. Mehr Informationen <a href="https://docs.ollama.com/context-length" target="_blank" class="underline text-blue-700">hier.</a>
</div>
</template>
src/components/EditView.vue
+15 -6
View File
@@ -1,6 +1,8 @@
<script setup lang="ts">
import { invoke } from '@tauri-apps/api/core';
import { ref } from 'vue';
import MyRouterLink from './MyRouterLink.vue';
import MyButton from './MyButton.vue';
const initialized=ref(false);
const models=ref([]);
@@ -44,17 +46,24 @@ async function save(){
</script>
<template>
<div>
<RouterLink to="/">Zurück zur Startseite</RouterLink>
<h1>Modell bearbeiten</h1>
<h1 class="text-2xl font-bold">Modell bearbeiten</h1>
<br>
<div class="w-xs">
<MyRouterLink to="/" :left="true">Zurück zur Startseite</MyRouterLink> <br><br>
</div>
<p>Diese Funktion ist leider nicht für alle Modelle verfügbar.</p>
<br>
<div v-if="initialized">
<ul v-if="information==undefined">
<li @click="load_model(model.name)" v-for="model in models">{{ model.name }}</li>
<MyButton class="my-1" @click="load_model(model.name)" v-for="model in models">{{ model.name }}</MyButton>
</ul>
<form v-else @submit.prevent="save">
<button @click="information=undefined">Zurück zur Modellauswahl</button>
<textarea v-model="information.template" placeholder="Prompt Template" class="w-full"></textarea>
<textarea v-model="system_prompt" placeholder="System Prompt" class="w-full"></textarea>
<MyButton @click="information=undefined">Zurück zur Modellauswahl</MyButton>
<br><br><hr><br>
<textarea v-model="information.template" placeholder="Prompt Template" class="w-full" rows="20"></textarea>
<br><br><hr><br>
<textarea v-model="system_prompt" placeholder="System Prompt" class="w-full" rows="20"></textarea>
<br><br><hr><br>
<input type="text" placeholder="Neuer Modellname" v-model="new_model">
<input type="submit" value="Speichern"/>
</form>
src/components/EmbeddingPrompt.vue
+4 -2
View File
@@ -20,6 +20,7 @@ async function execute_prompt(ev){
}catch(e){
window.alert("Fehler beim Ausführen des Prompts: "+e);
}
console.log(embedding);
if(embedding!=undefined){
dataset.value.push({vector: embedding, label: prompt.value});
prompt.value="";
@@ -42,12 +43,13 @@ init();
</div>
<br>
<EmbeddingVisualizer :dataset="dataset"/>
<select class="w-[500px] bg-gray-900" v-model="model">
<select class="w-[500px] text-black" v-model="model">
<option value="" disabled></option>
<option :value="m.name" v-for="m in model_options">{{ m.name }}</option>
</select>
<MyButton class="ml-2" @click="dataset=[]">Alle Punkte löschen</MyButton>
<MyButton class="ml-2 bg-red-800 hover:bg-red-700" @click="dataset=[]">Alle Punkte löschen</MyButton>
<form @submit="execute_prompt">
<br><br>
<PromptInput v-model="prompt"/>
</form>
</div>
src/components/EmbeddingVisualizer.vue
+3 -4
View File
@@ -1,6 +1,5 @@
<script setup lang="ts">
import { UMAP } from 'umap-js';
import { onMounted, ref, useTemplateRef, watch } from "vue";
const canvas = useTemplateRef("canvas");
@@ -78,6 +77,7 @@ function draw(ctx, width, height, pointSize, showConnections, showLabels, points
ctx.stroke();
}
ctx.strokeStyle = "#94a3b8";
// Draw connections to nearest neighbors
if (showConnections && projected.length > 1) {
ctx.strokeStyle = "#94a3b8";
@@ -110,6 +110,7 @@ function draw(ctx, width, height, pointSize, showConnections, showLabels, points
});
}
ctx.fillStyle = "#e5e7eb"
// Draw points
projected.forEach((p, i) => {
const x = padding + p[0] * (width - 2 * padding);
@@ -121,9 +122,7 @@ function draw(ctx, width, height, pointSize, showConnections, showLabels, points
// Draw labels
if (showLabels) {
ctx.fillStyle = document.documentElement.classList.contains("dark")
? "#e5e7eb"
: "#374151";
ctx.fillStyle = "#e5e7eb"
ctx.font = "12px Inter, sans-serif";
ctx.textAlign = "center";
ctx.fillText(points[i].label, x, y - pointSize - 5);
src/components/MyButton.vue
+1 -1
View File
@@ -1,5 +1,5 @@
<script setup lang="ts">
</script>
<template>
<button class="bg-red-800 p-2 m-1 rounded-md"><slot></slot></button>
<button class="p-2 m-1 rounded-md cursor-pointertext-white bg-green-900 hover:bg-green-700 transition-all ease-in-out duration-300 transform hover:scale-101"><slot></slot></button>
</template>
src/components/MyRouterLink.vue
+4 -2
View File
@@ -1,13 +1,15 @@
<script setup lang="ts">
import { MoveLeft, MoveRight } from '@lucide/vue';
const {to, left} = defineProps(["to","left"]);
</script>
<template>
<RouterLink :to="to">
<div class="text-xl p-6 rounded-xl text-white bg-green-900 hover:bg-green-700 transition-all ease-in-out duration-300 transform hover:scale-101 relative flex items-center">
<div class="absolute left-4 h-full flex items-center justify-center" v-if="left">Pfeil</div>
<div class="absolute left-4 h-full flex items-center justify-center" v-if="left"><MoveLeft/></div>
<div v-if="left" class="absolute right-4"><slot></slot></div>
<div v-if="!left" class="absolute left-4"><slot></slot></div>
<div class="absolute right-4 h-full flex items-center justify-center" v-if="!left">Pfeil</div>
<div class="absolute right-4 h-full flex items-center justify-center" v-if="!left"><MoveRight/></div>
</div>
</RouterLink>
</template>
src/components/PromptInput.vue
+5 -2
View File
@@ -1,4 +1,5 @@
<script lang="ts" setup>
import { MoveUp } from '@lucide/vue';
import Input from './Input.vue';
let {placeholder} = defineProps({
placeholder: {
@@ -6,9 +7,11 @@ let {placeholder} = defineProps({
default: "Prompt"
}
});
const model=defineModel();
</script>
<template>
<div class="relative">
<Input :placeholder="placeholder" class="absolute w-full h-full top-0 bottom-0 left-0 right-0 p-6 my-4"/>
<div class="relative flex align-center justify-center flex-col">
<Input v-model="model" :placeholder="placeholder" class="absolute w-full h-full p-6 my-4"/>
<button type="submit" class="absolute right-2 bg-green-800 hover:bg-green-700 transition-all ease-in-out duration-300 cursor-pointer rounded-full p-2"><MoveUp/></button>
</div>
</template>
src/components/PromptView.vue
+1
View File
@@ -59,6 +59,7 @@ init();
</select>
Thinking: <input type="checkbox" v-model="thinking" checked>
Temperature: <input type="number" v-model="temperature" max="1" min="0" step="0.01" class="w-16 border">
<br><br><br>
<PromptInput v-model="prompt"/>
<input type="submit" value="Submit" class="hidden">
</form>