TmOct5/dtx_store
1
0
Fork 0
Code Issues Pull Requests Projects Releases Wiki Activity

修复展示问题等问题

Browse Source
This commit is contained in:
张冬雪
2022-08-12 14:49:06 +08:00
parent f2cb612887
commit 056be42456
14 changed files with 898 additions and 807 deletions
Download Patch File Download Diff File Expand all files Collapse all files

13
pages/store/goods.vue
View File

@@ -16,7 +16,7 @@
<!-- 详情 -->
<view class="main">
<view class="title"> {{goods.name}} </view>
<view class="sub-title">{{goods.description}}</view>
<view class="sub-title"><span class='vipType' v-if="shop_vip.messageTitle != ''">{{shop_vip.messageTitle}}</span>{{goods.description}}</view>
<view class="box-flex">
<view class="price">
{{goods.price.show}}<text>DT积分</text>
@@ -377,7 +377,7 @@
},
applyPin() {
uni.navigateTo({
url: '/pages/store/vip/success/success'
url: '/pages/group-book/success/success'
})
}
}
@@ -446,7 +446,14 @@
border-radius: $radius $radius 0 0;
box-shadow: 0 0 10rpx 10rpx rgba($color: #000000, $alpha: .02);
padding-bottom: ($padding*2) + 90;
.vipType{
color: #fff;
font-size:28rpx;
margin-right:10rpx;
padding: 2rpx 20rpx;
background-color: #ee8000;
border-radius: 20rpx 0 20rpx 0;
}
.hr {
position: relative;
min-height: 1rpx;

69
pages/store/vip/index/index.vue
View File

@@ -5,29 +5,33 @@
<swiper-item class="swiper-item" v-for="item in vip" :key="item.identity_id">
<view class="top">
<view class="left" v-if="vip.length > 1">
<< 滑动获取更多 </view>
<view class="content">
<!-- 四个角标 -->
<block> <image class="jiao" src="../../../../static/store/vip-left-top.png" mode="widthFix" /> <image class="jiao" src="../../../../static/store/vip-right-top.png" mode="widthFix" /> <image class="jiao" src="../../../../static/store/vip-left-bottom.png" mode="widthFix" /> <image class="jiao" src="../../../../static/store/vip-right-bottom.png" mode="widthFix" /> </block>
<view class="title1"> {{item.shop.name}} </view>
<image class="title2" :src="item.title_cover" mode="widthFix" />
<view class="title3"> {{item.description}} </view> <!-- 分类 -->
<view class="type">
<view class="type-item" v-for="it in item.rules" :key="it.order">
<image :src="it.cover" mode="aspectFill" />
<view class="title">{{it.name}}</view>
</view>
</view>
<view class="title4">---| 仅需开通 立享尊贵特权 |---</view>
<image class="left-img" src="/static/store/get-more.gif" mode="widthFix" /> 滑动获取更多
</view>
<view class="content">
<!-- 四个角标 -->
<block> <image class="jiao" src="/static/store/vip-left-top.png" mode="widthFix" /> <image class="jiao" src="/static/store/vip-right-top.png" mode="widthFix" /> <image class="jiao" src="/static/store/vip-left-bottom.png" mode="widthFix" /> <image class="jiao" src="/static/store/vip-right-bottom.png" mode="widthFix" /> </block>
<view class="title1"> {{item.shop.name}} </view>
<image class="title2" :src="item.title_cover" mode="widthFix" />
<view class="title3"> {{item.description}} </view> <!-- 分类 -->
<view class="type">
<view class="type-item" v-for="it in item.rules" :key="it.order">
<image :src="it.cover" mode="aspectFill" />
<view class="title">{{it.name}}</view>
</view>
<view class="right" v-if="vip.length > 1"> 滑动获取更多 >> </view>
</view>
<view class="title4">详情咨询可添加产品页下方客服二维码</view>
</view>
<view class="right" v-if="vip.length > 1"> 滑动获取更多 <image class="right-img" src="/static/store/get-more.gif" mode="widthFix" /> </view>
</view>
<view class="bottom">
<view class="left">
<view class="title-1">立享尊贵特权 >> </view>
<view class="title-2" v-if="item.vip_info.ended_at"> 到期时间：{{item.vip_info.ended_at}} </view>
<view class="title-2" v-if="item.vip_info.ended_at"> 到期时间：{{item.vip_info.ended_at}} </view>
<view class="title-2" v-if="item.margins.days>0"> 距离{{item.margins.days}}天只需要补{{item.margins.price}}元升级 </view>
</view>
<view class="right" @click="onOpenVip(item.identity_id)">
{{item.is_vip ?'立即续费':item.margins.days>0 ? '立即升级':'立即开通'}}
</view>
<view class="right" @click="onOpenVip(item.identity_id)">{{item.is_vip?'立即续费':'立即开通'}} </view>
</view>
</swiper-item>
</swiper>
@@ -162,8 +166,19 @@
color: #999;
text-align: right;
width: 100%;
padding-right: 20%;
padding-bottom: 6%;
padding-bottom: 6%;
display: flex;
flex-direction: row;
align-items: center;
box-sizing: border-box;
justify-content: flex-end;
margin-right: 20%;
box-sizing: border-box;
.right-img{
width: 50rpx;
margin-left: 10rpx;
opacity: 0.6;
}
}
.left {
@@ -171,8 +186,20 @@
color: #999;
text-align: left;
width: 100%;
padding-left: 20%;
padding-top: 6%;
padding-top: 6%;
display: flex;
flex-direction: row;
align-items: center;
box-sizing: border-box;
justify-content: flex-start;
margin-left: 20%;
box-sizing: border-box;
.left-img{
width: 50rpx;
transform: rotate(180deg);
margin-right: 10rpx;
opacity: 0.6;
}
}
.content {

164
pages/store/vip/success/success.vue
View File

@@ -1,164 +0,0 @@
<template>
<view class="pinSuccess">
<view class="count-down">
<u-count-down :time="30 * 60 * 60 * 1000" format="HH:mm:ss" autoStart millisecond />
</view>
<view class="title"> 还差 <span>1</span> 人，赶紧邀请好友来拼单吧 </view>
<view class="btn invite"> 邀请好友拼单 </view>
<view class="btn index" @click="goIndex"> 去首页逛逛</view>
<view class="goodInfo">
<view class="avatars">
<image class="avatar me" src="/static/book/333.png" mode="aspectFill" />
<image class="wen pin" src="/static/book/wen.png" mode="aspectFill" />
</view>
<view class="orderInfo">
订单详情
<view class="">
<view class="">
商品名称商品名称商品名称商品名称商品名称商品名称商品名称商品名称商品名称
</view>
<u-icon type="arrow-right" size="15" />
</view>
</view>
</view>
</view>
</template>
<script>
export default {
data() {
return {
};
},
methods: {
goIndex() {
uni.reLaunch({
url: '/pages/store/index/index'
})
}
}
}
</script>
<style lang="scss">
.pinSuccess {
display: flex;
flex-direction: column;
align-items: center;
justify-content: center;
box-sizing: border-box;
.count-down {
background-color: #f9f9f9;
border-radius: 4rpx;
padding: 10rpx $padding;
margin-top: $margin;
}
.title {
font-size: 38rpx;
font-weight: bold;
margin-top: $margin * 2;
span {
color: $main-color;
font-size: 42rpx;
padding: 0 10rpx;
}
}
.btn {
width: 80%;
background-color: $main-color;
color: #fff;
text-align: center;
padding: $padding - 4;
font-size: 34rpx;
border-radius: 10rpx;
margin-top: $margin;
border: solid $main-color 3rpx;
}
.invite {
margin-top: $margin + 20;
}
.index {
background-color: rgba($color: #fff, $alpha: 1.0);
color: $main-color;
}
.goodInfo {
border-top: solid 20rpx #f9f9f9;
width: 100%;
margin-top: $margin + 20;
padding: $padding + 10;
box-sizing: border-box;
.avatars {
display: flex;
flex-direction: row;
align-items: center;
justify-content: center;
box-sizing: border-box;
position: relative;
border-bottom: solid 1rpx #999;
padding-bottom: $padding;
image {
width: 90rpx;
height: 90rpx;
margin: 10rpx 20rpx;
border-radius: 50%;
}
.me {
position: relative;
&::after {
position: absolute;
top: 0;
left: 0;
content: '我';
border-radius: 20rpx;
background: $main-color;
padding: 4rpx 34rpx;
text-align: center;
font-size: 24rpx;
color: #fff;
}
}
.pin {
position: relative;
&::after {
position: absolute;
top: 0;
left: 0;
content: '拼主';
border-radius: 20rpx;
background: orange;
padding: 4rpx 20rpx;
font-size: 24rpx;
color: #fff;
}
}
}
.orderInfo{
display: flex;
flex-direction: row;
align-items: center;
justify-content: space-between;
box-sizing: border-box;
}
}
}
</style>