|
|
|
|
@ -1,16 +1,18 @@
|
|
|
|
|
<template>
|
|
|
|
|
<!-- :class="classObj" -->
|
|
|
|
|
<div class="app-wrapper" :style="{'--current-color': theme}">
|
|
|
|
|
<div v-if="device==='mobile'&&sidebar.opened" class="drawer-bg" @click="handleClickOutside"/>
|
|
|
|
|
<sidebar v-if="!sidebar.hide" class="sidebar-container"/>
|
|
|
|
|
<div :class="{hasTagsView:needTagsView,sidebarHide:sidebar.hide}" class="main-container">
|
|
|
|
|
<div :class="{'fixed-header':fixedHeader}" class="tags-view-class">
|
|
|
|
|
<tags-view v-if="needTagsView"/>
|
|
|
|
|
<div class="app-wrapper" :style="{ '--current-color': theme }">
|
|
|
|
|
<div v-if="device === 'mobile' && sidebar.opened" class="drawer-bg" @click="handleClickOutside" />
|
|
|
|
|
<sidebar v-if="!sidebar.hide" class="sidebar-container" />
|
|
|
|
|
<div :class="{ hasTagsView: needTagsView, sidebarHide: sidebar.hide }" class="main-container">
|
|
|
|
|
<div :class="{ 'fixed-header': fixedHeader }" class="tags-view-class">
|
|
|
|
|
<tags-view v-if="needTagsView" />
|
|
|
|
|
</div>
|
|
|
|
|
<app-main/>
|
|
|
|
|
<app-main />
|
|
|
|
|
<right-panel>
|
|
|
|
|
<settings/>
|
|
|
|
|
<settings />
|
|
|
|
|
</right-panel>
|
|
|
|
|
<div class="dibutishi"><span>主办单位：</span>中共太仓市委网信办 <span class="kongge"></span> <span>技术支持单位：</span>杭州安恒信息技术股份有限公司
|
|
|
|
|
</div>
|
|
|
|
|
</div>
|
|
|
|
|
</div>
|
|
|
|
|
</template>
|
|
|
|
|
@ -71,28 +73,29 @@ export default {
|
|
|
|
|
this.$store.dispatch('LogOut').then(() => {
|
|
|
|
|
location.href = '/index';
|
|
|
|
|
})
|
|
|
|
|
}).catch(() => {});
|
|
|
|
|
}).catch(() => { });
|
|
|
|
|
}
|
|
|
|
|
}
|
|
|
|
|
}
|
|
|
|
|
</script>
|
|
|
|
|
|
|
|
|
|
<style lang="scss" scoped>
|
|
|
|
|
@import "~@/assets/styles/mixin.scss";
|
|
|
|
|
@import "~@/assets/styles/variables.scss";
|
|
|
|
|
@import "~@/assets/styles/mixin.scss";
|
|
|
|
|
@import "~@/assets/styles/variables.scss";
|
|
|
|
|
|
|
|
|
|
.app-wrapper {
|
|
|
|
|
.app-wrapper {
|
|
|
|
|
@include clearfix;
|
|
|
|
|
position: relative;
|
|
|
|
|
height: 100%;
|
|
|
|
|
width: 100%;
|
|
|
|
|
|
|
|
|
|
&.mobile.openSidebar {
|
|
|
|
|
position: fixed;
|
|
|
|
|
top: 0;
|
|
|
|
|
}
|
|
|
|
|
}
|
|
|
|
|
}
|
|
|
|
|
|
|
|
|
|
.drawer-bg {
|
|
|
|
|
.drawer-bg {
|
|
|
|
|
background: #000;
|
|
|
|
|
opacity: 0.3;
|
|
|
|
|
width: 100%;
|
|
|
|
|
@ -100,31 +103,45 @@ export default {
|
|
|
|
|
height: 100%;
|
|
|
|
|
position: absolute;
|
|
|
|
|
z-index: 999;
|
|
|
|
|
}
|
|
|
|
|
}
|
|
|
|
|
|
|
|
|
|
.fixed-header {
|
|
|
|
|
.fixed-header {
|
|
|
|
|
position: fixed;
|
|
|
|
|
top: 0;
|
|
|
|
|
right: 0;
|
|
|
|
|
z-index: 9;
|
|
|
|
|
width: calc(100% - #{$base-sidebar-width});
|
|
|
|
|
transition: width 0.28s;
|
|
|
|
|
}
|
|
|
|
|
}
|
|
|
|
|
|
|
|
|
|
.tags-view-class {
|
|
|
|
|
.tags-view-class {
|
|
|
|
|
display: flex;
|
|
|
|
|
align-items: center;
|
|
|
|
|
}
|
|
|
|
|
}
|
|
|
|
|
|
|
|
|
|
.hideSidebar .fixed-header {
|
|
|
|
|
.hideSidebar .fixed-header {
|
|
|
|
|
width: calc(100% - 54px);
|
|
|
|
|
}
|
|
|
|
|
}
|
|
|
|
|
|
|
|
|
|
.sidebarHide .fixed-header {
|
|
|
|
|
.sidebarHide .fixed-header {
|
|
|
|
|
width: 100%;
|
|
|
|
|
}
|
|
|
|
|
}
|
|
|
|
|
|
|
|
|
|
.mobile .fixed-header {
|
|
|
|
|
.mobile .fixed-header {
|
|
|
|
|
width: 100%;
|
|
|
|
|
}
|
|
|
|
|
|
|
|
|
|
.dibutishi {
|
|
|
|
|
font-size: 14px;
|
|
|
|
|
margin-top: 3px;
|
|
|
|
|
color: #909399;
|
|
|
|
|
.kongge {
|
|
|
|
|
margin: 0 10px;
|
|
|
|
|
}
|
|
|
|
|
|
|
|
|
|
span {
|
|
|
|
|
color: #909399;
|
|
|
|
|
|
|
|
|
|
}
|
|
|
|
|
}
|
|
|
|
|
</style>
|
|
|
|
|
|
