|
|
@@ -11,9 +11,23 @@
|
|
|
></Header>
|
|
|
</el-header>
|
|
|
<el-main>
|
|
|
+
|
|
|
<el-scrollbar style="height: 100%">
|
|
|
- <router-view></router-view>
|
|
|
+ <transition
|
|
|
+ name="fade"
|
|
|
+ mode="out-in"
|
|
|
+ appear
|
|
|
+ enter-class="enter"
|
|
|
+ enter-active-class="enterActive"
|
|
|
+ enter-to-class="enterTo"
|
|
|
+ leave-class="leave"
|
|
|
+ leave-active-class="leaveActive"
|
|
|
+ leave-to-class="leaveTo"
|
|
|
+ >
|
|
|
+ <router-view></router-view>
|
|
|
+ </transition>
|
|
|
</el-scrollbar>
|
|
|
+
|
|
|
</el-main>
|
|
|
<el-footer>
|
|
|
<Footer></Footer>
|
|
|
@@ -23,10 +37,10 @@
|
|
|
</template>
|
|
|
|
|
|
<script>
|
|
|
- import Asider from './components/Asider';
|
|
|
- import Footer from './components/Footer';
|
|
|
- import Header from './components/Header';
|
|
|
- import { getCache } from '@/utils/admin/tools';
|
|
|
+ import Asider from './components/Asider';
|
|
|
+ import Footer from './components/Footer';
|
|
|
+ import Header from './components/Header';
|
|
|
+ import { getCache } from '@/utils/admin/tools';
|
|
|
import { USER_AUTH } from '@/utils/admin/ConstantConfig';
|
|
|
|
|
|
export default {
|
|
|
@@ -83,9 +97,28 @@
|
|
|
color: #333;
|
|
|
/*padding: 30px 0 30px 30px;*/
|
|
|
padding: 0;
|
|
|
+
|
|
|
::v-deep .el-scrollbar__wrap {
|
|
|
overflow-x: hidden;
|
|
|
}
|
|
|
}
|
|
|
+
|
|
|
+ /**
|
|
|
+ * transform
|
|
|
+ */
|
|
|
+ ::v-deep .enterActive, ::v-deep .leaveActive {
|
|
|
+ transition: all .3s ease;
|
|
|
+ }
|
|
|
+
|
|
|
+ ::v-deep .enterTo, ::v-deep .leave {
|
|
|
+ opacity: 1;
|
|
|
+ left: 0;
|
|
|
+ transform: translate(0);
|
|
|
+ }
|
|
|
+
|
|
|
+ ::v-deep .enter, ::v-deep .leaveTo {
|
|
|
+ opacity: 0;
|
|
|
+ transform: translate(100px);
|
|
|
+ }
|
|
|
}
|
|
|
</style>
|
15724580513