fix: hide section if there is no fields in it

frappe · Sep 17, 2024 · 82d608b · 82d608b
1 parent 6208ede
commit 82d608b
Show file tree

Hide file tree

Showing 2 changed files with 11 additions and 2 deletions.
diff --git a/frontend/src/components/SectionFields.vue b/frontend/src/components/SectionFields.vue
@@ -7,7 +7,7 @@
  v-for="field in _fields"
  :key="field.label"
  :class="[field.hidden && 'hidden']"
- class="flex items-center gap-2 px-3 leading-5 first:mt-3"
+ class="section-field flex items-center gap-2 px-3 leading-5 first:mt-3"
  >
  <Tooltip :text="__(field.label)" :hoverDelay="1">
  <div class="sm:w-[106px] w-36 shrink-0 truncate text-sm text-gray-600">

diff --git a/frontend/src/pages/Deal.vue b/frontend/src/pages/Deal.vue
@@ -116,7 +116,7 @@
  <div
  v-for="(section, i) in fieldsLayout.data"
  :key="section.label"
- class="flex flex-col p-3"
+ class="section flex flex-col p-3"
  :class="{ 'border-b': i !== fieldsLayout.data.length - 1 }"
  >
  <Section :is-opened="section.opened" :label="section.label">
@@ -705,3 +705,12 @@ function openEmailBox() {
  activities.value.emailBox.show = true
 }
 </script>
+
+<style scoped>
+:deep(.section:has(.section-field.hidden)) {
+ display: none;
+}
+:deep(.section:has(.section-field:not(.hidden))) {
+ display: flex;
+}
+</style>