update layout

This commit is contained in:
2024-11-26 17:36:07 +01:00
parent 42bfe0d3cb
commit e056337adc
4 changed files with 55 additions and 11 deletions

View File

@@ -17,4 +17,6 @@
--focus-ring-color: var(--p-focus-ring-color);
--focus-ring-offset: var(--p-focus-ring-offset);
--focus-ring-shadow: var(--p-focus-ring-shadow);
--p-tooltip-color: black !important;
--p-tooltip-background: white !important;
}

View File

@@ -20,7 +20,8 @@
:key="index"
:width="config.width"
:height="config.height"
class="mb-2 w-full" />
class="mb-2 w-full"
style="background-color: #e7e7e8" />
</div>
</div>
<div id ="card-flow-codeviewer" class="flex-1">

View File

@@ -20,6 +20,56 @@
<ProgressSpinner style="width: 30px; height: 30px; margin: 30px" strokeWidth="6" fill="transparent"/>
</div>
<div v-if="data_loaded">
<!-- <div class="box p-4 border rounded-md shadow-sm" style="background-color: #f3f3f3;">
<div v-for="(input, index) in inputs" :key="index" class="input-container">
<div class="input-wrapper">
<span class="font-bold">{{ index.replace(/_/g, ' ').replace(/\b\w/g, char => char.toUpperCase()) }}:</span>
<span>{{ input }}</span>
</div>
</div>
</div> -->
<Panel class="mt-6">
<template #header>
<div class="flex items-center gap-2">
<span class="font-bold">Execution Input for ID {{execution_id}}</span>
</div>
</template>
<div class="box p-4 border rounded-md shadow-sm" style="background-color: white;">
<div v-for="(input, index) in inputs" :key="index" class="input-container">
<div class="input-wrapper">
<span class="font-bold">{{ index.replace(/_/g, ' ').replace(/\b\w/g, char => char.toUpperCase()) }}:</span>
<span>{{ input }}</span>
</div>
</div>
</div>
</Panel>
<Panel class="mt-6">
<template #header>
<div class="flex items-center gap-2">
<span class="font-bold">Hermione response</span>
</div>
</template>
<template #icons>
<div class="flex justify-end">
<Button severity="secondary" rounded @click="openDebug" v-tooltip.left="'View code'">
<i class="pi pi-code"></i>
</Button>
</div>
</template>
<div class="card flex flex-col gap-4 w-full">
<div v-if="scenario.outputType == 'ciaOutput'">
<ChangeImpactOutputViewer :scenario_output="scenario_output" />
</div>
<div v-else>
<MdPreview class="editor" v-model="scenario_output" language="en-US" />
</div>
</div>
</Panel>
<Panel class="mt-6">
<template #header>
<div class="flex items-center gap-2">
@@ -33,15 +83,6 @@
</Button>
</div>
</template>
<div class="box p-4 border rounded-md shadow-sm" style="background-color: white;">
<div v-for="(input, index) in inputs" :key="index" class="input-container">
<div class="input-wrapper">
<span class="font-bold">{{ index.replace(/_/g, ' ').replace(/\b\w/g, char => char.toUpperCase()) }}:</span>
<span>{{ input }}</span>
</div>
</div>
</div>
<div class="card flex flex-col gap-4 w-full">
<div v-if="scenario.outputType == 'ciaOutput'">

View File

@@ -37,7 +37,7 @@
</div>
</template>
<Column field="id" header="Execution ID"></Column>
<!-- <Column field="id" header="Execution ID"></Column> -->
<Column field="scenario.name" header="Scenario Name">
<template #body="slotProps">
<div class="flex items-center gap-2">