From 0d469db020fc06d2443b8b1103bafb295797f997 Mon Sep 17 00:00:00 2001
From: szewczyw <wojtekszewczyk2000@gmail.com>
Date: Thu, 9 Jan 2025 13:33:04 +0100
Subject: [PATCH] finished UI for adding parameters

---
 .../src/components/XsltParamComponent.vue     | 10 +++++-----
 .../components/xml/XmlInputFieldComponent.vue | 20 ++++++++-----------
 2 files changed, 13 insertions(+), 17 deletions(-)

diff --git a/Frontend/src/components/XsltParamComponent.vue b/Frontend/src/components/XsltParamComponent.vue
index 2ab3441..67f1167 100644
--- a/Frontend/src/components/XsltParamComponent.vue
+++ b/Frontend/src/components/XsltParamComponent.vue
@@ -1,8 +1,8 @@
-<script lang="ts">
+<script setup lang="ts">
 import {defineComponent, ref} from 'vue'
 const selected = ref('A')
 
-const options = ref([
+let options = ref([
   { text: 'One', value: 'A' },
   { text: 'Two', value: 'B' },
   { text: 'Three', value: 'C' }
@@ -10,7 +10,7 @@ const options = ref([
 </script>
 
 <template>
-  <select v-model="selected" class="rounded-3xl w-1/3 px-3">
+  <select v-model="selected" class="px-3 rounded-full border border-slate-400 bg-white dark:text-slate-100 dark:bg-gray-600 w-2/3" >
     <option v-for="option in options" :value="option.value">
       {{ option.text }}
     </option>
@@ -18,13 +18,13 @@ const options = ref([
 
   <input
       id="textInput1"
-      class="text-input px-2 py-1 border rounded-3xl w-1/3"
+      class="text-input px-3 rounded-full border border-slate-400 bg-white dark:text-slate-100 dark:bg-gray-600 w-1/3"
       type="text"
       placeholder="Name"
   />
   <input
       id="textInput2"
-      class="text-input px-2 py-1 border rounded-3xl w-1/3"
+      class="text-input px-3 rounded-full border border-slate-400 bg-white dark:text-slate-100 dark:bg-gray-600 w-1/3"
       type="text"
       placeholder="Value"
   />
diff --git a/Frontend/src/components/xml/XmlInputFieldComponent.vue b/Frontend/src/components/xml/XmlInputFieldComponent.vue
index a18ae84..53ac225 100644
--- a/Frontend/src/components/xml/XmlInputFieldComponent.vue
+++ b/Frontend/src/components/xml/XmlInputFieldComponent.vue
@@ -3,10 +3,8 @@ import InsertTemplateComponent from '@components/common/InsertTemplateComponent.
 import XMLButtonFormatterComponent from '@components/formatter/XMLButtonFormatterComponent.vue'
 import CodeEditor from '@/components/common/CodeEditorComponent.vue'
 import XsltParamComponent from '@/components/XsltParamComponent.vue'
-import Vuetify from 'vuetify';
 
 import {ref} from 'vue'
-import TabComponent from "@components/xml/TabComponent.vue";
 
 const props = defineProps(
     {
@@ -66,28 +64,26 @@ function readFile(file: any) {
     <div class="flex justify-between mb-2"></div>
 
     <div class="flex place-content-between w-full items-center">
+
       <span class="dark:text-white mr-2">{{ stylizedName }}</span>
+
       <div class="flex items-stretch w-64">
-        <input id="fileLoader" ref="inputFile" class="file-selector" type="file"
-               accept=".xml,.xql,.xquery,.xslt,text/xml,text/plain" @change="readFile"/>
+        <input id="fileLoader" ref="inputFile" class="file-selector" type="file" accept=".xml,.xql,.xquery,.xslt,text/xml,text/plain" @change="readFile"/>
       </div>
+
       <div class="flex space-x-2 pb-2 overflow-x-auto">
-        <InsertTemplateComponent :stylized-name="props.stylizedName"
-                                 @update:default-data="updateData"></InsertTemplateComponent>
-        <XMLButtonFormatterComponent v-if="canBeFormatted()" :xml="data"
-                                     @update:result="(data:any) => updateData(data.result)"></XMLButtonFormatterComponent>
+        <InsertTemplateComponent :stylized-name="props.stylizedName" @update:default-data="updateData"></InsertTemplateComponent>
+        <XMLButtonFormatterComponent v-if="canBeFormatted()" :xml="data" @update:result="(data:any) => updateData(data.result)"></XMLButtonFormatterComponent>
         <button class="tool-button" @click="clear">Clear</button>
       </div>
     </div>
 
     <div class="flex place-content-between w-full items-center">
       <div v-if="addParameters()" class="flex justify-end space-x-2 pb-2 overflow-x-auto ml-auto">
-      <XsltParamComponent :stylizedName="stylizedName" />
+        <XsltParamComponent :stylizedName="stylizedName"/>
       </div>
     </div>
 
-    <CodeEditor @update:updated-code="updateData" v-model="data" :code="data"
-                :config="{disabled:false, language:stylizedName}"></CodeEditor>
+    <CodeEditor @update:updated-code="updateData" v-model="data" :code="data" :config="{disabled:false, language:stylizedName}"></CodeEditor>
   </div>
-
 </template>
\ No newline at end of file