Added feature to show all and hide all

This commit is contained in:
Peter Olu 2022-06-05 23:25:31 +01:00
parent 615ba79185
commit 53019058bc
2 changed files with 18 additions and 6 deletions

View File

@ -64,16 +64,21 @@ export const logStore = defineStore({
showColumns(columnsLabel: string) { showColumns(columnsLabel: string) {
this.serviceLogColumn.forEach((col: any) => { this.serviceLogColumn.forEach((col: any) => {
if (columnsLabel === col.value) { if (columnsLabel === col.value) {
col.isVisible = true col.isVisible = true;
} }
}) });
}, },
hideColumns(columnsLabel: string) { hideColumns(columnsLabel: string) {
this.serviceLogColumn.forEach((col: any) => { this.serviceLogColumn.forEach((col: any) => {
if (columnsLabel === col.value) { if (columnsLabel === col.value) {
col.isVisible = false col.isVisible = false;
} }
}) });
},
toggleAllColumns(status: boolean) {
this.serviceLogColumn.forEach((col: any) => {
col.isVisible = status;
});
}, },
setLogCondition(data: any) { setLogCondition(data: any) {
this.conditions = { ...this.conditions, ...data }; this.conditions = { ...this.conditions, ...data };

View File

@ -29,8 +29,9 @@ limitations under the License. -->
style="width: 100%" style="width: 100%"
class="flex-h items-center justify-between" class="flex-h items-center justify-between"
> >
<el-checkbox :checked="showAllColumns" size="large" /> <!-- <el-checkbox v-model="showAllColumns" size="large"> -->
<span style="margin-right: 10px">Show All</span> <span style="margin-right: 10px">Show All</span>
<!-- </el-checkbox> -->
</div> </div>
</el-dropdown-item> </el-dropdown-item>
<el-dropdown-item <el-dropdown-item
@ -623,6 +624,12 @@ watch(
} }
} }
); );
watch(
() => showAllColumns.value,
(newVal, oldVal) => {
console.log("New:", newVal, "Old:", oldVal)
logStore.toggleAllColumns(newVal)
})
</script> </script>
<style lang="scss" scoped> <style lang="scss" scoped>
.dropdownSelector { .dropdownSelector {