Reorganized components by purpose

This commit is contained in:
2023-06-19 10:05:07 +02:00
parent 51d5bf3d73
commit 372c16e37b
6 changed files with 32 additions and 41 deletions

View File

@@ -1,9 +1,8 @@
<script setup lang="ts">
import xmlInputFieldToolbarComponent from '@/components/xml/XmlInputFieldToolbarComponent.vue';
import InsertTemplateComponent from '@components/common/InsertTemplateComponent.vue';
import { ref } from 'vue';
const xml = ref('')
const query = ref('')
const value = ref('')
const props = defineProps(
{
@@ -11,37 +10,27 @@ const props = defineProps(
xmlData: {type: String},
}
)
const emit = defineEmits(['update:xml', 'update:transform'])
const emit = defineEmits(['update'])
function sendXml() {
emit('update:xml', xml.value)
function sendValue() {
emit('update', value.value)
}
function sendTransform() {
emit('update:transform', query.value)
}
function setToDefaultXML(data: string) {
xml.value = data;
sendXml();
}
function setToDefaultQuery(data: string) {
query.value = data;
sendTransform();
function setToDefaultValue(data: string) {
value.value = data;
sendValue();
}
</script>
<template>
<div class="flex flex-col w-full lg:w-1/2 h-full items-center gap-4">
<div class="flex flex-col w-full h-1/2">
<xmlInputFieldToolbarComponent prettyName="XML" @update:defaultData="(data) => setToDefaultXML(data)"></xmlInputFieldToolbarComponent>
<textarea id="xmlField" v-model="xml" @input="sendXml()" class="text-field"></textarea>
</div>
<div class="flex flex-col w-full h-1/2">
<xmlInputFieldToolbarComponent :prettyName="$props.prettyName" @update:defaultData="(data) => setToDefaultQuery(data)"></xmlInputFieldToolbarComponent>
<textarea id="transformField" v-model="query" @input="sendTransform()" class="text-field"></textarea>
<div class="flex flex-col w-full h-1/2">
<div class="flex place-content-between w-full pr-2 items-center m-2">
<span class="dark:text-white">{{ prettyName }}</span>
<div class="flex space-x-2">
<InsertTemplateComponent :pretty-name="props.prettyName" @update:default-data="(data: string) => setToDefaultValue(data)"></InsertTemplateComponent>
</div>
</div>
<textarea id="xmlField" v-model="value" @input="sendValue()" class="text-field"></textarea>
</div>
</template>

View File

@@ -18,11 +18,5 @@ function setDefault(data: string) {
</script>
<template>
<div class="flex place-content-between w-full pr-2 items-center m-2">
<span class="dark:text-white">{{ prettyName }}</span>
<div class="flex space-x-2">
<InsertTemplateComponent :pretty-name="props.prettyName" @update:default-data="(data: string) => setDefault(data)"></InsertTemplateComponent>
</div>
</div>
</template>