added parameters component

This commit is contained in:
2025-01-08 16:54:52 +01:00
parent e834229cae
commit 38b3942bde
2 changed files with 45 additions and 24 deletions

View File

@@ -0,0 +1,33 @@
<script lang="ts">
import {defineComponent, ref} from 'vue'
const selected = ref('A')
const options = ref([
{ text: 'One', value: 'A' },
{ text: 'Two', value: 'B' },
{ text: 'Three', value: 'C' }
])
</script>
<template>
<select v-model="selected" class="rounded-3xl w-1/3 px-3">
<option v-for="option in options" :value="option.value">
{{ option.text }}
</option>
</select>
<input
id="textInput1"
class="text-input px-2 py-1 border rounded-3xl w-1/3"
type="text"
placeholder="Name"
/>
<input
id="textInput2"
class="text-input px-2 py-1 border rounded-3xl w-1/3"
type="text"
placeholder="Value"
/>
<button class="tool-button" @click="clear">Add Variable</button>
</template>

View File

@@ -2,6 +2,8 @@
import InsertTemplateComponent from '@components/common/InsertTemplateComponent.vue'
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";
@@ -21,6 +23,7 @@ function sendValue() {
emit('update:modelValue', data.value)
}
function updateData(newData: string, clearFileSelector: boolean = true) {
data.value = newData
if (clearFileSelector)
@@ -48,13 +51,14 @@ function readFile(file: any) {
reader.onloadend = () => {
let result = reader.result?.toString()
if (typeof result == "string")
updateData(result, false);
updateData(result, false)
}
reader.readAsText(file.target.files[0])
}
</script>
<template>
@@ -64,37 +68,21 @@ function readFile(file: any) {
<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">
<select id = "myList" onchange = "favTutorial()" class = "w-full rounded-3xl" >
<option> ---Choose tutorial--- </option>
<option> w3schools </option>
<option> Javatpoint </option>
<option> tutorialspoint </option>
<option> geeksforgeeks </option>
</select>
<input
id="textInput1"
class="text-input px-2 py-1 border rounded-3xl w-1/3"
type="text"
placeholder="Input 1"
/>
<input
id="textInput2"
class="text-input px-2 py-1 border rounded-3xl w-1/3"
type="text"
placeholder="Input 2"
/>
<button class="tool-button" @click="clear">Add Variable</button>
<XsltParamComponent :stylizedName="stylizedName" />
</div>
</div>