From 43d76e599091dc6b79b51f89c79514b50e33ea35 Mon Sep 17 00:00:00 2001 From: fuzui <73400@163.com> Date: 星期四, 16 十二月 2021 02:18:48 +0800 Subject: [PATCH] fix: cron组件中周回显bug --- ruoyi-ui/src/components/RightToolbar/index.vue | 59 ++++++++++++++++++++++++++++++++++++++++++++++++++++++----- 1 files changed, 54 insertions(+), 5 deletions(-) diff --git a/ruoyi-ui/src/components/RightToolbar/index.vue b/ruoyi-ui/src/components/RightToolbar/index.vue index 73d2dcc..976974e 100644 --- a/ruoyi-ui/src/components/RightToolbar/index.vue +++ b/ruoyi-ui/src/components/RightToolbar/index.vue @@ -1,4 +1,3 @@ -<!-- @author Shiyn/ huangmx 20200807优化--> <template> <div class="top-right-btn"> <el-row> @@ -8,31 +7,81 @@ <el-tooltip class="item" effect="dark" content="刷新" placement="top"> <el-button size="mini" circle icon="el-icon-refresh" @click="refresh()" /> </el-tooltip> + <el-tooltip class="item" effect="dark" content="显隐列" placement="top" v-if="columns"> + <el-button size="mini" circle icon="el-icon-menu" @click="showColumn()" /> + </el-tooltip> </el-row> + <el-dialog :title="title" :visible.sync="open" append-to-body> + <el-transfer + :titles="['显示', '隐藏']" + v-model="value" + :data="columns" + @change="dataChange" + ></el-transfer> + </el-dialog> </div> </template> <script> export default { name: "RightToolbar", data() { - return {}; + return { + // 显隐数据 + value: [], + // 弹出层标题 + title: "显示/隐藏", + // 是否显示弹出层 + open: false, + }; }, props: { showSearch: { type: Boolean, default: true, }, + columns: { + type: Array, + }, }, - + created() { + // 显隐列初始默认隐藏列 + for (let item in this.columns) { + if (this.columns[item].visible === false) { + this.value.push(parseInt(item)); + } + } + }, methods: { - //搜索 + // 搜索 toggleSearch() { this.$emit("update:showSearch", !this.showSearch); }, - //刷新 + // 刷新 refresh() { this.$emit("queryTable"); + }, + // 右侧列表元素变化 + dataChange(data) { + for (let item in this.columns) { + const key = this.columns[item].key; + this.columns[item].visible = !data.includes(key); + } + }, + // 打开显隐列dialog + showColumn() { + this.open = true; }, }, }; </script> +<style lang="scss" scoped> +::v-deep .el-transfer__button { + border-radius: 50%; + padding: 12px; + display: block; + margin-left: 0px; +} +::v-deep .el-transfer__button:first-child { + margin-bottom: 10px; +} +</style> -- Gitblit v1.9.2