blackicedbear/FHC-Core
1
0
Fork 0
mirror of https://github.com/FH-Complete/FHC-Core.git synced 2026-07-23 18:02:18 +00:00
Code Issues Packages Projects Releases Wiki Activity

adds the collapsing function to the column itself

Browse Source
This commit is contained in:
Simon Gschnell
2023-12-13 12:58:34 +01:00
parent b400ea758c
commit ba17974371
1 changed files with 32 additions and 34 deletions
Download Patch File Download Diff File Expand all files Collapse all files
public/js/components/Cis/Profil/MitarbeiterProfil.js
+32 -34
View File
@@ -7,6 +7,36 @@ let customEvents = [{event: "headerClick", handler:function(e,column){
}}]
let showCollapsedColumn= true;
const collapseFunction = function(e, column){
//* update the reactive data
console.log(showCollapsedColumn);
showCollapsedColumn = !showCollapsedColumn;
console.log(showCollapsedColumn);
//* changes the icon that shows or hides all the collapsed columns
if(showCollapsedColumn){
document.getElementById("collapseIcon").classList.replace("fa-angle-up","fa-angle-down");
}else{
document.getElementById("collapseIcon").classList.replace("fa-angle-down","fa-angle-up");
}
//* changes the icon for every collapsed column to open or closed
[...document.getElementsByClassName("tabulator-responsive-collapse-toggle")].forEach(ele => {
if(showCollapsedColumn){
if(!ele.classList.contains("open"))
ele.click();
}else{
if(ele.classList.contains("open"))
ele.click();
}
});
}
export default {
@@ -42,6 +72,7 @@ export default {
headerFilter:false,
formatter:"responsiveCollapse",
maxWidth:40,
headerClick:collapseFunction,
},
{ title: "Bezeichnung", field: "Bezeichnung", headerFilter: true,minWidth:200, },
{
@@ -173,40 +204,7 @@ export default {
this.$refs.funktionenTable.tabulator.on("headerClick", function(e, column){
//* update the reactive data
console.log(showCollapsedColumn);
showCollapsedColumn = !showCollapsedColumn;
console.log(showCollapsedColumn);
if(column._column.field == "collapse"){
//* changes the icon that shows or hides all the collapsed columns
if(showCollapsedColumn){
document.getElementById("collapseIcon").classList.replace("fa-angle-up","fa-angle-down");
}else{
document.getElementById("collapseIcon").classList.replace("fa-angle-down","fa-angle-up");
}
//* changes the icon for every collapsed column to open or closed
[...document.getElementsByClassName("tabulator-responsive-collapse-toggle")].forEach(ele => {
if(showCollapsedColumn){
if(!ele.classList.contains("open"))
ele.click();
}else{
if(ele.classList.contains("open"))
ele.click();
}
});
}
});
},