Explorar o código

优化表格上右侧工具条(搜索按钮显隐&右侧样式凸出)

RuoYi %!s(int64=3) %!d(string=hai) anos
pai
achega
67a6841043
Modificáronse 1 ficheiros con 19 adicións e 2 borrados
  1. 19 2
      ruoyi-ui/src/components/RightToolbar/index.vue

+ 19 - 2
ruoyi-ui/src/components/RightToolbar/index.vue

@@ -1,7 +1,7 @@
1
 <template>
1
 <template>
2
-  <div class="top-right-btn">
2
+  <div class="top-right-btn" :style="style">
3
     <el-row>
3
     <el-row>
4
-      <el-tooltip class="item" effect="dark" :content="showSearch ? '隐藏搜索' : '显示搜索'" placement="top">
4
+      <el-tooltip class="item" effect="dark" :content="showSearch ? '隐藏搜索' : '显示搜索'" placement="top" v-if="search">
5
         <el-button size="mini" circle icon="el-icon-search" @click="toggleSearch()" />
5
         <el-button size="mini" circle icon="el-icon-search" @click="toggleSearch()" />
6
       </el-tooltip>
6
       </el-tooltip>
7
       <el-tooltip class="item" effect="dark" content="刷新" placement="top">
7
       <el-tooltip class="item" effect="dark" content="刷新" placement="top">
@@ -42,6 +42,23 @@ export default {
42
     columns: {
42
     columns: {
43
       type: Array,
43
       type: Array,
44
     },
44
     },
45
+    search: {
46
+      type: Boolean,
47
+      default: true,
48
+    },
49
+    gutter: {
50
+      type: Number,
51
+      default: 10,
52
+    },
53
+  },
54
+  computed: {
55
+    style() {
56
+      const ret = {};
57
+      if (this.gutter) {
58
+        ret.marginRight = `${this.gutter / 2}px`;
59
+      }
60
+      return ret;
61
+    }
45
   },
62
   },
46
   created() {
63
   created() {
47
     // 显隐列初始默认隐藏列
64
     // 显隐列初始默认隐藏列