jebus/enviPy-bayer
1
0
Fork 0
forked from enviPath/enviPy
Code Issues Pull Requests Actions Releases Activity

[Feature] Dynamic additional information rendering in frontend (#282)

Browse Source 
This implements a version of #274, relying on Pydantics built in JSON schema and JSON rendering.
Requires additional UI tagging in the ai model repo but will remove HTML tags.

Example scenario with filled information: 5882df9c-dae1-4d80-a40e-db4724271456/scenario/3a4d395a-6a6d-4154-8ce3-ced667fceec0

Reviewed-on: enviPath/enviPy#282
Co-authored-by: Tobias O <tobias.olenyi@envipath.com>
Co-committed-by: Tobias O <tobias.olenyi@envipath.com>
This commit is contained in:
Tobias O
2026-01-31 00:44:03 +13:00
committed by jebus
parent 9f63a9d4de
commit d80dfb5ee3
42 changed files with 3732 additions and 609 deletions
Download Patch File Download Diff File Expand all files Collapse all files

175
templates/objects/scenario.html
View File

@ -1,6 +1,9 @@
{% extends "framework_modern.html" %}
{% load static %}
{% block content %}
<script src="{% static 'js/alpine/components/widgets.js' %}"></script>
<script src="{% static 'js/api/additional-information.js' %}"></script>
{% block action_modals %}
{% include "modals/objects/edit_scenario_modal.html" %}
@ -58,46 +61,88 @@
</div>
</div>
<!-- Additional Information Table -->
<!-- Additional Information -->
<div class="card bg-base-100">
<div class="card-body">
<h3 class="card-title mb-4 text-lg">Additional Information</h3>
<div class="overflow-x-auto">
<table class="table-zebra table">
<thead>
<tr>
<th>Property</th>
<th>Value</th>
<th>Unit</th>
{% if meta.can_edit %}
<th>Remove</th>
{% endif %}
</tr>
</thead>
<tbody>
{% for ai in scenario.get_additional_information %}
<tr>
<td>{{ ai.property_name|safe }}</td>
<td>{{ ai.property_data|safe }}</td>
<td>{{ ai.property_unit|safe }}</td>
{% if meta.can_edit %}
<td>
<form
action="{% url 'package scenario detail' scenario.package.uuid scenario.uuid %}"
method="post"
<div
x-data="{
items: [],
schemas: {},
loading: true,
error: null,
async init() {
try {
// Use the unified API client for loading data
const { items, schemas } = await window.AdditionalInformationApi.loadSchemasAndItems('{{ scenario.uuid }}');
this.items = items;
this.schemas = schemas;
} catch (err) {
this.error = err.message;
console.error('Error loading additional information:', err);
} finally {
this.loading = false;
}
},
async deleteItem(uuid) {
if (!confirm('Are you sure you want to delete this item?')) return;
try {
// Use the unified API client for delete operations
await window.AdditionalInformationApi.deleteItem('{{ scenario.uuid }}', uuid);
// Remove from items array
this.items = this.items.filter(item => item.uuid !== uuid);
} catch (err) {
alert('Error deleting item: ' + err.message);
console.error('Error deleting item:', err);
}
}
}"
>
<!-- Loading state -->
<template x-if="loading">
<div class="flex items-center justify-center p-4">
<span class="loading loading-spinner loading-md"></span>
</div>
</template>
<!-- Error state -->
<template x-if="error">
<div class="alert alert-error mb-4">
<span x-text="error"></span>
</div>
</template>
<!-- Items list -->
<template x-if="!loading && !error">
<div class="space-y-4">
<template x-if="items.length === 0">
<p class="text-base-content/60">
No additional information available.
</p>
</template>
<template x-for="item in items" :key="item.uuid">
<div class="card bg-base-200 shadow-sm">
<div class="card-body p-4">
<div class="flex items-start justify-between">
<div
class="flex-1"
x-data="schemaRenderer({
rjsf: schemas[item.type.toLowerCase()],
data: item.data,
mode: 'view'
})"
x-init="init()"
>
{% csrf_token %}
<input
type="hidden"
name="uuid"
value="{{ ai.uuid }}"
/>
<input
type="hidden"
name="hidden"
value="delete-additional-information"
/>
<button type="submit" class="btn btn-sm btn-ghost">
{% include "components/schema_form.html" %}
</div>
{% if meta.can_edit %}
<button
class="btn btn-sm btn-ghost ml-2"
@click="deleteItem(item.uuid)"
>
<svg
xmlns="http://www.w3.org/2000/svg"
width="16"
@ -108,56 +153,20 @@
stroke-width="2"
stroke-linecap="round"
stroke-linejoin="round"
class="lucide lucide-minus"
class="lucide lucide-trash"
>
<path d="M5 12h14" />
<path d="M3 6h18" />
<path d="M19 6v14c0 1-1 2-2 2H7c-1 0-2-1-2-2V6" />
<path d="M8 6V4c0-1 1-2 2-2h4c1 0 2 1 2 2v2" />
</svg>
</button>
</form>
</td>
{% endif %}
</tr>
{% endfor %}
{% if meta.can_edit %}
<tr>
<td></td>
<td></td>
<td>Delete all</td>
<td>
<form
action="{% url 'package scenario detail' scenario.package.uuid scenario.uuid %}"
method="post"
>
{% csrf_token %}
<input
type="hidden"
name="hidden"
value="delete-all-additional-information"
/>
<button type="submit" class="btn btn-sm btn-ghost">
<svg
xmlns="http://www.w3.org/2000/svg"
width="16"
height="16"
viewBox="0 0 24 24"
fill="none"
stroke="currentColor"
stroke-width="2"
stroke-linecap="round"
stroke-linejoin="round"
class="lucide lucide-trash"
>
<path d="M3 6h18" />
<path d="M19 6v14c0 1-1 2-2 2H7c-1 0-2-1-2-2V6" />
<path d="M8 6V4c0-1 1-2 2-2h4c1 0 2 1 2 2v2" />
</svg>
</button>
</form>
</td>
</tr>
{% endif %}
</tbody>
</table>
{% endif %}
</div>
</div>
</div>
</template>
</div>
</template>
</div>
</div>
</div>