added parameters component
This commit is contained in:
33
Frontend/src/components/XsltParamComponent.vue
Normal file
33
Frontend/src/components/XsltParamComponent.vue
Normal 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>
|
||||
|
||||
@@ -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>
|
||||
|
||||
|
||||
Reference in New Issue
Block a user