eoss-ui 0.3.97

package/packages/mainComp/src/main.vue

@@ -0,0 +1,1934 @@
+<template>
+  <div class="es-main">
+    <div
+      class="es-main-header"
+      :style="{ backgroundImage: headerImg ? 'url(' + headerImg + ')' : '' }"
+    >
+      <AsyncComponent
+        v-if="themeJSON.logo.comp"
+        :style="!themeJSON.topNav.comp ? 'width:100%' : ''"
+        :key="themeJSON.logo.comp"
+        v-bind="themeJSON.logo.data"
+        :componentRenderUrl="themeJSON.logo.comp"
+      />
+      <el-image v-if="showDefault" class="es-main-logo" :src="logoUrl">
+        <template slot="error">
+          <div class="es-logo-error">
+            <i class="el-icon-picture-outline"></i>LOGO
+          </div>
+        </template>
+      </el-image>
+      <div class="es-main-top-nav">
+        <es-menu
+          v-if="navs.length"
+          class="es-fourth-tabs"
+          :data="navs"
+          :icons="icons"
+          :popperClass="`el-menu--popup-${modal}`"
+          mode="horizontal"
+          :deep="modal === 'topnav'"
+          :default-active="topActive"
+          @select="
+            res => {
+              handleSelect(res, 'nav');
+            }
+          "
+        ></es-menu>
+      </div>
+
+      <AsyncComponent
+        v-if="themeJSON.topNav.comp"
+        :style="!themeJSON.logo.comp ? 'width:100%' : ''"
+        :hide="hide"
+        :subSystem="subsystem"
+        :online="online"
+        :application="application"
+        :storage="storage"
+        :notice="notice"
+        :data="handleData"
+        :key="themeJSON.topNav.comp"
+        v-bind="themeJSON.topNav.data"
+        :componentRenderUrl="themeJSON.topNav.comp"
+        @select="
+          res => {
+            handleSelect(res, 'sys');
+          }
+        "
+        @click="handleClick"
+      />
+      <es-handler
+        v-if="showDefault"
+        :userModel="userModel"
+        :hide="hide"
+        :subSystem="subsystem"
+        :online="online"
+        :application="application"
+        :storage="storage"
+        :notice="notice"
+        :data="handleData"
+        @select="
+          res => {
+            handleSelect(res, 'sys');
+          }
+        "
+        @click="handleClick"
+      ></es-handler>
+    </div>
+    <div class="es-main-box" v-if="reset">
+      <div class="es-main-left">
+        <AsyncComponent
+          v-if="themeJSON.leftNav.comp"
+          :biserial="biserial"
+          :newTitle="showNavTitle ? title : false"
+          :default-active="active"
+          :menu-tips="menuTips"
+          :scene="scene"
+          :key="themeJSON.leftNav.comp"
+          v-bind="themeJSON.leftNav.data"
+          :componentRenderUrl="themeJSON.leftNav.comp"
+          :newMenu="menu"
+          :application="application"
+          :menuUrl="menuUrl"
+          @trigger="
+            res => {
+              handleSelect(res, 'sub');
+            }
+          "
+          @select="
+            res => {
+              handleSelect(res, 'menu');
+            }
+          "
+          @success="menuSuccess"
+        />
+        <es-nav
+          v-if="showDefault"
+          :data="menu"
+          :biserial="biserial"
+          :width="navWidth"
+          :icons="icons"
+          :title="showNavTitle ? title : false"
+          :showCollapse="showNavTitle"
+          :default-active="active"
+          :menu-tips="menuTips"
+          :is-default="isDefault"
+          @trigger="
+            res => {
+              handleSelect(res, 'sub');
+            }
+          "
+          @select="
+            res => {
+              handleSelect(res, 'menu');
+            }
+          "
+        ></es-nav>
+      </div>
+      <div class="es-main-body">
+        <div v-if="fourthTabs" class="es-fourth-tabs">
+          <es-menu
+            :data="tabs"
+            :titleIcons="false"
+            mode="horizontal"
+            :default-active="tabsId"
+            :menu-tips="menuTips"
+            @select="
+              res => {
+                handleSelect(res, 'tabs');
+              }
+            "
+          ></es-menu>
+        </div>
+        <div class="es-body">
+          <div
+            class="es-body-main"
+            :style="themeJSON.copyright.comp ? 'bottom:60px' : ''"
+          >
+            <iframe
+              v-if="method === 'iframe'"
+              :id="iframeId"
+              :name="iframeId"
+              frameborder="0"
+              width="100%"
+              height="100%"
+              :src="page"
+            ></iframe>
+            <template v-else-if="method === 'wujie' && refresh">
+              <WujieVue
+                v-bind="wujieprops"
+                :name="wjName"
+                width="100%"
+                height="100%"
+                :url="page"
+              ></WujieVue>
+            </template>
+            <template v-else-if="method === 'router' && refresh">
+              <router-view v-if="!isKeepAlive" :key="routerKey" />
+              <keep-alive>
+                <router-view v-if="isKeepAlive" :key="routerKey"
+              /></keep-alive>
+            </template>
+          </div>
+          <AsyncComponent
+            style="position: absolute;
+                   height: 60px;
+                   bottom: 0;
+                   left: 0;
+                   right: 0;"
+            v-if="themeJSON.copyright.comp"
+            :key="themeJSON.copyright.comp"
+            v-bind="themeJSON.copyright.data"
+            :componentRenderUrl="themeJSON.copyright.comp"
+          />
+          <notice :data="sysMsg" @opened="handleOpened"></notice>
+          <message
+            v-if="showMsg"
+            ref="message"
+            :total.sync="notice"
+            :visible.sync="showMsg"
+            :winopen="winopen"
+            @ignore="handleChange"
+            @handle="handleMenuTips"
+          ></message>
+        </div>
+      </div>
+    </div>
+    <!-- <div v-show="set" ref="box" class="es-sets-button">
+      <el-button
+        type="primary"
+        class="es-icon-xitongguanli"
+        ref="area"
+      ></el-button>
+    </div> -->
+    <settings
+      v-bind="$attrs"
+      :theme="color"
+      :predefine="themes"
+      :visible.sync="showSet"
+      @change="handleChange"
+    ></settings>
+    <es-dialog
+      v-if="showUserInfo"
+      title="用户信息配置"
+      height="770px"
+      :visible.sync="showUserInfo"
+      @close="reGetConfig"
+    >
+      <slot name="user">
+        <userinfo
+          v-bind="$attrs"
+          @change="handleUserModel"
+          @reGetConfig="reGetConfig"
+        >
+          <slot name="userInfo"></slot>
+        </userinfo>
+      </slot>
+    </es-dialog>
+    <es-dialog
+      v-if="dialog.show"
+      v-bind="dialog"
+      :visible.sync="dialog.show"
+    ></es-dialog>
+  </div>
+</template>
+<script>
+import userinfo from './userinfo.vue';
+import settings from './settings.vue';
+import message from './message.vue';
+import notice from './notice.vue';
+import AsyncComponent from './async-component/index.vue';
+import {
+  mainConfig,
+  updateUserCustomInfo,
+  getComplexApplications,
+  getComplexApplicationsNew,
+  mainDetail,
+  wss,
+  topic
+} from 'eoss-ui/src/config/api.js';
+import store from 'eoss-ui/src/utils/store';
+import util from 'eoss-ui/src/utils/util';
+import SockJS from 'sockjs-client';
+import Stomp from 'stompjs';
+const isIE = navigator.userAgent.indexOf('MSIE') != -1;
+export default {
+  name: 'EsMainComp',
+  inheritAttrs: false,
+  components: {
+    userinfo,
+    settings,
+    message,
+    AsyncComponent,
+    notice
+  },
+  props: {
+    //菜单导航地址
+    menuUrl: String,
+    icons: Object,
+    //logo
+    logo: {
+      type: String,
+      default: 'errorlogo'
+    },
+    //菜单显示类型
+    scene: {
+      type: String,
+      default: 'default'
+    },
+    //操作栏配置
+    handleData: Array, //host
+    host: {
+      type: String,
+      default() {
+        return util.getStorage('host') ? util.getStorage('host') : '';
+      }
+    },
+    //本地导航
+    data: Array,
+    //头部背景图片
+    headerImage: String,
+    //默认选中菜单id
+    defaultActive: Array,
+    //默认主题颜色
+    theme: {
+      type: String,
+      default: '#409eff'
+    },
+    //主题颜色选择颜色集合
+    themes: Array,
+    //需要隐藏的头部功能
+    hides: Object,
+
+    //储存数据
+    storage: {
+      type: String,
+      default() {
+        return util.getStorage('storage');
+      }
+    },
+    //是否启用子应用菜单接口
+    application: {
+      type: Boolean,
+      default: false
+    },
+    //是否显示设置按钮
+    set: {
+      type: Boolean,
+      default: false
+    },
+    //websocket
+    socket: {
+      type: Boolean,
+      default: true
+    },
+    //无界微前端属性
+    wjprops: {
+      type: Object,
+      default() {
+        return {};
+      }
+    },
+
+    //socket调试modal
+    console: {
+      type: Boolean,
+      default: false
+    },
+    //消息办理是否采用window.open的方式打开
+    winopen: {
+      type: Boolean,
+      default: true
+    },
+    //获取用户信息的接口
+    mainConfig: {
+      type: String,
+      default: mainConfig
+    },
+    iframeId: {
+      type: String,
+      default: 'stage'
+    },
+    routePath: {
+      type: String,
+      default: '/main'
+    },
+    setFirstAsDefault: Boolean,
+    pathUrl: {
+      type: String,
+      default: '/primary'
+    },
+    keepAlive: Boolean,
+    loadWujie: {
+      type: Boolean,
+      default: true
+    },
+    downgrade: {
+      type: Boolean,
+      default: true
+    },
+    empty: {
+      type: String,
+      default: '#/empty'
+    }
+  },
+  computed: {
+    //菜单类型
+    modal() {
+      return this.scene.toLowerCase();
+    },
+    isHomePage() {
+      if (util.getParams('applicationid') || util.getParams('applicationId')) {
+        return false;
+      }
+      let hash = util.win.location.hash;
+      if (
+        hash &&
+        hash.split('?')[0] !== '#/' &&
+        hash.split('?')[0] !== '#/mian'
+      ) {
+        return false;
+      }
+      return true;
+    },
+    navWidth() {
+      return this.modal === 'topside' ? '230px' : undefined;
+    },
+    showNavTitle() {
+      return this.modal !== 'topside';
+    },
+    //tabs菜单
+    fourthTabs() {
+      return this.tabs.length;
+    },
+    //菜单接口
+    action() {
+      if (this.menuUrl) {
+        return this.menuUrl;
+      }
+      if (this.application) {
+        return getComplexApplicationsNew;
+      }
+      return getComplexApplications;
+    },
+    //是否双列右侧菜单
+    biserial() {
+      if (
+        this.modal === 'subsystem' ||
+        this.modal === 'topside' ||
+        this.application
+      ) {
+        return false;
+      } else {
+        return true;
+      }
+    },
+    //隐藏操作按键
+    hide() {
+      if (this.modal === 'subsystem' || this.application) {
+        if (this.hides && Object.keys(this.hides).length) {
+          return { ...this.hides, set: !this.set, system: false };
+        } else {
+          return { set: !this.set, system: false };
+        }
+      } else if (this.modal === 'topside') {
+        if (this.hides && Object.keys(this.hides).length) {
+          return {
+            ...this.hides,
+            set: !this.set,
+            system: true,
+            user: true
+          };
+        } else {
+          return { set: !this.set, system: true, user: true };
+        }
+      } else {
+        if (this.hides && Object.keys(this.hides).length) {
+          return {
+            ...this.hides,
+            set: !this.set,
+            system: true,
+            user: true
+          };
+        } else {
+          return { set: !this.set, system: true };
+        }
+      }
+    },
+    logoUrl() {
+      if (this.mainLogo) {
+        return this.mainLogo;
+      }
+      return this.logo;
+    },
+    wujieprops() {
+      return util.extend(true, this.wjprops, this.defaultwjprops, {
+        attrs: { src: this.empty }
+      });
+    }
+  },
+  watch: {
+    // defaultActive: {
+    //   immediate: true,
+    //   deep: true,
+    //   handler(val) {
+    //     if (val && val.length) {
+    //       if (this.menus.length) {
+    //         this.setDefault(JSON.parse(JSON.stringify(this.menus)), val);
+    //       }
+    //     }
+    //   }
+    // },
+    menuTips: {
+      immediate: true,
+      deep: true,
+      handler(val) {
+        if (Object.keys(val).length && this.menus.length) {
+          this.setTips(this.menus);
+        }
+      }
+    },
+    color: {
+      immediate: true,
+      handler(val) {
+        if (this.set) {
+          localStorage.setItem('theme', val);
+          util.updateTheme(val);
+        }
+      }
+    }
+  },
+  data() {
+    return {
+      showDefault: false,
+      themeJSON: {
+        logo: { comp: '', data: {} },
+        topNav: { comp: '', data: {} },
+        leftNav: { comp: '', data: {} },
+        copyright: { comp: '', data: {} }
+      },
+      pageLoading: false,
+      client: null,
+      websocket: null,
+      connect: 0,
+      wjName: 'singlespa',
+      menus: [],
+      //头部导航
+      navs: [],
+      //头部默认选择
+      topActive: '',
+      //子系统菜单
+      subsystem: [],
+      //头部子系统子导航默认选中项
+      sysId: '',
+      //导航默认选择
+      active: [],
+      //完整导航选中的ID
+      actives: [],
+      //初始默认选中菜单id
+      defaultActive: [],
+      //侧边导航
+      menu: [],
+      //菜单名称
+      title: '',
+      //菜单提醒气泡
+      menuTips: {},
+      //面包屑导航
+      tabs: [],
+      //页签导航默认选中值
+      tabsId: '',
+      //路由类型
+      method: 'router',
+      //页面地址
+      page: '',
+      //选中的地址
+      selectPage: '',
+      //主页面
+      homePage: '',
+      //header背景
+      mainLogo: null,
+      headerImg: this.headerImage,
+      //在线人数
+      online: 1,
+      //通知数
+      notice: 0,
+      //是否显示消息列表框
+      showMsg: false,
+      //即时消息
+      sysMsg: [],
+      //定时关闭及时消息对象
+      sysMsgOut: null,
+      //额外信息数据
+      extraData: '',
+      //用户信息
+      userModel: {},
+      //刷新路由
+      refresh: true,
+      //显示设置面板
+      showSet: false,
+      //弹窗配置
+      dialog: {
+        title: '',
+        params: {},
+        url: '',
+        index: null,
+        show: false
+      },
+      //当前设置的主题
+      color: util.getStorage('theme') ? util.getStorage('theme') : this.theme,
+      //显示用户信息
+      showUserInfo: false,
+      //是否展示侧边导航
+      showMenu: true,
+      props: {},
+      menuType: '',
+      //是否首次加载
+      isDefault: true,
+      reset: true,
+      customMenu: [],
+      isKeepAlive: this.keepAlive,
+      routerKey: '',
+      defaultwjprops: {}
+    };
+  },
+  created() {
+    this.getConfig();
+    // if (this.data === undefined) {
+    //   this.getMenu();
+    // } else {
+    //   this.menus = JSON.parse(JSON.stringify(this.data));
+    //   this.setMenu(this.data);
+    // }
+    if (this.socket) {
+      this.initWebSocket();
+    }
+  },
+  mounted() {
+    //this.move();
+    util.win.reLogin = this.handleReLogin;
+    this.handleListener();
+    util.win.refresh = this.handleRefresh;
+    util.win.jumpMenu = this.jumpMenu;
+    if (util.win.$wujie) {
+      util.win.$wujie.bus.$on('changeTheme', res => {
+        util.updateTheme(res);
+      });
+    }
+  },
+  methods: {
+    menuSuccess(res) {
+      // this.menus
+      this.menuType = 'custom';
+      this.customMenu = res;
+      this.setMenu(res);
+    },
+    //获取主题模板JSON
+    getMainDetail(id) {
+      let params = {
+        url: mainDetail,
+        params: { id }
+      };
+      util
+        .ajax(params)
+        .then(res => {
+          let _that = this;
+          if (!res.results) {
+            _that.showDefault = true;
+          }
+          if (res.rCode == 0) {
+            if (res.results && JSON.parse(res.results.layout)) {
+              // 初始化布局器
+              _that.themeJSON = JSON.parse(res.results.layout);
+              let count = 0;
+              for (let key in _that.themeJSON) {
+                if (_that.themeJSON[key].comp) {
+                  count++;
+                }
+              }
+              if (count == 0) {
+                _that.showDefault = true;
+              }
+              let theme = JSON.parse(res.results.theme);
+
+              util.updateTheme(theme.primaryColor);
+              _that.handleColorToPage(theme.globalThalk);
+            }
+          } else {
+            _that.$message.error('主题加载发生错误');
+            throw res.msg || '系统错误，请联系管理员！';
+          }
+          if (_that.showDefault && _that.data === undefined) {
+            _that.getMenu();
+          } else if (_that.showDefault) {
+            _that.menus = JSON.parse(JSON.stringify(_that.data));
+            _that.setMenu(_that.data);
+          }
+        })
+        .catch(err => {
+          if (err.message && err.message !== 'canceled') {
+            this.$message.error(err.message);
+          }
+        });
+    },
+    // 将chalk写入到页面中
+    handleColorToPage(globalThalk) {
+      const thalk = document.getElementById('chalk-style');
+      if (!thalk) {
+        let ele = document.createElement('style');
+        ele.setAttribute('id', 'chalk-style');
+        ele.innerText = globalThalk;
+        document.head.appendChild(ele);
+      }
+      // 如果设置过主题的话
+      else {
+        thalk.innerText = globalThalk;
+      }
+    },
+    //设置按钮拖动
+    move() {
+      let area = this.$refs.area.$el;
+      let box = this.$refs.box;
+      let [sTime, eTime] = [0, 0];
+      area.addEventListener('mousedown', e => {
+        sTime = new Date().getTime();
+        let { y: downY } = e;
+        let { height: winH } = document.body.getBoundingClientRect();
+        //防止拖动期间选中和复制网页文本
+        document.body.onselectstart = document.body.oncontextmenu = () => {
+          return false;
+        };
+        document.onmousemove = eve => {
+          let size = 40;
+          let { y: moveY } = eve;
+          let { top: boxTop } = box.getBoundingClientRect();
+          boxTop = boxTop + (moveY - downY);
+          boxTop >= winH - size && (boxTop = winH - size);
+          boxTop <= -size && (boxTop = -size);
+          if (boxTop < 64) {
+            boxTop = 64;
+          }
+          box.style.top = boxTop + 'px';
+          downY = moveY;
+        };
+        document.onmouseup = () => {
+          eTime = new Date().getTime();
+          let isClick = eTime - sTime < 200;
+          if (isClick) {
+            let onArea = () => {
+              this.handleSet();
+              area.removeEventListener('click', onArea);
+            };
+            area.addEventListener('click', onArea);
+          }
+          document.onmousemove = null;
+          document.body.onselectstart = document.body.oncontextmenu = () => {
+            return true;
+          };
+        };
+      });
+    },
+    //设置主题颜色
+    setTheme(color) {
+      if (!color) {
+        return;
+      }
+      util
+        .ajax({
+          url: updateUserCustomInfo,
+          params: { color: escape(color.toLowerCase()) },
+          data: { color: escape(color.toLowerCase()) }
+        })
+        .then(res => {
+          if (res.rCode === 0) {
+            this.color = color;
+            localStorage.setItem('theme', color);
+            this.$emit('setting', 'theme', this.color);
+            this.$message({
+              message: res.msg,
+              type: 'success',
+              duration: 2000
+            });
+          } else {
+            let msg = res.msg || '系统错误，请联系管理员！';
+            this.$message.error(msg);
+          }
+        })
+        .catch(err => {
+          if (err.message && err.message !== 'canceled') {
+            this.$message.error(err.message);
+          }
+        });
+    },
+    //显示隐藏设置面板
+    handleSet() {
+      this.showSet = !this.showSet;
+    },
+    setConfig(results, flag) {
+      let hash = util.win.location.hash;
+      for (let i in results) {
+        if (i === 'mainLogoUrl' && results[i]) {
+          this.mainLogo = results[i];
+        }
+        if (
+          i === 'mainBannerUrl' &&
+          results[i] &&
+          this.headerImage === undefined
+        ) {
+          this.headerImg = results[i];
+        }
+        if (i === 'initApplication' && results[i]) {
+          this.results[i] = results[i].split(',');
+        }
+        if (i === 'indexUrl' && results[i] && hash.indexOf('main') > -1) {
+          this.homePage = results[i];
+          this.isHomePage && this.handleJump(this.homePage);
+        }
+        if (i === 'subsystemName') {
+          document.title = results[i];
+        }
+        if (i === 'userStyle' && results[i].color) {
+          this.color = unescape(results[i].color).toLowerCase();
+        }
+        if (i === 'sysLogoIco' && results[i].sysLogoIco) {
+          util.setFavicon(results[i].sysLogoIco);
+        }
+        store.set(i, results[i]);
+      }
+      this.userModel = results.userModel;
+      let mainFrameLayout = results.mainFrameLayout;
+      if (results.userStyle.layout) {
+        this.getMainDetail(results.userStyle.layout);
+      } else {
+        this.getMainDetail(mainFrameLayout);
+      }
+      if (flag) {
+        sessionStorage.setItem('mainConfig', JSON.stringify(results));
+        util.setStorage({
+          type: this.storage,
+          key: {
+            userId: results.userModel.userId,
+            userName: results.userModel.username
+          }
+        });
+      }
+    },
+    //获取用户配置及信息
+    getConfig() {
+      if (util.getStorage('mainConfig')) {
+        const results = JSON.parse(util.getStorage('mainConfig'));
+        this.setConfig(results);
+        return true;
+      }
+      util
+        .ajax({ url: this.mainConfig })
+        .then(res => {
+          if (res && res.rCode === 0) {
+            this.setConfig(res.results, 1);
+          } else {
+            let msg = res.msg || '系统错误，请联系管理员！';
+            this.$message.error(msg);
+          }
+        })
+        .catch(err => {
+          if (err.message && err.message !== 'canceled') {
+            this.$message.error(err.message);
+          }
+        });
+    },
+    reGetConfig() {
+      util
+        .ajax({ url: this.mainConfig })
+        .then(res => {
+          if (res && res.rCode === 0) {
+            const results = JSON.parse(JSON.stringify(res.results));
+            this.setConfig(results, 1);
+          } else {
+            let msg = res.msg || '系统错误，请联系管理员！';
+            this.$message.error(msg);
+          }
+        })
+        .catch(err => {
+          if (err.message && err.message !== 'canceled') {
+            this.$message.error(err.message);
+          }
+        });
+    },
+    jumpMenu(res) {
+      if (typeof res === 'string') {
+        res = res.split(',');
+      }
+      this.setDefault(this.menus, res);
+    },
+    getId(arry, res) {
+      if (!res) {
+        return false;
+      }
+      for (let i = 0; i < arry.length; i++) {
+        let item = arry[i];
+        if (item.id === res || (item.url && item.url.indexOf(res) > -1)) {
+          return item.id;
+        } else if (
+          Object.prototype.hasOwnProperty.call(item, 'children') &&
+          item.children.length
+        ) {
+          let id = this.getId(item.children, res);
+          if (id) {
+            if (item.pid === 'root') {
+              return [item.id].concat(id);
+            } else if (typeof id === 'string') {
+              return [item.id, id];
+            }
+            return id;
+          }
+        } else if (
+          Object.prototype.hasOwnProperty.call(item, 'fourthTabs') &&
+          item.fourthTabs.length
+        ) {
+          let id = this.getId(item.fourthTabs, res);
+          if (id) {
+            if (item.pid === 'root') {
+              return [item.id].concat(id);
+            } else if (typeof id === 'string') {
+              return [item.id, id];
+            }
+            return id;
+          }
+        }
+      }
+      return false;
+    },
+    //获取应用导航菜单
+    getMenu() {
+      util
+        .ajax({ url: this.action })
+        .then(res => {
+          if (res && res.rCode === 0) {
+            this.menus = JSON.parse(JSON.stringify(res.results));
+            if (
+              this.$route &&
+              (this.$route.query.applicationId ||
+                this.$route.query.applicationid ||
+                (this.$route.name !== 'main' && this.$route.path !== '/main'))
+            ) {
+              let ids = this.getId(
+                this.menus,
+                this.$route.query.applicationId ||
+                  this.$route.query.applicationid ||
+                  this.$route.fullPath
+              );
+              if (ids) {
+                this.defaultActive = ids;
+              }
+            }
+            this.setTips(this.menus);
+            store.set('nav', this.menus);
+            this.setMenu(this.menus);
+          } else {
+            let msg = res.msg || '系统错误，请联系管理员！';
+            this.$message.error(msg);
+          }
+        })
+        .catch(err => {
+          if (err.message && err.message !== 'canceled') {
+            this.$message.error(err.message);
+          }
+        });
+    },
+    //遍历设置菜单气泡提醒
+    setTips(obj) {
+      if (Array.isArray(obj)) {
+        obj.forEach(item => {
+          this.setTips(item);
+        });
+      } else {
+        if (Object.prototype.hasOwnProperty.call(obj, 'tips') && obj.tips) {
+          this.$set(obj, 'tips', false);
+          delete obj.tips;
+        }
+        let flag = false;
+        if (obj.children && obj.children.length) {
+          obj.children.forEach(item => {
+            if (this.setTips(item)) {
+              flag = true;
+            }
+          });
+          if (flag) {
+            this.$set(obj, 'tips', true);
+            return true;
+          }
+        } else if (obj.fourthTabs && obj.fourthTabs.length) {
+          obj.fourthTabs.forEach(item => {
+            if (this.setTips(item)) {
+              flag = true;
+            }
+          });
+          if (flag) {
+            this.$set(obj, 'tips', true);
+            return true;
+          }
+        } else {
+          if (this.menuTips[obj.id] && Number(this.menuTips[obj.id])) {
+            this.$set(obj, 'tips', Number(this.menuTips[obj.id]));
+            return true;
+          }
+        }
+      }
+      return false;
+    },
+    //设置右侧导航
+    setMenu(res) {
+      if (this.defaultActive && this.defaultActive.length) {
+        this.isDefault = false;
+        this.setDefault(res, this.defaultActive);
+      } else {
+        if (this.homePage) {
+          this.isDefault = true;
+        } else {
+          this.isDefault = false;
+        }
+        if (this.modal === 'subsystem' || this.modal === 'topside') {
+          if (this.modal === 'subsystem') {
+            if (this.menuType === 'custom') {
+              this.subsystem = this.customMenu;
+            } else {
+              this.subsystem = res;
+            }
+            // this.subsystem = res;
+          } else if (this.modal === 'topside') {
+            if (this.menuType === 'custom') {
+              this.navs = this.customMenu;
+              this.topActive = res[0].id;
+            } else {
+              this.navs = res;
+              this.topActive = res[0].id;
+            }
+            // this.navs = res;
+            // this.topActive = res[0].id;
+          }
+          if (this.application) {
+            for (let i = 0; i < res.length; i++) {
+              if (res[i].hasPermission) {
+                this.menu = res[i].children;
+                this.title = res[i].text;
+                break;
+              }
+            }
+          } else {
+            this.menu = res[0].children;
+            this.title = res[0].text;
+          }
+          if (!this.isDefault) {
+            this.active = this.getFirst(this.menu[0]);
+          }
+        } else if (this.modal === 'topnav') {
+          if (this.menuType === 'custom') {
+            this.navs = this.customMenu;
+            this.topActive = this.getFirst(res[0]);
+          } else {
+            this.navs = res;
+            this.topActive = this.getFirst(res[0]);
+          }
+        } else {
+          this.menu = res;
+          if (!this.isDefault) {
+            this.active = [this.menu[0].id];
+            let id = this.getFirst(this.menu[0]);
+            if (id && this.menu[0].id !== id) {
+              this.active.push(id);
+            } else {
+              this.handleJump(
+                this.menu[0].url,
+                this.menu[0].urlopenmode,
+                this.menu[0]
+              );
+            }
+          }
+        }
+      }
+
+      // const active = sessionStorage.getItem('menus');
+      // if (
+      //   this.defaultActive &&
+      //   this.defaultActive.length
+      // ) {
+      //   this.setDefault(res, this.defaultActive);
+      // } else if (util.win.location.hash !== '#/main' && active) {
+      //   this.setDefault(res, active.split(','));
+      // } else {
+      //   if (this.modal === 'default' || !this.modal) {
+      //     this.menu = res;
+      //     this.active = res[0].id;
+      //   } else if (
+      //     this.modal === 'subsystem' ||
+      //     this.modal === 'subSystem' ||
+      //     this.modal === 'topnav' ||
+      //     this.modal === 'topNav'
+      //   ) {
+      //     if (this.modal === 'subsystem' || this.modal === 'subSystem') {
+      //       if (this.menuType === 'custom') {
+      //         this.subsystem = this.customMenu;
+      //         this.active = this.customMenu[0].id;
+      //       } else {
+      //         this.subsystem = res;
+      //         this.active = res[0].id;
+      //       }
+      //     } else if (this.modal === 'topnav' || this.modal === 'topNav') {
+      //       if (this.menuType === 'custom') {
+      //         this.navs = this.customMenu;
+      //       } else {
+      //         this.navs = res;
+      //       }
+      //     }
+      //     if (this.application) {
+      //       for (let i = 0; i < res.length; i++) {
+      //         if (res[i].hasPermission) {
+      //           this.menu = res[i].children;
+      //           this.title = res[i].text;
+      //           break;
+      //         }
+      //       }
+      //     } else {
+      //       this.menu = res[0].children;
+      //       this.title = res[0].text;
+      //     }
+      //   }
+      //   if (!this.homePage) {
+      //     this.getFirst(this.menu);
+      //   }
+      // }
+    },
+    //获取导航第一个页面
+    getFirst(obj) {
+      // let item = arry[0];
+      // if (
+      //   Object.prototype.hasOwnProperty.call(item, 'children') &&
+      //   item.children.length
+      // ) {
+      //   this.active.push(item.id);
+      //   this.getFirst(item.children);
+      // } else if (
+      //   Object.prototype.hasOwnProperty.call(item, 'fourthTabs') &&
+      //   item.fourthTabs.length
+      // ) {
+      //   if (item.url) {
+      //     let res = item.fourthTabs.filter(res => {
+      //       return res.url === item.url;
+      //     })[0];
+      //     if (res) {
+      //       this.tabsId = res.id;
+      //       this.handleJump(res.url);
+      //     } else {
+      //       this.tabsId = item.fourthTabs[0].id;
+      //       this.handleJump(item.fourthTabs[0].url);
+      //     }
+      //   } else {
+      //     this.tabsId = item.fourthTabs[0].id;
+      //     this.handleJump(item.fourthTabs[0].url);
+      //   }
+      // } else {
+      //   if (Array.isArray(this.active)) {
+      //     this.active.push(item.id);
+      //   } else {
+      //     this.active = item.id;
+      //   }
+      //   this.handleJump(item.url);
+      // }
+      if (!obj) {
+        return '';
+      }
+      if (obj.children && obj.children.length) {
+        return this.getFirst(obj.children[0]);
+      } else if (obj.fourthTabs && obj.fourthTabs.length) {
+        if (this.modal === 'topnav') {
+          return this.getFirst(obj.fourthTabs[0]);
+        } else {
+          this.tabs = obj.fourthTabs;
+          if (obj.url) {
+            let tab = obj.fourthTabs.filter(item => {
+              return item.url === obj.url;
+            })[0];
+            if (tab) {
+              this.tabsId = tab.id;
+              this.handleJump(tab.url, tab.urlopenmode, tab);
+            }
+          } else {
+            this.tabsId = this.tabs[0].id;
+            this.handleJump(
+              this.tabs[0].url,
+              this.tabs[0].urlopenmode,
+              this.tabs[0]
+            );
+          }
+          return obj.id;
+        }
+      } else {
+        this.handleJump(obj.url, obj.urlopenmode, obj);
+      }
+      return obj.id;
+    },
+    //设置默认页面
+    setDefault(res, active) {
+      this.sysId = '';
+      this.tabsId = '';
+      this.active = [];
+      this.getUrl(res, active);
+      if (
+        this.modal === 'subsystem' ||
+        this.modal === 'subSystem' ||
+        this.modal === 'topnav' ||
+        this.modal === 'topNav' ||
+        this.modal === 'topside' ||
+        this.modal === 'topSide'
+      ) {
+        if (this.modal === 'subsystem' || this.modal === 'subSystem') {
+          if (this.menuType === 'custom') {
+            this.subsystem = this.customMenu;
+            this.sysId = active[0];
+          } else {
+            this.subsystem = res;
+            this.sysId = active[0];
+          }
+        } else if (
+          this.modal === 'topnav' ||
+          this.modal === 'topNav' ||
+          this.modal === 'topside' ||
+          this.modal === 'topSide'
+        ) {
+          if (this.menuType === 'custom') {
+            this.navs = this.customMenu;
+            this.topActive = active[0];
+          } else {
+            this.navs = res;
+            this.topActive = active[0];
+          }
+          // this.navs = res;
+          // this.topActive = active[0];
+        }
+        // if (this.biserial) {
+        //   if (this.tabs.length) {
+        //     this.tabsId = active[active.length - 1];
+        //     this.active = active.slice(1, active.length - 2);
+        //   } else {
+        //     this.active = active.slice(1);
+        //   }
+        // } else {
+        if (this.tabs.length) {
+          this.tabsId = active[active.length - 1];
+          this.active = active.slice(1, active.length - 1);
+        } else {
+          this.active = active.slice(1);
+        }
+        // }
+        for (let i = 0; i < res.length; i++) {
+          if (res[i].id === active[0]) {
+            this.menu = res[i].children;
+            this.title = res[i].text;
+            break;
+          }
+        }
+      } else {
+        this.menu = res;
+        if (this.biserial) {
+          this.active = active.slice(
+            0,
+            active.length > 2 ? active.length - 1 : active.length
+          );
+        } else {
+          this.active = active.slice(1);
+        }
+        this.tabsId = active[active.length - 1];
+        // if (this.biserial) {
+        //   if (this.tabs.length) {
+        //     this.tabsId = active[active.length - 1];
+        //     this.active = active.slice(1, active.length - 2);
+        //   } else {
+        //     this.active = active;
+        //   }
+        // } else {
+        //   if (this.tabs.length) {
+        //     this.tabsId = active[active.length - 1];
+        //     this.active = active[active.length - 2];
+        //   } else {
+        //     this.active = active[active.length - 1];
+        //   }
+        // }
+      }
+    },
+    jsBeforeLoaders(url, type) {
+      if (type === undefined) {
+        this.defaultwjprops = {
+          plugins: [
+            {
+              jsBeforeLoaders: [{ src: url }]
+            }
+          ]
+        };
+      } else {
+        let { model, view } = util.getParams({ url: url });
+        if (view) {
+          if (view.indexOf('.js') > -1) {
+            let views = view.split(',');
+            let jss = [];
+            views.forEach(item => {
+              jss.push({
+                src:
+                  (util.win.path
+                    ? util.win.path
+                    : util.startWith(model, '/')
+                    ? ''
+                    : '/') +
+                  (model ? model.split('|').join('/') + '/' : '') +
+                  item
+              });
+            });
+            this.defaultwjprops = {
+              plugins: [
+                {
+                  jsBeforeLoaders: jss
+                }
+              ]
+            };
+          }
+        }
+      }
+    },
+    //获取页面类型及地址
+    getUrl(res, active, index) {
+      index = index === undefined ? 0 : index;
+      for (let i = 0; i < res.length; i++) {
+        let item = res[i];
+        if (item.id === active[index]) {
+          if (index === active.length - 1) {
+            this.handleJump(item.url, item.urlopenmode, item);
+          } else {
+            if (item.children && item.children.length) {
+              index++;
+              let url = this.getUrl(item.children, active, index);
+              if (url && index === active.length - 1) {
+                this.tabs = '';
+              }
+              return url;
+            }
+            if (item.fourthTabs && item.fourthTabs.length) {
+              index++;
+              let url = this.getUrl(item.fourthTabs, active, index);
+              if (url) {
+                this.$set(this, 'tabs', item.fourthTabs);
+              }
+              return url;
+            }
+          }
+        } else if (item.children && item.children.length) {
+          this.getUrl(item.children, active, index);
+        }
+      }
+      return false;
+    },
+    setUrl(url, param) {
+      let obj = param ? param : {};
+      let params = util.getParams({ url: url }, true);
+      for (let i in params) {
+        if (i != 'model' && i != 'view' && i != '_baseUrl') {
+          obj[i] = params[i];
+        }
+      }
+      let _url = params._baseUrl ? params._baseUrl : './primary.html';
+      return util.urlJoinParams({ url: _url, param: obj });
+    },
+    //应用导航交互
+    handleSelect(res, type) {
+      // this.active = [];
+      // this.tabsId = '';
+      // let active = sessionStorage.getItem('menus');
+      // active = active ? active.split(',') : [];
+      // const { node } = res;
+      // switch (type) {
+      //   case 'nav':
+      //     this.menu = node.children;
+      //     this.title = node.text;
+      //     if (active.length) {
+      //       active[0] = node.id;
+      //     } else {
+      //       active.push(node.id);
+      //     }
+      //     break;
+      //   case 'sys':
+      //     this.menu = node.children;
+      //     this.title = node.text;
+      //     if (active.length) {
+      //       active[0] = node.id;
+      //     } else {
+      //       active.push(node.id);
+      //     }
+      //     break;
+      //   case 'sub':
+      //     if (active.length) {
+      //       active[0] = node.id;
+      //     } else {
+      //       active.push(node.id);
+      //     }
+      //     break;
+      //   case 'menu':
+      //     this.active = node.id;
+      //     if (active.length > 1) {
+      //       active[1] = node.id;
+      //     } else {
+      //       active.push(node.id);
+      //     }
+      //     this.tabs = node.fourthTabs;
+      //     if (node.url) {
+      //       let tab = node.fourthTabs.filter(item => {
+      //         return item.url === node.url;
+      //       })[0];
+      //       if (tab) {
+      //         this.tabsId = tab.id;
+      //       }
+      //     } else {
+      //       this.tabsId = this.tabs[0].id;
+      //       this.handleJump(this.tabs[0].url);
+      //     }
+      //     break;
+      //   case 'tabs':
+      //     if (active.length > 2) {
+      //       active[2] = node.id;
+      //     } else {
+      //       active.push(node.id);
+      //     }
+      //     break;
+      // }
+      // sessionStorage.setItem('menus', active.join(','));
+      // if (node.url) {
+      //   this.selectPage = node.url;
+      //   this.refresh = false;
+      //   switch (node.urlopenmode) {
+      //     case '2':
+      //       location.reload();
+      //       break;
+      //     case 2:
+      //       location.reload();
+      //       break;
+      //     case '1':
+      //       util.win.open(node.url);
+      //       break;
+      //     case 1:
+      //       util.win.open(node.url);
+      //       break;
+      //     default:
+      //       let url;
+      //       if (node.url.indexOf('//:') === 0) {
+      //         this.method = 'wujie';
+      //         url = node.url.replace('//:', '');
+      //       } else if (
+      //         node.url.indexOf('dhtml') > -1 ||
+      //         (node.url.indexOf('html') > -1 &&
+      //           node.url.indexOf('html#') === -1)
+      //       ) {
+      //         this.method = 'iframe';
+      //         url = node.url;
+      //       } else {
+      //         this.method = 'router';
+      //         url = node.url;
+
+      //         const routes = this.$router.options.routes;
+
+      //         if (routes) {
+      //           let path = this.hasRouter(routes, url);
+      //           if (path) {
+      //             let index = decodeURI(url).indexOf('?');
+      //             url = path + (index > -1 ? url.slice(index) : '');
+      //           } else {
+      //             this.method = 'wujie';
+      //           }
+      //         } else {
+      //           console.error('缺少路由配置');
+      //           return;
+      //           // const moduleName = util.getStorage('moduleName');
+      //           // if (moduleName && node.url.indexOf(moduleName) > -1) {
+      //           //   url = node.url.slice(node.url.indexOf('#/') + 1);
+      //           // } else if (node.url.indexOf('/') > -1) {
+      //           //   this.method = 'wujie';
+      //           // }
+      //         }
+      //       }
+      //       if (this.method === 'router') {
+      //         if (url.indexOf('/') > -1) {
+      //           this.$router.push({ path: util.handlerUrl(url) });
+      //         } else {
+      //           this.$router.push({ name: url });
+      //         }
+      //         this.$nextTick(() => {
+      //           this.refresh = true;
+      //         });
+      //       } else if (this.method === 'wujie') {
+      //         this.page = util.handlerUrl(url, this.host);
+      //         this.$nextTick(() => {
+      //           this.refresh = true;
+      //         });
+      //       } else {
+      //         this.refresh = false;
+      //         this.page = util.handlerUrl(url, this.host);
+      //       }
+      //   }
+      // }
+
+      this.isDefault = false;
+      const { node } = res;
+      switch (type) {
+        case 'nav':
+          this.tabs = [];
+          this.active = '';
+          if (this.modal === 'topside') {
+            this.menu = node.children;
+            this.title = node.text;
+            this.active = this.getFirst(node.children[0]);
+          } else {
+            if (node.url) {
+              let tab = node.fourthTabs.filter(item => {
+                return item.url === node.url;
+              })[0];
+              if (tab) {
+                this.tabs = node.fourthTabs;
+                this.tabsId = tab.id;
+              }
+              //this.handleJump(node.url);
+            } else {
+              if (node.fourthTabs.length) {
+                this.tabs = node.fourthTabs;
+                this.tabsId = this.tabs[0].id;
+                this.handleJump(
+                  this.tabs[0].url,
+                  this.tabs[0].urlopenmode,
+                  this.tabs[0]
+                );
+              }
+            }
+          }
+          break;
+        case 'sys':
+          this.tabs = [];
+          this.menu = node.children;
+          this.title = node.text;
+          this.active = this.getFirst(node.children[0]);
+          break;
+        case 'sub':
+          if (node.url) {
+            this.tabs = [];
+          }
+          if (this.setFirstAsDefault) {
+            let id = this.getFirst(node);
+            if (node.id !== id) {
+              this.$set(this.active, 0, node.id);
+              this.$set(this.active, 1, id);
+            }
+          }
+          break;
+        case 'menu':
+          this.tabsId = '';
+          this.tabs = [];
+          if (this.setFirstAsDefault) {
+            if (this.biserial) {
+              this.$set(this.active, 1, node.id);
+            } else {
+              this.active = node.id;
+            }
+          }
+          if (node.url) {
+            let tab = node.fourthTabs.filter(item => {
+              return item.url === node.url;
+            })[0];
+            if (tab) {
+              this.tabs = node.fourthTabs;
+              this.tabsId = tab.id;
+            }
+            // this.handleJump(node.url);
+          } else if (node.fourthTabs.length) {
+            if (node.fourthTabs.length) {
+              this.tabs = node.fourthTabs;
+              this.tabsId = this.tabs[0].id;
+              this.handleJump(
+                this.tabs[0].url,
+                this.tabs[0].urlopenmode,
+                this.tabs[0]
+              );
+            }
+          }
+          break;
+        case 'tabs':
+          break;
+      }
+      if (node.url) {
+        this.selectPage = node.url;
+        this.refresh = false;
+        this.handleJump(node.url, Number(node.urlopenmode), node);
+      }
+    },
+    hasRouter(res, url) {
+      if (!url) {
+        return false;
+      }
+      if (Array.isArray(res)) {
+        for (let i in res) {
+          let path = this.hasRouter(res[i], url);
+          if (path) {
+            return path;
+          }
+        }
+      } else {
+        let path = res.path;
+        if (path !== '/' && path !== '/404') {
+          path = path.replace(path[1], path[1].toLowerCase());
+        }
+        let pathname = url.substring(url.indexOf('#/') + 1);
+        pathname = pathname
+          .replace(pathname[1], pathname[1].toLowerCase())
+          .split('?')[0];
+        if (res.path !== '/' && pathname == path) {
+          return pathname;
+        }
+        if (Object.prototype.hasOwnProperty.call(res, 'children')) {
+          let path = this.hasRouter(res.children, url);
+          if (path) {
+            return path;
+          }
+        }
+      }
+      return false;
+    },
+    handleTrigger(res) {},
+    //头部工具交互事件
+    handleClick(res) {
+      const { type } = res;
+      switch (type) {
+        //刷新
+        case 'refresh':
+          this.handleRefresh();
+          break;
+        case 'home':
+          this.reset = false;
+          if (this.homePage) {
+            this.handleJump(this.homePage);
+            // this.showMenu = false
+            // this.active = [];
+            // this.menu = [];
+            // if (this.scene === 'topNav' || this.scene === 'topnav') {
+            //   this.setMenu(this.navs.length > 0 ? this.navs : []);
+            //   // this.getFirst(this.navs.length>0? this.navs : []);
+            // } else {
+            //   setTimeout(() => {
+            //     this.setMenu(this.menus.length > 0 ? this.menus : []);
+            //   }, 1000);
+            //   // this.getFirst(this.menus.length>0? this.menus : []);
+            // }
+          }
+          this.active = [];
+          this.defaultActive = [];
+          this.tabs = [];
+          this.setMenu(this.menus);
+          this.$nextTick(() => {
+            this.reset = true;
+          });
+          break;
+        case 'user':
+          this.showUserInfo = true;
+          break;
+        case 'online':
+          this.dialog = {
+            title: '查看在线人员',
+            show: true,
+            url: '/main/sysuseronline/list.dhtml'
+          };
+          break;
+        case 'notice':
+          this.showMsg = !this.showMsg;
+          break;
+        case 'set':
+          this.handleSet();
+          break;
+        case 'goView':
+          util.win.open(res.path, '_blank');
+          break;
+      }
+    },
+    //刷新子页面、子路由
+    handleRefresh() {
+      if (this.method === 'iframe') {
+        this.page = util.handlerUrl(this.page);
+      } else {
+        this.refresh = false;
+        this.$nextTick(() => {
+          this.refresh = true;
+        });
+      }
+    },
+    //跳转页面
+    handleJump(page, type, res) {
+      if (type == 1) {
+        util.win.open(page);
+      } else if (type == 2) {
+        location.reload();
+      } else if (type == 3) {
+        this.method = 'iframe';
+        this.refresh = false;
+        this.page = util.handlerUrl(page);
+      } else if (page) {
+        let urls = page.split('?');
+        if (urls[0].indexOf('.js') > 0) {
+          this.method = this.downgrade && isIE ? 'iframe' : 'wujie';
+          this.wjName = 'singlespa';
+          let url = './primary.html' + (urls[1] ? `?${urls[1]}` : '');
+          this.jsBeforeLoaders(urls[0]);
+          this.page = url;
+          this.$nextTick(() => {
+            this.refresh = true;
+          });
+        } else if (
+          urls[0].indexOf('.dhtml') > 0 ||
+          (urls[0].indexOf('.html') > 0 && urls[0].indexOf('.html#') === -1)
+        ) {
+          this.method = 'iframe';
+          this.refresh = false;
+          this.page = util.handlerUrl(page);
+        } else {
+          this.method = 'router';
+          const routes = this.$router.options.routes;
+          if (routes) {
+            let path = this.hasRouter(routes, urls[0]);
+            if (path) {
+              let params = util.getParams({ url: page });
+              if (res) {
+                this.routerKey = res.id;
+                if (Object.prototype.hasOwnProperty.call(res, 'keepAlive')) {
+                  this.isKeepAlive = res.keepAlive;
+                }
+              }
+              this.$router.push({ path: path, query: params });
+              this.$nextTick(() => {
+                this.refresh = true;
+              });
+            } else {
+              let urlopenmode = util.getParams({
+                url: page,
+                name: 'urlopenmode'
+              });
+              if (
+                this.loadWujie === false ||
+                (this.downgrade && isIE) ||
+                urlopenmode == 3
+              ) {
+                this.method = 'iframe';
+                this.refresh = false;
+                this.page = util.handlerUrl(page);
+              } else {
+                this.method = 'wujie';
+                this.wjName = res.appCode ? res.appCode : 'application';
+                this.page = page;
+                this.$nextTick(() => {
+                  this.refresh = true;
+                });
+              }
+            }
+          } else {
+            console.error('缺少路由配置');
+            return;
+          }
+        }
+      }
+    },
+    //设置回调
+    handleChange(res) {
+      const { type, value } = res;
+      switch (type) {
+        case 'theme':
+          this.setTheme(value);
+          break;
+        case 'ignore':
+          this.notice = 0;
+          break;
+      }
+    },
+    //监听改变菜单
+    handleListener() {
+      util.win.addEventListener(
+        'message',
+        function(e) {
+          var msg = e.data;
+          if (msg.key == 'jump_Menu') {
+            let res = msg.data1;
+            if (typeof res === 'string') {
+              res = res.split(',');
+            }
+            this.setDefault(this.menus, res);
+          }
+        },
+        false
+      );
+    },
+    //开启weosocket
+    initWebSocket() {
+      //初始化weosocket
+      //初始化weosocket
+      if (!this.websocket) {
+        const url = (util.getStorage('wshost') || '') + wss;
+        this.websocket = new SockJS(url);
+      }
+
+      if (!this.console) {
+        this.client.debug = null;
+      }
+      this.handleConnect(this.client);
+    },
+    handleConnect(client) {
+      client.connect(
+        {},
+        () => {
+          //localStorage.setItem("socket",true);
+          //订阅服务端的
+          client.subscribe(topic, response => {
+            let res = JSON.parse(response.body);
+            let data = res.data;
+            for (let i in data) {
+              if (data[i] !== null && data[i] !== undefined) {
+                if (i === 'onlineUserNums' && data[i] > 0) {
+                  this.online = data[i];
+                }
+                if (i === 'sysMsgNums') {
+                  this.notice = data[i];
+                  if (this.showMsg) {
+                    this.$refs.message.getMsg(true);
+                  }
+                }
+                if (i === 'menuTipsMap') {
+                  this.menuTips = data[i];
+                }
+                if (i === 'sysMsgList') {
+                  this.sysMsg = data[i];
+                }
+                if (i === 'extraData') {
+                  this.extraData = data[i];
+                }
+              }
+            }
+          });
+        },
+        error => {
+          console.log('webSocket连接失败');
+          if (this.connect < 10 && !util.getStorage('timer')) {
+            this.handleConnect(client);
+          } else {
+            client.disconnect();
+          }
+        }
+      );
+    },
+    handleOpened(res) {
+      if (!res) {
+        this.sysMsgOut = setTimeout(() => {
+          this.sysMsg = [];
+        }, 3000);
+      } else if (this.sysMsgOut) {
+        clearTimeout(this.sysMsgOut);
+      }
+    },
+    handleDialog(obj) {
+      this.dialog = obj;
+    },
+    handleUserModel(name, val) {
+      this.$set(this.userModel, name, val);
+    },
+    handleMenuTips(id, num) {
+      if (num) {
+        this.$set(this.menuTips, id, num);
+      } else {
+        let n = parseInt(this.menuTips[id], 10) - 1;
+        this.$set(this.menuTips, id, n);
+      }
+    },
+    handleReLogin(res) {
+      if (res && typeof res == 'string') {
+        res = JSON.parse(res);
+      }
+      let msg = '提示';
+      let btn = {
+        confirmButtonText: '确定',
+        cancelButtonText: '取消',
+        closeOnClickModal: false,
+        type: 'warning'
+      };
+      if (res) {
+        if (res.rCode === 69) {
+          msg = '该账号在其他地方已登陆!';
+          btn = {
+            confirmButtonText: '确定',
+            closeOnClickModal: false,
+            type: 'warning'
+          };
+        } else {
+          msg = '登录已过期，请重新登录！';
+        }
+      }
+      this.$confirm(msg, btn)
+        .then(() => {
+          util.removeStorage([
+            'Authorization',
+            'token',
+            'ssId',
+            'userId',
+            'userName',
+            'auth',
+            'deviceUnique',
+            'menus',
+            'useCaseCodes',
+            'mainConfig'
+          ]);
+          if (util.win.top.location.href.indexOf('main.html') > -1) {
+            util.win.top.location.href = './login.html';
+          } else {
+            const hash = util.win.top.location.hash;
+            if (hash) {
+              const len = util.win.top.location.href.indexOf(hash);
+              let href = util.win.top.location.href.slice(0, len) + '#/login';
+              util.win.top.location.href = href;
+            } else {
+              const loginPage =
+                util.getStorage('login') || util.getStorage('loginPage');
+              if (loginPage) {
+                util.win.top.location.href = loginPage;
+              } else {
+                util.win.top.location.href = '/login.html';
+              }
+            }
+          }
+        })
+        .catch(e => {});
+    },
+    openPage(url, name, width, height) {
+      let src = url;
+      if (!util.startWith(url, ['http', '/'])) {
+        let pathname = window.location.pathname;
+        if (pathname !== '/') {
+          pathname = pathname.split('/');
+          pathname.splice(pathname.length - 1);
+          pathname = pathname.join('/');
+        }
+        src = pathname + url.replace('./', '');
+      }
+      if (name) {
+        let w = width ? width : util.win.top.screen.availWidth - 10;
+        let h = height ? height : util.win.top.screen.availHeight - 60;
+        util.win.open(
+          src,
+          name,
+          `width=${w}px,height=${h}px,resizable=yes,status=yes,menubar=no,scrollbars=yes`
+        );
+      } else {
+        util.win.open(src);
+      }
+    }
+  },
+
+  beforeDestroy() {
+    if (this.client && this.client.connected) {
+      this.client.disconnect();
+    }
+  }
+};
+</script>