Merge branch 'v2' of http://39.101.143.165:8090/wrj/GuangYuYuan-app into xueyh

src/pages.json

@@ -516,8 +516,36 @@
 					"style": {
 						"navigationBarTitleText": "商品详情",
 						"navigationStyle": "custom"
-						
-						
+					}
+				},{
+					"path": "productDetails/addressManagement",
+					"style": {
+						"navigationBarTitleText": "地址管理",
+						"navigationStyle": "custom"
+					}
+				},{
+					"path": "productDetails/paymentSuccessful",
+					"style": {
+						"navigationBarTitleText": "兑换成功",
+						"navigationStyle": "custom"
+					}
+				},{
+					"path": "productDetails/pendingPayment",
+					"style": {
+						"navigationBarTitleText": "待支付",
+						"navigationStyle": "custom"
+					}
+				},{
+					"path": "productDetails/applyRefund",
+					"style": {
+						"navigationBarTitleText": "申请退款",
+						"navigationStyle": "custom"
+					}
+				},{
+					"path": "productDetails/applyExchange",
+					"style": {
+						"navigationBarTitleText": "申请换货",
+						"navigationStyle": "custom"
 					}
 				}
 			]

src/points/productDetails/addressManagement.vue

@@ -0,0 +1,242 @@
+<template>
+    <view>
+        <scroll-view :scroll-y="true" @scroll="handleContentScroll">
+            <!-- 导航栏  :leftIconColor="!isTop ? '#fff' : '#000'"-->
+            <u-navbar :placeholder="true" autoBack @click="autoBackFun">
+                <view slot="center">
+                    <view class="center" style="background-color: #fff;">我的地址</view>
+                </view>
+            </u-navbar>
+
+            <view class="content">
+                <view class="item" v-for="item in list">
+                    <view class="addressName">{{ item.addressName }}</view>
+                    <view style="display: flex;justify-content: space-between;align-items: center;">
+                        <view style="display: flex;align-items: center;">
+                            <text class="userName"> {{ item.userName }}</text>
+                            <text class="userPhone">{{ item.userPhone }}</text>
+                            <text v-if=item.defaultAddress class="defaultAddress">{{ item.defaultAddress }}</text>
+                        </view>
+                        <view style="display: flex;align-items: center;">
+                            <image style="width: 40rpx;height: 40rpx;" src="@/static/points/editIcon.png" mode="" @click="goEditAddress">
+                            </image>
+                            <image style="width: 40rpx;height: 40rpx;margin-left: 20rpx;"
+                                src="@/static/points/deleteIcon.png" mode="">
+                            </image>
+
+                        </view>
+                    </view>
+
+
+                </view>
+            </view>
+
+
+
+
+            <view class="footer-bar">
+                <u-button :customStyle="{
+                    color: '#fff',
+                    background: '#03C1B8'
+                }" @click="redeemNowFun">新增地址</u-button>
+            </view>
+
+           
+            <u-popup :show="selectProductShowPopup" mode="bottom" round="10">
+                <!-- <SelectProduct ref="selectProductRef" @closeSelectProduct="closeSelectProduct"></SelectProduct> -->
+            </u-popup>
+
+        </scroll-view>
+
+    </view>
+</template>
+
+<script>
+
+export default {
+    components: {},
+    data() {
+        return {
+            isTop: 0,
+            redemptionRulesShowPopup: false,
+            selectProductShowPopup: false,
+            list: [
+                {
+                    addressName: '迎泽西大街86号信达国际金融中心',
+                    userName: '郭丽丽',
+                    userPhone: '16635680981',
+                    defaultAddress: '默认',
+                }, {
+                    addressName: '迎泽西大街86号信达国际金融中心',
+                    userName: '郭丽丽',
+                    userPhone: '16635680981',
+                }, {
+                    addressName: '迎泽西大街86号信达国际金融中心',
+                    userName: '郭丽丽',
+                    userPhone: '16635680981',
+                }, {
+                    addressName: '迎泽西大街86号信达国际金融中心',
+                    userName: '郭丽丽',
+                    userPhone: '16635680981',
+                }, {
+                    addressName: '迎泽西大街86号信达国际金融中心',
+                    userName: '郭丽丽',
+                    userPhone: '16635680981',
+                },
+            ]
+
+
+        }
+    },
+    onLoad(data) {
+
+    },
+    onShow() {
+
+    },
+    onPageScroll(e) {
+        //console.log("滚动距离为：" + e.scrollTop);
+        this.isTop = e.scrollTop;
+    },
+
+    methods: {
+        handleContentScroll(e) {
+            this.isTop = e.detail.scrollTop > 0
+        },
+        clichFun() {
+
+        },
+        //立即兑换
+        redeemNowFun() {
+
+        },
+        //返回上一页
+        autoBackFun(){
+            uni.navigateBack();
+        },
+        //去编辑地址
+        goEditAddress() {
+            uni.navigateTo({
+                url: '/pages/address/address-edit'
+            });
+            // /let str = uni.$u.queryParams(params);
+            // uni.navigateTo({
+            // 	url: `/packageA/pages/shop/coupon/couponDetail${str}`
+            // });
+        },
+
+    }
+}
+</script>
+
+<style></style>
+<style lang="scss" scoped>
+.footer-bar {
+    .u-button {
+        width: 670rpx;
+        height: 84rpx;
+        border-radius: 98rpx 98rpx 98rpx 98rpx;
+        margin: 20rpx 40rpx;
+        background: '#000';
+        font-weight: 500;
+        font-size: 32rpx;
+        color: #FFFFFF;
+        line-height: 36rpx;
+        text-align: center;
+        font-style: normal;
+        text-transform: none;
+        
+
+    }
+}
+
+.content {
+    background-color: #F8F8F8;
+    padding: 32rpx;
+    font-family: PingFang SC, PingFang SC;
+
+    .item {
+        background: #FFFFFF;
+        box-shadow: 0rpx 4rpx 12rpx 0rpx rgba(88, 209, 187, 0.05);
+        border-radius: 20rpx 20rpx 20rpx 20rpx;
+        padding: 32rpx 24rpx;
+        margin-bottom: 24rpx;
+    }
+
+    .addressName {
+        font-weight: 500;
+        font-size: 32rpx;
+        color: #2F3437;
+        text-align: left;
+        font-style: normal;
+        text-transform: none;
+        margin-bottom: 16rpx;
+    }
+
+    .userName {
+        font-weight: 400;
+        font-size: 26rpx;
+        color: #333333;
+        line-height: 24rpx;
+        text-align: left;
+        font-style: normal;
+        text-transform: none;
+    }
+
+    .userPhone {
+        font-weight: 400;
+        font-size: 26rpx;
+        color: #999999;
+        text-align: left;
+        font-style: normal;
+        text-transform: none;
+        margin-left: 20rpx;
+    }
+
+    .defaultAddress {
+        font-weight: 400;
+        font-size: 24rpx;
+        color: #F35031;
+        text-align: center;
+        font-style: normal;
+        text-transform: none;
+        width: 72rpx;
+        height: 40rpx;
+        background: rgba(243, 80, 49, 0.1);
+        border-radius: 8rpx 8rpx 8rpx 8rpx;
+        margin-left: 20rpx;
+    }
+
+
+}
+
+.popupClass {
+    background-color: #F5F8F8;
+    padding: 24rpx 32rpx 0 32rpx;
+    font-family: PingFang SC, PingFang SC;
+
+    .niticeClass {
+        background: #FFFFFF;
+        border-radius: 20rpx 20rpx 20rpx 20rpx;
+        margin-top: 24rpx;
+        padding: 24rpx;
+        position: relative;
+
+        .title {
+            font-weight: 800;
+            font-size: 28rpx;
+            color: #333333;
+            line-height: 28rpx;
+            text-align: left;
+            font-style: normal;
+            text-transform: none;
+            width: 686rpx;
+            margin: 24rpx 0;
+        }
+
+        .text {
+            color: #999999;
+        }
+    }
+}
+</style>

src/points/productDetails/applyExchange.vue

@@ -0,0 +1,298 @@
+<!-- 申请换货 -->
+<template>
+    <view>
+        <scroll-view :scroll-y="true" @scroll="handleContentScroll">
+            <!-- 导航栏  :leftIconColor="!isTop ? '#fff' : '#000'"-->
+            <u-navbar :placeholder="true" autoBack @click="autoBackFun">
+                <view slot="center">
+                    <view class="centerTitle" style="background-color: #fff;">{{ title }}</view>
+                </view>
+            </u-navbar>
+
+            <view class="content">
+                <view class="productPrice">
+                    <view style="display:flex;">
+                        <view>
+                            <image style="width: 120rpx;height: 120rpx;" src="@/static/points/closeIcon.png" mode="">
+                            </image>
+                        </view>
+                        <view
+                            style="margin-left: 24rpx;display: flex;flex-direction: column;justify-content: space-between;">
+                            <view class="name">实付价 ￥10元+1000积分 </view>
+                            <view class="spec">已选:大号,白色 </view>
+                        </view>
+                    </view>
+                </view>
+                <view class="mustInput">
+                    <view class="row">
+                        <view class="title">申请原因</view>
+                        <view class="tip">
+                            <view :style="{color:selectApplyReason?'#333':'#999'}">{{ selectApplyReason?selectApplyReason:'请选择申请原因' }}</view>
+                            <image style="width: 28rpx;height: 28rpx;margin-left: 8rpx;" @click="selectApplyReasonFun('1')"
+                                src="@/static/points/Keyboard_arrow_rifht.png" mode=""></image>
+                        </view>
+
+                    </view>
+                    <view class="row">
+                        <view class="title">问题描述/凭证</view>
+                        <view class="tip">
+                            <view>请您务必上传描述和凭证</view>
+                            <image style="width: 28rpx;height: 28rpx;margin-left: 8rpx;" @click="selectApplyReasonFun('2')"
+                                src="@/static/points/Keyboard_arrow_rifht.png" mode=""></image>
+                        </view>
+
+                    </view>
+                </view>
+                <view class="returnMath">
+                    <text>返回方式</text>
+                    <text>自主邮寄</text>
+                </view>
+            </view>
+            <view class="buttonClass">
+                <u-button :customStyle="{
+                    color: '#fff',
+                    background: '#03C1B8'
+                }" @click="goHome">提交</u-button>
+
+            </view>
+
+
+        </scroll-view>
+
+    </view>
+</template>
+
+<script>
+import ApplyRefund from './applyRefund.vue';
+
+
+export default {
+    components: {},
+    data() {
+        return {
+            
+            selectApplyReason:null,
+            title: '申请换货',
+            isTop: 0,
+            redemptionRulesShowPopup: false,
+            selectProductShowPopup: false,
+            list: [
+                {
+                    addressName: '迎泽西大街86号信达国际金融中心',
+                    userName: '郭丽丽',
+                    userPhone: '16635680981',
+                    defaultAddress: '默认',
+                }, {
+                    addressName: '迎泽西大街86号信达国际金融中心',
+                    userName: '郭丽丽',
+                    userPhone: '16635680981',
+                }, {
+                    addressName: '迎泽西大街86号信达国际金融中心',
+                    userName: '郭丽丽',
+                    userPhone: '16635680981',
+                }, {
+                    addressName: '迎泽西大街86号信达国际金融中心',
+                    userName: '郭丽丽',
+                    userPhone: '16635680981',
+                }, {
+                    addressName: '迎泽西大街86号信达国际金融中心',
+                    userName: '郭丽丽',
+                    userPhone: '16635680981',
+                },
+            ]
+
+
+        }
+    },
+    onLoad(data) {
+        if(data){
+            //decodeURIComponent (data) 
+            this.selectApplyReason=data.selectReason
+           
+        }
+        console.log(data, 'data')
+    },
+    onShow(selectReason) {
+        console.log(selectReason, 'selectReason')
+
+    },
+    onPageScroll(e) {
+        //console.log("滚动距离为：" + e.scrollTop);
+        this.isTop = e.scrollTop;
+    },
+
+    methods: {
+        //申请换货
+        applyExchangeFun() {
+            uni.navigateTo({
+                url: '/points/productDetails/applyExchange'
+            });
+        },
+        //申请退款
+        applyRefundFun() {
+            uni.navigateTo({
+                url: '/points/productDetails/applyRefund'
+            });
+        },
+
+        handleContentScroll(e) {
+            this.isTop = e.detail.scrollTop > 0
+        },
+        //选择申请原因
+        selectApplyReasonFun(tab) {
+
+            uni.navigateTo({
+                url: `/points/productDetails/applyRefund?receivedStatus=3&tab=${tab}`
+            });
+        },
+        //返回首页
+        goHome() {
+            uni.switchTab({
+                url: '/pages/index/index'
+            });
+        },
+        //查看订单
+        checkOrder() {
+            uni.navigateTo({
+                url: '/points/productDetails/pendingPayment'
+            });
+        },
+        //返回上一页
+        autoBackFun() {
+            uni.navigateBack({ delta: 1 });
+        },
+        //去编辑地址
+        goEditAddress() {
+            uni.navigateTo({
+                url: '/pages/address/address-edit'
+            });
+            // /let str = uni.$u.queryParams(params);
+            // uni.navigateTo({
+            // 	url: `/packageA/pages/shop/coupon/couponDetail${str}`
+            // });
+        },
+
+    }
+}
+</script>
+
+<style></style>
+<style lang="scss" scoped>
+.centerTitle {
+    font-family: PingFang SC, PingFang SC;
+    font-weight: 500;
+    font-size: 34rpx;
+    color: #060606;
+    text-align: center;
+    font-style: normal;
+    text-transform: none;
+}
+
+.buttonClass {
+    position: fixed;
+    bottom: 0;
+    width: 100%;
+    padding: 32rpx;
+    font-family: PingFang SC, PingFang SC;
+
+    button {
+        border-radius: 98rpx 98rpx 98rpx 98rpx;
+        border: 2rpx solid #03C1B8;
+    }
+
+}
+
+.content {
+    background-color: #F8F8F8;
+    padding: 32rpx;
+    font-family: PingFang SC, PingFang SC;
+    //height: 658rpx;
+    border-radius: 20rpx 20rpx 20rpx 20rpx;
+
+    .productPrice {
+        background-color: #fff;
+        padding: 24rpx;
+        border-radius: 20rpx 20rpx 20rpx 20rpx;
+
+        .name {
+            font-weight: bold;
+            font-size: 28rpx;
+            color: #333333;
+            text-align: left;
+            font-style: normal;
+            text-transform: none;
+        }
+
+        .spec {
+            font-weight: 500;
+            font-size: 26rpx;
+            color: #999999;
+            text-align: left;
+            font-style: normal;
+            text-transform: none;
+
+        }
+    }
+
+    .mustInput {
+        background: #FFFFFF;
+        border-radius: 16rpx 16rpx 16rpx 16rpx;
+        padding: 2rpx 24rpx 26rpx 24rpx;
+        margin-top: 24rpx;
+
+        .title {
+            font-weight: 400;
+            font-size: 26rpx;
+            color: #666666;
+            text-align: left;
+            font-style: normal;
+            text-transform: none;
+        }
+
+        .tip {
+            font-weight: 400;
+            font-size: 28rpx;
+            color: #999999;
+            text-align: left;
+            font-style: normal;
+            text-transform: none;
+            display: flex;
+            align-items: center;
+        }
+
+        .row {
+            display: flex;
+            margin-top: 24rpx;
+            justify-content: space-between;
+
+        }
+
+
+    }
+
+    .returnMath {
+        margin-top: 24rpx;
+        background: #FFFFFF;
+        border-radius: 16rpx 16rpx 16rpx 16rpx;
+        font-weight: 400;
+        font-size: 26rpx;
+        color: #666666;
+        display: flex;
+        justify-content: space-between;
+        font-style: normal;
+        text-transform: none;
+        padding: 26rpx 24rpx;
+
+        text:last-of-type {
+            font-size: 28rpx;
+            color: #333333;
+        }
+    }
+
+
+
+
+
+
+}
+</style>

src/points/productDetails/applyRefund.vue

@@ -0,0 +1,441 @@
+<!-- 申请退款页面 -->
+
+<template>
+    <view>
+        <scroll-view :scroll-y="true" @scroll="handleContentScroll">
+            <!-- 导航栏  :leftIconColor="!isTop ? '#fff' : '#000'"-->
+            <u-navbar :placeholder="true" autoBack @click="autoBackFun">
+                <view slot="center">
+                    <view class="centerTitle" style="background-color: #fff;">
+                        {{ receivedStatus == '1' || receivedStatus == '2' ? '申请退款' : '申请换货' }}</view>
+                </view>
+            </u-navbar>
+
+            <view class="content">
+                <view v-if="tab=='1'">
+                    <view class="contentDetail">
+                        <view class="tip">请选择取消订单的原因（必选）：</view>
+                        <u-radio-group v-model="selectReason" @change="groupChange">
+                            <view>
+                                <!-- //1 未收到，申请退款 list；  2.已收到货，申请退款 list2     3.已收货-换货申请 list3-->
+                                <view class="item" v-for="item in filteredList">
+                                    <view v-if="item.title" class="title">{{ item.title }}：</view>
+                                    <view class="obj" v-for="obj in item.data">
+                                        <view class="radioBox">
+                                            <u-radio activeColor="#03C1B8 " :name=obj.value></u-radio>{{ obj.text }}
+                                        </view>
+                                    </view>
+                                </view>
+                            </view>
+                        </u-radio-group>
+                    </view>
+                    <view class="tip2" v-if="receivedStatus == '1'">
+                        <view class="title">温馨提示：</view>
+                        <view class="textClass">
+                            1.订单一旦取消，无法恢复<br>
+                            2.用户因个人原因申请退货，包邮商品需承担返回运费，非包邮商品需承担送返两程运费<br>
+                            3.如有其他问题，请及时与平台联系，联系电话：****-*******<br>
+                        </view>
+                    </view>
+                </view>
+                <view v-if="tab=='2'">
+                    <view class="Box">
+                        <view class="questionOrDiscribe">
+                            <view>问题与描述：</view>
+                            <u--textarea v-model="questionOrDiscribe" placeholder="请输入问题描述" :maxlength="100"
+                                count></u--textarea>
+
+                        </view>
+                        <view class="pictures">
+                            <view>上传凭证图片：</view>
+                            <view style="margin-top: 16rpx;" class="pictureClass">
+                                <!-- <view v-for="value in 3" style="position: relative;width: calc(25% - 22rpx)">
+                                    <image style="width: 144rpx;height: 144rpx;" src="@/static/points/closeIcon.png"
+                                        mode="">
+                                    </image>
+                                    <image style="width: 36rpx;height: 36rpx;position: absolute;right : 0;top:0"
+                                        src="@/static/points/pictureIcon.png" mode="" @click="deletePictureFun">
+                                    </image>
+                                </view> -->
+
+                                <Upload style="" :maxCount="6"
+                                    :customImg="true" :width="'70'" :height="'70'" :src="'/static/points/picture2.png'"
+                                    @fileList="onUpload" />
+
+
+                            </view>
+
+
+                        </view>
+                    </view>
+
+
+                </view>
+
+
+
+
+            </view>
+            <view class="buttonClass">
+                <u-button :customStyle="{
+                    color: '#fff',
+                    background: '#03C1B8'
+                }" @click="goSubmit">提交</u-button>
+
+            </view>
+
+        </scroll-view>
+
+    </view>
+</template>
+
+<script>
+import Upload from '@/components/upload/index.vue';
+export default {
+    components: { Upload },
+    data() {
+        return {
+            tab:null,
+            headPhotoImg: [],
+            questionOrDiscribe: '',
+            selectReason: '',
+            selectReasonName: '',
+            receivedStatus: null,//1 未收到，申请退款；2.已收到货，申请退款 3.已收货-换货申请
+            isTop: 0,
+            list: [],
+            //未收到，申请退款
+            list1: [
+                {
+                    title: '平台原因',
+                    data: [
+                        { value: '1', text: '商家无货联系我取消订单' },
+                        { value: '2', text: '商家无法按承诺时效送达' },
+                        { value: '3', text: '商家其他原因联系我取消订单' },
+                    ]
+                }, {
+                    title: '个人原因',
+                    data: [
+                        { value: '4', text: '不想要' },
+                        { value: '5', text: '商品错选 / 多选' },
+                        { value: '6', text: '地址信息填写错误' },
+                        { value: '7', text: '7天无理由退货' },
+                    ]
+                }
+            ],
+            //已收到货，申请退款
+            list2: [
+                {
+                    title: '',
+                    data: [
+                        { value: '1', text: '买错/买多/不想要' },
+                        { value: '2', text: '买错/买多/不想要' },
+                        { value: '3', text: '商品与页面描述不符' },
+                        { value: '4', text: '商品与页面描述不符' },
+                        { value: '5', text: '发错货' },
+                        { value: '6', text: '少件/未收到货' },
+                        { value: '7', text: '7天无理由退货' },
+                    ]
+                }
+            ],
+            //已收货-换货申请
+            list3: [
+                {
+                    title: '',
+                    data: [
+                        { value: '1', text: '商品质量问题' },
+                        { value: '2', text: '商品与页面描述不符' },
+                        { value: '3', text: '商品/包装破损' },
+                        { value: '4', text: '发错货' },
+                        { value: '5', text: '少件/未收到货' },
+                        { value: '6', text: '商品大小不合适' },
+                    ]
+                },
+            ],
+
+
+        }
+    },
+    computed: {
+        filteredList() {
+            if (this.receivedStatus === '1') return this.list1;
+            if (this.receivedStatus === '2') return this.list2;
+            return this.list3;
+        }
+    },
+    onLoad(data) {
+        console.log(data, 'onLoad')
+        if (data) {
+            this.receivedStatus = data.receivedStatus
+            this.tab=data.tab?data.tab:null
+        }
+        setTimeout(()=>{
+          console.log(this.filteredList,'2222')  
+        },2000)
+        
+
+    },
+    onShow(data) {
+        if (data) {
+            this.receivedStatus = data.receivedStatus
+            this.tab=data.tab?data.tab:null
+        }
+        console.log(data, 'onShow')
+
+
+    },
+    onPageScroll(e) {
+        //console.log("滚动距离为：" + e.scrollTop);
+        this.isTop = e.scrollTop;
+    },
+
+    methods: {
+        // upload事件
+        onUpload(e, t) {
+            console.log(e, t)
+            //this.form[t] = e.map(item => item.url);
+        },
+        handleContentScroll(e) {
+            this.isTop = e.detail.scrollTop > 0
+        },
+        clichFun() {
+
+        },
+        //点击单选按钮
+        groupChange(val) {
+            this.selectReason = val
+            this.filteredList[0].data.forEach(item => {
+                if (item.value == val) {
+                    this.selectReasonName = item.text
+                }
+
+            });
+
+
+
+        },
+        //提交
+        goSubmit() {
+            //`/pages/test/test?name=${encodeURIComponent(name)}&info=${encodeURIComponent(info)}`
+            uni.navigateTo({
+                url: `/points/productDetails/applyExchange?selectReason=${encodeURIComponent(this.selectReasonName)}`
+            });
+        },
+        //查看订单
+        checkOrder() {
+            uni.navigateTo({
+                url: '/points/productDetails/pendingPayment'
+            });
+        },
+        //返回上一页
+        autoBackFun() {
+            uni.navigateBack();
+        },
+        //去编辑地址
+        goEditAddress() {
+            uni.navigateTo({
+                url: '/pages/address/address-edit'
+            });
+            // /let str = uni.$u.queryParams(params);
+            // uni.navigateTo({
+            // 	url: `/packageA/pages/shop/coupon/couponDetail${str}`
+            // });
+        },
+
+    }
+}
+</script>
+
+<style></style>
+<style lang="scss" scoped>
+.centerTitle {
+    font-family: PingFang SC, PingFang SC;
+    font-weight: 500;
+    font-size: 34rpx;
+    color: #060606;
+    text-align: center;
+    font-style: normal;
+    text-transform: none;
+}
+
+.buttonClass {
+    position: fixed;
+    padding: 32rpx;
+    bottom: 0;
+    width: 100%;
+    font-family: PingFang SC, PingFang SC;
+
+    button {
+        height: 84rpx;
+        border-radius: 98rpx 98rpx 98rpx 98rpx;
+        border: 2rpx solid #03C1B8;
+    }
+
+}
+
+.content {
+    background-color: #F8F8F8;
+    padding: 32rpx;
+    font-family: PingFang SC, PingFang SC;
+    //height: 658rpx;
+    border-radius: 20rpx 20rpx 20rpx 20rpx;
+
+    ::v-deep .Box {
+        background: #FFFFFF;
+        border-radius: 20rpx 20rpx 20rpx 20rpx;
+        padding: 18rpx 22rpx 22rpx 22rpx;
+
+        .questionOrDiscribe {
+            font-weight: 500;
+            font-size: 28rpx;
+            color: #333333;
+            text-align: left;
+            font-style: normal;
+            text-transform: none;
+
+            .u-textarea {
+                margin-top: 16rpx;
+                height: 206rpx;
+                background: #F8F8F8;
+                border-radius: 16rpx 16rpx 16rpx 16rpx;
+                border: 1rpx solid #DCDCDC;
+
+                .uni-textarea-placeholder {
+                    font-weight: 400;
+                    font-size: 24rpx;
+                    color: #999999;
+                    text-align: left;
+                    font-style: normal;
+                    text-transform: none;
+                }
+
+                .uni-textarea-wrapper {
+                    font-weight: 400;
+                    font-size: 24rpx;
+                    color: #333;
+                    text-align: left;
+                    font-style: normal;
+                    text-transform: none;
+                }
+
+
+            }
+        }
+
+        .pictures {
+            margin-top: 16rpx;
+            font-weight: 500;
+            font-size: 28rpx;
+            color: #333333;
+            text-align: left;
+            font-style: normal;
+            text-transform: none;
+        }
+
+        .pictureClass {
+            
+            .u-upload {
+                .u-upload__wrap{
+                    /* display: inline-block; */
+                    flex-direction: row;
+                    /* justify-content: space-between; */
+                    flex-wrap: wrap;
+                    /* flex: 1; */
+                    gap: 24rpx;
+                    .u-upload__wrap__preview{
+                        position: relative;
+                        width: calc(25% - 20rpx);
+                    }
+                    
+                }
+            }
+
+            .u-upload__wrap__preview {
+                margin: 0;
+                width: calc(25% - 22rpx)
+            }
+
+
+        }
+    }
+
+    .contentDetail {
+        background: #FFFFFF;
+        border-radius: 20rpx 20rpx 20rpx 20rpx;
+        padding: 0 20rpx 24rpx 20rpx;
+
+        .tip {
+            font-weight: bold;
+            font-size: 28rpx;
+            color: #333333;
+            text-align: left;
+            font-style: normal;
+            text-transform: none;
+            padding-top: 18rpx;
+        }
+
+        .item {
+            width: 100%;
+            margin-top: 24rpx;
+        }
+
+        .title {
+            font-weight: 400;
+            font-size: 26rpx;
+            color: #333333;
+            text-align: left;
+            font-style: normal;
+            text-transform: none;
+        }
+
+        .obj {
+            margin-top: 24rpx;
+            font-weight: 400;
+            font-size: 26rpx;
+            color: #999999;
+            text-align: left;
+            font-style: normal;
+            text-transform: none;
+            display: flex;
+        }
+
+        .radioBox {
+            display: flex;
+        }
+
+
+
+    }
+
+    .tip2 {
+        margin-top: 24rpx;
+
+        .title {
+            font-weight: bold;
+            font-size: 28rpx;
+            color: #333333;
+            text-align: left;
+            font-style: normal;
+            text-transform: none;
+        }
+
+        .textClass {
+            margin-top: 24rpx;
+            font-weight: 400;
+            font-size: 26rpx;
+            color: #999;
+            text-align: left;
+            font-style: normal;
+            text-transform: none;
+            display: flex;
+        }
+
+
+    }
+
+
+
+
+
+
+}
+</style>

src/points/productDetails/components/redemptionRules.vue

@@ -0,0 +1,82 @@
+<template>
+    <view>
+        <view class="popupClass">
+                <view class="niticeClass">
+                    <view class="title">
+                        兑换须知
+                    </view>
+                    <view class="text">
+                        1、会员可凭上述积分兑换“广誉源会员定制玻璃杯”一个； <br>
+                        2、双层曲线杯身在隔热防烫的同时，让您的手掌体验一次美妙的抓握感； <br>
+                        3、积分兑换商品不支持质量问题外的退换货服务，请您先确认后签收；<br>
+                        4、积分商城仅支持中国大陆地区的兑换邮寄服务，我们将在10个工作日内寄出；<br>
+                    </view>
+
+                    <view class="title">平台说明 </view>
+                    <view class="text">
+                        价格说明：划线价格：商品的专柜价、吊牌价、正品零售价、厂商指导价，并非原价，仅供参考未划线价格：商品的实时标价，不因表述的差异改变性质。具体成交价格根据商品参加活动、或会员优惠、积分等发生变化，最终以订单结算页价格为准。
+                    </view>
+                </view>
+            </view>
+    </view>
+
+</template>
+
+<script>
+
+export default {
+    components: {},
+    data() {
+        return {
+            showPopup: false
+
+
+        }
+    },
+    onLoad(data) {
+
+    },
+    onShow() {
+
+    },
+    onPageScroll() {
+    },
+
+    methods: {
+
+
+    }
+}
+</script>
+
+<style lang="scss" scoped>
+.popupClass {
+    background-color: #F5F8F8;
+    padding: 24rpx 32rpx 0 32rpx;
+    font-family: PingFang SC, PingFang SC;
+
+    .niticeClass {
+        background: #FFFFFF;
+        border-radius: 20rpx 20rpx 20rpx 20rpx;
+        margin-top: 24rpx;
+        padding: 24rpx;
+        position: relative;
+
+        .title {
+            font-weight: 800;
+            font-size: 28rpx;
+            color: #333333;
+            line-height: 28rpx;
+            text-align: left;
+            font-style: normal;
+            text-transform: none;
+            width: 686rpx;
+            margin: 24rpx 0;
+        }
+
+        .text {
+            color: #999999;
+        }
+    }
+}
+</style>

src/points/productDetails/components/selectProduct.vue

@@ -0,0 +1,283 @@
+<template>
+    <view class="content">
+        <image style="width: 35rpx;height: 35rpx;position: absolute;right: 40rpx;top:40rpx" @click="closeSelectProduct"
+            src="@/static/points/closeIcon.png" mode=""></image>
+        <view class="addressBox">
+            <uni-icons class="icon location icon-cuo" type="location" size="20" @tap=""></uni-icons>
+            <text class="name">张三</text>
+            <text class="address">山西省太原市小店区营盘街道某某小区</text>
+            <image style="width: 28rpx;height: 28rpx;position: absolute;right: 0;" @click="addressSelectFun"
+                src="@/static/points/Keyboard_arrow_rifht.png" mode=""></image>
+
+        </view>
+        <view class="productPrice">
+            <view style="display:flex;justify-content: space-between;">
+                <view style="display:flex;">
+                    <view>
+                        <image style="width: 120rpx;height: 120rpx;" src="@/static/points/closeIcon.png" mode="">
+                        </image>
+                    </view>
+                    <view
+                        style="margin-left: 24rpx;display: flex;flex-direction: column;justify-content: space-between;">
+                        <view class="price">实付价 ￥10元+1000积分 </view>
+                        <view class="spec">已选:大号,白色 </view>
+                    </view>
+
+                </view>
+                <view class="deletePrice">100</view>
+            </view>
+        </view>
+        <!--选择规格 -->
+        <view class="specClass">
+            <view class="title">颜色（3）</view>
+            <view style="display: flex;flex-wrap: wrap;">
+                <view class="specCombination" :class="value == 4 ? 'active' : ''" v-for="value in 4">
+                    浅纹-白色-普通
+                </view>
+            </view>
+            <view class="title" style="margin-top: 24rpx;">尺码（2）</view>
+            <view style="display: flex;flex-wrap: wrap;">
+                <view class="specCombination" :class="value == 2 ? 'active' : ''" v-for="value in 2">
+                    普通大号 - 1000ML
+                </view>
+            </view>
+
+        </view>
+        <!--运费 -->
+        <view class="yunFeiClass">
+            <view class="text">运费</view>
+            <view class="price">￥0</view>
+
+        </view>
+        <!--订单备注 -->
+        <view class="nodeClass">
+            <view class="text">订单备注</view>
+            <input type="text" maxlength="200" v-model="reasonRefusal" placeholder="选填，请填写您的备注信息，限200字" />
+
+
+        </view>
+        <view class="footer-bar">
+            <u-button :customStyle="{
+                color: '#fff',
+                background: '#03C1B8'
+            }" @click="redeemNowFun">实付价 ￥10元+1000积分</u-button>
+        </view>
+    </view>
+
+</template>
+
+<script>
+
+export default {
+    components: {},
+    data() {
+        return {
+            showPopup: false
+
+
+        }
+    },
+    onLoad(data) {
+
+    },
+    onShow() {
+
+    },
+    onPageScroll() {
+    },
+
+    methods: {
+        //关闭选择商品页
+        closeSelectProduct() {
+            this.$emit('closeSelectProduct')
+        },
+        //去我的地址页面
+        addressSelectFun() {
+             uni.navigateTo({
+                url: '/points/productDetails/addressManagement'
+            });
+        }
+
+    }
+}
+</script>
+
+<style lang="scss" scoped>
+.content {
+    background-color: #F5F8F8;
+    padding: 24rpx 32rpx 0 32rpx;
+    font-family: PingFang SC, PingFang SC;
+    height: 1350rpx;
+    border-radius: 20rpx 20rpx 0 0;
+
+    .addressBox {
+        position: relative;
+        margin-top: 70rpx;
+        display: flex;
+        align-items: center;
+        border-radius: 20rpx 20rpx 20rpx 20rpx;
+
+        .name {
+            margin: 0 24rpx;
+            font-weight: 500;
+            font-size: 32rpx;
+            color: #333333;
+            line-height: 40rpx;
+            text-align: left;
+            font-style: normal;
+            text-transform: none;
+        }
+
+        .address {
+            font-weight: 500;
+            font-size: 28rpx;
+            color: #333333;
+            text-align: left;
+            font-style: normal;
+            text-transform: none;
+        }
+    }
+
+    .productPrice {
+        background-color: #fff;
+        margin-top: 24rpx;
+        padding: 24rpx;
+        border-radius: 20rpx 20rpx 20rpx 20rpx;
+
+        .price {
+            font-weight: bold;
+            font-size: 28rpx;
+            color: #03C1B8;
+            text-align: left;
+            font-style: normal;
+            text-transform: none;
+        }
+
+        .spec {
+            font-weight: 500;
+            font-size: 26rpx;
+            color: #999999;
+            text-align: left;
+            font-style: normal;
+            text-transform: none;
+
+        }
+
+        .deletePrice {
+            font-weight: 500;
+            font-size: 32rpx;
+            color: #666666;
+            text-align: left;
+            font-style: normal;
+            text-decoration-line: line-through;
+            text-transform: none;
+        }
+    }
+
+    .specClass {
+        background-color: #fff;
+        margin-top: 24rpx;
+        padding: 24rpx;
+        height: 396rpx;
+        border-radius: 20rpx 20rpx 20rpx 20rpx;
+
+        .title {
+            font-weight: bold;
+            font-size: 28rpx;
+            color: #333333;
+            text-align: left;
+            font-style: normal;
+            text-transform: none;
+        }
+
+        .specCombination {
+            font-weight: 500;
+            font-size: 24rpx;
+            color: #666666;
+            text-align: left;
+            font-style: normal;
+            text-transform: none;
+            height: 56rpx;
+            background: #F0F0F0;
+            border-radius: 38rpx 38rpx 38rpx 38rpx;
+            margin-right: 16rpx;
+            padding: 8rpx 16rpx;
+            margin-top: 24rpx;
+        }
+
+        .active {
+            background: #03C1B8;
+            border-radius: 38rpx 38rpx 38rpx 38rpx;
+            color: #fff;
+        }
+
+
+    }
+
+    .yunFeiClass {
+        display: flex;
+        justify-content: space-between;
+        height: 92rpx;
+        background: #FFFFFF;
+        border-radius: 20rpx 20rpx 20rpx 20rpx;
+        margin-top: 24rpx;
+        align-items: center;
+        padding: 24rpx;
+
+        .text {
+            font-weight: 500;
+            font-size: 28rpx;
+            color: #666666;
+            line-height: 40rpx;
+            text-align: left;
+            font-style: normal;
+            text-transform: none;
+        }
+    }
+
+    .nodeClass {
+        margin-top: 24rpx;
+        padding: 24rpx;
+        height: 92rpx;
+        background: #FFFFFF;
+        border-radius: 20rpx 20rpx 20rpx 20rpx;
+        display: flex;
+        align-items: center;
+        justify-content: space-between;
+
+        .text {
+            width: 115rpx;
+            font-weight: 500;
+            font-size: 28rpx;
+            color: #666666;
+            line-height: 40rpx;
+            text-align: left;
+
+        }
+
+        input {
+            font-weight: 500;
+            font-size: 26rpx;
+            color: #999999;
+            line-height: 40rpx;
+            text-align: right;
+            font-style: normal;
+            text-transform: none;
+            width: 450rpx;
+        }
+    }
+}
+
+
+
+.footer-bar {
+    .u-button {
+        width: 670rpx;
+        height: 84rpx;
+        border-radius: 98rpx 98rpx 98rpx 98rpx;
+        margin: 20rpx 40rpx;
+        background: '#000';
+
+    }
+}
+</style>

src/points/productDetails/index.vue

@@ -20,11 +20,11 @@
           <view class="discribeClass">双层曲线杯身在隔热防烫</view>
           <view class="serviceClass">
             <ImageItem style="width: 24rpx;height: 24rpx;margin-right: 4rpx;" src="/static/points/Group4.png" />放心购
-            <ImageItem style="width: 24rpx;height: 24rpx;margin-left: 24rpx;margin-right: 4rpx;"
+            <ImageItem style="width: 24rpx;height: 24rpx;margin-left: 26rpx;margin-right: 4rpx;"
               src="/static/points/Group6.png" />假一赔三
-            <ImageItem style="width: 24rpx;height: 24rpx;margin-left: 24rpx;margin-right: 4rpx;"
+            <ImageItem style="width: 24rpx;height: 24rpx;margin-left: 26rpx;margin-right: 4rpx;"
               src="/static/points/Group2.png" /> 7天无理由退换
-            <ImageItem style="width: 24rpx;height: 24rpx;margin-left: 24rpx;margin-right: 4rpx;"
+            <ImageItem style="width: 24rpx;height: 24rpx;margin-left: 26rpx;margin-right: 4rpx;"
               src="/static/points/return7.png" /> 破损包退换
           </view>
 
@@ -33,26 +33,28 @@
         <view class="seconedRow">
           <view class="specClass">
             <view style="display: flex;align-items: center;">
-              <text style="color: 666666;">规格</text>
+              <text style="color: #666666;">规格</text>
               <ImageItem class="imgClass" v-for="item in 3" src="/static/points/Group6.png" />
             </view>
             <view style="display: flex;align-items: center;">
-              <text style="color: 666666;">已选：白色，大号</text>
-              <ImageItem style="width: 28rpx;height: 28rpx;margin-left: 8rpx;"
-                src="/static/points/Keyboard_arrow_rifht.png" />
+              <text style="color: #666666;margin-right: 8rpx;">已选：白色，大号</text>
+              <image style="width: 28rpx;height: 28rpx;" @click="selectProductShowFun"
+                  src="@/static/points/Keyboard_arrow_rifht.png" mode=""></image>
             </view>
           </view>
           <view class="arriveAddressClass">
-            <text style="color: 666666;margin-right: 24rpx;">送至</text>
+            <text style="color: #666666;margin-right: 24rpx;">送至</text>
             <text>山西省太原市万柏林区</text>
-            <ImageItem style="width: 28rpx;height: 28rpx;position: absolute;right: 0;"
-              src="/static/points/Keyboard_arrow_rifht.png" />
+            <span style="position: absolute;right: 0;">
+              <image style="width: 28rpx;height: 28rpx;" @click="addressSelectFun"
+                src="@/static/points/Keyboard_arrow_rifht.png" mode=""></image>
+            </span>
           </view>
           <view class="seedAddressClass">
-            <text style="color: 666666;margin-right: 24rpx;">发货</text>
+            <text style="color: #666666;margin-right: 24rpx;">发货</text>
             <text>山西省太原市小店区 | 免运费</text>
           </view>
-          <view class="promiseSeedTime" style="margin-right: 104rpx;">
+          <view class="promiseSeedTime" style="margin-left: 80rpx;">
             下单后48小时内发货
           </view>
 
@@ -65,8 +67,10 @@
         <view class="niticeClass">
           <view class="title">
             兑换须知
-            <ImageItem @click="showPopup = true" style="width: 28rpx;height: 28rpx;position: absolute;right: 0;"
-              src="/static/points/Keyboard_arrow_rifht.png" />
+            <span style="position: absolute;right: 24rpx;">
+              <image style="width: 28rpx;height: 28rpx;" @click="clichFun"
+                src="@/static/points/Keyboard_arrow_rifht.png" mode=""></image>
+            </span>
           </view>
           <view class="text">
             1、会员可凭上述积分兑换“广誉源会员定制玻璃杯”一个； <br>
@@ -78,6 +82,7 @@
         <!-- 平台须知 -->
         <view class="niticeClass">
           <view class="title">平台说明
+
             <span style="position: absolute;right: 24rpx;">
               <image style="width: 28rpx;height: 28rpx;" @click="clichFun"
                 src="@/static/points/Keyboard_arrow_rifht.png" mode=""></image>
@@ -90,47 +95,46 @@
         </view>
       </view>
 
-
-      <u-popup :show="showPopup" mode="bottom" @close="showPopup = false" round="20">
-        <view class="popupClass">
-          <view class="niticeClass">
-            <view class="title">
-              兑换须知
-              <ImageItem @click="showPopup = true" style="width: 28rpx;height: 28rpx;position: absolute;right: 0;"
-                src="/static/points/Keyboard_arrow_rifht.png" />
-            </view>
-            <view class="text">
-              1、会员可凭上述积分兑换“广誉源会员定制玻璃杯”一个； <br>
-              2、双层曲线杯身在隔热防烫的同时，让您的手掌体验一次美妙的抓握感； <br>
-              3、积分兑换商品不支持质量问题外的退换货服务，请您先确认后签收；<br>
-              4、积分商城仅支持中国大陆地区的兑换邮寄服务，我们将在10个工作日内寄出；<br>
-            </view>
-
-            <view class="title">平台说明 </view>
-            <view class="text">
-              价格说明：划线价格：商品的专柜价、吊牌价、正品零售价、厂商指导价，并非原价，仅供参考未划线价格：商品的实时标价，不因表述的差异改变性质。具体成交价格根据商品参加活动、或会员优惠、积分等发生变化，最终以订单结算页价格为准。
-            </view>
-          </view>
-
-        </view>
+      <view class="footer-bar">
+        <u-button :customStyle="{
+          color: '#fff',
+          background: '#03C1B8'
+        }" @click="redeemNowFun">立即兑换</u-button>
+      </view>
+      <!-- <view class="footer-bar">
+        <u-button :customStyle="{
+          color: '#999999 ',
+          background: '#eee'
+        }">库存不足</u-button>
+      </view> -->
+
+      <u-popup :show="redemptionRulesShowPopup" mode="bottom" @close="redemptionRulesShowPopup = false" round="20">
+        <RedemptionRules ref="redemptionRulesRef"></RedemptionRules>
+      </u-popup>
+      <u-popup :show="selectProductShowPopup" mode="bottom" round="10">
+        <SelectProduct ref="selectProductRef" @closeSelectProduct="closeSelectProduct"></SelectProduct>
       </u-popup>
 
     </scroll-view>
 
 
 
+
   </view>
 </template>
 
 <script>
 import ImageItem from "@/components/swiper/components/image.vue";
+import RedemptionRules from "./components/redemptionRules.vue";
+import SelectProduct from "./components/selectProduct.vue";
 
 export default {
-  components: { ImageItem },
+  components: { ImageItem, RedemptionRules, SelectProduct },
   data() {
     return {
       isTop: 0,
-      showPopup: false
+      redemptionRulesShowPopup: false,
+      selectProductShowPopup: false,
 
 
     }
@@ -150,9 +154,29 @@ export default {
     handleContentScroll(e) {
       this.isTop = e.detail.scrollTop > 0
     },
+    //兑换须知页面
     clichFun() {
-      console.log('5555')
-      this.showPopup = true
+      this.redemptionRulesShowPopup = true
+    },
+    //立即兑换
+    redeemNowFun() {
+      uni.navigateTo({
+        url: '/points/productDetails/paymentSuccessful'
+      });
+    },
+    //打开选择商品页
+    selectProductShowFun() {
+      this.selectProductShowPopup = true
+    },
+
+    closeSelectProduct() {
+      this.selectProductShowPopup = false
+    },
+    //去我的地址页面
+    addressSelectFun() {
+      uni.navigateTo({
+        url: '/points/productDetails/addressManagement'
+      });
     },
 
     //导航栏返回按钮
@@ -177,6 +201,21 @@ export default {
   border: 1px solid red
 }
 
+.footer-bar {
+  .u-button {
+    height: 84rpx;
+    border-radius: 98rpx 98rpx 98rpx 98rpx;
+    margin: 20rpx 40rpx;
+    font-weight: bold;
+    font-size: 32rpx;
+    line-height: 36rpx;
+    text-align: center;
+    font-style: normal;
+    text-transform: none;
+
+  }
+}
+
 .content {
   background-color: #F5F8F8;
   padding: 24rpx 32rpx 0 32rpx;
@@ -273,7 +312,7 @@ export default {
       display: flex;
       align-items: center;
       justify-content: space-between;
-
+      position: relative;
       .imgClass {
         width: 64rpx;
         height: 64rpx;
@@ -362,7 +401,7 @@ export default {
 
     .title {
       font-weight: 800;
-      font-size: 32rpx;
+      font-size: 28rpx;
       color: #333333;
       line-height: 28rpx;
       text-align: left;

src/points/productDetails/paymentSuccessful.vue

@@ -0,0 +1,313 @@
+<template>
+    <view>
+        <scroll-view :scroll-y="true" @scroll="handleContentScroll">
+            <!-- 导航栏  :leftIconColor="!isTop ? '#fff' : '#000'"-->
+            <u-navbar :placeholder="true" autoBack @click="autoBackFun">
+                <view slot="center">
+                    <view class="centerTitle" style="background-color: #fff;">{{ title }}</view>
+                </view>
+            </u-navbar>
+
+            <view class="content">
+                <view class="contentBox">
+                    <view class="successClass">
+                        <view style="margin-top: 36rpx;">
+                            <image style="width: 320rpx;height: 172rpx;" @click="selectProductShowFun"
+                                src="@/static/points/successIcon.png" mode=""></image>
+                        </view>
+                        <view class="payStatus"> 商品兑换成功</view>
+                        <view class="promiseSeedTime">我们将在3个工作日寄出 </view>
+                    </view>
+                    <view style="height: 2rpx;background-color: #f0f0f0;margin-top: 40rpx;"> </view>
+
+                    <view class="address">
+                        <view class="shxx">收获信息</view>
+                        <view class="addressBox">
+                            <image style="width: 45rpx;height: 40rpx;" @click="addressSelectFun"
+                                src="@/static/points/addressIcon.png" mode=""></image>
+                            <view style="margin-left: 16rpx;">
+                                <view class="name">
+                                    张三 <text>
+                                        15032624563</text>
+                                </view>
+                                <view class="address">
+                                    山西省太原市小店区营盘街道某某小区1号楼1单元101
+                                </view>
+                            </view>
+
+                        </view>
+
+                    </view>
+                </view>
+
+            </view>
+            <view class="buttonClass">
+                <u-button :customStyle="{
+                    color: '#fff',
+                    background: '#03C1B8'
+                }" @click="goHome">返回首页</u-button>
+
+                <u-button :customStyle="{
+                    color: '#03C1B8 ',
+                    background: ''
+                }" @click="checkOrder">查看订单</u-button>
+
+                <u-button :customStyle="{
+                    color: '#03C1B8 ',
+                    background: ''
+                }" @click="applyRefundFun">申请退款</u-button>
+
+                <u-button :customStyle="{
+                    color: '#03C1B8 ',
+                    background: ''
+                }" @click="applyExchangeFun">申请换货</u-button>
+            </view>
+
+        </scroll-view>
+
+    </view>
+</template>
+
+<script>
+import ApplyRefund from './applyRefund.vue';
+
+
+export default {
+    components: {},
+    data() {
+        return {
+            title: '兑换成功',
+            isTop: 0,
+            redemptionRulesShowPopup: false,
+            selectProductShowPopup: false,
+            list: [
+                {
+                    addressName: '迎泽西大街86号信达国际金融中心',
+                    userName: '郭丽丽',
+                    userPhone: '16635680981',
+                    defaultAddress: '默认',
+                }, {
+                    addressName: '迎泽西大街86号信达国际金融中心',
+                    userName: '郭丽丽',
+                    userPhone: '16635680981',
+                }, {
+                    addressName: '迎泽西大街86号信达国际金融中心',
+                    userName: '郭丽丽',
+                    userPhone: '16635680981',
+                }, {
+                    addressName: '迎泽西大街86号信达国际金融中心',
+                    userName: '郭丽丽',
+                    userPhone: '16635680981',
+                }, {
+                    addressName: '迎泽西大街86号信达国际金融中心',
+                    userName: '郭丽丽',
+                    userPhone: '16635680981',
+                },
+            ]
+
+
+        }
+    },
+    onLoad(data) {
+
+    },
+    onShow() {
+
+    },
+    onPageScroll(e) {
+        //console.log("滚动距离为：" + e.scrollTop);
+        this.isTop = e.scrollTop;
+    },
+
+    methods: {
+        //申请换货
+        applyExchangeFun() {
+            uni.navigateTo({
+                url: '/points/productDetails/applyExchange'
+            });
+        },
+        //申请退款
+        applyRefundFun() {
+            uni.navigateTo({
+                url: `/points/productDetails/applyRefund?receivedStatus=1&tab=1`
+            });
+        },
+
+        handleContentScroll(e) {
+            this.isTop = e.detail.scrollTop > 0
+        },
+        clichFun() {
+
+        },
+        //返回首页
+        goHome() {
+            uni.switchTab({
+                url: '/pages/index/index'
+            });
+        },
+        //查看订单
+        checkOrder() {
+            uni.navigateTo({
+                url: '/points/productDetails/pendingPayment'
+            });
+        },
+        //返回上一页
+        autoBackFun() {
+            uni.navigateBack();
+        },
+        //去编辑地址
+        goEditAddress() {
+            uni.navigateTo({
+                url: '/pages/address/address-edit'
+            });
+            // /let str = uni.$u.queryParams(params);
+            // uni.navigateTo({
+            // 	url: `/packageA/pages/shop/coupon/couponDetail${str}`
+            // });
+        },
+
+    }
+}
+</script>
+
+<style></style>
+<style lang="scss" scoped>
+.footer-bar {
+    .u-button {
+        width: 670rpx;
+        height: 84rpx;
+        border-radius: 98rpx 98rpx 98rpx 98rpx;
+        margin: 20rpx 40rpx;
+        background: '#000';
+        font-weight: 500;
+        font-size: 32rpx;
+        color: #FFFFFF;
+        line-height: 36rpx;
+        text-align: center;
+        font-style: normal;
+        text-transform: none;
+
+
+    }
+}
+
+.centerTitle {
+    font-family: PingFang SC, PingFang SC;
+    font-weight: 500;
+    font-size: 34rpx;
+    color: #060606;
+    text-align: center;
+    font-style: normal;
+    text-transform: none;
+}
+
+.buttonClass {
+    display: flex;
+    padding: 32rpx;
+    font-family: PingFang SC, PingFang SC;
+
+    button {
+        width: 288rpx;
+        height: 84rpx;
+        border-radius: 98rpx 98rpx 98rpx 98rpx;
+        border: 2rpx solid #03C1B8;
+    }
+
+}
+
+.content {
+    background-color: #F8F8F8;
+    padding: 32rpx;
+    font-family: PingFang SC, PingFang SC;
+    //height: 658rpx;
+    border-radius: 20rpx 20rpx 20rpx 20rpx;
+
+
+    .contentBox {
+        padding: 32rpx;
+        width: 686rpx;
+        height: 658rpx;
+        background: #FFFFFF;
+        border-radius: 20rpx 20rpx 20rpx 20rpx;
+    }
+
+    .successClass {
+        display: flex;
+        flex-direction: column;
+        align-items: center;
+        background: #FFFFFF;
+        border-radius: 20rpx 20rpx 20rpx 20rpx;
+
+    }
+
+    .payStatus {
+        font-weight: bold;
+        font-size: 36rpx;
+        color: #333333;
+        line-height: 36rpx;
+        text-align: left;
+        font-style: normal;
+        text-transform: none;
+        margin-top: 32rpx;
+    }
+
+    .promiseSeedTime {
+        font-weight: 500;
+        font-size: 28rpx;
+        color: #999999;
+        line-height: 40rpx;
+        text-align: left;
+        font-style: normal;
+        text-transform: none;
+        margin-top: 24rpx;
+    }
+
+    .address {
+        .shxx {
+            margin-top: 20rpx;
+            font-weight: bold;
+            font-size: 28rpx;
+            color: #333333;
+            line-height: 40rpx;
+            text-align: left;
+            font-style: normal;
+            text-transform: none;
+        }
+
+        .addressBox {
+            margin-top: 24rpx;
+            display: flex;
+            align-items: flex-start;
+
+            .name {
+                font-weight: 500;
+                font-size: 32rpx;
+                color: #333333;
+                line-height: 40rpx;
+                text-align: left;
+                font-style: normal;
+                text-transform: none;
+
+            }
+
+            .address {
+                margin-top: 8rpx;
+                font-weight: 500;
+                font-size: 28rpx;
+                color: #666666;
+                line-height: 40rpx;
+                text-align: left;
+                font-style: normal;
+                text-transform: none;
+            }
+
+        }
+
+
+    }
+
+
+
+
+}
+</style>

src/points/productDetails/pendingPayment.vue

@@ -0,0 +1,555 @@
+<template>
+    <view>
+        <scroll-view :scroll-y="true" @scroll="handleContentScroll">
+            <u-navbar :placeholder="true" autoBack @click="autoBackFun">
+                <view slot="center">
+                    <view class="centerTitle" style="background-color: #fff;">{{ title }}</view>
+                </view>
+            </u-navbar>
+
+            <view class="contentBox">
+                <view class="remainingTime">
+                    {{ orderStatus }}
+                </view>
+                <view class="content">
+                    <view class="addressBox">
+                        <image style="width: 45rpx;height: 40rpx;" @click="addressSelectFun"
+                            src="@/static/points/addressIcon.png" mode=""></image>
+                        <view style="margin-left: 16rpx;">
+                            <view class="name">
+                                张三 <text>
+                                    15032624563</text>
+                            </view>
+                            <view class="address">
+                                山西省太原市小店区营盘街道某某小区1号楼1单元101
+                            </view>
+                        </view>
+
+                    </view>
+
+                    <image style="width: 35rpx;height: 35rpx;position: absolute;right: 40rpx;top:40rpx"
+                        @click="closeSelectProduct" src="@/static/points/closeIcon.png" mode=""></image>
+
+                    <view class="productPrice">
+                        <view style="display:flex;">
+                            <view>
+                                <image style="width: 120rpx;height: 120rpx;" src="@/static/points/closeIcon.png"
+                                    mode="">
+                                </image>
+                            </view>
+                            <view
+                                style="margin-left: 24rpx;display: flex;flex-direction: column;justify-content: space-between;">
+                                <view class="productName">广誉源会员定制玻璃杯 </view>
+                                <view class="spec">已选:大号,白色 </view>
+                                <view class="price">实付价 ￥10元+1000积分 </view>
+
+                            </view>
+                        </view>
+                        <view class="productPrice1">
+                            <view class="text">商品金额</view>
+                            <view class="price">￥10 +1000积分</view>
+                        </view>
+                        <view class="shippingFee">
+                            <view class="text">运费</view>
+                            <view class="text">￥0</view>
+                        </view>
+                        <view style="height: 2rpx;background-color: #f0f0f0;margin-top: 20rpx;"> </view>
+                        <view class="total">
+                            <text class="text">合计：</text>
+                            <text class="price">¥ 10</text>
+                        </view>
+                    </view>
+                    <view class="weiChect">
+                        <view class="text">微信支付</view>
+                        <view class="text">微信支付</view>
+                    </view>
+                    <view class="orderInfo">
+                        <view class="item">
+                            <view class="text">订单编号</view>
+                            <view class="text1">246453782748937746</view>
+                        </view>
+                        <view class="item">
+                            <view class="text">下单时间</view>
+                            <view class="text1">2025-09-14 17:21:55</view>
+                        </view>
+                        <view class="item">
+                            <view class="text">支付方式</view>
+                            <view class="text1">现金</view>
+                        </view>
+                        <view class="item">
+                            <view class="text">订单备注</view>
+                            <view class="text1">无</view>
+                        </view>
+
+                    </view>
+
+
+                </view>
+            </view>
+            <view class="buttonClass">
+                <u-button v-if="title == '待支付'" :customStyle="{
+                    color: '#999',
+                    background: ''
+                }" @click="cancelOrderFun">取消支付</u-button>
+
+                <u-button v-if="title == '待支付'" :customStyle="{
+                    color: '#fff ',
+                    background: '#03C1B8'
+                }" @click="checkOrder">去付款</u-button>
+
+                <u-button v-if="title == '订单取消'" :customStyle="{
+                    color: '#fff ',
+                    background: '#03C1B8'
+                }" @click="checkOrder">再次购买</u-button>
+            </view>
+
+        </scroll-view>
+
+
+        <!-- 取消订单 <u-line></u-line>-->
+        <u-popup :show="cancelOrderShowPopup" mode="bottom" round="10">
+            <view class="content">
+
+            </view>
+
+            <view class="popup-con">
+                <!-- 标题 -->
+                <view class="popup-text">
+                    <text>取消订单</text>
+                    <text @click="cancelOrderShowPopup = false">取消</text>
+                </view>
+                <!-- 项目列表 -->
+                <view class="refund-items">
+                    <view class="reason">请选择退款原因</view>
+                    <u-radio-group v-model="selectReason" @change="groupChange">
+
+                        <view style="padding: 0 20rpx 24rpx 20rpx;">
+                            <view class="radioBox">
+                                <u-radio activeColor="#03C1B8 " name='1'></u-radio>买错了/不想要
+                            </view>
+                            <view class="radioBox">
+                                <u-radio activeColor="#03C1B8 " name='2'></u-radio> 商品无货
+                            </view>
+                            <view class="radioBox">
+                                <u-radio activeColor="#03C1B8 " name='3'></u-radio> 商品信息填写错误
+                            </view>
+                            <view class="radioBox">
+                                <u-radio activeColor="#03C1B8 " name='4'></u-radio> 地址信息填写错误
+                            </view>
+                            <view class="radioBox">
+                                <u-radio activeColor="#03C1B8 " name='5'></u-radio> 其他原因
+                            </view>
+                        </view>
+                    </u-radio-group>
+
+                </view>
+                <view class="popupButtonClass">
+                    <u-button :customStyle="{
+                        color: '#999',
+                        background: '#eee'
+                    }" @click="cancelOrderSubmit">提交</u-button>
+                </view>
+            </view>
+
+
+
+        </u-popup>
+
+    </view>
+
+
+
+
+
+</template>
+
+<script>
+
+export default {
+    components: {},
+    data() {
+        return {
+            selectReason:'',
+            title: '待支付',
+            cancelOrderShowPopup: false,
+            orderStatus: '剩余时间 14:59', //超时未支付
+
+
+
+        }
+    },
+    onLoad(data) {
+
+    },
+    onShow() {
+
+    },
+    onPageScroll() {
+    },
+
+    methods: {
+        //取消订单提交按钮
+        cancelOrderSubmit() {
+            this.cancelOrderShowPopup = false
+            this.title = '订单取消'
+            this.orderStatus = '您已取消支付'
+        },
+        //关闭取消订单选择页
+        closeCancelOrderFun() {
+            this.cancelOrderShowPopup = false
+        },
+        //取消订单
+        cancelOrderFun() {
+            this.cancelOrderShowPopup = true
+        },
+        //去我的地址页面
+        addressSelectFun() {
+            uni.navigateTo({
+                url: '/points/productDetails/addressManagement'
+            });
+        }
+
+    }
+}
+</script>
+
+<style lang="scss" scoped>
+.centerTitle {
+    font-family: PingFang SC, PingFang SC;
+    font-weight: 500;
+    font-size: 34rpx;
+    color: #060606;
+    text-align: center;
+    font-style: normal;
+    text-transform: none;
+}
+
+
+
+.buttonClass {
+    display: flex;
+    align-items: center;
+    justify-content: flex-end;
+    font-family: PingFang SC, PingFang SC;
+
+    button {
+        width: 168rpx;
+        display: flex;
+        align-items: center;
+        height: 56rpx;
+        line-height: 40rpx;
+        border-radius: 98rpx 98rpx 98rpx 98rpx;
+        border: 2rpx solid #03C1B8;
+        font-size: 26rpx;
+        padding: 0 0 10rpx 0;
+        margin: 0 32rpx 0 0;
+    }
+}
+
+.contentBox {
+    background-image: url("@/static/points/orderBg.png");
+    background-size: 100%;
+    background-repeat: no-repeat;
+    background-color: #F5F8F8;
+    padding-top: 54rpx;
+
+    .remainingTime {
+        font-weight: 500;
+        font-size: 32rpx;
+        color: #FFFFFF;
+        line-height: 40rpx;
+        text-align: left;
+        font-style: normal;
+        text-transform: none;
+        text-align: center;
+    }
+
+}
+
+.content {
+    padding: 24rpx 32rpx 0 32rpx;
+    font-family: PingFang SC, PingFang SC;
+    border-radius: 20rpx 20rpx 0 0;
+
+    .addressBox {
+        margin-top: 30rpx;
+        padding: 24rpx 32rpx;
+        display: flex;
+        align-items: flex-start;
+        height: 176rpx;
+        background: #FFFFFF;
+        border-radius: 20rpx 20rpx 20rpx 20rpx;
+
+        .name {
+            font-weight: 500;
+            font-size: 32rpx;
+            color: #333333;
+            line-height: 40rpx;
+            text-align: left;
+            font-style: normal;
+            text-transform: none;
+
+        }
+
+        .address {
+            margin-top: 8rpx;
+            font-weight: 500;
+            font-size: 28rpx;
+            color: #666666;
+            line-height: 40rpx;
+            text-align: left;
+            font-style: normal;
+            text-transform: none;
+        }
+
+    }
+
+    .productPrice {
+        background-color: #fff;
+        margin-top: 24rpx;
+        padding: 24rpx;
+        border-radius: 20rpx 20rpx 20rpx 20rpx;
+
+        .productName {
+            font-weight: bold;
+            font-size: 28rpx;
+            color: #333333;
+            text-align: left;
+            font-style: normal;
+            text-transform: none;
+        }
+
+        .price {
+            font-weight: bold;
+            font-size: 26rpx;
+            color: #333333;
+            text-align: left;
+            font-style: normal;
+            text-transform: none;
+        }
+
+        .spec {
+            font-weight: 500;
+            font-size: 26rpx;
+            color: #999999;
+            text-align: left;
+            font-style: normal;
+            text-transform: none;
+
+        }
+
+        .shippingFee {
+            margin-top: 22rpx;
+            display: flex;
+            justify-content: space-between;
+
+            .text {
+                font-weight: 500;
+                font-size: 26rpx;
+                color: #666666;
+                text-align: left;
+                font-style: normal;
+                text-transform: none;
+
+            }
+
+            .price {
+                font-weight: 500;
+                font-size: 28rpx;
+                color: #03C1B8;
+                text-align: left;
+                font-style: normal;
+                text-transform: none;
+            }
+        }
+
+        .productPrice1 {
+            margin-top: 16rpx;
+            display: flex;
+            justify-content: space-between;
+
+            .text {
+                font-weight: 500;
+                font-size: 26rpx;
+                color: #666666;
+                text-align: left;
+                font-style: normal;
+                text-transform: none;
+
+            }
+
+            .price {
+                font-weight: 500;
+                font-size: 28rpx;
+                color: #03C1B8;
+                text-align: left;
+                font-style: normal;
+                text-transform: none;
+            }
+        }
+
+        .total {
+            text-align: right;
+
+            .text {
+                font-weight: 400;
+                font-size: 28rpx;
+                color: #2F3437;
+                text-align: left;
+                font-style: normal;
+                text-transform: none;
+
+            }
+
+            .price {
+                font-weight: 800;
+                font-size: 28rpx;
+                color: #03C1B8;
+                text-align: left;
+                font-style: normal;
+                text-transform: none;
+            }
+
+        }
+    }
+
+    .weiChect {
+        height: 94rpx;
+        background: #FFFFFF;
+        border-radius: 20rpx 20rpx 20rpx 20rpx;
+        display: flex;
+        justify-content: space-between;
+        align-items: center;
+        font-weight: 500;
+        font-size: 28rpx;
+        color: #333333;
+        line-height: 40rpx;
+        text-align: left;
+        font-style: normal;
+        text-transform: none;
+        margin: 24rpx 0;
+        padding: 0 24rpx;
+
+    }
+
+    .orderInfo {
+        height: 268rpx;
+        background: #FFFFFF;
+        border-radius: 16rpx 16rpx 16rpx 16rpx;
+        padding: 26rpx 24rpx 2rpx 24rpx;
+        margin-bottom: 30rpx;
+
+        .item {
+            display: flex;
+            justify-content: space-between;
+            margin-bottom: 24rpx;
+        }
+
+        .text {
+            font-weight: 400;
+            font-size: 26rpx;
+            color: #666666;
+            text-align: left;
+            font-style: normal;
+            text-transform: none;
+
+        }
+
+        .text1 {
+            font-weight: 500;
+            font-size: 28rpx;
+            color: #2F3437;
+            text-align: left;
+            font-style: normal;
+            text-transform: none;
+
+        }
+
+    }
+
+
+}
+
+.popup-con {
+    font-size: 27rpx;
+    color: #666666;
+    background: #F5F8F8;
+    padding: 15rpx 40rpx 40rpx 40rpx;
+
+    .popup-text {
+        font-weight: bold;
+        font-size: 40rpx;
+        color: #333333;
+        text-align: center;
+        font-style: normal;
+        text-transform: none;
+        display: flex;
+        justify-content: space-between;
+        position: relative;
+
+        text:last-of-type {
+            font-weight: 400;
+            font-size: 28rpx;
+            color: #999999;
+            text-align: center;
+            font-style: normal;
+            text-transform: none;
+            // width: 38rpx;
+            // height: 38rpx;
+            // text-align: center;
+            // line-height: 38rpx;
+            // color: #6D728B;
+            // background: #DEDEDE;
+            // border-radius: 50%;
+            // position: absolute;
+            // right: 24rpx;
+            // font-size: 28rpx;
+        }
+    }
+
+    .refund-items {
+        margin-top: 32rpx;
+        font-size: 26rpx;
+        color: #333333;
+        padding-bottom: 70rpx;
+        background: #FFFFFF;
+        border-radius: 20rpx 20rpx 20rpx 20rpx;
+
+        height: 400rpx;
+        background: #FFFFFF;
+        border-radius: 20rpx 20rpx 20rpx 20rpx;
+
+        .reason {
+            background: #E8FFFD;
+            border-radius: 20rpx 20rpx 0rpx 0rpx;
+            font-weight: bold;
+            font-size: 28rpx;
+            color: #333333;
+            text-align: left;
+            font-style: normal;
+            text-transform: none;
+            padding: 16rpx 20rpx;
+        }
+
+        .radioBox {
+            display: flex;
+            width: 100%;
+            margin-top: 24rpx;
+        }
+
+
+    }
+
+    .popupButtonClass {
+        margin-top: 32rpx;
+        height: 84rpx;
+        border-radius: 98rpx 98rpx 98rpx 98rpx;
+
+        button {
+            align-items: center;
+            border-radius: 98rpx 98rpx 98rpx 98rpx;
+            font-size: 26rpx;
+        }
+    }
+}
+</style>