Blame view

ant-design-vue-jeecg/src/components/page/GlobalLayout.vue 16 KB
肖超群 authored
1
2
3
4
5
6
7
8
9
10
11
<template>
  <a-layout class="layout" :class="[device]">

    <template v-if="layoutMode === 'sidemenu'">
      <a-drawer
        v-if="device === 'mobile'"
        :wrapClassName="'drawer-sider ' + navTheme"
        placement="left"
        @close="() => this.collapsed = false"
        :closable="false"
        :visible="collapsed"
谭毅彬 authored
12
        width="208px"
肖超群 authored
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
      >
        <side-menu
          mode="inline"
          v-if="device === 'mobile'"
          :menus="menus"
          @menuSelect="menuSelect"
          @updateMenuTitle="handleUpdateMenuTitle"
          :theme="navTheme"
          :collapsed="false"
          :collapsible="true"></side-menu>
      </a-drawer>

      <side-menu
        v-show="device === 'desktop'"
        mode="inline"
        :menus="menus"
        @menuSelect="myMenuSelect"
        @updateMenuTitle="handleUpdateMenuTitle"
        :theme="navTheme"
        :collapsed="collapsed"
        :collapsible="true"></side-menu>
    </template>
    <!-- 下次优化这些代码 -->
    <template v-else>
      <a-drawer
        v-if="device === 'mobile'"
        :wrapClassName="'drawer-sider ' + navTheme"
        placement="left"
        @close="() => this.collapsed = false"
        :closable="false"
        :visible="collapsed"
谭毅彬 authored
44
        width="208px"
肖超群 authored
45
46
47
48
49
50
51
52
53
54
55
56
57
58
      >
        <side-menu
          mode="inline"
          :menus="menus"
          @menuSelect="menuSelect"
          @updateMenuTitle="handleUpdateMenuTitle"
          :theme="navTheme"
          :collapsed="false"
          :collapsible="true"></side-menu>
      </a-drawer>
    </template>

    <a-layout
      :class="[layoutMode, `content-width-${contentWidth}`]"
谭毅彬 authored
59
      :style="{ paddingLeft: fixSiderbar && isDesktop() ? `${sidebarOpened ? 208 : 80}px` : '0' }">
肖超群 authored
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
82
83
84
85
86
87
88
      <!-- layout header -->
      <global-header
        :mode="layoutMode"
        :menus="menus"
        :theme="navTheme"
        :collapsed="collapsed"
        :device="device"
        @toggle="toggle"
        @updateMenuTitle="handleUpdateMenuTitle"
      />

      <!-- layout content -->
      <a-layout-content :style="{ height: '100%', paddingTop: fixedHeader ? '59px' : '0' }">
        <slot></slot>
      </a-layout-content>

      <!-- layout footer -->
      <a-layout-footer style="padding: 0px">
        <global-footer/>
      </a-layout-footer>
    </a-layout>

    <!-- update-start---- author:os_chengtgen -- date:20190830 --  for:issues/463 -编译主题颜色已生效,但还一直转圈,显示主题 正在编译 ---- -->
    <!--<setting-drawer></setting-drawer>-->
    <!-- update-end---- author:os_chengtgen -- date:20190830 --  for:issues/463 -编译主题颜色已生效,但还一直转圈,显示主题 正在编译 ---- -->
  </a-layout>
</template>

<script>
肖超群 authored
89
90
91
92
93
94
95
96
97
98
99
100
101
102
103
104
105
106
107
108
109
110
111
112
113
114
115
116
117
118
119
120
121
122
123
124
125
126
127
128
129
130
131
132
133
134
135
136
137
138
139
140
141
142
143
144
145
146
147
148
149
150
151
152
153
154
import SideMenu from '@/components/menu/SideMenu'
import GlobalHeader from '@/components/page/GlobalHeader'
import GlobalFooter from '@/components/page/GlobalFooter'
import {triggerWindowResizeEvent} from '@/utils/util'
import {mapActions, mapState} from 'vuex'
import {mixin, mixinDevice} from '@/utils/mixin.js'
// update-start---- author:os_chengtgen -- date:20190830 --  for:issues/463 -编译主题颜色已生效,但还一直转圈,显示主题 正在编译 ------
// import SettingDrawer from '@/components/setting/SettingDrawer'
// 注释这个因为在个人设置模块已经加载了SettingDrawer页面
// update-end ---- author:os_chengtgen -- date:20190830 --  for:issues/463 -编译主题颜色已生效,但还一直转圈,显示主题 正在编译 ------

export default {
  name: 'GlobalLayout',
  components: {
    SideMenu,
    GlobalHeader,
    GlobalFooter,
    // update-start---- author:os_chengtgen -- date:20190830 --  for:issues/463 -编译主题颜色已生效,但还一直转圈,显示主题 正在编译 ------
    // // SettingDrawer
    // 注释这个因为在个人设置模块已经加载了SettingDrawer页面
    // update-end ---- author:os_chengtgen -- date:20190830 --  for:issues/463 -编译主题颜色已生效,但还一直转圈,显示主题 正在编译 ------

  },
  mixins: [mixin, mixinDevice],
  data() {
    return {
      collapsed: false,
      activeMenu: {},
      menus: []
    }
  },
  computed: {
    ...mapState({
      // 主路由
      mainRouters: state => state.permission.addRouters,
      // 后台菜单
      permissionMenuList: state => state.user.permissionList
    })
  },
  watch: {
    sidebarOpened(val) {
      this.collapsed = !val
    }
  },
  created() {
    //--update-begin----author:scott---date:20190320------for:根据后台菜单配置,判断是否路由菜单字段,动态选择是否生成路由(为了支持参数URL菜单)------
    //this.menus = this.mainRouters.find((item) => item.path === '/').children;
    this.menus = this.permissionMenuList

    //--update-begin----author:liusq---date:20210223------for:关于测边菜单遮挡内容问题详细说明 #2255
    this.collapsed = !this.sidebarOpened;
    //--update-begin----author:liusq---date:20210223------for:关于测边菜单遮挡内容问题详细说明 #2255

    // 根据后台配置菜单,重新排序加载路由信息
    //console.log('----加载菜单逻辑----')
    //console.log(this.mainRouters)
    //console.log(this.permissionMenuList)
    //console.log('----navTheme------'+this.navTheme)
    //--update-end----author:scott---date:20190320------for:根据后台菜单配置,判断是否路由菜单字段,动态选择是否生成路由(为了支持参数URL菜单)------
  },
  methods: {
    ...mapActions(['setSidebar']),
    toggle() {
      this.collapsed = !this.collapsed
      this.setSidebar(!this.collapsed)
      triggerWindowResizeEvent()
肖超群 authored
155
    },
肖超群 authored
156
157
158
    menuSelect() {
      if (!this.isDesktop()) {
        this.collapsed = false
肖超群 authored
159
160
      }
    },
肖超群 authored
161
162
163
164
165
    //update-begin-author:taoyan date:20190430 for:动态路由title显示配置的菜单title而不是其对应路由的title
    myMenuSelect(value) {
      //此处触发动态路由被点击事件
      this.findMenuBykey(this.menus, value.key)
      this.$emit("dynamicRouterShow", value.key, this.activeMenu.meta.title)
肖超群 authored
166
    },
肖超群 authored
167
168
169
170
171
172
173
    findMenuBykey(menus, key) {
      for (let i of menus) {
        if (i.path == key) {
          this.activeMenu = {...i}
        } else if (i.children && i.children.length > 0) {
          this.findMenuBykey(i.children, key)
        }
肖超群 authored
174
175
      }
    },
肖超群 authored
176
    //update-end-author:taoyan date:20190430 for:动态路由title显示配置的菜单title而不是其对应路由的title
肖超群 authored
177
肖超群 authored
178
179
180
181
182
183
184
    // update-begin-author:sunjianlei date:20210409 for: 修复动态功能测试菜单、带参数菜单标题错误、展开错误的问题
    handleUpdateMenuTitle(value) {
      this.findMenuBykey(this.menus, value.path)
      this.activeMenu.meta.title = value.meta.title
      this.$emit('dynamicRouterShow', value.path, this.activeMenu.meta.title)
    },
    // update-end-author:sunjianlei date:20210409 for: 修复动态功能测试菜单、带参数菜单标题错误、展开错误的问题
肖超群 authored
185
186

  }
肖超群 authored
187
}
肖超群 authored
188
189
190
191

</script>

<style lang="less">
肖超群 authored
192
193
194
body {
  // 打开滚动条固定显示
  overflow-y: scroll;
肖超群 authored
195
肖超群 authored
196
197
  &.colorWeak {
    filter: invert(80%);
肖超群 authored
198
  }
肖超群 authored
199
}
肖超群 authored
200
肖超群 authored
201
202
203
.layout {
  min-height: 100vh !important;
  overflow-x: hidden;
肖超群 authored
204
肖超群 authored
205
  &.mobile {
肖超群 authored
206
肖超群 authored
207
    .ant-layout-content {
肖超群 authored
208
肖超群 authored
209
210
      .content {
        margin: 24px 0 0;
肖超群 authored
211
      }
肖超群 authored
212
    }
肖超群 authored
213
肖超群 authored
214
215
216
217
218
219
220
221
    /**
     * ant-table-wrapper
     * 覆盖的表格手机模式样式,如果想修改在手机上表格最低宽度,可以在这里改动
     */

    .ant-table-wrapper {
      .ant-table-content {
        overflow-y: auto;
肖超群 authored
222
223
      }
肖超群 authored
224
225
226
227
      .ant-table-body {
        // update-begin---author:sunjianlei Date:20220104 for: 【JTC-480】移动端不支持左右拖动,需要注释掉此段代码 ------------
        //min-width: 800px;
        // update-end---author:sunjianlei Date:20220104 for: 【JTC-480】移动端不支持左右拖动,需要注释掉此段代码 ------------
肖超群 authored
228
      }
肖超群 authored
229
    }
肖超群 authored
230
肖超群 authored
231
232
233
234
235
    .sidemenu {
      .ant-header-fixedHeader {

        &.ant-header-side-opened, &.ant-header-side-closed {
          width: 100%
肖超群 authored
236
237
        }
      }
肖超群 authored
238
239
240
241
242
243
244
245
    }

    .topmenu {
      /* 必须为 topmenu  才能启用流式布局 */

      &.content-width-Fluid {
        .header-index-wide {
          margin-left: 0;
肖超群 authored
246
247
248
249
        }
      }
    }
肖超群 authored
250
251
252
253
    .header, .top-nav-header-index {
      .user-wrapper .action {
        padding: 0 12px;
      }
肖超群 authored
254
    }
肖超群 authored
255
  }
肖超群 authored
256
肖超群 authored
257
258
259
  &.ant-layout-has-sider {
    flex-direction: row;
  }
肖超群 authored
260
肖超群 authored
261
  .trigger {
谭毅彬 authored
262
263
    font-size: 25px;
    line-height: 20px;
谭毅彬 authored
264
    padding: 17px 18px 17px 18px;
谭毅彬 authored
265
266
    margin: 0px 0px 0px 0px;
    vertical-align: top;
肖超群 authored
267
268
269
    transition: color 300ms, background 300ms;
    &:hover {
      background: rgba(255, 255, 255, 0.3);
肖超群 authored
270
    }
肖超群 authored
271
  }
肖超群 authored
272
肖超群 authored
273
274
275
276
277
278
279
280
  .topmenu {
    .ant-header-fixedHeader {
      position: fixed;
      top: 0;
      right: 0;
      z-index: 9;
      width: 100%;
      transition: width .2s;
肖超群 authored
281
肖超群 authored
282
283
284
      &.ant-header-side-opened {
        width: 100%;
      }
肖超群 authored
285
肖超群 authored
286
287
      &.ant-header-side-closed {
        width: 100%;
肖超群 authored
288
      }
肖超群 authored
289
    }
肖超群 authored
290
肖超群 authored
291
292
293
294
295
296
    /* 必须为 topmenu  才能启用流式布局 */

    &.content-width-Fluid {
      .header-index-wide {
        max-width: unset;
        margin-left: 24px;
肖超群 authored
297
298
      }
肖超群 authored
299
300
301
      .page-header-index-wide {
        max-width: unset;
      }
肖超群 authored
302
303
    }
肖超群 authored
304
  }
肖超群 authored
305
肖超群 authored
306
307
308
309
310
311
312
313
  .sidemenu {
    .ant-header-fixedHeader {
      position: fixed;
      top: 0;
      right: 0;
      z-index: 9;
      width: 100%;
      transition: width .2s;
肖超群 authored
314
肖超群 authored
315
      &.ant-header-side-opened {
谭毅彬 authored
316
        width: calc(100% - 208px)
肖超群 authored
317
318
      }
肖超群 authored
319
320
321
      &.ant-header-side-closed {
        width: calc(100% - 80px)
      }
肖超群 authored
322
    }
肖超群 authored
323
  }
肖超群 authored
324
肖超群 authored
325
326
327
328
329
330
331
  .header {
    height: 64px;
    padding: 0 12px 0 0;
    background: #fff;
    box-shadow: 0 1px 4px rgba(0, 21, 41, .08);
    position: relative;
  }
肖超群 authored
332
肖超群 authored
333
  .header, .top-nav-header-index {
肖超群 authored
334
肖超群 authored
335
336
337
    .user-wrapper {
      float: right;
      height: 100%;
肖超群 authored
338
肖超群 authored
339
340
341
342
343
      .action {
        cursor: pointer;
        padding: 0 14px;
        display: inline-block;
        transition: all .3s;
肖超群 authored
344
谭毅彬 authored
345
346
        height: 59px;
        line-height: 59px;
肖超群 authored
347
肖超群 authored
348
349
350
        &.action-full {
          height: 100%;
        }
肖超群 authored
351
肖超群 authored
352
353
354
        &:hover {
          background: rgba(255, 255, 255, 0.3);
        }
肖超群 authored
355
肖超群 authored
356
        .avatar {
357
          margin: 18px 0px 17px 0px;
肖超群 authored
358
359
          color: #1890ff;
          background: hsla(0, 0%, 100%, .85);
360
          vertical-align: top;
肖超群 authored
361
        }
肖超群 authored
362
肖超群 authored
363
364
365
366
367
368
369
        .icon {
          font-size: 16px;
          padding: 4px;
        }

        .anticon {
          color: inherit;
肖超群 authored
370
371
        }
      }
肖超群 authored
372
    }
肖超群 authored
373
肖超群 authored
374
375
    &.dark {
      .user-wrapper {
肖超群 authored
376
肖超群 authored
377
378
        .action {
          color: black;
肖超群 authored
379
肖超群 authored
380
381
382
          &:hover {
            background: rgba(0, 0, 0, 0.05);
          }
肖超群 authored
383
肖超群 authored
384
385
          .anticon {
            color: inherit;
肖超群 authored
386
387
388
389
          }
        }
      }
    }
肖超群 authored
390
  }
肖超群 authored
391
肖超群 authored
392
393
  &.mobile {
    .top-nav-header-index {
肖超群 authored
394
肖超群 authored
395
      .header-index-wide {
肖超群 authored
396
肖超群 authored
397
        .header-index-left {
肖超群 authored
398
肖超群 authored
399
400
401
402
          .trigger {
            color: rgba(255, 255, 255, 0.85);
            padding: 0 12px;
          }
肖超群 authored
403
肖超群 authored
404
405
          .logo.top-nav-header {
            text-align: center;
谭毅彬 authored
406
407
            width: 59px;
            line-height: 59px;
肖超群 authored
408
409
          }
        }
肖超群 authored
410
      }
肖超群 authored
411
肖超群 authored
412
413
414
      .user-wrapper .action .avatar {
        margin: 20px 0;
      }
肖超群 authored
415
肖超群 authored
416
      &.light {
肖超群 authored
417
肖超群 authored
418
        .header-index-wide {
肖超群 authored
419
肖超群 authored
420
421
422
          .header-index-left {
            .trigger {
              color: rgba(0, 0, 0, 0.65);
肖超群 authored
423
424
425
            }
          }
        }
肖超群 authored
426
427

        //
肖超群 authored
428
429
      }
    }
肖超群 authored
430
  }
肖超群 authored
431
肖超群 authored
432
433
434
  &.tablet {
    // overflow: hidden; text-overflow:ellipsis; white-space: nowrap;
    .top-nav-header-index {
肖超群 authored
435
肖超群 authored
436
      .header-index-wide {
肖超群 authored
437
肖超群 authored
438
439
440
441
442
        .header-index-left {
          .logo > a {
            overflow: hidden;
            text-overflow: ellipsis;
            white-space: nowrap;
肖超群 authored
443
444
445
446
447
          }
        }
      }
    }
肖超群 authored
448
  }
肖超群 authored
449
肖超群 authored
450
451
452
453
454
455
456
457
  .top-nav-header-index {
    box-shadow: 0 1px 4px rgba(0, 21, 41, .08);
    position: relative;
    transition: background .3s, width .2s;

    .header-index-wide {
      width: 100%;
      margin: auto;
谭毅彬 authored
458
      padding: 0 12px 0 0;
肖超群 authored
459
460
461
462
463
      display: flex;
      height: 59px;

      .ant-menu.ant-menu-horizontal {
        border: none;
谭毅彬 authored
464
465
        height: 59px;
        line-height: 59px;
肖超群 authored
466
467
468
469
      }

      .header-index-left {
        flex: 1 1;
肖超群 authored
470
471
        display: flex;
肖超群 authored
472
        .logo.top-nav-header {
谭毅彬 authored
473
          width: 208px;
谭毅彬 authored
474
          height: 59px;
谭毅彬 authored
475
476
          padding: 0 10px;
          text-align: center;
肖超群 authored
477
          position: relative;
谭毅彬 authored
478
          line-height: 54px;
肖超群 authored
479
480
          transition: all .3s;
          overflow: hidden;
肖超群 authored
481
肖超群 authored
482
483
484
          img {
            display: inline-block;
            vertical-align: middle;
谭毅彬 authored
485
            height: 20px;
肖超群 authored
486
          }
肖超群 authored
487
肖超群 authored
488
489
490
491
492
493
494
          h1 {
            color: #fff;
            display: inline-block;
            vertical-align: top;
            font-size: 16px;
            margin: 0 0 0 12px;
            font-weight: 400;
肖超群 authored
495
496
          }
        }
肖超群 authored
497
      }
肖超群 authored
498
肖超群 authored
499
500
501
502
503
504
505
      .header-index-right {
        float: right;
        height: 59px;
        overflow: hidden;

        .action:hover {
          background-color: rgba(0, 0, 0, 0.05);
肖超群 authored
506
507
        }
      }
肖超群 authored
508
    }
肖超群 authored
509
肖超群 authored
510
511
    &.light {
      background-color: #fff;
肖超群 authored
512
肖超群 authored
513
514
515
516
517
      .header-index-wide {
        .header-index-left {
          .logo {
            h1 {
              color: #002140;
肖超群 authored
518
519
520
521
            }
          }
        }
      }
肖超群 authored
522
    }
肖超群 authored
523
肖超群 authored
524
    &.dark {
肖超群 authored
525
肖超群 authored
526
      .user-wrapper {
肖超群 authored
527
肖超群 authored
528
529
        .action {
          color: white;
肖超群 authored
530
肖超群 authored
531
532
          &:hover {
            background: rgba(255, 255, 255, 0.3);
肖超群 authored
533
534
535
536
          }
        }
      }
肖超群 authored
537
538
539
      .header-index-wide .header-index-left .trigger:hover {
        background: rgba(255, 255, 255, 0.3);
      }
肖超群 authored
540
541
    }
肖超群 authored
542
  }
肖超群 authored
543
肖超群 authored
544
545
546
547
548
  // 内容区
  .layout-content {
    margin: 24px 24px 0px;
    height: 64px;
    padding: 0 12px 0 0;
肖超群 authored
549
550
  }
肖超群 authored
551
552
553
554
555
556
}

.topmenu {
  .page-header-index-wide {
    margin: 0 auto;
    width: 100%;
肖超群 authored
557
  }
肖超群 authored
558
}
肖超群 authored
559
肖超群 authored
560
561
562
563
564
// drawer-sider 自定义
.ant-drawer.drawer-sider {
  .sider {
    box-shadow: none;
  }
肖超群 authored
565
肖超群 authored
566
567
568
  &.dark {
    .ant-drawer-content {
      background-color: rgb(0, 21, 41);
肖超群 authored
569
    }
肖超群 authored
570
571
572
573
  }

  &.light {
    box-shadow: none;
肖超群 authored
574
肖超群 authored
575
576
    .ant-drawer-content {
      background-color: #fff;
肖超群 authored
577
578
579
    }
  }
肖超群 authored
580
581
582
583
  .ant-drawer-body {
    padding: 0
  }
}
肖超群 authored
584
肖超群 authored
585
586
587
588
589
// 菜单样式
.sider {
  box-shadow: 2px 116px 6px 0 rgba(0, 21, 41, .35);
  position: relative;
  z-index: 10;
肖超群 authored
590
肖超群 authored
591
592
593
594
  &.ant-fixed-sidemenu {
    position: fixed;
    height: 100%;
  }
肖超群 authored
595
肖超群 authored
596
597
598
599
600
601
602
603
  .logo {
    height: 64px;
    position: relative;
    line-height: 64px;
    -webkit-transition: all .3s;
    transition: all .3s;
    background: #002140;
    overflow: hidden;
谭毅彬 authored
604
    text-align: center;
肖超群 authored
605
606
607
608
609

    img, h1 {
      display: inline-block;
      vertical-align: middle;
    }
肖超群 authored
610
肖超群 authored
611
    img {
谭毅彬 authored
612
      height: 20px;
谭毅彬 authored
613
      vertical-align: middle;
肖超群 authored
614
615
    }
肖超群 authored
616
617
618
619
620
621
622
623
    h1 {
      color: #fff;
      font-size: 18px;
      margin: 0 0 0 8px;
      font-family: "Chinese Quote", -apple-system, BlinkMacSystemFont, "Segoe UI", "PingFang SC", "Hiragino Sans GB", "Microsoft YaHei", "Helvetica Neue", Helvetica, Arial, sans-serif, "Apple Color Emoji", "Segoe UI Emoji", "Segoe UI Symbol";
      font-weight: 600;
    }
  }
肖超群 authored
624
肖超群 authored
625
626
627
  &.light {
    background-color: #fff;
    box-shadow: 2px 116px 8px 0 rgba(29, 35, 41, 0.05);
肖超群 authored
628
肖超群 authored
629
630
631
    .logo {
      background: #fff;
      box-shadow: 1px 1px 0 0 #e8e8e8;
肖超群 authored
632
肖超群 authored
633
634
      h1 {
        color: unset;
肖超群 authored
635
636
637
      }
    }
肖超群 authored
638
639
640
    .ant-menu-light {
      border-right-color: transparent;
    }
肖超群 authored
641
642
  }
肖超群 authored
643
}
肖超群 authored
644
肖超群 authored
645
646
647
// 外置的样式控制
.user-dropdown-menu-wrapper.ant-dropdown-menu {
  padding: 4px 0;
肖超群 authored
648
肖超群 authored
649
  .ant-dropdown-menu-item {
650
    width: auto;
肖超群 authored
651
652
  }
肖超群 authored
653
654
655
656
657
658
  .ant-dropdown-menu-item > .anticon:first-child,
  .ant-dropdown-menu-item > a > .anticon:first-child,
  .ant-dropdown-menu-submenu-title > .anticon:first-child
  .ant-dropdown-menu-submenu-title > a > .anticon:first-child {
    min-width: 12px;
    margin-right: 8px;
肖超群 authored
659
660
  }
肖超群 authored
661
}
肖超群 authored
662
肖超群 authored
663
664
665
666
// 数据列表 样式
.table-alert {
  margin-bottom: 16px;
}
肖超群 authored
667
肖超群 authored
668
.table-page-search-wrapper {
肖超群 authored
669
肖超群 authored
670
  .ant-form-inline {
肖超群 authored
671
肖超群 authored
672
673
674
675
676
677
678
679
680
    .ant-form-item {
      display: flex;
      margin-bottom: 24px;
      margin-right: 0;

      .ant-form-item-control-wrapper {
        flex: 1 1;
        display: inline-block;
        vertical-align: middle;
肖超群 authored
681
682
      }
肖超群 authored
683
684
685
686
687
688
689
690
691
692
      > .ant-form-item-label {
        line-height: 32px;
        padding-right: 8px;
        width: auto;
      }

      .ant-form-item-control {
        height: 32px;
        line-height: 32px;
      }
肖超群 authored
693
    }
肖超群 authored
694
  }
肖超群 authored
695
肖超群 authored
696
697
698
699
  .table-page-search-submitButtons {
    display: block;
    margin-bottom: 24px;
    white-space: nowrap;
肖超群 authored
700
701
  }
肖超群 authored
702
}
肖超群 authored
703
肖超群 authored
704
.content {
肖超群 authored
705
肖超群 authored
706
707
708
709
710
  .table-operator {
    margin-bottom: 18px;

    button {
      margin-right: 8px;
肖超群 authored
711
712
    }
  }
肖超群 authored
713
}
肖超群 authored
714
</style>