<template>
  <div id="main" @click="clickDomEvent">
    <el-container>
      <!-- 导航区域 -->
      <el-header id="header" height="56px" style="padding: 0px;">
        <Navigation ref="navigation"></Navigation>
      </el-header>
      <el-main :style="{padding:0,height:bodyHeight}" style="position: relative;">
        <!--展开应用中心-->
        <div class="main">
          <awsui-sidebar
            :visible.sync="drawer"
            :direction="direction"
            size="100%"
            :append-to-body=false
            :show-close=false
            :withHeader=false
            :wrapper-closable=false
            :modal=false
            @opened="openAppIframe">
            <div style="position: relative;width: 100%;height: 100%;">
<!--              <div style="cursor:pointer;height: 20px;width: 15px;background-color: #F5F7FA;position: absolute;top: 10px;line-height: 20px;vertical-align: middle;" @click="closeAppDrawer">-->
<!--                <i class="iconfont">&#xe65d;</i>-->
<!--              </div>-->
              <div id="appContent" v-if="nonAppComponent == ''" key="appContent" style="width: 100%;height: 100%;">
              </div>
              <div id="nonAppComponent" v-if="nonAppComponent != ''" key="nonAppComponent" style="width: 100%;height: 100%;">
                <component ref="component" :is="nonAppComponent" :wsId="wsId"></component>
              </div>
            </div>
          </awsui-sidebar>
        </div>
        <!--展开PAL小组管理-->
        <div class="main">
          <awsui-sidebar
                  :visible.sync="cooperation.drawer"
                  :direction="direction"
                  size="100%"
                  :append-to-body=false
                  :show-close=false
                  :withHeader=false
                  :wrapper-closable=false
                  :modal=false
                  @opened="openCooperationIframe">
            <div style="position: relative;width: 100%;height: 100%;">
              <div style="cursor:pointer;height: 20px;width: 15px;background-color: #F5F7FA;position: absolute;top: 10px;line-height: 20px;vertical-align: middle;" @click="closeCooperationDrawer">
                <i class="iconfont">&#xe65d;</i>
              </div>
              <div id="cooperationContent" v-if="nonAppComponent == ''" key="cooperationContent" style="width: 100%;height: 100%;">
              </div>
            </div>
          </awsui-sidebar>
        </div>
        <!--修改密码-->
        <div>
          <PwdChange ref="pwdChange"></PwdChange>
        </div>
        <router-view :key="key"/>
      </el-main>
    </el-container>
  </div>
</template>

<script>
  import Navigation from "./system/Navigation";
  import PwdChange from "./system/PwdChange";
  import WorkspaceBackup from "./workspace/WorkspaceBackup";
  import Mark from "./repository/RepositorySecurityMark";
  import Recycle from "./recycle/Recycle";
  import Method from "./method/Method";
  import awsuiAxios from "../awsuiAxios";
  export default {
    name: 'Main',
    components: {PwdChange, Navigation, WorkspaceBackup, Recycle, Method,Mark},
    data() {
      return {
        bodyHeight : (document.documentElement.clientHeight - 56) + 'px',
        drawer: false,
        direction: 'rtl',
        nonAppComponent: '',
        wsId: '',
        cooperation: {
          drawer: false,
          cooperationContent: '',
        },
        mainTimer: null, // 主体内容加载定时器，用于判断Navigation是否加载完成，加载完成wsId不为空或者timeNum为0(10秒钟之后未加载成功)时停止执行
        mainTimerNum: 200 // 设置定时器执行次数，
      }
    },
    provide: function () {
      return {
        openAppDrawer: this.openAppDrawer,
        closeAppDrawer: this.closeAppDrawer,
        openPwdConfig: this.openPwdConfig,
        logout: this.logout,
        openCooperationDrawer: this.openCooperationDrawer,
        closeCooperationDrawer: this.closeCooperationDrawer,
        saveAccessOpLog: this.saveAccessOpLog
      }
    },
    computed: {
      key()  {
        return new Date() + '';
      }
    },
    created() {
    },
    mounted() {
      // 是否强制修改密码
      if (forceChangePwd) {
        this.openPwdConfig();
      }
      this.$store.commit('setTopMainHeightFn',this.bodyHeight);// 更新主体高度存储
      this.resize();
      // 火狐浏览器拖拽问题
      document.body.ondrop = function (event) {
        event.preventDefault();
        event.stopPropagation();
      }
    },
    methods: {
      /****应用中心****/
      openAppDrawer() {
        if (document.getElementById("appContent") != undefined) {
          document.getElementById("appContent").innerHTML = '';
        }
        this.drawer = true;
      },
      openAppIframe() {
        this.wsId = this.$store.getters.getWsIdFn;
        const that = this;
        let nav = that.$refs.navigation;
        if (nav.currApp.clazzName == 'method') {// 建模方法
          that.nonAppComponent = '';
          that.$nextTick(()=> {
            that.nonAppComponent = 'Method'
          });
          that.saveAccessOpLog('method');
        } else if (nav.currApp.clazzName == 'backup'){// 备份
          that.nonAppComponent = '';
          that.$nextTick(() => {
            that.nonAppComponent = 'WorkspaceBackup';
          });
          that.saveAccessOpLog('backup');
        } else if (nav.currApp.clazzName == 'recycle') {// 回收站
          that.nonAppComponent = '';
          that.$nextTick(()=> {
            that.nonAppComponent = 'Recycle'
          });
          that.saveAccessOpLog('recycle');
        } else if (nav.currApp.clazzName == 'mark') {//密级标定
          that.nonAppComponent = '';
          that.$nextTick(()=> {
            that.nonAppComponent = 'Mark'
          });
          that.saveAccessOpLog('mark');
        }  else {
          that.nonAppComponent = '';
          that.$nextTick(() => {
            document.getElementById("appContent").innerHTML = '';
            let src = wHref + '?' + "sid=" + that.$store.state.sessionId + "&wsId=" + that.$store.getters.getWsIdFn + "&teamId=" + that.$store.getters.getTeamIdFn + "&clazzName=" + nav.currApp.clazzName + "&cmd=com.actionsoft.apps.coe.pal_app_page";
            document.getElementById("appContent").innerHTML = '<iframe id="appIframe" width="100%" height="100%" name="appIframe" style="border:0;" src="' + src + '"></iframe>';
          });
        }
      },
      closeAppDrawer() {
        this.nonAppComponent = '';
        this.drawer = false;
        this.$refs.navigation.showAppDetail = false;
      },
      /****PAL小组管理中心****/
      openCooperationDrawer() {
        this.wsId = this.$store.getters.getWsIdFn;
        if (document.getElementById("cooperationContent") != undefined) {
          document.getElementById("cooperationContent").innerHTML = '';
        }
        this.cooperation.drawer = true;
      },
      openCooperationIframe() {
        const that = this;
        let nav = that.$refs.navigation;
        that.wsId = nav.wsValue;
        that.cooperation.cooperationContent = '';
        that.$nextTick(() => {
          document.getElementById("cooperationContent").innerHTML = '';
          let src = wHref + '?' + 'sid=' + this.$store.state.sessionId + '&mainPage=manage&cmd=com.actionsoft.apps.coe.pal.cooperation_main';
          document.getElementById("cooperationContent").innerHTML = '<iframe id="cooperationIframe" width="100%" height="100%" name="cooperationIframe" style="border:0;" src="' + src + '"></iframe>';
        });
      },
      closeCooperationDrawer() {
        this.cooperation.cooperationContent = '';
        this.cooperation.drawer = false;
        this.$refs.navigation.cooperationDrawer.showCooperationDetail = false;
      },

      handleClose(done) {
        done();
      },
      /****密码修改****/
      openPwdConfig() {
        this.$refs.pwdChange.pwdConfig = true;
      },
      /****退出登录****/
      logout() {
        const that = this;
        that.$confirm('确定离开系统吗？', '提示', {
          confirmButtonText: '确定',
          confirmButtonClass: 'button-general-color',
          cancelButtonText: '取消',
          type: 'warning'
        }).then(() => {
          const src = wHref +  "?sid=" + that.$store.state.sessionId + "&cmd=com.actionsoft.apps.coe.pal_user_logout";
          window.location.replace(src);
        }).catch(() => {
        });
      },
      resize() {// 窗口监听window.resize
        const that = this
        let resizeTimer = null;
        window.onresize = () => {
          return (() => {
            if (resizeTimer) clearTimeout(resizeTimer);
            resizeTimer = setTimeout(function(){
              that.bodyHeight = (document.documentElement.clientHeight - 56) + 'px';
              that.$store.commit('setTopMainHeightFn',that.bodyHeight);
            } , 400);
          })()
        }
      },
      clickDomEvent() {// 点击整个dom的事件，通过vuex进行全局状态管理
        this.$store.commit('setNavigationQueryVisibleFn',false);// 导航栏输入框快速搜索结果隐藏
      },
        saveAccessOpLog(moduleCategory) {// 记录访问各模块的审计日志
            const that = this;
            const data = {
                url:'jd',
                data:{
                    cmd : 'com.actionsoft.apps.coe.pal_access_log_save',
                    moduleCategory: moduleCategory
                }
            };
            awsuiAxios.post(data).then(function (ro) {
                if (ro.result == 'ok') {

                }
            }).catch(error=>{
                console.log(error);
            })
        },
    }
  }
</script>
<style scoped>
  #main {
    font-family: 'Avenir', Helvetica, Arial, sans-serif;
    -webkit-font-smoothing: antialiased;
    -moz-osx-font-smoothing: grayscale;
    /*text-align: center;*/
    color: #2c3e50;
    margin-top: 0px;
  }
  .main >>> .awsui-sidebar__wrapper {
    position: static;
  }
</style>
