mirror of
https://gitee.com/lab1024/smart-admin.git
synced 2025-11-17 16:13:48 +08:00
userlogin / personal/mypersonal.vue / producted albumn updated
This commit is contained in:
Vion
@@ -26,7 +26,7 @@
|
||||
<div class="usermain">
|
||||
<div :class="searchBar?'rc-ma':'rc-ma searchBara'">
|
||||
<div v-if="!searchBar" class="online bold rc-md-down"></div>
|
||||
<ul class="ul-zhuan">
|
||||
<ul class="ul-zhuan rc-margin-y--xl">
|
||||
<li
|
||||
v-for="(item, index) in discountlist"
|
||||
:key="index"
|
||||
@@ -37,7 +37,6 @@
|
||||
<span>{{ item.title }}</span>
|
||||
</li>
|
||||
</ul>
|
||||
<div class="online bold rc-md-down"></div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
@@ -616,7 +615,7 @@
|
||||
</ul>
|
||||
<div class="tuntop" @click="toTop" v-show="gotop">
|
||||
<img src="../assets/image/turntop.png" alt="">
|
||||
回到顶部
|
||||
<span>回到顶部</span>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
|
||||
@@ -1,64 +1,73 @@
|
||||
<template>
|
||||
<div>
|
||||
<Myheader></Myheader>
|
||||
<div class="rc-header">
|
||||
<div class="rc-main">
|
||||
<div class="rc-top"></div>
|
||||
<div class="rc-layout-container rc-one-column rc-full-width ts-mypersonal">
|
||||
<div class="rc-column">
|
||||
<!-- <div class="rc-title">
|
||||
<img src="../../assets/image/rc-cat.png" alt="" />
|
||||
<span>{{ userorder }}</span>
|
||||
</div> -->
|
||||
<div class="rc-center">
|
||||
<img :src='userimage' />
|
||||
</div>
|
||||
<div class="rc-login">
|
||||
<div class="rc-unlogin">
|
||||
<div class="rc-people" @click="opendialog()">
|
||||
<img src="../../assets/image/rc-people.png" alt="" />
|
||||
</div>
|
||||
<div class="rc-userlogin">
|
||||
<div v-if="!islogin">
|
||||
<span>{{usertitle}}</span>
|
||||
<em>{{userorder}}</em>
|
||||
</div>
|
||||
<nuxt-link :to="`/userlogin/login/`">
|
||||
<span v-if="islogin">登录/注册</span>
|
||||
</nuxt-link>
|
||||
</div>
|
||||
</div>
|
||||
<div class="rc-islogin">
|
||||
<nuxt-link :to="`/personal/usermember/`">
|
||||
<span>会员权益</span>
|
||||
</nuxt-link>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div class="usercord">
|
||||
<em>当前积分:{{ rcrcord }}</em>
|
||||
<span @click="userinter">积分明细</span>
|
||||
</div>
|
||||
<div class="rc-max-width--xl">
|
||||
<div class="rc-center">
|
||||
<img :src='userimage' />
|
||||
</div>
|
||||
</div>
|
||||
<div class="rc-max-width--xl ts-special-padding">
|
||||
<div class="rc-login">
|
||||
<div class="rc-unlogin">
|
||||
<div class="rc-people" @click="opendialog()">
|
||||
<img src="../../assets/image/rc-people.png" alt="" />
|
||||
</div>
|
||||
<div class="rc-userlogin">
|
||||
<div v-if="!islogin">
|
||||
<span>{{usertitle}}</span>
|
||||
<em>{{userorder}}</em>
|
||||
</div>
|
||||
<nuxt-link :to="`/userlogin/login/`">
|
||||
<span v-if="islogin">登录/注册</span>
|
||||
</nuxt-link>
|
||||
</div>
|
||||
</div>
|
||||
<div class="rc-islogin">
|
||||
<nuxt-link :to="`/personal/usermember/`" class="ts-right-arr">
|
||||
<span>会员权益</span>
|
||||
</nuxt-link>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<div class="online bold"></div>
|
||||
<div class="rc-max-width--xl ts-special-padding">
|
||||
<div class="usercord">
|
||||
<em>当前积分:{{ rcrcord }}</em>
|
||||
<span class="ts-right-arr" @click="userinter">积分明细</span>
|
||||
</div>
|
||||
|
||||
<div class="rc-cordd">
|
||||
<span>距离升级还差:{{ rcvalue }} </span>
|
||||
<div class="block">
|
||||
<div class="r-block" ref="userblock"></div>
|
||||
<!-- <el-slider v-model="value" range show-stops :max="10"> </el-slider> -->
|
||||
|
||||
</div>
|
||||
<div class="rc-value">
|
||||
<span>0</span>
|
||||
<span>5000</span>
|
||||
<span>10000</span>
|
||||
</div>
|
||||
</div>
|
||||
<div class="rc-cordd">
|
||||
<span>距离升级还差:</span> <span class="lackOfPoint">{{ rcvalue }}</span>
|
||||
<div class="block">
|
||||
<div class="r-block" ref="userblock"></div>
|
||||
<!-- <el-slider v-model="value" range show-stops :max="10"> </el-slider> -->
|
||||
|
||||
</div>
|
||||
<div class="rc-value">
|
||||
<span>0</span>
|
||||
<span>5000</span>
|
||||
<span>10000</span>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<div class="online bold"></div>
|
||||
|
||||
<div class="rc-max-width--xl ts-special-padding">
|
||||
<div class="rc-order">
|
||||
<em>我的订单</em>
|
||||
|
||||
|
||||
<span @click="findall" >查看全部</span>
|
||||
<span class="ts-right-arr" @click="findall" >查看全部</span>
|
||||
|
||||
</div>
|
||||
<div class="rc-obligation">
|
||||
<div class="rc-obligation rc-max-width--lg">
|
||||
<ul>
|
||||
<li v-for="(item, index) in prefecture" :key="index" @click="obligation(item,index)">
|
||||
<img :src="item.catimage" alt="" />
|
||||
@@ -66,9 +75,14 @@
|
||||
</li>
|
||||
</ul>
|
||||
</div>
|
||||
<div class="rc-usermain">
|
||||
</div>
|
||||
|
||||
<div class="online bold"></div>
|
||||
|
||||
<div class="rc-max-width--xl ts-special-padding">
|
||||
<div class="rc-usermain">
|
||||
<h2>服务工具</h2>
|
||||
<div class="rc-buymain">
|
||||
<div class="rc-buymain rc-max-width--lg ts-special-padding">
|
||||
<div class="rc-buy" v-for="(item, index) in personallist" :key="index" @click="openaddress(item,index)">
|
||||
<div class="rc-cord">
|
||||
<img :src="item.buyimage" alt="" />
|
||||
@@ -81,6 +95,8 @@
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<div class="online bold"></div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
@@ -402,492 +418,6 @@ this.$router.push({
|
||||
</script>
|
||||
|
||||
<style lang="less" scoped>
|
||||
ul li ol li em strong i {
|
||||
list-style: none;
|
||||
font-style: normal;
|
||||
}
|
||||
.rc-header {
|
||||
width: 100%;
|
||||
}
|
||||
//手机端
|
||||
@media screen and (max-width: 768px) {
|
||||
|
||||
|
||||
/deep/.el-dialog {
|
||||
width: 352px;
|
||||
height: 500px;
|
||||
}
|
||||
|
||||
.rc-header{
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
align-items: center;
|
||||
text-align: center;
|
||||
h3{
|
||||
color:#333333;
|
||||
font-size: 26px;
|
||||
}
|
||||
.rc-title{
|
||||
img{
|
||||
width: 96px;
|
||||
height: 96px;
|
||||
|
||||
}
|
||||
}
|
||||
.userer{
|
||||
img{
|
||||
width: 210px;
|
||||
height: 210px;
|
||||
display: flex;
|
||||
justify-content: center;
|
||||
flex-direction: column;
|
||||
|
||||
}
|
||||
}
|
||||
}
|
||||
.rc-main {
|
||||
width: 92%;
|
||||
margin: 0 auto;
|
||||
overflow: hidden;
|
||||
.rc-usermain{
|
||||
h2{
|
||||
display: none;
|
||||
}
|
||||
|
||||
}
|
||||
.rc-center {
|
||||
width: 100%;
|
||||
height: 180px;
|
||||
img {
|
||||
width: 100%;
|
||||
height: 100%;
|
||||
display: block;
|
||||
}
|
||||
|
||||
}
|
||||
|
||||
.rc-login {
|
||||
width: 100%;
|
||||
height: 112px;
|
||||
display: flex;
|
||||
justify-content: space-between;
|
||||
align-items: center;
|
||||
.rc-unlogin{
|
||||
display: flex;
|
||||
align-items: center;
|
||||
}
|
||||
.rc-userlogin{
|
||||
margin-left: 16px;
|
||||
|
||||
span{
|
||||
font-size: 18px;
|
||||
color: #333333;
|
||||
display: block;
|
||||
}
|
||||
em{
|
||||
font-size: 14px;
|
||||
color:#666666;
|
||||
font-style: normal;
|
||||
display: block;
|
||||
margin-top: 8px;
|
||||
}
|
||||
|
||||
}
|
||||
.rc-islogin{
|
||||
span{
|
||||
color: #E1001A;
|
||||
font-size: 14px;
|
||||
display: block;
|
||||
border-bottom: 1px solid #E1001A;
|
||||
}
|
||||
}
|
||||
.rc-people {
|
||||
width: 64px;
|
||||
height: 64px;
|
||||
display: flex;
|
||||
align-items: center;
|
||||
border: 2px solid #d7d7d7;
|
||||
border-radius: 50%;
|
||||
img {
|
||||
width: 48px;
|
||||
height: 48px;
|
||||
display: block;
|
||||
margin: 0 auto;
|
||||
}
|
||||
}
|
||||
}
|
||||
.usercord{
|
||||
display: flex;
|
||||
justify-content: space-between;
|
||||
height: 32px;
|
||||
align-items: center;
|
||||
border-bottom: 1px solid #D8D8D8;
|
||||
padding-bottom: 17px
|
||||
;
|
||||
|
||||
em{
|
||||
font-style: normal;
|
||||
color: #333333;
|
||||
font-weight: bold;
|
||||
|
||||
}
|
||||
span{
|
||||
color:#E1001A;
|
||||
font-size: 14px;
|
||||
display: block;
|
||||
border-bottom: 1px solid #E1001A;
|
||||
}
|
||||
}
|
||||
.rc-cordd{
|
||||
color:#666666;
|
||||
font-size: 14px;
|
||||
|
||||
span{
|
||||
display: block;
|
||||
margin-top: 16px;
|
||||
text-align: left;
|
||||
}
|
||||
.block{
|
||||
height: 8px;
|
||||
background: #D7D7D7;
|
||||
margin-top: 16px;
|
||||
border-radius: 4px;
|
||||
.r-block{
|
||||
width: 0%;
|
||||
height: 100%;
|
||||
background: #008900;
|
||||
}
|
||||
|
||||
|
||||
}
|
||||
.rc-value{
|
||||
display: flex;
|
||||
justify-content: space-between;
|
||||
}
|
||||
}
|
||||
.rc-order{
|
||||
display: flex;
|
||||
justify-content: space-between;
|
||||
margin-top: 16px;
|
||||
border-bottom: 1px solid #D8D8D8;
|
||||
padding-bottom: 16px;
|
||||
em{
|
||||
font-style: normal;
|
||||
font-size: 14px;
|
||||
font-weight: bold;
|
||||
color: #333333;
|
||||
}
|
||||
span{
|
||||
color:#E1001A;
|
||||
font-size: 14px;
|
||||
display: block;
|
||||
border-bottom: 1px solid #E1001A;
|
||||
}
|
||||
}
|
||||
|
||||
.rc-obligation{
|
||||
margin-top: 16px;
|
||||
ul{
|
||||
display: flex;
|
||||
justify-content: space-between;
|
||||
li{
|
||||
float: left;
|
||||
|
||||
}
|
||||
img{
|
||||
width: 44px;
|
||||
height: 44px;
|
||||
display: block;
|
||||
}
|
||||
}
|
||||
}
|
||||
.rc-buy{
|
||||
width: 100%;
|
||||
height: 64px;
|
||||
display: flex;
|
||||
justify-content: space-between;
|
||||
border-bottom: 1px solid #D8D8D8;
|
||||
margin-top: 24px;
|
||||
.rc-cord{
|
||||
display: flex;
|
||||
align-items: center;
|
||||
}
|
||||
img{
|
||||
width: 32px;
|
||||
height: 32px;
|
||||
display: block;
|
||||
}
|
||||
em{
|
||||
font-style: normal;
|
||||
font-size: 14px;
|
||||
color: #333333;
|
||||
margin-left: 16px;
|
||||
|
||||
}
|
||||
.rc-load{
|
||||
display: flex;
|
||||
align-items: center;
|
||||
font-size: 14px;
|
||||
color: #666666;
|
||||
span{
|
||||
display: block;
|
||||
margin-right: 8px;
|
||||
margin-top: -4px;
|
||||
}
|
||||
img{
|
||||
width: 8px;
|
||||
height: 16px;
|
||||
display: block;
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
//pc端
|
||||
|
||||
@media screen and (min-width: 768px) and (max-width: 1920px) {
|
||||
/deep/.el-dialog {
|
||||
width: 440px;
|
||||
height: 652px;
|
||||
}
|
||||
|
||||
.rc-header{
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
align-items: center;
|
||||
text-align: center;
|
||||
h3{
|
||||
color:#333333;
|
||||
font-size: 26px;
|
||||
}
|
||||
.rc-title{
|
||||
img{
|
||||
width: 96px;
|
||||
height: 96px;
|
||||
|
||||
}
|
||||
}
|
||||
.userer{
|
||||
img{
|
||||
width: 210px;
|
||||
height: 210px;
|
||||
display: flex;
|
||||
justify-content: center;
|
||||
flex-direction: column;
|
||||
|
||||
}
|
||||
}
|
||||
}
|
||||
.rc-main {
|
||||
width: 92%;
|
||||
margin: 0 auto;
|
||||
.rc-center {
|
||||
width: 100%;
|
||||
height: 180px;
|
||||
img {
|
||||
width: 100%;
|
||||
height: 100%;
|
||||
display: block;
|
||||
}
|
||||
display: none;
|
||||
}
|
||||
|
||||
.rc-login {
|
||||
width: 100%;
|
||||
height: 112px;
|
||||
display: flex;
|
||||
justify-content: space-between;
|
||||
align-items: center;
|
||||
.rc-unlogin{
|
||||
display: flex;
|
||||
align-items: center;
|
||||
}
|
||||
.rc-userlogin{
|
||||
margin-left: 16px;
|
||||
|
||||
span{
|
||||
font-size: 18px;
|
||||
color: #333333;
|
||||
display: block;
|
||||
}
|
||||
em{
|
||||
font-size: 14px;
|
||||
color:#666666;
|
||||
font-style: normal;
|
||||
display: block;
|
||||
margin-top: 8px;
|
||||
}
|
||||
|
||||
}
|
||||
.rc-islogin{
|
||||
span{
|
||||
color: #E1001A;
|
||||
font-size: 18px;
|
||||
display: block;
|
||||
}
|
||||
}
|
||||
.rc-people {
|
||||
width: 64px;
|
||||
height: 64px;
|
||||
display: flex;
|
||||
align-items: center;
|
||||
border: 2px solid #d7d7d7;
|
||||
border-radius: 50%;
|
||||
img {
|
||||
width: 48px;
|
||||
height: 48px;
|
||||
display: block;
|
||||
margin: 0 auto;
|
||||
}
|
||||
}
|
||||
}
|
||||
.usercord{
|
||||
display: flex;
|
||||
justify-content: space-between;
|
||||
align-items: center;
|
||||
height: 80px;
|
||||
border-bottom: 1px solid #D7D7D7;
|
||||
em{
|
||||
font-style: normal;
|
||||
color: #333333;
|
||||
font-weight: bold;
|
||||
font-size: 18px;
|
||||
|
||||
}
|
||||
span{
|
||||
color:#E1001A;
|
||||
font-size: 18px;
|
||||
display: block;
|
||||
}
|
||||
}
|
||||
.rc-cordd{
|
||||
color:#333333;
|
||||
font-size: 18px;
|
||||
height: 133px;
|
||||
margin-top: 32px;
|
||||
|
||||
color:#666666;
|
||||
font-size: 14px;
|
||||
span{
|
||||
margin-top: 16px;
|
||||
font-size: 18px;
|
||||
text-align: left;
|
||||
display: block;
|
||||
}
|
||||
.block{
|
||||
height: 8px;
|
||||
background: #D7D7D7;
|
||||
margin-top: 16px;
|
||||
border-radius: 4px;
|
||||
.r-block{
|
||||
width: 0%;
|
||||
height: 100%;
|
||||
background: #008900;
|
||||
}
|
||||
|
||||
|
||||
}
|
||||
.rc-value{
|
||||
display: flex;
|
||||
justify-content: space-between;
|
||||
}
|
||||
|
||||
}
|
||||
.rc-order{
|
||||
display: flex;
|
||||
justify-content: space-between;
|
||||
border-bottom: 1px solid #D8D8D8;
|
||||
padding-bottom: 28px;
|
||||
margin-top: 20px;
|
||||
em{
|
||||
font-style: normal;
|
||||
font-size: 26px;
|
||||
color: #333333;
|
||||
}
|
||||
span{
|
||||
color:#E1001A;
|
||||
font-size: 18px;
|
||||
display: block;
|
||||
|
||||
}
|
||||
}
|
||||
|
||||
.rc-obligation{
|
||||
margin-top: 16px;
|
||||
ul{
|
||||
display: flex;
|
||||
justify-content: space-between;
|
||||
width: 80%;
|
||||
margin: 0 auto;
|
||||
text-align: center;
|
||||
li{
|
||||
float: left;
|
||||
|
||||
}
|
||||
img{
|
||||
width: 96px;
|
||||
height: 96px;
|
||||
display: block;
|
||||
}
|
||||
}
|
||||
span{
|
||||
font-size: 18px;
|
||||
}
|
||||
}
|
||||
.rc-usermain{
|
||||
h2{
|
||||
color: #333333;
|
||||
font-size: 26px;
|
||||
font-weight: normal;
|
||||
display: block;
|
||||
padding-bottom: 28px;
|
||||
border-bottom: 1px solid #D8D8D8;
|
||||
text-align: left;
|
||||
|
||||
}
|
||||
}
|
||||
.rc-buymain{
|
||||
display: flex;
|
||||
justify-content: space-between;
|
||||
width: 80%;
|
||||
margin: 0 auto;
|
||||
}
|
||||
.rc-buy{
|
||||
display: flex;
|
||||
justify-content: space-between;
|
||||
text-align: center;
|
||||
margin-top: 24px;
|
||||
|
||||
img{
|
||||
width: 96px;
|
||||
height: 96px;
|
||||
display: block;
|
||||
}
|
||||
em{
|
||||
font-style: normal;
|
||||
font-size: 18px;
|
||||
color: #333333;
|
||||
}
|
||||
.rc-load{
|
||||
display: flex;
|
||||
align-items: center;
|
||||
font-size: 14px;
|
||||
color: #666666;
|
||||
span{
|
||||
display: block;
|
||||
margin-right: 8px;
|
||||
margin-top: -4px;
|
||||
}
|
||||
img{
|
||||
width: 8px;
|
||||
height: 16px;
|
||||
display: block;
|
||||
}
|
||||
display: none;
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
|
||||
}
|
||||
@import url("@/assets/css/global.less");
|
||||
@import url("@/assets/css/mypersonal.less");
|
||||
</style>
|
||||
@@ -1,8 +1,8 @@
|
||||
<template>
|
||||
<div>
|
||||
<Myheader></Myheader>
|
||||
|
||||
<div class="rc-header">
|
||||
<div class="rc-top"></div>
|
||||
<div class="rc-layout-container rc-one-column rc-max-width--xl">
|
||||
<div class="rc-main">
|
||||
<div class="rc-receiving">
|
||||
<em>{{userisdelivery}}</em>
|
||||
|
||||
@@ -6,9 +6,47 @@
|
||||
<tabs></tabs>
|
||||
<div class="online" ></div>
|
||||
<div class="rc-top"></div>
|
||||
<div class="rc-usermain ts-product-detail">
|
||||
<div class="rc-usermain ts-product-detail rc-max-width--xl rc-layout-container rc-two-column rc-border-bottom rc-border-colour--brand4">
|
||||
<!--
|
||||
<magnifier v-bind:parentmsg="msg" ></magnifier>
|
||||
<div class="ts-product-header" >
|
||||
-->
|
||||
<div class="rc-column">
|
||||
<div data-js-carousel="" data-image-gallery="true">
|
||||
<div class="rc-carousel rc-carousel__gallery-image" data-zoom-container="328b2e5f-6904-4cac-9709-51ed18d2500f" data-zoom-factor="2">
|
||||
<!-- Big images-->
|
||||
<div>
|
||||
<div>
|
||||
<img src="https://cdn.royalcanin-weshare-online.io/m2kia2QBG95Xk-RBC8jn/v1/medium-maxi-giant-pos-2012-packshots-ma-ad-shn-packshot?w=420&fm=jpg&auto=compress" alt="Product alt text" />
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div>
|
||||
<div>
|
||||
<img src="https://cdn.royalcanin-weshare-online.io/m2kia2QBG95Xk-RBC8jn/v1/medium-maxi-giant-pos-2012-packshots-ma-ad-shn-packshot?w=420&fm=jpg&auto=compress" alt="Product alt text" />
|
||||
</div>
|
||||
</div>
|
||||
<!-- Big images end-->
|
||||
</div>
|
||||
<div class="rc-carousel__gallery-thumbnails-wrapper">
|
||||
<div class="rc-carousel rc-carousel__gallery-thumbnails">
|
||||
<!-- Thunb images-->
|
||||
<div class="rc-carousel__gallery-thumbnail">
|
||||
<figure class="rc-img--square" style="background-image: url('https://cdn.royalcanin-weshare-online.io/m2kia2QBG95Xk-RBC8jn/v1/medium-maxi-giant-pos-2012-packshots-ma-ad-shn-packshot?w=64&fm=jpg&auto=compress')">
|
||||
<figcaption class="rc-screen-reader-text">Product caption text</figcaption>
|
||||
</figure>
|
||||
</div>
|
||||
<div class="rc-carousel__gallery-thumbnail">
|
||||
<figure class="rc-img--square" style="background-image: url('https://cdn.royalcanin-weshare-online.io/UCEUa2QBaxEApS7L_-Xz/v2/fbn-2013-graphiccodes-packshots-siam-ad-int-fbn-packshot?w=64&fm=jpg&auto=compress')">
|
||||
<figcaption class="rc-screen-reader-text">Product caption text</figcaption>
|
||||
</figure>
|
||||
</div>
|
||||
<!-- Thunb images end-->
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div class="ts-product-header rc-column" id="328b2e5f-6904-4cac-9709-51ed18d2500f">
|
||||
<div class="usermain">
|
||||
<div class="online bold rc-md-down"></div>
|
||||
<div class="rc-main">
|
||||
@@ -29,7 +67,7 @@
|
||||
<i class="ts-row-title">活动促销：</i>
|
||||
<span>全场商品限时优惠</span>
|
||||
</div>
|
||||
<em @click="userget()">立即领取</em>
|
||||
<em class="ts-right-arr" @click="userget()">立即领取</em>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
@@ -91,9 +129,10 @@
|
||||
<span @click="usertanchu(item,1)">立即购买</span>
|
||||
</div>
|
||||
</div>
|
||||
<div class="online bold rc-md-down"></div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
</div>
|
||||
|
||||
</div>
|
||||
</div>
|
||||
<div class="rc-footimage rc-main">
|
||||
|
||||
@@ -1,18 +1,24 @@
|
||||
// <!-- -->
|
||||
<template>
|
||||
|
||||
<div class="container">
|
||||
<!-- <Myheader/> -->
|
||||
<div class="container rc-full-width">
|
||||
<Myheader></Myheader>
|
||||
|
||||
<p class="header">账号注册</p>
|
||||
<div class="content">
|
||||
<van-field
|
||||
v-model="tel"
|
||||
placeholder="请输入手机号"
|
||||
:error-message="usertel"
|
||||
class="van-field-one"
|
||||
clearable
|
||||
/>
|
||||
<div class="content ts-max-width--460">
|
||||
<h2 class="rc-beta rc-text--center">账号注册</h2>
|
||||
|
||||
<div class="rc-layout-container rc-one-column">
|
||||
<div class="rc-column">
|
||||
<input
|
||||
class="ts-standard-input"
|
||||
v-model="tel"
|
||||
placeholder="请输入手机号"
|
||||
:error-message="usertel"
|
||||
v-if="!ifpassword"
|
||||
clearable
|
||||
/>
|
||||
</div>
|
||||
</div>
|
||||
<!-- <van-field
|
||||
v-model="password"
|
||||
type="password"
|
||||
@@ -21,34 +27,70 @@
|
||||
|
||||
clearable
|
||||
/> -->
|
||||
<van-field
|
||||
class="van-field-two"
|
||||
v-model="sms"
|
||||
center
|
||||
clearable
|
||||
placeholder="请输入验证码"
|
||||
|
||||
>
|
||||
<!-- :error-message="test" -->
|
||||
<div class="rc-layout-container rc-two-column">
|
||||
<div class="rc-column">
|
||||
<input
|
||||
v-if="!ifpassword"
|
||||
v-model="sms"
|
||||
class="ts-standard-input ts-standard-input--two center"
|
||||
center
|
||||
clearable
|
||||
placeholder="请输入验证码"
|
||||
|
||||
>
|
||||
</div>
|
||||
<div class="rc-column">
|
||||
<button
|
||||
:disabled="flag"
|
||||
slot="button"
|
||||
size="small"
|
||||
@click="sendCode"
|
||||
class="rc-use ts-standard-btn ts-standard-btn--two"
|
||||
>{{ buttonmsg }}</button
|
||||
>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
|
||||
<van-button :disabled="flag" slot="button" size="small" @click="sendCode" class="rc-use">{{ buttonmsg }}</van-button>
|
||||
|
||||
</van-field>
|
||||
<div class="usecheck">
|
||||
<input type="checkBox" style="width:24px;height:24px" @click="checkBox()">我已阅读同意隐私声明和账号使用协议
|
||||
</div>
|
||||
<div class="rc-layout-container rc-one-column">
|
||||
<div class="usecheck rc-column rc-text--left">
|
||||
<label>
|
||||
<input
|
||||
type="checkbox"
|
||||
@click="checkBox()"
|
||||
style="width: 24px; height: 24px"
|
||||
v-model="inRank"
|
||||
/>我已阅读同意隐私声明和账号使用协议
|
||||
</label>
|
||||
</div>
|
||||
</div>
|
||||
<div class="rc-layout-container rc-two-column rc-button">
|
||||
<div class="rc-column rc-text--left">
|
||||
<a href="#" class="rc-styled-link"><span>隐私政策</span></a>
|
||||
</div>
|
||||
<div class="rc-column rc-text--right">
|
||||
<nuxt-link :to="`/userlogin/login/`" class="rc-styled-link">
|
||||
<span>返回登录</span>
|
||||
</nuxt-link>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div class="rc-user">
|
||||
<van-button type="primary" :loading="loading" loading-text="登录..." size="large" :disabled="zhud" @click="register()" class="userbutton" >注册</van-button>
|
||||
<!-- <van-divider @click="toLogin">注册账户</van-divider> -->
|
||||
</div>
|
||||
|
||||
|
||||
<div class="rc-layout-container rc-one-column">
|
||||
<div class="rc-column">
|
||||
<input
|
||||
type="primary"
|
||||
:loading="loading"
|
||||
loading-text="注册中..."
|
||||
size="large"
|
||||
:disabled="zhud"
|
||||
@click="register()"
|
||||
class="ts-standard-btn ts-standard-btn--max-width"
|
||||
value="注册"
|
||||
></input
|
||||
>
|
||||
<!-- <van-divider @click="toLogin">注册账户</van-divider> -->
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
|
||||
|
||||
</div>
|
||||
</template>
|
||||
|
||||
@@ -285,291 +327,7 @@ export default {
|
||||
}
|
||||
|
||||
</script>
|
||||
<style lang="less" scoped>
|
||||
@media screen and(min-width: 320px) and(max-width:768px) {
|
||||
.van-field-one{
|
||||
width: 335px;
|
||||
background: #F6F6F6;
|
||||
border-radius: 4px;
|
||||
margin: 0 auto;
|
||||
}
|
||||
.van-field-two{
|
||||
margin: 0 auto;
|
||||
width: 335px;
|
||||
height: 48px;
|
||||
background: #F6F6F6;
|
||||
margin: 0 auto;
|
||||
border-radius: 4px;
|
||||
margin-top: 24px;
|
||||
}
|
||||
.usecheck{
|
||||
display: flex;
|
||||
text-align: left;
|
||||
width: 335px;
|
||||
margin: 0 auto;
|
||||
align-items: center;
|
||||
margin-top: 18px;
|
||||
|
||||
}
|
||||
.container {
|
||||
|
||||
font-size: 0.1rem;
|
||||
.van-field__body {
|
||||
border-bottom: 1px solid red;
|
||||
}
|
||||
.content {
|
||||
margin-top: 24px;
|
||||
}
|
||||
.userfoget {
|
||||
font-size: 14px;
|
||||
color: #333333;
|
||||
border-bottom: 1px solid #333333;
|
||||
margin-left: 20px;
|
||||
}
|
||||
.rc-header {
|
||||
text-align: center;
|
||||
}
|
||||
.rc-header span:first-of-type {
|
||||
margin-right: 60px;
|
||||
}
|
||||
.rc-header span:last-child {
|
||||
margin-right: 20px;
|
||||
}
|
||||
.active {
|
||||
font-size: 18px;
|
||||
color: #666666;
|
||||
}
|
||||
.unactive {
|
||||
font-size: 18px;
|
||||
color: #999999;
|
||||
}
|
||||
.rc-use {
|
||||
width: 155px;
|
||||
height: 48px;
|
||||
opacity: 1;
|
||||
border-radius: 30px;
|
||||
outline: none;
|
||||
border: none;
|
||||
border: 2px solid #e1001a;
|
||||
color: #e1001a;
|
||||
font-size: 14px;
|
||||
}
|
||||
.rc-user {
|
||||
width: 100%;
|
||||
display: flex;
|
||||
align-items: center;
|
||||
margin-top: 40px;
|
||||
}
|
||||
.userbutton {
|
||||
width: 335px;
|
||||
height: 48px;
|
||||
background: #e2001a;
|
||||
opacity: 1;
|
||||
border-radius: 30px;
|
||||
outline: none;
|
||||
border: none;
|
||||
margin: 0 auto;
|
||||
}
|
||||
van-button {
|
||||
width: 335px;
|
||||
height: 48px;
|
||||
background: #e2001a;
|
||||
opacity: 1;
|
||||
border-radius: 30px;
|
||||
}
|
||||
.header {
|
||||
color: #333333;
|
||||
font-size: 30px;
|
||||
text-align: center;
|
||||
}
|
||||
input {
|
||||
border: none;
|
||||
outline: none;
|
||||
}
|
||||
button {
|
||||
outline: none;
|
||||
border: none;
|
||||
list-style: none;
|
||||
background: none;
|
||||
}
|
||||
.rc-center {
|
||||
font-size: 30px;
|
||||
color: #333333;
|
||||
text-align: center;
|
||||
}
|
||||
.rc-center input {
|
||||
color: #999999;
|
||||
font-size: 14px;
|
||||
}
|
||||
.userlogin {
|
||||
width: 92%;
|
||||
margin: 0 auto;
|
||||
}
|
||||
.rc-button {
|
||||
font-size: 14px;
|
||||
width:335px;
|
||||
display: flex;
|
||||
align-items: center;
|
||||
justify-content: space-between;
|
||||
margin: 0 auto;
|
||||
color: #333333;
|
||||
}
|
||||
.rc-button span {
|
||||
border-bottom: 1px solid #333333;
|
||||
}
|
||||
.rc-button span {
|
||||
margin-left: 20px;
|
||||
margin-top: 24px;
|
||||
}
|
||||
.rc-button span:last-child {
|
||||
margin-right: 20px;
|
||||
display: block;
|
||||
}
|
||||
}
|
||||
}
|
||||
// /* 最小768px最大1920 *pc端/
|
||||
@media screen and (min-width: 768px) and (max-width: 1920px) {
|
||||
.usecheck{
|
||||
display: flex;
|
||||
text-align: left;
|
||||
width: 395px;
|
||||
margin: 0 auto;
|
||||
align-items: center;
|
||||
margin-top: 18px;
|
||||
|
||||
}
|
||||
/deep/
|
||||
.van-field-one{
|
||||
width: 395px;
|
||||
height: 48px;
|
||||
background: #F6F6F6;
|
||||
border-radius: 4px;
|
||||
margin: 0 auto;
|
||||
}
|
||||
.van-field-two{
|
||||
margin: 0 auto;
|
||||
width: 395px;
|
||||
height: 48px;
|
||||
background: #F6F6F6;
|
||||
margin: 0 auto;
|
||||
border-radius: 4px;
|
||||
margin-top: 24px;
|
||||
}
|
||||
.container {
|
||||
// border: 1px solid red;
|
||||
.header {
|
||||
color: #333333;
|
||||
font-size: 0.4rem;
|
||||
text-align: center;
|
||||
}
|
||||
.content {
|
||||
margin-top: 24px;
|
||||
}
|
||||
.userfoget {
|
||||
font-size: 14px;
|
||||
color: #333333;
|
||||
border-bottom: 1px solid #333333;
|
||||
margin-left: 20px;
|
||||
}
|
||||
.rc-header {
|
||||
text-align: center;
|
||||
}
|
||||
.rc-header span:first-of-type {
|
||||
margin-right: 60px;
|
||||
}
|
||||
.rc-header span:last-child {
|
||||
margin-right: 20px;
|
||||
}
|
||||
.active {
|
||||
font-size: 0.1rem;
|
||||
color: #666666;
|
||||
}
|
||||
.unactive {
|
||||
font-size: 0.1rem;
|
||||
color: #999999;
|
||||
}
|
||||
.rc-use {
|
||||
width: 1.55rem;
|
||||
height: 0.48rem;
|
||||
opacity: 1;
|
||||
border-radius: 0.15rem;
|
||||
border: 2px solid #e1001a;
|
||||
color: #e1001a;
|
||||
font-size: 0.14rem;
|
||||
background: white;
|
||||
|
||||
}
|
||||
.rc-user {
|
||||
width: 100%;
|
||||
display: flex;
|
||||
align-items: center;
|
||||
margin-top: 40px;
|
||||
}
|
||||
.userbutton {
|
||||
width: 3.8rem;
|
||||
height: 0.48rem;
|
||||
background: #e2001a;
|
||||
border-radius: 0.15rem;
|
||||
outline: none;
|
||||
border: none;
|
||||
margin: 0 auto;
|
||||
}
|
||||
van-button {
|
||||
width: 335px;
|
||||
height: 48px;
|
||||
background: #e2001a;
|
||||
opacity: 1;
|
||||
border-radius: 30px;
|
||||
}
|
||||
|
||||
input {
|
||||
border: none;
|
||||
outline: none;
|
||||
}
|
||||
button {
|
||||
outline: none;
|
||||
border: none;
|
||||
list-style: none;
|
||||
background: none;
|
||||
}
|
||||
.rc-center {
|
||||
font-size: 30px;
|
||||
color: #333333;
|
||||
text-align: center;
|
||||
}
|
||||
.rc-center input {
|
||||
color: #999999;
|
||||
font-size: 14px;
|
||||
}
|
||||
.userlogin {
|
||||
width: 92%;
|
||||
margin: 0 auto;
|
||||
}
|
||||
.rc-button {
|
||||
font-size: 14px;
|
||||
width:395px;
|
||||
/* line-height: 0.85rem; */
|
||||
display: flex;
|
||||
align-items: center;
|
||||
justify-content: space-between;
|
||||
margin: 0 auto;
|
||||
|
||||
|
||||
color: #333333;
|
||||
}
|
||||
.rc-button span {
|
||||
border-bottom: 1px solid #333333;
|
||||
}
|
||||
.rc-button span {
|
||||
margin-left: 20px;
|
||||
margin-top: 24px;
|
||||
}
|
||||
.rc-button span:last-child {
|
||||
margin-right: 20px;
|
||||
display: block;
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
|
||||
<style lang="less" scoped>
|
||||
@import url("../../assets/css/global.less");
|
||||
@import url("../../assets/css/login.less");
|
||||
</style>
|
||||
@@ -1,32 +1,37 @@
|
||||
// <!-- -->
|
||||
<template>
|
||||
<div class="container">
|
||||
<!-- <Myheader/> -->
|
||||
<div class="container rc-full-width">
|
||||
<Myheader></Myheader>
|
||||
|
||||
<p class="header">{{ usertitle ? "账号登录" : "" }}</p>
|
||||
<div class="rc-header">
|
||||
<!-- <i>|</i> -->
|
||||
<span
|
||||
v-for="(item, index) in swiperData"
|
||||
:key="index"
|
||||
@click="selectGoods(item, index)"
|
||||
:class="activeIndex == index ? 'active' : 'unactive'"
|
||||
>{{ item.title }}</span
|
||||
>
|
||||
</div>
|
||||
<div class="content">
|
||||
<van-field
|
||||
class="van-field-one"
|
||||
v-model="tel"
|
||||
placeholder="请输入手机号"
|
||||
:error-message="usertel"
|
||||
v-if="!ifpassword"
|
||||
clearable
|
||||
/>
|
||||
|
||||
<van-field
|
||||
<div class="content ts-max-width--460">
|
||||
<h2 class="rc-beta rc-text--center">{{ usertitle ? "账号登录" : "" }}</h2>
|
||||
<!-- Deprecated : No tab switching as no password
|
||||
<div class="rc-header">
|
||||
<span
|
||||
v-for="(item, index) in swiperData"
|
||||
:key="index"
|
||||
@click="selectGoods(item, index)"
|
||||
:class="activeIndex == index ? 'active' : 'unactive'"
|
||||
>{{ item.title }}</span
|
||||
>
|
||||
</div>
|
||||
-->
|
||||
|
||||
<div class="rc-layout-container rc-one-column">
|
||||
<div class="rc-column">
|
||||
<input
|
||||
class="ts-standard-input"
|
||||
v-model="tel"
|
||||
placeholder="请输入手机号"
|
||||
:error-message="usertel"
|
||||
v-if="!ifpassword"
|
||||
clearable
|
||||
/>
|
||||
</div>
|
||||
</div>
|
||||
<!-- Deprecated : No tab switching as no password
|
||||
<input
|
||||
v-model="text"
|
||||
class="van-field-two"
|
||||
class="ts-standard-input ts-standard-input--two"
|
||||
placeholder="请输入账号"
|
||||
|
||||
v-if="ifpassword"
|
||||
@@ -41,53 +46,72 @@
|
||||
v-if="ifpassword"
|
||||
clearable
|
||||
/>
|
||||
<van-field
|
||||
v-if="!ifpassword"
|
||||
v-model="sms"
|
||||
class="van-field-two"
|
||||
center
|
||||
clearable
|
||||
placeholder="请输入验证码"
|
||||
|
||||
>
|
||||
<van-button
|
||||
:disabled="flag"
|
||||
slot="button"
|
||||
size="small"
|
||||
@click="sendCode"
|
||||
class="rc-use"
|
||||
>{{ buttonmsg }}</van-button
|
||||
>
|
||||
</van-field>
|
||||
<div class="usecheck">
|
||||
<input
|
||||
type="checkbox"
|
||||
@click="checkBox()"
|
||||
style="width: 24px; height: 24px"
|
||||
v-model="inRank"
|
||||
/>我已阅读同意隐私声明和账号使用协议
|
||||
</div>
|
||||
<div class="rc-button">
|
||||
<span>隐私政策</span>
|
||||
<nuxt-link :to="`/userlogin/edit/`">
|
||||
<span>注册账户</span>
|
||||
</nuxt-link>
|
||||
</div>
|
||||
<div class="rc-user">
|
||||
<van-button
|
||||
type="primary"
|
||||
:loading="loading"
|
||||
loading-text="登录..."
|
||||
size="large"
|
||||
:disabled="zhud"
|
||||
@click="register()"
|
||||
class="userbutton"
|
||||
>登录</van-button
|
||||
>
|
||||
<!-- <van-divider @click="toLogin">注册账户</van-divider> -->
|
||||
</div>
|
||||
-->
|
||||
<div class="rc-layout-container rc-two-column">
|
||||
<div class="rc-column">
|
||||
<input
|
||||
v-if="!ifpassword"
|
||||
v-model="sms"
|
||||
class="ts-standard-input ts-standard-input--two center"
|
||||
center
|
||||
clearable
|
||||
placeholder="请输入验证码"
|
||||
|
||||
>
|
||||
</div>
|
||||
<div class="rc-column">
|
||||
<button
|
||||
:disabled="flag"
|
||||
slot="button"
|
||||
size="small"
|
||||
@click="sendCode"
|
||||
class="rc-use ts-standard-btn ts-standard-btn--two"
|
||||
>{{ buttonmsg }}</button
|
||||
>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div class="rc-layout-container rc-one-column">
|
||||
<div class="usecheck rc-column rc-text--left">
|
||||
<label>
|
||||
<input
|
||||
type="checkbox"
|
||||
@click="checkBox()"
|
||||
style="width: 24px; height: 24px"
|
||||
v-model="inRank"
|
||||
/>我已阅读同意隐私声明和账号使用协议
|
||||
</label>
|
||||
</div>
|
||||
</div>
|
||||
<div class="rc-layout-container rc-two-column rc-button">
|
||||
<div class="rc-column rc-text--left">
|
||||
<a href="#" class="rc-styled-link"><span>隐私政策</span></a>
|
||||
</div>
|
||||
<div class="rc-column rc-text--right">
|
||||
<nuxt-link :to="`/userlogin/edit/`" class="rc-styled-link">
|
||||
<span>注册账户</span>
|
||||
</nuxt-link>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div class="rc-layout-container rc-one-column">
|
||||
<div class="rc-column">
|
||||
<input
|
||||
type="primary"
|
||||
:loading="loading"
|
||||
loading-text="登录..."
|
||||
size="large"
|
||||
:disabled="zhud"
|
||||
@click="register()"
|
||||
class="ts-standard-btn ts-standard-btn--max-width"
|
||||
value="登录"
|
||||
></input
|
||||
>
|
||||
<!-- <van-divider @click="toLogin">注册账户</van-divider> -->
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</template>
|
||||
|
||||
|
||||
@@ -126,7 +150,7 @@ export default {
|
||||
};
|
||||
},
|
||||
components: {
|
||||
// Myheader,
|
||||
Myheader
|
||||
},
|
||||
computed: {
|
||||
usertel() {
|
||||
@@ -350,286 +374,6 @@ export default {
|
||||
};
|
||||
</script>
|
||||
<style lang="less" scoped>
|
||||
// 手机端
|
||||
@media screen and(min-width: 320px) and(max-width:768px) {
|
||||
|
||||
.van-field-one{
|
||||
width: 335px;
|
||||
background: #F6F6F6;
|
||||
border-radius: 4px;
|
||||
margin: 0 auto;
|
||||
}
|
||||
.van-field-two{
|
||||
margin: 0 auto;
|
||||
width: 335px;
|
||||
height: 48px;
|
||||
background: #F6F6F6;
|
||||
margin: 0 auto;
|
||||
border-radius: 4px;
|
||||
margin-top: 24px;
|
||||
}
|
||||
.usecheck{
|
||||
display: flex;
|
||||
text-align: left;
|
||||
width: 335px;
|
||||
margin: 0 auto;
|
||||
align-items: center;
|
||||
margin-top: 18px;
|
||||
|
||||
}
|
||||
.container {
|
||||
font-size: 0.1rem;
|
||||
.van-field__body {
|
||||
border-bottom: 1px solid red;
|
||||
}
|
||||
.content {
|
||||
margin-top: 24px;
|
||||
}
|
||||
.userfoget {
|
||||
font-size: 14px;
|
||||
color: #333333;
|
||||
border-bottom: 1px solid #333333;
|
||||
margin-left: 20px;
|
||||
}
|
||||
.rc-header {
|
||||
text-align: center;
|
||||
}
|
||||
.rc-header span:first-of-type {
|
||||
margin-right: 60px;
|
||||
}
|
||||
.rc-header span:last-child {
|
||||
margin-right: 20px;
|
||||
}
|
||||
.active {
|
||||
font-size: 18px;
|
||||
color: #666666;
|
||||
}
|
||||
.unactive {
|
||||
font-size: 18px;
|
||||
color: #999999;
|
||||
}
|
||||
.rc-use {
|
||||
width: 155px;
|
||||
height: 48px;
|
||||
opacity: 1;
|
||||
border-radius: 30px;
|
||||
outline: none;
|
||||
border: none;
|
||||
border: 2px solid #e1001a;
|
||||
color: #e1001a;
|
||||
font-size: 14px;
|
||||
}
|
||||
.rc-user {
|
||||
width: 100%;
|
||||
display: flex;
|
||||
align-items: center;
|
||||
margin-top: 40px;
|
||||
}
|
||||
.userbutton {
|
||||
width: 335px;
|
||||
height: 48px;
|
||||
background: #e2001a;
|
||||
opacity: 1;
|
||||
border-radius: 30px;
|
||||
outline: none;
|
||||
border: none;
|
||||
margin: 0 auto;
|
||||
}
|
||||
van-button {
|
||||
width: 335px;
|
||||
height: 48px;
|
||||
background: #e2001a;
|
||||
opacity: 1;
|
||||
border-radius: 30px;
|
||||
}
|
||||
.header {
|
||||
color: #333333;
|
||||
font-size: 30px;
|
||||
text-align: center;
|
||||
}
|
||||
input {
|
||||
border: none;
|
||||
outline: none;
|
||||
}
|
||||
button {
|
||||
outline: none;
|
||||
border: none;
|
||||
list-style: none;
|
||||
background: none;
|
||||
}
|
||||
.rc-center {
|
||||
font-size: 30px;
|
||||
color: #333333;
|
||||
text-align: center;
|
||||
}
|
||||
.rc-center input {
|
||||
color: #999999;
|
||||
font-size: 14px;
|
||||
}
|
||||
.userlogin {
|
||||
width: 92%;
|
||||
margin: 0 auto;
|
||||
}
|
||||
.rc-button {
|
||||
font-size: 14px;
|
||||
width:335px;
|
||||
display: flex;
|
||||
align-items: center;
|
||||
justify-content: space-between;
|
||||
margin: 0 auto;
|
||||
color: #333333;
|
||||
}
|
||||
.rc-button span {
|
||||
border-bottom: 1px solid #333333;
|
||||
}
|
||||
.rc-button span {
|
||||
margin-left: 20px;
|
||||
margin-top: 24px;
|
||||
}
|
||||
.rc-button span:last-child {
|
||||
margin-right: 20px;
|
||||
display: block;
|
||||
}
|
||||
}
|
||||
}
|
||||
// /* 最小768px最大1920 *pc端/
|
||||
@media screen and (min-width: 768px) and (max-width: 1920px) {
|
||||
.usecheck{
|
||||
display: flex;
|
||||
text-align: left;
|
||||
width: 395px;
|
||||
margin: 0 auto;
|
||||
align-items: center;
|
||||
margin-top: 18px;
|
||||
|
||||
}
|
||||
/deep/
|
||||
.van-field-one{
|
||||
width: 395px;
|
||||
height: 48px;
|
||||
background: #F6F6F6;
|
||||
border-radius: 4px;
|
||||
margin: 0 auto;
|
||||
}
|
||||
.van-field-two{
|
||||
margin: 0 auto;
|
||||
width: 395px;
|
||||
height: 48px;
|
||||
background: #F6F6F6;
|
||||
margin: 0 auto;
|
||||
border-radius: 4px;
|
||||
margin-top: 24px;
|
||||
}
|
||||
.container {
|
||||
// border: 1px solid red;
|
||||
.header {
|
||||
color: #333333;
|
||||
font-size: 0.4rem;
|
||||
text-align: center;
|
||||
}
|
||||
.content {
|
||||
margin-top: 24px;
|
||||
}
|
||||
.userfoget {
|
||||
font-size: 14px;
|
||||
color: #333333;
|
||||
border-bottom: 1px solid #333333;
|
||||
margin-left: 20px;
|
||||
}
|
||||
.rc-header {
|
||||
text-align: center;
|
||||
}
|
||||
.rc-header span:first-of-type {
|
||||
margin-right: 60px;
|
||||
}
|
||||
.rc-header span:last-child {
|
||||
margin-right: 20px;
|
||||
}
|
||||
.active {
|
||||
font-size: 0.1rem;
|
||||
color: #666666;
|
||||
}
|
||||
.unactive {
|
||||
font-size: 0.1rem;
|
||||
color: #999999;
|
||||
}
|
||||
.rc-use {
|
||||
width: 1.55rem;
|
||||
height: 0.48rem;
|
||||
opacity: 1;
|
||||
border-radius: 0.15rem;
|
||||
border: 2px solid #e1001a;
|
||||
color: #e1001a;
|
||||
font-size: 0.14rem;
|
||||
background: white;
|
||||
|
||||
}
|
||||
.rc-user {
|
||||
width: 100%;
|
||||
display: flex;
|
||||
align-items: center;
|
||||
margin-top: 40px;
|
||||
}
|
||||
.userbutton {
|
||||
width: 3.8rem;
|
||||
height: 0.48rem;
|
||||
background: #e2001a;
|
||||
border-radius: 0.15rem;
|
||||
outline: none;
|
||||
border: none;
|
||||
margin: 0 auto;
|
||||
}
|
||||
van-button {
|
||||
width: 335px;
|
||||
height: 48px;
|
||||
background: #e2001a;
|
||||
opacity: 1;
|
||||
border-radius: 30px;
|
||||
}
|
||||
|
||||
input {
|
||||
border: none;
|
||||
outline: none;
|
||||
}
|
||||
button {
|
||||
outline: none;
|
||||
border: none;
|
||||
list-style: none;
|
||||
background: none;
|
||||
}
|
||||
.rc-center {
|
||||
font-size: 30px;
|
||||
color: #333333;
|
||||
text-align: center;
|
||||
}
|
||||
.rc-center input {
|
||||
color: #999999;
|
||||
font-size: 14px;
|
||||
}
|
||||
.userlogin {
|
||||
width: 92%;
|
||||
margin: 0 auto;
|
||||
}
|
||||
.rc-button {
|
||||
font-size: 14px;
|
||||
width:395px;
|
||||
display: flex;
|
||||
align-items: center;
|
||||
justify-content: space-between;
|
||||
margin: 0 auto;
|
||||
color: #333333;
|
||||
}
|
||||
.rc-button span {
|
||||
border-bottom: 1px solid #333333;
|
||||
}
|
||||
.rc-button span {
|
||||
margin-left: 20px;
|
||||
margin-top: 24px;
|
||||
}
|
||||
.rc-button span:last-child {
|
||||
margin-right: 20px;
|
||||
display: block;
|
||||
}
|
||||
}
|
||||
}
|
||||
@import url("../../assets/css/global.less");
|
||||
@import url("../../assets/css/login.less");
|
||||
</style>
|
||||
Reference in New Issue
Block a user