| | |
|---|
| | | <template>
|
|---|
| | | <div class="top-right-btn">
|
|---|
| | | <div class="top-right-btn" :style="style">
|
|---|
| | | <el-row>
|
|---|
| | | <el-tooltip class="item" effect="dark" :content="showSearch ? '隐藏搜索' : '显示搜索'" placement="top">
|
|---|
| | | <el-tooltip class="item" effect="dark" :content="showSearch ? '隐藏搜索' : '显示搜索'" placement="top" v-if="search">
|
|---|
| | | <el-button size="mini" circle icon="el-icon-search" @click="toggleSearch()" />
|
|---|
| | | </el-tooltip>
|
|---|
| | | <el-tooltip class="item" effect="dark" content="刷新" placement="top">
|
|---|
| | |
|---|
| | | columns: {
|
|---|
| | | type: Array,
|
|---|
| | | },
|
|---|
| | | search: {
|
|---|
| | | type: Boolean,
|
|---|
| | | default: true,
|
|---|
| | | },
|
|---|
| | | gutter: {
|
|---|
| | | type: Number,
|
|---|
| | | default: 10,
|
|---|
| | | },
|
|---|
| | | },
|
|---|
| | |
|
|---|
| | | computed: {
|
|---|
| | | style() {
|
|---|
| | | const ret = {};
|
|---|
| | | if (this.gutter) {
|
|---|
| | | ret.marginRight = `${this.gutter / 2}px`;
|
|---|
| | | }
|
|---|
| | | return ret;
|
|---|
| | | }
|
|---|
| | | },
|
|---|
| | | created() {
|
|---|
| | | // 显隐列初始默认隐藏列
|
|---|
| | | for (let item in this.columns) {
|
|---|
| | | if (this.columns[item].visible === false) {
|
|---|
| | | this.value.push(parseInt(item));
|
|---|
| | | }
|
|---|
| | | }
|
|---|
| | | },
|
|---|
| | | methods: {
|
|---|
| | | // 搜索
|
|---|
| | | toggleSearch() {
|
|---|
| | |
|---|
| | | },
|
|---|
| | | // 右侧列表元素变化
|
|---|
| | | dataChange(data) {
|
|---|
| | | for (var item in this.columns) {
|
|---|
| | | for (let item in this.columns) {
|
|---|
| | | const key = this.columns[item].key;
|
|---|
| | | this.columns[item].visible = !data.includes(key);
|
|---|
| | | }
|
|---|
