making Filter-core-cmp emit the tableBuilt event

This commit is contained in:
SimonGschnell
2024-05-08 10:58:38 +02:00
parent 9db09a040a
commit fb6bb96fbd
4 changed files with 28 additions and 35 deletions
@@ -142,6 +142,12 @@ export default {
},
methods: {
betriebsmittelTableBuilt: function () {
this.$refs.betriebsmittelTable.tabulator.setData(this.data.mittel);
},
funktionenTableBuilt: function () {
this.$refs.funktionenTable.tabulator.setData(this.data.funktionen);
},
hideEditProfilModal: function () {
//? checks the editModal component property result, if the user made a successful request or not
if (this.$refs.editModal.result) {
@@ -234,16 +240,6 @@ export default {
this.data.profilUpdates?.sort(this.sortProfilUpdates);
},
mounted() {
this.$refs.betriebsmittelTable.tabulator.on("tableBuilt", () => {
this.$refs.betriebsmittelTable.tabulator.setData(this.data.mittel);
});
this.$refs.funktionenTable.tabulator.on("tableBuilt", () => {
this.$refs.funktionenTable.tabulator.setData(this.data.funktionen);
});
},
template: /*html*/ `
<div class="container-fluid text-break fhc-form" >
@@ -405,14 +401,14 @@ export default {
<!-- FUNKTIONEN TABELLE -->
<core-filter-cmpt :title="$p.t('person','funktionen')" ref="funktionenTable" :tabulator-options="funktionen_table_options" tableOnly :sideMenu="false" />
<core-filter-cmpt @tableBuilt="funktionenTableBuilt" :title="$p.t('person','funktionen')" ref="funktionenTable" :tabulator-options="funktionen_table_options" tableOnly :sideMenu="false" />
</div>
<div class="col-12 mb-4" >
<!-- BETRIEBSMITTEL TABELLE -->
<core-filter-cmpt :title="$p.t('profil','entlehnteBetriebsmittel')" ref="betriebsmittelTable" :tabulator-options="betriebsmittel_table_options" tableOnly :sideMenu="false" />
<core-filter-cmpt @tableBuilt="betriebsmittelTableBuilt" :title="$p.t('profil','entlehnteBetriebsmittel')" ref="betriebsmittelTable" :tabulator-options="betriebsmittel_table_options" tableOnly :sideMenu="false" />
</div>
</div>
@@ -86,7 +86,11 @@ export default {
//? this is the prop passed to the dynamic component with the custom data of the view
props: ["data"],
methods: {},
methods: {
funktionenTableBuilt: function () {
this.$refs.funktionenTable.tabulator.setData(this.data.funktionen);
},
},
computed: {
personEmails() {
@@ -128,12 +132,6 @@ export default {
},
},
mounted() {
this.$refs.funktionenTable.tabulator.on("tableBuilt", () => {
this.$refs.funktionenTable.tabulator.setData(this.data.funktionen);
});
},
template: /*html*/ `
<div class="container-fluid text-break fhc-form" >
@@ -228,7 +226,7 @@ export default {
<!-- FIRST TABLE -->
<div class="col-12 mb-4" >
<core-filter-cmpt :title="$p.t('person','funktionen')" ref="funktionenTable" :tabulator-options="funktionen_table_options" tableOnly :sideMenu="false" />
<core-filter-cmpt @tableBuilt="funktionenTableBuilt" :title="$p.t('person','funktionen')" ref="funktionenTable" :tabulator-options="funktionen_table_options" tableOnly :sideMenu="false" />
</div>
@@ -85,6 +85,14 @@ export default {
editData: Object,
},
methods: {
betriebsmittelTableBuilt: function () {
this.$refs.betriebsmittelTable.tabulator.setData(this.data.mittel);
},
zutrittsgruppenTableBuilt: function () {
this.$refs.zutrittsgruppenTable.tabulator.setData(
this.data.zuttritsgruppen
);
},
fetchProfilUpdates: function () {
Vue.$fhcapi.ProfilUpdate.selectProfilRequest().then((res) => {
if (!res.error) {
@@ -175,17 +183,7 @@ export default {
this.data.profilUpdates?.sort(this.sortProfilUpdates);
},
mounted() {
this.$refs.betriebsmittelTable.tabulator.on("tableBuilt", () => {
this.$refs.betriebsmittelTable.tabulator.setData(this.data.mittel);
});
this.$refs.zutrittsgruppenTable.tabulator.on("tableBuilt", () => {
this.$refs.zutrittsgruppenTable.tabulator.setData(
this.data.zuttritsgruppen
);
});
},
template: /*html*/ `
@@ -350,11 +348,11 @@ export default {
<div class="row">
<div class="col-12 mb-4" >
<core-filter-cmpt :title="$p.t('profil','entlehnteBetriebsmittel')" ref="betriebsmittelTable" :tabulator-options="betriebsmittel_table_options" tableOnly :sideMenu="false" />
<core-filter-cmpt @tableBuilt="betriebsmittelTableBuilt" :title="$p.t('profil','entlehnteBetriebsmittel')" ref="betriebsmittelTable" :tabulator-options="betriebsmittel_table_options" tableOnly :sideMenu="false" />
</div>
<div class="col-12 mb-4" >
<core-filter-cmpt :title="$p.t('profil','zutrittsGruppen')" ref="zutrittsgruppenTable" :tabulator-options="zutrittsgruppen_table_options" tableOnly :sideMenu="false" noColumnFilter />
<core-filter-cmpt @tableBuilt="zutrittsgruppenTableBuilt" :title="$p.t('profil','zutrittsGruppen')" ref="zutrittsgruppenTable" :tabulator-options="zutrittsgruppen_table_options" tableOnly :sideMenu="false" noColumnFilter />
</div>
+3 -2
View File
@@ -38,7 +38,8 @@ export const CoreFilterCmpt = {
},
emits: [
'nwNewEntry',
'click:new'
'click:new',
'tableBuilt'
],
props: {
onNwNewEntry: Function, // NOTE(chris): Hack to get the nwNewEntry listener into $props
@@ -223,7 +224,7 @@ export const CoreFilterCmpt = {
for (let evt of this.tabulatorEvents)
this.tabulator.on(evt.event, evt.handler);
}
this.tabulator.on('tableBuilt', () => this.tableBuilt = true);
this.tabulator.on('tableBuilt', () => {this.tableBuilt = true; this.$emit('tableBuilt');});
this.tabulator.on("rowSelectionChanged", data => {
this.selectedData = data;
});