Commit 13242a13 authored by huangjie's avatar huangjie

Merge branch 'master' of http://192.168.60.201/root/sup-server

# Conflicts:
#	dsk-srm-server/src/login.vue
parents ca6ce659 872daafc
<template> <template>
<div id="app"> <div id="app">
<router-view/> <router-view />
</div> </div>
</template> </template>
<style lang="scss"> <style lang="scss">
@import url("~@/assets/styles/public.scss");
</style> </style>
html,
body {
margin: 0;
padding: 0;
width: 100%;
height: 100%;
}
#app {
width: 100%;
height: 100%;
}
<template>
<div class="bot">
版权所有©Copyright@www.jiansheku.com All Rights Reserved<br>
渝ICP备19009652号-1
</div>
</template>
<script>
export default {
name: "foots"
}
</script>
<style scoped>
.bot{
z-index: 2;
width: 100%;
height: 58px;
padding: 12px 0;
box-sizing: border-box;
background: #282828;
text-align: center;
font-size: 12px;
font-family: Microsoft YaHei-Regular, Microsoft YaHei;
font-weight: 400;
color: #9E9E9E;
line-height: 17px;
}
</style>
<template> <template>
<div class="main"> <div class="main">
<div class="video"> <div class="video">
<video autoplay loop muted class="homeVideo" :style="{width:widths,height:heights}"> <video autoplay loop muted class="login-video">
<source src="@/assets/background.mp4" type="video/mp4"> <source src="@/assets/background.mp4" type="video/mp4">
</video> </video>
</div> </div>
<img class="righttop" src="@/assets/images/ico01.png">
<div class="login">
<img class="logintop" src="@/assets/images/ico02.png">
<h3>智慧供应商管理系统</h3>
<div class="inputs">
<input placeholder="请输入登录账号">
</div>
<div class="inputs">
<input placeholder="请输入账号密码">
</div>
<div class="inputs">
<input placeholder="请输入账号密码">
<div class="login-code">
<img :src="codeUrl" @click="getCode" class="login-code-img"/>
</div>
</div>
<button class="loginin">登录</button>
<img class="loginbot" src="@/assets/images/ico03.png">
</div>
<footers/>
</div> </div>
</template> </template>
<script> <script>
import footers from '@/components/foots'
export default { export default {
components: {footers},
data() { data() {
return { return {};
widths: '',
heights:'',
}
}, },
computed: {}, computed: {},
mounted() { mounted() {
this.widths = document.documentElement.clientWidth+'px'
this.heights = document.documentElement.clientHeight+'px'
console.log(this.widths)
}, },
methods: {} methods: {}
} }
</script> </script>
<style scoped> <style scoped lang="scss">
.home-video { .main {
z-index: 100; position: relative;
height: 100%;
width: 100%;
.login-video {
position: absolute;
left: 0;
top: 0;
width: 100%;
height: 100%;
object-fit: cover;
source {
width: 100%;
height: 100%;
}
}
.bot{
position: fixed;
bottom: 0;
left: 0;}
.righttop{
position: absolute;
right: 16px;
top: 17px;
z-index: 1;
}
.login{
width: 426px;
height: 451px;
background: #FFFFFF;
border-radius: 8px;
opacity: 1;
position: absolute; position: absolute;
top: 50%; top: 50%;
left: 50%; margin-top: -225px;
min-width: 100%; right: 61px;
min-height: 100%; .logintop{
object-fit: fill;/*这里是关键*/ position: absolute;
width: auto; left: 12px;
height: auto; top: 12px;
-ms-transform: translateX(-50%) translateY(-50%); }
-webkit-transform: translateX(-50%) translateY(-50%); >h3{
transform: translateX(-50%) translateY(-50%); font-size: 24px;
/*background: url(../video/cover.jpg) no-repeat;*/ font-family: AlibabaPuHuiTi-Bold, AlibabaPuHuiTi;
background-size: cover; font-weight: bold;
} color: #0081FF;
text-align: center;
margin-top: 60px;
margin-bottom: 40px;
}
.inputs{
margin-bottom: 24px;
text-align: center;
input{
width: 340px;
height: 48px;
background: #F8F8F8;
border-radius: 8px;
border: 1px solid #F4F4F4;
padding-left: 16px ;
outline: none;
font-size: 14px;
}
input::-webkit-input-placeholder,
textarea::-webkit-input-placeholder {
color: #9E9E9E;
}
}
}
}
</style> </style>
Markdown is supported
0% or
You are about to add 0 people to the discussion. Proceed with caution.
Finish editing this message first!
Please register or to comment