icore-pass/src/components/main.vue

<template>
  <div class="main mainVueIndex" :class="current_theme" id="defaultpage">
    <div class="oa-header-user" v-if="showIframe">
      <h3 v-show="menuType === '2'" class="oa-user-name" style="color: #fff">
        {{ store.state.userInfo ? store.state.userInfo.userName : "" }}
      </h3>
      <div class="oa-header-upt">
        <a
          ><template>
            <img
              @click="changeMenuType"
              v-if="userInfo.photo"
              class="oa-sign-tul-ui"
              :src="
                'data:image/' + userInfo.photo + ';base64,' + userInfo.photo
              "
              alt="头像"
            />
            <img
              @click="changeMenuType"
              v-else
              class="oa-sign-tul-ui"
              src="../../static/img/photo-default.png"
              alt="头像"
            /> </template
        ></a>
      </div>
      <div class="oa-header-ucon">
        <div class="oa-header-ulist">
          <div class="oa-header-uin">
            <template>
              <img
                v-if="userInfo.photo"
                class="oa-sign-tul-ui"
                :src="
                  'data:image/' + userInfo.photo + ';base64,' + userInfo.photo
                "
                alt="头像"
                @click="photoModal = true"
              />
              <img
                v-else
                class="oa-sign-tul-ui"
                src="../../static/img/photo-default.png"
                alt="头像"
                @click="photoModal = true"
              />
            </template>
            <h3>
              {{ store.state.userInfo ? store.state.userInfo.userName : "" }}
            </h3>
          </div>
          <ul class="oa-header-uul">
            <li @click="showPersonInfo()">
              <span class="st-icons st-icons-user"></span>个人信息
            </li>
            <li @click="pwdModal.show = true">
              <span class="st-icons st-icons-pwd"></span>修改密码
            </li>
            <!-- <li @click="signOut">
                        <span class="st-icons st-icons-out"></span>退出登录
                    </li> -->
            <li @click="signOut">
                <span class="st-icons st-icons-out"></span>退出登录
            </li>        
          </ul>
        </div>
      </div>
    </div>
    <div
      v-show="showIframe"
      class="icore-menu-main overFlowSet"
      :class="{ 'icore-menu-main2': menuType === '2' }"
    >
      <div id="menuDrag" v-if="menuType === '2'" class="menuDrag"></div>
      <el-menu
        :default-active="menuData.length > 1 ? '1' : '0-0'"
        :collapse="menuType === '1'"
        class="el-menu-vertical-demo icore-menu icore-menu-level1"
        v-for="(item, index) in menuData"
        :key="item.id"
        @open="handleOperate"
        @close="handleOperate"
      >
        <el-submenu
          :index="index + ''"
          v-if="item.menuType && Number(item.status)"
        >
          <template slot="title">
            <i
              class="icore-menu-lic icore-menu-icons icore-icons-menu-default"
              :class="item.menuIcon ? item.menuIcon : ''"
            ></i>
            <div class="icore-menu-lit marignL15 nameText">{{ item.name }}</div>
          </template>
          <template v-for="(sitem, sindex) in item.children">
            <el-submenu
              :index="index + '-' + sindex"
              v-if="
                sitem.children &&
                sitem.children.length > 0 &&
                allNoMenu(sitem.children) &&
                Number(sitem.status)
              "
              :key="sitem.id"
              @click.native="
                selectMenu(sitem, [
                  { menuId: 1, menuLabel: item.name },
                  { menuId: 2, menuLabel: sitem.name },
                ])
              "
            >
              <template slot="title">
                <span>{{ sitem.name }}</span>
              </template>
              <template v-for="(ssitem, ssindex) in sitem.children">
                <el-submenu
                  :index="index + '-' + sindex + '-' + ssindex"
                  v-if="
                    ssitem.children &&
                    ssitem.children.length > 0 &&
                    allNoMenu(ssitem.children) &&
                    Number(ssitem.status)
                  "
                  :key="ssitem.id"
                >
                  <template slot="title">
                    <span>{{ ssitem.name }}</span>
                  </template>
                  <template v-for="(sssitem, sssindex) in ssitem.children">
                    <el-menu-item
                      @click.native="
                        selectMenu(sssitem, [
                          { menuId: 1, menuLabel: item.name },
                          { menuId: 2, menuLabel: sitem.name },
                          { menuId: 3, menuLabel: ssitem.name },
                          { menuId: 4, menuLabel: sssitem.name },
                        ])
                      "
                      v-if="
                        (sssitem.menuType === '1' ||
                          sssitem.menuType === '4') &&
                        Number(sssitem.status)
                      "
                      :index="
                        index + '-' + sindex + '-' + ssindex + '-' + sssindex
                      "
                      :key="sssitem.id"
                      >{{ sssitem.name }}</el-menu-item
                    >
                    <!-- 分割线 -->
                    <el-menu-item
                      class="nav_menu"
                      v-if="sssitem.menuType === '3' && Number(sssitem.status)"
                      :index="
                        index + '-' + sindex + '-' + ssindex + '-' + sssindex
                      "
                      :key="sssitem.id"
                    >
                      <template>
                        <div></div>
                      </template>
                    </el-menu-item>
                    <!-- 停用菜单 -->
                    <el-menu-item
                      v-if="Number(sssitem.status) === 0"
                      :index="
                        index + '-' + sindex + '-' + ssindex + '-' + sssindex
                      "
                      :key="sssitem.id"
                      >{{ sssitem.name }}</el-menu-item
                    >
                  </template>
                </el-submenu>
                <!-- 停用菜单 -->
                <el-menu-item
                  :index="index + '-' + sindex + '-' + ssindex"
                  class="closeMenu"
                  v-if="Number(ssitem.status) === 0"
                  :key="ssitem.id"
                >
                  {{ ssitem.name }}
                </el-menu-item>
                <!-- 分割线 -->
                <el-menu-item
                  class="nav_menu"
                  :index="index + '-' + sindex + '-' + ssindex"
                  v-if="
                    (!ssitem.children ||
                      ssitem.children.length === 0 ||
                      !allNoMenu(ssitem.children)) &&
                    ssitem.menuType === '3' &&
                    Number(ssitem.status)
                  "
                  :key="ssitem.id"
                >
                  <template>
                    <div></div>
                  </template>
                </el-menu-item>
                <!-- 分割线 END -->
                <el-menu-item
                  @click.native="
                    selectMenu(ssitem, [
                      { menuId: 1, menuLabel: item.name },
                      { menuId: 2, menuLabel: sitem.name },
                      { menuId: 3, menuLabel: ssitem.name },
                    ])
                  "
                  :index="index + '-' + sindex + '-' + ssindex"
                  v-if="
                    (!ssitem.children ||
                      ssitem.children.length === 0 ||
                      !allNoMenu(ssitem.children)) &&
                    (ssitem.menuType === '1' || ssitem.menuType === '4') &&
                    Number(ssitem.status)
                  "
                  :key="ssitem.id"
                  >{{ ssitem.name }}</el-menu-item
                >
              </template>
            </el-submenu>
            <!-- 停用菜单 -->
            <el-menu-item
              :index="index + '-' + sindex"
              class="closeMenu"
              v-if="Number(sitem.status) === 0"
              :key="sitem.id"
            >
              {{ sitem.name }}
            </el-menu-item>
            <el-menu-item
              @click.native="
                selectMenu(sitem, [
                  { menuId: 1, menuLabel: item.name },
                  { menuId: 2, menuLabel: sitem.name },
                ])
              "
              :index="index + '-' + sindex"
              v-if="
                (!sitem.children ||
                  sitem.children.length === 0 ||
                  !allNoMenu(sitem.children)) &&
                (sitem.menuType === '1' || sitem.menuType === '4') &&
                Number(sitem.status)
              "
              :key="sitem.id"
              >{{ sitem.name }}</el-menu-item
            >
          </template>
        </el-submenu>
      </el-menu>
    </div>
    <section
      class="sl-container"
      :class="{ 'sl-container2': menuType === '2' }"
      id="mainContainer"
    >
      <header class="sl-header">
        <div v-if="showIframe" class="sl-header-ul">
          <!-- <div class="sl-header-li-name">工业互联网平台 ICP-iCore 2.0</div> -->
          <div class="hnstLogo">
            <img src="../assets/img/logo_1.png" alt="" />
          </div>
          <!-- 下拉选择公司 -->
          <div
            class="company-select"
            v-if="companys !== '' && companys.length >= 1"
          >
            <span
              class="ifCompany el-dropdown-link"
              v-if="companys.length === 1"
              >{{ companyName }}</span
            >
            <el-dropdown trigger="click" @command="selectComPany" v-else>
              <span class="el-dropdown-link">
                {{ companyName
                }}<i class="el-icon-arrow-down el-icon--right"></i>
              </span>
              <el-dropdown-menu slot="dropdown">
                <div v-for="item in companys" :key="item.id">
                  <el-dropdown-item :command="item">{{
                    item.companyName
                  }}</el-dropdown-item>
                </div>
              </el-dropdown-menu>
            </el-dropdown>
            <el-dropdown
              trigger="click"
              @command="selectOrg"
              v-if="orgDutyLinks.length > 0"
              :style="{
                marginLeft: !styleControll ? '100px' : '20px',
                fontSize: '12px',
              }"
            >
              <span class="el-dropdown-link">
                {{ orgName }}<i class="el-icon-arrow-down el-icon--right"></i>
              </span>
              <el-dropdown-menu slot="dropdown">
                <div v-for="item in orgDutyLinks" :key="item.orgId">
                  <el-dropdown-item :command="item">{{
                    item.orgName
                  }}</el-dropdown-item>
                </div>
              </el-dropdown-menu>
            </el-dropdown>
            <span style="margin-left: 20px; font-size: 12px">{{
              dutyName
            }}</span>
          </div>
          <div class="sl-header-li-lgbc">
            <span class="icore-icons icore-icons-right-arrow am-xz"></span>
            <span class="sl-breadcrumb-text">当前位置：</span>
            <el-breadcrumb
              separator-class="el-icon-arrow-right"
              class="sl-breadcrumb-list"
            >
              <el-breadcrumb-item
                v-for="item in pageBreadcrumb"
                :key="'bdb' + item.menuId"
                >{{ item.menuLabel }}</el-breadcrumb-item
              >
            </el-breadcrumb>
          </div>
          <div class="sl-header-li-websocket">
            <el-badge
              :value="task1Num + task2Num"
              :max="99"
              class="item"
              style="margin-right: 20px"
              v-if="task1Num + task2Num > 0"
            >
              <el-button type="text" size="small" @click="goMyTaskPage"
                >待办任务</el-button
              >
            </el-badge>
            <el-badge
              :value="myMessageLength"
              :max="99"
              class="item"
              v-if="myMessageLength > 0"
            >
              <el-button type="text" size="small" @click="goNoticePage"
                >公告</el-button
              >
            </el-badge>
          </div>
          <div class="theme-defined">
            <div
              @click="fullScreenEvent"
              :class="fullScreen ? 'icore-return-screen' : 'icore-full-screen'"
              :title="fullScreen ? '退出全屏' : '全屏'"
            ></div>
            <div @click="themeEvent" class="icore-theme" title="主题"></div>
            <div @click="lockEvent" class="icore-lock" title="锁屏"></div>
            <div @click="backMain" class="icore-main" title="主页"></div>
          </div>
        </div>
      </header>
      <div class="sl-content-main">
        <template v-if="showIframe">
          <default-vue
            :menuData="menuData"
            @gotoSetPage="gotoSetPage"
            v-if="tabsData.length === 0"
          ></default-vue>
          <el-tabs
            id="menuTabId"
            v-show="tabsData.length > 0"
            v-model="selectedMenu"
            type="card"
            closable
            @tab-remove="removeTab"
            @tab-click="handleClick"
            style="padding: 10px 0px 0px; height: 100%"
          >
            <el-tab-pane
              :label="item.name"
              :name="item.menuId"
              :key="item.menuId"
              v-for="(item, index) in tabsData"
            >
              <span @contextmenu="rightShow($event, index, item)" slot="label">
                {{ item.name }}
              </span>
              <div class="pageBreadcrumb">
                {{ JSON.stringify(item.pageBreadcrumb) }}
              </div>
              <iframe
                :src="
                  isDev(item.menuUrl)
                    ? getDevUrl(item.menuUrl)
                    : toTrustUrl(item.menuUrl)
                "
                :style="minHeight"
              ></iframe>
              
            </el-tab-pane>
          </el-tabs>
          <div class="contextmenu">
            <el-dropdown
              trigger="click"
              @visible-change="visibleChange"
              @command="handleCommand"
            >
              <span class="el-dropdown-link" v-show="false">
                下拉菜单<i
                  id="setClick"
                  class="el-icon-arrow-down el-icon--right"
                ></i>
              </span>
              <el-dropdown-menu slot="dropdown">
                <el-dropdown-item command="a">关闭标签页</el-dropdown-item>
                <el-dropdown-item :disabled="tabsData.length === 1" command="b"
                  >关闭其他标签页</el-dropdown-item
                >
                <el-dropdown-item
                  :disabled="tabsData.length - menuTabIndex === 1"
                  command="c"
                  >关闭右侧标签页</el-dropdown-item
                >
                <el-dropdown-item command="d">刷新当前标签页</el-dropdown-item>
              </el-dropdown-menu>
            </el-dropdown>
          </div>
        </template>
        <transition
          enter-active-class="fade-in"
          leave-active-class="leave-immediately"
          :duration="{ enter: 400, leave: 100 }"
          ref="childrenPage"
        >
          <router-view
            @updateTaskNum="updateTaskNum"
            @updateMessageNum="updateMessageNum"
          >
          </router-view>
        </transition>
      </div>
    </section>
    <!--  -->
    <div
      is="usersAddAndEdit"
      v-if="userModal.show"
      :operate="'edit'"
      :operate1="'index'"
      :item="userInfo"
      @on-then="userModalThen"
      @on-close="userModalClose"
      @editFinish="updataUserInfo"
    ></div>
    <!--  -->
    <!-- 修改密码 -->
    <el-dialog
      ref="pwdModal"
      :visible.sync="pwdModal.show"
      class="oa-pwd-modal"
      title="修改密码"
      width="500px"
      @open="openPwd"
    >
      <el-form
        ref="pwdModal"
        :model="pwdModal.form"
        :rules="pwdModal.ruleValidate"
        label-width="120px"
        style="padding-right: 40px"
      >
        <el-form-item label="原密码" prop="userid" v-show="false">
          <el-input
            size="small"
            type="text"
            v-model="pwdModal.form.userid"
            :maxlength="64"
          ></el-input>
        </el-form-item>
        <el-form-item label="原密码" prop="prepassword">
          <el-input
            size="small"
            type="password"
            v-model="pwdModal.form.prepassword"
            :maxlength="64"
          ></el-input>
        </el-form-item>
        <el-form-item label="新密码" prop="newpassword">
          <el-input
            size="small"
            type="password"
            @input="inputThing"
            v-model="pwdModal.form.newpassword"
            :maxlength="64"
          ></el-input>
          <div
            class="strongBox"
            v-show="strongShow"
            :style="{ backgroundColor: strongColor }"
          >
            {{ strongText }}
          </div>
        </el-form-item>
        <el-form-item label="确认密码" prop="againNewpassword">
          <el-input
            size="small"
            type="password"
            v-model="pwdModal.form.againNewpassword"
            :maxlength="64"
          ></el-input>
        </el-form-item>
      </el-form>
      <div slot="footer" class="dialog-footer">
        <el-button size="small" @click="pwdModal.show = false">取 消</el-button>
        <el-button
          size="small"
          :loading="pwdModal.loading"
          type="primary"
          @click="pwdSubmit('pwdModal')"
          >确 定</el-button
        >
      </div>
    </el-dialog>

    <!-- 锁屏 -->
    <el-dialog
      title="锁屏"
      v-if="lockEventFlag"
      :visible.sync="lockEventFlag"
      width="500px"
    >
      <el-form
        :model="lockRuleForm"
        :rules="lockRules"
        ref="lockRuleForm"
        label-width="150px"
      >
        <el-form-item label="锁屏密码" prop="pwd">
          <el-input
            :class="checkedByLogin ? 'lockInput' : ''"
            :disabled="checkedByLogin"
            @keyup.enter.native="lockEventSet"
            v-model="lockRuleForm.pwd"
            style="width: 250px"
          ></el-input>
          <el-checkbox v-model="checkedByLogin">使用登录密码</el-checkbox>
        </el-form-item>
      </el-form>
      <div slot="footer" class="dialog-footer">
        <el-button @click="lockEventFlag = false">取 消</el-button>
        <el-button type="primary" @click="lockEventSet">确 定</el-button>
      </div>
    </el-dialog>
    <!-- /修改密码 -->
    <div v-if="lockScreenPwd" class="lock_screen">
      <div
        v-if="lockErrorMsg"
        class="el-message el-message--error"
        style="z-index: 2033"
      >
        <i class="el-message__icon el-icon-error"></i>
        <p class="el-message__content">密码错误！</p>
      </div>
      <div
        style="
          margin: 0 auto;
          width: 300px;
          position: relative;
          top: 45%;
          transform: translateY(-50%);
        "
      >
        <div>
          <el-input
            ref="lockInput"
            class="lockInput"
            placeholder="请输入密码"
            @keyup.enter.native="setLock"
            type="text"
            v-model="inputLockPwd"
          >
            <template slot="append">
              <div @click="setLock" class="lock_route">
                <i class="el-icon-back"></i>
              </div>
            </template>
          </el-input>
        </div>

        <div style="padding: 10px">
          忘记密码？
          <a
            @click="lockSignOut"
            style="text-decoration: underline; color: #409eff; cursor: pointer"
            >退出登录</a
          >
        </div>
      </div>
    </div>
    <!-- 切换主题 -->
    <el-dialog
      title="选择主题"
      v-if="themeSetFlag"
      :visible.sync="themeSetFlag"
      width="30%"
    >
      <el-radio-group v-model="current_theme">
        <el-radio
          :label="theme.label"
          :key="theme.label"
          v-for="theme in theme_group"
          >{{ theme.desc }}</el-radio
        >
      </el-radio-group>
      <div slot="footer" class="dialog-footer"></div>
    </el-dialog>
    <!-- 权限被修改 -->
    <el-dialog
      v-if="privilegeUpdateIfo"
      :visible.sync="privilegeUpdateIfo"
      width="35%"
      top="20vh"
      :close-on-click-modal="false"
      :close-on-press-escape="false"
      :show-close="false"
      class="privilegeArea"
    >
      <span v-if="closeSecond > 0" style="font-size: 18px; color: #333">
        <i class="el-icon-warning"></i>
        {{ " 您的权限已被管理员修改，" + closeSecond + "s后将自动退出" }}
      </span>
      <span v-else style="font-size: 20px; color: #f56c6c">
        <i class="el-icon-loading"></i>
        {{ "正在为您退出，请稍后..." }}
      </span>
      <div slot="footer" class="dialog-footer" v-if="closeSecond > 0">
        <el-button type="primary" size="small" @click="closeConfirm"
          >确 定</el-button
        >
      </div>
    </el-dialog>
  </div>
</template> 

<script>
import element_css_json_import from "../assets/json/element_css.js";
import objectAssign from "object-assign";
import generateColors from "./utils/color";
import usersAddAndEdit from "@/views/systemConfig/components/usersAddAndEdit.vue";
import { getCookie } from "@/utils/util.js";
import { checkCharLength } from "@/utils/validator.js";
import store from "@/store/index.js";
//  字典数据
import dataDictionary from "@/store/dataDictionary.js";
// import defaultVue from "./defaultVue.vue";
import defaultVue from '@/views/homepage/components/homepage.vue'
import { proPath } from "@/config/config.js";
import draggable from "vuedraggable";
export default {
  components: {
    usersAddAndEdit,
    defaultVue,
  },
  data() {
    const validateLockPass = (rule, value, callback) => {
      if (value === "") {
        callback(new Error("请输入锁屏密码"));
      } else {
        let reg = /^[A-Za-z0-9]+$/;
        if (!reg.test(value)) {
          return callback(new Error("请输入英文和数字"));
        }
        callback();
      }
    };
    const validatePass = (rule, value, callback) => {
      if (value === "") {
        callback(new Error("请输入新密码"));
      } else {
        if (this.regular !== "") {
          let reg = eval("/" + this.regular + "/");
          if (!reg.test(value)) {
            let message =
              this.regularType === 1
                ? "至少包含英文、数字、特殊符号中的两种！"
                : "";
            message +=
              "长度需在" + this.minLength + "-" + this.maxLength + "之间";
            return callback(new Error(message));
          }
        } else {
          this.getPwdValid();
          this.$refs.pwdModal.validateField("newpassword");
        }
        // let reg = /^[A-Za-z0-9]+$/
        // if (!reg.test(value)) {
        //   return callback(new Error('请输入英文和数字'));
        // }
        if (this.pwdModal.form.againNewpassword !== "") {
          // 对第二个密码框单独验证
          this.$refs.pwdModal.validateField("againNewpassword");
        }
        callback();
      }
    };
    const validatePassCheck = (rule, value, callback) => {
      if (value === "") {
        callback(new Error("请再次输入新密码"));
      } else if (value !== this.pwdModal.form.newpassword) {
        callback(new Error("两次输入密码不一致"));
      } else {
        callback();
      }
    };
    return {
      dutyName: "",
      regular: "", // 密码策略校验正则表达式
      regularType: "",
      minLength: 0,
      maxLength: 0,
      websocket: "",
      interval: "",
      companys: [], // 用户公司列表
      companyId: "", // 选择公司Id
      companyName: "", // 选择公司名称
      checkedByLogin: false,
      strongShow: false,
      digit: false,
      strongText: "",
      strongColor: "",
      originalStyle: "",
      colors: {
        primary: "#20a0ff",
      },
      theme_color: "#409EFF",
      current_theme: "deepBlue_theme",
      theme_group: [
        {
          label: "basic_theme",
          desc: "默认主题",
        },
        {
          label: "deepBlue_theme",
          desc: "深蓝色主题",
        },
        {
          label: "dark_theme",
          desc: "黑色主题",
        },
        {
          label: "red_theme",
          desc: "红色主题",
        },
      ],
      theme_origin_color: {
        basic_theme: "#409EFF",
        deepBlue_theme: "#072ec5",
        dark_theme: "#000000",
        red_theme: "#F20808",
      },
      themeSetFlag: false,
      lockErrorMsg: false,
      inputLockPwd: "",
      lockScreenPwd: window.top.localStorage.getItem("lockpwd"),
      lockEventFlag: false,
      lockRuleForm: {
        pwd: "",
      },
      lockRules: {
        pwd: [
          {
            required: true,
            message: "请输入锁屏密码",
            trigger: "blur",
          },
          {
            min: 1,
            max: 128,
            message: "长度在 1 到 128 个字符",
            trigger: "change",
          },
          {
            validator: validateLockPass,
            trigger: "change",
          },
        ],
      },
      fullScreen: false,
      minHeight: "width: 100%;height: 100%;border: 0px;min-height: 777px",
      menuTabIndex: 0,
      pageBreadcrumb: [
        {
          menuId: 1,
          menuLabel: "首页",
        },
      ],
      widthLog: "",
      leftLog: "",
      dragFlag: false,
      store,
      dataDictionary,
      showIframe: false,
      selectedMenu: "",
      menuType: "2",
      menuData: store.state.routes,
      tabsData: [],
      userInfo: {},
      userModal: {
        show: false,
      },
      //  修改密码
      pwdModal: {
        loading: false,
        show: false,
        form: {
          userid: "",
          prepassword: "",
          newpassword: "",
          //  重复密码
          againNewpassword: "",
        },
        ruleValidate: {
          prepassword: [
            {
              required: true,
              message: "原密码不能为空",
              trigger: "blur",
            },
          ],
          newpassword: [
            {
              required: true,
              message: "新密码不能为空",
              trigger: "blur",
            },
            // { type: 'string', max: 64, message: '密码不能多于64个字符', trigger: 'blur' },
            {
              validator: validatePass,
              trigger: "blur",
            },
          ],
          againNewpassword: [
            {
              required: true,
              message: "确认密码不能为空",
              trigger: "blur",
            },
            // { type: 'string', max: 64, message: '密码不能多于64个字符', trigger: 'blur' },
            {
              validator: validatePassCheck,
              trigger: "blur",
            },
          ],
        },
      },
      inter: undefined,
      task1Num: 0, // 我的待办任务
      task2Num: 0, // 委托待办任务
      myMessageLength: 0, // 我收到的公告
      privilegeUpdateIfo: false, // 权限被修改后退出提示框
      closeSecond: 5, // 系统退出倒计时
      mainPageList: [], //设为主页的菜单页面
      orgName: "",
      orgId: "",
      orgCode: "",
      orgDutyLinks: [],
      styleControll: false,
      dutyId: "",
      appId: '',
    };
  },
  created() {
    this.current_theme = window.top.localStorage.getItem("current_theme")
      ? window.top.localStorage.getItem("current_theme")
      : "deepBlue_theme";
    this.theme_color = this.theme_origin_color[this.current_theme];
    this.getIndexStyle();
    let w = document.documentElement.clientWidth || document.body.clientWidth;
    let h = document.documentElement.clientHeight || document.body.clientHeight;
    if (w <= 1500) {
      this.styleControll = true;
    } else {
      this.styleControll = false;
    }
  },
  destroyed() {
    // 销毁浏览器返回监听
    // window.removeEventListener('popstate', this.goBack, false);
    clearInterval(this.inter);
    // 销毁websocket监听
    // this.websocket.onclose = this.close();
  },
  computed: {},
  beforeCreate() {
    let userId = getCookie("userId");
    this.appId = getCookie("appId");
    let menuId = window.top.localStorage.getItem("activeMenu");
    let companyId = window.top.localStorage.getItem("companyId");
  },
  watch: {
    checkedByLogin: function (n) {
      if (n) {
        try {
          this.lockRuleForm.pwd = JSON.parse(getCookie("userInfo")).password;
        } catch (error) {
          this.lockRuleForm.pwd = "";
        }
      } else {
        this.lockRuleForm.pwd = "";
      }
    },
    theme_color: function (newV, oldV) {
      let that = this;
      that.colors.primary = newV;
      console.log(newV);
      console.log($(document.getElementsByTagName("iframe")));
      window.colorVal = newV;
      that.primaryColor = this.colors.primary;
      that.colors = objectAssign(
        {},
        that.colors,
        generateColors(that.colors.primary)
      );
      let theme_style = that.originalStyle;
      Object.keys(that.colors).forEach((key) => {
        theme_style = theme_style.replace(
          new RegExp("(:|\\s+)" + key, "g"),
          "$1" + that.colors[key]
        );
      });
      that.loadNewStyle(document, theme_style);
      for (let i = 0; i < document.getElementsByTagName("iframe").length; i++) {
        try {
          that.loadNewStyle(
            document.getElementsByTagName("iframe")[i].contentDocument,
            theme_style
          );
        } catch (err) {}
      }
    },
    current_theme: function (n) {
      let that = this;
      window.top.localStorage.setItem("current_theme", n);
      that.theme_color = that.theme_origin_color[n];
      for (let i = 0; i < document.getElementsByTagName("iframe").length; i++) {
        try {
          document
            .getElementsByTagName("iframe")
            [i].contentDocument.getElementsByClassName(
              "mainVueIndex"
            )[0].className = "main mainVueIndex " + n;
        } catch (err) {}
      }
    },
    menuType: function (newV, oldV) {
      let that = this;
      if (newV === "2") {
        that.$nextTick(function () {
          $(".icore-menu-main2").css({
            width: that.widthLog,
          });
          $(".sl-container2").css({
            "padding-left": that.leftLog,
          });
          $(".oa-header-user").css({
            width: that.widthLog,
          });
          $(".oa-header-upt").css({
            width: "",
          });
          that.setDrag();
        });
      } else {
        that.widthLog = $(".icore-menu-main2").css("width");
        that.leftLog = $(".sl-container2").css("padding-left");
        $(".icore-menu-main2").css({
          width: "",
        });
        $(".sl-container2").css({
          "padding-left": "",
        });
        $(".oa-header-user").css({
          width: "80px",
        });
        $(".oa-header-upt").css({
          width: "80px",
        });
      }
    },
  },
  mounted() {
    let that = this;
    window.onresize = function () {
      let isFull =
        document.fullscreen ||
        document.webkitIsFullScreen ||
        document.msFullscreenEnabled;
      isFull = isFull ? true : false;
      if (that.fullScreen !== isFull) {
        //要执行的动作
        that.fullScreen = isFull;
      }
    };
    // // 监控浏览器返回
    // if (window.history && window.history.pushState) {
    //     history.pushState(null, null, document.URL);
    //     window.addEventListener('popstate', this.goBack, false);
    // }

    //  取字典（用处不明，且加入租户id后报错！！！！！暂时注释掉！！！！！！！！！！）
    // this.dataDictionary.dispatch('list').then(() => {
    //   // console.log(this.dataDictionary.state.dict)
    // });
    this.showIframeEvent();
    this.$nextTick(() => {
      this.minHeight =
        "width: 100%;height: 100%;border: 0px;min-height: " +
        ($("#menuTabId").height() - 91) +
        "px";
      that.checkedByLogin = true;
    });

    // 获取公司信息
    this.companyId = window.top.localStorage.getItem("companyId");
    this.companys = JSON.parse(window.top.localStorage.getItem("companys"));
    if (this.companyId !== "" && this.companyId !== null) {
      this.companyName = this.companys.find(
        (x) => x.id === this.companyId
      ).companyName;
    }
    setTimeout(() => {
      this.current_theme = window.top.localStorage.getItem("current_theme")
        ? window.top.localStorage.getItem("current_theme")
        : "deepBlue_theme";
    }, 1000);
    // 获取我的待办任务
    var arr = ["#/authManage"];
    if($.inArray(location.hash, arr) == -1){
        //that.getMyToDoDelegateTask();
        //that.getMyToDoTask();        
    }

    that.getMyMessage();
    // 直接关闭浏览器窗口或者标签页时,关闭websocket连接
    // window.onbeforeunload = function () {
    //     // that.send("closesocket:");
    //     that.close();
    // }
    // 获取当前密码策略校验
    that.getPwdValid();
    // 获取机构职级
    that.getOrgDutyList();
  },
  methods: {
    // 判断是否为公司其他平台模块且处于开发模式
    isDev(url) {
      let isDevModule = false;
      if (
        url.indexOf("steerinfo.com") !== -1 &&
        document.domain.indexOf("steerinfo.com") === -1
      ) {
        isDevModule = true;
      }
      return isDevModule;
    },
    // 根据当前模式更改菜单跳转url
    getDevUrl(url) {
      let newUrl = "";
      let index = url.indexOf("steerinfo.com");
      return (newUrl = url
        .substring(index)
        .replace("steerinfo.com/views", "."));
    },
    // 根据https/http跳转
    toTrustUrl(url) {
      let newUrl = "";
      if (url.indexOf("https:") === -1 && url.indexOf("http:") > -1) {
        newUrl = url.replace("http:", window.top.location.protocol);
      } else if (url.indexOf("https:") > -1) {
        newUrl = url.replace("https:", window.top.location.protocol);
      } else {
        newUrl = url;
      }
      return newUrl;
    },
    // 获取当前密码策略
    getPwdValid() {
      this.axios
        .get("pass/v1/syspwdpolicys/getExecutingPwdPolicy")
        .then((res) => {
          if (res.code === "0") {
            this.regular = res.data.regular;
            this.regularType = res.data.regularType;
            this.minLength = res.data.minLength;
            this.maxLength = res.data.maxLength;
          } else {
            this.$message.error(res.message);
          }
        })
        .catch((err) => {
          console.log(err);
        });
    },
    /**
     * 样式加载
     *
     */
    loadNewStyle(doc, theme_style) {
      let child = doc.getElementById("theme");
      if (child !== null) {
        doc.getElementsByTagName("head")[0].removeChild(child);
      }
      let a = document.createElement("style");
      a.setAttribute("id", "theme");
      a.innerHTML = theme_style;
      doc.getElementsByTagName("head")[0].appendChild(a);
    },
    // 验证密码强度的事件
    inputThing(val) {
      let _this = this;
      let arr = [];
      let i = 0;
      arr[0] = /[^a-zA-Z0-9_]/g;
      arr[1] = /[a-z]/g;
      arr[2] = /[0-9]/g;
      arr[3] = /[A-Z]/g;
      if (val.length >= 6) {
        arr.forEach((res) => {
          if (val.match(res)) {
            i++;
          }
        });
        switch (i) {
          case 0:
            _this.strongShow = false;
            break;
          case 1:
            _this.strongShow = true;
            _this.strongText = "弱";
            _this.strongColor = "#F26299";
            _this.digit = true;
            break;
          case 2:
            _this.strongShow = true;
            _this.strongText = "中";
            _this.strongColor = "#F29E55";
            break;
          case 3:
            _this.strongShow = true;
            _this.strongText = "强";
            _this.strongColor = "#4CD995";
            break;
        }
      } else if (!val) {
        _this.strongShow = false;
      } else {
        _this.strongShow = true;
        _this.strongText = "弱";
        _this.strongColor = "#F26299";
        _this.digit = false;
      }
    },
    /**
     * 加载全局样式；
     */
    getStyleTemplate(data) {
      const colorMap = {
        "#3a8ee6": "shade-1",
        "#409eff": "primary",
        "#53a8ff": "light-1",
        "#66b1ff": "light-2",
        "#79bbff": "light-3",
        "#8cc5ff": "light-4",
        "#a0cfff": "light-5",
        "#b3d8ff": "light-6",
        "#c6e2ff": "light-7",
        "#d9ecff": "light-8",
        "#ecf5ff": "light-9",
      };
      Object.keys(colorMap).forEach((key) => {
        const value = colorMap[key];
        data = data.replace(new RegExp(key, "ig"), value);
      });
      return data;
    },

    getIndexStyle() {
      let data = `@charset "UTF-8"; ${element_css_json_import.element_css}`;
      this.originalStyle = this.getStyleTemplate(data);
    },
    /**
     * 解除锁屏
     *
     */
    setLock() {
      let that = this;
      let crypto = require("crypto");
      if (
        that.lockScreenPwd === that.inputLockPwd ||
        that.lockScreenPwd ===
          crypto.createHash("sha1").update(that.inputLockPwd).digest("hex")
      ) {
        window.top.localStorage.setItem("lockpwd", "");
        that.lockScreenPwd = "";
        that.inputLockPwd = "";
      } else {
        that.inputLockPwd = "";
        that.lockErrorMsg = true;
        setTimeout(() => {
          that.lockErrorMsg = false;
        }, 1000);
      }
    },
    /**
     * 锁屏退出登录
     */
    lockSignOut() {
      let that = this;
      that.store
        .dispatch("loginOut")
        .then(function (res) {
          window.location.href = "./index.html";
        })
        .catch(function () {
          // TODO
        });
    },
    /**
     *打开主页
     */
    backMain() {
      window.open(
        window.location.protocol + "//portal.steerinfo.com",
        "_blank"
      );
    },
    /**
     * 主题
     */
    themeEvent() {
      let that = this;
      that.themeSetFlag = true;
    },
    /**
     * 锁屏
     */
    lockEvent() {
      let that = this;
      if (!that.checkedByLogin) {
        that.lockRuleForm.pwd = "";
      }
      that.lockEventFlag = true;
    },
    lockEventSet() {
      let that = this;
      this.$refs.lockRuleForm.validate((valid) => {
        if (valid) {
          window.top.localStorage.setItem("lockpwd", that.lockRuleForm.pwd);
          that.lockScreenPwd = that.lockRuleForm.pwd;
          that.lockEventFlag = false;
          that.$nextTick(() => {
            that.$refs.lockInput.focus();
          });
        } else {
          return false;
        }
      });
    },
    /*
        全屏
        */
    fullScreenEvent() {
      let that = this;
      let main = document.documentElement;
      if (that.fullScreen) {
        if (document.exitFullscreen) {
          document.exitFullscreen();
        } else if (document.mozCancelFullScreen) {
          document.mozCancelFullScreen();
        } else if (document.webkitCancelFullScreen) {
          document.webkitCancelFullScreen();
        } else if (document.msExitFullscreen) {
          document.msExitFullscreen();
        }
      } else {
        if (main.requestFullscreen) {
          main.requestFullscreen();
        } else if (main.mozRequestFullScreen) {
          main.mozRequestFullScreen();
        } else if (main.webkitRequestFullScreen) {
          main.webkitRequestFullScreen();
        } else if (main.msRequestFullscreen) {
          main.msRequestFullscreen();
        }
      }
      that.fullScreen = !that.fullScreen;
    },
    // 下拉选择公司
    selectComPany(command) {
      this.$confirm("此操作将刷新系统页面, 是否继续?", "提示", {
        confirmButtonText: "确定",
        cancelButtonText: "取消",
        type: "warning",
      })
        .then(() => {
          this.companyId = command.id;
          this.companyName = command.companyName;
          //  查询列表
          this.store
            .dispatch("generateRoutes", {
              companyId: command.id,
              appId: this.appId
            })
            .then((res) => {
              if (res.code === "0") {
                this.store.commit("addRouters", res.data);
              } else {
                this.$message({
                  message: res.message,
                  type: "error",
                });
              }
            });
          window.top.localStorage.setItem("companyId", command.id);
          window.location.reload();
          this.$message({
            type: "success",
            message: "正在为您更新数据...",
          });
        })
        .catch((error) => {
          console.log(error);
          this.$message({
            type: "info",
            message: "已取消操作",
          });
        });
    },
    selectOrg(command) {
      this.$confirm("此操作将切换用户所在机构及职级, 是否继续?", "提示", {
        confirmButtonText: "确定",
        cancelButtonText: "取消",
        type: "warning",
      })
        .then(() => {
          this.orgName = command.orgName;
          this.orgId = command.orgId;
          this.dutyName = command.dutys ? command.dutys[0].dutyName : "";
          this.dutyId = command.dutys ? command.dutys[0].dutyId : "";
          window.top.localStorage.setItem("dutyName", this.dutyName);
          window.top.localStorage.setItem("dutyId", this.dutyId);
          window.top.localStorage.setItem("orgId", command.orgId);
          window.top.localStorage.setItem("orgCode", command.orgCode);
          window.location.reload();
          this.$message({
            type: "success",
            message: "正在为您更新数据...",
          });
          this.updateUserInfo();
        })
        .catch((error) => {
          console.log(error);
          this.$message({
            type: "info",
            message: "已取消操作",
          });
        });
    },
    // 更新用户当前机构及职级
    async updateUserInfo() {
      // do
    },
    getOrgDutyList() {
      let that = this;
      that.axios
        .get("pass/v1/sysorgs/findOrgs?companyId=" + this.companyId)
        .then((res) => {
          if (res.code === "0") {
            this.orgDutyLinks = res.data;
            if (this.orgDutyLinks.length > 0) {
              let orgId = window.top.localStorage.getItem("orgId");
              if (orgId && orgId !== "" && orgId !== null) {
                let obj = this.orgDutyLinks.find((x) => x.orgId === orgId);
                if (obj) {
                  this.orgId = orgId;
                  this.orgName = obj.orgName;
                  this.orgCode = obj.orgCode;
                  this.dutyName = obj.dutys ? obj.dutys[0].dutyName : "";
                  this.dutyId = obj.dutys ? obj.dutys[0].dutyId : "";
                } else {
                  this.orgName = res.data[0].orgName;
                  this.orgId = res.data[0].orgId;
                  this.orgCode = res.data[0].orgCode;
                  this.dutyName = res.data[0].dutys
                    ? res.data[0].dutys[0].dutyName
                    : "";
                  this.dutyId = res.data[0].dutys
                    ? res.data[0].dutys.dutyId
                    : "";
                }
              } else {
                this.orgName = res.data[0].orgName;
                this.orgId = res.data[0].orgId;
                this.orgCode = res.data[0].orgCode;
                this.dutyName = res.data[0].dutys
                  ? res.data[0].dutys[0].dutyName
                  : "";
                this.dutyId = res.data[0].dutys
                  ? res.data[0].dutys[0].dutyId
                  : "";
                this.updateUserInfo();
              }
              window.top.localStorage.setItem("orgId", this.orgId);
              window.top.localStorage.setItem("orgCode", this.orgCode);
              window.top.localStorage.setItem("dutyName", this.dutyName);
              window.top.localStorage.setItem("dutyId", this.dutyId);
            }
          } else {
            this.$message.error(res.message);
          }
        })
        .catch((err) => {
          console.log(err);
        });
    },
    visibleChange(f) {
      let that = this;
      if (!f) {
        $(".contextmenu").css({
          display: "none",
        });
      }
    },
    handleCommand(command) {
      let that = this;
      switch (command) {
        case "a": //关闭当前标签
          $("#menuTabId .el-icon-close").eq(that.menuTabIndex).click();
          break;
        case "b": //关闭其他标签
          var removeTarget = [];
          var len = that.tabsData.length - that.menuTabIndex - 1;
          for (let i = 0; i < len; i++) {
            removeTarget.push(
              $("#menuTabId .el-icon-close").eq(that.menuTabIndex + i + 1)
            );
          }
          for (let i = 0; i < that.menuTabIndex; i++) {
            removeTarget.push($("#menuTabId .el-icon-close").eq(i));
          }
          for (let i = 0; i < removeTarget.length; i++) {
            $(removeTarget[i]).click();
          }
          break;
        case "c": //关闭右侧标签
          var removeTarget = [];
          var len = that.tabsData.length - that.menuTabIndex - 1;
          for (let i = 0; i < len; i++) {
            removeTarget.push(
              $("#menuTabId .el-icon-close").eq(that.menuTabIndex + i + 1)
            );
          }
          for (let i = 0; i < removeTarget.length; i++) {
            $(removeTarget[i]).click();
          }
          break;
        case "d": // 刷新当前标签页
          $("#menuTabId .el-tabs__item").eq(that.menuTabIndex).click();
          $("#menuTabId iframe")
            .eq(that.menuTabIndex)[0]
            .contentWindow.location.reload(true);
          break;
      }
    },
    // 右键菜单
    rightShow($event, index, item) {
      let that = this;
      that.menuTabIndex = index;
      $(".contextmenu").css({
        left: $event.pageX + 120 + "px",
        top: $event.pageY + "px",
        display: "block",
      });
      $("#setClick").click();
      $event.preventDefault();
    },

    gotoSetPage(item) {
      let that = this;
      let menuData = item.preTarget;
      if (!menuData) {
        return;
      }
      that.tabsData.push(menuData);
      that.selectedMenu = menuData.menuId;
      that.pageBreadcrumb = item.pageBreadcrumb;
      that.axios
        .post(proPath + "v1/sysmenus/accessOwnAdd", {
          userId: that.$store.state.userInfo.userId,
          menuId: menuData.menuId,
        })
        .then(function (response) {})
        .catch(function () {});
    },
    //  判断是否在iframe下
    showIframeEvent() {
      var that = this;
      var thisDocument = document;
      try {
        var topDocument = window.top.document;
      } catch (err) {
        thisDocument.getElementsByClassName(
          "icore-menu-main"
        )[0].style.display = "none";
        thisDocument.getElementsByClassName("sl-header")[0].style.display =
          "none";
        thisDocument.getElementById("mainContainer").style.padding = "0px";
        return;
      }
      var routerCover = this.$router.history.current.query;
      var routerParams = this.$router.history.current.params;
      var routerFlag = 0;
      var routerFlagP = 0;
      for (var i in routerCover) {
        routerFlag = routerFlag + 1;
      }
      for (var j in routerParams) {
        routerFlagP = routerFlagP + 1;
      }

      that.showIframe =
        thisDocument === topDocument && routerFlag === 0 && routerFlagP === 0;

      if (that.showIframe) {
        that.getUserInfo();
        thisDocument.getElementById("mainContainer").style["padding-left"] =
          "179px";
        // websocket初始化
        let token = getCookie("accessToken");
        if (token) {
          this.init(token);
        }
        // 打开设为主页的菜单
        that.openMainPage();
      }

      if (routerFlag > 0 || routerFlagP > 0) {
        that.menuType = "1";
      }
      var setShowIframe = setInterval(function () {
        for (
          let i = 0;
          i < window.top.document.getElementsByTagName("iframe").length;
          i++
        ) {
          if (
            window.top.document.getElementsByTagName("iframe")[i]
              .contentDocument !== null &&
            window.top.document
              .getElementsByTagName("iframe")
              [i].contentDocument.getElementsByClassName("icore-menu-main")
              .length > 0
          ) {
            $(
              window.top.document.getElementsByTagName("iframe")[i].parentNode
                .parentNode
            ).css({
              height: "calc(100% - 31px)",
            });
            $(
              window.top.document.getElementsByTagName("iframe")[i].parentNode
            ).css({
              height: "100%",
            });
            window.top.document
              .getElementsByTagName("iframe")
              [i].contentDocument.getElementsByClassName(
                "icore-menu-main"
              )[0].style.display = "none";
            window.top.document
              .getElementsByTagName("iframe")
              [i].contentDocument.getElementsByClassName(
                "sl-header"
              )[0].style.display = "none";
            window.top.document
              .getElementsByTagName("iframe")
              [i].contentDocument.getElementsByClassName(
                "sl-content-main"
              )[0].style.height = "100%";
            window.top.document
              .getElementsByTagName("iframe")
              [i].contentDocument.getElementById(
                "mainContainer"
              ).style.padding = "0px";
            if (
              i ===
              window.top.document.getElementsByTagName("iframe").length - 1
            ) {
              clearInterval(setShowIframe);
            }
          }
        }
        if (window.top.document.getElementsByTagName("iframe").length === 0) {
          if (!that.showIframe) {
            thisDocument.getElementById("mainContainer").style["padding-left"] =
              "0px";
            thisDocument.getElementsByClassName(
              "sl-content-main"
            )[0].style.height = "100%";
          }
          clearInterval(setShowIframe);
        }
      }, 20);
      that.setDrag();
    },
    handleOperate() {
      setTimeout(() => {
        this.$nextTick(() => {
          let heightOld = $(".icore-menu-main")[0].clientHeight;
          let height = $(".icore-menu-main")[0].scrollHeight;
          if (height !== 0) {
            // 菜单收缩后scrollHeight复原
            window.top.document.getElementsByClassName(
              "menuDrag"
            )[0].style.height = heightOld + "px";
            // 再次赋值
            let heightNew = $(".icore-menu-main")[0].scrollHeight;
            window.top.document.getElementsByClassName(
              "menuDrag"
            )[0].style.height = heightNew + "px";
          }
        });
      }, 500);
    },
    setDrag() {
      let that = this;
      if (that.showIframe) {
        that.$nextTick(() => {
          window.top.document.getElementsByClassName(
            "menuDrag"
          )[0].style.height = $(".icore-menu-main")[0].scrollHeight + "px";
        });
      }
      $("#menuDrag").unbind();
      $("#menuDrag").mousedown(function (event) {
        that.dragFlag = true;
        $(event.target).data("dragStart", event.pageX);
        $(event.target).data("dragWidth", $(".icore-menu-main2").outerWidth());
        $("body").css({
          cursor: "col-resize",
        });
        let _html =
          '<div id="dragsc" style="height: 100%;width: 100%;position: absolute;top: 0;z-index: 888;"></div>';
        $("body").append(_html);
        $("body").mousemove(function (e) {
          if (!that.dragFlag) {
            $(this).css({
              cursor: "",
            });
            $("#dragsc").remove();
            $(this).unbind(e);
          } else {
            var startX = $("#menuDrag").data("dragStart");
            var endX = e.pageX;
            var change = endX - startX;
            var containerWidth = $("#menuDrag").data("dragWidth");
            // console.log('containerWidth + change = ' + (containerWidth + change))
            if (containerWidth + change < 180) {
              $(".icore-menu-main2").css({
                width: "180px",
              });
              $(".oa-header-user").css({
                width: "",
              });
              $(".sl-container2").css({
                "padding-left": "179px",
              });
            } else if (containerWidth + change <= 800) {
              $(".icore-menu-main2").css({
                width: containerWidth + change + "px",
              });
              $(".sl-container2").css({
                "padding-left": containerWidth + change - 1 + "px",
              });
              $(".oa-header-user").css({
                width: containerWidth + change + "px",
              });
            }
          }
        });
        $("body").mouseup(function (ev) {
          that.dragFlag = false;
          $(this).unbind(ev);
        });
      });
    },
    //  tabs选项选择
    handleClick(tab, event) {
      let that = this;
      let pageBreadcrumb = $($(".pageBreadcrumb")[parseInt(tab.index)]).html();
      that.pageBreadcrumb = JSON.parse(pageBreadcrumb);
      window.top.localStorage.setItem("activeMenu", tab.name);
      that.menuTabIndex = that.getTabIndex(tab.name);
      for (let i = 0; i < this.mainPageList.length - 1; i++) {
        if (
          tab.name === this.mainPageList[i].menuId &&
          this.mainPageList[i].mainPageLoading === true
        ) {
          $("#menuTabId iframe")
            .eq(that.menuTabIndex)[0]
            .contentWindow.location.reload(true);
          this.mainPageList[i].mainPageLoading = false;
        }
      }
    },
    removeTab(targetName) {
      var that = this;
      var spliceIndex = null;
      var temp = [];
      for (let i = 0; i < this.mainPageList.length - 1; i++) {
        if (targetName === this.mainPageList[i].menuId) {
          this.mainPageList[i].mainPageLoading = false;
        }
      }
      for (var i = 0; i < that.tabsData.length; i++) {
        temp.push(that.tabsData[i]);
        if (targetName === that.tabsData[i].menuId) {
          spliceIndex = i;
        }
      }
      if (spliceIndex !== null) {
        temp.splice(spliceIndex, 1);
      }
      if (that.selectedMenu === that.tabsData[spliceIndex].menuId) {
        if (temp.length !== 0) {
          var showIndex = spliceIndex;
          if (showIndex > temp.length - 1) {
            showIndex = temp.length - 1;
          }
          that.selectedMenu = temp[showIndex].menuId;
          window.top.localStorage.setItem("activeMenu", that.selectedMenu);
          that.pageBreadcrumb = temp[showIndex].pageBreadcrumb;
        } else {
          that.pageBreadcrumb = [
            {
              menuId: 1,
              menuLabel: "首页",
            },
          ];
        }
      }
      that.tabsData = temp;
    },
    //  菜单选择
    selectMenu(menuData, pageBreadcrumb) {
      console.log('menuData')
      console.log(menuData);
      // console.log(pageBreadcrumb)
      var that = this;
      if (
        menuData.menuUrl !== null &&
        menuData.menuUrl !== "" &&
        typeof menuData.menuUrl !== "undefined"
      ) {
        window.top.localStorage.setItem("activeMenu", menuData.menuId);
        var temp = [];
        menuData.pageBreadcrumb = pageBreadcrumb;
        var setTabsFlag = true;
        for (var i = 0; i < that.tabsData.length; i++) {
          if (menuData.menuId === that.tabsData[i].menuId) {
            setTabsFlag = false;
            break;
          }
        }
        if (setTabsFlag) {
          for (var j = 0; j < that.tabsData.length; j++) {
            temp.push(that.tabsData[j]);
          }
          temp.push(menuData);
          that.tabsData.push(menuData);
        }
        that.selectedMenu = menuData.menuId;
        that.pageBreadcrumb = pageBreadcrumb;
        that.axios
          .post(proPath + "v1/sysmenus/accessOwnAdd", {
            userId: that.$store.state.userInfo.userId,
            menuId: menuData.menuId,
          })
          .then(function (response) {})
          .catch(function () {});
        this.$nextTick(() => {
          console.log($(document.getElementsByTagName("iframe")));
        });
      }
      //   console.log('目录', that.selectedMenu, that.tabsData)
    },
    //  是否合部都不是菜单就不用显示
    allNoMenu(items) {
      let bol = false;
      for (let item of items) {
        if (item.menuType === "1" || item.menuType === "4") {
          //  有菜单
          bol = true;
          break;
        }
      }
      return bol;
    },
    //
    signOut() {
      let _this = this;
      _this
        .$msgbox({
          title: "退出提示",
          message: "确定退出登录吗？",
          showCancelButton: true,
          confirmButtonText: "确定",
          cancelButtonText: "取消",
          beforeClose: (action, instance, done) => {
            if (action === "confirm") {
              instance.confirmButtonLoading = true;
              instance.confirmButtonText = "执行中...";
              // ajax
              let res = this.axios.get('pass/logout', {
                  params: {
                    authorization: getCookie('accessToken')
                  }
                });
              res.then(function (res) {
                console.log(111)
                  instance.confirmButtonText = "确定";
                  instance.confirmButtonLoading = false;
                  done();
                  window.location.href = "./index.html";
                })
                .catch(function () {
                  instance.confirmButtonText = "确定";
                  instance.confirmButtonLoading = false;
                  done();
                });
            } else {
              done();
            }
          },
        })
        .then((action) => {});
    },
    //  查看个人信息
    showPersonInfo() {
      //  打开查看
      this.userModal.show = true;
      let userId = this.$store.state.userInfo.userId;
    },
    getUserInfo() {
      let that = this;
      if (that.$store.state.userInfo) {
        that.axios
          .get(proPath + "v1/sysusers/" + that.$store.state.userInfo.userId)
          .then(function (response) {
            if (response) {
              that.userInfo = response.data;
              top.globalUserInfo = response.data;
            }
          });
      }
    },
    //  隐藏侧边栏
    changeMenuType() {
      if (this.menuType === "2") {
        this.menuType = "1";
      } else {
        this.menuType = "2";
      }
    },
    //  菜单选中
    thisMenu(item) {
      for (let b of this.pageBreadcrumb) {
        if (b.menuId === item.menuId) {
          return true;
        }
      }
      return false;
    },
    //  弹窗完成
    userModalThen(str, item) {
      //   console.log('代码执行了')
      switch (str) {
        case "close":
          this.userModal.show = false;
          break;
        case "success":
          this.userModal.show = false;
          //  刷新
          this.store.dispatch("getUserInfo");
          break;
      }
    },
    //  修改密码
    pwdSubmit() {
      // if (this.strongText === '弱' && this.digit) {
      //   this.$message.warning('密码安全等级太弱')
      //   return
      // } else if (this.strongText === '弱' && !this.digit) {
      //   this.$message.warning('密码不能小于六位数')
      //   return
      // }
      this.$refs["pwdModal"].validate((valid) => {
        if (valid) {
          // if (this.pwdModal.form.newpassword.length > 16) {
          //   this.$message.warning('密码最长为16个字符')
          //   return
          // }
          this.pwdModal.loading = true;
          this.pwdModal.form.userid = this.store.state.userInfo.id;
          this.store
            .dispatch("system/usersManage/updpsw", this.pwdModal.form)
            .then((res) => {
              this.pwdModal.loading = false;
              if (res.code === "0") {
                this.$message.success("设置成功");
                this.strongShow = false;
                this.pwdModal.show = false;
              } else {
                this.$message.error(res.message);
              }
            });
        }
      });
    },
    //  打开修改密码弹窗
    openPwd() {
      this.$refs["pwdModal"].resetFields &&
        this.$refs["pwdModal"].resetFields();
      this.strongShow = false;
    },
    //  弹窗完成
    userModalThen(str, item) {
      let that = this;
      switch (str) {
        case "close":
          that.userModal.show = false;
          break;
        case "success":
          that.userModal.show = false;
          //  刷新
          that.getUser(that.tableParams.form);
          break;
      }
    },
    //  关闭弹窗
    userModalClose() {},
    // 修改完毕重新请求数据
    updataUserInfo(data) {
      this.getUserInfo();
      this.$store.commit("userInfo", data);
    },
    init: function (token) {
      let that = this;
      // 192.168.10.231:9008本地
      let path = "";
      if (
        window.top.document.location.origin.indexOf("icore-paas-test") !== -1 ||
        window.top.document.location.origin.indexOf("localhost") !== -1
      ) {
        path =
          "wss://websocket-dev.steerinfo.com/websocket?type=pass&token=" +
          token;
      } else {
        path =
          "wss://websocket.steerinfo.com/websocket?type=pass&token=" + token;
      }
      if ("WebSocket" in window) {
        // 实例化websocket
        this.websocket = new WebSocket(path);
        // 监听websocket连接
        this.websocket.onopen = this.open;
        // 监听websocket错误信息
        this.websocket.onerror = this.error;
        // 监听websocket消息
        this.websocket.onmessage = this.getMessage;
        //每隔30秒钟发送一次心跳，避免websocket连接因超时而自动断开
        // this.interval = window.setInterval(function(){
        //     if(that.websocket !== null){
        //         if (that.websocket.readyState !== that.websocket.OPEN) {
        //             let token = getCookie('accessToken');
        //             if (token) {
        //                 that.init(token);
        //             }
        //         }
        //         // } else {
        //         //     that.websocket.send('HeartBeat');
        //         //     // console.log("发送心跳包：HeartBeat");
        //         // }
        //     }
        // },30000);
      } else {
        alert("您当前浏览器不支持WebSocket");
        // 每隔30秒钟发送一次心跳，避免websocket连接因超时而自动断开
        // forgeWebSocket这个方法是在不支持websocket的浏览器中去执行，这个方法作用是作为最早得轮询方式去保持长连接。这样不管浏览器支不支持websocket都能保持长连接的功能作用
        // this.interval = window.setInterval(function(){
        //     that.forgeWebSocket();
        // },30000);
      }
    },
    open: function () {
      console.log("websocket连接成功");
    },
    error: function () {
      console.log("连接错误");
    },
    getTabIndex(menuId) {
      let index = 0;
      for (let i = 0; i < this.tabsData.length; i++) {
        if (this.tabsData[i].menuId === menuId) {
          index = i;
        }
      }
      return index;
    },
    getMessage: function (msg) {
      let that = this;
      // console.log(msg.data);
      let newMsg = JSON.parse(msg.data);
      let message = "";
      if (Object.prototype.toString.call(newMsg) === "[object Object]") {
        message = newMsg;
      } else if (Object.prototype.toString.call(newMsg) === "[object Array]") {
        message = JSON.parse(msg.data).find((item) => item.offline === false);
      }
      if (message.hasOwnProperty("type")) {
        let activeMenu = window.top.localStorage.getItem("activeMenu");
        let obj = this.getTreeAll(
          this.menuData,
          "./workFlow.html#/coverTask",
          1,
          []
        );
        let taskObj = this.getTreeAll(
          this.menuData,
          "./workFlow.html#/personalInitiatedTask",
          1,
          []
        );
        let msgObj = this.getTreeAll(
          this.menuData,
          "./systemConfig.html#/noticeUser",
          1,
          []
        );
        switch (message.type) {
          case "ACT_TO_DO_TASK": // 待办任务;
            this.$message.info("您收到一条新的待办任务,请前往待办任务中查看！");
            if (activeMenu === obj.menuData.menuId) {
              that.menuTabIndex = that.getTabIndex(obj.menuData.menuId);
              $("#menuTabId .el-tabs__item").eq(that.menuTabIndex).click();
              $("#menuTabId iframe")
                .eq(that.menuTabIndex)[0]
                .contentWindow.location.reload(true);
            }
            this.getMyToDoTask();
            this.getMyToDoDelegateTask();
            break;
          case "ACT_TO_DO_DELEGATETASK": // 委托待办任务;
            this.$message.info(
              "您收到一条新的委托待办任务,请前往待办任务中查看！"
            );
            if (activeMenu === obj.menuData.menuId) {
              that.menuTabIndex = that.getTabIndex(obj.menuData.menuId);
              $("#menuTabId .el-tabs__item").eq(that.menuTabIndex).click();
              $("#menuTabId iframe")
                .eq(that.menuTabIndex)[0]
                .contentWindow.location.reload(true);
            }
            this.getMyToDoTask();
            this.getMyToDoDelegateTask();
            break;
          case "ACT_MY_APPLY_TASK": // 申请完成任务;
            this.$message.info("您有一条申请审批已完成,请前往流程跟踪中查看！");
            if (activeMenu === taskObj.menuData.menuId) {
              that.menuTabIndex = that.getTabIndex(taskObj.menuData.menuId);
              $("#menuTabId .el-tabs__item").eq(that.menuTabIndex).click();
              $("#menuTabId iframe")
                .eq(that.menuTabIndex)[0]
                .contentWindow.location.reload(true);
            }
            break;
          case "SSO_NOTICE": // 公告;
            this.$message.info("您收到一条新的公告：" + message.payload.title);
            if (activeMenu === msgObj.menuData.menuId) {
              that.menuTabIndex = that.getTabIndex(msgObj.menuData.menuId);
              $("#menuTabId .el-tabs__item").eq(that.menuTabIndex).click();
              $("#menuTabId iframe")
                .eq(that.menuTabIndex)[0]
                .contentWindow.location.reload(true);
            }
            this.getMyMessage();
            break;
          case "SSO_ROLE": // 权限已被管理员修改
          case "SSO_MENU":
          case "SSO_ORG":
            let userId = this.$store.state.userInfo.userId;
            if (userId !== "admin") {
              this.privilegeUpdateIfo = true;
              this.coutTime(5);
            } else {
              if (message.type === "SSO_MENU") {
                store
                  .dispatch("generateRoutes", {
                    companyId: this.companyId,
                    appId: this.appId
                  })
                  .then((res) => {
                    if (res.code === "0") {
                      this.menuData = res.data;
                    }
                  })
                  .catch((err) => {
                    console.log(err);
                  });
              }
            }
            break;
          case "UPDATE_NUM":
            this.getMyToDoTask();
            this.getMyToDoDelegateTask();
            this.getMyMessage();
            if (
              message.payload === "updateMessageNumOfAuth" &&
              activeMenu === msgObj.menuData.menuId
            ) {
              that.menuTabIndex = that.getTabIndex(msgObj.menuData.menuId);
              $("#menuTabId .el-tabs__item").eq(that.menuTabIndex).click();
              $("#menuTabId iframe")
                .eq(that.menuTabIndex)[0]
                .contentWindow.location.reload(true);
            }
            break;
        }
      }
    },
    send: function (params) {
      this.websocket.send(params);
    },
    close: function () {
      console.log("websocket已经关闭");
      if (this.interval) {
        window.clearInterval(this.interval);
        // console.log("清除定时器");
      }
    },
    // 倒计时函数
    coutTime(index) {
      let that = this;
      that.closeSecond = index;
      setTimeout(function () {
        if (index == 0) {
          that.store
            .dispatch("loginOut")
            .then(function (res) {
              window.location.href = "./index.html";
            })
            .catch(function (err) {
              console.log(err);
            });
        } else {
          that.coutTime(--index);
        }
      }, 1000);
    },
    closeConfirm() {
      this.closeSecond = 0;
      this.store
        .dispatch("loginOut")
        .then(function (res) {
          window.location.href = "./index.html";
        })
        .catch(function (err) {
          console.log(err);
        });
    },
    // 遍历树获取指定url菜单相关
    // tree 整体树
    // url 需要跳转的页面url
    // num 递归层级，初始值传1，用于返回页面线性层级
    // list 包括页面&页面父级&父级的父级...直到最外层
    getTreeAll(tree, url, num, list) {
      let menuObj = {};
      if (!!tree && tree.length !== 0) {
        for (let item of tree) {
          menuObj["pageBreadcrumb"] = list;
          if (item.menuUrl === url) {
            menuObj["menuData"] = item;
            let obj = {
              menuId: num,
              menuLabel: item.menuLabel,
            };
            menuObj.pageBreadcrumb.push(obj);
            return menuObj;
          } else {
            let obj = {
              menuId: num,
              menuLabel: item.menuLabel,
            };
            let a = [];
            a.push(obj);
            let newList = list.concat(a);
            if (
              item.hasOwnProperty("children") &&
              item.children !== null &&
              item.children.length > 0
            ) {
              menuObj = this.getTreeAll(item.children, url, num + 1, newList);
              if (menuObj.hasOwnProperty("menuData")) {
                return menuObj;
              }
            }
          }
        }
      }
      return menuObj;
    },
    // 前往我的待办任务
    goMyTaskPage() {
      let that = this;
      let updateStatus = false;
      for (let item of this.tabsData) {
        if (item.menuUrl === "./workFlow.html#/coverTask") {
          updateStatus = true;
        }
      }
      let obj = this.getTreeAll(
        this.menuData,
        "./workFlow.html#/coverTask",
        1,
        []
      );
      this.selectMenu(obj.menuData, obj.pageBreadcrumb);
      if (updateStatus === true) {
        that.menuTabIndex = that.getTabIndex(obj.menuData.menuId);
        $("#menuTabId .el-tabs__item").eq(that.menuTabIndex).click();
        $("#menuTabId iframe")
          .eq(that.menuTabIndex)[0]
          .contentWindow.location.reload(true);
      }
    },
    // 前往公告页面
    goNoticePage() {
      let that = this;
      let updateStatus = false;
      for (let item of this.tabsData) {
        if (item.menuUrl === "./systemConfig.html#/noticeUser") {
          updateStatus = true;
        }
      }
      let obj = this.getTreeAll(
        this.menuData,
        "./systemConfig.html#/noticeUser",
        1,
        []
      );
      this.selectMenu(obj.menuData, obj.pageBreadcrumb);
      if (updateStatus === true) {
        that.menuTabIndex = that.getTabIndex(obj.menuData.menuId);
        $("#menuTabId .el-tabs__item").eq(that.menuTabIndex).click();
        $("#menuTabId iframe")
          .eq(that.menuTabIndex)[0]
          .contentWindow.location.reload(true);
      }
    },
    updateTaskNum() {
      let userId = getCookie("userId");
      let messageType = {
        payload: "updateTaskNum",
        type: "UPDATE_NUM",
        userId: userId,
      };
      this.axios
        .post("pass/websocket/socket/frontSendMessage", messageType, {
          individualType: "json",
        })
        .then((res) => {
          if (res.code === "0") {
            // do
          } else {
            this.$message.error(res.message);
          }
        })
        .catch((error) => {
          console.log(error.message);
        });
    },
    updateMessageNum() {
      let userId = getCookie("userId");
      let messageType = {
        payload: "updateTaskNum",
        type: "UPDATE_NUM",
        userId: userId,
      };
      this.axios
        .post("pass/websocket/socket/frontSendMessage", messageType, {
          individualType: "json",
        })
        .then((res) => {
          if (res.code === "0") {
            // do
          } else {
            this.$message.error(res.message);
          }
        })
        .catch((error) => {
          console.log(error.message);
        });
    },
    // 获取我的待办任务个数
    getMyToDoTask() {
      // 获取当前用户
      let userId = getCookie("userId");
      this.axios
        .get(
          "pass/act/v1/actusertasks/findMyToDoTask?userId=" +
            userId +
            "&companyId=" +
            this.companyId +
            "&pageNum=1&pageSize=1000000"
        )
        .then((res) => {
          if (res.code === "0") {
            this.task1Num = res.data.list.length;
          } else {
            this.$message.error(res.message);
          }
        })
        .catch((error) => {
          console.log(error.message);
        });
    },
    // 获取委托我代办的任务
    getMyToDoDelegateTask() {
      // 获取当前用户
      let userId = getCookie("userId");
      this.axios
        .get(
          "pass/act/v1/actusertasks/findMyToDoDelegateTask?userId=" +
            userId +
            "&companyId=" +
            this.companyId +
            "&pageNum=1&pageSize=1000000"
        )
        .then((res) => {
          if (res.code === "0") {
            this.task2Num = res.data.list.length;
          } else {
            this.$message.error(res.message);
          }
        })
        .catch((error) => {
          console.log(error.message);
        });
    },
    // 获取我的公告信息
    getMyMessage() {
      // 获取当前用户
      let userId = getCookie("userId");
      this.axios
        .get(
          "pass/v1/sysnotices/getUserNoticelike?status=0&pageNum=1&pageSize=1000000&companyId=" +
            this.companyId
        )
        .then((res) => {
          if (res.code === "0") {
            this.myMessageLength = res.data.list.length;
          } else {
            this.$message.error(res.message);
          }
        })
        .catch((error) => {
          console.log(error.message);
        });
    },
    // 获取主页页面
    getMainPage(tree, index, list) {
      list = list ? list : [];
      if (!!tree && tree.length !== 0) {
        for (let i = 0; i < tree.length; i++) {
          let menuIndex = index ? index + "-" + i.toString() : i;
          if (
            tree[i].loginDispaly &&
            tree[i].loginDispaly === "1" &&
            tree[i].status === "1"
          ) {
            tree[i]["menuIndex"] = menuIndex;
            tree[i]["mainPageLoading"] = true;
            list.push(tree[i]);
          } else {
            if (
              tree[i].hasOwnProperty("children") &&
              tree[i].children !== null &&
              tree[i].children.length > 0
            ) {
              this.getMainPage(tree[i].children, menuIndex, list);
            }
          }
        }
      }
      return list;
    },
    // 打开设为主页菜单页面
    openMainPage() {
      this.mainPageList = this.getMainPage(this.menuData);
      // console.log(this.mainPageList)
      let menuList = window.top.document.getElementsByClassName("el-menu-item");
      let s = 0;
      for (let item of this.mainPageList) {
        for (let i = 0; i < menuList.length; i++) {
          if (
            menuList[i].innerHTML === item.menuLabel &&
            menuList[i].__vue__.index === item.menuIndex
          ) {
            s++;
            setTimeout(() => {
              menuList[i].click();
              // console.log('点击行为')
            }, 200);
          }
        }
      }
    },
    // 浏览器返回操作
    goBack() {
      this.$router.replace({
        path: "/",
      });
    },
  },
};
</script>
<!-- Add "scoped" attribute to limit CSS to this component only -->

<style lang="less" scoped>
/deep/ .privilegeArea {
  .el-dialog {
    min-width: 400px;
    min-height: 120px;
    padding-bottom: 10px;
  }
}

.contextmenu {
  width: 150px;
  height: 150px;
  top: 0px;
  position: absolute;
  display: none;
}

/deep/.lockInput .el-input__inner {
  -webkit-text-security: disc !important;
}

.theme-defined {
  position: absolute;
  right: 20px;
  top: 20px;
  width: 150px;
}

.theme-defined > div {
  float: right;
  margin-right: 10px;
}

.company-select {
  position: absolute;
  left: 225px;
  // top: 20px;
  // float: left;
  height: 60px;
  line-height: 60px;
  margin-left: 20px;
  color: #fff;
  font-size: 20px;
}

.el-dropdown {
  font-size: 16px;
  color: #ffffff;
  cursor: pointer;
}

.ifCompany {
  font-size: 16px;
  color: #ffffff;
}

.lock_route {
  transform: rotateY(180deg);
  cursor: pointer;
  position: absolute;
  width: 40px;
  height: 39px;
  top: 0px;
  right: 0px;
  text-align: center;
  line-height: 40px;
  background-color: #ccc;
  color: #fff;
}

.lock_screen {
  position: absolute;
  z-index: 9999999999;
  background-color: #fff;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  min-width: 1600px;
  background: url(../assets/img/default-bg.png) center bottom no-repeat;
}

.main {
  height: 100%;
}

.sl-header {
  /* position: fixed; */
  top: 0;
  left: 0;
  z-index: 1002;
  width: 100%;
  /* min-width: 1150px; */
  background-color: #fff;
  background-color: rgba(255, 255, 255, 0.9);
}

.sl-container {
  height: 100%;
  position: relative;
  /* padding-top: 60px; */
  padding-left: 79px;
  /* transition: padding-left .3s ease-out; */
}

.sl-container2 {
  padding-left: 0px;
}

.sl-content-main {
  width: 100%;
  //   min-width: 1200px;
  height: calc(100% - 60px);
  overflow: auto;
}

.icore-menu-main {
  position: fixed;
  top: 0;
  left: 0;
  z-index: 1001;
  width: 80px;
  height: calc(100% - 60px);
  margin-top: 60px;
  border-right: 1px solid #efefef;
  background-color: #fff;
  /* transition: width .25s ease-out;*/
}

.icore-menu-main2 {
  width: 180px;
  -webkit-touch-callout: none;
  -webkit-user-select: none;
  -khtml-user-select: none;
  -moz-user-select: none;
  -ms-user-select: none;
  user-select: none;
}

.sl-content {
  transition: margin-left 0.2s linear;
}

.sl-header-li-logo {
  float: left;
  margin-top: 13px;
  margin-left: 20px;
}

.sl-header-li-name {
  float: left;
  height: 60px;
  line-height: 60px;
  margin-left: 20px;
  color: #fff;
  font-size: 20px;
}

.sl-header-li-line {
  float: left;
  margin-top: 5px;
  height: 26px;
}

.sl-header-li-lgo {
  float: right;
  margin-top: 21px;
  width: 120px;
}

.sl-header-li-lgob {
  display: inline-block;
  padding-left: 25px;
  position: relative;
  color: white;
  height: 20px;
  line-height: 20px;
  vertical-align: middle;
}

.sl-header-li-lgob > .xs-icons {
  position: absolute;
  top: -8px;
  left: -18px;
}

.icore-menu-ops {
  font-size: 16px;
  color: #666;
  transition: transform 0.3s ease-out;
}

.icore-menu-main2 .icore-menu-ops {
  transform: rotate(180deg);
}

/* header menu style --> begin */
.icore-menu {
  border-right: solid 0px #e6e6e6;
}

.icore-menu-a {
  position: relative;
  display: inline-block;
  width: 100%;
  padding-left: 54px;
  -webkit-transition: color 0.3s;
  transition: color 0.3s;
  cursor: pointer;
  border-right: 2px solid #fff;
}

.icore-menu-tip-cover {
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
}

.icore-menu-a-noc {
  padding-right: 2px;
}

.icore-menu-lit {
  opacity: 0;
  display: inline-block;
  margin-top: 4px;
  height: 36px;
  line-height: 36px;
  vertical-align: middle;
  overflow: hidden;
  transition: opacity 0.3s ease-out;
}

.nameText {
  max-width: 85%;
  text-overflow: ellipsis;
}

.icore-menu-main2 .icore-menu-lit {
  opacity: 1;
}

.icore-menu-main2 .icore-menu-tip-cover {
  display: none;
}

.icore-menu-lic {
  position: absolute;
  top: 50%;
  left: 10px;
  margin-top: -11px;
}

.icore-menu-ric {
  position: absolute;
  top: 50%;
  right: 4px;
  margin-top: -3px;
  font-family: element-icons !important;
  speak: none;
  font-style: normal;
  font-weight: 400;
  font-variant: normal;
  color: #999;
  text-transform: none;
  line-height: 1;
  vertical-align: baseline;
  display: inline-block;
  -webkit-font-smoothing: antialiased;
  font-smoothing: antialiased;
  -webkit-transition: transform 0.3s;
  transition: transform 0.3s;
}

/* .icore-menu-ric:before{
     content: "\E603";
   }*/
.icore-menu-ricr {
  color: #999;
}

.icore-menu-s {
  position: absolute;
  top: -7px;
  left: 100%;
  z-index: 1004;
  border: 1px solid #ccc;
  box-shadow: 0 2px 8px #999;
  border-radius: 2px;
  background-color: #fff;
  min-width: 130px;
  padding: 10px 0;
}

.icore-menu-sham {
  -webkit-transform: scaleY(0);
  transform: scaleY(0);
  -webkit-transition: transform, display 0.4s;
  transition: transform 0.4s;
  -webkit-transform-origin: center top;
  transform-origin: center top;
}

.icore-menu-a:hover > .icore-menu-sham,
.icore-menu-sa:hover > .icore-menu-sham {
  opacity: 1;
  -webkit-transform: scaleY(1);
  transform: scaleY(1);
}

.icore-menu-s.icore-menu-s-right {
  left: auto;
  right: 15px;
}

.main-upload_text_logo {
  display: block;
  text-align: center;
  position: relative;
  margin: 0px -20px;
  top: -35px;
  border-bottom: 1px solid #cccccc;
}

.main-file_upload {
  width: 100%;
  text-align: center;
  position: relative;
  display: inline-block;
  vertical-align: top;
}

.main-file_con .hide {
  width: 120px;
  position: absolute;
  height: 30px;
  left: 58px;
  margin-top: -8px;
  opacity: 0;
  filter: alpha(opacity=0);
  z-index: 22;
}

.main-file_con .main-file_uploader,
.upload_bt {
  left: 0;
  top: -5px;
  position: relative;
  color: #fff;
  display: inline-block;
  padding: 0px 20px;
  background: #2ecc71;
  text-align: center;
  z-index: 11;
  border-radius: 15px;
  cursor: pointer;
}

.upload_bt {
  left: 130px;
}

.main-file_con .hide:hover {
  box-shadow: 1px 2px #44795b;
}

.main-img_holder,
.m_main-img_holder {
  height: 100px;
  line-height: 70px;
}

.main-img_holder img,
.m_main-img_holder img {
  max-width: 200px;
}

.main-file_btn_upload {
  margin-top: -20px;
  margin-bottom: 20px;
}

.icore-menu-sa {
  display: block;
  min-width: 120px;
  white-space: nowrap;
  padding: 0 20px;
  line-height: 32px;
  position: relative;
}

.icore-menu-a:hover {
  color: #2391e5;
  background-color: #e2f1fc;
  border-right-color: #e2f1fc;
}

.icore-menu-a:hover > .icore-menu-ric {
  color: #2391e5;
  -webkit-transform: rotate(180deg);
  transform: rotate(180deg);
}

.icore-menu-sa:hover {
  background-color: #e2f1fc;
  color: #2391e5;
}

.icore-menu-sa:hover > .icore-menu-ricr {
  color: #2391e5;
}

.icore-menu-ss {
  opacity: 0;
  position: absolute;
  left: 100%;
  top: -11px;
  z-index: 1005;
  padding: 10px 0;
  border: 1px solid #ccc;
  box-shadow: 0 2px 8px #999;
  border-radius: 2px;
  background-color: #fff;
}

.icore-menu-sed {
  border-right-color: #2391e5;
}

.icore-menu-sed,
.icore-menu-ssed,
.icore-menu-sssed {
  color: #2391e5;
}

.icore-menu-sed > .icore-menu-ricr,
.icore-menu-ssed > .icore-menu-ricr,
.icore-menu-sed > .icore-menu-ric {
  color: #2391e5;
}

.icore-menu-sdis {
  cursor: default !important;
  cursor: not-allowed !important;
  color: #999 !important;
  background-color: #fff !important;
}

.icore-menu-reverse > .icore-menu-s,
.icore-menu-reverse > .icore-menu-ss {
  top: auto;
  bottom: -11px;
  -webkit-transform-origin: center bottom;
  transform-origin: center bottom;
}

/* header menu style --> end */
.sl-breadcrumb {
  overflow: hidden;
  background-color: #fff;
  height: 30px;
  padding: 7px 0 0 20px;
}

.sl-header-li-lgbc {
  position: absolute;
  right: 40%;
  top: 20px;
}

.sl-header-li-websocket {
  position: absolute;
  right: 210px;
  top: 17px;

  .el-button--text {
    color: white;
  }
}

.sl-breadcrumb-text {
  float: left;
  color: white;
}

.sl-breadcrumb-list {
  float: left;
  padding-left: 10px;
  font-size: 12px;
  position: relative;
  top: 6px;
}

.sl-footer {
  padding: 20px 0 0px;
}

.sl-footer > p {
  text-align: center;
  height: 20px;
  line-height: 20px;
  vertical-align: middle;
}

.am-xz {
  float: left;
  margin-right: 7px;
  margin-top: 2px;
  animation: amXuanzhuan 4s linear infinite;
}

@keyframes amXuanzhuan {
  0% {
    transform: rotate3d(1, 0, 0, 360deg);
  }

  100% {
    transform: rotate3d(1, 0, 0, 0);
  }
}

.oa-header-photo-uld {
  width: 200px;
  height: 200px;
  line-height: 200px;
  vertical-align: middle;
  margin: 0 auto;
  overflow: hidden;
  cursor: pointer;
}

.oa-header-photo-uld > img {
  max-width: 100%;
  max-height: 100%;
  vertical-align: middle;
}

/*.oa-header-content {*/
/*background: url("../../static/img/top_bgimg.png") left center no-repeat rgb(60,207,255);*/
/*height: 60px;*/
/*}*/

.oa-header-logo {
  float: left;
  padding: 15px 0 0 30px;
  height: 50px;
  overflow: hidden;
}

.oa-header-logo > img {
  animation: fadeInLeft 0.5s ease-out 0s both;
}

.oa-header-upt {
  position: absolute;
  left: 0;
  top: 0;
  width: 100px;
  height: 60px;
  overflow: hidden;
  text-align: center;
}

.oa-header-upt > a {
  display: inline-block;
  width: 40px;
  height: 40px;
  margin-top: 10px;
  animation: fadeInRight 0.5s ease-out 0s both;
}

.oa-header-upt > a > img {
  width: 40px;
  height: 40px;
  line-height: 40px;
  vertical-align: middle;
  color: #333;
  border-radius: 20px;
  box-shadow: 0 0 10px #333;
}

.oa-header-user:hover .oa-header-upt > a > img {
  animation: circle 4s linear 0s infinite;
}

.oa-header-ucon {
  display: none;
  overflow: hidden;
  position: absolute;
  top: 50px;
  left: 10px;
  z-index: 18000;
  padding: 10px 0 10px 10px;
  font-size: 15px;
}

.oa-header-ulist {
  position: relative;
  width: 215px;
  border: 1px solid #ddd;
  box-shadow: 0 0 8px #999;
  background-color: #fff;
  background-color: rgba(255, 255, 255, 0.95);
}

.oa-header-user:hover .oa-header-ucon {
  display: block;
}

.oa-header-user:hover .oa-header-ulist {
  animation: fadeInRight 0.4s ease-out 0s both;
}

.oa-header-uin {
  text-align: center;
  overflow: hidden;
  padding: 20px 0 15px 0;
}

.oa-header-uin > img {
  width: 60px;
  height: 60px;
  border-radius: 30px;
  cursor: pointer;
}

.oa-header-uin > img:hover {
  animation: largen2 0.6s ease-out 0s both;
}

.oa-header-uin > h3 {
  padding-top: 10px;
  color: #666;
}

.oa-header-uul {
  padding-bottom: 10px;
}

.oa-header-uul > li {
  height: 40px;
  line-height: 40px;
  text-align: center;
  vertical-align: middle;
  cursor: pointer;
  transition: background-color 0.3s linear 0s;
}

.oa-header-uul .st-icons {
  position: relative;
  top: 6px;
  margin-right: 8px;
  transition: all 0.3s linear;
}

.st-icons-out {
  margin-right: 4px;
}

.oa-header-uul > li:hover {
  background-color: #ebebeb;
}

.oa-header-uul::before,
.oa-header-uul::after {
  border-bottom-color: rgba(0, 0, 0, 0.2);
  content: "";
  display: inline-block;
  position: absolute;
}

.oa-header-uul::after {
  left: 41px;
  top: -6px;
  border-bottom: 6px solid #fff;
  border-left: 6px solid transparent;
  border-right: 6px solid transparent;
}

.oa-header-uul::before {
  left: 40px;
  top: -7px;
  border-bottom: 7px solid #ccc;
  border-left: 7px solid transparent;
  border-right: 7px solid transparent;
}

.hnstLogo {
  position: absolute;
  left: 190px;
  top: 14px;
}

.hnstLogo > img {
  height: 32px;
}

.marignL15 {
  margin-left: 15px;
}

.menuDrag {
  height: calc(100% - 120px);
  width: 18px;
  position: absolute;
  right: -6px;
  cursor: col-resize;
  z-index: 22;
}

.pageBreadcrumb {
  display: none;
}

.oa-user-name {
  position: absolute;
  top: 21px;
  left: 100px;
  max-width: 44%;
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
}

.strongBox {
  position: absolute;
  right: 0;
  top: 0;
  width: 28px;
  height: 28px;
  line-height: 28px;
  text-align: center;
  color: white;
  background: red;
  border-radius: 5px;
  font-size: 14px;
}
</style>