Adam Bem
252cadea16
Reviewed-on: #266 Reviewed-by: Mikolaj Widla <widlam@noreply.example.com> Co-authored-by: Adam Bem <adam.bem@zoho.eu> Co-committed-by: Adam Bem <adam.bem@zoho.eu>
28 lines
1.2 KiB
Vue
28 lines
1.2 KiB
Vue
<script setup lang="ts">
|
|
import xmlInputFieldComponent from '@/components/xml/XmlInputFieldComponent.vue';
|
|
import xmlOutputFieldComponent from '@/components/xml/XmlOutputFieldComponent.vue';
|
|
import TooltipComponent from '@/components/xml/tooltips/TooltipComponent.vue';
|
|
import { ref } from 'vue';
|
|
|
|
|
|
const xml = ref('');
|
|
const query = ref('');
|
|
const version = ref('');
|
|
|
|
function updateVersion(newVersion: string) {
|
|
version.value = newVersion;
|
|
}
|
|
</script>
|
|
|
|
<template>
|
|
<div id="layout" class="flex flex-row w-full h-full">
|
|
<div class="flex flex-col 2xl:flex-row w-full xl:w-7/12 grow overflow-hide pr-2">
|
|
<div class="flex flex-col w-full 2xl:w-1/2 h-2/3 2xl:h-full flex-none items-center">
|
|
<xmlInputFieldComponent stylized-name="XML" :data="xml" @update="(data) => {xml = data}"></xmlInputFieldComponent>
|
|
<xmlInputFieldComponent stylized-name="XSLT" :data="query" @update="(data) => {query = data}"></xmlInputFieldComponent>
|
|
</div>
|
|
<xmlOutputFieldComponent tool="xslt" :xml="xml" :query="query" @update="(version) => updateVersion(version)"></xmlOutputFieldComponent>
|
|
</div>
|
|
<TooltipComponent tool-type="xslt" :version="version"></TooltipComponent>
|
|
</div>
|
|
</template> |