pointchange.vue

<template>
    <div class="pointer-detail">
        <Header title="兑换成功"></Header>
        <img class="change-head-img" src="https://static.ichunt.com/dist/res/m/images/change_success.png"  alt="猎芯网"/>
        <div class="tip-success-change">恭喜您成功兑换 <b>{{prize_info.prize_name}}</b> 一份</div>
        <!--虚拟-->
        <div class="box-change box-xn" v-if="prize_type==3">
            <div class="change-rule-tip">我们将于兑换后两个工作日内，把使用规则以短信形式发给您!</div>
            <div class="check-change-tip">您也可以前往兑换记录进行查看！</div>
            <a class="go-change" href="/h5/view/#/exchange">去查看</a>
        </div>
        <!--优惠券-->
        <div class="box-change box-yhq" v-if="prize_type==2">

            <div class="check-change-tip">您也可以前往兑换记录进行查看！</div>
            <a class="go-change" href="/h5/view/#/exchange">去查看</a>
        </div>
        <!--实物-->
        <div class="box-change box-sw" v-if="prize_type==1">
            <div class="point-addersstip">我们将邮寄到如下地址：</div>
            <div class="point-adderss-box">
                <template v-if="address_info">
                    收件人：{{address_info.consignee}}<br>
                    电话：{{address_info.mobile}}<br>
                    <div class="inline-block-text">
                        <div >地址：</div>
                        <div class="pce80" v-if="address_info.point_addressp">{{address_info.detail_address}}</div>
                        <div class="pce80" v-else>{{address_info.province_val}}{{address_info.city_val}}{{address_info.district_val}}{{address_info.detail_address}}</div>
                    </div>
                </template>
                <template v-else>
                    <div class="no-point-address">当前无收件人信息，请录入收件人信息！</div>
                </template>

            </div>
            <a  :href="'/h5/view/#/userAddress?points='+point_exchange_id+'&address_id='+prize_info.address_id" class="address-link" >更换地址</a>
            <a class="go-change" href="/h5/view/#/exchange">去查看</a>
        </div>
        <van-loading type="spinner" color="#000" class="loading-background" v-if="loading"/>
    </div>
</template>
<script>
    import Vue from 'vue';
    import {mapState} from 'vuex'
    import {Loading} from 'vant';
    import Header from '@/views/common/Header.vue';
    Vue.use(Loading)
    export default {
        name:"pointchange",
        data(){
            return{
                prize_type:this.$route.query.prize_type,
                point_exchange_id:this.$route.query.point_exchange_id,
            }
        },
        computed:{
            ...mapState({
                loading: state => state.pointchange.loading,
                prize_info:state=>state.pointchange.prize_info,
                prize_types:state=>state.pointchange.prize_types,
                adressApiState:state=>state.pointchange.adressApiState,
                address_info:state=>state.pointchange.address_info,
            })
        },
        created(){
            this.getPrizeInfo();
        },
        methods:{
            getPrizeInfo(){
                this.$store.dispatch({
                    type: 'getUserPointExchangeDetail',
                    point_exchange_id:this.$route.query.point_exchange_id
                })
            }

        },
        watch:{
            prize_types(val){
                this.prize_type=val;
            },
            adressApiState(val){
                if(val){
                    this.$store.dispatch({
                        type: 'recvlist'
                    })
                }
            }
        },
        components:{Header}
    }
</script>

<style scoped>
    @import "../../assets/css/pointmall/pointchange.min.css";
</style>