github/skywalking-booster-ui
2
0
Fork 1
mirror of https://github.com/apache/skywalking-booster-ui.git synced 2025-05-14 09:00:50 +00:00
Code Issues Packages Projects Releases Wiki Activity

Making checkbox toggle collumns

Browse Source
This commit is contained in:
Peter Olu 2022-06-05 22:57:17 +01:00
parent c37b7ee0f5
commit 615ba79185
1 changed files with 15 additions and 5 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

16
src/views/dashboard/related/log/Header.vue
View File

@ -17,7 +17,7 @@ limitations under the License. -->
<div v-if="currentSearchTerm === 'column'" class="flex-h items-center mr-5">
<!-- <p style="margin-right: 10px">Select visible columns</p> -->
<el-dropdown class="dark" :hide-on-click="false">
<span class="el-dropdown-link">
<span class="cursor-pointer">
Select visible columns<el-icon class="el-icon--right"
><arrow-down
/></el-icon>
@ -29,15 +29,17 @@ limitations under the License. -->
style="width: 100%"
class="flex-h items-center justify-between"
>
<span style="margin-right: 10px">Show All</span>
<el-checkbox :checked="showAllColumns" size="large" />
<span style="margin-right: 10px">Show All</span>
</div>
</el-dropdown-item>
<el-dropdown-item
v-for="item in logStore.serviceLogColumn"
:key="item.value"
>
<el-checkbox v-model="item.isVisible" :label="item.value" fill="success" />
<el-checkbox class="custom-checkbox" v-model="item.isVisible">
<span>{{ item.value }}</span>
</el-checkbox>
<!-- <div
style="width: 100%"
class="flex-h items-center justify-between"
@ -632,6 +634,14 @@ watch(
display: flex;
align-items: center;
}
.cursor-pointer {
cursor: pointer;
}
.custom-checkbox .el-checkbox__input.is-checked + .el-checkbox__label,
.custom-checkbox .el-checkbox__label {
color: var(--spp-white) !important;
}
// .log-wrapper {
// width: 600px;
// padding-left: 40px;