jufubao-mall 2.0.35-beta8 → 2.0.35-beta9

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "jufubao-mall",
-  "version": "2.0.35-beta8",
+  "version": "2.0.35-beta9",
   "private": false,
   "description": "聚福宝商城业务组件插件包",
   "main": "index.js",

package/src/components/JfbMallShopVip/JfbMallShopVip.vue

@@ -33,7 +33,7 @@
               @on-close-marker="(item)=>{handleShowMarker(item,false)}"
               @regionchange="handleRegionChange"
               @init="handleH5Init"
-              @on-detail="handleToEvent"
+              @on-detail="handleBaiduToEvent"
             ></xd-baidu-map>
             <!--#endif-->
             <!-- #ifdef MP-WEIXIN -->
@@ -46,6 +46,7 @@
               :latitude="mapCenter.latitude"
               :markers="marketList"
               @markertap="handleMarketTap"
+              @callouttap="handleWxToEvent"
               @regionchange="handleRegionChange"
             >
               <cover-view
@@ -58,7 +59,12 @@
                   :marker-id="item.id"
                   style="background: rgba(0,0,0,.8);border-radius: 6px;padding: 8px 12px;color: #fff;"
                   :style="{display: item.id === showMarkerId ? 'block' : 'none'}"
-                >{{ item.title }}</cover-view>
+                >
+                  <view class="callout-text">
+                    <text>{{ item.title }}</text>
+                    <xd-font-icon icon="iconxiangyou_xian" color="#fff" size="28"></xd-font-icon>
+                  </view>
+                </cover-view>
               </cover-view>
             </map>
             <view class="weiXinLocation" v-if="mpLocationFn === 'getLocation'" @click="handleWXLocation">定位</view>
@@ -85,7 +91,12 @@
         <!--shop-->
         <view class="shop_list" :style="[contStyleComp]">
           <template v-if="nearbyShopList === null || (nearbyShopList && nearbyShopList.length > 0)">
-            <scroll-view scroll-y  class="scroll_y" :scroll-into-view="intoViewResourceShopId" scroll-with-animation>
+            <scroll-view
+              scroll-y
+              class="scroll_y"
+              :scroll-into-view="intoViewResourceShopId"
+              scroll-with-animation
+            >
               <template v-if="nearbyShopList === null">
                 <view class="shop_list-ske" :id="i" v-for="i in 6" :key="i" :style="[cusStyle.item]">
                   <view class="shop_list-ske-title">
@@ -100,35 +111,40 @@
                 </view>
               </template>
               <template v-else-if="nearbyShopList.length >0">
-                <view
-                  :style="[cusStyle.item]"
-
-                  class="shop_list-item"
-                  :class='[{"shop_list-item-act":resource_shop_id === item.resource_shop_id}]'
-                  v-for="item in nearbyShopList"
-                  :key="item.key"
-                  :id="`scroll-${item.resource_shop_id}`"
-                  @click="handleToEvent(item, 'shop')"
-                >
-                  <view class="shop_list-item-title">
-                    <view class="title">
-                      <view>{{item.resource_shop_name}}</view>
-                      <view class="active" v-if="resource_shop_id === item.resource_shop_id">正在预览</view>
+                <template v-for="(item,index) in nearbyShopList">
+                  <view
+                    :style="[
+                      cusStyle.item,
+                      (index === 0?{marginTop: itemTop + 'rpx'}:{}),
+                      (index === nearbyShopList.length -1?{marginBottom: 0}:{})
+                    ]"
+                    class="shop_list-item"
+                    :class='[{"shop_list-item-act":resource_shop_id === item.resource_shop_id}]'
+                    :key="item.key"
+                    :id="`scroll-${item.resource_shop_id}`"
+                    @click="handleToEvent(item, 'shop')"
+                  >
+                    <view class="shop_list-item-title">
+                      <view class="title">
+                        <view>{{item.resource_shop_name}}</view>
+                        <view class="active" v-if="resource_shop_id === item.resource_shop_id">正在预览</view>
+                      </view>
+                      <view @click.stop="handleToEvent(item, 'detail')">
+                        <text>详情</text>
+                        <xd-font-icon icon="iconxiangyou_xian" color="#999" size="30" width="26" height="26"></xd-font-icon>
+                      </view>
                     </view>
-                    <view @click.stop="handleToEvent(item, 'detail')">
-                      <text>详情</text>
-                      <xd-font-icon icon="iconxiangyou_xian" color="#999" size="30" width="26" height="26"></xd-font-icon>
+                    <view class="address" :style="{marginBottom:item['business_time_name']?'16rpx':0}">
+                      <view>{{item.address}}</view>
+                      <view
+                        v-if="item.distance_conversion || item.distance"
+                        :style="[cusStyle.distance]"
+                      >{{item.distance_conversion || item.distance}}</view>
                     </view>
+                    <view class="openTime" v-if="item['business_time_name']">营业时间：{{item['business_time_name']}}</view>
                   </view>
-                  <view class="address" :style="{marginBottom:item['business_time_name']?'16rpx':0}">
-                    <view>{{item.address}}</view>
-                    <view
-                      v-if="item.distance_conversion || item.distance"
-                      :style="[cusStyle.distance]"
-                    >{{item.distance_conversion || item.distance}}</view>
-                  </view>
-                  <view class="openTime" v-if="item['business_time_name']">营业时间：{{item['business_time_name']}}</view>
-                </view>
+                  <view v-if="index === nearbyShopList.length -1" :style="{height: itemBottom + 'rpx'}"></view>
+                </template>
               </template>
             </scroll-view>
           </template>
@@ -213,6 +229,9 @@
         //style
         bodyPadding: {},
         cusStyle: {},
+        cardItemShadowWidth:0,
+        itemTop:0,
+        itemBottom:0,
         contentBgColor: 'rgba(0,0,0,0)',
 
         //选项卡
@@ -253,13 +272,23 @@
       },
       contStyleComp(){
         let height = this.layoutInfo.bodyMinHeightRpx  - 72;
+        let padding = this.getMarginAndPadding(this.bodyPadding, 0);
         //大于一个标签显示标签
         if(this.titleList.length > 1) height = height - 100;
         if(this.mapIsExtend) height = height - 500;
-        height = height - this.getPMValue(this.bodyPadding, 'TB', 0);
+
+        //有投影信息
+        if(this.cardItemShadowWidth > 0) {
+          padding = 0;
+        }
+        //无投影信息
+        else {
+          height = height - this.getPMValue(this.bodyPadding, 'TB', 0);
+        }
+
         return {
           height: height + 'rpx',
-          padding: this.getMarginAndPadding(this.bodyPadding, 0),
+          padding: padding,
           backgroundColor: this.contentBgColor
         }
       },
@@ -383,13 +412,24 @@
         //门店列表
         let cardItemSpace = gCPVal(container,'cardItemSpace', [16,20], {sKey:'cardItemSpaceStatus',fields:['cardItemSpace'],cusFields: ['shopStyle','cardItemSpace',shopStyle]});
         let cardItemRadius = gCPVal(container,'cardItemRadius', [sValue===shopStyle?0:this.gStyleValue.radius, 0], {sKey:'cardItemRadiusStatus',fields:['listItemRadius']})|| 0;
-        let cardItemShadow = gCPVal(container, 'cardItemShadow', [this.gStyleValue.shadow, {color:'',width:'0',}],{isShadow: true});
+        let cardItemShadow = gCPVal(container, 'cardItemShadow', [this.gStyleValue.shadow, {color:'',width:'0'}],{isShadow: true});
         let cardItemBorder = gCPVal(container, 'cardItemBorder', [{color: '#f8f8f8',width: 0,style: 'solid'},{color: '#f8f8f8',width: 0,style: 'solid'}],{isBorder: true});
         let distanceColor = gCPVal(container,'distanceColor', '#999999', {sKey:'distanceColorStatus',fields:['distanceColor']});
         let cardItemBgColor = gCPVal(container,'cardItemBgColor', '#fff', {sKey:'cardItemBgColorStatus',fields:['cardItemBgColor']});
         let itemPadding = gCPVal(container,'itemPadding', [{top:32,left:32, right:32, bottom:32},20], {sKey:'itemPaddingStatus',fields:['itemPadding'],isPMR: true});
         let cardImageBorder = gCPVal(container, 'cardImageBorder', [{color: '#f8f8f8',width: 0,style: 'solid'},{color: '#f8f8f8',width: '2rpx',style: 'solid'}],{isBorder: true});
         let itemImageRadius = gCPVal(container,'itemImageRadius', [this.gStyleValue.radius/2, 0], {sKey:'itemImageRadiusStatus',fields:['itemImageRadius']})||0;
+        this.cardItemShadowWidth = gCPVal(container, 'cardItemShadow', [this.gStyleValue.shadow, {color:'',width:'0'}], {isShadow:true, isBsWidth: true});
+        let right = Math.max(this.cardItemShadowWidth,this.bodyPadding.right);
+        let left = Math.max(this.cardItemShadowWidth,this.bodyPadding.left);
+        this.itemTop = Math.max(this.cardItemShadowWidth,this.bodyPadding.top);
+        this.itemBottom = Math.max(this.cardItemShadowWidth,this.bodyPadding.bottom);
+        if(this.cardItemShadowWidth === 0) {
+          right = 0; left = 0;
+          this.itemTop = 0;
+          this.itemBottom = 0;
+        }
+
         this.cusStyle = {
           'item':{
             'margin-bottom': `${cardItemSpace}rpx`,
@@ -398,6 +438,8 @@
             'border': cardItemBorder,
             'backgroundColor': cardItemBgColor,
             'padding': this.getMarginAndPadding(itemPadding, 0),
+            'margin-right': `${right}rpx`,
+            'margin-left': `${left}rpx`
           },
           'image':{
             'border-radius': itemImageRadius + 'rpx',
@@ -498,9 +540,14 @@
 
       handleMarketTap(e){
         this.showMarkerId = e.markerId;
+        this.resource_shop_id = e.markerId;
+        setTimeout(()=>{
+          this.intoViewResourceShopId = `scroll-${e.markerId}`;
+        },50)
       },
 
       // #endif
+
       // #ifdef H5
       handleH5Init(){
         this.getNearbyShop();
@@ -716,14 +763,20 @@
       },
 
 
+
       //==点击事件===========
+      handleWxToEvent(e){
+        this.handleToEvent({resource_shop_id: e.detail.markerId},'shop');
+      },
+      handleBaiduToEvent({item}){
+        this.handleToEvent({resource_shop_id: item.id},'shop');
+      },
       /**
        * @description
        * @param item
        * @param type detail|shop
        */
       handleToEvent(item,type) {
-        debugger
         let parmas = [];
         let url = ''
         if(item['resource_shop_id'])  parmas.push(`resource_shop_id=${item['resource_shop_id']}`)
@@ -780,8 +833,7 @@
         background: #fff;
         font-size: unit(28, rpx);
         .mpa_wrap {
-          padding: 20rpx;
-          height: 460rpx;
+          height: 500rpx;
           background: #fff;
           transition: all .3s ease-in-out;
           position: relative;
@@ -877,6 +929,9 @@
 
         &-item {
           box-sizing: border-box;
+          &:last-child {
+            margin-bottom: 0!important;
+          }
           &-act {
             background-color: var(--main-alpha-color)!important;
             border:1px solid var(--main-alpha5-color)!important;
@@ -957,6 +1012,14 @@
         }
       }
 
+      .callout-text {
+        display: flex;
+        justify-content: flex-start;
+        align-items: flex-start;
+        flex-flow: wrap;
+        line-height: 36rpx;
+      }
+
     }
 
     .weiXinLocation {