jufubao-base 1.0.194-beta3 → 1.0.194-beta5

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "jufubao-base",
-  "version": "1.0.194-beta3",
+  "version": "1.0.194-beta5",
   "private": false,
   "description": "聚福宝业务组件基础插件包",
   "main": "index.js",

package/src/components/JfbBaseImageBlock/JfbBaseImageBlock.vue

@@ -14,7 +14,6 @@
     </view>
     <!-- #endif -->
     <view class="jfb-base-image-block__body">
-      <view class="x-line"></view>
       <view class="image" :style="[bodyStyle]">
         <image :src="backgroundImageComp" alt="bgImage"></image>
       </view>
@@ -110,9 +109,15 @@
   .jfb-base-image-block {
     min-height: 20rpx!important;
     &__body{
-      .image image {
-        height: 100%;
-        width: 100%;
+      display: inline-block;
+      width: 100%;
+
+      .image{
+        position: relative;
+        & >  image {
+          height: 100%;
+          width: 100%;
+        }
       }
     }
   }

package/src/components/JfbBasePoster/Attr.js

@@ -1,6 +1,8 @@
 'use strict';
-
-import console from "@dcloudio/uni-h5/src/core/helpers/console";
+function checkValue(value, dValue = 0){
+  if(value === undefined || value === '' || value === null) return dValue;
+  return Number(value || 0);
+}
 
 /**
  * @description 当表单组件中有联动操作时候，使用方法进行返回
@@ -8,6 +10,26 @@ import console from "@dcloudio/uni-h5/src/core/helpers/console";
 export default {
   style:[],
   content:(params)=>{
+    let poster = params.poster;
+    let showBg = false;
+    let posterHeight = 0;
+    if(toString.call(params.poster) === '[object Object]') {
+      if(poster.size && poster.size.height && poster.size.width){
+        showBg = true;
+        posterHeight = Number(poster.size.height)
+      }
+    }
+    let paddingDeflaut = 20;
+    if(toString.call(params.background) === '[object Object]'){
+      if(params.background && params.background.url) {
+        paddingDeflaut = 0
+      }
+    }
+    let marginRL = checkValue((params.margin||{}).right,0) + checkValue((params.margin||{}).left,0);
+    let paddingBT = checkValue((params.bgImagePadding||{}).bottom,paddingDeflaut) + checkValue((params.bgImagePadding||{}).top,paddingDeflaut);
+    let outWidth = Math.floor(750 - marginRL);
+    let outHeight = Math.floor(posterHeight + paddingBT);
+
     if(!params['isCarousel']) params['isCarousel'] = 1;
     return [
       {
@@ -253,7 +275,7 @@ export default {
         size: 'small',
         groupKey:'content',
       },
-      params.poster && params.poster['type']&& params.poster['type'] !== '1' && {
+      showBg && params.poster && params.poster['type']&& params.poster['type'] !== '1' && {
         label: '广告背景图:',
         ele: 'xd-upload',
         valueKey: 'background',
@@ -261,10 +283,10 @@ export default {
         value: params.background || {},
         defaultValue: params.background || null,
         slot: true,
-        oneWidth: 100,
-        oneHeight: 100,
+        oneWidth: 375,
+        oneHeight: 375*outHeight/outWidth,
         elinputClassName: 'input40',
-        tipsformet: '上传文件格式：@imageType@，不超过@size@MB.',
+        tipsformet: `上传文件格式：@imageType@，不超过@size@MB，尺寸：${outWidth}*${outHeight}像素`,
         type: ['jpg', 'png', 'jpeg'],
         styleType: 'one',
         uploadType: 'aliyun',

package/src/components/JfbBasePoster/JfbBasePoster.vue

@@ -194,15 +194,25 @@
       },
       getConfig(){
         let cell = this.posterType === '2' ? 2: (this.posterType === '3' ? 3 : 4);
+
+        //间距值
         let spacing = Math.floor((cell - 1) * this.padding * this.$rpxNum);
+
+        //主题填充
         let paddingDefault = 0;
         if(this.background === 'none' || this.background === '' || this.$xdUniHelper.isEmpty(this.background)) paddingDefault = 20;
-        let addPadding = this.checkValue(this.bgImagePadding.right, paddingDefault) +  this.checkValue(this.bgImagePadding.left, paddingDefault);
-        addPadding = addPadding * this.$rpxNum;
-        let margin = (this.checkValue(this.mS.right, 0) + this.checkValue(this.mS.left, 0)) *  this.$rpxNum;
-        let viewWidth = uni.getSystemInfoSync().safeArea.width -margin - addPadding - spacing;
-        let width = Math.floor(viewWidth / cell);
+        let outPaddingRL = this.checkValue(this.bgImagePadding.right, paddingDefault) + this.checkValue(this.bgImagePadding.left, paddingDefault);
+        outPaddingRL = outPaddingRL * this.$rpxNum;
+
+        //外边距
+        let marginRL = (this.checkValue(this.mS.right, 0) + this.checkValue(this.mS.left, 0)) *  this.$rpxNum;
+
+        //总统
+        let viewWidth = uni.getSystemInfoSync().safeArea.width - marginRL - outPaddingRL - spacing;
+        let width = viewWidth / cell;
         let height = this.height * width / this.width;
+
+
         return {
           mode: this.getMode,
           dotStyleData: this.dotStyleData,
@@ -658,6 +668,9 @@
   .jfb-base-poster {
     min-height: 60rpx!important;
     &__body{
+      display: inline-block;
+      width: 100%;
+
       & > view.jfb-base-poster-cont {
         box-sizing: border-box;
         overflow: hidden;

package/src/components/JfbBasePoster/MoreScreen.vue

@@ -65,7 +65,7 @@
                   marginTop: indext < config.cell ? 0 : config.padding + 'rpx',
                 }"
               >
-                <image :style="{ width: width + 'px', height: height + 'px'}" :src="it.image_url" mode="widthFix"></image>
+                <image :style="{ width: width + 'px', height: height + 'px'}" :src="it.image_url"></image>
               </view>
             </view>
           </swiper-item>
@@ -102,7 +102,7 @@
                 }"
                 @click="handleClick(it)"
               >
-                <image :style="{ width: width + 'px', height: height + 'px'}" :src="it.image_url" mode="widthFix"></image>
+                <image :style="{ width: width + 'px', height: height + 'px'}" :src="it.image_url"></image>
               </view>
             </view>
           </template>