jufubao-base 1.0.165 → 1.0.167-beta2

package/src/components/JfbBaseSweep/JfbBaseSweep.vue

@@ -0,0 +1,359 @@
+<template>
+  <view
+    class="jfb-base-sweep"
+    @click="handleEditxSelect"
+    :class="{ editx: isEditx && active }"
+  >
+    <!--#ifdef H5-->
+    <view
+      class="jfb-base-sweep__edit"
+      :class="{ editx: isEditx && active }"
+      v-if="isEditx && active"
+    >
+      <view class="jfb-base-sweep__edit-icon" @click="delEdit">删除</view>
+    </view>
+    <!-- #endif -->
+    <view
+      :style="{ height: layoutInfo.bodyMinHeightRpx + 'rpx' }"
+      class="jfb-base-sweep__body"
+    >
+      <view
+        :style="{ background: backgroundColor, color: warningColor }"
+        class="jfb-base-sweep__body-pop"
+        v-if="isPreview"
+        >设置背景模式方便编辑(占位)，在线上此模块不显</view
+      >
+      <view class="jfb-base-sweep__body-other" v-if="other">
+        <view>
+          <xd-font-icon
+            color="red"
+            size="240"
+            icon="iconmingchengtubiao"
+          ></xd-font-icon>
+          <view class="jfb-base-sweep__body-other-text">无法识别该界面</view>
+        </view>
+        <view class="jfb-base-sweep__body-footer" :style="prod_bottom">
+          <XdButton @click="scan" type="primary" radius="50rpx" width="50%"
+            >重试</XdButton
+          >
+        </view>
+      </view>
+       <view class="jfb-base-sweep__body-other" v-if="show">
+        <view>
+          <image style="width: 500rpx;height:500rpx" src="https://img0.jufubao.cn/common/qrcode-dome.png?ver=1"></image>
+        </view>
+        <view class="jfb-base-sweep__body-footer" :style="prod_bottom">
+          <XdButton @click="scan" type="primary" radius="50rpx" width="50%"
+            >扫一扫</XdButton
+          >
+        </view>
+      </view>
+    </view>
+  </view>
+</template>
+
+<script>
+import XdFontIcon from "@/components/XdFontIcon/XdFontIcon";
+import XdButton from "@/components/XdButton/XdButton";
+import { jfbRootExec } from "@/utils/xd.event";
+import JfbBaseSweepMixin from "./JfbBaseSweepMixin";
+import { getContainerPropsValue } from "@/utils/xd.base";
+import componentsMixins from "@/mixins/componentsMixins";
+import extsMixins from "@/mixins/extsMixins";
+import { mapState } from "vuex";
+import { parseNetworkURL } from "@/utils/linkUrl";
+const Color = require("color");
+
+export default {
+  name: "JfbBaseSweep",
+  components: {
+    XdFontIcon,
+    XdButton,
+  },
+  mixins: [componentsMixins, extsMixins, JfbBaseSweepMixin],
+  data() {
+    return {
+      isPreview: false,
+      backgroundColor: "",
+      other: false,
+      show: false,
+      flag: true
+    };
+  },
+  computed: {
+    ...mapState({
+      jwxSDK: (state) => state.jwxSDK,
+    }),
+    prod_bottom() {
+      return this.fixedStyle({ height: 0, zIndex: 111 });
+    },
+  },
+  watch: {
+    container(value) {
+      this.init(value);
+    },
+  },
+  async created() {
+    this.backgroundColor = Color(this.warningColor).alpha(0.2).toString();
+    this.isPreview = this.$configProject["isPreview"];
+    this.init(this.container);
+    //#ifdef H5
+    if (!this.$configProject.isPreview) {
+      await jfbRootExec("getH5WxAuthorize", {
+        vm: this,
+        data: {site_id: "wx_pub"},
+      })
+        .then(res => {
+          console.log(0)
+          this.$xdHideLoading();
+          this.scan();
+        })
+        .catch(error=>{
+          this.$xdAlert({
+            content: error,
+          });
+        })
+    }
+    // #endif
+  },
+  methods: {
+    onJfbLoad(options) {
+      if (!this.isPreview) {
+        this.$xdShowLoading({
+          isMask: true
+        });
+        //#ifdef MP-WEIXIN
+        this.$xdHideLoading();
+        this.scan();
+        //#endif
+      }
+    },
+    extractDomain(hostname) {
+      // 匹配并提取顶级域名后的两个标签（例如：.com、.co.uk）
+      const matches = hostname.match(/[^.]+\.[^.]+$/);
+      return matches ? matches[0] : hostname;
+    },
+    handleH5() {
+      // 判断jwxSDK是否为空
+      if (this.jwxSDK !== null) {
+        // 调用jwxSDK的scanQRCode方法，扫描二维码
+        this.jwxSDK.scanQRCode({
+          // 需要返回结果
+          needResult: 1,
+          // 扫描类型为二维码
+          scanType: ["qrCode"],
+          // 扫描成功后的回调函数
+          success: (res) => {
+            // 定义一个变量params，将url按照"?"进行分割，获取到参数部分
+            let params = res.resultStr.split("?")[1]
+              ? res.resultStr.split("?")[1]
+              : "";
+            // 将参数部分按照"&"进行分割，获取到每个参数
+            const queryArr = params.split("&");
+            // 定义一个空对象queryobjArr，用于存储参数
+            let queryobjArr = {};
+            // 遍历参数数组，将参数名和参数值存储到queryobjArr中
+            queryArr.forEach((item, index) => {
+              const Strindex = item.indexOf("=");
+              queryobjArr[item.slice(0, Strindex)] = item.slice(Strindex + 1);
+            });
+            // 判断queryobjArr中是否存在"x-params"参数
+            if (queryobjArr["x-params"]) {
+              // 如果存在，则将参数拼接到url中，并跳转到该url
+              let path = `${this.change_url}?x-params=${queryobjArr["x-params"]}&refrom=official`;
+              this.$xdUniHelper.navigateTo({
+                url: path,
+              });
+              return;
+            }
+            if (queryobjArr["pa"]) {
+              // 如果queryobjArr中有pa属性，则获取pa属性的值，并将其拼接到bind_url后面，然后使用navigateTo方法跳转到该路径
+              let qrcode = encodeURIComponent(res.resultStr)
+              let path = `${this.bind_url}?qrcode=${qrcode}`;
+              console.log(path,'pathpath');
+              this.$xdUniHelper.navigateTo({
+                url: path,
+              });
+              return;
+            }
+            // 如果res.resultStr是以http或https开头的字符串，则进行以下操作
+            if (/^https?:/.test(res.resultStr)) {
+              // 获取res.resultStr中的host属性
+              let host = this.$xdUniHelper.parseURL(res.resultStr).host;
+              // 获取当前页面的域名
+              let domain = document.domain;
+              // 如果host属性以当前页面的域名结尾，则进行以下操作
+              if (host.substr(-domain.length) === domain) {
+                // 获取res.resultStr的值
+                let path = res.resultStr;
+                // 使用navigateTo方法跳转到该路径
+                this.$xdUniHelper.navigateTo({
+                  url: path,
+                });
+                return;
+              }
+            }
+            console.log(55555);
+            this.other = true;
+            this.show = false;
+            this.flag = false;
+          },
+          // 扫描失败后的回调函数
+          fail: (error) => {
+            console.log(44444,'fail');
+            this.other = false;
+            this.show = true;
+            // 如果error是字符串类型，则将其转换为对象类型
+            if (typeof error === "string") error = { error: error };
+            // 如果window["jwxJfbSDKParams"]存在，则将error对象与window["jwxJfbSDKParams"]合并
+            if (window["jwxJfbSDKParams"])
+              error = Object.assign(error, window["jwxJfbSDKParams"]);
+            // 调用$xdLog的setARMSError方法，记录错误信息
+            this.$xdLog.setARMSError(error);
+          },
+          cancel: ()=>{
+            console.log(44444,'fail');
+            this.other = false;
+            this.show = true;
+          }
+        });
+      }
+    },
+    handleMP() {
+      // 调用uni.scanCode方法，扫描二维码
+      uni.scanCode({
+        scanType: ["qrCode"],
+        success: (res) => {
+          // 定义一个变量params，将url按照"?"进行分割，获取到参数部分
+          let params = res.result.split("?")[1] ? res.result.split("?")[1] : "";
+          // 将参数部分按照"&"进行分割，获取到每个参数
+          const queryArr = params.split("&");
+          // 定义一个空对象queryobjArr，用于存储参数
+          let queryobjArr = {};
+          // 遍历参数数组，将参数名和参数值存储到queryobjArr中
+          queryArr.forEach((item, index) => {
+            const Strindex = item.indexOf("=");
+            queryobjArr[item.slice(0, Strindex)] = item.slice(Strindex + 1);
+          });
+          // 判断queryobjArr中是否存在"x-params"参数
+          if (queryobjArr["x-params"]) {
+            // 如果存在，则将参数拼接到url中，并跳转到该url
+            let path = `${this.change_url}?x-params=${queryobjArr["x-params"]}&refrom=official`;
+            this.$xdUniHelper.navigateTo({
+              url: path,
+            });
+            return;
+          }
+          if (queryobjArr["pa"]) {
+            // 如果queryobjArr中有pa属性，则获取pa属性的值，并将其拼接到bind_url后面，然后使用navigateTo方法跳转到该路径
+            let qrcode = encodeURIComponent(res.result)
+            let path = `${this.bind_url}?qrcode=${qrcode}`;
+            this.$xdUniHelper.navigateTo({
+              url: path,
+            });
+            return;
+          }
+          // 如果res.result是以http或https开头的字符串，则进行以下操作
+          if (/^https?:/.test(res.result)) {
+            // 获取res.result中的host属性
+            let host = parseNetworkURL(res.result).host;
+            // 获取当前页面的域名
+            console.log(host, 2222);
+            let domain = this.extractDomain(this.projectAttr.host);
+            console.log(this.extractDomain(this.projectAttr.host), 333);
+            // 如果host属性以当前页面的域名结尾，则进行以下操作
+            if (host.substr(-domain.length) === domain) {
+              // 获取res.resultStr的值
+              let path = res.result;
+              // 使用navigateTo方法跳转到该路径
+              this.$xdUniHelper.navigateTo({
+                url: path,
+              });
+              return;
+            }
+          }
+          this.other = true;
+          this.show = false;
+          this.flag = false;
+        },
+        fail: (error) => {
+          // 如果扫描失败，则调用$xdLog.setARMSError方法记录错误信息
+          this.other = false;
+          this.show = true;
+          this.$xdLog.setARMSError(error);
+        }
+      });
+    },
+    scan() {
+      try {
+        //#ifdef H5
+        this.handleH5();
+        //#endif
+        //#ifdef MP-WEIXIN
+        this.handleMP();
+        //#endif
+      } catch (err) {
+        this.$xdLog.setARMSError(err);
+      }
+    },
+    /**
+     * @description 监听事件变化
+     * @param container {object} 业务组件对象自己
+     */
+    init(container) {
+      this.change_url = getContainerPropsValue(
+        container,
+        "content.change_url",
+        { value: "" }
+      ).value;
+      this.bind_url = getContainerPropsValue(container, "content.bind_url", {
+        value: "",
+      }).value;
+    },
+    onJfbShow(options) {
+      if(this.flag) {
+        this.other = false;
+        this.show = true;
+      }
+      console.log("event.onJfbShow", options);
+    },
+  },
+};
+</script>
+
+<style scoped lang="less">
+@import "./JfbBaseSweepLess.less";
+
+.jfb-base-sweep {
+  &__body {
+    min-height: 100rpx;
+    &-other {
+      display: flex;
+      justify-content: space-between;
+      padding-top: 300rpx;
+      align-items: center;
+      flex-direction: column;
+      &-text {
+        margin-top: 40rpx;
+        color: #666;
+        font-size: unit(24, rpx);
+        text-align: center;
+      }
+    }
+    &-pop {
+      min-height: 100rpx;
+      text-align: center;
+      vertical-align: middle;
+      color: #666;
+      font-size: unit(24, rpx);
+      line-height: 100rpx;
+    }
+    &-footer {
+      position: fixed;
+      left: 0;
+      right: 0;
+      height: unit(200, rpx);
+    }
+  }
+}
+</style>

package/src/components/JfbBaseSweep/JfbBaseSweepLess.less

@@ -0,0 +1,79 @@
+/**
+* @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-sweep {
+  box-sizing: border-box;
+
+  &__body{
+      position: relative;
+      overflow: hidden;
+      z-index: 2
+  }
+
+  &.editx,&.editx:hover {
+    position: relative;
+    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;
+    }
+
+  }
+
+
+  &__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-sweep {
+  //&:before {
+    //content: " ";
+    //display: table;
+  //}
+}
+/**endNotPreview**/

package/src/components/JfbBaseSweep/JfbBaseSweepMixin.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-sweep'
+    }
+  },
+  created() {
+    
+    //@AttrDataCreated
+    this.Attr = this.$xdUniHelper.customClone(Attr);
+    //@EndAttrDataCreated
+    
+
+  },
+}

package/src/components/JfbBaseSweep/Mock.js

@@ -0,0 +1,3 @@
+'use strict';
+
+module.exports = {}

package/src/components/JfbBaseTfkCardBind/Api.js

@@ -0,0 +1,58 @@
+'use strict';
+/**
+ * @description  接口配置，
+ * 在设置方法名字当时候，别忘记加上【模块名字】：Tfk
+ * @type {*[]}
+ */
+module.exports = [
+  {
+    //设置方法名字当别忘记加上【模块名字】：Tfk
+    mapFnName: 'getTfkByIdFilmSquate',
+    title: '获取电影广场列表',
+    path: '/api/account/film/list-film-square',
+    isRule: false,
+    params: {
+      last_key: ['当前页', 'Number', '必选'],
+      page_size: ['每页数量', 'Number', '必选'],
+    },
+    isConsole: true,
+    disabled: true,
+  },
+  {
+    //设置方法名字当别忘记加上【模块名字】：Tfk
+    mapFnName: 'updateTfkFilmPaiqiDate',
+    title: '更新排期',
+    path: '/api/account/film/paiqi-date',
+    isRule: false,
+    params: {
+      film_id: ['电影id', 'Number', '必选'],
+      cinema_id: ['影院id', 'Number', '必选'],
+    },
+    isConsole: true,
+    disabled: true,
+  },
+  {
+    //设置方法名字当别忘记加上【模块名字】：Tfk
+    mapFnName: 'removeTfkFilmAddress',
+    title: '删除我的配送地址',
+    path: '/api/account/film/paiqi-date',
+    isRule: false,
+    params: {
+      film_id: ['电影id', 'Number', '必选'],
+    },
+    isConsole: true,
+    disabled: true,
+  },
+  {
+    //设置方法名字当别忘记加上【模块名字】：Tfk
+    mapFnName: 'addTfkFilmcart',
+    title: '添加购物车',
+    path: '/api/account/film/paiqi-date',
+    isRule: false,
+    params: {
+      film_id: ['电影id', 'Number', '必选'],
+    },
+    isConsole: true,
+    disabled: true,
+  },
+];

package/src/components/JfbBaseTfkCardBind/Attr.js

@@ -0,0 +1,58 @@
+'use strict';
+
+/**
+ * @description 当表单组件中有联动操作时候，使用方法进行返回
+ */
+export default {
+  style: [],
+  content: (data) => {
+    return [
+      {
+        label: '背景颜色:',
+        ele: 'xd-color',
+        valueKey: 'bgcolor',
+        value: data.bgcolor || '',
+        placeholder: '请输入占位框背景颜色',
+        classNmae: 'input80',
+        rules: [
+          {
+            required: true,
+            message: '请输入占位框背景颜色',
+            trigger: 'blur'
+          },
+        ]
+      },
+      {
+        label: '选中路径:',
+        ele: 'xd-select-pages-path',
+        valueKey: 'select-pages-path',
+        value: data['select-pages-path'] || null,
+        setting: {
+          router: XdBus.getParentApi('getPagesTree')
+        },
+      },
+      data.bgcolor && {
+        label: '高度:',
+        ele: 'el-input',
+        type: 'number',
+        valueKey: 'height',
+        value: data.height || 100,
+        placeholder: '请输入占位框高度，单位像素，默认：10px',
+        className: 'input80',
+        rules: [
+          {
+            required: true,
+            message: '请输入占位框高度',
+            trigger: 'blur'
+          },
+        ]
+      },
+      {
+        label: '', //label
+        ele: 'slot', //package 名称
+        slot: 'is_reference',
+      },
+    ].filter(i=>i)
+  },
+  advanced: [],
+};

package/src/components/JfbBaseTfkCardBind/JfbBaseTfkCardBind.vue

@@ -0,0 +1,111 @@
+<template>
+  <view
+    class="jfb-base-tfk-card-bind"
+    @click="handleEditxSelect"
+    :class="{ editx : isEditx && active }"
+  >
+    <!--#ifdef H5-->
+    <view
+      class="jfb-base-tfk-card-bind__edit"
+      :class="{ editx : isEditx && active }"
+      v-if="isEditx && active"
+    >
+      <view class="jfb-base-tfk-card-bind__edit-icon" @click="delEdit">删除</view>
+    </view>
+    <!-- #endif -->
+    <view class="jfb-base-tfk-card-bind__body">
+      <view>测试插件( {{containerId}} )</view>
+    </view>
+  </view>
+</template>
+
+<script>
+  import XdFontIcon from "@/components/XdFontIcon/XdFontIcon";
+  import { jfbRootExec } from "@/utils/xd.event";
+  import JfbBaseTfkCardBindMixin from "./JfbBaseTfkCardBindMixin";
+  import { getContainerPropsValue } from "@/utils/xd.base";
+  import componentsMixins from "@/mixins/componentsMixins";
+  import extsMixins from "@/mixins/extsMixins";
+  export default {
+    name: "JfbBaseTfkCardBind",
+    components: {
+      XdFontIcon
+    },
+    mixins: [
+      componentsMixins, extsMixins, JfbBaseTfkCardBindMixin
+    ],
+    data() {
+      return {
+
+        //todo
+      }
+    },
+    watch: {
+      container(value, oldValue) {
+        if (JSON.stringify(value) === JSON.stringify(oldValue)) return;
+        if (this.$configProject['isPreview']) this.init(value)
+      },
+    },
+    created() {
+      this.init(this.container);
+
+      //todo
+    },
+    methods: {
+      onJfbLoad(options) {
+
+        // jfbRootExec('baiduUserLogin', {
+
+        //   vm: this,//   data: {
+
+        //     account: 'gaoshiyong',//     password: '123456789',//     type: 3,//     ...options
+
+        //   }
+
+        // }).then().catch()
+      },
+      /**
+       * @description 监听事件变化
+       * @param container {object} 业务组件对象自己
+       */
+      init(container) {
+
+        //this.bgcolor = getContainerPropsValue(container, 'content.bgcolor', '#fff');
+
+        //this.height = getContainerPropsValue(container, 'content.height', 10);
+      },
+      onJfbScroll(options) {
+        console.log('event.onJfbScroll', options)
+      },
+      onJfbReachBottom(options) {
+        console.log('event.onJfbReachBottom', options)
+      },
+      onJfbShow(options) {
+        console.log('event.onJfbShow', options)
+      },
+      onJfbHide(options) {
+        console.log('event.onJfbHide', options)
+      },
+      onJfbBack(options) {
+        console.log('event.onJfbBack', options)
+      },
+      onJfbUpdate(...data) {
+        console.log('event.onJfbUpdate', data)
+      },
+      onJfbCustomEvent(options) {
+        console.log('event.onJfbReachBottom', options)
+      },
+    }
+  }
+
+</script>
+
+<style scoped lang="less">
+  @import "./JfbBaseTfkCardBindLess.less";
+
+  .jfb-base-tfk-card-bind {
+    &__body{
+
+    }
+  }
+</style>