Skip to content

Commit fe3ec0b

Browse files
c-p-schmidtc-p-schmidt
authored
Merge pull request #26 from LaSi5002/feature/add-delete-properties
add property delete button if not required
2 parents f76711a + ad3f02c commit fe3ec0b

File tree

2 files changed

+140
-5
lines changed

2 files changed

+140
-5
lines changed

‎src/fourc_webviewer/fourc_webserver.py‎

Lines changed: 25 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -338,6 +338,8 @@ def init_general_sections_state_and_server_vars(self):
338338

339339
# loop through input file sections
340340
self.state.general_sections = {}
341+
self.state.add_key = "" # key for the add property row
342+
self.state.add_value = "" # value for the add property row
341343
for section_name, section_data in self._server_vars[
342344
"fourc_yaml_content"
343345
].sections.items():
@@ -1120,6 +1122,29 @@ def change_export_mode(self, export_mode, **kwargs):
11201122

11211123
"""------------------- Controller functions -------------------"""
11221124

1125+
@controller.set("delete_row")
1126+
def delete_row(self, item_key, **kwargs):
1127+
"""Deletes a row from the table."""
1128+
del self.state.general_sections[self.state.selected_main_section_name][
1129+
self.state.selected_section_name
1130+
][item_key]
1131+
self.state.dirty("general_sections")
1132+
self.state.flush()
1133+
1134+
@controller.set("add_row")
1135+
def add_row(self, **kwargs):
1136+
"""Adds a row to the table."""
1137+
if self.state.add_key:
1138+
general_sections = dict(self.state.general_sections or {})
1139+
general_sections[self.state.selected_main_section_name][
1140+
self.state.selected_section_name
1141+
][self.state.add_key] = self.state.add_value
1142+
self.state.general_sections = general_sections
1143+
self.state.add_key = ""
1144+
self.state.add_value = ""
1145+
self.state.dirty("general_sections")
1146+
self.state.flush()
1147+
11231148
@controller.set("click_info_button")
11241149
def click_info_button(self, **kwargs):
11251150
"""Toggles the info mode, which displays a bottom sheet containing file

‎src/fourc_webviewer/gui_utils.py‎

Lines changed: 115 additions & 5 deletions
Original file line numberDiff line numberDiff line change
@@ -605,17 +605,30 @@ def _prop_value_table(server):
605605
),
606606
key="item_key",
607607
):
608-
with html.Td(classes="text-center"):
608+
with html.Td(classes="text-center pa-0", style="position: relative;"):
609+
with vuetify.VBtn(
610+
v_if="edit_mode == all_edit_modes['edit_mode'] && !json_schema['properties']?.[selected_section_name]?.['required']?.includes(item_key)",
611+
tag="a",
612+
v_bind="{...props, target: '_blank'}",
613+
click=(server.controller.delete_row, "[item_key]"),
614+
icon=True,
615+
ripple=False,
616+
elevation="0",
617+
style="position:absolute; left:6px; top:50%; transform:translateY(-50%); "
618+
"min-width:0; padding:0;",
619+
):
620+
vuetify.VIcon(
621+
"mdi-trash-can-outline",
622+
size=26,
623+
color="#f77",
624+
)
609625
with vuetify.VTooltip(location="bottom"):
610626
with html.Template(v_slot_activator="{ props }"):
611-
html.P(v_text=("item_key",), v_bind="props")
627+
html.Span(v_text=("item_key",), v_bind="props")
612628
html.P(
613629
v_text=(
614630
"json_schema['properties']?.[selected_section_name]?.['properties']?.[item_key]?.['description'] || 'no description'",
615631
),
616-
v_if=(
617-
"json_schema['properties']?.[selected_section_name]?.['properties']?.[item_key]?.['description']",
618-
),
619632
style="max-width: 450px;",
620633
)
621634
html.Td(
@@ -693,6 +706,103 @@ def _prop_value_table(server):
693706
),
694707
),
695708
)
709+
with html.Tr(
710+
v_if=("edit_mode == all_edit_modes['edit_mode']",),
711+
):
712+
with html.Td(classes="text-center pa-0", style="position: relative;"):
713+
with vuetify.VBtn(
714+
tag="a",
715+
v_bind="{...props, target: '_blank'}",
716+
click=(server.controller.add_row),
717+
icon=True,
718+
ripple=False,
719+
elevation="0",
720+
style="position:absolute; left:6px; top:50%; transform:translateY(-50%); "
721+
"min-width:0; padding:0;",
722+
):
723+
vuetify.VIcon(
724+
"mdi-plus",
725+
size=26,
726+
color="#4a4",
727+
)
728+
vuetify.VAutocomplete(
729+
v_model=("add_key",),
730+
update_modelValue="flushState('general_sections')",
731+
# bind the enum array as items
732+
items=(
733+
"Object.keys(json_schema['properties']?.[selected_section_name]?.['properties'])",
734+
),
735+
dense=True,
736+
solo=True,
737+
filterable=True,
738+
classes="pb-1 ml-16",
739+
)
740+
html.Td(
741+
v_if="edit_mode == all_edit_modes['view_mode']",
742+
v_text=("item_val",),
743+
classes="text-center w-50",
744+
)
745+
with html.Td(
746+
v_if="edit_mode == all_edit_modes['edit_mode']",
747+
classes="text-center w-50",
748+
):
749+
vuetify.VTextField(
750+
v_model=("add_value",),
751+
v_if=(
752+
"(json_schema['properties']?.[selected_section_name]?.['properties']?.[add_key]?.['type'] == 'string' "
753+
"|| json_schema['properties']?.[selected_section_name]?.['properties']?.[add_key]?.['type'] == 'number' "
754+
"|| json_schema['properties']?.[selected_section_name]?.['properties']?.[add_key]?.['type'] == 'integer')"
755+
"&& !json_schema['properties']?.[selected_section_name]?.['properties']?.[add_key]?.['enum']"
756+
),
757+
blur=server.controller.on_leave_edit_field,
758+
update_modelValue="flushState('general_sections')", # this is required in order to flush the state changes correctly to the server, as our passed on v-model is a nested variable
759+
classes="w-80 pb-1",
760+
dense=True,
761+
# If we will add errors for this later
762+
# color=f"{item_error} && error",
763+
# bg_color=(f"{item_error} ? 'rgba(255, 0, 0, 0.2)' : ''",),
764+
# error_messages=(
765+
# f"{item_error}?.length > 100 ? {item_error}?.slice(0, 97)+' ...' : {item_error}",
766+
# ),
767+
)
768+
# if item is a boolean -> use VSwitch
769+
with html.Div(
770+
v_if=(
771+
"json_schema['properties']?.[selected_section_name]?.['properties']?.[add_key]?.['type'] === 'boolean'"
772+
),
773+
classes="d-flex align-center justify-center",
774+
):
775+
vuetify.VSwitch(
776+
v_model=("add_value"),
777+
classes="mt-4",
778+
update_modelValue="flushState('general_sections')",
779+
class_="mx-100",
780+
dense=True,
781+
color="primary",
782+
)
783+
(
784+
vuetify.VAutocomplete(
785+
v_model=("add_value"),
786+
v_if=(
787+
"json_schema['properties']?.[selected_section_name]"
788+
"?.['properties']?.[add_key]?.['enum']"
789+
),
790+
update_modelValue="flushState('general_sections')",
791+
# bind the enum array as items
792+
items=(
793+
"json_schema['properties'][selected_section_name]['properties'][add_key]['enum']",
794+
),
795+
dense=True,
796+
solo=True,
797+
filterable=True,
798+
classes="w-80 pb-1",
799+
# color=f"{item_error} && error",
800+
# bg_color=(f"{item_error} ? 'rgba(255, 0, 0, 0.2)' : ''",),
801+
# error_messages=(
802+
# f"{item_error}?.length > 100 ? {item_error}?.slice(0, 97)+' ...' : {item_error}",
803+
# ),
804+
),
805+
)
696806

697807

698808
def _materials_panel():

0 commit comments

Comments
 (0)