add filters

zero.Backoffice.UI/app/components/ui-table-filter-overlay.vue

@@ -3,7 +3,7 @@
     <ui-trinity class="ui-module-overlay">
 
       <template v-slot:header>
-        <ui-header-bar :title="model.title" :back-button="false" :close-button="true" />
+        <ui-header-bar title="@listfilter.headline" :back-button="false" :close-button="true" />
       </template>
 
       <template v-slot:footer>
@@ -24,7 +24,7 @@
         <div v-for="(field, index) in fields" class="ui-table-filter-overlay-group" :class="{ 'is-open': activeFilter === index, 'has-value': field.preview.selected(value[field.path]) }">
           <div class="ui-table-filter-overlay-group-head">
             <ui-select-button :label="field.label" :icon="field.preview.icon" :description="field.preview.value(value[field.path])" @click="toggleFilter(field, index)" />
-            <ui-button class="ui-table-filter-overlay-group-clear" type="blank" label="Clear" @click="clearFilter(field, index)" />
+            <ui-button class="ui-table-filter-overlay-group-clear" type="blank" label="@listfilter.clearitem" @click="clearFilter(field, index)" />
           </div>
           <div v-show="activeFilter === index" class="ui-table-filter-overlay-group-content">
             <ui-editor-component :field="field" :value="value" @input="onFieldChange" :disabled="disabled" />
@@ -33,7 +33,7 @@
       </div>
 
       <div v-if="!loading" class="ui-box ui-table-filter-overlay-filtername">
-        <ui-property label="Save as..." description="You can optionally save this filter for future reference" :vertical="true">
+        <ui-property label="@listfilter.saveas" description="@listfilter.saveas_text" :vertical="true">
           <input v-model="filterName" type="text" class="ui-input" maxlength="40" />
         </ui-property>
       </div>

zero.Backoffice.UI/app/components/ui-table-filter.vue

@@ -4,15 +4,15 @@
 
     <ui-dropdown v-if="hasFilter && storedFilters.length" align="right">
       <template v-slot:button>
-        <ui-button type="light onbg" :label="filterLabel" caret="down" />
+        <ui-button type="light onbg" :label="filterLabel" :tokens="{ name: currentFilter ? currentFilter.name : null }" caret="down" />
       </template>
       <ui-dropdown-button v-if="storedFilters.length" v-for="(filter, index) in storedFilters" :key="index" :value="filter" :label="filter.name" @click="setFilter" />
       <ui-dropdown-separator v-if="storedFilters.length" />
       <ui-dropdown-button label="@ui.add" icon="fth-plus" @click="addOrEditFilter()" />
-      <ui-dropdown-button v-if="currentFilter" label="Edit filter" icon="fth-edit-2" @click="addOrEditFilter(currentFilter.id)" />
-      <ui-dropdown-button label="Clear filter" icon="fth-x" @click="setFilter(null)" />
+      <ui-dropdown-button v-if="currentFilter" label="@listfilter.button_edit" icon="fth-edit-2" @click="addOrEditFilter(currentFilter.id)" />
+      <ui-dropdown-button v-if="currentFilter" label="@listfilter.button_clear" icon="fth-x" @click="setFilter(null)" />
     </ui-dropdown>
-    <ui-button v-if="hasFilter && !storedFilters.length" type="light onbg" label="Filter" @click="addOrEditFilter()" />
+    <ui-button v-if="hasFilter && !storedFilters.length" type="light onbg" label="@listfilter.button" @click="addOrEditFilter()" />
 
     <ui-dropdown v-if="!hideSelection && selection.length > 0" align="right">
       <template v-slot:button>
@@ -82,7 +82,7 @@
     computed: {
       filterLabel()
       {
-        return this.currentFilter ? 'Filter: <span>' + this.currentFilter.name + "</span>" : 'Filter';
+        return this.currentFilter ? '@listfilter.button_selected' : '@listfilter.button';
       }
     },
 
@@ -193,7 +193,6 @@
           component: () => import('./ui-table-filter-overlay.vue'),
           display: 'editor',
           model: {
-            title: 'Filter',
             editor: this.filterOptions.editor,
             template: this.filterOptions.template,
             value: model,

zero.Backoffice/Resources/Localization/zero.de-de.json

@@ -770,6 +770,20 @@
       "mediafolder": "Medien"
     }
   },
+
+  "listfilter": {
+    "button": "Filter",
+    "button_selected": "Filter: {name}",
+    "headline": "Filter",
+    "button_edit": "Filter bearbeiten",
+    "button_clear": "Filter aufheben",
+    "clearitem": "Löschen",
+    "saveas": "Speichern als...",
+    "saveas_text": "Der Filter kann für spätere Verwendung gespeichert werden",
+    "search_placeholder": "Suchbegriff eingeben...",
+    "xselected": "{count} ausgewählt"
+  },
+
   "blueprint": {
     "hint": {
       "childtext": "<b>Dieses Element basiert auf einer Blaupause</b>. Die Werte werden automatisch aktualisiert.",

zero.Backoffice/Resources/Localization/zero.en-us.json

@@ -817,6 +817,19 @@
     }
   },
 
+  "listfilter": {
+    "button": "Filter",
+    "button_selected": "Filter: {name}",
+    "headline": "Filter",
+    "button_edit": "Edit filter",
+    "button_clear": "Clear filter",
+    "clearitem": "Clear",
+    "saveas": "Save as...",
+    "saveas_text": "You can optionally save this filter for future reference",
+    "search_placeholder": "Enter a search term...",
+    "xselected": "{count} selected"
+  },
+
   "blueprint": {
     "hint": {
       "childText": "<b>This entity is a child of a blueprint</b>. Its properties are automatically updated.",