This commit is contained in:
cgfhtw
2023-05-24 12:05:36 +02:00
parent 94a15093ac
commit be331d6200
3 changed files with 24 additions and 21 deletions
+12 -8
View File
@@ -510,14 +510,8 @@ export const CoreFilterCmpt = {
<div :id="'filterCollapsables' + idExtra">
<div class="d-flex flex-row-reverse justify-content-between">
<div class="filter-header-title">
<span v-if="!tableOnly" class="filter-header-title-span-filter">[ {{ filterName }} ]</span>
<span v-if="!tableOnly" data-bs-toggle="collapse" :data-bs-target="'#collapseFilters' + idExtra" class="filter-header-title-span-icon fa-solid fa-filter fa-xl"></span>
<span data-bs-toggle="collapse" :data-bs-target="'#collapseColumns' + idExtra" class="filter-header-title-span-icon fa-solid fa-table-columns fa-xl"></span>
<table-download class="filter-header-title-span-icon fa-xl text-dark" :tabulator="tabulator" :config="download"></table-download>
</div>
<div v-if="newBtnShow || reload || $slots.actions" class="filter-header-title d-flex gap-2 align-items-baseline">
<div class="d-flex flex-row justify-content-between flex-wrap">
<div v-if="newBtnShow || reload || $slots.actions" class="d-flex gap-2 align-items-baseline flex-wrap">
<button v-if="newBtnShow" class="btn btn-outline-secondary" :class="newBtnClass" :title="newBtnLabel ? undefined : 'New'" :aria-label="newBtnLabel ? undefined : 'New'" @click="$emit('click:new', $event)" :disabled="newBtnDisabled">
<span class="fa-solid fa-plus" aria-hidden="true"></span>
{{ newBtnLabel }}
@@ -528,6 +522,16 @@ export const CoreFilterCmpt = {
<span v-if="$slots.actions && tabulatorHasSelector">Mit {{selectedData.length}} ausgewählten: </span>
<slot name="actions" v-bind="tabulatorHasSelector ? selectedData : []"></slot>
</div>
<div class="d-flex gap-1 align-items-baseline flex-grow-1 justify-content-end">
<span v-if="!tableOnly">[ {{ filterName }} ]</span>
<a v-if="!tableOnly" href="#" class="btn btn-link px-0 text-dark" data-bs-toggle="collapse" :data-bs-target="'#collapseFilters' + idExtra">
<span class="fa-solid fa-xl fa-filter"></span>
</a>
<a href="#" class="btn btn-link px-0 text-dark" data-bs-toggle="collapse" :data-bs-target="'#collapseColumns' + idExtra">
<span class="fa-solid fa-xl fa-table-columns"></span>
</a>
<table-download class="btn btn-link px-0 text-dark" :tabulator="tabulator" :config="download"></table-download>
</div>
</div>
<filter-columns
+8 -10
View File
@@ -64,16 +64,14 @@ export default {
template: `
<div class="filter-columns">
<div class="card">
<div class="row card-body filter-options-div">
<div class="filter-fields-area">
<div
v-for="fieldToDisplay in fields"
class="filter-fields-field"
:class="selected.indexOf(fieldToDisplay) != -1 ? 'text-light bg-dark' : '' "
@click="toggle(fieldToDisplay)"
>
{{ names[fieldToDisplay] || fieldToDisplay }}
</div>
<div class="d-flex flex-wrap gap-2 p-3 justify-content-center">
<div
v-for="fieldToDisplay in fields"
class="btn"
:class="selected.indexOf(fieldToDisplay) != -1 ? 'btn-dark' : 'btn-outline-dark' "
@click="toggle(fieldToDisplay)"
>
{{ names[fieldToDisplay] || fieldToDisplay }}
</div>
</div>
</div>
@@ -42,7 +42,8 @@ export default {
config: {
type: [Boolean, String, Function, Array, Object],
default: false
}
},
iconClass: [String, Array, Object]
},
computed: {
currentConfig() {
@@ -215,7 +216,7 @@ export default {
aria-title="Download"
@click.prevent="download(currentConfig[0])"
>
<span class="fa-solid fa-download" aria-hidden="true"></span>
<span :class="iconClass || 'fa-solid fa-xl fa-download'" aria-hidden="true"></span>
</a>
</template>
<div v-else class="dropdown d-inline">
@@ -229,7 +230,7 @@ export default {
data-bs-toggle="dropdown"
aria-expanded="false"
>
<span class="fa-solid fa-download" aria-hidden="true"></span>
<span :class="iconClass || 'fa-solid fa-xl fa-download'" aria-hidden="true"></span>
</a>
<ul class="dropdown-menu dropdown-menu-end">
<li v-for="(conf, i) in currentConfig" :key="i">