dbsd_kczx/src/views/site/common/header.vue

<template>
  <a-layout-header>
    <!-- <BackTop/> -->
    <div id="topDiv" v-show="props.showRightButton">
      <a-row >
        <a-col :xs="{ span: 0 }" :sm="{ span: 24 }" :lg="{ span: 24 }">
          <div class="topButton" @click="toTop" style="float: right;">
            <ArrowUpOutlined/>
          </div>
        </a-col>
        <a-col :xs="{ span: 0 }" :sm="{ span: 24 }" :lg="{ span: 24 }">
          <div class="topYiJianFanKui" @click="funYjfk" style="float: right;">
            意见反馈
          </div>
        </a-col>
        <!-- <a-col :xs="{ span: 0 }" :sm="{ span: 24 }" :lg="{ span: 24 }">
        </a-col> -->
      </a-row>
    </div>
    <div id="leftDiv" v-show="props.showRightButton">
      <a-row >
        <a-col :xs="{ span: 0 }" :sm="{ span: 24 }" :lg="{ span: 24 }">
          <a-menu style="margin-top: 20px;" :selectable="false">
            <a-menu-item key="1" v-if="getSysConfig().flag7=='1'&& getSysConfig().sfbmd=='n'">
              <a class="abox" @click="toDom('tkzjDom')">听课足迹</a>
            </a-menu-item>
            <a-menu-item key="2" v-if="getSysConfig().flag7=='1'&& getSysConfig().sfbmd=='n'">
              <a class="abox" @click="toDom('tkzjDom')">评课足迹</a>
            </a-menu-item>
            <a-menu-item key="3" v-if="getSysConfig().flag2=='1'&& getSysConfig().sfbmd=='n'">
              <a class="abox" @click="toDom('rkjcDom')">任教课程</a>
            </a-menu-item>
            <a-menu-item key="8" v-if="getSysConfig().sfbmd=='n'">
              <a class="abox" @click="toDom('pjjgDom')">评价结果</a>
            </a-menu-item>
            <a-menu-item key="4" v-if="getSysConfig().flag3=='1'&& getSysConfig().sfbmd=='n'">
              <a class="abox" @click="toDom('yykcDom')">预约课程</a>
            </a-menu-item>
            <a-menu-item key="5" v-if="getSysConfig().flag4=='1'&& getSysConfig().sfbmd=='n'">
              <a class="abox" @click="toDom('jcgkkDom')">公&nbsp;&nbsp;开&nbsp;&nbsp;课</a>
            </a-menu-item>
            <a-menu-item key="6" v-if="getSysConfig().flag5=='1'">
              <a class="abox" @click="toDom('kxstkktDom')">线上听课</a>
            </a-menu-item>
            <a-menu-item key="7" v-if="getSysConfig().flag6=='1'">
              <a class="abox" @click="toDom('jrkclbDom')">课程查询</a>
            </a-menu-item>
            <a-menu-item key="8" v-if="getSysConfig().sfbmd=='n'" >
              <a class="abox" @click="toDom('ktsbDom')">听课笔记</a>
            </a-menu-item>
          </a-menu>
        </a-col>
      </a-row>


      <!-- <div style="background-color: #fff;">
        <div>&nbsp;</div>
        <div class="topLinkTextEllipsis"><a class="abox" @click="toDom('tkzjDom')">听课足迹</a></div>
        <div class="topLinkTextEllipsis"><a class="abox" @click="toDom('rkjcDom')">任教课程</a></div>
        <div class="topLinkTextEllipsis"><a class="abox" @click="toDom('yykcDom')">预约课程</a></div>
        <div class="topLinkTextEllipsis"><a class="abox" @click="toDom('jcgkkDom')">公&nbsp;&nbsp;开&nbsp;&nbsp;课</a></div>
        <div class="topLinkTextEllipsis"><a class="abox" @click="toDom('kxstkktDom')">线上听课</a></div>
        <div class="topLinkTextEllipsis"><a class="abox" @click="toDom('jrkclbDom')">今日课程</a></div>
      </div> -->
    </div>

    <span class="topTitle" >
      <div hidden @click="testKuayu">点击开始跨域报错</div>
      <RouterLink :to="{path:'/site/index'}" style="color:white;">{{ projectName }}
        <span style="font-size: 16px;" v-if="getSysConfig().flag1">{{getSysConfig().flag1}}({{getSysConfig().bxqkssj}}至{{getSysConfig().bxqjssj}})</span>
        <span style="font-size: 16px;margin-left: 20px;" >本学期听课要求：{{tkyqcs}}<span v-if="tkyqcs!='未配置'">次</span>；已完成：{{tkyqywc}}次</span>
      </RouterLink>
      <RouterLink hidden target='_blank' :to="{path:'/site/liveView',query:{ url: 'rtsp://176.139.87.16/axis-media/media.amp' }}">直播测试页rtsp</RouterLink>
      <RouterLink hidden target='_blank' :to="{path:'/site/liveFlvView',query:{ url: 'rtsp://176.139.87.16/axis-media/media.amp' }}">直播测试页flv</RouterLink>
      <RouterLink hidden target='_blank' :to="{path:'/site/livem3u8View',query:{ url: 'https://zxkccx.webvpn.nenu.edu.cn:9553/live_hls/yfjxl101s_lbzj.m3u8' }}">直播测试页m3u8</RouterLink>
      <RouterLink hidden target='_blank' :to="{path:'/site/liveRoom',query:{ id: '1139010101' }}">直播测试页（正式课堂）m3u8</RouterLink>
    </span>
    <span class="topRight">
      <a-dropdown>
        <span class="ant-dropdown-link topRightMenu" @click.prevent>
          {{ userStore?.getUserInfo?.realname }}
          <DownOutlined/>
        </span>
        <template #overlay>
          <a-menu>
            <a-menu-item  v-if="getUserSf()=='T'">
              <RouterLink to="/dashboard/analysis" target="_blank">后台管理</RouterLink>
            </a-menu-item>
            <a-menu-item>
              <a href="javascript:void(0);" @click="userStore?.confirmLoginOut();">安全退出</a>
            </a-menu-item>
          </a-menu>
        </template>
      </a-dropdown>
    </span>
    <YjfkModal ref="YjfkModalTab"></YjfkModal>
  </a-layout-header>
</template>
<script setup lang="ts">
  import { ref,onMounted } from 'vue';
  import { DownOutlined, ArrowUpOutlined } from '@ant-design/icons-vue';
  import { useUserStore } from '/@/store/modules/user';
  import YjfkModal from '/@/views/site/yjfk/YjfkModal.vue';
  import { getUserSf,getSysConfig } from '/@/views/site/utils/index';
  import { defHttp, transform } from '/@/utils/http/axios';


  import { VAxios } from '/@/utils/http/axios/Axios';

  const tkyqcs = ref<string>('未配置');
  const tkyqywc = ref<string>('0');
  const props = defineProps({
    showRightButton: { type: Boolean, default: false }
  });


  const yqlist = (queryParam) => defHttp.get({ url: '/kcTingke/kcTingke/getUserTingkeInfo', params:queryParam });
  const projectName = import.meta.env.VITE_GLOB_APP_TITLE;

  const YjfkModalTab = ref();
  //用户相关
  const userStore = useUserStore();

function toIndex(){
  window.location.href="/site/index"
}

  //进入就加载
  onMounted(() => {

    yqlist(null).then(res=>{
      var list = res
      if(list){
        tkyqcs.value = Number(list.tkyq)||'未配置'
        tkyqywc.value = list.sjtksl||'0'
      }
    })
  });
  function smoothScroll(topNum){
    setTimeout(() => {
      if(topNum > 0){
        topNum = topNum - 50;
        document.body.scrollTop = topNum;
        smoothScroll(topNum);
      }
    },1);
  }

  function toTop(){
    let topNum = 0;
    topNum = document.body.scrollTop;
    smoothScroll(topNum);
  }

  function toDom(toId){
    let toDom: any = document?.querySelector('#' + toId);
    let topNum = toDom?.offsetTop??0;
    document.body.scrollTop = topNum;
  }

  /**
   * 意见反馈
   */
  function funYjfk(){
    YjfkModalTab.value.add()
  }

  const axios = new VAxios({
    transform: {
      transformRequestHook: transform.transformRequestHook,
      responseInterceptorsCatch: transform.responseInterceptorsCatch,
    }
  });
  function testKuayu() {
    axios.get({ url: 'https://webvpn.nenu.edu.cn/vpn_key/update?origin=https%3A%2F%2Fzxkccx.webvpn.nenu.edu.cn%2Fjeecg-boot%2FkcJieci%2FkcJieci%2FgetIndexJcList%3F_t%3D1696816325815&reason=site+zxkccx.webvpn.nenu.edu.cn+not+found' });
  }

</script>
<style lang="less" scoped>
#siteMain {
  #maxSite {
    .topTitle {
      font-size: 1.5rem;
    }
    .topRight {
      float: right;
      .topRightMenu {
        font-size: 1.1rem;
      }
    }
    .footerRight {
      float: right;
    }
  }
}
#topDiv {
  position: absolute;
  right: 1rem;
  top: 5rem;
  z-index: 1;
  width: 100px;
  .topButton {
    background: #c2c2c2;
    margin-bottom: 2rem;
    padding: 0.5rem;
    width: 4rem;
    font-size:3rem;
  }
  .topYiJianFanKui {
    background: #1c84c6;
    color:#FFF;
    font-size:1.5rem;
    padding: 0.5rem;
    width: 4rem;
    line-height: 2.1rem;
  }
  .topLinkTextEllipsis {
    line-height: 18px;
    overflow:hidden;
    white-space: nowrap;
    text-overflow: ellipsis;
    -o-text-overflow:ellipsis;
  }
  .abox {
    //border-radius: 50%;
    //background: #1c84c6;
    //color: #fff;
    //order: dotted red;
    // padding: 0.5rem 0.5rem 0.5rem 0;
    // border: dotted #1c84c6;
    // color: black;
  }
}
#leftDiv {
  position: absolute;
  left: 1rem;
  top: 5rem;
  z-index: 1;
  width: 100px;
}



</style>