123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141142143144145146147148149150151152153154155156157158159160161162163164165166167168169170171172173174175176177178179180181182183184185186187188189190191192193194195196197198199200201202203204205206207208209210211212213214215216217218219220221222223224225226227228229230231232233234235236237238239240241242243244245246247248249250251252253254255256257258259260261262263264265266267268269270271272273274275276277278279280281282283284285286287288289290291292293294295296297298299300301302303304305306307308309310311312313314315316317318319320321322323324325326327328329330331332333334335336337338339340341342343344345346347348349350351352353354355356357358359360361362363364365366367368369370371372373374375376377378379380381382383384385386387388389390391392393394395396397398399400401402403404405406407408409410411412413414415416417418419420421422423424425426427428429430431432433434435436437438439440441442443444445446447448449450451452453454455456457458459460461462463464465466467468469470471472473474475476477478479480481482483484485486487488489490491492493494495496497498499500501502503504505506507508509510511512513514515516517518519520521522523524525526527528529530531532533534535536537538539540541542543544545546547548549550551552553554555556557558559560561562563564565566567568569570571572573574575576577578579580581582583584585586587588589590591592593594595596597598599600601602603604605606607608609610611612613614615616617618619 |
- <template>
- <view class="container">
- <view class="bgc">
- <i class="iconfont icon-lujing success-icon" :style="{color:setColor}"></i>
- <view class="title">订单处理成功</view>
- <view class="desc">订单处理成功,预览获取更多优惠</view>
- <view class="btn-block">
- <view @click="lookOrder" class="btn" :style="{'background-color':setColor}">查看订单</view>
- </view>
- </view>
- <view class="swiper-content" v-if="banner.length>0">
- <swiper class="swiper" circular autoplay indicator-active-color="#fff"
- indicator-color="rgba(255,255,255,0.5)">
- <block v-for="(item,index) of banner" :key='index'>
- <swiper-item>
- <image @click="previewImage(item)" class="img" mode="aspectFit" :src="URL+item.thumb"></image>
- </swiper-item>
- </block>
- </swiper>
- </view>
- <view class="bgc" v-if="coupon_list.length>0">
- <view class="more-coupon-title">
- <image class="more-coupon" src="../../static/more-coupon.png"></image>
- </view>
- <view class="coupon_bg">
- <view v-for=" (item,index) in coupon_list" :key="index" class="Coupon">
- <view class="CouponListBg">
- <image src="../../static/coupon_bg_1.png" class="CouponListimg"></image>
- </view>
- <view class="CouponList flex" :data-id="item.id">
- <view class="CouponL flex-center">
- <view>
- <view class="CouponLmoney">
- <view>
- {{Number(item.reduce)}} <text class="ft24">元</text>
- </view>
- </view>
- <view class="CouponLmoneys ft24">
- 满{{ Number(item.full)}}可用
- </view>
- </view>
- </view>
- <view class="CouponContent flex-col box-pack-between">
- <view class="ft28 box-pack-between">
- <view class="text-2">
- {{item.name}}
- </view>
- <block v-if="item.state==1">
- <view class="getCoupon flex-center" @click="receive" :data-name="item.name" :data-index="index"
- :data-id="item.id">
- 领取
- </view>
- </block>
- <block v-if="item.state == 2">
- <view class="getCoupon flex-center" style="color:#999;border: 1rpx solid #ccc;">已领取
- </view>
- </block>
- </view>
- <view class="CouponContentLine">
- </view>
- <view class="CouponContentC ft24">
- <text>有效期:</text>
- <text>{{item.start_time}}-{{item.end_time}}</text>
- </view>
- </view>
- </view>
- </view>
- </view>
- </view>
- <!-- #ifdef MP-ALIPAY -->
- <!-- <subscribe-msg /> -->
- <!-- #endif -->
- <uni-popup ref="popup" type="center">
- <view class="get-phone-pop">
- <view class="content-block">
- <view class="content flex flex-y-center flex-x-center">提示</view>
- </view>
- <view class="flex-center content-tel">
- <text style="min-width: 130rpx;">积分领取成功</text>
- </view>
- <view @click="openUrl" class="btm-block flex flex-nowarp flex-x-between">
- <view form-type="submit" class="btn sub-btn">确定</view>
- </view>
- </view>
- </uni-popup>
- <model :obj="modelObj"></model>
- <Vphone :getPhonePop="getPhonePop" @close="setClose"></Vphone>
- </view>
- </template>
- <script>
- // import uniPopup from '@/components/uni-popup/uni-popup.vue'
- import Vphone from '@/components/v-phone/v-phone.vue';
- // #ifdef MP-ALIPAY
- // const {
- // requestSubscribeMessage
- // } = requirePlugin('subscribeMsg');
- // #endif
- import {
- mapState,
- mapMutations,
- mapGetters
- } from 'vuex'
- export default {
- components: {
- // uniPopup,
- Vphone
- },
- computed: {
- ...mapState(['store_id', 'userInfo', 'swiperList']),
- },
- data() {
- return {
- URL: getApp().globalData.URL,
- banner: [],
- coupon_list: [],
- setColor: "",
- systemInfo: {},
- order_id: '',
- getPhonePop: false,
- modelObj: null
- }
- },
- onLoad(e) {
- uni.setNavigationBarColor({
- frontColor: '#ffffff',
- backgroundColor: this.$store.state.color,
- })
- this.order_id = e.order_id || '';
- this.setColor = this.$store.state.color;
- this.systemInfo = uni.getStorageSync('systemInfo');
- this.banner_list();
- this.http();
- if (this.systemInfo.set.is_jf == 3 && e.order_id && this.systemInfo.set.integral) {
- uni.showModal({
- title: '提示',
- content: '积分领提醒',
- showCancel: true,
- cancelText: '取消',
- confirmText: '领取',
- success: res => {
- if (res.confirm) {
- this.jiFenS()
- }
- }
- });
- }
- },
- methods: {
- jiFenS() {
- this.$http.request('xcx/ManualAddIntegral', {
- order_id: this.order_id,
- }).then(res => {
- let obj = this.systemInfo.set,
- url, app_id, app_url, is_ambient;
- // #ifdef MP-WEIXIN
- url = obj.wx_url;
- app_id = obj.wx_app_id;
- app_url = obj.wx_app_url;
- is_ambient = obj.wx;
- // #endif
- // #ifdef MP-ALIPAY
- url = obj.zfb_url;
- app_id = obj.zfb_app_id;
- app_url = obj.zfb_app_url;
- is_ambient = obj.zfb;
- // #endif
- if (is_ambient == 1) {
- uni.showToast({
- title: '积分领取成功',
- icon: 'none',
- duration: 2000
- })
- setTimeout(() => {
- if (url == '/pages/index/index' || url == '/pages/home/home' || url ==
- '/pages/order/order' ||
- url == '/pages/my/my') {
- uni.switchTab({
- url: url,
- })
- } else {
- uni.redirectTo({
- url: url,
- })
- }
- }, 3000)
- }
- if (is_ambient == 2) {
- this.$refs.popup.open();
- }
- })
- },
- openUrl() {
- let obj = this.systemInfo.set,
- url, app_id, app_url, is_ambient;
- // #ifdef MP-WEIXIN
- url = obj.wx_url;
- app_id = obj.wx_app_id;
- app_url = obj.wx_app_url;
- is_ambient = obj.wx;
- // #endif
- // #ifdef MP-ALIPAY
- url = obj.zfb_url;
- app_id = obj.zfb_app_id;
- app_url = obj.zfb_app_url;
- is_ambient = obj.zfb;
- // #endif
- this.$refs.popup.close();
- if (is_ambient == 1) {
- if (url == '/pages/index/index' || url == '/pages/home/home' || url == '/pages/order/order' ||
- url == '/pages/my/my') {
- uni.switchTab({
- url: url,
- })
- } else {
- uni.redirectTo({
- url: url,
- })
- }
- }
- // console.log(is_ambient, obj.appId, app_url, "app_url")
- if (is_ambient == 2) {
- uni.navigateToMiniProgram({
- appId: app_id,
- path: app_url,
- success: (res) => {
- // this.$refs.popup.close();
- }
- })
- }
- },
- lookOrder(e) {
- this.$store.commit("SET_TABACTIVE", 1)
- uni.navigateTo({
-
- url: '/pages/myOrderList/myOrderList'
- })
- },
- // 开启会员弹窗
- onGetphone(e) {
- this.getPhonePop = true;
- },
- // 子组件传参
- setClose(e) {
- this.getPhonePop = e;
- },
- // 跳转小程序、内页面
- previewImage(info) {
- // console.log(info)
- if (info.type == 1 && info.appid) {
- uni.navigateToMiniProgram({
- appId: info.appid,
- success(res) {
- // 打开成功
- }
- })
- }
- else if (info.type == 2) {
- if (info.appid) {
- if ("/pages/index/index" == info.appid || "/pages/my/my" == info.appid ) {
- uni.switchTab({
- url: info.appid,
- })
- } else {
- uni.navigateTo({
- url: info.appid,
- })
- }
- } else {
- let url = this.URL + info.thumb;
- uni.previewImage({
- urls: [url],
- });
- }
- }else if (info.type == 3) {
- if (!this.userInfo.mobile) {
- // #ifdef MP-WEIXIN
- this.modelObj = {
- content: "完善资料才能享有领取权利,是否完善?",
- };
- this.$store.commit('showAttrPicker', true)
- // #endif
- // #ifdef MP-ALIPAY
- this.getPhonePop = true;
- // #endif
- return
- } else {
- uni.showToast({
- title: '您已经完善过会员信息了,无需重复操作!',
- icon: 'none'
- })
- }
- }else if(info.type == 4){
- uni.navigateTo({
- url:`/shop/richText/index?id=${info.is_article}`
- })
- }
- },
- banner_list() {
- this.$http.request('xcx/banner_list', {
- store_id: uni.getStorageSync('store_id'),
- type_id: 1,
- }).then(res => {
- console.log(res, "LqCoupons_lists")
- this.banner = res.data;
- })
- },
- http() {
- this.$http.request('xcx/pay_coupons', {
- user_id: uni.getStorageSync('user_id'),
- store_id: uni.getStorageSync('store_id'),
- }).then(res => {
- console.log(res, "LqCoupons_lists")
- for (let s of res.data) {
- s.checked = false;
- s.state = 1;
- };
- this.coupon_list = res.data;
- })
- },
- receive: function(t) {
- let subscribe = uni.getStorageSync('balance_subscribe');
- var that = this,name = t.target.dataset.name,
- id = t.target.dataset.id,
- index = t.target.dataset.index;
- // 调用方法,唤起订阅组件
- // #ifdef MP-ALIPAY
- my.requestSubscribeMessage({
- thirdTypeAppId: that.systemInfo.alipay_appid, // 可选,isv接入场景下必填
- entityIds: [subscribe.alipay_coupons], // 模板id列表,最多3个
- // 接收结果的回调方法
- complete: (res) => {
- console.log('订阅回调', r);
- that.$http.request('xcx/LqCoupons', {
- user_id: uni.getStorageSync('user_id'),
- store_id: uni.getStorageSync('store_id'),
- coupon_id: id,
- }, "", "", true).then(res => {
- that.coupon_list[index].state = 2;
- uni.showToast({
- title: '领取成功',
- icon: 'none'
- })
- })
- },
- });
- // #endif
- // #ifdef MP-WEIXIN
- uni.requestSubscribeMessage({
- tmplIds: [subscribe.card_tid],
- success: (r) => {
- that.CardMsgSubscribe(name);
- },
- complete: (r) => {
- that.$http.request('xcx/LqCoupons', {
- user_id: uni.getStorageSync('user_id'),
- store_id: uni.getStorageSync('store_id'),
- coupon_id: id,
- }, "", "", true).then(res => {
- that.coupon_list[index].state = 2;
- uni.showToast({
- title: '领取成功',
- icon: 'none'
- })
- })
- }
- })
- // #endif
- },
- CardMsgSubscribe(name){
- let that=this;
- that.$http.request('xcx/LqCoupons', {
- user_id: uni.getStorageSync('user_id'),
- store_id: uni.getStorageSync('store_id'),
- name: name,
- }, "", "", true).then(res => {
- })
- },
- }
- }
- </script>
- <style lang="scss">
- page {
- background: #F1F1F1;
- }
- .bgc {
- background: #FFFFFF;
- }
- .getCoupon {
- width: 100rpx;
- height: 45rpx;
- border-radius: 50px;
- border: 1rpx solid #FE821E;
- text-align: center;
- color: #FE821E;
- min-width: 115rpx;
- }
- .swiper-content {
- // padding: 0 30rpx;
- margin: 20rpx 0;
- }
- .swiper {
- width: 100%;
- height: 400rpx;
- margin: 0 auto;
- // border-radius: 10rpx;
- overflow: hidden;
- .img {
- display: block;
- width: 100%;
- height: 100%;
- }
- }
- .container {
- overflow: hidden;
- }
- .more-coupon-title {
- text-align: center;
- padding: 40rpx 0;
- }
- .more-coupon {
- width: 280rpx;
- height: 50rpx;
- }
- // .coupon_bg {
- // background: #F1F1F1;
- // }
- .success-icon {
- display: block;
- font-size: 100rpx;
- color: $theme-color;
- text-align: center;
- padding-top: 20rpx;
- }
- .title {
- font-size: 40rpx;
- font-weight: bold;
- text-align: center;
- margin-top: 40rpx;
- color: #555;
- }
- .desc {
- font-size: 32rpx;
- line-height: 50rpx;
- text-align: center;
- color: #666;
- }
- .btn-block {
- display: flex;
- flex-flow: row nowrap;
- justify-content: center;
- align-items: center;
- height: 150rpx;
- }
- .btn-block .btn {
- width: 260rpx;
- height: 80rpx;
- border-radius: 40rpx;
- text-align: center;
- line-height: 80rpx;
- font-size: 28rpx;
- background-color: $theme-color;
- color: #fff;
- }
- .ft24 {
- font-size: 24rpx;
- }
- .ft28 {
- font-size: 28rpx;
- }
- // page {
- // background: #F4F5F7;
- .container {
- .Coupon {
- position: relative;
- margin-top: 30rpx;
- color: #FFFFFF;
- }
- .CouponListBg {
- width: 100%;
- position: absolute;
- top: 0;
- left: 0;
- text-align: center;
- image {
- width: 690rpx;
- height: 180rpx;
- opacity: 1;
- margin: 0 auto;
- }
- }
- .CouponList {
- position: relative;
- width: 690rpx;
- height: 180rpx;
- margin: 0 auto;
- border-radius: 8rpx;
- box-shadow: 0rpx 8rpx 24rpx 0rpx rgba(198, 198, 198, 0.5);
- border: 1rpx solid #f1f1f1;
- .CouponL {
- width: 202rpx;
- height: 100%;
- min-width: 202rpx;
- margin-right: 20rpx;
- .CouponLmoney {
- text-align: center;
- font-size: 58rpx;
- font-family: DIN, DIN-Medium;
- font-weight: 500;
- }
- }
- .CouponContent {
- color: #000000;
- padding: 33rpx 15rpx 20rpx 0;
- .CouponContentLine {
- width: 430rpx;
- height: 1rpx;
- opacity: 0.1;
- border: 1rpx dashed #000000;
- }
- .CouponContentC {
- color: #999999;
- }
- }
- }
- }
- .get-phone-pop {
- /* 成为会员 */
- width: 550rpx;
- background-color: #fff;
- border-radius: 14rpx;
- overflow: hidden;
- }
- .code-btn {
- flex: none;
- width: 170rpx;
- height: 60rpx;
- border-radius: 30rpx;
- background-color: #3387FF;
- text-align: center;
- line-height: 60rpx;
- color: #fff;
- font-size: 24rpx;
- }
- .get-phone-pop .content {
- // height: 180rpx;
- text-align: center;
- font-size: 35rpx;
- color: #000;
- // line-height: 60rpx;
- padding: 30rpx 0;
- padding-bottom: 0;
- }
- .content-tel {
- text-align: center;
- padding: 30rpx 0;
- }
- .get-phone-pop .btm-block {
- width: 100%;
- height: 100rpx;
- border-top: 1rpx solid #eef0ef;
- font-size: 28rpx;
- }
- .get-phone-pop .btm-block .btn {
- height: 100rpx;
- box-sizing: border-box;
- text-align: center;
- line-height: 100rpx;
- color: #010101;
- font-weight: bold;
- padding: 0;
- margin: 0;
- border: none;
- border-radius: 0;
- background-color: #fff;
- // font-size: 35rpx;
- margin: 0 auto;
- }
- // }
- </style>
|