123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141142143144145146147148149150151152153154155156157158159160161 |
- <template>
- <div id="userLayout" :class="['user-layout-wrapper', device]">
- <div class="container" v-if="showTitle">
- <div class="top" style="margin-bottom: 30px" >
- <div class="header">
- <a href="/">
- <img src="~@/assets/logo.png" class="logo" alt="logo" style="height: 50px" />
- <!-- <span class="title">Jeecg Boot</span>-->
- </a>
- </div>
- <!-- <div class="desc">-->
- <!-- Jeecg Boot 是中国最具影响力的 企业级 快速开发平台-->
- <!-- </div>-->
- </div>
- <route-view></route-view>
- <div class="footer">
- <!-- <div class="links">
- <a href="http://jeecg-boot.mydoc.io" target="_blank">帮助</a>
- <a href="https://github.com/zhangdaiscott/jeecg-boot" target="_blank">隐私</a>
- <a href="https://github.com/zhangdaiscott/jeecg-boot" target="_blank">条款</a>
- </div>-->
- <div class="copyright">Copyright © 2019 上海有腾</div>
- </div>
- </div>
- <route-view v-else></route-view>
- </div>
- </template>
- <script>
- import RouteView from '@/components/layouts/RouteView'
- import { mixinDevice } from '@/utils/mixin.js'
- export default {
- name: 'UserLayout',
- components: { RouteView },
- mixins: [mixinDevice],
- data() {
- return {
- showTitle: true,
- }
- },
- mounted() {
- document.body.classList.add('userLayout')
- if (this.$route.path == '/user/new-batch'||this.$route.path=='/user/lookPreview') {
- this.showTitle = false
- } else {
- this.showTitle = true
- }
- },
- beforeDestroy() {
- document.body.classList.remove('userLayout')
- },
- }
- </script>
- <style lang="scss" scoped>
- #userLayout.user-layout-wrapper {
- height: 100%;
- &.mobile {
- .container {
- .main {
- max-width: 368px;
- width: 98%;
- }
- }
- }
- .container {
- width: 100%;
- min-height: 100%;
- background: #f0f2f5 url(~@/assets/background.svg) no-repeat 50%;
- background-size: 100%;
- padding: 160px 0 144px;
- position: relative;
- a {
- text-decoration: none;
- }
- .top {
- text-align: center;
- .header {
- height: 44px;
- line-height: 44px;
- .badge {
- position: absolute;
- display: inline-block;
- line-height: 1;
- vertical-align: middle;
- margin-left: -12px;
- margin-top: -10px;
- opacity: 0.8;
- }
- .logo {
- height: 44px;
- vertical-align: top;
- border-style: none;
- }
- .title {
- font-size: 33px;
- color: rgba(0, 0, 0, 0.85);
- 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;
- position: relative;
- top: 2px;
- }
- }
- .desc {
- font-size: 14px;
- color: rgba(0, 0, 0, 0.45);
- margin-top: 12px;
- margin-bottom: 40px;
- }
- }
- .main {
- min-width: 260px;
- width: 368px;
- margin: 0 auto;
- }
- .footer {
- position: absolute;
- width: 100%;
- bottom: 0;
- padding: 0 16px;
- margin: 48px 0 24px;
- text-align: center;
- .links {
- margin-bottom: 8px;
- font-size: 14px;
- a {
- color: rgba(0, 0, 0, 0.45);
- transition: all 0.3s;
- &:not(:last-child) {
- margin-right: 40px;
- }
- }
- }
- .copyright {
- color: rgba(0, 0, 0, 0.45);
- font-size: 14px;
- }
- }
- }
- }
- </style>
|