| | |
| | | <template> |
| | | <div class="login-container" @keyup.enter="handleLogin"> |
| | | <div class="login-header"> |
| | | <div class="title">中图智飞低空智能感知网平台</div> |
| | | <div :class="{loginContainer:true, 'narrowScreen':narrowScreen}" @keyup.enter="handleLogin"> |
| | | <div class="login-container"> |
| | | <div class="login-header"> |
| | | <div class="title">中图智飞低空智能感知网平台</div> |
| | | </div> |
| | | <!-- <div class="login-left-title">中国图强 智领飞跃</div> --> |
| | | <!-- <div class="login-left"></div> --> |
| | | <userLogin v-if="activeName === 'user'"></userLogin> |
| | | </div> |
| | | <div class="login-left-title-new">中国图强 智领飞跃</div> |
| | | <div class="login-left-new"> |
| | | <img src="@/assets/images/login/left-logo.png" alt="" /> |
| | | </div> |
| | | <userLogin v-if="activeName === 'user'"></userLogin> |
| | | </div> |
| | | </template> |
| | | <script> |
| | |
| | | }, |
| | | data() { |
| | | return { |
| | | narrowScreen: false, |
| | | login:{ |
| | | info: '中图智绘低空无人机监测网平台' |
| | | info: '中图智飞低空智能感知网平台' |
| | | }, |
| | | website: website, |
| | | time: '', |
| | |
| | | this.handleLogin(); |
| | | this.getTime(); |
| | | }, |
| | | mounted() {}, |
| | | mounted() { |
| | | this.narrowScreenFun() |
| | | window.addEventListener('resize', this.narrowScreenFun); |
| | | }, |
| | | computed: { |
| | | ...mapGetters(['tagWel']), |
| | | }, |
| | | props: [], |
| | | methods: { |
| | | narrowScreenFun() { |
| | | // 监听窗口变化,计算是不是 窄屏幕 |
| | | this.narrowScreen = window.innerWidth / window.innerHeight < 16 / 9; |
| | | }, |
| | | getTime() { |
| | | setInterval(() => { |
| | | this.time = this.$dayjs().format('YYYY年MM月DD日 HH:mm:ss'); |
| | |
| | | }, |
| | | }; |
| | | </script> |
| | | |
| | | <style lang="scss" scoped> |
| | | .loginContainer { |
| | | position: relative; |
| | | width: 100%; |
| | | height: 100%; |
| | | overflow-x: auto; |
| | | scrollbar-width: none; /* Firefox 隐藏滚动条 */ |
| | | &::-webkit-scrollbar { |
| | | display: none; /* Chrome、Safari 隐藏滚动条 */ |
| | | } |
| | | |
| | | &.narrowScreen{ |
| | | >div{ |
| | | left: 50%; |
| | | top: 50%; |
| | | transform: translate(-50%, -50%); |
| | | } |
| | | } |
| | | >div{ |
| | | left: 0; |
| | | top: 0; |
| | | position: absolute; |
| | | height: 1080px; |
| | | width: 1920px; |
| | | } |
| | | .login-container { |
| | | background-image: url('@/assets/images/login/bg.png'); |
| | | background-size: 100% 100%; |
| | | background-repeat: no-repeat; |
| | | // background: url('@/assets/images/login/bg.png') no-repeat center / 100% 100%; |
| | | pointer-events: none; |
| | | |
| | | > * { |
| | | pointer-events: auto; |
| | | } |
| | | } |
| | | } |
| | | </style> |