Changed value is sent to backend

This commit is contained in:
2023-11-23 13:58:14 +01:00
parent a5b59adacb
commit 6831a510fb
2 changed files with 30 additions and 13 deletions

View File

@@ -25,8 +25,8 @@ function remove() {
</script> </script>
<template> <template>
<div :class=" isActive ? 'tab-active' : 'tab'" class="flex flex-row gap-3"> <div @click="activate" :class=" isActive ? 'tab-active' : 'tab'" class="flex flex-row gap-3 cursor-pointer">
<button @click="activate" class="hover:brightness-110"><slot /></button> <button class="hover:brightness-110"><slot /></button>
<button @click="remove" class="hover:brightness-110 hover:dark:bg-slate-400 hover:dark:text-black px-2 rounded-full">x</button> <button @click="remove" class="hover:brightness-110 hover:dark:bg-slate-400 hover:dark:text-black px-2 rounded-full">x</button>
</div> </div>
</template> </template>

View File

@@ -6,7 +6,9 @@ import { ref } from 'vue'
import CodeEditor from '../CodeEditorComponent.vue' import CodeEditor from '../CodeEditorComponent.vue'
const newTabId = ref(0); const newTabId = ref(0);
const activeTabId = ref(0) const activeTabId = ref(0);
const prevActiveTabId = ref(-1);
const tabs = ref(new Array<TabData>); const tabs = ref(new Array<TabData>);
tabs.value.push({ tabs.value.push({
id: newTabId.value++, id: newTabId.value++,
@@ -60,12 +62,18 @@ function readFile(file : any) {
const reader = new FileReader() const reader = new FileReader()
reader.onloadend = () => { reader.onloadend = () => {
var result = reader.result?.toString() var result = reader.result!.toString();
if (typeof result == "string") console.log(result);
sendNewValue(result) sendNewValue(result);
} }
reader.readAsText(file.target.files[0]) reader.readAsText(file.target.files[0]);
let activeIndex = findIndexWithID(activeTabId.value);
let filePath = inputFile.value.value.split("\\");
let fileName = filePath.at(filePath.length - 1);
tabs.value.at(activeIndex)!.name = fileName;
} }
function changeActiveTab(id : number) { function changeActiveTab(id : number) {
@@ -73,8 +81,11 @@ function changeActiveTab(id : number) {
let newIndex = findIndexWithID(id); let newIndex = findIndexWithID(id);
tabs.value.at(index)!.data = data.value; tabs.value.at(index)!.data = data.value;
prevActiveTabId.value = activeTabId.value;
activeTabId.value = id; activeTabId.value = id;
data.value = tabs.value.at(newIndex)!.data; data.value = tabs.value.at(newIndex)!.data;
sendValue();
} }
function addTab() { function addTab() {
@@ -83,18 +94,24 @@ function addTab() {
name: "XML" + newTabId.value, name: "XML" + newTabId.value,
data: "" data: ""
}) })
console.log(tabs.value);
} }
function removeTab(id : number) { function removeTab(id : number) {
if (tabs.value.length == 1) if (tabs.value.length == 1)
return return
let index = findIndexWithID(activeTabId.value); let indexToRemove = findIndexWithID(id);
tabs.value.splice(index, 1); let activeIndex = findIndexWithID(activeTabId.value);
if (activeTabId.value == id) {
activeTabId.value = tabs.value.at(0)!.id; if (indexToRemove == activeIndex && activeIndex == 0)
data.value = tabs.value.at(0)!.data; changeActiveTab(tabs.value.at(1)!.id)
} else if (indexToRemove == activeIndex)
changeActiveTab(tabs.value.at(0)!.id)
tabs.value.splice(indexToRemove, 1);
} }