jufubao-third 1.0.0-beta1

package/src/mixins/pageUitls.js

@@ -0,0 +1,500 @@
+'use strict';
+
+import { mapState, mapActions} from 'vuex';
+import {JfbEvent} from "@/utils/xd.event";
+
+import {
+  AttrToTargetValues,
+  getContainerPropsValue,
+  baseCloneDeep,
+} from "@/utils/xd.base";
+import getServiceUrl from "@/common/getServiceUrl";
+
+export default {
+  computed: {
+    ...mapState(['siteInfo', 'jfbAuthorize', 'webThemes', 'xnamespace']),
+  },
+  watch: {
+    webThemes: {
+      immediate: true,
+      handler(value) {
+        if (value) this.themesList = value
+      },
+    }
+  },
+  data(){
+    return {
+      themesList: {}, //保存所有业务组件使用风格列表
+      titleDefaultCount: 0, //设置标题时候计数器，最大查找uni-page-head__title样式名称次数
+    }
+  },
+  methods: {
+    ...mapActions(['loginCardMock']),
+    getMockCard(){
+      let pagae = this.$xdUniHelper.parseURL();
+      let card = pagae.params['x-test'];
+      if (card) {
+        let reg = /^(card_)[a-zA-Z0-9\-_]{8,}$/;
+        if (reg.test(card)) {
+          return card.split('_')[1];
+        }
+      }
+      return ''
+    },
+    checkMockCard(){
+      // #ifdef H5
+      let pagae = this.$xdUniHelper.parseURL();
+      let userLogin = `/${this.projectAttr.deploy_dir}${this.$configProject.login_entry}`;
+      let cardLogin = `/${this.projectAttr.deploy_dir}${this.$configProject.card_entry}`;
+
+      //登陆页面和卡登陆页面不启用
+      if(pagae.path === userLogin || pagae.path === cardLogin) {
+        return false
+      }
+
+      let card = pagae.params['x-test'];
+      if(card) {
+        let reg = /^(card_)[a-zA-Z0-9\-_]+$/;
+        if(reg.test(card)) return true
+      }
+      // #endif
+      return false;
+    },
+
+    init(){
+      this.settings = this.$settings;
+      this.site_id = this.brandInfo.site_id;
+      this.projectAttr = this.brandInfo;
+
+      //第一次上班日志
+      this.$xdLog.setProject('pages.init', {
+        projectAttr: this.brandInfo,
+        site_id: this.site_id
+      });
+
+      //预览模式设置页面ID
+      if (this.$configProject.isPreview === true) {
+        let {page_id} = this.$xdUniHelper.parseURL().params;
+        if (!page_id) throw new Error('请设置页面ID');
+        this.pageAttr['page_id'] = page_id;
+      }
+
+      //获取用户信息
+      this.getPageAttr(this.page_id)
+        .then(async (res) => {
+
+          //设置页面信息
+          this.pageAttr = {...this.pageAttr, ...this.parsePageConfig(res)};
+          if (this.pageAttr['config']) this.pageAttr['configs'] = this.pageAttr['config'];
+
+          //预览模式设置topBar属性
+          if (this.$configProject.isPreview) {
+            this.setPreviewSetPageConfig(this.pageAttr.is_bar_custom === 'custom');
+          } else this.setPageConfig(this.pageAttr);
+
+          //计算页面插件信息
+          this.containers = this.getContainerGroup(res['containers']);
+
+          //保存页面headers变量
+          if (res['headers']) this.setPagesHeader(res['headers']);
+          else this.setPagesHeader(null);
+
+          //保存页面权限
+          if (res['permission']) this.setPagesPermission(res['permission']);
+          else this.setPagesPermission({can_card: false, can_sign: false});
+          this.loadStatus = true;
+
+          //检查用户是否登录
+          if (!await this.checkLoginAndCardLogin(res.permission['can_sign'])) {
+            return;
+          }
+
+          //登陆测试卡
+          if(this.checkMockCard()) {
+            if(this.getMockCard()){
+              if (!await this.loginCardMock({card_number: this.getMockCard()})) {
+                this.$xdAlert({
+                  content: '当前登陆的卡券或服务不可用，请重试！',
+                  width: '60vw',
+                  time: 3000
+                })
+                return
+              }
+            }
+            else{
+              this.$xdAlert({
+                content: '请输入正确券号，请重试！',
+                width: '60vw',
+                time: 3000
+              })
+              return
+            }
+          }
+
+          //正常卡登陆
+          else{
+            //检查用户卡是否登录
+            if (!await this.checkLoginAndCardLogin(res.permission['can_card'], 'card')) {
+              return;
+            }
+          }
+
+
+
+          //用户状态已经检查完成
+          this.isCheckAuth = true;
+
+
+          //设置标题
+
+          // #ifdef MP-WEIXIN
+          uni.setNavigationBarTitle({
+            title: '首页'
+          });
+
+          // #endif
+
+          // #ifdef H5
+          if (this.$configProject.type === 'food') {
+            let xd = getApp().globalData.$xd;
+            if (xd && xd.brandInfo && xd.brandInfo.name) {
+              document.title = xd.brandInfo.name;
+              this.setH5Title('首页');
+            }
+          } else {
+            if (this.projectAttr['site_name'] || this.projectAttr['seo_title']) {
+              document.title = this.projectAttr['seo_title'] || this.projectAttr['site_name'];
+            }
+            this.setH5Title('首页');
+          }
+
+          // #endif
+
+          //执行onload事件
+          if (this.isOnLoad) {
+            console.log('exec.created', new Date().getTime() - this.time, 'ms');
+            new JfbEvent('onJfbLoad', {
+              vm: this,
+              data: this.options,
+            });
+          }
+        })
+        .catch();
+
+      // #ifdef H5
+      if (this.$configProject.viewType === 'preview') {
+        XdBus.addEvent('onDelPackage', (data) => {
+          this.deleteComponent(data);
+        });
+
+        //注册事件
+        this.regAddComponent();
+        this.editComponent();
+        this.regMoveComponent()
+      }
+      // #endif
+    },
+
+    /**
+     * @description 检查页面强制卡登陆(废弃)
+     * @param can_card
+     */
+    checkNameSpace(can_card) {
+      return true;
+      if (!can_card) {
+        console.warn('not-card-login:非强制卡登陆')
+        return new Promise((resolve)=>{
+          resolve(true)
+        });
+      }
+
+      let maxNTime = 30;
+      let timer = null;
+      let nTime = 0;
+      return new Promise((resolve)=>{
+        console.warn('card-login:强制卡登陆');
+        timer = setInterval(async ()=>{
+          if(nTime > maxNTime){
+            console.warn(`card-login-to-max-time:${nTime}`)
+            clearInterval(timer);
+          }
+          else{
+            if (this.xnamespace) {
+              console.warn(`card-login-get-to-namespace:${this.xnamespace}`)
+              let status = await this.jfbAuthorize.checkLoginCardSupportBizCode(can_card, this);
+              resolve(status);
+              clearInterval(timer)
+            }
+            else nTime++;
+          }
+        }, 50)
+      });
+
+    },
+
+    /**
+     * @description 获取页面信息
+     * @returns {{pageAttr: *, projectAttr: *, pagePackConfig: *}}
+     */
+    getPageAllInfo(){
+      return {
+        pageAttr: this.pageAttr,
+        projectAttr: this.projectAttr,
+        pagePackConfig: this.pagePackConfig
+      }
+    },
+
+    /**
+     * @description 预览模式设置页面属性
+     * @param type {Object} 导航模式 （false|true）false=>系统 true => 自定义
+     */
+    setPreviewSetPageConfig(type) {
+      console.log('navigationStyle', this.$configProject.extras)
+
+      if (type) {
+        this.pageAttr['showBar'] = this.pageAttr['is_bar'] || false;
+        this.pageAttr['backgroundImage'] = this.pageAttr.configs['background_image'] || 'none';
+        this.pageAttr['showBack'] = this.pageAttr['is_back'] || false;
+        this.pageAttr['isUseBgImage'] = !(this.pageAttr['is_use_bar_show_bg'] || false);
+      } else {
+        this.pageAttr['showBar'] = true;
+        this.pageAttr['backgroundImage'] = this.pageAttr.configs['background_image'] || 'none';
+        this.pageAttr.isUseBgImage = false;
+        this.pageAttr.showBack = false;
+      }
+      this.pageAttr['navigationStyleIsCustom'] = type;
+
+      //导航颜色
+      if(!type) this.pageAttr['barColor'] = this.pageAttr['is_bar_default_tc'] || this.$configProject.extras['top_bar_text_color'] || 'black';
+      else this.pageAttr['barColor'] = this.pageAttr['is_bar_custom_tc'] || this.$configProject.extras['top_bar_text_color'] || 'black';
+      this.pageAttr['background'] = this.pageAttr.configs['background_color'] || this.$configProject.extras.bgc || 'none';
+      this.pageAttr['barBgColor'] = '';
+
+
+      //h5使用渐变色
+      let templateBgcGradient = '';
+      let pageBgcGradient = '';
+
+
+      //#ifdef H5
+      if(type) {
+        if (this.$configProject.extras['bgc_gradient']) {
+          templateBgcGradient = this.$configProject.extras['bgc_gradient']
+        }
+        if (this.pageAttr['is_bar_bgc_gradient']) {
+          pageBgcGradient = this.pageAttr['is_bar_bgc_gradient']
+        }
+      }
+      //#endif
+
+      this.pageAttr['barBackground'] = templateBgcGradient || pageBgcGradient ||
+        this.pageAttr.is_bar_bgc || this.$configProject.extras.top_bar_color
+        || '#f8f8f8';
+
+    },
+
+    /**
+     * @description 解析页面configs数据
+     * @param res {Object} 页面数据
+     */
+    parsePageConfig(res) {
+      if (res.configs.background_image) res.configs.background_image = getServiceUrl(res.configs.background_image);
+      if (res.configs.parameters &&
+        this.$xdUniHelper.checkVarType(res.configs.parameters) === 'array'
+      ) {
+        res.configs.parameters = AttrToTargetValues(res.configs['parameters']);
+        res.configs.parameters.map(item => {
+          res[item['key']] = item.value
+        })
+      } else res.configs.parameters = {};
+      return res;
+    },
+
+    /**
+     * @description 设置标题
+     */
+
+    setH5Title(title) {
+      if (this.titleDefaultCount > 20) return;
+      let titleElx = document.getElementsByClassName('uni-page-head__title').item(0);
+      if (titleElx) {
+        titleElx.innerHTML = title;
+      } else setTimeout(() => {
+        this.titleDefaultCount++;
+        this.setH5Title(title);
+      }, 50);
+    },
+
+    /**
+     * @description 获取站点信息
+     */
+    getSiteAttr() {
+      return this.siteInfo;
+    },
+
+    /**
+     * @description 检查是否登陆
+     * @param permission {Boolean} 是否检查登陆
+     * @param type {String} 检查类型 login=用户登陆 card=>正常用户卡登陆 card_mock=>自动卡登陆
+     * @param isAutoJump {Boolean} 是否启动自动跳转到登陆或者卡登陆页面
+     */
+    checkLoginAndCardLogin(permission, type = 'login', isAutoJump = true) {
+      return new Promise((resolve) => {
+
+        //检查用户是否已经登录
+        if (type === 'login') {
+          if (permission) {
+
+            //status=true 免登或者已登陆 status=false 未登陆
+            this.jfbAuthorize.checkUserLogin(permission, this, isAutoJump)
+              .then(status => {
+                resolve(status)
+              })
+              .catch(status => {
+                console.error(status)
+                resolve(false)
+              });
+          }
+
+          //用户免登陆
+          else resolve(true)
+        }
+
+        //检查用户是否已经登录消费卡
+        if (type === 'card') {
+          if (permission) {
+
+            //已登陆卡
+            if (this.jfbAuthorize.checkCardLogin(permission, this, isAutoJump)) {
+              resolve(true)
+            }
+
+            //未登陆卡
+            else resolve(false)
+          }
+
+          //免登陆卡
+          else resolve(true)
+        }
+
+        //自动卡登陆
+        if (type === 'card_mock') {
+          if (this.jfbAuthorize.checkCardLogin(permission, this, false)) {
+            resolve(true)
+          }
+
+          //未登陆卡
+          else resolve(false)
+        }
+
+      })
+    },
+
+
+    /**
+     * @description 获取业务插件风格配置
+     * @param appid {String} 业务插件所在插件应用id
+     */
+    getStyles(appid) {
+      function getGradient(data){
+        try{
+          let {list,deg} = JSON.parse(data);
+          if (list.length === 0) return '';
+          if (list.length === 1) return list[0].color;
+          let color = list.map(item => {
+            return `${item.color} ${item.percentage}%`;
+          });
+          return `linear-gradient(${deg}deg,${color.join(',')})`;
+        }
+        catch (e) {
+          return ''
+        }
+      }
+
+      let theme = {};
+      (this.themesList[appid] || this.$webSetting.defaultTheme).map(item => {
+        if(item['key'] === '$mainGradient' || item['key'] === '$subGradient' ) {
+          theme[item['key']] = getGradient(item.value)
+        }else{
+          theme[item['key']] = item.value;
+        }
+      });
+
+      //设置默认值
+      if (!theme['$mainGradient']) theme['$mainGradient'] = theme['$mainColor'];
+      if (!theme['$subGradient']) theme['$subGradient'] = theme['$subMainColor'] || theme['$mainColor'];
+
+      return theme;
+    },
+
+    /**
+     * @description
+     * @param page {Object} 页面对象
+     */
+    setPageConfig(page = {}) {
+      const handle = (data, key) => {
+        if (this.$xdUniHelper.isEmpty(data)) return null;
+        let temp = {};
+        data.map(item => {
+          temp[item['key']] = item['value'];
+        });
+
+        if (temp[key] !== undefined) return temp[key];
+        else return null;
+      };
+
+      let pageTemp = {};
+      const configs = page['configs'];
+      let parameters = {};
+      if (configs['parameters']) parameters = configs['parameters'];
+
+      //页面名称
+      if (page['title']) pageTemp['title'] = page['title'];
+
+      //是否显示返回按钮
+      if (handle(parameters, "is_back") !== null) pageTemp['showBack'] = handle(parameters, "is_back");
+
+      //背景是否仅仅顶部导航显示
+      if (handle(parameters, "is_use_bar_show_bg") !== null) pageTemp['isUseBgImage'] = !handle(parameters, "is_use_bar_show_bg");
+
+      //是否显示顶部导航
+      if (handle(parameters, "is_bar") !== null) pageTemp['showBar'] = handle(parameters, "is_bar");
+
+      //背景图片
+      if (configs['background_image']) {
+        pageTemp['backgroundImage'] = getServiceUrl(configs['background_image']);
+      }
+
+      //背景颜色
+      if (configs['background_color']) pageTemp['background'] = configs['background_color'];
+
+      //非自定义模式直接隐藏自定义topBar
+      if (this.pagePackConfig.navigationStyle === 'default') {
+        pageTemp['showBar'] = false
+      }
+      this.pageAttr = Object.assign({}, this.$xdUniHelper.cloneDeep(this.pageAttr), page, pageTemp);
+
+      //设置自定义导航导航背景色
+      if(this.pageAttr['is_bar_custom'] === 'custom') {
+        let templateBgcGradient = '', pageBgcGradient='';
+
+        //#ifdef H5
+        if (this.$configProject.extras['bgc_gradient']) {
+          templateBgcGradient = this.$configProject.extras['bgc_gradient']
+        }
+        if (this.pageAttr['is_bar_bgc_gradient']) {
+          pageBgcGradient = this.pageAttr['is_bar_bgc_gradient']
+        }
+        //#endif
+        this.pageAttr['barBackground'] = templateBgcGradient || pageBgcGradient
+          ||  this.pageAttr.is_bar_bgc || this.$configProject.extras.top_bar_color
+          || '#f8f8f8';
+        this.pageAttr['barColor'] = this.pageAttr['is_bar_custom_tc'] || this.$configProject.extras['top_bar_text_color'] || 'black';
+      }
+      this.pageAttr['navigationStyleIsCustom'] = this.pageAttr['is_bar_custom'] === 'custom';
+    },
+
+  }
+}
+
+

package/src/mocks.js

@@ -0,0 +1,4 @@
+'use strict';
+
+export default {}
+