Skip to content

M
mallapp
Commit d21fc2dc authored by zhangjianguo's avatar zhangjianguo
Browse files
Options

优惠券 积分明细

parent 43365a55
Hide whitespace changes
Inline Side-by-side
Showing with 380 additions and 52 deletions
pages/coupon/details/details.vue
View file @ d21fc2dc
......@@ -8,18 +8,24 @@
￥{{g.sub_price}}
</Text> -->
<view style="display: flex;align-items: flex-end;">
<Text style='font-size: 32px;'>{{g.type==1?g.discount: g.sub_price.toString().split('.')[0]}} </Text>
<Text style='font-size: 32px;'>{{g.type==1?Number(g.discount): Number(g.sub_price)}} </Text>
<Text style='font-size: 14px;'>{{g.type==1?'折':""}}</Text>
</view>
<Text class='condition'>
满{{g.min_price}}可用
</Text>
<view class="receive" :style="{'background':mainColor}">
<!-- TODO领取暂时没动 -->
满{{Number(g.min_price) }}可用
</Text>
<Text v-if='g.type==1'>优惠上限:￥{{Number(g.discount_limit) }}</Text>
<view v-if='type==2' class="receive" :style="{'background':mainColor}" @click="receive(g.id)">
<Text>
立即领取
</Text>
</view>
<view v-if='type==1' class="gouse" @click="gouseUrl(g.page_url)">
<Text>
去使用
</Text>
</view>
<view style="width: 100%;border-top: 1px dashed #f5f5f5;margin: 10px 0;"></view>
<Text class='c_name' style='margin-top: 25px;'>有效期</Text>
......@@ -51,8 +57,9 @@ export default {
contentHeight: 0,
g: [],
loading: false,
coupon_id:0,
coupon_id:0,
isreceive:false,
type:0
};
},
......@@ -75,14 +82,18 @@ export default {
title: this.pageTitle,
});
},
onLoad: function (option) {
//option为object类型，会序列化上个页面传递的参数
this.init(option.coupon_id);
onLoad: function (option) {
this.type = option.type
if(option.type==1){ //查看自己优惠详情
this.getdetail(option.coupon_id)
}else if(option.type==2){//查看领券中心的优惠券
this.init(option.coupon_id);
}
},
methods: {
init(coupon_id) {
getdetail(coupon_id) {
uni.showNavigationBarLoading();
let h = this.apiheader();
this.request(
......@@ -90,8 +101,8 @@ export default {
url: "",
header: h,
data: {
r: "api/coupon/detail",
coupon_id:coupon_id
r: "api/coupon/user-coupon-detail",
user_coupon_id:coupon_id
},
},
(res) => {
......@@ -100,14 +111,61 @@ export default {
}
);
},
init(coupon_id) {
uni.showNavigationBarLoading();
let h = this.apiheader();
this.request(
{
url: "",
header: h,
data: {
r: "api/coupon/detail",
coupon_id:coupon_id
},
},
(res) => {
this.g = res.data.list
uni.hideNavigationBarLoading();
}
);
},
receive(id){
let h = this.apiheader();
this.request(
{
url: "",
header: h,
data: {
r: "api/coupon/receive",
coupon_id:id
},
},
(res) => {
uni.hideNavigationBarLoading(),
// this.isreceive = true
this.$refs.uToast.show({
title: "领取成功"
});
uni.navigateTo({
url: "/pages/coupon/index/index"
});
}
);
},
gouseUrl(url){
uni.redirectTo({ url: url });
}
},
};
</script>
<style>
.coupondetailsStyle {
width: 100%;
height: 100%;
background: #D1BA8C;
background: #f3f4f6;
padding-top:10px ;
}
......@@ -146,6 +204,18 @@ export default {
margin-top: 15px;
border-radius: 15px;
}
.cd_box .gouse{
width: 130px;
height: 30px;
display: flex;
align-items: center;
justify-content: center;
font-size: 15px;
color: #fff;
margin-top: 15px;
border-radius: 15px;
background: #6995EE;
}
.cd_box .c_name{
width: 90%;
font-size: 14px;
......
pages/coupon/index/index.vue
View file @ d21fc2dc
......@@ -27,16 +27,23 @@
:style="{ height: '100%' }"
>
<view class="couponList">
<view class="item" v-for="(x, i) in g" :key="i">
<view class="ticket">
<view class="item" v-for="(x, i) in g" :key="i" @click="godetails(x.id)">
<view :class="current==0? 'ticket':'ticket2'">
<view class="miane">
<view class="money">
<text class="small" v-if="x.coupon.type==2">￥</text>
<text style="font-size: 44px;">{{x.sub_price.toString().split('.')[0]}}</text>
<text class="small" v-if="x.coupon.type==1">折</text>
<!-- <text style="font-size: 44px;">{{x.sub_price.toString().split('.')[0]}}</text>
<text v-if="x.coupon.type==1">折</text> -->
<text class="small" v-if="x.coupon.type==2">￥</text>
<Text style='font-size: 44px;'>{{x.type==1?Number(x.discount) :Number(x.sub_price) }} </Text>
<Text class="small">{{x.type==1?'折':""}}</Text>
</view>
<view class="tiaojian">满{{x.coupon_min_price}}元可用</view>
<view class="tiaojian">满{{Number(x.coupon_min_price)}}元可用</view>
</view>
<view style='width: 10px;height: 10px;border-radius: 5px;background: #f3f4f6;position: absolute;right: -5px;top:-5px'></view>
<view style='width: 10px;height: 10px;border-radius: 5px;background: #f3f4f6;position: absolute;right: -5px;bottom:-5px'></view>
</view>
<view class="detail">
<view class="coupond">
......@@ -61,7 +68,7 @@
>
</scroll-view>
</view>
<view style="width: 100%;height: 50px;background: #FFFFFF;display: flex;align-items: center;justify-content: center;position: absolute;left: 0;bottom: 0;">
<view style="width: 100%;height: 50px;background: #FFFFFF;display: flex;align-items: center;justify-content: center;position: absolute;left: 0;bottom: 0;" @click="goUrl">
<Text>去领券</Text>
</view>
<!-- 加载中 -->
......@@ -170,6 +177,19 @@ export default {
this.isover = true;
}
},
godetails(id){
if(this.current ==0){
uni.navigateTo({
url: "/pages/coupon/details/details?coupon_id=" +id+'&type=1'
});
}
},
goUrl(){
uni.navigateTo({
url: "/pages/coupon/list/list"
});
}
},
};
</script>
......@@ -237,13 +257,15 @@ export default {
align-items: flex-start;
background: #fff;
width: 94%;
border-radius: 12rpx;
overflow: hidden;
}
.couponStyle .item .ticket {
position: relative;
background-image: linear-gradient(
to bottom right,
rgb(225, 206, 168),
rgb(195, 166, 116)
rgb(117, 174, 246),
rgb(56, 106, 244)
);
width: 125px;
height: 100px;
......@@ -251,17 +273,26 @@ export default {
align-items: center;
color: #fff;
}
.couponStyle .item .ticket .miane .money {
.couponStyle .item .ticket2 {
position: relative;
background: #C3C3C3;
width: 125px;
height: 100px;
display: flex;
align-items: center;
color: #fff;
}
.couponStyle .item .miane .money {
font-family: "oswald";
font-weight: bold;
size: 64px;
width: 125px;
text-align: center;
}
.couponStyle .item .ticket .miane .money .small {
.couponStyle .item .miane .money .small {
font-size: 20px;
}
.couponStyle .item .ticket .miane .tiaojian {
.couponStyle .item .miane .tiaojian {
font-size: 14px;
width: 125px;
text-align: center;
......@@ -270,7 +301,7 @@ export default {
.couponStyle .item .detail {
width: 100%;
height: 100px;
background: #F2EBE4;
background: #fff;
padding: 10px;
display: flex;
......@@ -299,19 +330,6 @@ export default {
.couponStyle .item .detail .chosen {
width: 20px;
}
.couponStyle .item .ticket:before {
content: "";
display: block;
width: 12px;
height: 100%;
background-size: 12px 12px; /* 一个repeat的大小 */
background-repeat: repeat-y;
background-image: radial-gradient(#f5f5f5 4px, transparent 4px);
position: absolute;
top: 0;
}
.couponStyle .item .ticket:before {
left: -6px;
}
</style>
pages/coupon/list/list.vue
View file @ d21fc2dc
......@@ -23,15 +23,16 @@
<view class="item_top">
<view class="item_top_l">
<view style="display: flex;align-items: flex-end;">
<Text style='font-size: 32px;'>{{x.type==1?x.discount: x.sub_price.toString().split('.')[0]}} </Text>
<Text style='font-size: 32px;'>{{x.type==1?Number(x.discount): Number(x.sub_price)}} </Text>
<Text style='font-size: 14px;'>{{x.type==1?'折':""}}</Text>
</view>
<view style="display: flex;flex-direction: column;margin-left: 10px;width: 210px;">
<Text class='top_title'>{{x.name}}</Text>
<Text>满{{x.min_price}}可用</Text>
<Text>满{{Number(x.min_price) }}可用</Text>
<Text v-if='x.type==1'>优惠上限:￥{{Number(x.discount_limit) }}</Text>
</view>
</view>
<view class="receive">
<view class="receive" @click.stop="receive(x.id)">
<Text>立即领取</Text>
</view>
</view>
......@@ -50,7 +51,10 @@
</view>
<view class="loading" v-if="loading">
<u-loading mode="flower" size="48">></u-loading>
<Text style="color: #fff; margin-top: 10rpx;">加载中...</Text>
</view>
</view>
</template>
......@@ -121,8 +125,34 @@ export default {
},
goUrl(id){
uni.navigateTo({
url: "/pages/coupon/details/details?coupon_id=" +id
url: "/pages/coupon/details/details?coupon_id=" +id+'&type=2'
});
},
receive(id){
let h = this.apiheader();
this.request(
{
url: "",
header: h,
data: {
r: "api/coupon/receive",
coupon_id:id
},
},
(res) => {
uni.hideNavigationBarLoading(),
this.$refs.uToast.show({
title: "领取成功"
});
// uni.navigateTo({
// url: "/pages/coupon/index/index"
// });
}
);
}
},
};
......@@ -157,8 +187,8 @@ export default {
padding: 0 10px;
background-image: linear-gradient(
to bottom right,
rgb(195, 166, 116),
rgb(225, 206, 168)
rgb(117, 174, 246),
rgb(56, 106, 244)
);
color: #fff;
......@@ -179,7 +209,7 @@ export default {
height: 30px;
border-radius: 15px;
background: #fff;
color: rgb(225, 206, 168);
color: #6995EE;
font-size: 14px;
display: flex;
align-items: center;
......@@ -212,4 +242,20 @@ export default {
.couponlistStyle .c_list_item .item_b:before {
top: -6px;
}
.couponlistStyle .loading {
width: 180rpx;
height: 180rpx;
background: #000000;
opacity: 0.7;
border-radius: 10rpx;
display: flex;
flex-direction: column;
align-items: center;
justify-content: center;
position: fixed;
left: 50%;
top: 30%;
margin-left: -100rpx;
z-index: 999;
}
</style>
pages/foot/index/index.vue
View file @ d21fc2dc
......@@ -41,7 +41,7 @@
@scrolltolower="lower"
:style="{ height: '100%' }">
<view style="display: flex;flex-direction: column;align-items: center;">
<view v-for="(item, index) in g" :key="index">
<view v-for="(item, index) in g" :key="index" style="width: 100%;margin-bottom: 10rpx;">
<Text style='padding-left: 2.5%;margin: 20rpx 0;color: #c8c9cc;'>{{item.date}}</Text>
<view class="contentBox">
<view class="cBox_item" v-for="(cx, ci) in item.goods" :key="ci" >
......
pages/goods/list.vue
View file @ d21fc2dc
......@@ -108,6 +108,7 @@ export default {
old: {
scrollTop: 0,
},
coupon_id:0
};
},
components:{
......@@ -116,6 +117,9 @@ export default {
onLoad(option) {
this.mainColor = this.$uiConfig.mainColor;
this.catId = option.cat_id;
if(option.coupon_id!=undefined){
this.coupon_id = option.coupon_id //优惠券带过来的参数
}
},
mounted() {
this.init();
......@@ -155,7 +159,7 @@ export default {
sort: this.sort,
sort_type: this.sortType,
keyword: "",
coupon_id: 0,
coupon_id: this.coupon_id,
},
},
(res) => {
......
pages/user-center/integral-detail/integral-detail.vue 0 → 100644
View file @ d21fc2dc
<template>
<view class="integralDStyle" :style="{ height: contentHeight }">
<u-tabs
:list="list"
:is-scroll="false"
:current="current"
@change="change"
:active-color="mainColor"
></u-tabs>
<u-empty v-if="g.length == 0" text="暂无积分明细" mode="list"></u-empty>
<view
v-if="g.length > 0"
style="
height: calc(100vh - 50px);
width: calc(100vw);
overflow: hidden;
"
>
<scroll-view
:scroll-y="true"
:enable-back-to-top="true"
:enable-flex="true"
:style="{ height: '100%' }"
>
<view class="interDList" v-for="(x, i) in g" :key="i">
<Text>{{x.desc}}</Text>
<view style="display: flex;align-items: center;justify-content: space-between;width: 100%;margin-top: 5px;">
<Text :style="{color:x.type==1?mainColor:secondary}">{{x.type==1?'+':'-'}}{{x.integral}}积分</Text>
<Text style='font-size: 12px; color: #B5B5B5;'>时间：{{x.created_at}}</Text>
</view>
</view>
<u-divider
contentPosition="center"
v-if="isover"
:margin-top="20"
:margin-bottom="20"
bg-color="#f3f4f6"
>没有更多卡券了</u-divider
>
</scroll-view>
</view>
<!-- 加载中 -->
<view class="loading" v-if="loading">
<u-loading mode="flower" size="48">></u-loading>
<Text style="color: #fff; margin-top: 10rpx;">加载中...</Text>
</view>
<!-- 取消提示 -->
<u-toast ref="uToast" />
</view>
</template>
<script>
export default {
components: {
},
data() {
return {
pageTitle: "积分明细",
current: 0,
list: [
{ name: "收入" },
{ name: "支出" },
],
mainColor: "",
secondary:'',
contentHeight: 0,
page: 1,
page_count: 1,
g: [],
loading: false,
isover: false,
};
},
created() {
this.contentHeight = this.$utils.calcContentHeight(-40) + "px";
this.mainColor = this.$uiConfig.mainColor;
this.secondary = this.$uiConfig.secondary;
},
mounted() {
let currentPages = getCurrentPages();
let u = "/" + currentPages[currentPages.length - 1].route;
let pages = wx.getStorageSync("basedata")
? wx.getStorageSync("basedata").bar_title
: [];
pages.forEach((x) => {
if (x.value == u) {
this.pageTitle = x.new_name ? x.new_name : x.name;
}
});
uni.setNavigationBarTitle({
title: this.pageTitle,
});
},
onLoad: function (option) {
//option为object类型，会序列化上个页面传递的参数
// this.current = option.status;
this.loading = true;
this.init();
},
methods: {
change(index) {
this.current = index;
this.page = 1;
this.g = [];
this.loading = true;
this.init();
},
init() {
this.isover = false;
let h = this.apiheader();
this.request(
{
url: "",
header: h,
data: {
r: "api/integral-log/index",
type: this.current+1,
},
},
(res) => {
this.loading = false;
if(res.data.list.length>0){
this.g = res.data.list;
// this.page_count = res.data.pagination.page_count;
// if (this.page_count == 1) {
// this.isover = true;
// }
}
}
);
},
lower(e) {
if (this.page < this.page_count) {
this.page++;
this.init();
} else {
this.isover = true;
}
},
},
};
</script>
<style>
.integralDStyle {
width: 100%;
height: 100%;
background: #f3f4f6;
}
.integralDStyle .loading {
width: 200rpx;
height: 200rpx;
background: #000000;
opacity: 0.7;
border-radius: 10rpx;
display: flex;
flex-direction: column;
align-items: center;
justify-content: center;
position: fixed;
left: 50%;
top: 30%;
margin-left: -100rpx;
z-index: 999;
}
.integralDStyle .interDList{
width:100% ;
padding: 20px 15px;
display: flex;
flex-direction: column;
background: #fff;
border-top: 1px solid #f5f5f5;
}
</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