@sinosun/lib/lib/BaseView/baseRouter.js

sinosun jsbridge and net toolkit

"use strict";
/*
 * @Description: 所有router页面基础类， 封装处理 back、refresh、setMenu等浏览器基本操作
 */

/*
    子类按需重写 @override 这些function：
    // 浏览器返回事件触发
    onBack()

    // 页面刷新事件处理
    onRefresh(refreshData)

    // 返回需要注册到浏览器上的菜单、按钮
    getMenuList()
 */

var _interopRequireDefault = require("@babel/runtime-corejs3/helpers/interopRequireDefault");

var _typeof2 = _interopRequireDefault(require("@babel/runtime-corejs3/helpers/typeof"));

require("core-js/modules/es.function.name.js");

require("core-js/modules/es.regexp.exec.js");

require("core-js/modules/es.string.replace.js");

var _defineProperty = _interopRequireDefault(require("@babel/runtime-corejs3/core-js-stable/object/define-property"));

var _assign = _interopRequireDefault(require("@babel/runtime-corejs3/core-js-stable/object/assign"));

var _stringify = _interopRequireDefault(require("@babel/runtime-corejs3/core-js-stable/json/stringify"));

var __importDefault = void 0 && (void 0).__importDefault || function (mod) {
  return mod && mod.__esModule ? mod : {
    "default": mod
  };
};

(0, _defineProperty["default"])(exports, "__esModule", {
  value: true
});

var EventType_1 = __importDefault(require("./EventType"));

var baseUtils_1 = require("./baseUtils");

var BaseRouter = {
  inject: ["getThemeConfig"],
  data: function data() {
    return {
      // 当前的url参数
      currentUrlParams: {}
    };
  },
  created: function created() {
    this.dealUrlParams();
    this.setTitleBar(); //监听浏览器事件处理

    this.observeBrowserOption();
  },
  // keep-alive 路由需要重新注册title和菜单
  activated: function activated() {
    // 缓存路由页面
    if ((this.$route.meta || {}).keepAlive) {
      // 重置 titleBar设置
      this.setComplete = false;
      this.dealUrlParams();
      this.setTitleBar();
      this.registerBrowserMenuList();
    }
  },
  methods: {
    // 获取路由参数
    dealUrlParams: function dealUrlParams() {
      this.currentUrlParams = baseUtils_1.getUrlParams() || {};
    },
    // 设置title定制
    setTitleBar: function setTitleBar() {
      var metaConfig = this.$route.meta || {};
      var title = metaConfig.title || "";

      if (title) {
        this.setTitle(title);
      }

      var titleBarConfig = metaConfig.titleBarConfig || {};

      if (titleBarConfig && typeof titleBarConfig.backgroundColor === 'function') {
        titleBarConfig.backgroundColor = titleBarConfig.backgroundColor();
      }

      titleBarConfig = (0, _assign["default"])({}, this.getThemeConfig(), titleBarConfig); // 设置是否有变化 需要判断已经变化之后的 不然页面scroll变化之后的值没有记录

      if ((0, _stringify["default"])(window.STORECURRENTTITLEBARCONFIG) === (0, _stringify["default"])(titleBarConfig)) {
        return;
      }

      window.TITLEBARCONFIG = titleBarConfig;
      window.STORECURRENTTITLEBARCONFIG = titleBarConfig;
      BrowserApi.setTitleBarTheme(titleBarConfig);
    },

    /**
     * 监听浏览器事件处理
     * TODO 如果子类不需要注册这些事件，或者不在create生命周期regist，可以重写该function, 按需regist
     * @abstract
     */
    observeBrowserOption: function observeBrowserOption() {
      this.observeBackEvent();
      this.observeRefreshPageEvent();
      this.observeAppPause();
      this.observeAppResume();
      this.observeSwitchCompany(); // 页面没有keep-alive

      if (!(this.$route.meta || {}).keepAlive) {
        this.registerBrowserMenuList();
      }
    },

    /**
     * 获取事件名称
     */
    getEventName: function getEventName(type) {
      var path = this.$route.path ? this.$route.path : "/";
      return this.$route.name + "_" + path + "_" + type;
    },
    // 回退预处理
    preBack: function preBack() {
      var flag = false;
      var forceExitPageName = this.currentUrlParams.forceExitPageName || "";
      var exitPage = this.isRouterPageBack(forceExitPageName);

      if (exitPage) {
        this.goBack();
        flag = true;
      }

      return flag;
    },

    /**
     * 监听浏览器返回事件
     */
    observeBackEvent: function observeBackEvent() {
      var _this = this;

      var name = this.getEventName(EventType_1["default"].NOTIFYAPPBACK); // 先移除监听

      this.$EventBus.$off(name); // 监听回退事件

      this.$EventBus.$on(name, baseUtils_1.scrollThrottle(function (data) {
        if (_this.preBack()) {
          return;
        }

        _this.onBack(data);
      }, 400));
    },

    /**
     * 监听页面刷新事件
     */
    observeRefreshPageEvent: function observeRefreshPageEvent() {
      var _this = this;

      var name = this.getEventName(EventType_1["default"].REFRESHPAGE); // 先移除监听

      this.$EventBus.$off(name); // 监听回退事件

      this.$EventBus.$on(name, baseUtils_1.scrollThrottle(function (data) {
        _this.onRefreshPrev();

        _this.onRefresh(data);
      }, 400));
    },

    /**
     * 注册app切到后台
     */
    observeAppPause: function observeAppPause() {
      var _this = this;

      var name = this.getEventName(EventType_1["default"].APPPAUSE); // 先移除监听

      this.$EventBus.$off(name); // 监听回退事件

      this.$EventBus.$on(name, function (data) {
        _this.onAppPause(data);
      });
    },

    /**
     * 注册app切到前台
     */
    observeAppResume: function observeAppResume() {
      var _this = this;

      var name = this.getEventName(EventType_1["default"].APPRESUME); // 先移除监听

      this.$EventBus.$off(name); // 监听回退事件

      this.$EventBus.$on(name, function (data) {
        _this.onAppResume(data);
      });
    },

    /**
    * @description:
    * @param {*}
    */
    observeSwitchCompany: function observeSwitchCompany() {
      var _this = this;

      var name = this.getEventName(EventType_1["default"].SWITCHCOMPANY); // 先移除监听

      this.$EventBus.$off(name); // 监听回退事件

      this.$EventBus.$on(name, function (data) {
        _this.onSwitchCompany(data);
      });
    },

    /**
     * 子页面回退逻辑处理，子类可以实现该方法
     * @abstract
     */
    onBack: function onBack() {
      this.routerBack();
    },

    /**
     * @description: 处理多页面进入非首页路由退出页面处理 并且页面内有路由跳转
     * @param {type}
     * @return boolean 是否执行回退
     */
    isRouterPageBack: function isRouterPageBack(exitPageName) {
      var exitRouterName = this.$route.name || (this.$route.path || "").replace("/", "");

      if (exitPageName === exitRouterName) {
        return true;
      }

      return false;
    },

    /**
     * @description: 处理多页面进入非首页路由退出页面处理 页面不可跳转别的页面
     * @param {type}
     */
    isPageBack: function isPageBack(exitPage) {
      if (exitPage && exitPage == 1) {
        return true;
      }

      return false;
    },

    /**
     * @param
     * url：目标页面的url, 为''时关闭当前页
     * backSteps：当前页面回退步数
     * loadData：传递给目标页面的数据
     */
    goBack: function goBack(url, backSteps, loadData) {
      if (url === void 0) {
        url = "";
      }

      BrowserApi.goBack(url, backSteps, loadData);
    },
    // 页面跳转 之前的公共处理 针对keepAlive
    beforeRouterChange: function beforeRouterChange() {
      this.$modal && this.$modal.close(); // 当前页面活动元素

      if (document.activeElement) {
        var tagName = document.activeElement.tagName;

        if (tagName === "INPUT" || tagName === "TEXTAREA") {
          document.activeElement.blur && typeof document.activeElement.blur === "function" && document.activeElement.blur();
        }
      }
    },

    /**
     * 路由页面回退
     */
    routerBack: function routerBack() {
      this.$router.goBack();
    },
    // APP切换后台
    onAppPause: function onAppPause() {},
    // APP切换前台
    onAppResume: function onAppResume() {},
    // 切换企业
    onSwitchCompany: function onSwitchCompany() {},

    /**
     * @description: 需要重薪设置titlebar数据
     */
    onRefreshPrev: function onRefreshPrev() {
      try {
        var titleInfo = BrowserApi.getCurrentTitleInfo();
        this.setTitle(titleInfo);
        var menuList = BrowserApi.getCurrentMenuList();
        BrowserApi.registerMenu(menuList);
        var titleBarTheme = BrowserApi.getCurrentTitleBarTheme();
        BrowserApi.setTitleBarTheme(titleBarTheme);
      } catch (err) {
        console.log("onRefreshPrev @@Error", err);
      }
    },

    /**
     * 子页面刷新逻辑处理，子类可以实现该方法 默认页面回退设置title和menu
     * @abstract
     */
    onRefresh: function onRefresh() {},

    /**
     * 设置页面title
     */
    setTitle: function setTitle(data) {
      var titleInfo = {};

      if ((0, _typeof2["default"])(data) !== "object") {
        titleInfo.title = data;
      } else {
        titleInfo = data;
      }

      BrowserApi.setTitle(titleInfo);
    },

    /**
     * 注册app菜单监听事件，子类没有重写 getMenuList() 方法的不额外加 menu 菜单项
     */
    registerBrowserMenuList: function registerBrowserMenuList() {
      BrowserApi.registerMenu(this.getMenuList());
    },

    /**
     * 注册菜单
     * MenuItem {
         String name;  //  如果是菜单，用name显示菜单文字
        String iconNormalBase64;  // 如果是图标按钮，用来显示 正常图标（JS交互时，用base64转码，如果图片超过5k，提出来让UI重新切图）
        String iconPressedBase64; // 如果是图标按钮，用来显示 按下效果 图标（JS交互时，用base64转码，如果图片超过5k，提出来让UI重新切图）
        String menuId;  //必填   菜单ID （不区分是 图标按钮 或是 菜单项），列表中的menuId必须相互唯一
        Int type;  // 必填 类型 1 ActionBar上的图标按钮，2 下拉菜单项 3 title显示(设置title请使用BrowserApi.setTitle('title')接口)（一般情况下，只有一个图标按钮，可以有多个下拉菜单项）
        function func; // 菜单点击回调
        }
    注意
        name 和 iconNormalBase64 至少需要填写一个；
        name 和iconNormalBase64 都有值时ActionBar上的按钮优先显示name，下拉菜单项会左边显示图标，右边显示name；
            当有多个type 为1的item时，app会取第一个值；
            下拉菜单项显示顺序默认按menuList的顺序排序；
          example:
        [{name:'设置',menuId:'but_1_1',type: 1,func:function(){openPage('setting.html')}}];
    */
    getMenuList: function getMenuList() {
      return [];
    } /////// --- end 浏览器基本操作方法，子类view应当按需重写 @override ///////////////////////////////////

  },
  watch: {
    /**
     * 设置进入、回退页面动画
     */
    $route: function $route() {
      this.beforeRouterChange();
    }
  }
};
exports["default"] = BaseRouter;