Added new endpoint handling
This commit is contained in:
5
Frontend/src/components/common/TabData.ts
Normal file
5
Frontend/src/components/common/TabData.ts
Normal file
@@ -0,0 +1,5 @@
|
||||
export interface TabData {
|
||||
id: number;
|
||||
name: string;
|
||||
data: string;
|
||||
}
|
||||
@@ -1,12 +1,15 @@
|
||||
<script setup lang="ts">
|
||||
import { onMounted, ref } from 'vue';
|
||||
import { type TabData } from '../common/TabData'
|
||||
import CodeEditor from '../CodeEditorComponent.vue';
|
||||
import { xml } from '@codemirror/lang-xml';
|
||||
|
||||
|
||||
const props = defineProps(
|
||||
{
|
||||
tool: {type: String, required: true},
|
||||
xml: {type: String},
|
||||
xml: {type: String, required: false},
|
||||
multiXml: {type: Array<TabData>, required: false},
|
||||
query: {type: String}
|
||||
}
|
||||
)
|
||||
@@ -90,27 +93,73 @@ function process() {
|
||||
|
||||
function prepareRequest():Request {
|
||||
var request = new Request(prepareURL(), {
|
||||
body: prepareRequestBody(),
|
||||
body: selectRequestBodyType(),
|
||||
method: "POST"
|
||||
});
|
||||
return request
|
||||
|
||||
}
|
||||
|
||||
function prepareURL(): string {
|
||||
const engineEndpoint = engine.value == "libxml" ? "libxml" : "java";
|
||||
return document.location.protocol + "//" + document.location.hostname + "/" + engineEndpoint + "/" + props.tool;
|
||||
const engineEndpoint = engine.value == "libxml" ? "libxml" : "java";
|
||||
|
||||
var tool = props.tool;
|
||||
if (props.multiXml && props.multiXml.length > 1)
|
||||
tool = "multiple/xslt";
|
||||
|
||||
return document.location.protocol + "//" + document.location.hostname + "/" + engineEndpoint + "/" + tool;
|
||||
}
|
||||
|
||||
function prepareRequestBody():string {
|
||||
function selectRequestBodyType() : string {
|
||||
if (props.multiXml && props.multiXml.length > 1)
|
||||
return prepareRequestBodyMultiXml();
|
||||
else if (props.multiXml)
|
||||
return prepareRequestBodySingleXml(props.multiXml.at(0)!.data);
|
||||
else
|
||||
return prepareRequestBodySingleXml(props.xml!);
|
||||
}
|
||||
|
||||
function prepareRequestBodySingleXml(data: string):string {
|
||||
var requestBody = JSON.stringify({
|
||||
"data": props.xml,
|
||||
"data": data,
|
||||
"processorData": props.query,
|
||||
"processor": engine.value,
|
||||
"version": version.value
|
||||
});
|
||||
console.log(requestBody);
|
||||
return requestBody;
|
||||
}
|
||||
|
||||
function prepareRequestBodyMultiXml():string {
|
||||
var xmlFilesArray = convertDataArray(props.multiXml!);
|
||||
|
||||
var requestBody = JSON.stringify({
|
||||
"data": xmlFilesArray,
|
||||
"processorData": props.query,
|
||||
"processor": engine.value,
|
||||
"version": version.value
|
||||
});
|
||||
console.log(requestBody);
|
||||
return requestBody;
|
||||
}
|
||||
|
||||
function convertDataArray(data: Array<TabData>) {
|
||||
let result = new Array<Object>;
|
||||
data.forEach(element => {
|
||||
let fileName = element.name;
|
||||
if (!fileName.endsWith(".xml")) {
|
||||
fileName += ".xml";
|
||||
}
|
||||
|
||||
result.push({
|
||||
fileName: fileName,
|
||||
fileData: element.data,
|
||||
});
|
||||
});
|
||||
|
||||
return result;
|
||||
}
|
||||
|
||||
async function fetchRequest(request: Request):Promise<JSON> {
|
||||
var responseBody = await fetch(request)
|
||||
.then(response => response.json())
|
||||
|
||||
@@ -2,12 +2,12 @@
|
||||
import TabComponent from './TabComponent.vue'
|
||||
import InsertTemplateComponent from '@components/common/InsertTemplateComponent.vue'
|
||||
import XMLButtonFormatterComponent from '@components/formatter/XMLButtonFormatterComponent.vue'
|
||||
import { type TabData } from '../common/TabData'
|
||||
import { ref } from 'vue'
|
||||
import CodeEditor from '../CodeEditorComponent.vue'
|
||||
|
||||
const newTabId = ref(0);
|
||||
const activeTabId = ref(0);
|
||||
const prevActiveTabId = ref(-1);
|
||||
|
||||
const tabs = ref(new Array<TabData>);
|
||||
tabs.value.push({
|
||||
@@ -22,28 +22,26 @@ const inputFile = ref()
|
||||
const props = defineProps(
|
||||
{
|
||||
stylizedName: {type: String, required: true},
|
||||
data: {type: String},
|
||||
data: {type: Array<TabData>},
|
||||
}
|
||||
)
|
||||
const emit = defineEmits(['update'])
|
||||
|
||||
interface TabData {
|
||||
id: number;
|
||||
name: string;
|
||||
data: string;
|
||||
}
|
||||
|
||||
|
||||
function sendValue() {
|
||||
emit('update', data.value);
|
||||
emit('update', tabs.value);
|
||||
}
|
||||
|
||||
function sendNewValue(newValue : string) {
|
||||
data.value = newValue;
|
||||
emit('update', data.value);
|
||||
tabs.value.at(findIndexWithID(activeTabId.value))!.data = newValue;
|
||||
emit('update', tabs.value);
|
||||
}
|
||||
|
||||
function updateData(newData: string) {
|
||||
data.value = newData;
|
||||
tabs.value.at(findIndexWithID(activeTabId.value))!.data = newData;
|
||||
inputFile.value.value = '';
|
||||
sendValue();
|
||||
}
|
||||
@@ -81,7 +79,6 @@ function changeActiveTab(id : number) {
|
||||
let newIndex = findIndexWithID(id);
|
||||
|
||||
tabs.value.at(index)!.data = data.value;
|
||||
prevActiveTabId.value = activeTabId.value;
|
||||
activeTabId.value = id;
|
||||
data.value = tabs.value.at(newIndex)!.data;
|
||||
|
||||
|
||||
@@ -3,26 +3,35 @@ import xmlInputFieldComponent from '@/components/xml/XmlInputFieldComponent.vue'
|
||||
import xmlTabbedInputComponent from '@/components/xml/XmlTabbedInputComponent.vue';
|
||||
import xmlOutputFieldComponent from '@/components/xml/XmlOutputFieldComponent.vue';
|
||||
import TooltipComponent from '@/components/xml/tooltips/TooltipComponent.vue';
|
||||
|
||||
import { type TabData } from '@/components/common/TabData';
|
||||
import { ref } from 'vue';
|
||||
|
||||
|
||||
const xml = ref('');
|
||||
const xml = ref(new Array<TabData>);
|
||||
const query = ref('');
|
||||
const version = ref('');
|
||||
|
||||
function updateVersion(newVersion: string) {
|
||||
version.value = newVersion;
|
||||
}
|
||||
|
||||
function updateXML(data: Array<TabData>) {
|
||||
xml.value = data;
|
||||
console.log("Update:" + data);
|
||||
console.log(data);
|
||||
}
|
||||
|
||||
</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">
|
||||
<xmlTabbedInputComponent stylized-name="XML" :data="xml" @update="(data) => {xml = data}"></xmlTabbedInputComponent>
|
||||
<xmlTabbedInputComponent stylized-name="XML" :data="xml" @update="updateXML"></xmlTabbedInputComponent>
|
||||
<xmlInputFieldComponent stylized-name="XSLT" :data="query" @update="(data) => {query = data}"></xmlInputFieldComponent>
|
||||
</div>
|
||||
<xmlOutputFieldComponent tool="xslt" :xml="xml" :query="query" @update="(version) => updateVersion(version)"></xmlOutputFieldComponent>
|
||||
<xmlOutputFieldComponent tool="xslt" :multi-xml="xml" :query="query" @update="(version) => updateVersion(version)"></xmlOutputFieldComponent>
|
||||
</div>
|
||||
<TooltipComponent tool-type="xslt" :version="version"></TooltipComponent>
|
||||
</div>
|
||||
|
||||
Reference in New Issue
Block a user