[Update] 优化布局

This commit is contained in:
ibuler 2020-03-25 13:57:08 +08:00
parent 6c237984ca
commit ae4ce899f3
22 changed files with 413 additions and 275 deletions

14
alias.config.js Normal file
View File

@ -0,0 +1,14 @@
/**
* 由于 Vue CLI 3 不再使用传统的 webpack 配置文件 WebStorm 无法识别别名
* 本文件对项目无任何作用仅作为 WebStorm 识别别名用
* 进入 WebStorm preferences -> Language & Framework -> JavaScript -> Webpack选择这个文件即可
* */
const resolve = dir => require('path').join(__dirname, dir);
module.exports = {
resolve: {
alias: {
'@': resolve('src')
}
}
};

Binary file not shown.

Before

Width:  |  Height:  |  Size: 21 KiB

After

Width:  |  Height:  |  Size: 12 KiB

View File

@ -1,7 +1,7 @@
<template>
<div style="">
<el-button type="primary" class="hamburger" size="mini" @click="toggleClick">
<i class="fa fa-bars" style="color: white; margin-right: 0"></i>
<el-button type="primary" class="hamburger" size="mini" @click="toggleClick">
<i class="fa fa-bars" style="color: white; margin-right: 0" />
</el-button>
</div>
</template>

View File

@ -25,6 +25,7 @@ const cn = {
'Users': '用户管理',
'UserList': '用户列表',
'UserGroupList': '用户组',
'UserGroupDetail': '用户组详情',
'Assets': '资产管理',
'AssetList': '资产列表',
'DomainList': '网关列表',

View File

@ -1,12 +1,30 @@
<template>
<div class="backplayground">
<div class="title">
<div class="title-context">
{{ title }}
<!-- <div class="ibox">-->
<!-- <div class="ibox-title">-->
<!-- <h5>{{ title }}</h5>-->
<!-- <div class="ibox-tools">-->
<!-- <a class="collapse-link">-->
<!-- <i class="fa fa-chevron-up"></i>-->
<!-- </a>-->
<!-- <a class="dropdown-toggle" data-toggle="dropdown" href="#">-->
<!-- <i class="fa fa-wrench"></i>-->
<!-- </a>-->
<!-- <a class="close-link">-->
<!-- <i class="fa fa-times"></i>-->
<!-- </a>-->
<!-- </div>-->
<!-- </div>-->
<!-- <div class="ibox-content">-->
<!-- <slot/>-->
<!-- </div>-->
<!-- </div>-->
<el-card class="box-card">
<div slot="header" class="clearfix">
<span>{{ title }}</span>
<el-button style="float: right; padding: 3px 0" type="text">操作按钮</el-button>
</div>
<slot />
</div>
</div>
</el-card>
</template>
<script>
@ -17,31 +35,65 @@ export default {
default: () => { return 'Title' }
}
}
}
</script>
<style lang="less" scoped>
.backplayground{
.ibox {
height: 100%;
clear: both;
padding: 0;
background-color: #ffffff;
margin-left:8px;
margin-right:8px;
margin-top:1%;
margin-bottom:1%;
}
.title{
margin-top:1%;
margin-bottom:calc(1% + 35px);
background-color: #fff;
.title-context{
text-align: left;
font-size: 14px;
padding-top:15px;
padding-left:12px;
padding-bottom: 15px;
font-weight: 600;
border-bottom: 1px solid #e7eaec !important;
margin: 10px 20px;
}
.ibox-title {
background-color: #ffffff;
border-color: #e7eaec;
border-image: none;
border-style: solid solid none;
border-width: 3px 0 0;
color: rgb(103, 106, 108);
margin-bottom: 0;
padding: 14px 15px 7px;
min-height: 48px;
}
.ibox-title h5 {
display: inline-block;
font-size: 14px;
margin: 0 0 7px;
padding: 0;
text-overflow: ellipsis;
float: left;
}
.ibox-tools a {
cursor: pointer;
margin-left: 5px;
color: #c4c4c4;
}
.ibox-tools {
display: block;
float: none;
margin-top: 0;
position: relative;
padding: 0;
text-align: right;
}
.fa {
font-size: 14px;
}
.ibox-content {
background-color: #ffffff;
color: inherit;
padding: 15px 20px 20px 20px;
border-color: #e7eaec;
border-image: none;
border-style: solid solid none;
border-width: 1px 0;
}
}
</style>

View File

@ -0,0 +1,85 @@
<template>
<el-card class="ibox" shadow="never">
<div slot="header" class="clearfix ibox-title">
<h5>{{ title }}</h5>
<div class="ibox-tools">
<a class="collapse-link">
<i class="fa fa-chevron-up" />
</a>
<a class="dropdown-toggle" data-toggle="dropdown" href="#">
<i class="fa fa-wrench" />
</a>
<a class="close-link">
<i class="fa fa-times" />
</a>
</div>
</div>
<slot />
</el-card>
</template>
<script>
export default {
name: 'IBox',
props: {
title: {
type: String,
default: () => { return 'Title' }
}
}
}
</script>
<style scoped>
.ibox {
height: 100%;
clear: both;
padding: 0;
background-color: #ffffff;
}
.ibox >>> .el-card__header{
background-color: #ffffff;
border-color: #e7eaec;
border-image: none;
/*border-style: solid solid none;*/
color: rgb(103, 106, 108);
margin-bottom: 0;
padding: 14px 15px 7px;
min-height: 48px;
}
.ibox-title h5 {
display: inline-block;
font-size: 14px;
margin: 0 0 7px;
padding: 0;
text-overflow: ellipsis;
float: left;
}
.ibox-tools a {
cursor: pointer;
margin-left: 5px;
color: #c4c4c4;
}
.ibox-tools {
display: block;
float: none;
margin-top: 0;
position: relative;
padding: 0;
text-align: right;
}
.fa {
font-size: 14px;
}
.ibox >>> .el-card__body {
background-color: #ffffff;
padding: 15px 20px 20px 20px;
color: inherit;
}
</style>

View File

@ -1,16 +1,25 @@
<template>
<transition name="sidebarLogoFade">
<div v-if="!isCollapse && orglist.length>1" style="display: block; background-color: transparent; padding: 14px 20px 14px 20px">
<el-dropdown size="medium">
<span class="el-dropdown-link" style="color: rgb(167, 177, 194);">
<i class="fa fa-bookmark" style="width: 14px;margin-right: 12px; " />
{{ currentorg.name }}<i class="el-icon-arrow-down el-icon--right" />
</span>
<el-dropdown-menu slot="dropdown">
<el-dropdown-item v-for="(option) in orglist" :key="option.id" @click.native="changeOrg(option.name, option.id)">{{ option.name }}</el-dropdown-item>
</el-dropdown-menu>
</el-dropdown>
</div>
<el-select
class="org-didi"
v-if="!isCollapse && userAdminOrgList.length>1"
:value="currentOrg.id"
filterable
placeholder="请选择"
@change="changeOrg">
<template slot="prefix">
<i class="fa fa-bookmark"></i>
</template>
<el-option
v-for="item in userAdminOrgList"
:key="item.id"
selected="item.id == currentOrg.id"
:label="item.name"
:value="item.id">
</el-option>
</el-select>
</transition>
</template>
@ -25,17 +34,15 @@ export default {
},
computed: {
...mapGetters([
'currentorg',
'orglist'
'currentOrg',
'userAdminOrgList'
])
},
methods: {
changeOrg(x, y) {
console.log(x, y)
changeOrg(orgId) {
console.log('Change to org: ', orgId)
this.$store.dispatch('user/setCurrentOrg', {
name: x,
id: y
id: orgId
})
}
}
@ -43,27 +50,28 @@ export default {
</script>
<style lang="scss" scoped>
.sidebarLogoFade-enter-active {
transition: opacity 1.5s;
}
.org-didi {
padding: 0 10px 0 18px;
transition: opacity 0s;
}
.sidebarLogoFade-enter,
.sidebarLogoFade-leave-to {
opacity: 0;
}
.el-dropdown-menu{
width: 200px;
.org-didi >>> input.el-input__inner {
background: none;
border: none;
color: #8095a8;
}
.el-dropdown-menu >>> .popper__arrow{
display: none;
.org-didi >>> input.el-input__inner::placeholder {
opacity: 0.2;
}
.el-dropdown{
width: 100%;
.org-didi >>> .el-input__prefix {
line-height: 40px;
/*margin: auto 5px;*/
}
.el-icon-arrow-down{
position: absolute;
top: 50%;
right: 0px;
margin-top: -7px;
.sidebarLogoFade-enter,
.sidebarLogoFade-leave-to {
opacity: 0;
}
</style>

View File

@ -1,6 +1,9 @@
<template>
<div :class="{'has-logo':showLogo}">
<logo v-if="showLogo" :collapse="isCollapse" />
<div class="nav-header">
<logo v-if="showLogo" :collapse="isCollapse" />
<Organization :is-collapse="isCollapse" />
</div>
<el-scrollbar wrap-class="scrollbar-wrapper">
<el-menu
:default-active="activeMenu"
@ -13,7 +16,6 @@
:collapse-transition="false"
mode="vertical"
>
<Organization :is-collapse="isCollapse" />
<sidebar-item v-for="route in permission_routes" :key="route.path" :item="route" :base-path="route.path" />
</el-menu>
</el-scrollbar>
@ -39,10 +41,8 @@ export default {
const { meta, path } = route
// if set path, the sidebar will highlight the path you set
if (meta.activeMenu) {
console.log(meta.activeMenu)
return meta.activeMenu
}
console.log(path)
return path
},
showLogo() {
@ -57,3 +57,8 @@ export default {
}
}
</script>
<style scoped>
.nav-header {
background-image: url('~@/assets/img/header-profile.png');
}
</style>

View File

@ -12,7 +12,7 @@
@click.middle.native="!isAffix(tag)?closeSelectedTag(tag):''"
@contextmenu.prevent.native="openMenu(tag,$event)"
>
{{ tag.title }}
{{ $t('route.' + tag.title) }}
<span
v-if="!isAffix(tag)"
class="el-icon-close"
@ -203,6 +203,7 @@ export default {
.tags-view-container {
height: 34px;
width: 100%;
margin-top: 5px;
background: #fff;
border-bottom: 1px solid #d8dce5;
box-shadow: 0 1px 3px 0 rgba(0, 0, 0, 0.12), 0 0 3px 0 rgba(0, 0, 0, 0.04);

View File

@ -0,0 +1,17 @@
<template>
<div class="wrapper-content">
<slot />
</div>
</template>
<script>
export default {
name: 'WrapperContent'
}
</script>
<style scoped>
.wrapper-content {
padding: 10px 20px 10px;
}
</style>

View File

@ -5,3 +5,5 @@ export { default as BackPlayground } from './BackPlayground'
export { default as ListTables } from './ListTables'
export { default as TagsView } from './TagsView'
export { default as Footer } from './Footer'
export { default as WrapperContent } from './WrapperContent'
export { default as IBox } from './IBox'

View File

@ -38,6 +38,7 @@ export default {
return this.$store.state.settings.fixedHeader
},
needTagsView() {
return false
return this.$store.state.settings.tagsView
},
classObj() {

View File

@ -16,7 +16,6 @@ import i18n from './i18n/i18n'
import '@/icons' // icon
import '@/permission' // permission control
/**
* If you don't want to use mock-server
* you want to use MockJs for mock api
@ -43,7 +42,7 @@ import {
Message,
MessageBox
} from 'element-ui'
import service from '@/utils/request';
import service from '@/utils/request'
import {
Button,
@ -52,7 +51,7 @@ import {
FormItem,
Pagination,
Table,
TableColumn,
TableColumn
} from 'element-ui'
Vue.use(Button)

View File

@ -5,8 +5,8 @@ const getters = {
avatar: state => state.user.avatar,
name: state => state.user.name,
roles: state => state.user.roles,
currentorg: state => state.user.currentOrg,
orglist: state => state.user.orgs,
currentOrg: state => state.user.currentOrg,
userAdminOrgList: state => state.user.orgs,
permission_routes: state => state.permission.routes,
visitedViews: state => state.tagsView.visitedViews,
cachedViews: state => state.tagsView.cachedViews

View File

@ -10,7 +10,7 @@
body {
height: 100%;
-moz-osx-font-smoothing: grayscale;
-webkit-font-smoothing: auto;
//-webkit-font-smoothing: auto;
text-rendering: optimizeLegibility;
font-family: Helvetica Neue, Helvetica, PingFang SC, Hiragino Sans GB, Microsoft YaHei, Arial, sans-serif;
}
@ -71,3 +71,14 @@ td .el-button.el-button--mini {
padding: 1px 5px;
line-height: 1.5;
}
.el-tabs__item.is-active, .el-tabs--border-card>.el-tabs__header .el-tabs__item.is-active {
color: #555555;
}
.el-tabs--border-card>.el-tabs__header .el-tabs__item:not(.is-disabled):hover {
color: #555555;
}
.main-container {
background-color: #f3f3f4;
}

View File

@ -14,7 +14,7 @@
.el-submenu .el-menu-item {
height: 35px;
line-height: 35px;
line-height: 2.1;
padding: 0 52px;
min-width: 200px;
}

View File

@ -4,6 +4,7 @@ $menuActiveText: white;
$menuTextWeight: 600;
$subMenuActiveText: #f4f4f5; //https://github.com/ElemeFE/element/issues/12951
//$menuBg: red;
$menuBg: #2f4050;
$menuHover: #293846;

View File

@ -1,7 +1,7 @@
import Cookies from 'js-cookie'
const TokenKey = 'csrftoken'
const CurrentOrg = 'currentorg'
const CurrentOrg = 'currentOrg'
export function getToken() {
return Cookies.get(TokenKey)

View File

@ -1,21 +1,21 @@
<template>
<el-row class="content-main">
<el-col :span="16">
<el-col :span="24">
<tab :group="data" />
</el-col>
<el-col :span="8" style="background-color: #f3f3f4;">
<card />
</el-col>
<!-- <el-col :span="8" style="background-color: #f3f3f4;">-->
<!-- <card />-->
<!-- </el-col>-->
</el-row>
</template>
<script>
import { Card, Tab } from './components'
import { Tab } from './components'
import { getUserGroup } from '@/api/user'
export default {
components: {
Tab,
Card
Tab
// Card
},
data() {
return {

View File

@ -1,84 +1,88 @@
<template>
<BackPlayground :title="$t('users.usergrouplist')">
<ListTables
:tablebutton="$t('users.createusergroup')"
tableroute="UserGroupEdit"
@SizeChange="handleSizeChange"
@CurrentChange="handleCurrentChange"
>
<el-table
v-loading="listLoading"
:data="tableData"
stripe
border
class="userTable"
<WrapperContent>
<IBox :title="$t('users.usergrouplist')">
<ListTables
:tablebutton="$t('users.createusergroup')"
tableroute="UserGroupEdit"
@SizeChange="handleSizeChange"
@CurrentChange="handleCurrentChange"
>
<el-table-column
type="selection"
width="55"
align="center"
header-align="center"
/>
<el-table-column
:label="this.$t('usergroup.name')"
sortable
align="center"
header-align="center"
<el-table
v-loading="listLoading"
:data="tableData"
stripe
border
class="userTable"
>
<template slot-scope="scope">
<el-button type="text" size="small" style="font-size:14px" @click="handleDetail(scope.$index, scope.row)">{{ scope.row.name }}</el-button>
</template>
</el-table-column>
<el-table-column
:label="this.$t('usergroup.user')"
align="center"
header-align="center"
>
<template slot-scope="scope">
<span>{{ scope.row.users_amount }}</span>
</template>
</el-table-column>
<el-table-column
:label="this.$t('usergroup.comment')"
align="center"
sortable
header-align="center"
>
<template slot-scope="scope">
<span>{{ scope.row.comment }}</span>
</template>
</el-table-column>
<el-table-column
:label="this.$t('usergroup.action')"
align="center"
header-align="center"
>
<template slot-scope="scope">
<el-button
size="mini"
type="primary"
@click="handleEdit(scope.$index, scope.row)"
>{{ $t('usergroup.update') }}</el-button>
<el-button
size="mini"
type="danger"
@click="handleDelete(scope.$index, scope.row)"
>{{ $t('usergroup.delete') }}</el-button>
</template>
</el-table-column>
</el-table>
</ListTables>
</BackPlayground>
<el-table-column
type="selection"
width="55"
align="center"
header-align="center"
/>
<el-table-column
:label="this.$t('usergroup.name')"
sortable
align="center"
header-align="center"
>
<template slot-scope="scope">
<el-button type="text" size="small" style="font-size:14px" @click="handleDetail(scope.$index, scope.row)">{{ scope.row.name }}</el-button>
</template>
</el-table-column>
<el-table-column
:label="this.$t('usergroup.user')"
align="center"
header-align="center"
>
<template slot-scope="scope">
<span>{{ scope.row.users_amount }}</span>
</template>
</el-table-column>
<el-table-column
:label="this.$t('usergroup.comment')"
align="center"
sortable
header-align="center"
>
<template slot-scope="scope">
<span>{{ scope.row.comment }}</span>
</template>
</el-table-column>
<el-table-column
:label="this.$t('usergroup.action')"
align="center"
header-align="center"
>
<template slot-scope="scope">
<el-button
size="mini"
type="primary"
@click="handleEdit(scope.$index, scope.row)"
>{{ $t('usergroup.update') }}</el-button>
<el-button
size="mini"
type="danger"
@click="handleDelete(scope.$index, scope.row)"
>{{ $t('usergroup.delete') }}</el-button>
</template>
</el-table-column>
</el-table>
</ListTables>
</IBox>
</WrapperContent>
</template>
<script>
import { ListTables, BackPlayground } from '@/layout/components'
import { ListTables, BackPlayground, WrapperContent, IBox } from '@/layout/components'
import { getUserGroupList } from '@/api/user'
import Tables from '@/layout/mixin/ListTables'
export default {
components: {
BackPlayground,
ListTables
ListTables,
WrapperContent,
IBox
},
mixins: [Tables],
data() {

View File

@ -1,84 +1,16 @@
<template>
<BackPlayground :title="$t('route.UserList')">
<!-- <ListTables-->
<!-- :tablebutton="$t('users.createUser')"-->
<!-- tableroute="UserEdit"-->
<!-- @SizeChange="handleSizeChange"-->
<!-- @CurrentChange="handleCurrentChange"-->
<!-- @MutiSelectChange="handleMutiSelectChange"-->
<!-- >-->
<!-- <el-table-->
<!-- v-loading="listLoading"-->
<!-- :data="tableData"-->
<!-- stripe-->
<!-- border-->
<!-- fit-->
<!-- class="userTable"-->
<!-- >-->
<!-- <el-table-column-->
<!-- type="selection"-->
<!-- width="55"-->
<!-- align="center"-->
<!-- header-align="center"-->
<!-- />-->
<!-- <el-table-column-->
<!-- :label="this.$t('common.name')"-->
<!-- sortable-->
<!-- align="center"-->
<!-- header-align="center"-->
<!-- >-->
<!-- <template slot-scope="scope">-->
<!-- <el-link type="success" size="small" style="font-size:14px" @click="handleDetail(scope.$index, scope.row)">{{ scope.row.name }}</el-link>-->
<!-- </template>-->
<!-- </el-table-column>-->
<!-- <el-table-column-->
<!-- :label="this.$t('common.username')"-->
<!-- prop="username"-->
<!-- align="center"-->
<!-- sortable-->
<!-- header-align="center"-->
<!-- />-->
<!-- <el-table-column-->
<!-- :label="this.$t('common.role')"-->
<!-- prop="role_display"-->
<!-- sortable-->
<!-- align="center"-->
<!-- header-align="center"-->
<!-- />-->
<!-- <el-table-column-->
<!-- :label="this.$t('common.action')"-->
<!-- align="center"-->
<!-- width="150px"-->
<!-- class="table-action"-->
<!-- header-align="center"-->
<!-- >-->
<!-- <template slot-scope="scope">-->
<!-- <el-button-->
<!-- size="mini"-->
<!-- type="primary"-->
<!-- @click="handleEdit(scope.$index, scope.row)"-->
<!-- >{{ $t('action.update') }}</el-button>-->
<!-- <el-button-->
<!-- size="mini"-->
<!-- type="danger"-->
<!-- @click="handleDelete(scope.$index, scope.row)"-->
<!-- >{{ $t('action.delete') }}</el-button>-->
<!-- </template>-->
<!-- </el-table-column>-->
<!-- </el-table>-->
<el-data-table v-bind="tableConfig"></el-data-table>
<!-- </ListTables>-->
<el-data-table v-bind="tableConfig" />
</BackPlayground>
</template>
<script>
import { ListTables, BackPlayground } from '@/layout/components'
import { BackPlayground } from '@/layout/components'
import { getUserList } from '@/api/user'
import Tables from '@/layout/mixin/ListTables'
export default {
components: {
BackPlayground,
ListTables
BackPlayground
},
mixins: [Tables],
data() {
@ -99,14 +31,14 @@ export default {
transform: v => v && v.trim()
}
],
el: {placeholder: '请输入用户名'}
el: { placeholder: '请输入用户名' }
},
{
type: 'select',
id: 'type',
label: '账户类型',
rules: [{required: true, message: '请选择账户类型', trigger: 'blur'}],
options: ['Organization', 'User'].map(f => ({label: f, value: f})),
rules: [{ required: true, message: '请选择账户类型', trigger: 'blur' }],
options: ['Organization', 'User'].map(f => ({ label: f, value: f })),
el: {
placeholder: '请选择'
}
@ -131,7 +63,7 @@ export default {
},
{
prop: 'username',
label: 'Username',
label: 'Username'
},
{
prop: 'role',

View File

@ -1,5 +1,5 @@
<template>
<el-tabs v-model="activeName" type="card" @tab-click="handleClick">
<el-tabs v-model="activeName" type="border-card" @tab-click="handleClick">
<el-tab-pane :label="$t('usergroup.user_group_detail')" name="first">
<div class="ibox-title"><el-tag type="info">{{ group.name }}</el-tag></div>
<div class="ibox-content">
@ -25,7 +25,9 @@
</table>
</div>
</el-tab-pane>
<el-tab-pane :label="$t('usergroup.asset_granted')" name="second">{{ $t('usergroup.asset_granted') }}</el-tab-pane>
<el-tab-pane :label="$t('usergroup.asset_granted')" name="second">
{{ $t('usergroup.asset_granted') }}
</el-tab-pane>
</el-tabs>
</template>
@ -46,49 +48,52 @@ export default {
</script>
<style lang="less" scoped>
.ibox-content {
clear: both;
background-color: #ffffff;
color: inherit;
padding: 15px 20px 20px 20px;
border-color: #e7eaec;
border-image: none;
border-style: solid solid none;
border-width: 1px 0;
margin-right: 20px;
}
.table > tbody > tr > td, .table > tfoot > tr > td {
border-top: 1px solid #e7eaec;
line-height: 1.42857;
padding: 8px;
vertical-align: top;
}
.no-borders-tr td {
border-top: none !important;
}
.no-borders {
border: none !important;
}
.ibox-title {
-moz-border-bottom-colors: none;
-moz-border-left-colors: none;
-moz-border-right-colors: none;
-moz-border-top-colors: none;
background-color: #ffffff;
border-color: #e7eaec;
border-image: none;
color: inherit;
margin-bottom: 0;
margin-right: 20px;
padding: 10px 15px 7px;
min-height: 38px;
}
// ElEMENT
.el-tabs /deep/ .el-tabs__header{
margin:0 !important;
}
.el-tabs /deep/ .el-tabs__item.is-active{
background-color:#ffffff !important;
.el-tabs /deep/ .el-tabs__item {
/*margin: 0 20px;*/
/*background: red;*/
}
/*.ibox-content {*/
/* clear: both;*/
/* background-color: #ffffff;*/
/* color: inherit;*/
/* padding: 15px 20px 20px 20px;*/
/* border-color: #e7eaec;*/
/* border-image: none;*/
/* border-style: solid solid none;*/
/* border-width: 1px 0;*/
/* margin-right: 20px;*/
/*}*/
/*.table > tbody > tr > td, .table > tfoot > tr > td {*/
/* border-top: 1px solid #e7eaec;*/
/* line-height: 1.42857;*/
/* padding: 8px;*/
/* vertical-align: top;*/
/*}*/
/*.no-borders-tr td {*/
/* border-top: none !important;*/
/*}*/
/*.no-borders {*/
/* border: none !important;*/
/*}*/
/*.ibox-title {*/
/* -moz-border-bottom-colors: none;*/
/* -moz-border-left-colors: none;*/
/* -moz-border-right-colors: none;*/
/* -moz-border-top-colors: none;*/
/* background-color: #ffffff;*/
/* border-color: #e7eaec;*/
/* border-image: none;*/
/* color: inherit;*/
/* margin-bottom: 0;*/
/* margin-right: 20px;*/
/* padding: 10px 15px 7px;*/
/* min-height: 38px;*/
/*}*/
/*// ElEMENT 样式重置*/
/*.el-tabs /deep/ .el-tabs__header{*/
/* margin:0 !important;*/
/*}*/
/*.el-tabs /deep/ .el-tabs__item.is-active{*/
/* background-color:#ffffff !important;*/
/*}*/
</style>