jufubao-third 1.0.10 → 1.0.11-beta2

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "jufubao-third",
-  "version": "1.0.10",
+  "version": "1.0.11-beta2",
   "private": false,
   "description": "聚福宝业务组件第三方购物平台包",
   "main": "index.js",

package/src/components/JfbThirdPay/Api.js

@@ -149,5 +149,16 @@ module.exports = [
     },
     isConsole: true,
     disabled: true
+  },
+  {
+    mapFnName: "getVipList",
+    title: "会员中心 - 会员卡列表",
+    path: "/member/v1/vip-card",
+    isRule: false,
+    params: {
+      is_show_exchange_code: ['是否展示 兑换码 ', 'Y/N，默认N', false],
+    },
+    isConsole: true,
+    disabled: true
   }
 ];

package/src/components/JfbThirdPay/JfbThirdPay.vue

@@ -15,88 +15,129 @@
       </view>
     </view>
     <!-- #endif -->
-    <view class="jfb-third-pay__body">
+    <view class="jfb-third-pay__body" :style="[bodyWrapStyle]">
       <view class="column-group">
-        <view style="padding: 20rpx 0 0;">
-          <view class="column-item noBorder">
-            <view v-if="product_total_price" class="column_label text_gray">商品总额</view>
-            <view class="column_value text-gray">
-              <xd-unit :price="product_total_price" :isOld="false" :font-size="24" :icon-size="0.3"></xd-unit>
+        <view class="pay_section">
+          <view style="padding: 20rpx 0 0;">
+            <view class="column-item noBorder">
+              <view v-if="product_total_price" class="column_label text_gray">商品总额</view>
+              <view class="column_value text-gray">
+                <xd-unit 
+                  :isShowIcon="isShowIcon"
+                  :colorNew="isShowIcon ? '': '#999'"
+                  :price="product_total_price"
+                  :isOld="false"
+                  :font-size="24"
+                  :icon-size="0.3"
+                ></xd-unit>
+              </view>
             </view>
-          </view>
-          <view v-if="servicePrice" class="column-item noBorder">
-            <view class="column_label text_gray">平台服务费总额</view>
-            <view class="column_value text-gray">
-              <xd-unit :price="servicePrice" :isOld="false" :font-size="24" :icon-size="0.3"></xd-unit>
+            <view v-if="servicePrice" class="column-item noBorder">
+              <view class="column_label text_gray">平台服务费总额</view>
+              <view class="column_value text-gray">
+                <xd-unit
+                  :isShowIcon="isShowIcon"
+                  :colorNew="isShowIcon ? '': '#999'"
+                  :price="servicePrice" :isOld="false" :font-size="24" :icon-size="0.3"></xd-unit>
+              </view>
+            </view>
+            <view v-if="logisticsPrice" class="column-item noBorder">
+              <view class="column_label text_gray">运费</view>
+              <view class="column_value text-gray">
+                <xd-unit
+                  :isShowIcon="isShowIcon"
+                  :colorNew="isShowIcon ? '': '#999'"
+                  :price="logisticsPrice" :isOld="false" :font-size="24" :icon-size="0.3"></xd-unit>
+              </view>
             </view>
           </view>
-          <view v-if="logisticsPrice" class="column-item noBorder">
-            <view class="column_label text_gray">运费</view>
+          <view class="column-item">
+            <view class="column_label text_gray">
+              订单总额
+            </view>
             <view class="column_value text-gray">
-              <xd-unit :price="logisticsPrice" :isOld="false" :font-size="24" :icon-size="0.3"></xd-unit>
+              <xd-unit
+                :isShowIcon="isShowIcon"
+                :colorNew="isShowIcon ? '': '#999'"
+                :price="origin_total_price"
+                :isOld="false"
+                :font-size="24"
+                :icon-size="0.3"
+              ></xd-unit>
             </view>
           </view>
         </view>
-        <view class="column-item">
-          <view class="column_label">
-            订单总额
-          </view>
-          <view class="column_value text-gray">
-            <xd-unit
-              :price="total_price"
-              :isOld="false"
-              :font-size="24"
-              :icon-size="0.3"
-            ></xd-unit>
-          </view>
+        
+        <view v-if="show_vip_card==='Y'" class="pay_section">
+          <cus-vip-list :list="vipCardList"
+            :vip_card_id="vip_card_id"
+            :plus_saving_money="plus_saving_money"
+            @choseVipCard="handleChoseVipCard"></cus-vip-list>
         </view>
-        <view class="column-item">
-          <view class="column_label">
-            仍需支付
-            <view class="label_sub">（可使用多张票券支付）</view>
-          </view>
-          <view class="column_value text-primary">
-            <xd-unit
-              :price="showOldPay ? needPayPrice :orderNeedPayPrice"
-              :isOld="false"
-              :font-size="24"
-              :icon-size="0.3"
-            ></xd-unit>
-          </view>
+        <view v-if="isShowPlusSaveMoney" class="pay_section">
+          <xd-list-item label="PLUS专项立减" size="small" paddingLR="40rpx" >
+            <view slot="label" style="color: #86541E;">PLUS专享立减</view>
+            <!-- <view style="color: #FF7070;">-5.00</view> -->
+            <xd-unit :isShowIcon="isShowIcon" :price="-plus_saving_money" :largeZero="false" :isOld="false" :fontSize="24" :iconSize="0.3"></xd-unit>
+          </xd-list-item>
         </view>
-        <view v-if="showOldPay" class="column-item">
-          <view class="column_label">
-            我的票券
-            <view class="label_sub">（已使用{{checkedCards.length}}张票券）</view>
+
+        <view v-if="!isPlusSite" class="pay_section">
+          <view class="column-item">
+            <view class="column_label">
+              仍需支付
+              <view class="label_sub">（可使用多张票券支付）</view>
+            </view>
+            <view class="column_value text-primary">
+              <xd-unit
+                :isShowIcon="isShowIcon"
+                :price="showOldPay ? needPayPrice :orderNeedPayPrice"
+                :isOld="false"
+                :font-size="24"
+                :icon-size="0.3"
+              ></xd-unit>
+            </view>
           </view>
-          <view class="column_value">
-            <xd-button
-              width="220rpx"
-              radius="60rpx"
-              type="primary"
-              size="small"
-              @click="xdDownDrawer=true; switchValidToken()"
-            >使用新票券</xd-button>
+          <view v-if="showOldPay" class="column-item">
+            <view class="column_label">
+              我的票券
+              <view class="label_sub">（已使用{{checkedCards.length}}张票券）</view>
+            </view>
+            <view class="column_value">
+              <xd-button
+                width="220rpx"
+                radius="60rpx"
+                type="primary"
+                size="small"
+                @click="xdDownDrawer=true; switchValidToken()"
+              >使用新票券</xd-button>
+            </view>
           </view>
         </view>
       </view>
-      <template v-if="!showOldPay">
+      <!-- <view class="pay_section">
+        <xd-list-item label="账户余额" size="small" paddingLR="40rpx" showRight>
+          <view style="color: #999999;">30.00</view>
+        </xd-list-item>
+      </view> -->
+      <view class="pay_section" v-if="!showOldPay">
         <template v-for="item in otherPayMethod">
-          <xd-list-item v-if="item.method === 'card'" :key="item.method" :label="item.show_name" paddingLR="60rpx" size="small" showRight @click="toChoseCard">
+          <xd-list-item v-if="item.method === 'card'" :key="item.method" :label="item.show_name" paddingLR="40rpx" size="small" showRight @click="toChoseCard">
             <view v-if="choseCard && choseCard.cardPayPrice" slot="label">{{item.show_name}} <text style="color:red;margin-left: 4px;">(已选{{ choseCard.selectedCardList.length }}张)</text></view>
             <xd-unit v-if="choseCard && choseCard.cardPayPrice" :price="choseCard.cardPayPrice" :isOld="false" :fontSize="24" :iconSize="0.3"></xd-unit>
             <view v-else>请选择</view>
           </xd-list-item>
-          <xd-list-item v-if="item.method === 'wallet'" :key="item.method" :label="item.show_name" paddingLR="60rpx" size="small" showRight @click="toChoseWallet">
+          <xd-list-item v-if="item.method === 'wallet'" :key="item.method" :label="item.show_name" paddingLR="40rpx" size="small" showRight @click="toChoseWallet">
             <xd-unit v-if="choseWallet && choseWallet.walletPayPrice" :price='choseWallet.walletPayPrice' :isOld="false" :fontSize="24" :iconSize="0.3"></xd-unit>
             <view v-else>请选择</view>
           </xd-list-item>
         </template>
-      </template>
+      </view>
 
       <view
         class="ticket_list"
         :key="renderChecked"
+        v-if="!isPlusSite"
       >
         <view
           class="ticket_item"
@@ -148,7 +189,21 @@
           </view>
         </view>
       </view>
+      <view v-if="isPlusSite" class="bottom_btn plus_btm" :style="{bottom: layoutInfo.bottom+'rpx'}">
+        <view class="flex_l">实付：
+          <xd-unit
+            :isShowIcon="isShowIcon"
+            :price="showOldPay ? needPayPrice :orderNeedPayPrice"
+            :isOld="false"
+            :font-size="40"
+            :icon-size="0.3"
+          ></xd-unit></view>
+          <view>
+            <xd-button type="primary" @click="doAllPay">支付</xd-button>
+          </view>
+      </view>
       <view
+        v-else
         class="bottom_btn"
         :style="{bottom: layoutInfo.bottom+'rpx'}"
       >
@@ -283,6 +338,7 @@
   import XdListItem from "./XdListItem.vue"
   import XdCardPayChose from "@/components/XdCardPayChose/XdCardPayChose"
   import XdWalletChose from "@/components/XdWalletChose/XdWalletChose"
+  import CusVipList from "@/components/CusVipList/CusVipList"
   import {mapState} from "vuex"
   import { getContainerPropsValue } from "@/utils/xd.base";
   export default {
@@ -299,14 +355,15 @@
       XdUnit,
       XdListItem,
       XdCardPayChose,
-      XdWalletChose
+      XdWalletChose,
+      CusVipList
     },
     mixins: [
       componentsMixins, extsMixins, JfbThirdPayMixin, WalletMixins
     ],
     data() {
       return {
-
+        isVip: false,
         xdDownDrawer: false,
         payChannels: [],
         channel_provider_id: "",
@@ -322,6 +379,7 @@
 
         product_total_price: "",
         total_price: "",
+        origin_total_price: "",
         servicePrice: "",
         logisticsPrice: "",
 
@@ -335,6 +393,11 @@
         selectedCardList: [], //卡绑定使用的
         options: {},
 
+        show_vip_card: "",
+        vipCardList: [],
+        vip_card_id: 0,
+        plus_saving_money: 0,
+
         //面板
         orderSuccessPath: "",
         thirdPayPath: "",
@@ -350,8 +413,27 @@
     },
     computed: {
       ...mapState({
-        brandInfo: state => state.brandInfo
+        brandInfo: state => state.brandInfo,
+        siteInfo: state => state.siteInfo,
       }),
+      bodyWrapStyle(){
+        return {
+          background: 'rgb(249, 249, 249)',
+          minHeight: this.layoutInfo.bodyMinHeightRpx + 'rpx'
+        }
+      },
+      isShowIcon() {
+        if(this.$configProject['isPreview']) return true;
+        return this.siteInfo.mapping.is_show_coin_icon==='Y'
+      },
+      isPlusSite(){
+        return this.projectAttr.headers['X-Site-Group']==="vip";
+      },
+      //是否展示vip减免
+      isShowPlusSaveMoney(){
+        if(this.show_vip_card === 'Y') return this.vip_card_id;
+        else return this.isVip && this.plus_saving_money;
+      },
       showCardList(){
         //筛选出不存在于cardList的数据
         let otherCardList = this.selectedCardList.filter(item =>{
@@ -381,6 +463,7 @@
       this.init(this.container);
       let valid_token = this.$xdUniHelper.randomChar(20);
       this.$set(this.cardForm, "valid_token", valid_token);
+      this.isVip = this.getTokenForKey('user_level') === 'VIP';
 
       // #ifdef H5
       if (!this.$configProject.isPreview) {
@@ -399,6 +482,7 @@
         this.validImageAPIUrl = this.brandInfo['api_host'] + '/common/v1/valid_code/image/show'
 
         this.getOrderConfirm();
+        
       },
       /**
        * @description 监听事件变化
@@ -419,12 +503,27 @@
         }
         return time;
       },
+      handleChoseVipCard(vip_card_id){
+        this.vip_card_id = vip_card_id;
+        this.getOrderConfirm();
+      },
+      p_getVipList(xnamespace){
+        jfbRootExec("getVipList", {
+          vm: this,
+          data: {
+            namespace: xnamespace,
+          }
+        }).then(res => {
+          this.vipCardList = res.list;
+        })
+      },
       getOrderConfirm(){
         jfbRootExec("getThirdOrderInfo", {
           vm: this,
           data: {
             main_order_id: this.main_order_id,
             namespace: this.xnamespace,
+            vip_card_id: this.vip_card_id,
             ...this.options,
           }
         }).then(res => {
@@ -444,12 +543,17 @@
             return;
           }
           this.p_getPayMethod(res.pay_methods);
-
-          this.total_price = this.$xdUniHelper.multiplyFloatNumber(res.total_price, 1);
+          this.origin_total_price = res.total_price;
+          this.total_price = this.$xdUniHelper.multiplyFloatNumber(res.real_pay_price, 1);
           this.needPayPrice = this.total_price;
           this.servicePrice = this.$xdUniHelper.multiplyFloatNumber(res.service_fee, 1);
           this.logisticsPrice = this.$xdUniHelper.multiplyFloatNumber(res.logistics_amount, 1);
           this.product_total_price = this.$xdUniHelper.multiplyFloatNumber(res.product_total_price, 1);
+          this.plus_saving_money = this.$xdUniHelper.multiplyFloatNumber(res.discount_price, 1);
+          this.show_vip_card = res.show_vip_card;
+          if(res.show_vip_card === 'Y' && !this.vipCardList.length){
+            this.p_getVipList(res.business_code);
+          }
         })
       },
       p_getH5WxAuthorize(){
@@ -502,7 +606,9 @@
         if(!submitCardList.length){
           //支持补差, 提示是否使用补差
           if(this.payThird){
-            await this.handleConfirmAllWxPay();
+            if(!this.isPlusSite){
+              await this.handleConfirmAllWxPay();
+            }
           }else{
             //不支持补差，仅提示
             return this.$xdAlert({content: "请选择兑换方式"})
@@ -514,6 +620,7 @@
           other_channel_pay_price: needPayPrice,
           need_pay_price: needPayPrice,
           namespace: this.xnamespace,
+          vip_card_id: this.vip_card_id,
           ...this.options,
         }, res => {
           this.$xdLog.setARMSInfo({
@@ -808,23 +915,32 @@
 
   .jfb-third-pay {
     &__body{
-      padding-bottom: 150rpx;
-      background: #FFFFFF;
+      // padding-bottom: 150rpx;
+      // background: #FFFFFF;
 
+      .pay_section{
+        margin: 24rpx;
+        background-color: #FFFFFF;
+        border-radius: 20rpx;
+        overflow: hidden;
+      }
       .text_gray{
         color: #666666 !important;
+      }
+      .vip_list_wrap{
+
       }
       .column-group{
         .column-item{
           display: flex;
           align-items: center;
           justify-content: space-between;
-          border-bottom: 1px solid rgba(238, 238, 238, 1);
-          padding: 30rpx 50rpx;
+          // border-bottom: 1px solid rgba(238, 238, 238, 1);
+          padding: 30rpx 40rpx;
 
           &.noBorder{
             border-bottom: none;
-            padding: 12rpx 50rpx;
+            padding: 12rpx 40rpx;
           }
 
           .column_label{
@@ -922,6 +1038,19 @@
         padding: 24rpx 0;
         background: #FFFFFF;
         box-shadow: 0 0 0px 1px rgba(0, 0, 0, 0.1);
+        box-sizing: border-box;
+        &.plus_btm{
+          display: flex;
+          align-items: center;
+          justify-content: space-between;
+          padding-left:40rpx;
+          padding-right: 40rpx;
+          .flex_l{
+            color: #FF5A39;
+            display: flex;
+            align-items: center;
+          }
+        }
       }
     }
   }

package/src/components/JfbThirdPay/Mock.js

@@ -1,8 +1,66 @@
-'use strict';
+"use strict";
 
 module.exports = {
-  getThirdOrderInfo: {"main_order_id":"b517729203734716416","address":"北京市东城区崇文门外大街18号1幢（F1-1）号商铺","phone":"13611111111","total_price":"1680","show_time":1684396260,"remark":"","count_down":897,"request_id":"d2002455fa902b94"},
-  getThirdListCards: {"list":[{"card_number":"101001000005388","card_type_name":"聚福宝福","end_time":1764345599,"card_point":8319,"is_bind_card":true}],"request_id":"7a01f757e9c2b1ab"},
-  getPayMethod: {"list":[{"method":"wallet","show_name":"使用我的元宝","icon":"icon_1"},{"method":"third","show_name":"使用补差","icon":"icon_2"},{"method":"score","show_name":"使用积分","icon":"icon_3"},{"method":"card","show_name":"使用票券1","icon":"icon_4"}],"request_id":"6549409a86024ecf"},
-  getUserWallet: {"show_name":"我的元宝","icon":"icon_1","total_amount":127134,"list":[{"wallet_type":"UC","wallet_name":"测试账户1","wallet_virtual_number":"1000000000000245","amount":66955,"business_codes":"cake,v-RcA8Mv-Gpd96_Y_mjIf,movie","business_codes_name":"蛋糕(勿改),商城,电影(勿改)","wallet_rule":"<p>UC使用规则说明<\/p>\n<p>123<\/p>\n<p>阿达我娃的啊我啊我啊我啊我<\/p>\n<p><span style=\"color: #ff0000;\">阿我打我爱我的啊我啊我<\/span><\/p>"},{"wallet_type":"UB","wallet_name":"测试账户3","wallet_virtual_number":"1000000000000244","amount":60179,"business_codes":"cake,movie,market,video,book","business_codes_name":"蛋糕(勿改),电影(勿改),商城(对应百货)(勿改),网络视听(勿改),图书(勿改)","wallet_rule":"<p>UB使用规则说明<\/p>\n<p>123456<\/p>"}],"request_id":"c9975f7b9bc426a5"},
-}
+  getThirdOrderInfo: {
+    main_order_id: "b517729203734716416",
+    address: "北京市东城区崇文门外大街18号1幢（F1-1）号商铺",
+    phone: "13611111111",
+    total_price: "1680",
+    show_time: 1684396260,
+    remark: "",
+    count_down: 897,
+    product_total_price: "1680",
+    logistics_amount: "100",
+    request_id: "d2002455fa902b94"
+  },
+  getThirdListCards: {
+    list: [
+      {
+        card_number: "101001000005388",
+        card_type_name: "聚福宝福",
+        end_time: 1764345599,
+        card_point: 8319,
+        is_bind_card: true
+      }
+    ],
+    request_id: "7a01f757e9c2b1ab"
+  },
+  getPayMethod: {
+    list: [
+      { method: "wallet", show_name: "使用我的元宝", icon: "icon_1" },
+      { method: "third", show_name: "使用补差", icon: "icon_2" },
+      { method: "score", show_name: "使用积分", icon: "icon_3" },
+      { method: "card", show_name: "使用票券1", icon: "icon_4" }
+    ],
+    request_id: "6549409a86024ecf"
+  },
+  getUserWallet: {
+    show_name: "我的元宝",
+    icon: "icon_1",
+    total_amount: 127134,
+    list: [
+      {
+        wallet_type: "UC",
+        wallet_name: "测试账户1",
+        wallet_virtual_number: "1000000000000245",
+        amount: 66955,
+        business_codes: "cake,v-RcA8Mv-Gpd96_Y_mjIf,movie",
+        business_codes_name: "蛋糕(勿改),商城,电影(勿改)",
+        wallet_rule:
+          '<p>UC使用规则说明</p>\n<p>123</p>\n<p>阿达我娃的啊我啊我啊我啊我</p>\n<p><span style="color: #ff0000;">阿我打我爱我的啊我啊我</span></p>'
+      },
+      {
+        wallet_type: "UB",
+        wallet_name: "测试账户3",
+        wallet_virtual_number: "1000000000000244",
+        amount: 60179,
+        business_codes: "cake,movie,market,video,book",
+        business_codes_name:
+          "蛋糕(勿改),电影(勿改),商城(对应百货)(勿改),网络视听(勿改),图书(勿改)",
+        wallet_rule: "<p>UB使用规则说明</p>\n<p>123456</p>"
+      }
+    ],
+    request_id: "c9975f7b9bc426a5"
+  },
+  getVipList:{"total_size":3,"next_page_token":"","list":[{"vip_card_id":3,"product_id":60038520,"product_name":"体验卡","sale_price":10000000,"vip_card_icon":""},{"vip_card_id":2,"product_id":60038519,"product_name":"月卡","sale_price":10000000,"vip_card_icon":""},{"vip_card_id":1,"product_id":60038515,"product_name":"测1","sale_price":10000000,"vip_card_icon":""}],"request_id":"c5cf58415cffdc30"},
+};

package/src/components/JfbThirdPay/WalletMix.js

@@ -209,6 +209,7 @@ export default {
         selected_wallet_list_json: JSON.stringify(selected_wallet_list),
         need_pay_price: this.orderNeedPayPrice,
         namespace: this.xnamespace,
+        vip_card_id: this.vip_card_id,
         ...this.options,
       }, (res) => {
         console.warn("创建订单成功");