<template>
    <div class="el-common_header_pc_2">
        <div class="common_header_pc_2"><!--使用此组件，请复制此div-->
            <div class="header-top">
                <div class="container">
                    <div class="row">
                        <div class="col-lg-12 col-md-12 col-sm-12 col-xs-12">
                            <div class="header-top-left">
                  <span class="sp1">
                    <span id="djs">{{CUR_TIME}}</span>，
                    欢迎来到江苏老年教育网！  <!--总访问量 5,7812--></span>
                                <!-- <span class="sp2"><a href="">访问量统计</a></span>-->
                            </div>
                            <div class="header-top-right">
                                <ul v-if="userData && userData.custName">
                                    <li class="login-header">
                                        <img v-if="userData.photo" :src="userData.photo" alt="">
                                        <img v-else src="../../theme-chalk/src/images/teacher02.jpg" alt="">
                                    </li>
                                    <li><a target="_blank" href="/personcenter">{{userData.custName}}</a>，欢迎您登录~</li>
                                    <li><a href="javascript:void(0)" @click="logout" class="redtxt">退出登录</a></li>
                                    <!--<li class="wza-txt"><a href="">无障碍浏览</a></li>-->


                                </ul>
                                <ul v-else>
                                    <li><a href="javascript:void(0)" @click="toLogin">用户登录</a></li>
                                    |
                                    <li><a href="javascript:void(0)" @click="toReg">新用户注册</a></li>
                                    <!--<li><a href="" class="redtxt">忘记密码</a></li>
                                    <li class="wza-txt"><a href="">无障碍浏览</a></li>-->
                                </ul>
                            </div>
                        </div>
                    </div>
                </div>
            </div>
            <div class="header-main">
                <div class="container">
                    <div class="row">
                        <div class="col-lg-7 col-md-7 col-sm-7 col-xs-12">
                            <div class="header-main-logo">
                                <a href="/index?type=sy"><img :src="siteLogo?siteLogo:'../../theme-chalk/src/images/jslndx-logo.png'" alt=""></a>
                            </div>
                        </div>
                        <div class="col-lg-5 col-md-5 col-sm-5 col-xs-12">
                            <div class="header-main-right clearfix">
                  <span class="header-main-search clearfix">
                     <input type="text" class="inp1" v-model="isearch" placeholder="输入关键字进行查找">
                     <input type="button" @click="search" class="sbtn" value="搜索">
                  </span>
                  <span style=" display:inline-block;width:102px;position: relative;top: -30px;left: 30px;">
                    <img style="width:100px;" src="../../theme-chalk/src/images/jslndx-footer-qr.png" alt="">
                    <span>扫码移动端学习</span>
                  </span>
                                <!-- <span class="header-main-login"><a href="">登录</a>/<a href="">注册</a></span> -->
                                <!--<span v-if="isLogin" class="header-main-login"><a href="/personcenter">进入个人中心</a></span> -->
                            </div>
                        </div>
                    </div>
                </div>
                <div class="header-menu">
                    <div class="container">
                        <div class="row">
                            <div class="col-lg-12 col-md-12 col-sm-12 col-xs-12">
                                <div class="header-menu-body">
                                    <ul class="clearfix" id="hearderul">
                                        <li><a @click="jump($event)" href="/index?type=sy">首 页</a></li>
                                        <li><a @click="jump($event)" href="/infolist?name=资讯中心&type=zxzx">资讯中心</a></li>
                                        <li><a @click="jump($event)" href="/courselist?type=kccs">课程中心</a></li>
                                        <li><a @click="jump($event)" href="/onlineschedule?type=zxkb">在线课表</a></li>
                                        <li><a @click="jump($event)" href="/livelist?type=zxzb">在线直播</a></li>
                                        <li><a @click="jump($event)" href="/activelist?type=hdzx">活动中心</a></li>
                                        <li><a @click="jump($event)" href="/classreglist?type=zxbm">在线报名</a></li>
                                        <li><a @click="jump($event)" href="/studymapshow?type=xxdt">学习地图</a></li>
                                        <li><a @click="jump($event)" href="/infolist?name=帮助中心&type=bzzx">帮助中心</a></li>
                                    </ul>
                                </div>
                            </div>
                        </div>
                    </div>
                </div>
            </div>
        </div>
        <ElLoginPop ref="loginpop"></ElLoginPop>
        <ElRegPop ref="regpop"></ElRegPop>
    </div>
</template>

<script>
  import $ from 'fy-kit';
  import formMixin from '../../../src/mixins/formMixin';
  import lenye_base from 'lenye_base';
  import msg from '../../message';
  import ElLoginPop from '../../login-pop';
  import ElRegPop from '../../reg-pop';

  export default {
    name: 'ElCommonHeaderPc2',
    mixins: [formMixin],
    model: {},
    data() {
      return {
        CUR_TIME: '',
        userData: {},
        isearch: '',
        isLogin: false,
        siteLogo: ''
      };
    },
    created() {
      if ($.util.storage('userData').get().getValue()) {
        this.isLogin = true;
      }
    },

    mounted() {
      this.init();
      let getsiteData=lenye_base.site_data.getsiteData();
      this.siteLogo=getsiteData&&getsiteData.siteLogo;
      if ($.util.storage('userData').get().getValue()) {
        this.info();
      }
    },
    computed: {},
    methods: {
      toLogin() {
        this.$refs.loginpop.showPop();
      },
      toReg() {
        this.$refs.regpop.showPop();
      },
      search() {
        window.location.href = '/fullsearch?isearch=' + this.isearch;
      },
      info() {
        $.util
          .ajax(
            lenye_base.base_data.getapiUrl() +
            '/base-service/api/cust/userSelf/detail.do',
            lenye_base.base_data.getformatting({})
          )
          .then(res => {
            if (res.success == '1') {
              this.userData = res.data;
            } else {
              msg.error(res.message);
            }
          });
      },
      logout() {
        localStorage.clear();
        lenye_base.user_data.loginOut();
        // todo
        setTimeout(function() {
          window.location.href = '/?type=sy';
          window.parent.location = '/?type=sy';
        }, 1000);

        // window.location.reload();
      },
      jump(ev) {
        var ele = $._.default(ev.target);
        ele
          .parent('li')
          .addClass('active')
          .siblings('li')
          .removeClass('active');//infolist
      },
      setActive(num) {
        var ul = $._.default('#hearderul');
        ul
          .find('li')
          .eq(num)
          .addClass('active')
          .siblings('li')
          .removeClass('active');
      },
      init() {
        //
        $.util
          .ajax(
            lenye_base.base_data.getapiUrl() + '/base-service/common/sysdate.do',
            lenye_base.base_data.getformatting({})
          )
          .then(res => {
            if (res.success === '1') {
              this.datas = res.data;
              var t = 1000;
              setInterval(() => {
                t += 1000;
                this.CUR_TIME = $.date
                  .moment(
                    new Date(
                      res.data.CUR_DATE + ' ' + res.data.CUR_TIME
                    ).getTime() + t
                  )
                  .format('YYYY年MM月DD日 HH:mm:ss');
              }, 1000);
              switch ($.util.urlParams('type')) {
                case 'sy':
                  this.setActive(0);
                  break;
                case 'zxzx':
                  this.setActive(1);
                  break;
                case 'kccs':
                  this.setActive(2);
                  break;
                case 'zxkb':
                  this.setActive(3);
                  break;
                case 'zxzb':
                  this.setActive(4);
                  break;
                case 'hdzx':
                  this.setActive(5);
                  break;
                case 'zxbm':
                  this.setActive(6);
                  break;
                case 'xxdt':
                  this.setActive(7);
                  break;
                case 'bzzx':
                  this.setActive(8);
                  break;
              }
            } else {
              msg.error(res.message);
            }
          });
      }
    }
  };
</script>
