This commit is contained in:
zmr900709 2020-06-11 08:43:51 +08:00
parent 82babef77f
commit dcb19f420f
29 changed files with 1819 additions and 11 deletions

View File

@ -0,0 +1,95 @@
<template>
<view class="notice">
<view v-for="(item,index) in notice">
<view class="time_notice">2020-05-14 20:11</view>
<view class="notice_view">
<image :src="item.url" mode="aspectFill" ></image>
<view class="text_view">{{item.content}}</view>
<view class="notice_list">
<text>查看详情</text>
<view> > </view>
</view>
</view>
</view>
</view>
</template>
<style lang="scss" scoped>
.notice {
background: #ECECEC;
.notice_view{
width: 690rpx;
height: 489rpx;
border-radius: 20rpx;
background: #fff;
margin: 0 auto;
}
.notice_view image{
height: 285rpx;
width: 100%;
border-radius: 20rpx 20rpx 0px 0px;
}
.text_view{
font-size:26rpx;
font-weight:400;
color:rgba(51,51,51,1);
margin: 28rpx 0 30rpx 0;
width: 643rpx;
margin: 0 auto;
text-align: left;
line-height: 40rpx;
}
.notice_view > view:nth-child(3){
height: 84rpx;
line-height: 84rpx;
border-top: 1px #F5F5F5 solid;
margin-top: 30rpx;
}
}
.time_notice{
text-align: center;
font-size:28rpx;
font-weight:400;
color:rgba(102,102,102,1);
padding: 26rpx 0 39rpx 0;
}
.notice_list{
text-align: left;
display: inline-block;
width: 100%;
position: relative;
padding: 0 25rpx;
margin: 0 auto;
display: block;
}
.notice_list > view{
text-align: right;
position: absolute;
right: 25rpx;
top: 0;
bottom: 0;
margin: auto;
}
</style>
<script>
export default {
name: "notice",
data() {
return {
notice : [
{
time : '2020-05-14 20:11',
content:'潮牌1折秒杀杨幂同款小白鞋今日43元送10000元大红包还有明星限量签名照',
url : '../../../pageE/static/mine/23.png'
},
{
time : '2020-05-14 20:11',
content:'潮牌1折秒杀杨幂同款小白鞋今日43元送10000元大红包还有明星限量签名照',
url : '../../../pageE/static/mine/23.png'
}
]
};
}
}
</script>

View File

@ -0,0 +1,80 @@
<template>
<view id="info_title">
<view>
<view class="url_info" v-for="(item,index) in list" :key="index">
<image :src="item.url"></image>
<text>{{item.text}}</text>
</view>
</view>
</view>
</template>
<style lang="scss" scoped>
.url_info{
width: 127rpx;
float: left;
flex:1;
}
.url_info image{
width: 84rpx;
height: 84rpx;
margin: 0 auto;
display: block;
margin-bottom: 16rpx;
}
.url_info text{
display: block;
text-align: center;
font-size:28rpx;
color:rgba(102,102,102,1);
}
.sousuo {
height: 113rpx;
border: 1px #f00 solid;
}
#info_title {
width: 620rpx;
margin: 0 auto;
padding: 37rpx 0;
}
#info_title > view {
overflow: hidden;
zoom: 1;
display:flex;
flex-wrap:wrap;
display: -webkit-flex; /* Safari */
}
</style>
<script>
export default {
name:"info_title",
data(){
return {
list: [{
id: 0,
url: '../../static/pageD/info(11).png',
text : '公告/资讯'
},
{
id: 0,
url: '../../static/pageD/info(6).png',
text : '活动消息'
},
{
id: 0,
url: '../../static/pageD/info(14).png',
text : '交易物流'
},
{
id: 0,
url: '../../static/pageD/info(15).png',
text : '关注消息'
},
],
}
}
}
</script>

View File

@ -0,0 +1,269 @@
<template>
<view class="login">
<view class="content">
<view class="title">手机登录</view>
<view class="labales">
<!-- <text></text> -->
<input type="tel" placeholder="手机号" />
</view>
<view class="labales">
<!-- <text></text> -->
<input type="tel" placeholder="请输入验证码" />
<text class="identifying">获取验证码</text>
</view>
<!-- 服务协议 -->
<view class="pact">
<view></view>
<text>我已详细阅读并同意</text>
<text class="pact_text">用户协议</text>
<text class="pact_text">隐私协议</text>
<text class="pact_text">使用协议</text>
<u-checkbox-group @change="checkboxGroupChange" size="27">
<u-checkbox @change="checkboxChange" v-model="item.checked" v-for="(item, index) in list" :key="index" :name="item.name"
shape="circle" size="14" active-color="#19BE6B"></u-checkbox>
</u-checkbox-group>
</view>
</view>
</view>
</template>
<script>
export default {
data() {
return {
list: [{
checked: false,
disabled: false
}],
value: '',
login: '登录',
show: false
};
},
methods: {
// checkbox
checkboxChange(e) {
//console.log(e);
},
// checkboxcheckbox-group
checkboxGroupChange(e) {
// console.log(e);
},
mask_u() {
this.show = !this.show
},
}
};
</script>
<style lang="scss" scoped>
.login {
// background: url(../../static/pageA/loginbackground.png) no-repeat!important;
.images {
position: fixed;
width: 100%;
height: 100%;
top: 0;
left: 0;
z-index: -1;
}
.backes {
background: rgba(0, 0, 0, 0.4);
position: fixed;
width: 100%;
height: 100%;
z-index: -1;
}
text {
z-index: 9;
color: #fff;
}
.more_Login {
overflow: hidden;
zoom: 1;
width: 630rpx;
margin: 0 auto;
}
.more_Login text {
display: inline-block;
width: 50%;
float: left;
font-size: 30rpx;
color: rgba(255, 255, 255, 1);
line-height: 36px;
margin: 97rpx 0;
}
.more_Login .other {
text-align: right;
}
}
.title {
font-size: 36rpx;
font-weight: bold;
margin-bottom: 150rpx;
color: #fff;
}
.uni-input-input,
.uni-input-placeholder {
color: #fff !important;
letter-spacing: 2rpx;
}
.pact text {
font-size: 22rpx;
font-weight: 400;
color: rgba(255, 255, 255, 1);
line-height: 36px;
}
.pact_text {
font-size: 22px;
font-weight: 400;
color: rgba(129, 188, 253, 1) !important;
line-height: 36px;
}
//
.pact {
position: relative;
padding-left: 40rpx;
overflow: hidden; //
text-overflow: ellipsis; //
white-space: nowrap; //
}
.u-checkbox-group {
position: absolute;
left: 0;
top: 0;
bottom: 0;
margin: auto;
}
.u-checkbox__icon--square {
border-radius: 50rpx !important;
width: 22rpx;
height: 22rpx;
}
.u-btn {
width: 628rpx;
height: 98rpx;
background: rgba(255, 120, 15, 1) !important;
border-radius: 49rpx;
margin: 0 auto;
font-size: 36rpx;
color: rgba(255, 255, 255, 1) !important;
line-height: 36px;
border: 1px #ff780f solid;
outline: none;
border-color: rgba(255, 120, 15, 1) !important;
}
.warp {
display: flex;
align-items: center;
justify-content: center;
height: 100%;
}
.rect {
width: 558rpx;
height: 300rpx;
background-color: #fff;
border-radius: 20rpx;
overflow: hidden;
zoom: 1;
position: relative;
display: flex;
flex-wrap: wrap;
display: -webkit-flex;
/* Safari */
.rect_view {
width: 100rpx;
height: 100rpx;
.image {
width: 45rpx;
height: 53rpx;
display: inline-block;
}
flex:1;
margin-top: 77rpx;
}
.rect_view:nth-child(2) image {
width: 57rpx;
height: 45rpx;
}
.rect_butoon {
width: 100%;
position: absolute;
bottom: 0;
height: 85rpx;
text-align: center;
line-height: 85rpx;
border-top: 1px #999999 solid;
}
view {
color: #666;
font-size: 24rpx;
margin-top: 30rpx;
}
}
.rect_view:nth-child(1) image,
.rect_view:nth-child(1) view {
float: right;
}
.rect_view:nth-child(1) image {
margin-right: 20rpx;
}
.rect_view:nth-child(1) {
position: relative;
margin-right: 79rpx;
}
.rect_view:nth-child(1) view {
position: absolute;
bottom: 0;
right: 0;
}
.rect_view:nth-child(2) image,
.rect_view:nth-child(2) view {
float: left;
}
.rect_view:nth-child(2) image {
margin-left: 20rpx;
}
.rect_view:nth-child(2) {
position: relative;
}
.rect_view:nth-child(2) view {
position: absolute;
bottom: 0;
left: 0;
}
</style>

View File

@ -7,13 +7,13 @@
<view class="content">
<view class="title">手机登录</view>
<view class="labales">
<text>手机号</text>
<input type="tel" placeholder="" />
<!-- <text></text> -->
<input type="tel" placeholder="手机号" />
</view>
<view class="labales">
<text>请输入验证码</text>
<input type="tel" placeholder="" />
<text class="identifying">获取验证码</text>
<!-- <text></text> -->
<input type="tel" placeholder="请输入验证码" />
<text class="identifying" @click="getCode">{{text}}</text>
</view>
<!-- 服务协议 -->
<view class="pact">
@ -62,6 +62,7 @@
disabled: false
}],
value: '',
text : '获取验证码',
login: '登录',
show: false
};
@ -78,6 +79,14 @@
mask_u(){
this.show = !this.show
},
//
getCode(){
console.log("11")
this.loading()
},
loading(){
}
}
};
</script>
@ -151,10 +160,13 @@
.labales {
border-bottom: 1px #fff solid;
margin-bottom: 90rpx;
height: 70rpx;
line-height: 70rpx;
}
.labales {
.labales:nth-child(3) {
position: relative;
margin-bottom: 10px;
}
.identifying {
@ -166,9 +178,13 @@
font-size: 30rpx;
font-weight: 500;
color: rgba(255, 120, 15, 1);
line-height: 36px;
line-height: 20px;
}
}
.uni-input-input, .uni-input-placeholder{
color:#fff!important;
letter-spacing: 2rpx;
}
.pact text {
font-size: 22rpx;
@ -188,6 +204,9 @@
.pact {
position: relative;
padding-left: 40rpx;
overflow:hidden; //
text-overflow:ellipsis; //
white-space:nowrap; //
}
.u-checkbox-group {
@ -298,7 +317,4 @@
bottom: 0;
left: 0;
}
uni-page-wrapper{
background: #fff;
}
</style>

310
pageA/register/register.vue Normal file
View File

@ -0,0 +1,310 @@
<template>
<!-- login页面 -->
<view>
<view class="login">
<image class="images" src="../../static/pageA/loginbackground.png"></image>
<view class="backes"></view>
<view class="content">
<view class="title">手机登录</view>
<view class="labales">
<!-- <text></text> -->
<input type="tel" placeholder="手机号" />
</view>
<view class="labales">
<!-- <text></text> -->
<input type="tel" placeholder="请输入验证码" />
<text class="identifying">获取验证码</text>
</view>
<!-- 服务协议 -->
<view class="pact">
<view></view>
<text>我已详细阅读并同意</text>
<text class="pact_text">用户协议</text>
<text class="pact_text">隐私协议</text>
<text class="pact_text">使用协议</text>
<u-checkbox-group @change="checkboxGroupChange" size="27">
<u-checkbox @change="checkboxChange" v-model="item.checked" v-for="(item, index) in list" :key="index" :name="item.name"
shape="circle" size="14" active-color="#19BE6B"></u-checkbox>
</u-checkbox-group>
</view>
</view>
<!-- 注册 -->
<view class="more_Login">
<text></text>
<text class="other" @click="mask_u">其他方式登录</text>
</view>
<!-- denglu QQ weixin -->
<u-button>{{login}}</u-button>
<u-mask :show="show" @click="show = false">
<view class="warp">
<view class="rect" @tap.stop>
<view class="rect_view">
<image src="../../static/pageA/qq.png" class="image"></image>
<view>QQ登录</view>
</view>
<view class="rect_view">
<image src="../../static/pageA/weixin.png" class="image" ></image>
<view>微信登录</view>
</view>
<view class="rect_butoon" @click="show = false">取消</view>
</view>
</view>
</u-mask>
</view>
</view>
</template>
<script>
export default {
data() {
return {
list: [{
checked: false,
disabled: false
}],
value: '',
login: '登录',
show: false
};
},
methods: {
// checkbox
checkboxChange(e) {
//console.log(e);
},
// checkboxcheckbox-group
checkboxGroupChange(e) {
// console.log(e);
},
mask_u(){
this.show = !this.show
},
}
};
</script>
<style lang="scss" scoped>
.login {
// background: url(../../static/pageA/loginbackground.png) no-repeat!important;
.images {
position: fixed;
width: 100%;
height: 100%;
top: 0;
left: 0;
z-index: -1;
}
.backes {
background: rgba(0, 0, 0, 0.4);
position: fixed;
width: 100%;
height: 100%;
z-index: -1;
}
text {
z-index: 9;
color: #fff;
}
.more_Login {
overflow: hidden;
zoom: 1;
width: 630rpx;
margin: 0 auto;
}
.more_Login text {
display: inline-block;
width: 50%;
float: left;
font-size: 30rpx;
color: rgba(255, 255, 255, 1);
line-height: 36px;
margin: 97rpx 0;
}
.more_Login .other {
text-align: right;
}
}
.title {
font-size: 36rpx;
font-weight: bold;
margin-bottom: 150rpx;
color: #fff;
}
.content {
width: 630rpx;
z-index: 99999;
margin: 0 auto;
padding-top: 130rpx;
.labales text {
font-size: 30rpx;
}
.labales {
border-bottom: 1px #fff solid;
margin-bottom: 90rpx;
height: 70rpx;
line-height: 70rpx;
}
.labales {
position: relative;
}
.identifying {
position: absolute;
right: 0;
top: 0;
bottom: 0;
margin: auto;
font-size: 30rpx;
font-weight: 500;
color: rgba(255, 120, 15, 1);
line-height: 20px;
}
}
.uni-input-input, .uni-input-placeholder{
color:#fff!important;
letter-spacing: 2rpx;
}
.pact text {
font-size: 22rpx;
font-weight: 400;
color: rgba(255, 255, 255, 1);
line-height: 36px;
}
.pact_text {
font-size: 22px;
font-weight: 400;
color: rgba(129, 188, 253, 1) !important;
line-height: 36px;
}
//
.pact {
position: relative;
padding-left: 40rpx;
overflow:hidden; //
text-overflow:ellipsis; //
white-space:nowrap; //
}
.u-checkbox-group {
position: absolute;
left: 0;
top: 0;
bottom: 0;
margin: auto;
}
.u-checkbox__icon--square {
border-radius: 50rpx !important;
width: 22rpx;
height: 22rpx;
}
.u-btn {
width: 628rpx;
height: 98rpx;
background: rgba(255, 120, 15, 1) !important;
border-radius: 49rpx;
margin: 0 auto;
font-size: 36rpx;
color: rgba(255, 255, 255, 1) !important;
line-height: 36px;
border: 1px #ff780f solid;
outline: none;
border-color: rgba(255, 120, 15, 1) !important;
}
.warp {
display: flex;
align-items: center;
justify-content: center;
height: 100%;
}
.rect {
width: 558rpx;
height: 300rpx;
background-color: #fff;
border-radius: 20rpx;
overflow: hidden;
zoom: 1;
position: relative;
display: flex;
flex-wrap:wrap;
display: -webkit-flex; /* Safari */
.rect_view{
width: 100rpx;
height: 100rpx;
.image{
width: 45rpx;
height: 53rpx;
display: inline-block;
}
flex:1;
margin-top: 77rpx;
}
.rect_view:nth-child(2) image{
width: 57rpx;
height: 45rpx;
}
.rect_butoon{
width: 100%;
position: absolute;
bottom: 0;
height: 85rpx;
text-align: center;
line-height: 85rpx;
border-top: 1px #999999 solid;
}
view{
color: #666;
font-size:24rpx;
margin-top: 30rpx;
}
}
.rect_view:nth-child(1) image,.rect_view:nth-child(1) view{
float: right;
}
.rect_view:nth-child(1) image{
margin-right: 20rpx;
}
.rect_view:nth-child(1){
position: relative;
margin-right: 79rpx;
}
.rect_view:nth-child(1) view{
position: absolute;
bottom: 0;
right: 0;
}
.rect_view:nth-child(2) image,.rect_view:nth-child(2) view{
float: left;
}
.rect_view:nth-child(2) image{
margin-left: 20rpx;
}
.rect_view:nth-child(2){
position: relative;
}
.rect_view:nth-child(2) view{
position: absolute;
bottom: 0;
left: 0;
}
</style>

349
pageA/topick/topick.vue Normal file
View File

@ -0,0 +1,349 @@
<template>
<!-- login页面 -->
<view>
<view class="login">
<image class="images" src="../../static/pageA/topick.jpg"></image>
<view class="backes"></view>
<view class="content">
<view class="title">开启个性化定制</view>
<view class="title_two">你的兴趣频道</view>
</view>
<!-- 标签 -->
<view class="tab_lable">
<view :class="{'cur': rSelect.indexOf(index)!=-1}" v-for="(item,index) in tab_lables" :key="index" @click="tapClick(index)">{{item}}</view>
</view>
<!-- 提交按钮 -->
<view class="submites">{{submites}}</view>
</view>
</view>
</template>
<script>
export default {
data() {
return {
list: [{
checked: false,
disabled: false
}],
value: '',
login: '登录',
show: false,
tab_lables: ["科技", "科技", "科技", "科技", "科技", "科技", "科技", "科技", "科技", "科技"],
submites: '选好了进入首页',
rSelect:[]
};
},
methods: {
// checkbox
checkboxChange(e) {
//console.log(e);
},
// checkboxcheckbox-group
checkboxGroupChange(e) {
// console.log(e);
},
mask_u() {
this.show = !this.show
},
//
tapClick(index) {
console.log(index)
if (this.rSelect.indexOf(index) == -1) {
console.log(index) //
this.rSelect.push(index); //
} else {
this.rSelect.splice(this.rSelect.indexOf(index), 1); //
}
}
}
};
</script>
<style lang="scss" scoped>
.tab_lable {
// display:flex;
// flex-wrap:wrap;
// display: -webkit-flex; /* Safari */
}
.tab_lable>view {
height: 76rpx;
background: rgba(239, 240, 244, 1);
border-radius: 35rpx;
color: #fff;
text-align: center;
line-height: 76rpx;
float: left;
margin-left: 40rpx;
margin-bottom: 50rpx;
flex: 1;
width: 200rpx;
font-weight: 400;
color: rgba(102, 102, 102, 1);
}
//
.submites {
width: 628rpx;
height: 98rpx;
line-height: 98rpx;
background: rgba(255, 120, 15, 1);
border-radius: 49rpx;
position: fixed;
bottom: 87rpx;
left: 0;
right: 0;
margin: auto;
font-size: 36rpx;
font-weight: bold;
color: rgba(255, 255, 255, 1);
line-height: 98rpx;
text-align: center;
}
.login {
// background: url(../../static/pageA/loginbackground.png) no-repeat!important;
.images {
position: fixed;
width: 100%;
height: 100%;
top: 0;
left: 0;
z-index: -1;
}
.backes {
background: rgba(255, 355, 255, 0.8);
position: fixed;
width: 100%;
height: 100%;
z-index: -1;
}
text {
z-index: 9;
color: #fff;
}
.more_Login {
overflow: hidden;
zoom: 1;
width: 630rpx;
margin: 0 auto;
}
.more_Login text {
display: inline-block;
width: 50%;
float: left;
font-size: 30rpx;
color: rgba(255, 255, 255, 1);
line-height: 36px;
margin: 97rpx 0;
}
.more_Login .other {
text-align: right;
}
}
.title {
font-size: 36rpx;
font-weight: bold;
color: #fff;
font-weight: bold;
color: rgba(51, 51, 51, 1);
font-size: 54rpx;
}
.title_two {
margin: 39rpx 0 43rpx 0;
font-size: 30rpx;
font-weight: bold;
color: rgba(51, 51, 51, 1);
}
.content {
width: 630rpx;
z-index: 99999;
margin: 0 auto;
padding-top: 130rpx;
.labales text {
font-size: 30rpx;
}
.labales {
border-bottom: 1px #fff solid;
margin-bottom: 90rpx;
}
.labales {
position: relative;
}
.identifying {
position: absolute;
right: 0;
top: 0;
bottom: 0;
margin: auto;
font-size: 30rpx;
font-weight: 500;
color: rgba(255, 120, 15, 1);
line-height: 36px;
}
}
.pact text {
font-size: 22rpx;
font-weight: 400;
color: rgba(255, 255, 255, 1);
line-height: 36px;
}
.pact_text {
font-size: 22px;
font-weight: 400;
color: rgba(129, 188, 253, 1) !important;
line-height: 36px;
}
//
.pact {
position: relative;
padding-left: 40rpx;
}
.u-checkbox-group {
position: absolute;
left: 0;
top: 0;
bottom: 0;
margin: auto;
}
.u-checkbox__icon--square {
border-radius: 50rpx !important;
width: 22rpx;
height: 22rpx;
}
.u-btn {
width: 628rpx;
height: 98rpx;
background: rgba(255, 120, 15, 1) !important;
border-radius: 49rpx;
margin: 0 auto;
font-size: 36rpx;
color: rgba(255, 255, 255, 1) !important;
line-height: 36px;
border: 1px #ff780f solid;
outline: none;
border-color: rgba(255, 120, 15, 1) !important;
}
.warp {
display: flex;
align-items: center;
justify-content: center;
height: 100%;
}
.rect {
width: 558rpx;
height: 300rpx;
background-color: #fff;
border-radius: 20rpx;
overflow: hidden;
zoom: 1;
position: relative;
display: flex;
flex-wrap: wrap;
display: -webkit-flex;
/* Safari */
.rect_view {
width: 100rpx;
height: 100rpx;
.image {
width: 45rpx;
height: 53rpx;
display: inline-block;
}
flex:1;
margin-top: 77rpx;
}
.rect_view:nth-child(2) image {
width: 57rpx;
height: 45rpx;
}
.rect_butoon {
width: 100%;
position: absolute;
bottom: 0;
height: 85rpx;
text-align: center;
line-height: 85rpx;
border-top: 1px #999999 solid;
}
view {
color: #666;
font-size: 24rpx;
margin-top: 30rpx;
}
}
.rect_view:nth-child(1) image,
.rect_view:nth-child(1) view {
float: right;
}
.rect_view:nth-child(1) image {
margin-right: 20rpx;
}
.rect_view:nth-child(1) {
position: relative;
margin-right: 79rpx;
}
.rect_view:nth-child(1) view {
position: absolute;
bottom: 0;
right: 0;
}
.rect_view:nth-child(2) image,
.rect_view:nth-child(2) view {
float: left;
}
.rect_view:nth-child(2) image {
margin-left: 20rpx;
}
.rect_view:nth-child(2) {
position: relative;
}
.rect_view:nth-child(2) view {
position: absolute;
bottom: 0;
left: 0;
}
//
.cur {
background-color: #ff5d00!important;
color: #fff!important;
}
</style>

120
pageD/activity/activity.vue Normal file
View File

@ -0,0 +1,120 @@
<template>
<view id="actives">
<!-- 活动消息推送 -->
<view class="activity" v-for="(item, index) in actives" :key="index">
<view class="times">{{item.type}}</view>
<view class="content">
<view class="title">{{item.name}}</view>
<view class="images_about">
<image :src="item.url"></image>
<view>
<text>{{item.about}}</text>
</view>
</view>
</view>
</view>
</view>
</template>
<script>
export default {
data() {
return {
actives: [
{
url: '../../pageE/static/mine/1.png',
name: '百元趋势新品',
type: '2020-05-14 20:11',
about: '百搭休闲格纹裙!你值得有用!'
},
{
url: '../../pageE/static/mine/1.png',
name: '百元趋势新品',
type: '2020-05-14 20:11',
about: '百搭休闲格纹裙!你值得有用!'
},
{
url: '../../pageE/static/mine/1.png',
name: '百元趋势新品',
type: '2020-05-14 20:11',
about: '百搭休闲格纹裙!你值得有用!'
},
{
url: '../../pageE/static/mine/1.png',
name: '百元趋势新品',
type: '2020-05-14 20:11',
about: '百搭休闲格纹裙!你值得有用!'
},
{
url: '../../pageE/static/mine/1.png',
name: '百元趋势新品',
type: '2020-05-14 20:11',
about: '百搭休闲格纹裙!你值得有用!'
},
]
};
},
methods: {
titletext(){
console.log("22345")
}
},
components:{
}
};
</script>
<style lang="scss" scoped>
#actives{
background: #ECECEC;
height: 100%;
}
.activity{
.times{
width:100%;
font-size:28rpx;
font-weight:400;
color:rgba(102,102,102,1);
text-align: center;
padding: 39rpx 0 30rpx;
}
.content{
width:630rpx;
padding: 30rpx;
background:rgba(255,255,255,1);
border-radius:20rpx;
margin: 0 auto;
overflow: hidden;
image{
width: 137rpx;
height: 140rpx;
float: left;
}
.title{
font-size:30rpx;
color:rgba(51,51,51,1);
padding: 0rpx 0 19rpx;
}
.images_about{
overflow: hidden;
text{
display: table-cell;
height: 140rpx;
vertical-align: middle;
width: 400rpx;
padding-left: 15rpx;
line-height: 36rpx;
}
view{
display: inline-block;
float: left;
width:430rpx;
height:140rpx;
background:rgba(241,241,241,1);
}
}
}
}
</style>

View File

@ -0,0 +1,137 @@
<template>
<view class="attention">
<view class="attention_box" v-for="(item,index) in attention" :key="index">
<view>
<image :src="item.url"></image>
</view>
<view>{{item.name}}</view>
<view>状态{{item.type}}</view>
<view class="cur_two" @click="tapClick(index)" v-if = "item.about == 1">已关注</view>
<view class="cur" @click="tapClick(index)" v-else = "item.about == 2">未关注</view>
</view>
</view>
</template>
<script>
export default {
name: "attention",
data() {
return {
rSelect:[],
type : '未关注',
attention: [{
url: '../../pageE/static/mine/1.png',
name: '达人昵称',
type: '正在直播',
about: 1
},
{
url: '../../pageE/static/mine/1.png',
name: '达人昵称',
type: '正在直播',
about: 2
},
{
url: '../../pageE/static/mine/1.png',
name: '达人昵称',
type: '正在直播',
about: 1
},
{
url: '../../pageE/static/mine/1.png',
name: '达人昵称',
type: '正在直播',
about: 1
},
{
url: '../../pageE/static/mine/1.png',
name: '达人昵称',
type: '正在直播',
about: 1
}
]
};
},
methods: {
//
tapClick(index) {
console.log(index)
if (this.rSelect.indexOf(index) == -1) {
console.log(index) //
this.rSelect.push(index); //
} else {
this.rSelect.splice(this.rSelect.indexOf(index), 1); //
}
}
},
components: {
}
};
</script>
<style lang="scss" scoped>
.attention {
display: flex;
flex-wrap: wrap;
justify-content: initial;
padding: 30rpx 30rpx 0 30rpx;
border-top: 1px #ECECEC solid;
.attention_box:nth-child(3n+3){
margin-right: 0;
}
.attention_box {
width: 215rpx;
height: 282rpx;
background: rgba(255, 255, 255, 1);
box-shadow: 0px 3px 7px 0px rgba(153, 153, 153, 0.35);
border-radius: 10rpx;
margin-right: 24rpx;
margin-bottom: 33rpx;
float: left;
view image {
width: 80rpx;
height: 80rpx;
display: block;
margin: 24rpx auto 0;
}
view {
text-align: center;
}
view:nth-child(2) {
font-size: 26rpx;
font-weight: 400;
color: rgba(51, 51, 51, 1);
margin: 20rpx 0;
text-align: center;
}
view:nth-child(3) {
font-size: 22rpx;
font-family: PingFang SC;
font-weight: 400;
color: rgba(153, 153, 153, 1);
}
view:nth-child(4) {
width: 130rpx;
height: 50rpx;
line-height: 50rpx;
background: rgba(221, 221, 221, 1);
border-radius: 25rpx;
font-size: 26rpx;
color: rgba(255, 255, 255, 1);
margin: 19rpx auto;
}
}
}
//
.cur {
background-color: #ff5d00!important;
color: #fff!important;
}
</style>

View File

@ -0,0 +1,158 @@
<template>
<view>
<u-navbar :is-back="false" :title-size="36" title="消息">
<view class="slot-wrap">
<image src="../../static/pageD/info(3).png"></image>
<image src="../../static/pageD/info(2).png"></image>
</view>
</u-navbar>
<view class="content">
<!-- 正文内容 -->
</view>
<view class="sousuo"></view>
<view class="backes">
<titles></titles>
</view>
<!-- 消息通知 -->
<view class="backes">
<view id="information">
<view class="information_dl" v-for="(item,index) in information_dl">
<view>
<image :src="item.url"></image>
</view>
<view class="title">{{item.text}}</view>
<view class="contentes">{{item.contentes}}</view>
<view class="times">{{item.title}}</view>
</view>
</view>
</view>
</view>
</template>
<script>
import titles from "@/components/informations/titles/titles"
export default {
data() {
return {
//
information_dl: [{
id: 0,
url: '../../static/pageD/info(11).png',
text : '通知消息',
contentes : '亲,您购物车中的 [新鲜盆栽] 降价4.00元。',
title : '2020-7-21'
},
{
id: 0,
url: '../../static/pageD/info(11).png',
text : '通知消息',
contentes : '亲,您购物车中的 [新鲜盆栽] 降价4.00元。',
title : '2020-7-21'
},
{
id: 0,
url: '../../static/pageD/info(11).png',
text : '通知消息',
contentes : '亲,您购物车中的 [新鲜盆栽] 降价4.00元。',
title : '2020-7-21'
},
],
value: '',
login: '登录',
show: false
};
},
methods: {
// checkbox
checkboxChange(e) {
//console.log(e);
},
// checkboxcheckbox-group
checkboxGroupChange(e) {
// console.log(e);
},
mask_u() {
this.show = !this.show
},
},
components:{
titles,
}
};
</script>
<style lang="scss" scoped>
.sousuo {
height: 113rpx;
border: 1px #f00 solid;
}
.slot-wrap {
display: flex;
align-items: center;
/* 如果您想让slot内容占满整个导航栏的宽度 */
/* flex: 1; */
/* 如果您想让slot内容与导航栏左右有空隙 */
/* padding: 0 30rpx; */
image{
width: 60rpx;
height: 60rpx;
position: absolute;
right: 90rpx;
}
image:nth-child(2){
width: 34rpx;
height: 40rpx;
position: absolute;
right: 30rpx;
}
}
.backes{
background: #fff;
margin-bottom: 10rpx;
}
.information_dl{
width: 710rpx;
margin: 0 auto;
overflow: hidden;
zoom: 1;
position: relative;
padding-bottom: 23rpx;
border-bottom: 1px #ececec solid;
padding: 20rpx 5rpx 23rpx 5rpx;
image{
width: 84rpx;
height: 84rpx;
margin-right: 16rpx;
}
view{
float: left;
display: block;
}
.title{
font-size: 30rpx;
color: #333;
width: 600rpx;
margin-bottom: 15rpx;
margin-top: 9rpx;
}
.contentes{
font-size: 20rpx;
color: #999;
width: 600rpx;
}
}
.times{
position: absolute;
top: 30rpx;
right: 0;
color: #333333;
font-size:20rpx;
}
uni-page-wrapper{
}
page {
background: #ececec!important;
}
</style>

View File

@ -0,0 +1,156 @@
<template>
<view id="actives">
<!-- 活动消息推送 -->
<view class="activity" v-for="(item, index) in actives" :key="index">
<view class="times">{{item.type}}</view>
<view class="content">
<view class="store_name">
<image src="../../pageE/static/mine/1.png"></image>
<view>小时代</view>
</view>
<view class="xiantiao"></view>
<view class="title">{{item.name}}</view>
<view class="images_about">
<image :src="item.url"></image>
<view>
<text>{{item.about}}</text>
</view>
</view>
</view>
</view>
</view>
</template>
<script>
export default {
data() {
return {
actives: [
{
url: '../../pageE/static/mine/1.png',
name: '您的订单已发货',
type: '2020-05-14 20:11',
about: '百搭休闲格纹裙!你值得有用!'
},
{
url: '../../pageE/static/mine/1.png',
name: '百元趋势新品',
type: '2020-05-14 20:11',
about: '百搭休闲格纹裙!你值得有用!'
},
{
url: '../../pageE/static/mine/1.png',
name: '百元趋势新品',
type: '2020-05-14 20:11',
about: '百搭休闲格纹裙!你值得有用!'
},
{
url: '../../pageE/static/mine/1.png',
name: '百元趋势新品',
type: '2020-05-14 20:11',
about: '百搭休闲格纹裙!你值得有用!'
},
{
url: '../../pageE/static/mine/1.png',
name: '百元趋势新品',
type: '2020-05-14 20:11',
about: '百搭休闲格纹裙!你值得有用!'
},
]
};
},
methods: {
titletext(){
console.log("22345")
}
},
components:{
}
};
</script>
<style lang="scss" scoped>
#actives{
background: #ECECEC;
height: 100%;
}
.activity{
.times{
width:100%;
font-size:28rpx;
font-weight:400;
color:rgba(102,102,102,1);
text-align: center;
padding: 39rpx 0 30rpx;
}
.content{
width:630rpx;
padding: 30rpx;
background:rgba(255,255,255,1);
border-radius:20rpx;
margin: 0 auto;
overflow: hidden;
image{
width: 137rpx;
height: 140rpx;
float: left;
}
.title{
font-size:30rpx;
color:rgba(51,51,51,1);
padding: 0rpx 0 19rpx;
font-weight: bold;
}
.images_about{
overflow: hidden;
text{
display: table-cell;
height: 140rpx;
vertical-align: middle;
width: 400rpx;
padding-left: 15rpx;
line-height: 36rpx;
font-size: 26rpx;
}
view{
display: inline-block;
float: left;
width:430rpx;
height:140rpx;
background:rgba(241,241,241,1);
}
}
.content{
}
.xiantiao{
width: 630rpx;
border-top: 1px #ececec solid;
margin-left: -30rpx;
margin-bottom: 20rpx;
}
//
.store_name{
overflow: hidden;
zoom: 1;
padding: 0rpx 0 20rpx 0;
image{
width: 60rpx;
height: 60rpx;
border-radius: 50%;
float: left;
}
view{
font-size:26rpx;
color:rgba(51,51,51,1);
float: left;
display: table-cell;
line-height: 60rpx;
display: inline-block;
margin-left: 21rpx;
}
}
}
}
</style>

31
pageD/notice/notice.vue Normal file
View File

@ -0,0 +1,31 @@
<template>
<view>
<!-- 公告咨询 -->
<notice></notice>
</view>
</template>
<script>
import notice from "@/components/informations/notice/notice"
export default {
data() {
return {
};
},
methods: {
titletext(){
console.log("22345")
}
},
components:{
notice,
}
};
</script>
<style lang="scss" scoped>
.sousuo {
height: 113rpx;
border: 1px #f00 solid;
}
</style>

View File

@ -6,6 +6,9 @@
{
"root": "pageA",
"pages": [
{
"path": "topick/topick"
},
{
"path": "bindinges/bindinges",
"style": {
@ -39,7 +42,20 @@
"animationType": "slide-in-bottom"
}
}
},
{
"path": "register/register",
"style": {
"navigationBarTitleText": "",
"navigationStyle": "custom",
"app-plus": {
"titleNView": false,
"animationType": "slide-in-bottom"
}
}
}
]
},
{
@ -85,6 +101,77 @@
}
]
},
{
"root": "pageD",
"pages": [
{
"path": "logistics/logistics",
"style": {
"navigationBarTitleText": "交易物流 ",
"app-plus": {
"titleSize": "36px",
"titleColor": "#333333",
"titleNView": {
"backgroundColor": "#FFFFFF"
}
}
}
},
{
"path": "activity/activity",
"style": {
"navigationBarTitleText": "活动消息",
"app-plus": {
"titleSize": "36px",
"titleColor": "#333333",
"titleNView": {
"backgroundColor": "#FFFFFF"
}
}
}
},
{
"path": "attention/attention",
"style": {
"navigationBarTitleText": "关注消息",
"app-plus": {
"titleSize": "36px",
"titleColor": "#333333",
"titleNView": {
"backgroundColor": "#FFFFFF"
}
}
}
},
{
"path": "information/information",
"style": {
"navigationBarTitleText": "",
"navigationStyle": "custom",
"app-plus": {
"titleNView": false,
"animationType": "slide-in-bottom"
}
}
},
{
"path": "notice/notice",
"style": {
"navigationBarTitleText": "公告/咨询",
"app-plus": {
"titleSize": "36px",
"titleColor": "#333333",
"titleNView": {
"backgroundColor": "#FFFFFF"
}
}
}
}
]
},
{
"root": "pageE",
"pages":[

View File

Before

Width:  |  Height:  |  Size: 744 KiB

After

Width:  |  Height:  |  Size: 744 KiB

BIN
static/pageD/info(1).png Normal file

Binary file not shown.

After

Width:  |  Height:  |  Size: 3.4 KiB

BIN
static/pageD/info(10).png Normal file

Binary file not shown.

After

Width:  |  Height:  |  Size: 4.6 KiB

BIN
static/pageD/info(11).png Normal file

Binary file not shown.

After

Width:  |  Height:  |  Size: 5.2 KiB

BIN
static/pageD/info(12).png Normal file

Binary file not shown.

After

Width:  |  Height:  |  Size: 5.1 KiB

BIN
static/pageD/info(13).png Normal file

Binary file not shown.

After

Width:  |  Height:  |  Size: 3.3 KiB

BIN
static/pageD/info(14).png Normal file

Binary file not shown.

After

Width:  |  Height:  |  Size: 3.9 KiB

BIN
static/pageD/info(15).png Normal file

Binary file not shown.

After

Width:  |  Height:  |  Size: 4.6 KiB

BIN
static/pageD/info(16).png Normal file

Binary file not shown.

After

Width:  |  Height:  |  Size: 3.3 KiB

BIN
static/pageD/info(2).png Normal file

Binary file not shown.

After

Width:  |  Height:  |  Size: 4.9 KiB

BIN
static/pageD/info(3).png Normal file

Binary file not shown.

After

Width:  |  Height:  |  Size: 8.3 KiB

BIN
static/pageD/info(4).png Normal file

Binary file not shown.

After

Width:  |  Height:  |  Size: 6.0 KiB

BIN
static/pageD/info(5).png Normal file

Binary file not shown.

After

Width:  |  Height:  |  Size: 5.1 KiB

BIN
static/pageD/info(6).png Normal file

Binary file not shown.

After

Width:  |  Height:  |  Size: 4.9 KiB

BIN
static/pageD/info(7).png Normal file

Binary file not shown.

After

Width:  |  Height:  |  Size: 4.8 KiB

BIN
static/pageD/info(8).png Normal file

Binary file not shown.

After

Width:  |  Height:  |  Size: 3.9 KiB

BIN
static/pageD/info(9).png Normal file

Binary file not shown.

After

Width:  |  Height:  |  Size: 4.7 KiB