jufubao-base 1.0.161 → 1.0.162-beta10

package/src/components/JfbBaseCard/Attr.js

@@ -16,200 +16,6 @@ export default {
           {label: "布局2", value: "2"},
         ]
       },
-      {
-        ele: 'title',
-        label: '登录样式设置',
-        size: 'small',
-        groupKey: 'content',
-      },
-      {
-        label: "登录文字大小",
-        ele: "el-input",
-        type: "number",
-        valueKey: "login_text_size",
-        groupKey: 'content',
-        value: data.login_text_size || '',
-        placeholder: "请输入登录文字大小",
-        className: "input80",
-        inline: false,
-      },
-      {
-        label: "登录字体颜色配置",
-        ele: 'xd-color',
-        valueKey: "login_text_color",
-        groupKey: 'content',
-        value: data.login_text_color || '',
-        className: "input80",
-        inline: false,
-      },
-      {
-        label: "登录背景颜色配置",
-        ele: 'xd-color',
-        valueKey: "login_text_bg_color",
-        groupKey: 'content',
-        value: data.login_text_bg_color || '',
-        className: "input80",
-        inline: false,
-      },
-      {
-        label: "登录按钮圆角配置",
-        ele: 'xd-site-select-list',
-        valueKey: "login_text_radius",
-        groupKey: 'content',
-        value: data.login_text_radius || '',
-        placeholder: '请选择内容圆角设置',
-        multiple: false,
-        className: 'input80',
-        handleCustom({action, data}) {
-          XdBus.getParentApi('getOptionsSettingList')({setting_id: 'edtix_style_radius'})
-            .then(res => {
-              data.cb(res.list)
-            })
-            .catch(error => {
-              console.error(error);
-            });
-        },
-      },
-
-      {
-        ele: 'title',
-        label: '查看样式设置',
-        size: 'small',
-        groupKey: 'content',
-      },
-      {
-        label: "查看文字大小",
-        ele: "el-input",
-        type: "number",
-        valueKey: "look_text_size",
-        groupKey: 'content',
-        value: data.look_text_size || '',
-        placeholder: "请输入登录文字大小",
-        className: "input80",
-        inline: false,
-      },
-      {
-        label: "查看字体颜色配置",
-        ele: 'xd-color',
-        valueKey: "look_text_color",
-        groupKey: 'content',
-        value: data.look_text_color || '',
-        className: "input80",
-        inline: false,
-      },
-      {
-        label: "查看背景颜色配置",
-        ele: 'xd-color',
-        valueKey: "look_text_bg_color",
-        groupKey: 'content',
-        value: data.look_text_bg_color || '',
-        className: "input80",
-        inline: false,
-      },
-      {
-        label: "查看按钮圆角配置",
-        ele: 'xd-site-select-list',
-        valueKey: "look_text_radius",
-        groupKey: 'content',
-        value: data.look_text_radius || '',
-        placeholder: '请选择内容圆角设置',
-        multiple: false,
-        className: 'input80',
-        handleCustom({action, data}) {
-          XdBus.getParentApi('getOptionsSettingList')({setting_id: 'edtix_style_radius'})
-            .then(res => {
-              data.cb(res.list)
-            })
-            .catch(error => {
-              console.error(error);
-            });
-        },
-      },
-      {
-        label: '票券登录文案:',
-        ele: 'el-input',
-        type: 'text',
-        valueKey: 'login_name',
-        groupKey:'content',
-        value: data.login_name || '',
-        placeholder: '请输入票券登录文案',
-        className: 'input80',
-        inline: false,
-        notice: '当未设置文案时候，前台页面显示为"<span style="color:red">登录</span>"'
-      },
-
-      {
-        label: '失效卡列表地址:',
-        ele: 'xd-select-pages-path',
-        valueKey: 'disabled_url',
-        groupKey:'advanced',
-        placeholder: '请选择失效卡列表地址',
-        value: data.disabled_url || null,
-        setting: {
-          router: XdBus.getParentApi('getPagesTree'),
-        },
-        inline: false,
-      },
-      {
-        label: '卡券详情地址:',
-        ele: 'xd-select-pages-path',
-        valueKey: 'detail_url',
-        groupKey:'advanced',
-        placeholder: '请选择卡券详情地址',
-        value: data.detail_url || null,
-        setting: {
-          router: XdBus.getParentApi('getPagesTree'),
-        },
-        inline: false,
-      },
-      {
-        label: '卡券转换地址:',
-        ele: 'xd-select-pages-path',
-        valueKey: 'change_url',
-        groupKey:'advanced',
-        placeholder: '请选择卡券转换地址',
-        value: data.change_url || null,
-        setting: {
-          router: XdBus.getParentApi('getPagesTree'),
-        },
-        inline: false,
-      },
-      {
-        label: '卡券密码绑定地址:',
-        ele: 'xd-select-pages-path',
-        valueKey: 'bind_url',
-        groupKey:'advanced',
-        placeholder: '请选择卡券密码绑定地址',
-        value: data.bind_url || null,
-        setting: {
-          router: XdBus.getParentApi('getPagesTree'),
-        },
-        inline: false,
-      },
-      {
-        label: '扫码绑定卡券确认地址:',
-        ele: 'xd-select-pages-path',
-        valueKey: 'confirm_url',
-        groupKey:'advanced',
-        placeholder: '请选择扫码绑定卡券确认地址',
-        value: data.confirm_url || null,
-        setting: {
-          router: XdBus.getParentApi('getPagesTree'),
-        },
-        inline: false,
-      },
-      {
-        label: '综合福利入口页:',
-        ele: 'xd-select-pages-path',
-        valueKey: 'allEntryPath',
-        groupKey:'advanced',
-        placeholder: '请选择综合福利入口页',
-        value: data.allEntryPath || null,
-        setting: {
-          router: XdBus.getParentApi('getPagesTree'),
-        },
-        inline: false,
-      },
       {
         label: '提示内容:',
         ele: 'xd-site-news',
@@ -445,6 +251,226 @@ export default {
           {label: "否", value: "2"},
         ]
       },
+      {
+        ele: 'title',
+        label: '登录样式设置',
+        size: 'small',
+        groupKey: 'content',
+      },
+      {
+        label: '票券登录文案:',
+        ele: 'el-input',
+        type: 'text',
+        valueKey: 'login_name',
+        groupKey:'content',
+        value: data.login_name || '',
+        placeholder: '请输入票券登录文案',
+        className: 'input80',
+        inline: false,
+        notice: '当未设置文案时候，前台页面显示为"<span style="color:red">登录</span>"，建议不超过<span style="color:red">4</span>个汉字'
+      },
+      {
+        label: '票券已登录文案:',
+        ele: 'el-input',
+        type: 'text',
+        valueKey: 'logged_name',
+        groupKey:'content',
+        value: data.logged_name || '',
+        placeholder: '请输入票券已登录文案',
+        className: 'input80',
+        inline: false,
+        notice: '当未设置文案时候，前台页面显示为"<span style="color:red">已登录</span>"，建议不超过<span style="color:red">4</span>个汉字'
+      },
+      {
+        label: "登录文字大小",
+        ele: "el-input",
+        type: "number",
+        valueKey: "login_text_size",
+        groupKey: 'content',
+        value: data.login_text_size || '',
+        placeholder: "请输入登录文字大小",
+        className: "input80",
+        inline: false,
+      },
+      {
+        label: "登录字体颜色配置",
+        ele: 'xd-color',
+        valueKey: "login_text_color",
+        groupKey: 'content',
+        value: data.login_text_color || '',
+        className: "input80",
+        inline: false,
+      },
+      {
+        label: "登录背景颜色配置",
+        ele: 'xd-color',
+        valueKey: "login_text_bg_color",
+        groupKey: 'content',
+        value: data.login_text_bg_color || '',
+        className: "input80",
+        inline: false,
+      },
+      {
+        label: "登录按钮圆角配置",
+        ele: 'xd-site-select-list',
+        valueKey: "login_text_radius",
+        groupKey: 'content',
+        value: data.login_text_radius || '',
+        placeholder: '请选择内容圆角设置',
+        multiple: false,
+        className: 'input80',
+        handleCustom({action, data}) {
+          XdBus.getParentApi('getOptionsSettingList')({setting_id: 'edtix_style_radius'})
+            .then(res => {
+              data.cb(res.list)
+            })
+            .catch(error => {
+              console.error(error);
+            });
+        },
+      },
+
+      {
+        ele: 'title',
+        label: '查看样式设置',
+        size: 'small',
+        groupKey: 'content',
+      },
+      {
+        label: '票券查看文案:',
+        ele: 'el-input',
+        type: 'text',
+        valueKey: 'look_name',
+        groupKey:'content',
+        value: data.look_name || '',
+        placeholder: '请输入票券查看文案',
+        className: 'input80',
+        inline: false,
+        notice: '当未设置文案时候，前台页面显示为"<span style="color:red">查看</span>"，建议不超过<span style="color:red">4</span>个汉字'
+      },
+      {
+        label: "查看文字大小",
+        ele: "el-input",
+        type: "number",
+        valueKey: "look_text_size",
+        groupKey: 'content',
+        value: data.look_text_size || '',
+        placeholder: "请输入登录文字大小",
+        className: "input80",
+        inline: false,
+      },
+      {
+        label: "查看字体颜色配置",
+        ele: 'xd-color',
+        valueKey: "look_text_color",
+        groupKey: 'content',
+        value: data.look_text_color || '',
+        className: "input80",
+        inline: false,
+      },
+      {
+        label: "查看背景颜色配置",
+        ele: 'xd-color',
+        valueKey: "look_text_bg_color",
+        groupKey: 'content',
+        value: data.look_text_bg_color || '',
+        className: "input80",
+        inline: false,
+      },
+      {
+        label: "查看按钮圆角配置",
+        ele: 'xd-site-select-list',
+        valueKey: "look_text_radius",
+        groupKey: 'content',
+        value: data.look_text_radius || '',
+        placeholder: '请选择内容圆角设置',
+        multiple: false,
+        className: 'input80',
+        handleCustom({action, data}) {
+          XdBus.getParentApi('getOptionsSettingList')({setting_id: 'edtix_style_radius'})
+            .then(res => {
+              data.cb(res.list)
+            })
+            .catch(error => {
+              console.error(error);
+            });
+        },
+      },
+
+
+      {
+        label: '失效卡列表地址:',
+        ele: 'xd-select-pages-path',
+        valueKey: 'disabled_url',
+        groupKey:'advanced',
+        placeholder: '请选择失效卡列表地址',
+        value: data.disabled_url || null,
+        setting: {
+          router: XdBus.getParentApi('getPagesTree'),
+        },
+        inline: false,
+      },
+      {
+        label: '卡券详情地址:',
+        ele: 'xd-select-pages-path',
+        valueKey: 'detail_url',
+        groupKey:'advanced',
+        placeholder: '请选择卡券详情地址',
+        value: data.detail_url || null,
+        setting: {
+          router: XdBus.getParentApi('getPagesTree'),
+        },
+        inline: false,
+      },
+      {
+        label: '卡券转换地址:',
+        ele: 'xd-select-pages-path',
+        valueKey: 'change_url',
+        groupKey:'advanced',
+        placeholder: '请选择卡券转换地址',
+        value: data.change_url || null,
+        setting: {
+          router: XdBus.getParentApi('getPagesTree'),
+        },
+        inline: false,
+      },
+      {
+        label: '卡券密码绑定地址:',
+        ele: 'xd-select-pages-path',
+        valueKey: 'bind_url',
+        groupKey:'advanced',
+        placeholder: '请选择卡券密码绑定地址',
+        value: data.bind_url || null,
+        setting: {
+          router: XdBus.getParentApi('getPagesTree'),
+        },
+        inline: false,
+      },
+      {
+        label: '扫码绑定卡券确认地址:',
+        ele: 'xd-select-pages-path',
+        valueKey: 'confirm_url',
+        groupKey:'advanced',
+        placeholder: '请选择扫码绑定卡券确认地址',
+        value: data.confirm_url || null,
+        setting: {
+          router: XdBus.getParentApi('getPagesTree'),
+        },
+        inline: false,
+      },
+      {
+        label: '综合福利入口页:',
+        ele: 'xd-select-pages-path',
+        valueKey: 'allEntryPath',
+        groupKey:'advanced',
+        placeholder: '请选择综合福利入口页',
+        value: data.allEntryPath || null,
+        setting: {
+          router: XdBus.getParentApi('getPagesTree'),
+        },
+        inline: false,
+      },
+
     ].filter(i => i)
   },
 };

package/src/components/JfbBaseCard/JfbBaseCard.vue

@@ -137,17 +137,35 @@
               :key="index"
               @click="handleBindLogin(item)"
               class="jfb-base-card__body-card-item"
+              :style="{
+                backgroundColor:(item['is_login'] === 'Y'? mainBorderColor : '#fff'),
+                border:`1px solid ${item['is_login'] === 'Y'? mainSubBorderColor:'#eeeeee'}`
+              }"
             >
               <view class="jfb-base-card__body-card-item-left">
                 <xd-font-icon
                   size="100"
                   :color="mainColor"
-                  icon="iconyouhuiquan1-011"
+                  :icon="item['is_login'] === 'Y'?'iconkaquandengluchenggong':'iconyouhuiquan1-011'"
                 ></xd-font-icon>
-                <view class="login_style" :style="loginStyle">{{ tabIndex === 1 ? login_name : "转换" }}</view>
+                <view
+                  class="login_style"
+                  :style="{
+                    backgroundColor:item['is_login'] === 'Y'?mainBorderColor:(login_text_bg_color||'#fff'),
+                    fontSize: login_text_size + 'rpx',
+                    color:item['is_login'] === 'Y'?mainColor:login_text_color,
+                    borderRadius: login_text_radius + 'rpx'
+                  }"
+                >{{ tabIndex === 1 ? (item['is_login'] === 'Y'? logged_name : login_name) : "转换" }}</view>
               </view>
-              <view class="jfb-base-card__body-card-item-right">
-                <view class="jfb-base-card__body-card-item-right-top">
+              <view
+                class="jfb-base-card__body-card-item-right"
+                :style="{borderColor: item['is_login'] === 'Y'? mainSubBorderColor:'#eeeeee'}"
+              >
+                <view
+                  class="jfb-base-card__body-card-item-right-top"
+                  :style="{borderColor: item['is_login'] === 'Y'? mainSubBorderColor:'#eeeeee'}"
+                >
                   <view>
                     <xd-font-icon
                       icon="iconkaquan"
@@ -164,15 +182,13 @@
                 </view>
                 <view class="jfb-base-card__body-card-item-right-bottom">
                   <view class="jfb-base-card__body-card-item-right-bottom-info">
-                    <view class="jfb-base-card__body-card-item-right-bottom-info-residue">
-                      剩余{{ item.unit }}数：{{ item.card_point }}{{ item.unit }}
-                    </view>
+                    <view class="jfb-base-card__body-card-item-right-bottom-info-residue">剩余{{ item.unit }}数：{{ item.card_point }}{{ item.unit }}</view>
                     <view
                       v-if="item.other_card_point && item.card_point_type !== 1"
                       class="jfb-base-card__body-card-item-right-bottom-info-deduction"
                     >购买其他物品可抵：{{ item.other_card_point }}</view>
                   </view>
-                  <view @click.stop="toDetail(item)" :style="lookStyle">查看</view>
+                  <view @click.stop="toDetail(item)" :style="lookStyle">{{look_name}}</view>
                 </view>
               </view>
             </view>
@@ -180,13 +196,15 @@
           <template v-else>
             <xd-card-v2
               :login-name="login_name"
+              :logged-name="logged_name"
+              :look-name="look_name"
               v-for="(item, index) in showList"
               :mainColor="mainColor"
               :key="index"
               :cardInfo="item"
               :tabIndex="tabIndex"
-              :loginStyle="loginStyle"
               :lookStyle="lookStyle"
+              :login-style="loginStyle"
               @toDetail="toDetail(item)"
               @bindLogin="handleBindLogin(item)">
             </xd-card-v2>
@@ -249,20 +267,27 @@ export default {
       jwxSDK: (state) => state.jwxSDK,
       jfbAuthorize: (state) => state.jfbAuthorize,
     }),
+
+
+
+    //布局2特殊样式，布局1在行内样式
     loginStyle(){
       let style = { backgroundColor: '#FFFFFF'};
       if(this.login_text_size) style['fontSize'] = this.login_text_size + 'rpx';
       if(this.login_text_color) style['color'] = this.login_text_color;
       if(this.login_text_bg_color) style['backgroundColor'] = this.login_text_bg_color;
       if(this.login_text_radius) style['borderRadius'] = this.login_text_radius + 'rpx'
+      if(this.cardLayout === '2') return style;
       return  this.styleObjectToString(style);
     },
+
     lookStyle(){
       let style = { backgroundColor: this.cardLayout === '2'? '' : this.mainColor};
       if(this.look_text_size) style['fontSize'] = this.look_text_size + 'rpx';
       if(this.look_text_color) style['color'] = this.look_text_color;
       if(this.look_text_bg_color) style['backgroundColor'] = this.look_text_bg_color;
       if(this.look_text_radius) style['borderRadius'] = this.look_text_radius + 'rpx';
+      if(this.cardLayout === '2') return style;
       return this.styleObjectToString(style);
     }
   },
@@ -291,6 +316,8 @@ export default {
     return {
       options: {},
       inCallbackUrlOrg:'',//是否带有回调地址
+      mainBorderColor:'',
+      mainSubBorderColor:'',
 
       //提示文案
       noticeBackgroundColor: "",
@@ -315,6 +342,7 @@ export default {
       showIndex: false,
 
       //页面跳转地址
+      logged_name: '',
       login_name:'',//登录文案
       changeUrl: "",
       bindUrl: "",
@@ -326,6 +354,7 @@ export default {
       bindCard: '1',
 
       //样式
+      look_name:'',
       login_text_size: "",
       login_text_color: "",
       login_text_bg_color: "",
@@ -345,6 +374,8 @@ export default {
   created() {
     this.init(this.container);
     this.noticeBackgroundColor = Color(this.warningColor).alpha(0.2).toString();
+    this.mainBorderColor = Color(this.mainColor).alpha(0.05).toString();
+    this.mainSubBorderColor = Color(this.mainColor).alpha(0.1).toString();
     this.isPreview = this.$configProject.isPreview;
     this.isQrCode = isQrCode(this);
 
@@ -377,15 +408,18 @@ export default {
       this.detailUrl = getContainerPropsValue(container,"content.detail_url",{value: ""}).value;
       this.confirmUrl = getContainerPropsValue(container,"content.confirm_url",{value: ""}).value;
       this.allEntryPath = getContainerPropsValue(container,"content.allEntryPath",{value: ""}).value;
-      this.login_name = getContainerPropsValue(container, "content.login_name", "登录");
 
       //登录样式
+      this.login_name = getContainerPropsValue(container, "content.login_name", "登录");
       this.login_text_size = getContainerPropsValue(container, 'content.login_text_size', 28);
       this.login_text_color = getContainerPropsValue(container, 'content.login_text_color', this.cardLayout==='2'? '#fff':'#333');
       this.login_text_bg_color = getContainerPropsValue(container, 'content.login_text_bg_color', this.cardLayout === '2'? this.mainColor:'');
       this.login_text_radius = getContainerPropsValue(container, 'content.login_text_radius', '20');
+      this.logged_name = getContainerPropsValue(container, 'content.logged_name', '已登录');
+
 
       //查看样式
+      this.look_name = getContainerPropsValue(container, 'content.look_name', '查看');
       this.look_text_size = getContainerPropsValue(container, 'content.look_text_size', 24);
       this.look_text_color = getContainerPropsValue(container, 'content.look_text_color', this.cardLayout==='2'? '#333':'#fff');
       this.look_text_bg_color = getContainerPropsValue(container, 'content.look_text_bg_color', this.cardLayout === '2'? '' :this.mainColor);
@@ -616,7 +650,6 @@ export default {
       this.disableList = [];
       this.changeList=[];
       this.showList = [];
-      debugger
       this.onJfbLoad(options);
     },
 
@@ -806,11 +839,11 @@ export default {
 
         &-right {
           flex: 1;
-          border-left: unit(2, rpx) solid #eeeeeeff;
+          border-left: unit(2, rpx) solid #eeeeee;
 
           &-top {
-            border-bottom: unit(2, rpx) solid #eeeeeeff;
-            padding: unit(30, rpx) unit(40, rpx);
+            border-bottom: unit(2, rpx) solid #eeeeee;
+            padding: unit(30, rpx) unit(20, rpx);
 
             & > view:nth-child(1) {
               display: flex;
@@ -832,7 +865,7 @@ export default {
             display: flex;
             justify-content: space-between;
             align-items: center;
-            padding: unit(20, rpx) unit(40, rpx);
+            padding: unit(20, rpx) unit(20, rpx);
 
             &-info {
               &-residue {
@@ -847,14 +880,14 @@ export default {
             }
 
             & > view:nth-child(2) {
-              width: unit(80, rpx);
+              min-width: unit(80, rpx);
               height: unit(40, rpx);
               border-radius: unit(40, rpx);
               font-size: unit(22, rpx);
               color: #fff;
               text-align: center;
               line-height: unit(40, rpx);
-              padding: unit(5, rpx) unit(9, rpx);
+              padding: unit(4, rpx) unit(16, rpx);
             }
           }
         }

package/src/components/JfbBaseCard/Mock.js

@@ -10,6 +10,7 @@ module.exports = {
       "unit": "点",
       "end_time": "2024-10-31 23:59:59",
       "is_valid": "Y",
+      "is_login":'Y',
       "main_product_name": "",
       "other_card_point": 0,
       "is_exchange": "N"
@@ -48,7 +49,7 @@ module.exports = {
       "card_point": 1400,
       "card_type_name": "聚福宝福卡测试蛋糕",
       "unit": "",
-      "end_time": "2025-05-03 23:59:59",
+      "end_time": "2025-05-03",
       "is_valid": "Y",
       "main_product_name": "",
       "other_card_point": 0,
@@ -58,7 +59,7 @@ module.exports = {
       "card_point": 0,
       "card_type_name": "聚福宝测试C40",
       "unit": "次",
-      "end_time": "2025-05-03 23:59:59",
+      "end_time": "2025-05-03",
       "is_valid": "Y",
       "main_product_name": "",
       "other_card_point": 0,
@@ -68,7 +69,7 @@ module.exports = {
       "card_point": 3600,
       "card_type_name": "聚福宝福卡测试蛋糕",
       "unit": "",
-      "end_time": "2025-05-03 23:59:59",
+      "end_time": "2025-05-03",
       "is_valid": "Y",
       "main_product_name": "",
       "other_card_point": 0,
@@ -78,7 +79,7 @@ module.exports = {
       "card_point": 0,
       "card_type_name": "聚福宝测试C40",
       "unit": "次",
-      "end_time": "2025-05-03 23:59:59",
+      "end_time": "2025-05-03",
       "is_valid": "Y",
       "main_product_name": "",
       "other_card_point": 0,
@@ -88,7 +89,7 @@ module.exports = {
       "card_point": 10000000,
       "card_type_name": "聚福宝福卡测试蛋糕",
       "unit": "点",
-      "end_time": "2024-02-03 23:59:59",
+      "end_time": "2024-02-03",
       "is_valid": "Y",
       "main_product_name": "",
       "other_card_point": 0,
@@ -98,7 +99,7 @@ module.exports = {
       "card_point": 1000000,
       "card_type_name": "聚福宝福卡测试蛋糕",
       "unit": "点",
-      "end_time": "2024-02-23 23:59:59",
+      "end_time": "2024-02-23",
       "is_valid": "Y",
       "main_product_name": "",
       "other_card_point": 0,