填写地址优化

zhiyangdu
1 parent 3f832e9b
Showing 4 changed files with 106 additions and 22 deletions
src/components/addressToast/addressToast.vue
src/pages/goodDetails/goodDetails.less
src/pages/goodDetails/goodDetails.vue
src/pages/pointsMall/pointsMall.less
@@ -52,6 +52,7 @@ export default {
       itemInfo: null,
       addressInfo: null,
       goodsId: null, // 兑换商品ID
+      orderId: null, // 订单ID 先兑换后填地址使用
       // drawRecordItemInfo: null // 中奖记录单条信息
     };
   },
@@ -85,9 +86,13 @@ export default {
   },
   methods: {
     // 父组件点击兑换调用子组件传值商品商品信息
-    getItemInfo (content) {
+    getItemInfo (content, orderId) {
       this.itemInfo = content;
-      this.goodsId = content.id; // 获取需要兑换商品的ID
+      if (orderId) {
+        this.orderId = orderId
+      } else {
+        this.goodsId = content.id; // 获取需要兑换商品的ID
+      }
       // 获取商品信息接口
       this.luckDrawGift(content.id);
       // 获取首选地址接口
@@ -251,15 +256,30 @@ export default {
      * 确定
      */
     confirm () {
-      let orderInfo = {
-        addressId: this.$route.query.addressId || this.addressInfo.id,
-        id: this.$route.query.goodsId || this.goodsId, // 兑换商品ID
-      };
+      // 兑换商品的ID分两种一种是订单ID填写地址；一种是有商品地址填写地址
+      let orderInfo;
+      if (this.$route.query.orderId || this.orderId) {
+        orderInfo = {
+          addressId: this.$route.query.addressId || this.addressInfo.id,
+          id: this.$route.query.orderId || this.orderId, // 兑换商品ID
+        };
+      } else if (this.$route.query.goodsId || this.goodsId) {
+        orderInfo = {
+          addressId: this.$route.query.addressId || this.addressInfo.id,
+          id: this.$route.query.goodsId || this.goodsId, // 兑换商品ID
+        };
+      }
       // 隐藏弹框
       this.$parent.pointsToast_control = false;
       // 安卓手机下特殊处理
       if (this.isAndroid.value) {
-        orderInfo.id = this.getParameterByName("goodsId") || this.goodsId
+        // 兑换商品的ID分两种一种是订单ID填写地址；一种是有商品地址填写地址
+        if (this.getParameterByName("orderId") || this.orderId) {
+          orderInfo.id = this.getParameterByName("orderId") || this.orderId
+        } else if (this.getParameterByName("goodsId") || this.goodsId) {
+          orderInfo.id = this.getParameterByName("goodsId") || this.goodsId
+        }
+
         orderInfo.addressId = window.localStorage.getItem("addressId") || this.addressInfo.id
         orderInfo.pointsToast_control = this.getParameterByName("pointsToast_control")
         // 安卓下清除locaStroe的ext数据
@@ -268,7 +288,7 @@ export default {
         window.location.href =
           window.location.href.split("?")[0] +
           "?uid=" +
-          this.getStore("uid")
+          this.getStore("uid") + "&goodsId=" + this.$route.query.goodsId || this.goodsId
       }
       // 最新地址信息回传给父组件
       this.$parent.addressInfo = this.addressInfo;
@@ -276,7 +296,7 @@ export default {
     },
     //       更改地址
     changeAddress () {
-      // 安卓手机两次更改地址goodsId没拿到从咯擦S
+      // 安卓手机两次更改地址goodsId没拿到从
       if (this.isAndroid.value && !this.goodsId) {
         let ext = "&" + window.localStorage.getItem("ext")
         this.goodsId = this.getParameterByName(
@@ -295,6 +315,8 @@ export default {
         encodeURIComponent(
           "goodsId=" +
           this.goodsId +
+          "orderId=" +
+          this.orderId +
           "&pointsToast_control=" +
           this.$parent.pointsToast_control
         ) +
 .good-details-box{
   padding-bottom: 130px;
+  .pl {
+    background-color: transparent;
+    width: 100%;
+    &.is-open-app {
+        height: 122px;
+    }
+    &.is-cnlive {
+        height: 93px;
+    }
+  }   
+  .hide{
+    display:none;
+  }
+  .call-app-box{
+    position: fixed;
+  }
+  .back-box{
+    background-color: #FFF;
+    position:fixed;
+    position: fixed;
+  }
   .goods-img{
     display: block;
     width: 100%;
@@ -10,13 +10,16 @@
         >
         </call-app-box>
         <back-box
-            v-if="$parent.isBack && isCNLive.value"
+            v-if="isCNLive.value"
+            :class="{'hide': $route.query.hideBack == true}"
             class="back-box"
             :style="'padding-top: ' + $parent.top.value + 'px'"
             @back="back"
             :backs="backs"
         >
         </back-box>
+                <!-- pl -->
+        <div class="pl" :class="{'is-cnlive': isCNLive.value, 'is-open-app': $parent.isOpenApp.value, 'hide': $route.query.hideBack == true}"></div>
         <!--轮播-->
         <!-- <swiper
           :style="
@@ -165,7 +168,7 @@ export default {
         title: "",
         message: "确定使用" + this.goodsInfo.num + "积分兑换?",
         confirmButtonText: "确定",
-        confirmButtonCallback: this.callAppModalCallback,
+        confirmButtonCallback: this.addIntegralOrderconfirm,
         showCancelButton: true,
         cancelButtonText: "取消"
       };
@@ -175,7 +178,7 @@ export default {
       this.$parent.$refs.showModal.showLayer();
     },
     // 确定兑换回调
-    callAppModalCallback () {
+    addIntegralOrderconfirm () {
       // isExchange为false才可兑换防止连续点击
       if (!this.isExchange) {
         // 兑换
@@ -183,6 +186,15 @@ export default {
       }
     },
     /**
+     * 分享
+     */
+    toShare () {
+      // 判断分享
+      if (typeof this.$parent.toShare === 'function') {
+        this.$parent.toShare(38, this.$route.query.id || 0);
+      }
+    },
+    /**
    * 积分商品详情页页面接口
    */
     addIntegralOrder () {
@@ -217,14 +229,15 @@ export default {
         // 两秒后可继续兑换
         let _this = this
         setTimeout(function () {
-          this.isExchange = false;
+          _this.isExchange = false;
         }, 1500);
         // 显示查看地址弹框
         let options = {
           message: "兑换成功",
           messageAlign: "center",
           confirmButtonText: "我知道了",
-          // confirmButtonCallback: (datas.shop_type == 1) ? this.addAddressCallback(datas.shop_type) : ""
+          confirmButtonCallback: this.addAddressCallback,
+          params: { shopType: datas.shop_type, id: datas.id }
         };
         this.$set(this.$parent, "showOptions", options);
         // 显示通用浮层
@@ -233,20 +246,15 @@ export default {
         // 获取积分商品详情页失败
         Toast(res.message);
-      } else {
-
-        // 获取积分商品详情页失败
-        Toast("获取积分商品详情页失败");
       }
     },
     // 填写地址
-    addAddressCallback (shopType) {
-      debugger
+    addAddressCallback (params) {
       // 如果是实物弹起填写地址弹窗
-      if (shopType == 1) {
+      if (params.shopType == 1) {
         this.pointsToast_control = true;
         // 礼品兑换弹框派发
-        this.$refs.itemsInfo.getItemInfo(this.goodsInfo)
+        this.$refs.itemsInfo.getItemInfo(this.goodsInfo, params.id)
       }
     },
     /**
@@ -333,6 +341,27 @@ export default {
   },
   mounted () {
+    // 如果是App外，设置唤起App和微信内分享参数
+    if (!this.isCNLive.value) {
+
+      // 唤起详情页
+      if (typeof this.$parent.getOpenApp === "function") {
+        this.$parent.getOpenApp({
+          type: 38,
+          id: this.$route.query.id || 1,
+          url: ""
+        });
+      }
+
+      // 分享详情页
+      if (typeof this.$parent.getShareData === "function") {
+        this.$parent.getShareData({
+          type: 38,
+          id: this.$route.query.id || 1,
+          url: ""
+        });
+      }
+    }
   }
 }
 </script>
@@ -10,6 +10,18 @@
         height: 93px;
     }
 }
+.hide{
+  display:none;
+}
+.call-app-box{
+  position: fixed;
+  z-index: 2;
+}
+.back-box{
+  background-color: #FFF;
+  position:fixed;
+  position: fixed;
+}
 .main_box{
   width: 100%;
   // min-height: 1840px;