jufubao-base 1.0.135 → 1.0.136

package/src/components/JfbBaseNotice/Attr.js

@@ -6,7 +6,7 @@
  */
 export default {
   style: [],
-  content: (data) => {
+  content: (data={}) => {
     if (!data.style) data.style = '1';
     const checkNotice = ()=>{
       let temp = false;
@@ -21,13 +21,13 @@ export default {
     const checkScroll = ()=>{
       return data.style !== '2'
     }
-
     return [
       {
         label: '内容配置:',
         ele: 'xd-site-news',
         valueKey: 'notice',
         value: data.notice || null,
+        groupKey:'content',
         className: 'input70',
         setting: {
           config: {
@@ -47,7 +47,7 @@ export default {
           }
 
           //获取返回参数(场景类型名称为必填)
-          let loading = XdBus.getParentApi('loading')({});
+          let loading = { close(){}}
 
           //获取显示内容
           if (action === 'screen') {
@@ -91,6 +91,7 @@ export default {
 
           //使用内容分类
           if (action === 'cmsPublishEditxContent') {
+            loading = XdBus.getParentApi('loading')({});
             XdBus.getParentApi('cmsPublishEditxContent')(data.params)
               .then(res => {
                 console.log('cmsPublishEditxContent', res)
@@ -105,6 +106,7 @@ export default {
 
           //位置列表
           if (action === 'getListPostion') {
+            loading = XdBus.getParentApi('loading')({});
             XdBus.getParentApi('getListNewsPosition')(data.params)
               .then(res => {
                 loading.close();
@@ -118,6 +120,7 @@ export default {
 
           //位置创建
           if (action === 'addPostion') {
+            loading = XdBus.getParentApi('loading')({});
             XdBus.getParentApi('addNewsPosition')(data.params)
               .then(res => {
                 loading.close();
@@ -132,6 +135,7 @@ export default {
 
           //位置编辑
           if (action === 'editPostion') {
+            loading = XdBus.getParentApi('loading')({});
             XdBus.getParentApi('updateNewsPosition')(data.params)
               .then(res => {
                 loading.close();
@@ -146,6 +150,7 @@ export default {
 
           //位置删除
           if (action === 'deleltePostion') {
+            loading = XdBus.getParentApi('loading')({});
             XdBus.getParentApi('deleteNewsPosition')(data.params)
               .then(res => {
                 loading.close();
@@ -160,6 +165,7 @@ export default {
 
           //获取广告位内容列表
           if (action === 'getListContent') {
+            loading = XdBus.getParentApi('loading')({});
             XdBus.getParentApi('getListNewsContent')(data.params)
               .then(res => {
                 loading.close();
@@ -173,6 +179,7 @@ export default {
 
           //广告内容创建
           if (action === 'addContent') {
+            loading = XdBus.getParentApi('loading')({});
             XdBus.getParentApi('addNewsContent')(data.params)
               .then(res => {
                 loading.close();
@@ -187,6 +194,7 @@ export default {
 
           //广告内容编辑
           if (action === 'editContent') {
+            loading = XdBus.getParentApi('loading')({});
             XdBus.getParentApi('updateNewsContent')(data.params)
               .then(res => {
                 loading.close();
@@ -201,6 +209,7 @@ export default {
 
           //广告内容删除
           if (action === 'deleteContent') {
+            loading = XdBus.getParentApi('loading')({});
             XdBus.getParentApi('deleteNewsContent')(data.params)
               .then(res => {
                 loading.close();
@@ -215,6 +224,7 @@ export default {
 
           //内容发布
           if (action === 'publish') {
+            loading = XdBus.getParentApi('loading')({});
             console.log('publish', data.params)
             XdBus.getParentApi('cmsPublishContent')(data.params)
               .then(res => {
@@ -229,6 +239,7 @@ export default {
 
           //通知页面进行刷新
           if (action === 'update') {
+            loading = XdBus.getParentApi('loading')({});
             XdBus.getParentApi('getXdBusUpdateView')('onUpdateView', {});
             loading.close()
           }
@@ -244,25 +255,48 @@ export default {
         ele: 'xd-radio',
         valueKey: 'style',
         value: data['style'] || '1',
+        groupKey:'content',
         list: [
           {"label": "静态显示", "value": '1'},
           {"label": "滚动显示", "value": '2'},
           {"label": "弹窗显示", "value": '3'},
+        ],
+        inline:false,
+        notice:'预览模式点击使用“<span style="color:red">弹窗显示</span>”会重新触发页面刷新，可点击弹出遮罩层进行关闭功能'
+      },
+      {
+        label: '是否隐藏弹框(仅预览模式生效):',
+        ele: 'xd-radio',
+        valueKey: 'is_hide_dailog',
+        groupKey:'content',
+        value: data['is_hide_dailog'] || 'N',
+        placeholder: '请选择是否隐藏弹框',
+        className: 'input60',
+        list: [
+          { label: '是', value: 'Y' },
+          { label: '否', value: 'N' },
         ]
       },
-
-      checkNotice() && checkPop() && checkScroll() && data.style === '1' && {
+      {
+        ele: 'title',
+        label: '静态显示',
+        size: 'small',
+        groupKey:'style',
+      },
+      data.style === '1' && {
         label: '是否显示标题:',
         ele: 'xd-switch',
         valueKey: 'isTitle',
         value: data['isTitle'],
+        groupKey:'style',
         list: ['否', '是'],
         backValueType: 2,
       },
-      checkNotice() && checkPop() && checkScroll() && data.style === '1' && data['isTitle'] && {
+      data.style === '1' && data['isTitle'] && {
         label: '标题对其方式:',
         ele: 'xd-select-list',
         valueKey: 'textAlign',
+        groupKey:'style',
         className: 'input80',
         value: data['textAlign'] || '',
         list: [
@@ -271,29 +305,12 @@ export default {
           {"label": "右", "value": 'right'},
         ]
       },
-      checkNotice() && checkPop() && checkScroll() && {
-        label: '内容背景颜色:',
-        ele: 'xd-color',
-        valueKey: 'bgc',
-        value: data.bgc || '',
-        placeholder: '请选择内容背景颜色',
-        classNmae: 'input80',
-      },
-      checkNotice() && checkPop() && checkScroll() && {
-        label: '内文字颜色:',
-        ele: 'xd-color',
-        valueKey: 'textColor',
-        value: data.textColor || '',
-        placeholder: '请选择内文字颜色',
-        classNmae: 'input80',
-      },
-
-
-      checkNotice() && checkPop() && checkScroll() && data.style === '1' && {
+      data.style === '1' && {
         label: '内容圆角设置:',
         ele: 'xd-site-select-list',
         valueKey: 'radius',
         value: data['radius'],
+        groupKey:'style',
         placeholder: '请选择内容圆角设置',
         multiple: false,
         className: 'input80',
@@ -307,11 +324,30 @@ export default {
             });
         },
       },
-      checkNotice() && checkPop() && checkScroll() && {
+      {
+        label: '内容背景颜色:',
+        ele: 'xd-color',
+        valueKey: 'bgc',
+        groupKey:'style',
+        value: data.bgc || '',
+        placeholder: '请选择内容背景颜色',
+        classNmae: 'input80',
+      },
+      {
+        label: '内文字颜色:',
+        ele: 'xd-color',
+        groupKey:'style',
+        valueKey: 'textColor',
+        value: data.textColor || '',
+        placeholder: '请选择内文字颜色',
+        classNmae: 'input80',
+      },
+      {
         label: '内容文字大小:',
         ele: 'xd-site-select-list',
         valueKey: 'fontSize',
         value: data['fontSize'],
+        groupKey:'style',
         placeholder: '请选择内容文字大小',
         multiple: false,
         className: 'input80',
@@ -325,45 +361,42 @@ export default {
             });
         },
       },
-      checkNotice() && checkPop() && checkScroll() && {
-        label: '内容边距设置:',
-        ele: 'xd-margin-padding',
-        valueKey: 'margin',
-        value: data.margin || null,
-        disabled: false,
-        setting: {
-          type: 'margin',
-        },
-        placeholder: '请设置内容边距设置',
-        inline: false,
-        notice: '内容边距设置，<span style="color: red">单位：像素</span>。默认值：0像素',
-      },
-      checkNotice() && checkPop() && checkScroll() && {
+      {
         label: '内容填充设置:',
         ele: 'xd-margin-padding',
         valueKey: 'padding',
+        groupKey:'style',
         value: data.padding || null,
-        disabled: false,
         setting: {
           type: 'padding',
         },
         placeholder: '请内容填充设置',
         inline: false,
-        notice: '内容填充设置，<span style="color: red">单位：像素</span>。默认值：0像素',
+        notice: '内容填充设置，<span style="color: red">单位：像素</span>。默认值：<span style="color: red">20</span>像素',
       },
-      checkNotice() && !checkPop() && checkScroll() && {
-        label: '弹窗间隔:',
-        ele: 'el-input',
-        type: 'text',
-        valueKey: 'time',
-        value: data.time || '',
-        placeholder: '请输入弹窗间隔，默认值：3小时',
-        className: 'input80',
-        unit: '小时'
+      {
+        label: '边距设置:',
+        ele: 'xd-margin-padding',
+        groupKey:'style',
+        valueKey: 'margin',
+        value: data.margin || null,
+        setting: {
+          type: 'margin',
+        },
+        placeholder: '请设置内容边距设置',
+        inline: false,
+        notice: '内容边距设置，<span style="color: red">单位：像素</span>。默认值：<span style="color: red">20</span>像素',
       },
-      checkNotice() && checkPop() && !checkScroll() && {
+      {
+        ele: 'title',
+        label: '滚动显示',
+        size: 'small',
+        groupKey:'style',
+      },
+      {
         label: '滚动显示条数:',
         ele: 'el-input',
+        groupKey:'style',
         type: 'number',
         valueKey: 'num',
         value: data.num,
@@ -371,10 +404,11 @@ export default {
         className: 'input80',
         unit: '条'
       },
-      checkNotice() && checkPop() && !checkScroll() && {
+      {
         label: '滚动速度值:',
         ele: 'el-input',
         type: 'number',
+        groupKey:'style',
         valueKey: 'speed',
         value: data.speed,
         placeholder: '请输入滚动速度值，默认：20',
@@ -382,12 +416,12 @@ export default {
         inline: false,
         notice: '滚动速度值，建议取值：20-60， 值越大越快',
       },
-      checkNotice() && checkPop() && !checkScroll() && {
-        label: '内容边距设置:',
+      {
+        label: '边距设置:',
         ele: 'xd-margin-padding',
-        valueKey: 'margin',
-        value: data.margin || null,
-        disabled: false,
+        groupKey:'style',
+        valueKey: 'scrollMargin',
+        value: data.scrollMargin || null,
         setting: {
           type: 'margin',
         },
@@ -395,6 +429,23 @@ export default {
         inline: false,
         notice: '内容边距设置，<span style="color: red">单位：像素</span>。默认值：0像素',
       },
+      {
+        ele: 'title',
+        label: '弹窗显示',
+        size: 'small',
+        groupKey:'style',
+      },
+      {
+        label: '弹窗间隔:',
+        ele: 'el-input',
+        type: 'text',
+        groupKey:'style',
+        valueKey: 'time',
+        value: data.time || '',
+        className: 'input80',
+        inline: false,
+        notice: '弹窗间隔，单位：小时。默认值：<span style="color: red">3</span>小时',
+      },
     ].filter(i=>i)
   },
   advanced: [

package/src/components/JfbBaseNotice/JfbBaseNotice.vue

@@ -15,12 +15,9 @@
     <!-- #endif -->
     <view class="jfb-base-notice__body">
       <view class="jfb-base-notice__body-line"></view>
-      <view :style="{margin: marginUi}">
+      <view>
         <template v-if="style === '3' && isPreview">
-          <view
-            class="jfb-base-notice__body-pop"
-            :style="{backgroundColor:backgroundColor, color:warningColor}"
-          >弹窗模式方便编辑(占位)，在线上此模块不显</view>
+          <view class="jfb-base-notice__body-pop" :style="{backgroundColor:backgroundColor, color:warningColor}">弹窗模式方便编辑(占位)，在线上此模块不显</view>
         </template>
         <template v-if="style === '2'">
           <template v-if="contentList.length === 0 && isPreview">
@@ -31,7 +28,8 @@
               class="upAndDown"
               :style="{
                 backgroundColor:backgroundColor,
-                color:warningColor
+                color:warningColor,
+                margin:scrollMarginUi,
               }"
             >
               <view>
@@ -77,36 +75,37 @@
             >接口无数返回，请检查是否配置成功!</view>
           </template>
           <template v-else>
-            <view
-              class="jfb-base-notice__body-title"
-              :style="{
-                fontSize: titleFontSize + 'rpx',
-                background: bgc,
-                color:textColor,
-                borderRadius: titleRadius,
-                padding: titlePadding,
-                paddingBottom:0,
-                borderBottomColor: borderTitleColor,
-                textAlign: textAlign
-              }"
-              v-if="isTitle"
-            >{{title}}</view>
-            <view
-              class="jfb-base-notice__body-content"
-              :style="{
-                background: bgc,
-                color:textColor,
-                borderRadius: contRadius,
-                padding: paddingUi,
-                lineHeight: '50rpx'
-              }"
-              v-if="content"
-            >
-              <xd-content-xss
-                :key="contentKey"
-                :html="content"
-                :font-sizes="fontSize"
-              ></xd-content-xss>
+            <view :style="{margin:marginUi}">
+              <view
+                class="jfb-base-notice__body-title"
+                :style="{
+                  fontSize: titleFontSize + 'rpx',
+                  background: bgc,
+                  color:textColor,
+                  borderRadius: titleRadius,
+                  padding: titlePadding,
+                  borderBottomColor: borderTitleColor,
+                  textAlign: textAlign,
+                }"
+                v-if="isTitle"
+              >{{title}}</view>
+              <view
+                class="jfb-base-notice__body-content"
+                :style="{
+                  background: bgc,
+                  color:textColor,
+                  borderRadius: contRadius,
+                  padding: paddingUi,
+                  lineHeight: '50rpx'
+                }"
+                v-if="content"
+              >
+                <xd-content-xss
+                  :key="contentKey"
+                  :html="content"
+                  :font-sizes="fontSize"
+                ></xd-content-xss>
+              </view>
             </view>
           </template>
         </template>
@@ -209,18 +208,20 @@
         num: 1, //滚动记录数量
         timer: false,
         contentList: [],
+        scrollMargin:{},
 
         backgroundColor: '',
+        is_hide_dailog:'N',
       }
     },
     watch: {
-      container(value) {
+      container(value,oloValue) {
+        if(JSON.stringify(value) === JSON.stringify(oloValue)) return;
         this.init(this.container);
         if (this.$configProject['isPreview']) this.onJfbLoad()
       },
       num(){
         if (this.$configProject['isPreview']) this.onJfbLoad()
-
       },
       style() {
         if(this.$configProject['isPreview']) this.onJfbLoad()
@@ -238,13 +239,35 @@
     },
     computed:{
       marginUi() {
-        return `${this.margin.top || 0}rpx ${this.margin.right || 0}rpx ${this.margin.bottom || 0}rpx ${this.margin.left || 0}rpx`
+        let str = `${this.checkValue(this.margin.top, 20)}rpx`;
+        str = `${str} ${this.checkValue(this.margin.right, 20)}rpx`;
+        str = `${str} ${this.checkValue(this.margin.bottom, 20)}rpx`;
+        str = `${str} ${this.checkValue(this.margin.left, 20)}rpx`;
+        return str
       },
       paddingUi() {
-        return `${this.padding.top||8}rpx ${this.padding.right || 10}rpx ${this.padding.bottom || 8}rpx ${this.padding.left || 10}rpx`
+        let str = `${this.checkValue(this.padding.top, 20)}rpx`;
+        str = `${str} ${this.checkValue(this.padding.right, 20)}rpx`;
+        str = `${str} ${this.checkValue(this.padding.bottom, 20)}rpx`;
+        str = `${str} ${this.checkValue(this.padding.left, 20)}rpx`;
+        return str
+      },
+
+      scrollMarginUi(){
+        let str = `${this.checkValue(this.scrollMargin.top, 0)}rpx`;
+        str = `${str} ${this.checkValue(this.scrollMargin.right, 0)}rpx`;
+        str = `${str} ${this.checkValue(this.scrollMargin.bottom, 0)}rpx`;
+        str = `${str} ${this.checkValue(this.scrollMargin.left, 0)}rpx`;
+        return str
       },
+
+
       titlePadding() {
-        return `${this.padding.top*(3/5)}rpx ${this.padding.right || 10}rpx ${this.padding.bottom * (3 / 5)}rpx ${this.padding.left || 10}rpx`
+        let str = `${this.checkValue(this.padding.top, 20)}rpx`;
+        str = `${str} ${this.checkValue(this.padding.right, 20)}rpx`;
+        str = `${str} ${this.checkValue(this.padding.bottom, 20)}rpx`;
+        str = `${str} ${this.checkValue(this.padding.left, 20)}rpx`;
+        return str
       },
       contRadius(){
         if(this.isTitle) return `0rpx 0rpx ${this.radius}rpx ${this.radius}rpx`;
@@ -256,7 +279,14 @@
 
       getScrollType(){
         return this.num > 1
-      }
+      },
+
+      is_hide_dailog(value){
+        if(value === 'N') {
+          storage.remove(this.containerId);
+          this.onJfbLoad();
+        }
+      },
 
     },
     created() {
@@ -270,7 +300,6 @@
         this.showUp = type;
       },
 
-
       /**
        * @description 监听事件变化
        * @param container {object} 业务组件对象自己
@@ -285,6 +314,7 @@
         this.borderTitleColor = color(this.bgc).lighten(.15).hex();
         this.margin = getContainerPropsValue(container, 'content.margin', {top: 0, left: 0, bottom: 0, right: 0});
         this.padding = getContainerPropsValue(container, 'content.padding', {top: 8, left: 10, bottom: 8, right: 10});
+        this.scrollMargin =  getContainerPropsValue(container, 'content.scrollMargin', {});
         this.radius = getContainerPropsValue(container, 'content.radius', 0);
         this.fontSize = Number(getContainerPropsValue(container, 'content.fontSize', '20'));
         if (this.fontSize === 20) this.titleFontSize = 28;
@@ -297,6 +327,7 @@
           this.speed = Number(getContainerPropsValue(container, 'content.speed', 30));
         }
         else this.num = 1;
+        this.is_hide_dailog = getContainerPropsValue(container, 'content.is_hide_dailog', 'N');
       },
 
       handlePop(){
@@ -322,8 +353,6 @@
           },
         })
           .then(res => {
-            //res = {"list":[{"content_id":"YSjVvl2X6f5qYW5G7NNNr","category_id":"KNCYuDPWmmb4jUaBEOvbz","partner_id":0,"site_id":"","title":"东北地区暴雪影响","content":"<p>尊敬的用户您好！因受东北地区暴雪影响，部分订单暂停发货或包裹运输会有延迟，我们将在预警恢复后尽快安排发货，请您耐心等待，给您带来不便敬请谅解！<\/p>","sort":1,"status":"","start_time":1699200000,"end_time":1699804800,"op_user_id":"","created_time":0,"updated_time":0,"code":"","code_name":""},{"content_id":"YSjVvl2X6f5qYW5G7NNNr1","category_id":"KNCYuDPWmmb4jUaBEOvbz","partner_id":0,"site_id":"","title":"东北地区暴雪影响","content":"<p>尊敬的用户您好！因受东北地区暴雪影响，部分订单暂停发货或包裹运输会有延迟，我们将在预警恢复后尽快安排发货，请您耐心等待，给您带来不便敬请谅解！<\/p>","sort":1,"status":"","start_time":1699200000,"end_time":1699804800,"op_user_id":"","created_time":0,"updated_time":0,"code":"","code_name":""}],"request_id":"2d3b6e0f1cb184c5"};
-
             //弹窗显示
             if (this.style === '3') {
               if (res.list.length > 0) {
@@ -358,18 +387,16 @@
       },
 
       onJfbLoad() {
-        let delay = 500;
-        if(!this.isPreview)  delay = 10;
-
         if(this.timer){
           clearTimeout(this.timer);
           this.timer = null
         }
+
         this.timer = setTimeout(()=>{
           //弹窗模式
           if(this.style === '3') {
             if(this.isPreview) {
-              this.getContent();
+              if(this.is_hide_dailog === 'N') this.getContent();
             }
             else {
               if(!storage.get(this.containerId)) this.getContent()
@@ -380,7 +407,7 @@
           else {
             this.getContent()
           }
-        }, delay)
+        }, 500)
       },
 
       onJfbUpdate(data) {
@@ -404,7 +431,7 @@
         align-items: center;
       }
       &-line {
-        height: 0px;
+        height: 1px;
         overflow: hidden;
         width: 100%;
       }
@@ -446,16 +473,16 @@
         }
       }
       &-pop {
-        min-height: 30rpx;
+        min-height: 60rpx;
         text-align: center;
-        line-height: 30rpx;
+        line-height: 60rpx;
         color: #666;
         font-size: unit(24, rpx);
         padding:unit(20, rpx);
       }
       &-title {
         border-bottom: 1px solid #fff;
-        line-height: 2rem;
+        line-height: 1.5rem;
       }
 
       &-content {

package/src/components/JfbBaseNotice/JfbBaseNoticeLess.less

@@ -13,9 +13,7 @@
 
 //start
 .jfb-base-notice {
-  border: 1px dashed rgba(0, 0, 0, 0);
   box-sizing: border-box;
-  min-height: unit(50, rpx);
 
   &__body{
       position: relative;
@@ -23,21 +21,22 @@
       z-index: 2
   }
 
-  &.editx {
+  &.editx,&.editx:hover {
     position: relative;
-    border: 1px dashed blue;
-    box-sizing: border-box;
-    z-index: 3
-
-  }
-
-  &:hover {
-    border: 1px dashed blue;
-  }
+    min-height: unit(100, rpx);
+    z-index: 3;
+    &::after {
+      border: 2rpx dashed blue;
+      content: " ";
+      position: absolute;
+      top:0;
+      left:0;
+      bottom:0;
+      right:0;
+      z-index: 4;
+      cursor: pointer;
+    }
 
-  &.noBorder {
-    border-color: rgba(0,0,0,0);
-    border-width: 0;
   }
 
 
@@ -72,9 +71,9 @@
 
 /**notPreview**/
 .jfb-base-notice {
-  &:before {
-    content: " ";
-    display: table;
-  }
+  //&:before {
+    //content: " ";
+    //display: table;
+  //}
 }
 /**endNotPreview**/