jufubao-base 1.0.169-beta13 → 1.0.169-beta15

package/src/components/JfbBaseTfkCardLogin/JfbBaseTfkCardLogin.vue

@@ -41,39 +41,10 @@
         </view>
       </view>
       <view class="JfbBaseNotice">
-        <!--notice-->
-        <view class="jfb-base-tfk-card-login__body-line" v-if="!notice"></view>
-        <view class="jfb-base-tfk-card-login__body-notice" :style="noticeWrapBoxStyle" v-if="notice">
-          <view
-            class="jfb-base-tfk-card-login__body-notice-in"
-            :style="noticeBoxStyle"
-          >
-            <xd-notice-bar
-              style="width: 100%"
-              :color="noticeFont.color"
-              :showIcon="true"
-              :scrollable="true"
-              :speed="20"
-              :fontSize="noticeFont.size"
-              :height="70"
-              :is-no-bgc="false"
-            >
-              <template>
-                <view v-html="notice"></view>
-              </template>
-            </xd-notice-bar>
-          </view>
-        </view>
-        <view class="jfb-base-tfk-card-login__body-notice" :style="noticeWrapBoxStyle" v-if="noticeStatus && isPreview && notice === ''">
-          <view
-            class="jfb-base-tfk-card-login__body-notice-in"
-            :style="[noticeBoxStyle, {
-              textAlign: 'center',
-              color: dangerColor,
-              fontSize: 26 + 'rpx',
-            }]">该组件未配置数据，因此改模块在正式环境将不显示</view>
-        </view>
-        <!--notice end-->
+        <jfb-notice
+          :panelSetting="noticeSetting"
+          :apiGetContent="apiGetContent"
+        ></jfb-notice>
       </view>
       <view class="card_list_wrap" :style="listBoxStyle">
 
@@ -107,7 +78,7 @@
                       :price="item.card_point"
                       :isOld="false"
                       :unit="item.unit || ''"
-                      :colorNew="'#333333'"
+                      :colorNew="cardFontColor"
                     ></xd-unit>
                   </view>
                   <view v-if="item.other_card_point && item.card_point_type !== 1" class="bind_deduct">
@@ -174,6 +145,7 @@
 <script>
   import XdFontIcon from "@/components/XdFontIcon/XdFontIcon";
   import XdUnit from "@/components/XdUnit/XdUnit";
+  import JfbNotice from "./JfbNotice";
   import { jfbRootExec } from "@/utils/xd.event";
   import JfbBaseTfkCardLoginMixin from "./JfbBaseTfkCardLoginMixin";
   import { getContainerPropsValue } from "@/utils/xd.base";
@@ -190,13 +162,15 @@
       XdFontIcon,
       XdNoticeBar,
       XdCouponItem,
-      XdUnit
+      XdUnit,
+      JfbNotice,
     },
     mixins: [
       componentsMixins, extsMixins, JfbBaseTfkCardLoginMixin
     ],
     data() {
       return {
+        // hideMask: true,
         menuType: "card", // card, coupon
         loadingList: true,
         cardList: [],
@@ -241,10 +215,28 @@
         couponUseBtnPadding: {},
         couponBtnRadius: 16,
         couponLeftBgColor: "",
+
+
+        noticeStyle: "",
+        notice_is_hide_dailog: "",
+        noticeIsTitle: "",
+        noticeTextAlign: "",
+        noticeRadius: "",
+        noticeBgc: "",
+        noticeTextColor: "",
+        noticeFontSize: "",
+        noticeNum: "",
+        noticeSpeed: "",
+        noticeScrollMargin: "",
+        noticeTime: "",
+
         noticeBgColor: "",
         noticeMargin: {},
         noticePadding: {},
         noticeFont: {},
+        noticeMoreFont: {},
+
+
         bindCardText: "",
         bindCardTextStyle: {},
         bindCardShowType: "",
@@ -255,6 +247,8 @@
         entryGroupId: "",
         cardHeight: 270,
         cardBtnMinWidth: 100,
+        menuShowType: "text",
+        cardFontColor: "",
       }
     },
     computed: {
@@ -300,8 +294,13 @@
           background: this.menuTabColor['actBgColor'] || '#fff',
           fontSize: this.menuTabColor['actFontSize'] || '30rpx',
           fontWeight: this.menuTabColor['actFontWeight'] || 'normal',
-          borderBottom: `${this.menuBorderWidth}px solid ${this.menuTabColor['actColor'] || defaultTextColor}`
         }
+        if(this.menuShowType === 'text'){
+          styleActiveObj.borderBottom = `${this.menuBorderWidth}px solid ${this.menuTabColor['actColor'] || defaultTextColor}`
+        }else{
+          styleActiveObj.borderRadius = '100rpx';
+        }
+
         return this.styleObjectToString(styleActiveObj)
       },
       bindCardBtnPadding(){
@@ -402,6 +401,7 @@
           border: border,
           boxShadow: boxShadow,
           height: this.cardHeight + 'rpx',
+          color: this.cardFontColor
         })
       },
       listBoxStyle(){
@@ -458,6 +458,29 @@
           padding: padding,
           background: this.noticeBgColor
         })
+      },
+      noticeSetting(){
+        
+        return {
+          style: this.noticeStyle,
+          is_hide_dailog: this.notice_is_hide_dailog,
+          isTitle: this.noticeIsTitle,
+          textAlign: this.noticeTextAlign,
+          radius: this.noticeRadius,
+          bgc: this.noticeBgc,
+          textColor: this.noticeFont.color || this.warningColor, // noticeTextColor,
+          fontSize: this.noticeFont.size, //noticeFontSize,
+          num: this.noticeNum,
+          speed: this.noticeSpeed,
+          scrollMargin: this.noticeScrollMargin,
+          time: this.noticeTime,
+          warningColor: this.warningColor,
+          containerId: this.containerId,
+          padding: this.noticePadding,
+          margin: this.noticeMargin,
+          moreTextColor: this.noticeMoreFont.color || this.warningColor,
+          moreFontSize: this.noticeMoreFont.size || 24,
+        }
       }
     },
     watch: {
@@ -490,7 +513,6 @@
         this.inCallback = inCallback || this.allEntryPath || this.settings.index;
 
         this.getCardList();
-        this.getContent();
       },
       /**
        * @description 监听事件变化
@@ -520,10 +542,7 @@
         this.couponUseBtnPadding = getContainerPropsValue(value, "content.couponUseBtnPadding", {top: 20, left: 20, right: 20, bottom: 20});
         this.couponBtnRadius = getContainerPropsValue(value, "content.couponBtnRadius", 16);
         this.couponLeftBgColor = getContainerPropsValue(value, "content.couponLeftBgColor", "");
-        this.noticeBgColor = getContainerPropsValue(value, "content.noticeBgColor", "");
-        this.noticeMargin = getContainerPropsValue(value, "content.noticeMargin", {top: 20, left: 20, right: 20, bottom: 20});
-        this.noticePadding = getContainerPropsValue(value, "content.noticePadding", {top: 20, left: 20, right: 20, bottom: 20});
-        this.noticeFont = getContainerPropsValue(value, "content.noticeFont", {});
+        
         this.bindCardText = getContainerPropsValue(value, "content.bindCardText", "");
         this.bindCardTextStyle = getContainerPropsValue(value, "content.bindCardTextStyle", {});
         this.bindCardShowType = getContainerPropsValue(value, "content.bindCardShowType", 'text');
@@ -537,6 +556,27 @@
         this.cardHeight = getContainerPropsValue(value, "content.cardHeight", 270);
         this.cardBtnMinWidth = getContainerPropsValue(value, "content.cardBtnMinWidth", 100);
         this.disabledPath = getContainerPropsValue(value, "content.disabledPath", {value: ""}).value;
+        this.menuShowType = getContainerPropsValue(value, "content.menuShowType", 'text');
+        this.cardFontColor = getContainerPropsValue(value, "content.cardFontColor", '#333');
+       
+        this.noticeStyle = getContainerPropsValue(value, "content.noticeStyle", '1');
+        this.notice_is_hide_dailog = getContainerPropsValue(value, "content.notice_is_hide_dailog", 'N');
+        this.noticeIsTitle = getContainerPropsValue(value, "content.noticeIsTitle", '');
+        this.noticeTextAlign = getContainerPropsValue(value, "content.noticeTextAlign", 'left');
+        this.noticeRadius = getContainerPropsValue(value, "content.noticeRadius", '');
+        this.noticeBgc = getContainerPropsValue(value, "content.noticeBgc", '');
+        this.noticeTextColor = getContainerPropsValue(value, "content.noticeTextColor", this.warningColor);
+        this.noticeFontSize = getContainerPropsValue(value, "content.noticeFontSize", '20');
+        this.noticeNum = getContainerPropsValue(value, "content.noticeNum", 1);
+        this.noticeSpeed = getContainerPropsValue(value, "content.noticeSpeed", 30);
+        this.noticeScrollMargin = getContainerPropsValue(value, "content.noticeScrollMargin", '');
+        this.noticeTime = getContainerPropsValue(value, "content.noticeTime", 3);
+
+        this.noticeBgColor = getContainerPropsValue(value, "content.noticeBgColor", "");
+        this.noticeMargin = getContainerPropsValue(value, "content.noticeMargin", {top: 20, left: 20, right: 20, bottom: 20});
+        this.noticePadding = getContainerPropsValue(value, "content.noticePadding", {top: 20, left: 20, right: 20, bottom: 20});
+        this.noticeFont = getContainerPropsValue(value, "content.noticeFont", {});
+        this.noticeMoreFont = getContainerPropsValue(value, "content.noticeMoreFont", {});
 
         console.log(this.cardShadow, 'cardShadow')
         if(this.bindCardTextStyle && !this.bindCardTextStyle.color){
@@ -626,6 +666,9 @@
             this.couponList = list;
           }
           if(show_type === 'normal'){
+            if(this.$configProject.isPreview){
+              list = list.filter(item => item.consume_type != 2)
+            }
             this.cardList = list;
           }
         })
@@ -636,26 +679,22 @@
           url: this.cardBindPath
         })
       },
-      getContent() {
-        jfbRootExec("getListBaseNewsContent", {
-          vm: this,
-          data: {
-            page_id: this.pageAttr["page_id"], //页面ID
-            container_id: this.containerId, //组件ID
-            limit: 1,
-          },
-        })
-          .then((res) => {
-            if (res.list.length > 0) {
-              if(res.list && res.list.length > 0) {
-                this.notice = this.$xdUniHelper.filterHtml(res.list[0].content);
-              }
-              this.noticeStatus = true;
-            }
+      apiGetContent(params){
+        return new Promise((resolve, reject) => {
+          jfbRootExec("getListBaseNewsContent", {
+            vm: this,
+            data: {
+              page_id: this.pageAttr["page_id"], //页面ID
+              container_id: this.containerId, //组件ID
+              page_size: this.noticeNum || 1,
+              ...params
+            },
+          }).then(res => {
+            resolve(res);
+          }).catch(err => {
+            reject(err);
           })
-          .catch((error) => {
-            console.error(error);
-          });
+        })
       },
       toDisableUrl(){
         this.$xdUniHelper.navigateTo({
@@ -761,7 +800,6 @@
             flex-direction: column;
             justify-content: space-between;
             .bind_point{
-              color: #333333;
               font-size: 48rpx;
               ::v-deep .xd-unit{
                 height: auto !important;
@@ -774,7 +812,6 @@
             }
             .bind_deduct{
               font-size: 28rpx;
-              color: #999;
               background: rgba(51, 51, 51, 0.05);
               display: inline-block;
               padding: 4rpx 20rpx;
@@ -782,20 +819,17 @@
             }
             .bind_number{
               font-size: 28rpx;
-              color: #999;
               margin-top: 20rpx;
               font-weight: 500;
             }
             .bind_time{
               font-size: 24rpx;
-              color: #999;
               margin-top: 16rpx;
               font-weight: 500;
               line-height: 1;
             }
             .bind_type{
               font-size: 28rpx;
-              color: #333333;
               position: absolute;
               top: 32rpx;
               right: 32rpx;