Procházet zdrojové kódy

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

RuoYi před 3 roky
rodič
revize
67a6841043
1 změnil soubory, kde provedl 19 přidání a 2 odebrání
  1. 19 2
      ruoyi-ui/src/components/RightToolbar/index.vue

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

@@ -1,7 +1,7 @@
1 1
 <template>
2
-  <div class="top-right-btn">
2
+  <div class="top-right-btn" :style="style">
3 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 5
         <el-button size="mini" circle icon="el-icon-search" @click="toggleSearch()" />
6 6
       </el-tooltip>
7 7
       <el-tooltip class="item" effect="dark" content="刷新" placement="top">
@@ -42,6 +42,23 @@ export default {
42 42
     columns: {
43 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 63
   created() {
47 64
     // 显隐列初始默认隐藏列