R11/release11-tools
4
2
Fork 0
Code Issues 9 Pull Requests 4 Packages Projects Releases 6 Wiki Activity

Added components for XSLT

Browse Source
This commit is contained in:
Adam Bem
2023-06-15 16:37:26 +02:00
parent 21402f8490
commit f9a4cd52e4
4 changed files with 73 additions and 10 deletions
Download Patch File Download Diff File Expand all files Collapse all files

20
Frontend/src/components/xml/XmlInputFieldComponent.vue
View File

@@ -1,4 +1,5 @@
<script setup lang="ts"> <script setup lang="ts">
import xmlInputFieldToolbarComponent from '@/components/xml/XmlInputFieldToolbarComponent.vue';
const props = defineProps( const props = defineProps(
{ {
@@ -9,15 +10,14 @@ const props = defineProps(
</script> </script>
<template> <template>
<div class="flex flex-col gap-6 w-full h-full items-center"> <div class="flex flex-col w-full h-full items-center gap-4">
<label for="xmlfield" class="dark:text-white">XML</label> <div class="w-full">
<textarea id="xmlfield" class="w-1/2 h-36 bg-gray-500"> <xmlInputFieldToolbarComponent prettyName="XML" fieldName="xml"></xmlInputFieldToolbarComponent>
<textarea id="xmlfield" class="w-full dark:bg-gray-600 border border-slate-400 rounded-md"></textarea>
</div>
</textarea> <div class="w-full">
<label for="transformField" class="dark:text-white">{{ props.transformationName }}</label> <xmlInputFieldToolbarComponent prettyName="XSLT" fieldName="xslt"></xmlInputFieldToolbarComponent>
<textarea id="transformField" class="w-1/2 h-36 bg-gray-500"> <textarea id="transformField" class="w-full dark:bg-gray-600 border border-slate-400 rounded-md"></textarea>
</div>
</textarea>
</div> </div>
</template> </template>

21
Frontend/src/components/xml/XmlInputFieldToolbarComponent.vue Normal file
View File

@@ -0,0 +1,21 @@
<script setup lang="ts">
const props = defineProps(
{
prettyName: {type: String, required: true},
fieldName: {type: String, required: true},
}
)
</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">
<button class="tool-button">Insert default {{ prettyName }}</button>
<button class="tool-button">Clear</button>
</div>
</div>
</template>

21
Frontend/src/components/xml/XmlOutputFieldComponent.vue Normal file
View File

@@ -0,0 +1,21 @@
<script setup lang="ts">
import xmlOutputFieldToolbarComponent from '@/components/xml/XmlOutputFieldToolbarComponent.vue';
const props = defineProps(
{
transformationName: {type: String},
}
)
</script>
<template>
<div class="flex flex-col w-full h-full items-center">
<xmlOutputFieldToolbarComponent field-name="result"></xmlOutputFieldToolbarComponent>
<div class="w-full h-max p-2 border border-slate-400 rounded-md text-left">
<pre ><code>&lt;test&gt;fsdafdsa&lt;/test&gt;</code></pre>
</div>
</div>
</template>

21
Frontend/src/components/xml/XmlOutputFieldToolbarComponent.vue Normal file
View File

@@ -0,0 +1,21 @@
<script setup lang="ts">
const props = defineProps(
{
fieldName: {type: String, required: true},
}
)
</script>
<template>
<div class="flex place-content-between w-full h-full items-center m-2">
<span class="dark:text-white">Result:</span>
<div class="flex space-x-2">
<button class="tool-button">Process</button>
<button class="tool-button">Clear</button>
</div>
</div>
</template>