Skip to content

polysoft-nafmii / polysoft-h5

Go to a project
Commit 00e93d33 by fanx
Options

公共头部处理

1 parent d3d98ec9
Inline Side-by-side
Showing 11 changed files with 64 additions and 96 deletions
src/assets/css/common.less
......@@ -233,6 +233,11 @@ input {
background-size : 100% !important;
background-position: center center;
}
.nafmii-head-bg1-2 {
background : url("~@/assets/icon/bg_login_2.png") no-repeat !important;
background-size : 100% !important;
background-position: center center;
}
.nafmii-head-bg2 {
background : url("~@/assets/icon/bg_mine.png") no-repeat !important;
background-size : 100% !important;
......
src/assets/css/sprite.less
.icon-sprite { display: inline-block; background-image: url(../images/sprite.png); background-size: 1676px 1036px; }
.icon-bg-common { width: 828px; height: 360px; background-position: 0px -432px; }
.icon-bg-login { width: 828px; height: 412px; background-position: 0px 0px; }
.icon-bg-mine { width: 828px; height: 340px; background-position: -848px -432px; }
.icon-email { width: 36px; height: 36px; background-position: -344px -812px; }
.icon-icon-arrow-right { width: 10px; height: 18px; background-position: -776px -812px; }
.icon-icon-classify { width: 30px; height: 30px; background-position: -676px -812px; }
.icon-icon-clock { width: 30px; height: 30px; background-position: -726px -812px; }
.icon-logo { width: 224px; height: 224px; background-position: 0px -812px; }
.icon-password { width: 36px; height: 36px; background-position: -400px -812px; }
.icon-tel { width: 36px; height: 36px; background-position: -456px -812px; }
.icon-user-question { width: 32px; height: 36px; background-position: -624px -812px; }
.icon-user { width: 36px; height: 36px; background-position: -512px -812px; }
.icon-verification { width: 36px; height: 36px; background-position: -568px -812px; }
.icon-wechat { width: 80px; height: 78px; background-position: -244px -812px; }
.icon-bg-member { width: 828px; height: 406px; background-position: -848px 0px; }
\ No newline at end of file
.icon-sprite { display: inline-block; background-image: url(../images/sprite.png); background-size: 1676px 1292px; }
.icon-bg-common { width: 828px; height: 360px; background-position: -848px -526px; }
.icon-bg-login { width: 828px; height: 412px; background-position: -848px 0px; }
.icon-bg-member { width: 828px; height: 406px; background-position: 0px -526px; }
.icon-bg-mine { width: 828px; height: 340px; background-position: 0px -952px; }
.icon-email { width: 36px; height: 36px; background-position: -848px -432px; }
.icon-icon-arrow-right { width: 10px; height: 18px; background-position: -1280px -432px; }
.icon-icon-classify { width: 30px; height: 30px; background-position: -1180px -432px; }
.icon-icon-clock { width: 30px; height: 30px; background-position: -1230px -432px; }
.icon-logo { width: 224px; height: 224px; background-position: -848px -952px; }
.icon-password { width: 36px; height: 36px; background-position: -904px -432px; }
.icon-tel { width: 36px; height: 36px; background-position: -960px -432px; }
.icon-user-question { width: 32px; height: 36px; background-position: -1128px -432px; }
.icon-user { width: 36px; height: 36px; background-position: -1016px -432px; }
.icon-verification { width: 36px; height: 36px; background-position: -1072px -432px; }
.icon-wechat { width: 80px; height: 78px; background-position: -1092px -952px; }
.icon-bg-login-2 { width: 828px; height: 506px; background-position: 0px 0px; }
\ No newline at end of file
src/assets/images/sprite.png
src/assets/images/sprite.png

558 KB | W: | H:

src/assets/images/sprite.png

599 KB | W: | H:

src/assets/images/sprite.png
src/assets/images/sprite.png
src/assets/images/sprite.png
src/assets/images/sprite.png
  • 2-up
  • Swipe
  • Onion skin
src/components/UserCommon.vue deleted 100644 → 0
<template>
<div class="user_container">
<div class="logo">
<img :src="require('@/assets/icon/logo.png')" alt="">
</div>
<!-- 顶部插槽 -->
<div class="user_navigation" v-if="$slots.top" slot="top">
<slot name="top" />
</div>
</div>
</template>
<script>
export default {
name: 'UserCommon'
}
</script>
<style lang="less" scoped>
.user_container {
background-image: url(../assets/icon/bg_login.png);
background-repeat: no-repeat;
background-size: 100%;
height: 250px;
}
.logo {
display: flex;
justify-content: center;
img {
margin-top: 140px;
width: 112px;
height: 112px;
}
}
</style>
\ No newline at end of file
src/views/user/findPassword.vue
<template>
<div class="login_container">
<UserCommon>
<template slot="top">
<NafmHeader :isBgImg="false" :title="title" bgColor="transparent" />
</template>
</UserCommon>
<img src="@/assets/icon/bg_login_2.png" />
<div class="login_box">
<NafmHeader navClass="nafmii-head-bg1" :title="title" bgColor="transparent" />
</div>
<div class="login_content">
<div class="login_form_box">
<div class="login_form">
......@@ -22,7 +21,6 @@
</div>
</template>
<script>
import UserCommon from '@/components/UserCommon'
import SendVerificationCode from '@/components/SendVerificationCode'
import utils from "@/utils/";
......@@ -30,7 +28,6 @@ import utils from "@/utils/";
export default {
name: 'Login',
components: {
UserCommon,
SendVerificationCode
},
data() {
......
src/views/user/less/login.less
......@@ -5,6 +5,14 @@
flex-direction: column;
}
.login_box {
position: absolute;
top: 0;
left: 0;
width: 100%;
height: 100px;
}
.login_content {
margin-top: 40px;
}
......@@ -22,11 +30,12 @@
bottom: 4px;
}
.login_form_box{
.login_form_box {
display: flex;
align-items: center;
justify-content: center;
}
.login_form {
width: 330px;
margin-top: 20px;
......@@ -36,13 +45,13 @@
border-bottom: 1px solid #efefef;
}
/deep/ .van-cell{
/deep/ .van-cell {
padding-right: 0 !important;
padding-left: 0 !important;
border-bottom: 1px solid #ebedf0;
}
/deep/ .van-cell:not(:last-child)::after{
/deep/ .van-cell:not(:last-child)::after {
border: none;
}
......@@ -82,7 +91,7 @@
opacity: 1;
}
.register_btn{
.register_btn {
margin-top: 10px;
display: flex;
justify-content: flex-end;
......
src/views/user/loginPhone.vue
<template>
<div class="login_container">
<UserCommon>
<template slot="top">
<NafmHeader bgColor="transparent" />
</template>
</UserCommon>
<img src="@/assets/icon/bg_login_2.png" />
<div class="login_box">
<NafmHeader navClass="nafmii-head-bg1" bgColor="transparent" />
</div>
<div class="login_content">
<LoginTabs :type="1" />
<div class="login_form_box">
......@@ -24,7 +25,6 @@
</div>
</template>
<script>
import UserCommon from '@/components/UserCommon'
import LoginTabs from './components/LoginTabs'
import OtherLogin from './components/OtherLogin'
import SendVerificationCode from '@/components/SendVerificationCode'
......@@ -34,7 +34,6 @@ import utils from "@/utils/";
export default {
name: 'Login',
components: {
UserCommon,
LoginTabs,
OtherLogin,
SendVerificationCode
......@@ -68,9 +67,9 @@ export default {
return
}
if (!utils.phoneRegCheck(this.phone)) {
Toast("请输入正确的手机号码！");
return
}
Toast("请输入正确的手机号码！");
return
}
if (!this.password) {
Toast('请输入验证码')
return
......
src/views/user/loginUserName.vue
<template>
<div class="login_container">
<UserCommon>
<template slot="top">
<NafmHeader bgColor="transparent" />
</template>
</UserCommon>
<img src="@/assets/icon/bg_login_2.png" />
<div class="login_box">
<NafmHeader navClass="nafmii-head-bg1" bgColor="transparent" />
</div>
<div class="login_content">
<LoginTabs :type="2" />
<div class="login_form_box">
......@@ -25,7 +24,6 @@
</div>
</template>
<script>
import UserCommon from '@/components/UserCommon'
import LoginTabs from './components/LoginTabs'
import OtherLogin from './components/OtherLogin'
import SendVerificationCode from '@/components/SendVerificationCode'
......@@ -35,7 +33,6 @@ import utils from "@/utils/";
export default {
name: 'Login',
components: {
UserCommon,
LoginTabs,
OtherLogin,
SendVerificationCode
......
src/views/user/register.vue
<template>
<div class="register_container">
<UserCommon>
<NafmHeader/>
</UserCommon>
<img src="@/assets/icon/bg_login_2.png" />
<div class="login_box">
<NafmHeader navClass="nafmii-head-bg1" :title="title" bgColor="transparent" />
</div>
</div>
</template>
<script>
import UserCommon from '@/components/UserCommon'
export default {
name: 'Register',
components: {
UserCommon
},
components: {},
data() {
return {}
},
......
src/views/user/resetPassword.vue
<template>
<div class="login_container">
<UserCommon>
<template slot="top">
<NafmHeader bgColor="transparent" />
</template>
</UserCommon>
<img src="@/assets/icon/bg_login_2.png" />
<div class="login_box">
<NafmHeader navClass="nafmii-head-bg1" :title="title" bgColor="transparent" />
</div>
<div class="login_content">
<div class="login_form_box">
<div class="login_form">
......@@ -17,16 +16,13 @@
</div>
</template>
<script>
import UserCommon from '@/components/UserCommon'
export default {
name: 'Login',
components: {
UserCommon,
},
components: {},
data() {
return {
password: "",
aginPassword:"",
aginPassword: "",
passwordIcon: require('@/assets/icon/password.png'),
}
},
......@@ -50,7 +46,7 @@ export default {
Toast('请再次输入密码')
return
}
if (this.password!=this.aginPassword) {
if (this.password != this.aginPassword) {
Toast('两次输入的密码不一致')
return
}
......
Markdown is supported
You are about to add 0 people to the discussion. Proceed with caution.
Finish editing this message first!