Explorar el Código

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

# Conflicts:
#	src/api/points.js
#	src/points/order/orderDetails.vue
xyh hace 5 meses
padre
commit
1e51f260b1

+ 18 - 0
src/api/points.js

@@ -53,3 +53,21 @@ export function getPointTaskList(data) {
         data
     });
 }
+
+
+//查询商品详情
+export function productGetById(data) {
+    return request({
+        method: 'get',
+        url: '/product/getById',
+        data
+    });
+}
+//商品下单
+export function productOrderCreate(data) {
+    return request({
+        method: 'post',
+        url: '/product/order/create',
+        data
+    });
+}

+ 7 - 2
src/components/upload/index.vue

@@ -5,10 +5,11 @@
 		:multiple="multiple" :maxCount="maxCount" 
 		@afterRead="afterRead" @delete="onDelete">
 		<slot name="content" :data="fileList"></slot>
+		
      <image
       v-if="customImg"
       src="@/static/discover/ic_upload.png"
-      mode="widthFix"
+      mode=""
       :style="{width: width + 'px', height: height + 'px'}"
     ></image>
 	</u-upload>
@@ -76,10 +77,14 @@ export default {
 			type: Boolean,
 			default: false
 		},
+		fileList: {
+			type: Array,
+			default: []
+		},
 	},
 	data() {
 		return {
-			fileList: [],
+			//fileList: [],
 		};
 	},
 	computed: {

+ 2 - 2
src/points/components/product-list/product-list.vue

@@ -234,8 +234,8 @@ export default {
     },
     // 处理兑换
     handleExchange(product) {
-      uni.redirectTo({
-        url: '/points/productDetails/index'
+      uni.navigateTo({
+        url: '/points/productDetails/index?id=10'
       });
       console.log('兑换商品:', product)
     },

+ 47 - 27
src/points/order/orderDetails.vue

@@ -104,6 +104,26 @@ export default {
       });
       // 这里可以调用售后API
       this.afterSalesShow = false;
+
+      let receivedStatus
+      let tab
+      if (this.receiptStatus == 'notReceived') {
+        receivedStatus = 1
+        tab = 1
+      } else if (this.receiptStatus == "received" && this.afterSalesType == "refund") {
+        receivedStatus = 2
+        tab = 1
+      } else if (this.receiptStatus == "received" && this.afterSalesType == "exchange") {
+        uni.navigateTo({
+          url: '/points/productDetails/applyExchange'
+        });
+        return
+      }
+      //receivedStatus 1 未收到,申请退款;2.已收到货,申请退款 3.已收货-换货申请
+      //tab 1 退款 2 换货
+      uni.navigateTo({
+        url: `/points/productDetails/applyRefund?receivedStatus=${receivedStatus}&tab=${tab}`
+      });
     }
   }
 }
@@ -128,7 +148,7 @@ export default {
         <text class="product-price" v-if="orderInfo.paymentType == 3">¥{{ orderInfo.totalAmount }}+{{ orderInfo.pointsUsed }}积分</text>
       </view>
     </view>
-    
+
     <!-- 订单信息 -->
     <view class="order-info">
       <view class="info-item">
@@ -160,7 +180,7 @@ export default {
         <text class="info-value">{{ orderInfo.addressName || '--'  }}</text>
       </view>
     </view>
-    
+
     <!-- 退货信息 -->
 <!--    <view class="refund-info">-->
 <!--      <view class="info-item">-->
@@ -172,7 +192,7 @@ export default {
 <!--        <text class="info-value">{{ orderInfo.refund.applyTime }}</text>-->
 <!--      </view>-->
 <!--    </view>-->
-    
+
     <!-- 操作按钮 -->
     <view class="action-buttons" :class="{ 'safe-area': hasSafeArea }">
       <button class="detail-button" @click="handleAfterSales">退款\售后</button>
@@ -197,7 +217,7 @@ export default {
           <text class="popup-title">填写物流单号</text>
           <text class="popup-close" @click="showLogistics = false">取消</text>
         </view>
-        
+
         <!-- 输入框 -->
         <view class="popup-content">
           <u--textarea v-model="logisticsNumber"
@@ -207,7 +227,7 @@ export default {
                        class="logistics-input"
           ></u--textarea>
         </view>
-        
+
         <!-- 提交按钮 -->
         <view class="popup-footer">
           <button class="submit-button" @click="submitLogistics">提交</button>
@@ -222,41 +242,41 @@ export default {
           <text class="popup-title">请选择售后商品</text>
           <text class="popup-close" @click="afterSalesShow = false">×</text>
         </view>
-        
+
         <!-- 收货状态选择 -->
         <view class="popup-section">
           <text class="section-title">请选择收货状态</text>
           <view class="option-group">
-            <button 
-              class="option-button" 
+            <button
+              class="option-button"
               :class="{ active: receiptStatus === 'notReceived' }"
               @click="receiptStatus = 'notReceived'"
             >未收到货</button>
-            <button 
-              class="option-button" 
+            <button
+              class="option-button"
               :class="{ active: receiptStatus === 'received' }"
               @click="receiptStatus = 'received'"
             >已收到货</button>
           </view>
         </view>
-        
+
         <!-- 售后类型选择 -->
         <view class="popup-section" v-if="receiptStatus === 'received'">
           <text class="section-title">请选择售后类型</text>
           <view class="option-group">
-            <button 
-              class="option-button" 
+            <button
+              class="option-button"
               :class="{ active: afterSalesType === 'refund' }"
               @click="afterSalesType = 'refund'"
             >退货</button>
-            <button 
-              class="option-button" 
+            <button
+              class="option-button"
               :class="{ active: afterSalesType === 'exchange' }"
               @click="afterSalesType = 'exchange'"
             >换货</button>
           </view>
         </view>
-        
+
         <!-- 商品选择 -->
 <!--        <view class="popup-section">-->
 <!--          <text class="section-title">-->
@@ -273,7 +293,7 @@ export default {
 <!--            </view>-->
 <!--          </view>-->
 <!--        </view>-->
-        
+
         <!-- 下一步按钮 -->
         <view class="popup-footer">
           <button class="next-button" @click="nextStep">下一步</button>
@@ -471,14 +491,14 @@ export default {
       margin: 0 0 0 20rpx;
     }
   }
-  
+
   // 物流单号弹出框样式
   .logistics-popup{
     width: 100%;
     padding: 40rpx;
     background: #F5F8F8;
     border-radius: 32rpx 32rpx 0 0;
-    
+
     .popup-header{
       display: flex;
       justify-content: space-between;
@@ -497,7 +517,7 @@ export default {
         color: #999999;
       }
     }
-    
+
     .popup-content{
       margin-bottom: 32rpx;
       .logistics-input{
@@ -510,7 +530,7 @@ export default {
         border: 1rpx solid #DCDCDC;
       }
     }
-    
+
     .popup-footer{
       .submit-button{
         width: 100%;
@@ -526,13 +546,13 @@ export default {
       }
     }
   }
-  
+
   // 售后弹出框样式
   .after-sales-popup{
     width: 100%;
     background: #F8F8F8;
     border-radius: 32rpx 32rpx 0 0;
-    
+
     .popup-header{
       display: flex;
       justify-content: space-between;
@@ -551,7 +571,7 @@ export default {
         color: #999999;
       }
     }
-    
+
     .popup-section{
       width: 686rpx;
       min-height: 202rpx;
@@ -572,7 +592,7 @@ export default {
           font-weight: normal;
         }
       }
-      
+
       .option-group{
         display: flex;
         justify-content: space-between;
@@ -595,7 +615,7 @@ export default {
           }
         }
       }
-      
+
       .product-item{
         display: flex;
         padding: 20rpx;
@@ -627,7 +647,7 @@ export default {
         }
       }
     }
-    
+
     .popup-footer{
       width: 750rpx;
       height: 124rpx;

+ 93 - 62
src/points/productDetails/applyExchange.vue

@@ -24,24 +24,37 @@
                     </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>
+                    <u--form>
+                        <u-form-item required="true" label="申请原因" label-width="58" prop="selectReasonValue">
+                            <view class="tip">
+                                <view :style="{ color: selectReasonValue ? '#333' : '#999' }">{{
+                                    selectReasonValue !== null ? selectReasonValue : '请选择申请原因' }}</view>
+                                <image style="width: 28rpx;height: 28rpx;margin-left: 8rpx;"
+                                    @click="selectApplyReasonFun('1')" src="@/static/points/Keyboard_arrow_rifht.png"
+                                    mode=""></image>
+                            </view>
+                        </u-form-item>
+
+                        <u-form-item required="true" label="问题描述/凭证" label-width="86" prop="selectReasonValue">
+                            <view class="tip">
+                                <view>{{ questionOrDiscribeValue ? questionOrDiscribeValue : '请您务必上传描述和凭证' }}</view>
+                                <image style="width: 28rpx;height: 28rpx;margin-left: 8rpx;"
+                                    @click="selectApplyReasonFun('2')" src="@/static/points/Keyboard_arrow_rifht.png"
+                                    mode=""></image>
+                            </view>
+                        </u-form-item>
+
+                    </u--form>
+                    <view v-if="fileList.length > 0"
+                        style="display: flex;flex-direction: row;flex-wrap: wrap;gap: 24rpx;">
+                        <view v-for="value in fileList"
+                            style="position: relative;width: calc(25% - 20rpx);margin-top: 20rpx;display: flex;">
+                            <image style="width: 144rpx;height: 144rpx;" :src="value.url" 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>
@@ -52,7 +65,7 @@
                 <u-button :customStyle="{
                     color: '#fff',
                     background: '#03C1B8'
-                }" @click="goHome">提交</u-button>
+                }" @click="goSubmit">提交</u-button>
 
             </view>
 
@@ -70,8 +83,9 @@ export default {
     components: {},
     data() {
         return {
-            
-            selectApplyReason:null,
+            fileList: [],
+            questionOrDiscribeValue: '',
+            selectReasonValue: null,
             title: '申请换货',
             isTop: 0,
             redemptionRulesShowPopup: false,
@@ -105,34 +119,46 @@ export default {
         }
     },
     onLoad(data) {
-        if(data){
+        if (data) {
+            //console.log(data,'66666666')
             //decodeURIComponent (data) 
-            this.selectApplyReason=data.selectReason
-           
+            if (data.questionOrDiscribeValue && data.questionOrDiscribeValue !== "null") {
+                this.questionOrDiscribeValue = data.questionOrDiscribeValue
+            }
+
+            if (data.fileList && data.fileList !== "[]") {
+                this.fileList = JSON.parse(data.fileList)
+                console.log(this.fileList, 'this.fileList')
+            }
+            if (data.selectReasonValue && data.selectReasonValue !== "null") {
+                this.selectReasonValue = data.selectReasonValue
+            }
+
+
+
         }
-        console.log(data, 'data')
     },
-    onShow(selectReason) {
-        console.log(selectReason, 'selectReason')
+    onShow() {
 
     },
     onPageScroll(e) {
         //console.log("滚动距离为:" + e.scrollTop);
         this.isTop = e.scrollTop;
     },
+    onReady() {
+        // 页面加载完成后为表单设置规则
+        this.$refs.uForm.setRules(this.rules);
+    },
 
     methods: {
-        //申请换货
-        applyExchangeFun() {
-            uni.navigateTo({
-                url: '/points/productDetails/applyExchange'
-            });
-        },
-        //申请退款
-        applyRefundFun() {
-            uni.navigateTo({
-                url: '/points/productDetails/applyRefund'
-            });
+        //提交
+        async goSubmit() {
+            if (this.receivedStatus || this.selectReasonValue || this.fileList.length === 0) {
+                uni.$u.toast('请选择申请原因\n或\n请上传描述/凭证')
+               
+            }
+
+
         },
 
         handleContentScroll(e) {
@@ -140,36 +166,14 @@ export default {
         },
         //选择申请原因
         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'
-            });
+                url: `/points/productDetails/applyRefund?receivedStatus=3&tab=${tab}&selectReasonValue=${encodeURIComponent(this.selectReasonValue)}&questionOrDiscribeValue=${encodeURIComponent(this.questionOrDiscribeValue)}&fileList=${JSON.stringify(this.fileList)}`
+            })
+
         },
         //返回上一页
         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}`
-            // });
+            uni.navigateBack();
         },
 
     }
@@ -178,6 +182,13 @@ export default {
 
 <style></style>
 <style lang="scss" scoped>
+::v-deep .u-form-item__body__left__content__required {
+    position: absolute;
+    right: 0;
+    left: auto;
+    /* 去掉 left 定位 */
+}
+
 .centerTitle {
     font-family: PingFang SC, PingFang SC;
     font-weight: 500;
@@ -234,12 +245,32 @@ export default {
         }
     }
 
-    .mustInput {
+    ::v-deep .mustInput {
         background: #FFFFFF;
         border-radius: 16rpx 16rpx 16rpx 16rpx;
         padding: 2rpx 24rpx 26rpx 24rpx;
         margin-top: 24rpx;
 
+        .u-form-item__body__left__content__label {
+            display: flex;
+            flex-direction: row;
+            align-items: center;
+            flex: 1;
+            font-weight: 400;
+            font-size: 26rpx;
+            color: #666666;
+        }
+
+        .u-form-item__body {
+            justify-content: space-between;
+            margin-top: 24rpx;
+            padding: 0;
+        }
+
+        .u-form-item__body__right {
+            flex: none;
+        }
+
         .title {
             font-weight: 400;
             font-size: 26rpx;

+ 49 - 57
src/points/productDetails/applyRefund.vue

@@ -12,7 +12,7 @@
             </u-navbar>
 
             <view class="content">
-                <view v-if="tab=='1'">
+                <view v-if="tab == '1'">
                     <view class="contentDetail">
                         <view class="tip">请选择取消订单的原因(必选):</view>
                         <u-radio-group v-model="selectReason" @change="groupChange">
@@ -38,11 +38,11 @@
                         </view>
                     </view>
                 </view>
-                <view v-if="tab=='2'">
+                <view v-if="tab == '2'">
                     <view class="Box">
                         <view class="questionOrDiscribe">
                             <view>问题与描述:</view>
-                            <u--textarea v-model="questionOrDiscribe" placeholder="请输入问题描述" :maxlength="100"
+                            <u--textarea v-model="questionOrDiscribeValue" placeholder="请输入问题描述" :maxlength="100"
                                 count></u--textarea>
 
                         </view>
@@ -57,30 +57,22 @@
                                         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" :fileList="fileList" />
 
-                                <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>
+                }" @click="goSubmit">{{ receivedStatus == 3 ? '确认' : '提交' }}</u-button>
 
             </view>
 
@@ -95,11 +87,12 @@ export default {
     components: { Upload },
     data() {
         return {
-            tab:null,
+            fileList: [],
+            tab: null,//1 退款/换货申请第一步  2 已收货-换货申请第二步
             headPhotoImg: [],
-            questionOrDiscribe: '',
+            questionOrDiscribeValue: '',
             selectReason: '',
-            selectReasonName: '',
+            selectReasonValue: null,
             receivedStatus: null,//1 未收到,申请退款;2.已收到货,申请退款 3.已收货-换货申请
             isTop: 0,
             list: [],
@@ -166,19 +159,32 @@ export default {
         console.log(data, 'onLoad')
         if (data) {
             this.receivedStatus = data.receivedStatus
-            this.tab=data.tab?data.tab:null
+            this.tab = data.tab ? data.tab : null
+            if (data.questionOrDiscribeValue && data.questionOrDiscribeValue !== "null") {
+                this.questionOrDiscribeValue = data.questionOrDiscribeValue
+            }
+
+            if (data.fileList && data.fileList!=="[]") {
+                this.fileList = JSON.parse(data.fileList)
+                console.log(this.fileList, 'this.fileList')
+            }
+            if (data.selectReasonValue && data.questionOrDiscribeValue !== "null") {
+                this.selectReasonValue = data.selectReasonValue
+                this.filteredList.map(m => {
+                    m.data.forEach(e => {
+                        if (this.selectReasonValue == e.text) {
+                            this.selectReason = e.value
+                        }
+                    })
+
+                })
+            }
         }
-        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')
 
 
@@ -190,9 +196,8 @@ export default {
 
     methods: {
         // upload事件
-        onUpload(e, t) {
-            console.log(e, t)
-            //this.form[t] = e.map(item => item.url);
+        onUpload(e) {
+            this.fileList = e
         },
         handleContentScroll(e) {
             this.isTop = e.detail.scrollTop > 0
@@ -205,41 +210,27 @@ export default {
             this.selectReason = val
             this.filteredList[0].data.forEach(item => {
                 if (item.value == val) {
-                    this.selectReasonName = item.text
+                    this.selectReasonValue = 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'
-            });
+            console.log('提交 applyRefund')
+
+            if (this.receivedStatus == 3) {
+                uni.navigateTo({
+                    url: `/points/productDetails/applyExchange?selectReasonValue=${encodeURIComponent(this.selectReasonValue)}&questionOrDiscribeValue=${encodeURIComponent(this.questionOrDiscribeValue)}&fileList=${JSON.stringify(this.fileList)}`
+                });
+
+            }
+
         },
         //返回上一页
         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}`
-            // });
-        },
 
     }
 }
@@ -332,20 +323,21 @@ export default {
         }
 
         .pictureClass {
-            
+
             .u-upload {
-                .u-upload__wrap{
+                .u-upload__wrap {
                     /* display: inline-block; */
                     flex-direction: row;
                     /* justify-content: space-between; */
                     flex-wrap: wrap;
                     /* flex: 1; */
                     gap: 24rpx;
-                    .u-upload__wrap__preview{
+
+                    .u-upload__wrap__preview {
                         position: relative;
                         width: calc(25% - 20rpx);
                     }
-                    
+
                 }
             }
 

+ 154 - 27
src/points/productDetails/components/selectProduct.vue

@@ -14,53 +14,102 @@
             <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 v-if="selectedObj" style="width: 120rpx;height: 120rpx;"
+                            :src="$globalData.publicUrl + selectedObj.image" mode="">
+                        </image>
+                        <image v-else style="width: 120rpx;height: 120rpx;"
+                            :src="$globalData.publicUrl + params.productMainImage" 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 class="price" v-if="selectedObj">实付价
+                            {{ params.paymentType == 1 ? selectedObj.pricePoint + '积分' :
+                                params.paymentType == 2 ? '¥' + selectedObj.priceMoney + '元' :
+                                    params.paymentType == 3 ? '¥' + selectedObj.priceMoney + '元' + '+' +
+                                        selectedObj.pricePoint + '积分' : null }}
+                        </view>
+                        <view class="price" v-else>实付价
+                            {{ params.paymentType == 1 ? params.pricePoint + '积分' :
+                                params.paymentType == 2 ? '¥' + params.priceMoney + '元' :
+                                    params.paymentType == 3 ? '¥' + params.priceMoney + '元' + '+' +
+                                        params.pricePoint + '积分' : null }}
+                        </view>
+                        <view class="spec" v-if="selectedObj">已选:{{ selectedObj.specValueText }} </view>
                     </view>
 
                 </view>
-                <view class="deletePrice">100</view>
+                <view class="deletePrice" v-if="selectedObj">{{ selectedObj.originPrice }}元</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 v-for="arr in specList">
+                <view class="title">{{ arr[0] }} ({{ Array.from(arr[1]).length }})</view>
+                <view style="display: flex;flex-wrap: wrap;">
+                    <view class="specCombination" @click="selectedSpecFun(value, arr[0])"
+                        :class="selectedObj ? selectedObj.specValueText.indexOf(value) != -1 ? 'active' : '' : ''"
+                        v-for="value in Array.from(arr[1])">
+                        {{ value }}
+                    </view>
                 </view>
             </view>
-
         </view>
         <!--运费 -->
         <view class="yunFeiClass">
             <view class="text">运费</view>
-            <view class="price">¥0</view>
+            <view class="price">¥{{ params.freight }}</view>
 
         </view>
         <!--订单备注 -->
         <view class="nodeClass">
             <view class="text">订单备注</view>
-            <input type="text" maxlength="200" v-model="reasonRefusal" placeholder="选填,请填写您的备注信息,限200字" />
+            <input type="text" maxlength="200" v-model="orderRemarks" placeholder="选填,请填写您的备注信息,限200字" />
 
 
         </view>
+        <!--支付方式 -->
+        <u-radio-group class="nodeClass" v-model="selectPayMeth" @change="groupChange">
+            <view style="width: 100%;">
+                <view style="display: flex;justify-content: space-between;width: 100%;">
+                    <view style="display: flex;">
+                        <image style="width: 40rpx;height: 40rpx;" src="@/static/points/weiXin.png" mode="">
+                        </image>
+                        <view class="text" style="color: #333;margin-left: 16rpx;">微信支付</view>
+                    </view>
+                    <view>
+                        <u-radio activeColor="#03C1B8 " name='1' style="margin: 0;"></u-radio>
+                    </view>
+
+                </view>
+                <view style="display: flex;justify-content: space-between;width: 100%;margin-top: 24rpx;">
+                    <view style="display: flex;">
+                        <image style="width: 40rpx;height: 40rpx;" src="@/static/points/yue.png" mode="">
+                        </image>
+                        <view class="text" style="color: #333;margin-left: 16rpx;">余额支付</view>
+                    </view>
+                    <u-radio activeColor="#03C1B8 " name='2'></u-radio>
+                </view>
+            </view>
+        </u-radio-group>
+
         <view class="footer-bar">
-            <u-button :customStyle="{
+
+            <u-button v-if="!selectedObj" :customStyle="{
                 color: '#fff',
                 background: '#03C1B8'
-            }" @click="redeemNowFun">实付价 ¥10元+1000积分</u-button>
+            }">请选择</u-button>
+            <u-button v-else-if="selectedObj && selectedObj.stock" :customStyle="{
+                color: '#fff',
+                background: '#03C1B8'
+            }" @click="redeemNowFun">实付价 {{ params.paymentType == 1 ? selectedObj.pricePoint + '积分' :
+                params.paymentType == 2 ? '¥' + selectedObj.priceMoney + '元' :
+                    params.paymentType == 3 ? '¥' + selectedObj.priceMoney + '元' + '+' +
+                        selectedObj.pricePoint + '积分' : null }}</u-button>
+            <u-button v-else-if="selectedObj.stock === 0" :customStyle="{
+                color: '#999999 ',
+                background: '#eee'
+            }">库存不足</u-button>
         </view>
     </view>
 
@@ -70,30 +119,105 @@
 
 export default {
     components: {},
+    props: {
+        params: {
+            type: Object,
+            default: {}
+        }
+    },
     data() {
         return {
-            showPopup: false
+            orderRemarks:'',
+            selectPayMeth: '1',
+            reasonRefusal: '',
+            showPopup: false,
+            specValueText: '',
+            specValuePrice: '',
+            specList: [],
+            selectedObj: null
+
 
 
         }
     },
     onLoad(data) {
-
+        console.log('555')
     },
     onShow() {
+        console.log('555')
 
     },
     onPageScroll() {
     },
+    create() {
+        console.log('55522')
+    },
+    computed: {
+        // specValuePrice() {
+        //     return ;
+        // }
+    },
 
     methods: {
+        //
+        onShowFun(selectedObj) {
+            if (selectedObj) {
+                this.selectedObj = JSON.parse(JSON.stringify(selectedObj))
+            } else {
+                this.selectedObj = this.params.specComboVOList[0]
+            }
+            const map = new Map();
+            this.params.specComboVOList.forEach(item => {
+                item.specNameValueList.forEach(spec => {
+                    const key = spec.specName;
+                    if (!map.has(key)) {
+                        map.set(key, new Set());
+                    }
+                    map.get(key).add(spec.specValue);
+                });
+            })
+            this.specList = Array.from(map)
+        },
+        //立即兑换
+        redeemNowFun() {
+             this.$emit('redeemNowFun', this.selectedObj ? JSON.parse(JSON.stringify(this.selectedObj)) : null)
+    
+
+        },
+        //点击选规则
+        selectedSpecFun(specValue, specName) {
+            if (this.selectedObj) {
+                let selectedObj = JSON.parse(JSON.stringify(this.selectedObj))
+                let specValueT
+                selectedObj.specNameValueList.forEach((e, i) => {
+                    if (e.specName == specName) {
+                        specValueT = e.specValue
+                    }
+                })
+                selectedObj.specValues.forEach((r, n) => {
+                    if (r == specValueT) {
+                        selectedObj.specValues.splice(n, 1)
+                    }
+                })
+                this.params.specComboVOList.forEach((item, index) => {
+                    if (item.specValueText.indexOf(specValue) != -1 && item.specValueText.indexOf(selectedObj.specValues.toString()) != -1) {
+                        this.selectedObj = item
+                    }
+
+                })
+            }
+
+            //console.log(this.selectedObj, 'this.selectedObj')
+            //console.log(specValue, specName, 'value,specName')
+
+        },
         //关闭选择商品页
         closeSelectProduct() {
-            this.$emit('closeSelectProduct')
+            this.$emit('closeSelectProduct', this.selectedObj ? JSON.parse(JSON.stringify(this.selectedObj)) : null)
         },
         //去我的地址页面
         addressSelectFun() {
-             uni.navigateTo({
+            uni.navigateTo({
                 url: '/points/productDetails/addressManagement'
             });
         }
@@ -177,11 +301,11 @@ export default {
     .specClass {
         background-color: #fff;
         margin-top: 24rpx;
-        padding: 24rpx;
-        height: 396rpx;
+        padding: 0 24rpx 24rpx 24rpx;
         border-radius: 20rpx 20rpx 20rpx 20rpx;
 
         .title {
+            padding-top: 24rpx;
             font-weight: bold;
             font-size: 28rpx;
             color: #333333;
@@ -235,16 +359,19 @@ export default {
         }
     }
 
-    .nodeClass {
+    ::v-deep .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;
 
+        .u-radio__icon-wrap {
+            margin: 0;
+        }
+
         .text {
             width: 115rpx;
             font-weight: 500;

+ 148 - 37
src/points/productDetails/index.vue

@@ -9,38 +9,59 @@
       </u-navbar>
       <!-- 主图 -->
       <view class="mainImame">
-
+        <ImageItem :src="$globalData.publicUrl + params.productMainImage" />
       </view>
       <view class="content">
         <!-- 第一行text -->
         <view class="firstRow">
-          <text class="priceClass">10元+1000积分</text>
-          <text class="deletePriceClass">100元</text>
-          <view class="productName"> 广誉源会员定制玻璃杯广誉源会员定制玻璃杯</view>
-          <view class="discribeClass">双层曲线杯身在隔热防烫</view>
+          <text v-if="selectedObj" class="priceClass">
+            {{ params.paymentType == 1 ? selectedObj.pricePoint + '积分' :
+              params.paymentType == 2 ? selectedObj.priceMoney + '元' :
+                params.paymentType == 3 ? selectedObj.priceMoney + '元' + '+' +
+                  selectedObj.pricePoint + '积分' : null }}
+          </text>
+          <text v-else class="priceClass">
+            {{ params.paymentType == 1 ? params.pricePoint + '积分' :
+              params.paymentType == 2 ? params.priceMoney + '元' :
+                params.paymentType == 3 ? params.priceMoney + '元' + '+' +
+                  params.pricePoint + '积分' : null }}
+          </text>
+          <text class="deletePriceClass">{{ selectedObj ? selectedObj.originPrice : params.specComboVOList ?
+            params.specComboVOList[0].originPrice : null }}元</text>
+          <view class="productName"> {{ params.name }}</view>
+          <view class="discribeClass">{{ params.summary }}</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: 26rpx;margin-right: 4rpx;"
-              src="/static/points/Group6.png" />假一赔三
-            <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: 26rpx;margin-right: 4rpx;"
-              src="/static/points/return7.png" /> 破损包退换
+            <view v-for="item in servicePromiseArr">
+              <view style="display: flex;align-items: center;" v-if="item.isShow">
+                <ImageItem style="width: 24rpx;height: 24rpx;margin-right: 4rpx;" :src="item.icon" />
+                <view style="margin-right: 24rpx;">{{ item.name }}</view>
+              </view>
+            </view>
           </view>
 
         </view>
         <!-- 第二行text -->
         <view class="seconedRow">
           <view class="specClass">
-            <view style="display: flex;align-items: center;">
-              <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;margin-right: 8rpx;">已选:白色,大号</text>
+            <view v-if="!selectedObj"
+              style="display: flex;align-items: center;justify-content:space-between;width: 100%;">
+              <view style="color: #666666;">选择</view>
               <image style="width: 28rpx;height: 28rpx;" @click="selectProductShowFun"
+                src="@/static/points/Keyboard_arrow_rifht.png" mode=""></image>
+            </view>
+            <view v-if="selectedObj"
+              style="display: flex;align-items: center;justify-content: space-between;width: 100%;">
+              <view style="display: flex;align-items: center;">
+                <text style="color: #666666;">规格</text>
+                <ImageItem class="imgClass" :src="$globalData.publicUrl + selectedObj.image" />
+              </view>
+              <view style="display: flex;align-items: center;">
+                <text style="color: #666666;margin-right: 8rpx;">已选:{{ selectedObj.specValueText }}</text>
+                <image style="width: 28rpx;height: 28rpx;" @click="selectProductShowFun"
                   src="@/static/points/Keyboard_arrow_rifht.png" mode=""></image>
+              </view>
             </view>
+
           </view>
           <view class="arriveAddressClass">
             <text style="color: #666666;margin-right: 24rpx;">送至</text>
@@ -52,16 +73,20 @@
           </view>
           <view class="seedAddressClass">
             <text style="color: #666666;margin-right: 24rpx;">发货</text>
-            <text>山西省太原市小店区 | 免运费</text>
+            <text>山西省太原市小店区 | {{ params.freight == 0 ? '免运费' : '运费' + params.freight + '元' }}</text>
           </view>
           <view class="promiseSeedTime" style="margin-left: 80rpx;">
-            下单后48小时内发货
+            下单后{{ params.deliveryTime }}小时内发货
           </view>
 
         </view>
         <!-- 第三行商品详情 -->
         <view class="produceDateil">
           <view style="font-weight: 800;font-size: 32rpx;color: #333333;">商品详情</view>
+          <view v-for="img in params.productImage" style="margin-top: 20rpx;">
+            <image style="width: 100%;" :src="$globalData.publicUrl + img" mode="aspectFill"></image>
+          </view>
+
         </view>
         <!-- 兑换须知 -->
         <view class="niticeClass">
@@ -96,23 +121,22 @@
       </view>
 
       <view class="footer-bar">
-        <u-button :customStyle="{
+        <u-button v-if="selectedObj ? selectedObj.stock : params.stock" :customStyle="{
           color: '#fff',
           background: '#03C1B8'
         }" @click="redeemNowFun">立即兑换</u-button>
-      </view>
-      <!-- <view class="footer-bar">
-        <u-button :customStyle="{
+        <u-button v-else :customStyle="{
           color: '#999999 ',
           background: '#eee'
         }">库存不足</u-button>
-      </view> -->
+      </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>
+        <SelectProduct :params="params" ref="selectProductRef" @redeemNowFun="redeemNowFun"
+          @closeSelectProduct="closeSelectProduct"></SelectProduct>
       </u-popup>
 
     </scroll-view>
@@ -127,6 +151,7 @@
 import ImageItem from "@/components/swiper/components/image.vue";
 import RedemptionRules from "./components/redemptionRules.vue";
 import SelectProduct from "./components/selectProduct.vue";
+import { productGetById, productOrderCreate } from '@/api/points'
 
 export default {
   components: { ImageItem, RedemptionRules, SelectProduct },
@@ -135,11 +160,22 @@ export default {
       isTop: 0,
       redemptionRulesShowPopup: false,
       selectProductShowPopup: false,
+      params: {},
+      servicePromiseArr: [
+        { name: '放心购', icon: '/static/points/Group4.png', isShow: false },
+        { name: '假一赔三', icon: '/static/points/Group6.png', isShow: false },
+        { name: '7天无理由退换', icon: '/static/points/Group2.png', isShow: false },
+        { name: '破损包退换', icon: '/static/points/return7.png', isShow: false },
+      ],
+      selectedObj: null
 
 
     }
   },
-  onLoad(data) {
+  onLoad(id) {
+    if (id) {
+      this.productGetByIdFun(id)
+    }
 
   },
   onShow() {
@@ -154,22 +190,100 @@ export default {
     handleContentScroll(e) {
       this.isTop = e.detail.scrollTop > 0
     },
+    //查询商品详情
+    productGetByIdFun(id) {
+      productGetById({ id: 19 }).then(res => {
+        if (res.data.code === 200) {
+          this.params = Object.assign({}, res.data.data)
+          //this.selectedObj = this.params.specComboVOList[0]
+          this.servicePromiseArr.forEach(element => {
+            this.params.servicePromise.map(m => {
+              if (m == element.name) {
+                element.isShow = true
+              }
+            })
+
+          });
+
+        }
+
+      })
+
+    },
     //兑换须知页面
     clichFun() {
       this.redemptionRulesShowPopup = true
     },
     //立即兑换
-    redeemNowFun() {
-      uni.navigateTo({
-        url: '/points/productDetails/paymentSuccessful'
-      });
+    redeemNowFun(selectedObj) {
+      if (selectedObj) this.selectedObj = selectedObj
+      if (this.selectedObj) {
+        let params = {}
+        ////用户openId
+        params.openId = uni.getStorageSync('wx_copenid');
+        //地址ID
+        params.addressId = '11';
+        params.productId = this.params.id;
+        params.name = this.params.name;
+        params.productMainImage = this.params.productMainImage;
+        //选中的SKU ID
+        params.skuId = this.selectedObj.index;
+        // SKU列表(规格组合明细)
+        params.specNameValueLis = this.selectedObj.specNameValueList;
+        ////购买数量
+        params.quantity = 1;
+        ////支付方式:1微信支付 2账户余额
+        params.payType = Number(this.$refs.selectProductRef.selectPayMeth);
+        //运费
+        params.freightAmount = this.params.freight;
+        // 总金额
+        params.totalAmount = this.selectedObj.originPrice;
+        // 支付金额
+        params.payAmount = this.selectedObj.priceMoney;
+        // 使用的积分
+        params.pointsUsed = this.selectedObj.pricePoint;
+        //买家备注信息
+        params.buyerRemark = this.$refs.selectProductRef.orderRemarks;
+        uni.navigateTo({
+          url: '/points/productDetails/paymentSuccessful'
+        });
+        console.log(params, 'params')
+        return
+        
+        
+        productOrderCreate(params).then(res => {
+          
+          uni.requestPayment({
+            "provider": "wxpay",
+            "orderInfo": {},
+            success(res) { },
+            fail(e) { }
+          })
+          // uni.navigateTo({
+          //   url: '/points/productDetails/paymentSuccessful'
+          // });
+        })
+
+      } else {
+        this.selectProductShowPopup = true
+        this.$nextTick(() => {
+          this.$refs.selectProductRef.onShowFun(this.selectedObj)
+        });
+      }
+
     },
     //打开选择商品页
     selectProductShowFun() {
       this.selectProductShowPopup = true
+      this.$nextTick(() => {
+        this.$refs.selectProductRef.onShowFun(this.selectedObj)
+      });
     },
-
-    closeSelectProduct() {
+    //关闭选择商品页
+    closeSelectProduct(selectedObj) {
+      if (selectedObj) {
+        this.selectedObj = selectedObj
+      }
       this.selectProductShowPopup = false
     },
     //去我的地址页面
@@ -198,7 +312,6 @@ export default {
 <style lang="scss" scoped>
 .mainImame {
   height: 456rpx;
-  border: 1px solid red
 }
 
 .footer-bar {
@@ -223,7 +336,6 @@ export default {
 
   .firstRow {
     background-color: #fff;
-    height: 288rpx;
     border-radius: 20rpx 20rpx 20rpx 20rpx;
     padding: 26rpx 24rpx 24rpx 24rpx;
 
@@ -254,7 +366,6 @@ export default {
     .productName {
       margin-top: 22rpx;
       width: 638rpx;
-      height: 88rpx;
       font-weight: bold;
       font-size: 36rpx;
       color: #333333;
@@ -295,7 +406,6 @@ export default {
   }
 
   .seconedRow {
-    height: 284rpx;
     background: #FFFFFF;
     border-radius: 20rpx 20rpx 20rpx 20rpx;
     margin-top: 24rpx;
@@ -313,6 +423,7 @@ export default {
       align-items: center;
       justify-content: space-between;
       position: relative;
+
       .imgClass {
         width: 64rpx;
         height: 64rpx;

+ 2 - 26
src/points/productDetails/paymentSuccessful.vue

@@ -52,15 +52,6 @@
                     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>
@@ -120,24 +111,9 @@ export default {
     },
 
     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() {
@@ -145,10 +121,10 @@ export default {
                 url: '/pages/index/index'
             });
         },
-        //查看订单
+        //查看订单 //url: '/points/productDetails/pendingPayment'
         checkOrder() {
             uni.navigateTo({
-                url: '/points/productDetails/pendingPayment'
+                url: '/points/order/orderList'
             });
         },
         //返回上一页

BIN
src/static/points/weiXin.png


BIN
src/static/points/yue.png