jufubao-base 1.0.67 → 1.0.68

package/package.json

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

package/src/components/JfbBaseConDialog/Api.js

@@ -0,0 +1,19 @@
+'use strict';
+
+/**
+ * @description 卡券登陆
+ * @type {*[]}
+ */
+module.exports = [
+  {
+    mapFnName: 'getCouponDialogList', //自定义方法名字（必选）
+    title: '获取活动弹框列表',
+    path: '/sms/v1/activity/list',
+    isRule: false,
+    params: {
+      namespace: ['业务线', 'String', '必填'],
+    },
+    isConsole: true,
+    disabled: true,
+  },
+];

package/src/components/JfbBaseConDialog/Attr.js

@@ -0,0 +1,60 @@
+'use strict';
+
+/**
+ * @description 当表单组件中有联动操作时候，使用方法进行返回
+ */
+export default {
+  style: [],
+  content:(data) => {
+    return [
+      {
+        label: '选取优惠券列表路径:', //label
+        ele: 'xd-select-pages-path', //package 名称
+        valueKey: 'list_url', //form[valueKey]
+        placeholder: '请选择优惠券列表路径',
+        value: data['list_url'] ||null,
+        setting: {
+          router: XdBus.getParentApi('getPagesTree'),
+        },
+        inline: false,
+      },
+      {
+        label: '活动提示方式:',
+        ele: 'xd-radio',
+        valueKey: 'type',
+        value: data['type']||1,
+        placeholder: '请选择活动提示方式',
+        multiple: false,
+        className: 'input80',
+        list: [
+          { label: '弹框', value: 1 },
+          { label: '切换', value: 2 },
+        ]
+      },
+      {
+        label: '弹窗间隔:',
+        ele: 'el-input',
+        type: 'text',
+        valueKey: 'time',
+        value: data.time || '',
+        placeholder: '请输入弹窗间隔，默认值：3小时',
+        className: 'input80',
+        unit: '小时'
+      },
+      {
+        label: '是否隐藏弹框(仅预览模式生效):',
+        ele: 'xd-radio',
+        valueKey: 'isHide',
+        value: data['isHide']||false,
+        placeholder: '请选择是否隐藏弹框',
+        multiple: false,
+        className: 'input80',
+        list: [
+          { label: '是', value: true },
+          { label: '否', value: false },
+        ]
+      },
+    ].filter(i=>i)
+  },
+  advanced: [],
+};

package/src/components/JfbBaseConDialog/JfbBaseConDialog.vue

@@ -0,0 +1,297 @@
+<template>
+  <view
+    class="jfb-base-con-dialog"
+    @click="handleEditxSelect"
+    :class="{
+      editx: isEditx && active,
+      noBorder: noBorder,
+    }"
+  >
+    <!--#ifdef H5-->
+    <view
+      class="jfb-base-con-dialog__edit"
+      :class="{ editx: isEditx && active }"
+      v-if="isEditx && active && !noBorder"
+    >
+      <view class="jfb-base-con-dialog__edit-icon" @click="delEdit">删除</view>
+    </view>
+    <!-- #endif -->
+    <view class="jfb-base-con-dialog__body">
+      <view class="jfb-base-con-dialog__body-dialog" v-if="isShow">
+        <view class="jfb-base-con-dialog__body-dialog-mask"></view>
+        <view class="jfb-base-con-dialog__body-dialog-content">
+          <view v-if="list.length>1" class="jfb-base-con-dialog__body-dialog-content-num">
+            <text>{{ currentIndex + 1 }}/{{ list.length }}</text>
+          </view>
+          <view style="display: flex; align-items: center">
+            <view
+              @click="handleChange('left')"
+              v-if="this.type === 2 && this.currentIndex !== 0"
+              class="jfb-base-con-dialog__body-dialog-content-left"
+            >
+              <xd-font-icon icon="iconxiangzuo_xian"></xd-font-icon>
+            </view>
+            <view class="jfb-base-con-dialog__body-dialog-content-image">
+              <image :src="currentImage"></image>
+              <image @click="handleToList" :src="currentBtnImage"></image>
+            </view>
+            <view
+              v-if="this.type === 2 && this.currentIndex !== list.length - 1"
+              @click="handleChange('right')"
+              class="jfb-base-con-dialog__body-dialog-content-right"
+            >
+              <xd-font-icon icon="iconxiangyou_xian"></xd-font-icon>
+            </view>
+          </view>
+          <xd-font-icon
+            @click="handleClose"
+            class="jfb-base-con-dialog__body-dialog-content-close"
+            icon="iconguanbi_xian"
+            color="#fff"
+            size="64"
+          ></xd-font-icon>
+        </view>
+      </view>
+      <view
+        :style="{ background: backgroundColor, color: warningColor }"
+        class="jfb-base-con-dialog__body-pop"
+        v-if="isPreview"
+        >弹框方便编辑(占位)，在线上此模块不显</view
+      >
+    </view>
+  </view>
+</template>
+
+<script>
+import XdFontIcon from "@/components/XdFontIcon/XdFontIcon";
+import { jfbRootExec, JfbEvent } from "@/utils/xd.event";
+import JfbBaseConDialogMixin from "./JfbBaseConDialogMixin";
+import componentsMixins from "@/mixins/componentsMixins";
+import extsMixins from "@/mixins/extsMixins";
+import { getContainerPropsValue } from "@/utils/xd.base";
+import getServiceUrl from "@/common/getServiceUrl";
+import colorCardMixins from "@/mixins/colorCardMixins";
+const Color = require("color");
+import { mapState } from "vuex";
+import storage from "@/common/storage";
+
+export default {
+  name: "JfbBaseConDialog",
+  components: {
+    XdFontIcon,
+  },
+  mixins: [componentsMixins, extsMixins, JfbBaseConDialogMixin],
+  data() {
+    return {
+      list_url: "",
+      list: [],
+      currentImage: "",
+      currentBtnImage: "",
+      currentIndex: 0,
+      isShow: false,
+      type: "",
+      isPreview: false, //是否预览
+      activity_id: "",
+      backgroundColor: "",
+    };
+  },
+  computed: {
+    ...mapState(["pageBusinessCode"]),
+  },
+  watch: {
+    container(value) {
+      console.log(value, "aakakakkaka");
+      this.init(value);
+    },
+  },
+  created() {
+    this.isPreview = this.$configProject.isPreview;
+    this.backgroundColor = Color(this.warningColor).alpha(0.2).toString();
+    this.init(this.container);
+  },
+  methods: {
+    init(value) {
+      this.list_url = getContainerPropsValue(value, "content.list_url", {
+        value: "",
+      }).value;
+      this.type = getContainerPropsValue(value, "content.type", 1);
+      this.isHide = getContainerPropsValue(value, "content.isHide", false);
+      this.time = Number(getContainerPropsValue(value, "content.time", 3));
+      if (this.isPreview) {
+        this.isShow = !this.isHide;
+      }
+    },
+    getDialogList() {
+      jfbRootExec("getCouponDialogList", {
+        vm: this,
+        data: {
+          namespace: this.pageBusinessCode,
+        },
+      })
+        .then((res) => {
+          console.log(res, "resresres");
+          this.list = res.list;
+          this.currentImage = getServiceUrl(
+            this.list[this.currentIndex].app_activity_url
+          );
+          this.currentBtnImage = getServiceUrl(
+            this.list[this.currentIndex].app_activity_button
+          );
+          this.activity_id = this.list[this.currentIndex].activity_id;
+          this.handlePop();
+        })
+        .catch((err) => {
+          console.log(err, "err");
+        });
+    },
+    handlePop() {
+      console.log("this.time", this.time * 60 + "分钟");
+      storage.set(this.containerId, 1, this.time);
+      this.isShow = true;
+    },
+    onJfbLoad(options) {
+      console.log(11111);
+      try {
+        if (!storage.get(this.containerId)) this.getDialogList();
+      } catch (error) {
+        console.log(error, "errorerror");
+      }
+    },
+    onJfbUpdate(data) {
+      storage.remove(this.containerId);
+      this.getDialogList();
+    },
+    onJfbShow(options) {
+      this.isShow=false
+      this.onJfbLoad(options);
+    },
+    handleToList() {
+      this.$xdUniHelper.navigateTo({
+        url: `${this.list_url}?activity_id=${this.activity_id}&distribution_method=homed`,
+      });
+    },
+    handleClose() {
+      //切换下一张，没有下一张，关闭
+      if (this.currentIndex == this.list.length - 1 || this.type == 2) {
+        this.isShow = false;
+        return;
+      }
+      this.currentIndex = this.currentIndex + 1;
+      this.currentImage = getServiceUrl(
+        this.list[this.currentIndex].app_activity_url
+      );
+      this.currentBtnImage = getServiceUrl(
+        this.list[this.currentIndex].app_activity_button
+      );
+      this.activity_id = this.list[this.currentIndex].activity_id;
+    },
+    handleChange(type) {
+      this.currentIndex =
+        type === "left" ? this.currentIndex - 1 : this.currentIndex + 1;
+      //不小于0，不大于数组长度
+      this.currentIndex = Math.max(
+        0,
+        Math.min(this.currentIndex, this.list.length - 1)
+      );
+      this.currentImage = getServiceUrl(
+        this.list[this.currentIndex].app_activity_url
+      );
+      this.currentBtnImage = getServiceUrl(
+        this.list[this.currentIndex].app_activity_button
+      );
+      this.activity_id = this.list[this.currentIndex].activity_id;
+    },
+  },
+};
+</script>
+
+<style scoped lang="less">
+@import "./JfbBaseConDialogLess.less";
+
+.jfb-base-con-dialog {
+  &__body {
+     &-pop {
+      min-height: 100rpx;
+      text-align: center;
+      vertical-align: middle;
+      color: #666;
+      font-size: unit(24, rpx);
+      line-height: 100rpx;
+    }
+    &-dialog {
+      position: fixed;
+      top: 0;
+      bottom: 0;
+      left: 0;
+      right: 0;
+      z-index: 3000;
+
+      &-mask {
+        position: absolute;
+        top: 0;
+        bottom: 0;
+        left: 0;
+        right: 0;
+        background: rgba(0, 0, 0, 0.5);
+      }
+
+      &-content {
+        max-height: unit(1000, rpx);
+        overflow-y: auto;
+        overflow-x: hidden;
+        position: absolute;
+        top: 50%;
+        left: 50%;
+        transform: translate(-50%, -50%);
+        display: flex;
+        flex-direction: column;
+        &-num {
+          margin: 0 auto;
+          background: rgba(255, 255, 255, 0.5);
+          border-radius: unit(40, rpx);
+          padding: unit(8, rpx) unit(24, rpx);
+          color: #fff;
+          font-size: unit(40, rpx);
+        }
+        &-close {
+          margin: 0 auto;
+        }
+        &-left {
+          background: rgba(255, 255, 255, 0.1);
+          padding: unit(40, rpx) unit(10, rpx);
+          color: #fff;
+          border-radius: unit(40, rpx);
+        }
+        &-right {
+          background: rgba(255, 255, 255, 0.1);
+          padding: unit(40, rpx) unit(10, rpx);
+          color: #fff;
+          border-radius: unit(40, rpx);
+        }
+        &-image {
+          min-width: unit(600, rpx);
+          min-height: unit(800, rpx);
+          height: unit(800, rpx);
+          display: flex;
+          align-items: center;
+          flex-direction: column;
+          margin: 20rpx;
+          position: relative;
+
+          & > image:first-child {
+            width: 100%;
+            height: 100%;
+          }
+
+          & > image:nth-child(2) {
+            width: unit(448, rpx);
+            height: unit(70, rpx);
+            position: absolute;
+            bottom: unit(100, rpx);
+          }
+        }
+      }
+    }
+  }
+}
+</style>

package/src/components/JfbBaseConDialog/JfbBaseConDialogLess.less

@@ -0,0 +1,80 @@
+/**
+* @desc 获取绝对路径完整地址
+* @param @path
+**/
+//例如：https://image.jufubao.cn/20220501010108/image/bg/default_gonghui_bg.png
+@basePath: 'business/';
+@doMain: '//sandbox-img.jufubao.cn/';
+
+.getBusinessImageUrl(@path, @size: 'size8') {
+  @url: "@{doMain}@{basePath}@{path}?x-oss-process=style/@{size}";
+  background-image: url(@url);
+}
+
+//start
+.jfb-base-con-dialog {
+  border: 1px dashed rgba(0, 0, 0, 0);
+  box-sizing: border-box;
+  min-height: unit(50, rpx);
+
+  &__body{
+      position: relative;
+      overflow: hidden;
+      z-index: 2
+  }
+
+  &.editx {
+    position: relative;
+    border: 1px dashed blue;
+    box-sizing: border-box;
+    z-index: 3
+
+  }
+
+  &:hover {
+    border: 1px dashed blue;
+  }
+
+  &.noBorder {
+    border-color: rgba(0,0,0,0);
+    border-width: 0;
+  }
+
+
+  &__edit {
+    cursor: pointer;
+    position: absolute;
+    right: unit(0, rpx);
+    top: unit(-52, rpx);
+    height: unit(50, rpx);
+    line-height: unit(50, rpx);
+    display: flex;
+    justify-content: center;
+    align-items: center;
+    background: rgba(0, 0, 0, .6);
+    border-radius: unit(10, rpx);
+    box-shadow: 0 0 10px rbga(0, 0, 0, 0.3);
+    color: #fff;
+    font-size: unit(22, rpx);
+
+    &-icon{
+      padding: 0 unit(20, rpx);
+    }
+
+    &.editx {
+      box-sizing: border-box;
+
+    }
+  }
+}
+//end
+
+
+/**notPreview**/
+.jfb-base-con-dialog {
+  &:before {
+    content: " ";
+    display: table;
+  }
+}
+/**endNotPreview**/

package/src/components/JfbBaseConDialog/JfbBaseConDialogMixin.js

@@ -0,0 +1,30 @@
+'use strict';
+
+
+//@AttrImport
+import Attr from "./Attr";
+//@EndAttrImport
+
+
+export default {
+  data() {
+    return {
+      //#ifdef H5
+      
+      //@AttrData
+      Attr:{}, //对外开发编辑属性
+      //@EndAttrData
+      
+      // #endif
+      cssRoot: 'jfb-base-con-dialog'
+    }
+  },
+  created() {
+    
+    //@AttrDataCreated
+    this.Attr = this.$xdUniHelper.customClone(Attr);
+    //@EndAttrDataCreated
+    
+
+  },
+}

package/src/components/JfbBaseConDialog/Mock.js

@@ -0,0 +1,30 @@
+'use strict';
+
+module.exports = {
+  getCouponDialogList: {
+    "list": [
+      {
+        "app_key": "sms-coupon",
+        "app_activity_url": "//sandbox-img.jufubao.cn/uploads/20231123/b68d9ff61ffe6cada499d8ad809aaa8d.jpg",
+        "app_activity_button": "//sandbox-img.jufubao.cn/uploads/20231123/d9730115b5e1e8047b2b36e69655e745.jpg",
+        "background": "background1.png",
+        "activity_id": 35,
+      },
+      {
+        "app_key": "sms-coupon",
+        "app_activity_url": "//sandbox-img.jufubao.cn/uploads/20231123/b68d9ff61ffe6cada499d8ad809aaa8d.jpg",
+        "app_activity_button": "//sandbox-img.jufubao.cn/uploads/20231123/d9730115b5e1e8047b2b36e69655e745.jpg",
+        "background": "background1.png",
+        "activity_id": 35,
+      },
+      {
+        "app_key": "sms-coupon",
+        "app_activity_url": "//sandbox-img.jufubao.cn/uploads/20231123/b68d9ff61ffe6cada499d8ad809aaa8d.jpg",
+        "app_activity_button": "//sandbox-img.jufubao.cn/uploads/20231123/d9730115b5e1e8047b2b36e69655e745.jpg",
+        "background": "background1.png",
+        "activity_id": 35,
+      }
+    ],
+    "request_id": "4b9803ed0ecdc0f6"
+  }
+}

package/src/components/JfbBaseConList/Api.js

@@ -0,0 +1,58 @@
+'use strict';
+
+/**
+ * @description 卡券登陆
+ * @type {*[]}
+ */
+module.exports = [
+  {
+    mapFnName: 'getListBaseNewsContentCoupon', //自定义方法名字（必选）
+    title: '获取内容',
+    path: '/cms/v1/news-content',
+    isRule: false,
+    params: {
+      scene: ['使用场景', 'String', '选填'],
+      container_id: ['插件ID', 'String', '必填'],
+      page_id: ['页面ID', 'String', '必填'],
+      page_size: ['记录条数', 'Number', '必填', 1],
+      code: ['业务线id', 'String', '选填'],
+    },
+    isConsole: true,
+    disabled: true,
+  },
+  {
+    mapFnName: 'getCouponList', //自定义方法名字（必选）
+    title: '获取优惠券列表',
+    path: '/sms-coupon/v1/activity-prizes-user/list',
+    isRule: false,
+    params: {
+      distribution_method: ['发放方式 entry=主动发放, homed=首页发放,paid=消费后发放,card_binded=绑定卡后发放', 'String', '选填'],
+      namespace: ['业务线', 'String', '必填'],
+    },
+    isConsole: true,
+    disabled: true,
+  },
+  {
+    mapFnName: 'getAllCoupon', //自定义方法名字（必选）
+    title: '领取优惠券',
+    path: '/sms-coupon/v1/activity-prizes-user/set',
+    isRule: false,
+    params: {
+      distribution_method: ['发放方式 entry=主动发放, homed=首页发放,paid=消费后发放,card_binded=绑定卡后发放', 'String', '选填'],
+      namespace: ['业务线', 'String', '必填'],
+    },
+    isConsole: true,
+    disabled: true,
+  },
+  {
+    mapFnName: 'getCouponResult', //自定义方法名字（必选）
+    title: '轮询查询活动结果',
+    path: '/sms-coupon/v1/activity-prizes-user/get',
+    isRule: false,
+    params: {
+      tmp_order_number: ['tmp_order_number', 'String', '选填'],
+    },
+    isConsole: true,
+    disabled: true,
+  },
+];