mirror of
https://codeup.aliyun.com/67762337eccfc218f6110e0e/vue/fe-manage.git
synced 2025-12-12 04:16:47 +08:00
1291 lines
43 KiB
Vue
1291 lines
43 KiB
Vue
<template>
|
||
<div
|
||
class="navLeft"
|
||
:style="{
|
||
width: packup ? '100px' : '208px',
|
||
height: screenHeight - 80 + 'px',
|
||
}"
|
||
>
|
||
<div style="display: flex; justify-content: flex-end">
|
||
<img
|
||
class="packup"
|
||
src="../assets/images/navleft/packup.png"
|
||
@click="packUp"
|
||
:style="{ 'margin-right': packup ? '36px' : '14px' }"
|
||
/>
|
||
</div>
|
||
<div
|
||
style="width: 100%; margin-top: 26px"
|
||
:style="{ display: packup ? 'none' : 'block' }"
|
||
>
|
||
<a-menu
|
||
id="dddddd"
|
||
:open-keys="openKeys"
|
||
:selectedKeys="selectedKeys"
|
||
style="width: 208px"
|
||
mode="inline"
|
||
@openChange="onOpenChange"
|
||
@select="selectItem"
|
||
>
|
||
<a-sub-menu v-if="checkMenu('coursereviewedn,coursereviewed,projectreviewedn,projectreviewed')" key="sub10"
|
||
@titleClick="titleClick">
|
||
<template #icon>
|
||
<div class="imgBox">
|
||
<img
|
||
style="width: 22px; height: 22px"
|
||
src="../assets/images/navleft/review.png"
|
||
/>
|
||
</div>
|
||
</template>
|
||
<template #title>审核管理</template>
|
||
<a-menu-item key="sub10-1" v-if="checkMenu('coursereviewedn')">
|
||
<span
|
||
:class="{
|
||
circleActive: selectedKeys[0] === 'sub10-1' ? true : false,
|
||
circle: selectedKeys[0] === 'sub10-1' ? false : true,
|
||
}"
|
||
></span>
|
||
<router-link to="/coursereviewedn">待审核课程</router-link>
|
||
</a-menu-item>
|
||
<a-menu-item key="sub10-2" v-if="checkMenu('coursereviewed')">
|
||
<span
|
||
:class="{
|
||
circleActive: selectedKeys[0] === 'sub10-2' ? true : false,
|
||
circle: selectedKeys[0] === 'sub10-2' ? false : true,
|
||
}"
|
||
></span>
|
||
<router-link to="/coursereviewed">已审核课程</router-link>
|
||
</a-menu-item>
|
||
<a-menu-item key="sub10-3" v-if="checkMenu('projectreviewedn')">
|
||
<span
|
||
:class="{
|
||
circleActive: selectedKeys[0] === 'sub10-3' ? true : false,
|
||
circle: selectedKeys[0] === 'sub10-3' ? false : true,
|
||
}"
|
||
></span>
|
||
<router-link to="/projectreviewedn">待审核项目</router-link>
|
||
</a-menu-item>
|
||
<a-menu-item key="sub10-4" v-if="checkMenu('projectreviewed')">
|
||
<span
|
||
:class="{
|
||
circleActive: selectedKeys[0] === 'sub10-4' ? true : false,
|
||
circle: selectedKeys[0] === 'sub10-4' ? false : true,
|
||
}"
|
||
></span>
|
||
<router-link to="/projectreviewed">已审核项目</router-link>
|
||
</a-menu-item>
|
||
</a-sub-menu>
|
||
|
||
<a-menu-item key="sub1" @titleClick="titleClick" v-if="checkMenu('learningpath')">
|
||
<div class="imgBox">
|
||
<img
|
||
style="width: 20px; height: 18px"
|
||
src="../assets/images/navleft/studyPath.png"
|
||
/>
|
||
</div>
|
||
<router-link to="/learningpath">学习路径图</router-link>
|
||
</a-menu-item>
|
||
|
||
<a-sub-menu key="sub2" @titleClick="titleClick" v-if="checkMenu('projectmanage,templatelibrary')">
|
||
<template #icon>
|
||
<div class="imgBox">
|
||
<img
|
||
style="width: 15px; height: 15px"
|
||
src="../assets/images/navleft/project.png"
|
||
/>
|
||
</div>
|
||
</template>
|
||
<template #title>项目中心</template>
|
||
<a-menu-item key="sub2-1" v-if="checkMenu('projectmanage')">
|
||
<span
|
||
:class="{
|
||
circleActive: selectedKeys[0] === 'sub2-1' ? true : false,
|
||
circle: selectedKeys[0] === 'sub2-1' ? false : true,
|
||
}"
|
||
></span>
|
||
<router-link to="/projectmanage">项目</router-link>
|
||
</a-menu-item>
|
||
<a-menu-item key="sub2-2" v-if="checkMenu('templatelibrary')">
|
||
<span
|
||
:class="{
|
||
circleActive: selectedKeys[0] === 'sub2-2' ? true : false,
|
||
circle: selectedKeys[0] === 'sub2-2' ? false : true,
|
||
}"
|
||
></span>
|
||
<router-link to="/templatelibrary">模板库</router-link>
|
||
</a-menu-item>
|
||
</a-sub-menu>
|
||
|
||
<a-sub-menu key="sub3" v-if="checkMenu('coursewaremanage,onlinemanage,coursemanage,courserecommended')">
|
||
<template #icon>
|
||
<div class="imgBox">
|
||
<img
|
||
style="width: 18px; height: 15px"
|
||
src="../assets/images/navleft/course.png"
|
||
/>
|
||
</div>
|
||
</template>
|
||
<template #title>课程库</template>
|
||
<a-menu-item key="sub3-1" v-if="checkMenu('coursewaremanage')">
|
||
<span
|
||
:class="{
|
||
circleActive: selectedKeys[0] === 'sub3-1' ? true : false,
|
||
circle: selectedKeys[0] === 'sub3-1' ? false : true,
|
||
}"
|
||
></span>
|
||
<router-link to="/coursewaremanage">面授管理</router-link>
|
||
</a-menu-item>
|
||
<a-menu-item key="sub3-2" v-if="checkMenu('onlinemanage')">
|
||
<span
|
||
:class="{
|
||
circleActive: selectedKeys[0] === 'sub3-2' ? true : false,
|
||
circle: selectedKeys[0] === 'sub3-2' ? false : true,
|
||
}"
|
||
></span>
|
||
<router-link to="/onlinemanage">在线管理</router-link>
|
||
</a-menu-item>
|
||
<a-menu-item key="sub3-3" v-if="checkMenu('coursemanage')">
|
||
<span
|
||
:class="{
|
||
circleActive: selectedKeys[0] === 'sub3-3' ? true : false,
|
||
circle: selectedKeys[0] === 'sub3-3' ? false : true,
|
||
}"
|
||
></span>
|
||
<router-link to="/coursemanage">课件管理</router-link>
|
||
</a-menu-item>
|
||
<a-menu-item key="sub3-4">
|
||
<span
|
||
:class="{
|
||
circleActive: selectedKeys[0] === 'sub3-4' ? true : false,
|
||
circle: selectedKeys[0] === 'sub3-4' ? false : true,
|
||
}"
|
||
></span>
|
||
<router-link to="/courserecommended">课程推荐</router-link>
|
||
</a-menu-item>
|
||
</a-sub-menu>
|
||
<!-- 2022-12-10注释 后面放开 -->
|
||
<!-- <a-menu-item key="sub4" @titleClick="titleClick">
|
||
<div class="imgBox">
|
||
<img
|
||
style="width: 19px; height: 19px"
|
||
src="../assets/images/navleft/exam.png"
|
||
/>
|
||
</div>
|
||
<span>考试中心</span>
|
||
</a-menu-item> -->
|
||
<a-menu-item key="sub5" @titleClick="titleClick" v-if="checkMenu('researchmanage')">
|
||
<div class="imgBox">
|
||
<img
|
||
style="width: 16px; height: 16px"
|
||
src="../assets/images/navleft/survey.png"
|
||
/>
|
||
</div>
|
||
<router-link to="/researchmanage">评估管理</router-link>
|
||
</a-menu-item>
|
||
|
||
<!-- <a-sub-menu key="sub6">
|
||
<template #icon>
|
||
<div class="imgBox">
|
||
<img
|
||
style="width: 22px; height: 22px"
|
||
src="../assets/images/navleft/review.png"
|
||
/>
|
||
</div>
|
||
</template>
|
||
<template #title>系统管理</template>
|
||
<a-menu-item key="sub6-1">
|
||
<span
|
||
:class="{
|
||
circleActive: selectedKeys[0] === 'sub6-1',
|
||
circle: selectedKeys[0]!=='sub6-1',
|
||
}"
|
||
></span>
|
||
<router-link to="/dictmanage">字典管理</router-link>
|
||
</a-menu-item>
|
||
</a-sub-menu> -->
|
||
<a-menu-item key="sub21" @titleClick="titleClick" v-if="checkMenu('audiencemanage')">
|
||
<div class="imgBox">
|
||
<img
|
||
style="width: 16px; height: 16px"
|
||
src="../assets/images/navleft/review.png"
|
||
/>
|
||
</div>
|
||
<router-link to="/audiencemanage">受众管理</router-link>
|
||
</a-menu-item>
|
||
<a-menu-item key="sub5" v-if="checkMenu('systemManage')">
|
||
<div class="imgBox">
|
||
<img style="width: 16px; height: 16px" src="../assets/images/navleft/system.png"/>
|
||
</div>
|
||
<router-link to="/researchmanage">评估管理</router-link>
|
||
</a-menu-item>
|
||
<!-- 2022-12-10注释 后面放开 -->
|
||
<!-- <a-menu-item key="sub6" @titleClick="titleClick">
|
||
<div class="imgBox">
|
||
<img
|
||
style="width: 17px; height: 15px"
|
||
src="../assets/images/navleft/report.png"
|
||
/>
|
||
</div>
|
||
<span>报表中心</span>
|
||
</a-menu-item> -->
|
||
<!-- 2022-12-10注释 后面放开 -->
|
||
<!-- <a-menu-item key="sub7" @titleClick="titleClick">
|
||
<div class="imgBox">
|
||
<img
|
||
style="width: 17px; height: 18px"
|
||
src="../assets/images/navleft/teacher.png"
|
||
/>
|
||
</div>
|
||
<span>教师管理</span>
|
||
</a-menu-item> -->
|
||
<!-- 2022-12-10注释 后面放开 -->
|
||
<!-- <a-menu-item key="sub8" @titleClick="titleClick">
|
||
<div class="imgBox">
|
||
<img
|
||
style="width: 20px; height: 20px"
|
||
src="../assets/images/navleft/certificate.png"
|
||
/>
|
||
</div>
|
||
<span>证书中心</span>
|
||
</a-menu-item> -->
|
||
<!-- <a-menu-item key="sub9" @titleClick="titleClick">
|
||
<div class="imgBox">
|
||
<img
|
||
style="width: 19px; height: 18px"
|
||
src="../assets/images/navleft/system.png"
|
||
/>
|
||
</div>
|
||
<span>系统管理</span> -->
|
||
<!-- <router-link to="/systemmanage">系统管理</router-link> -->
|
||
<!-- </a-menu-item> -->
|
||
|
||
<a-sub-menu key="sub11" @titleClick="titleClick"
|
||
v-if="checkMenu('questionmanage,papermanage,examinationcenter')">
|
||
<template #icon>
|
||
<div class="imgBox">
|
||
<img
|
||
style="width: 16px; height: 16px"
|
||
src="../assets/images/navleft/test.png"
|
||
/>
|
||
</div>
|
||
</template>
|
||
<template #title>考试</template>
|
||
<a-menu-item key="sub11-1" v-if="checkMenu('questionmanage')">
|
||
<span
|
||
:class="{
|
||
circleActive: selectedKeys[0] === 'sub11-1' ? true : false,
|
||
circle: selectedKeys[0] === 'sub11-1' ? false : true,
|
||
}"
|
||
></span>
|
||
<router-link to="/questionmanage">试题管理</router-link>
|
||
</a-menu-item>
|
||
<a-menu-item key="sub11-2" v-if="checkMenu('papermanage')">
|
||
<span
|
||
:class="{
|
||
circleActive: selectedKeys[0] === 'sub11-2' ? true : false,
|
||
circle: selectedKeys[0] === 'sub11-2' ? false : true,
|
||
}"
|
||
></span>
|
||
<router-link to="/papermanage">试卷管理</router-link>
|
||
</a-menu-item>
|
||
<a-menu-item key="sub11-3" v-if="checkMenu('examinationcenter')">
|
||
<span
|
||
:class="{
|
||
circleActive: selectedKeys[0] === 'sub11-3' ? true : false,
|
||
circle: selectedKeys[0] === 'sub11-3' ? false : true,
|
||
}"
|
||
></span>
|
||
<router-link to="/examinationcenter">考试管理</router-link>
|
||
</a-menu-item>
|
||
</a-sub-menu>
|
||
<!-- <a-menu-item key="sub12" @titleClick="titleClick" v-if="checkMenu('casemanage')">
|
||
<div class="imgBox">
|
||
<img
|
||
style="width: 20px; height: 20px"
|
||
src="../assets/images/navleft/case.png"
|
||
/>
|
||
</div>
|
||
<router-link to="/casemanage">案例管理</router-link>
|
||
</a-menu-item> -->
|
||
<!-- 案例修改 -->
|
||
<!-- <a-sub-menu key="sub12" @titleClick="titleClick" v-if="checkMenu('casemanage')"> -->
|
||
<a-sub-menu key="sub12" @titleClick="titleClick" v-if="checkMenu('casemanage,caserecommended')">
|
||
<template #icon>
|
||
<div class="imgBox">
|
||
<img
|
||
style="width: 16px; height: 16px"
|
||
src="../assets/images/navleft/case.png"
|
||
/>
|
||
</div>
|
||
</template>
|
||
<template #title>案例</template>
|
||
<a-menu-item key="sub12-1" v-if="checkMenu('casemanage')">
|
||
<span
|
||
:class="{
|
||
circleActive: selectedKeys[0] === 'sub12-1' ? true : false,
|
||
circle: selectedKeys[0] === 'sub12-1' ? false : true,
|
||
}"
|
||
></span>
|
||
<router-link to="/casemanage">案例管理</router-link>
|
||
</a-menu-item>
|
||
<a-menu-item key="sub12-2" v-if="checkMenu('caserecommended')">
|
||
<span
|
||
:class="{
|
||
circleActive: selectedKeys[0] === 'sub12-2' ? true : false,
|
||
circle: selectedKeys[0] === 'sub12-2' ? false : true,
|
||
}"
|
||
></span>
|
||
<router-link to="/caserecommended">案例推荐</router-link>
|
||
</a-menu-item>
|
||
</a-sub-menu>
|
||
<!-- 教师专区 -->
|
||
<a-sub-menu key="sub22" @titleClick="titleClick" v-if="checkMenu('gratefulnotice,gratefulcarousel,teacherempowerment,teachertopic,tooldown,teacheropinion')">
|
||
<template #icon>
|
||
<div class="imgBox">
|
||
<img
|
||
style="width: 16px; height: 16px"
|
||
src="../assets/images/navleft/grateful.png"
|
||
/>
|
||
</div>
|
||
</template>
|
||
<template #title>教师专区</template>
|
||
<a-menu-item key="sub22-1" v-if="checkMenu('gratefulnotice')">
|
||
<span
|
||
:class="{
|
||
circleActive: selectedKeys[0] === 'sub22-1' ? true : false,
|
||
circle: selectedKeys[0] === 'sub22-1' ? false : true,
|
||
}"
|
||
></span>
|
||
<router-link to="/gratefulnotice">通知</router-link>
|
||
</a-menu-item>
|
||
<a-menu-item key="sub22-2" v-if="checkMenu('gratefulcarousel')">
|
||
<span
|
||
:class="{
|
||
circleActive: selectedKeys[0] === 'sub22-2' ? true : false,
|
||
circle: selectedKeys[0] === 'sub22-2' ? false : true,
|
||
}"
|
||
></span>
|
||
<router-link to="/gratefulcarousel">轮播图</router-link>
|
||
</a-menu-item>
|
||
<a-menu-item key="sub22-3" v-if="checkMenu('teacherempowerment')">
|
||
<span
|
||
:class="{
|
||
circleActive: selectedKeys[0] === 'sub22-3' ? true : false,
|
||
circle: selectedKeys[0] === 'sub22-3' ? false : true,
|
||
}"
|
||
></span>
|
||
<router-link to="/teacherempowerment">教师赋能</router-link>
|
||
</a-menu-item>
|
||
<a-menu-item key="sub22-4" v-if="checkMenu('teachertopic')">
|
||
<span
|
||
:class="{
|
||
circleActive: selectedKeys[0] === 'sub22-4' ? true : false,
|
||
circle: selectedKeys[0] === 'sub22-4' ? false : true,
|
||
}"
|
||
></span>
|
||
<router-link to="/teachertopic">认证讲师库（2023）</router-link>
|
||
</a-menu-item>
|
||
<a-menu-item key="sub22-5" v-if="checkMenu('tooldown')">
|
||
<span
|
||
:class="{
|
||
circleActive: selectedKeys[0] === 'sub22-5' ? true : false,
|
||
circle: selectedKeys[0] === 'sub22-5' ? false : true,
|
||
}"
|
||
></span>
|
||
<router-link to="/tooldown">工具下载</router-link>
|
||
</a-menu-item>
|
||
<a-menu-item key="sub22-6" v-if="checkMenu('teacheropinion')">
|
||
<span
|
||
:class="{
|
||
circleActive: selectedKeys[0] === 'sub22-6' ? true : false,
|
||
circle: selectedKeys[0] === 'sub22-6' ? false : true,
|
||
}"
|
||
></span>
|
||
<router-link to="/teacheropinion">意见</router-link>
|
||
</a-menu-item>
|
||
</a-sub-menu>
|
||
<a-menu-item key="sub13" @titleClick="titleClick" v-if="checkMenu('articlemanage')">
|
||
<div class="imgBox">
|
||
<img
|
||
style="width: 20px; height: 20px"
|
||
src="../assets/images/navleft/article.png"
|
||
/>
|
||
</div>
|
||
<router-link to="/articlemanage">文章管理</router-link>
|
||
</a-menu-item>
|
||
<a-menu-item key="sub14" @titleClick="titleClick" v-if="checkMenu('qamanage')">
|
||
<div class="imgBox">
|
||
<img
|
||
style="width: 20px; height: 20px"
|
||
src="../assets/images/navleft/qa.png"
|
||
/>
|
||
</div>
|
||
<router-link to="/qamanage">问答管理</router-link>
|
||
</a-menu-item>
|
||
<a-menu-item key="sub15" @titleClick="titleClick" v-if="checkMenu('download')">
|
||
<div class="imgBox">
|
||
<img
|
||
style="width: 20px; height: 20px"
|
||
src="../assets/images/navleft/qa.png"
|
||
/>
|
||
</div>
|
||
<router-link to="/download">下载中心</router-link>
|
||
</a-menu-item>
|
||
<!-- 20230804影藏 20230815放开-->
|
||
<a-sub-menu key="sub17" v-if="checkMenu('operational,learningpathmap,reportproject,curriculum,caseess,reportarticle,questionsandanswers,reportexamination,overvoew,employeelearning')">
|
||
<template #icon>
|
||
<div class="imgBox">
|
||
<img
|
||
style="width: 18px; height: 15px"
|
||
src="../assets/images/navleft/report.png"
|
||
/>
|
||
</div>
|
||
</template>
|
||
<template #title>报表中心</template>
|
||
<a-menu-item key="sub17-1" v-if="checkMenu('operational')">
|
||
<span
|
||
:class="{
|
||
circleActive: selectedKeys[0] === 'sub17-1' ? true : false,
|
||
circle: selectedKeys[0] === 'sub17-1' ? false : true,
|
||
}"
|
||
></span>
|
||
<router-link to="/operational">运营数据概览</router-link>
|
||
</a-menu-item>
|
||
<a-sub-menu key="sub17-2" class="treeMenu" v-if="checkMenu('learningpathmap,reportproject,curriculum,caseess,reportarticle,questionsandanswers,reportexamination')">
|
||
<template #icon>
|
||
<div class="img"></div>
|
||
</template>
|
||
<template #title>版块详细数据</template>
|
||
<a-menu-item key="sub17-2-1" v-if="checkMenu('learningpathmap')">
|
||
<span
|
||
:class="{
|
||
circleActive: selectedKeys[0] === 'sub17-2-1' ? true : false,
|
||
circle: selectedKeys[0] === 'sub17-2-1' ? false : true,
|
||
}"
|
||
></span>
|
||
<router-link to="/learningpathmap">学习路径图</router-link>
|
||
</a-menu-item>
|
||
<a-menu-item key="sub17-2-2" v-if="checkMenu('reportproject')">
|
||
<span
|
||
:class="{
|
||
circleActive: selectedKeys[0] === 'sub17-2-2' ? true : false,
|
||
circle: selectedKeys[0] === 'sub17-2-2' ? false : true,
|
||
}"
|
||
></span>
|
||
<router-link to="/reportproject">项目</router-link>
|
||
</a-menu-item>
|
||
<a-menu-item key="sub17-2-3" v-if="checkMenu('curriculum')">
|
||
<span
|
||
:class="{
|
||
circleActive: selectedKeys[0] === 'sub17-2-3' ? true : false,
|
||
circle: selectedKeys[0] === 'sub17-2-3' ? false : true,
|
||
}"
|
||
></span>
|
||
<router-link to="/curriculum">课程</router-link>
|
||
</a-menu-item>
|
||
<a-menu-item key="sub17-2-4" v-if="checkMenu('caseess')">
|
||
<span
|
||
:class="{
|
||
circleActive: selectedKeys[0] === 'sub17-2-4' ? true : false,
|
||
circle: selectedKeys[0] === 'sub17-2-4' ? false : true,
|
||
}"
|
||
></span>
|
||
<router-link to="/caseess">案例</router-link>
|
||
</a-menu-item>
|
||
<a-menu-item key="sub17-2-5" v-if="checkMenu('reportarticle')">
|
||
<span
|
||
:class="{
|
||
circleActive: selectedKeys[0] === 'sub17-2-5' ? true : false,
|
||
circle: selectedKeys[0] === 'sub17-2-5' ? false : true,
|
||
}"
|
||
></span>
|
||
<router-link to="/reportarticle">文章</router-link>
|
||
</a-menu-item>
|
||
<a-menu-item key="sub17-2-6" v-if="checkMenu('questionsandanswers')">
|
||
<span
|
||
:class="{
|
||
circleActive: selectedKeys[0] === 'sub17-2-6' ? true : false,
|
||
circle: selectedKeys[0] === 'sub17-2-6' ? false : true,
|
||
}"
|
||
></span>
|
||
<router-link to="/questionsandanswers">问答</router-link>
|
||
</a-menu-item>
|
||
<a-menu-item key="sub17-2-7" v-if="checkMenu('reportexamination')">
|
||
<span
|
||
:class="{
|
||
circleActive: selectedKeys[0] === 'sub17-2-7' ? true : false,
|
||
circle: selectedKeys[0] === 'sub17-2-7' ? false : true,
|
||
}"
|
||
></span>
|
||
<router-link to="/reportexamination">考试</router-link>
|
||
</a-menu-item>
|
||
</a-sub-menu>
|
||
<a-sub-menu key="sub17-3" class="treeMenu" v-if="checkMenu('overvoew,employeelearning')">
|
||
<template #icon>
|
||
<div class="img"></div>
|
||
</template>
|
||
<template #title>组织学习数据</template>
|
||
<a-menu-item key="sub17-3-1" v-if="checkMenu('overvoew')">
|
||
<span
|
||
:class="{
|
||
circleActive: selectedKeys[0] === 'sub17-3-1' ? true : false,
|
||
circle: selectedKeys[0] === 'sub17-3-1' ? false : true,
|
||
}"
|
||
></span>
|
||
<router-link to="/overvoew">概览</router-link>
|
||
</a-menu-item>
|
||
<a-menu-item key="sub17-3-2" v-if="checkMenu('employeelearning')">
|
||
<span
|
||
:class="{
|
||
circleActive: selectedKeys[0] === 'sub17-3-2' ? true : false,
|
||
circle: selectedKeys[0] === 'sub17-3-2' ? false : true,
|
||
}"
|
||
></span>
|
||
<router-link to="/employeelearning">员工学习数据</router-link>
|
||
</a-menu-item>
|
||
</a-sub-menu>
|
||
</a-sub-menu>
|
||
<a-menu-item key="sub16" v-if="checkMenu('OldSystemManage')">
|
||
<div class="imgBox">
|
||
<img
|
||
style="width: 22px; height: 22px"
|
||
src="../assets/images/navleft/review.png"
|
||
/>
|
||
</div>
|
||
<a target="_blank" :href="oldManage">旧版管理员界面</a>
|
||
</a-menu-item>
|
||
|
||
<!-- <router-link target="_blank" to="/oldsystemmanage">旧版管理员界面</router-link> -->
|
||
<a-menu-item key="sub17" v-if="checkMenu('ReadingClubManage')">
|
||
<div class="imgBox">
|
||
<img
|
||
style="width: 22px; height: 22px"
|
||
src="../assets/images/navleft/review.png"
|
||
/>
|
||
</div>
|
||
<router-link to="/readingclubmanage">业务支援读书会管理</router-link>
|
||
</a-menu-item>
|
||
<a-menu-item key="sub18" v-if="checkMenu('dictmanage')">
|
||
<div class="imgBox">
|
||
<img
|
||
style="width: 22px; height: 22px"
|
||
src="../assets/images/navleft/review.png"
|
||
/>
|
||
</div>
|
||
<router-link to="/dictmanage">字典管理</router-link>
|
||
</a-menu-item>
|
||
|
||
|
||
</a-menu>
|
||
</div>
|
||
<div
|
||
style="width: 100%; margin-top: 26px"
|
||
:style="{ display: packup ? 'block' : 'none' }"
|
||
class="packupMenu"
|
||
>
|
||
<a-menu
|
||
id="dddddd"
|
||
v-model:openKeys="openKeys2"
|
||
v-model:selectedKeys="selectedKeys2"
|
||
style="width: 100px"
|
||
mode="inline"
|
||
@click="handleClick"
|
||
>
|
||
<a-menu-item key="sub10" @titleClick="titleClick">
|
||
<router-link to="/coursereviewedn">审核</router-link>
|
||
</a-menu-item>
|
||
<a-menu-item key="sub1" @titleClick="titleClick">
|
||
<router-link to="/learningpath">学习</router-link>
|
||
</a-menu-item>
|
||
|
||
<a-menu-item key="sub2" @titleClick="titleClick">
|
||
<router-link to="/projectmanage">项目</router-link>
|
||
</a-menu-item>
|
||
|
||
<a-menu-item key="sub3" @titleClick="titleClick">
|
||
<router-link to="/coursewaremanage">课程</router-link>
|
||
</a-menu-item>
|
||
<!-- 2022-12-10注释 后面放开 -->
|
||
<!-- <a-menu-item key="sub4" @titleClick="titleClick">
|
||
<span>考试</span>
|
||
</a-menu-item> -->
|
||
|
||
<a-menu-item key="sub5" @titleClick="titleClick">
|
||
<router-link to="/researchmanage">评估</router-link>
|
||
</a-menu-item>
|
||
<!-- 2022-12-10注释 后面放开 -->
|
||
<!-- <a-menu-item key="sub6" @titleClick="titleClick">
|
||
<span>报表</span>
|
||
</a-menu-item>
|
||
|
||
<a-menu-item key="sub7" @titleClick="titleClick">
|
||
<span>教师</span>
|
||
</a-menu-item>
|
||
|
||
<a-menu-item key="sub8" @titleClick="titleClick">
|
||
<span>证书</span>
|
||
</a-menu-item>
|
||
<a-menu-item key="sub9" @titleClick="titleClick">
|
||
<span>系统</span>
|
||
</a-menu-item> -->
|
||
|
||
<a-menu-item key="sub11" @titleClick="titleClick">
|
||
<router-link to="/examinationcenter">考试</router-link>
|
||
</a-menu-item>
|
||
<a-menu-item key="sub12" @titleClick="titleClick">
|
||
<router-link to="/casemanage">案例</router-link>
|
||
</a-menu-item>
|
||
<a-menu-item key="sub22" @titleClick="titleClick">
|
||
<router-link to="/tooldown">教师专区</router-link>
|
||
</a-menu-item>
|
||
<a-menu-item key="sub13" @titleClick="titleClick">
|
||
<router-link to="/articlemanage">文章</router-link>
|
||
</a-menu-item>
|
||
<a-menu-item key="sub14" @titleClick="titleClick">
|
||
<router-link to="/qamanage">问答</router-link>
|
||
</a-menu-item>
|
||
<a-menu-item key="sub15" @titleClick="titleClick">
|
||
<router-link to="/download">问答</router-link>
|
||
</a-menu-item>
|
||
<a-menu-item key="sub18" v-if="checkMenu('OldSystemManage')">
|
||
|
||
<router-link target="_blank" to="/oldsystemmanage">旧版</router-link>
|
||
|
||
</a-menu-item>
|
||
<a-menu-item key="sub19" v-if="checkMenu('ReadingClubManage')">
|
||
<router-link to="/readingclubmanage">业务</router-link>
|
||
</a-menu-item>
|
||
<a-menu-item key="sub20" v-if="checkMenu('dictmanage')">
|
||
<router-link to="/dictmanage">字典</router-link>
|
||
</a-menu-item>
|
||
|
||
</a-menu>
|
||
</div>
|
||
</div>
|
||
</template>
|
||
|
||
<script>
|
||
import {reactive, toRefs, onMounted, onUnmounted, watch} from "vue";
|
||
import {useRoute} from "vue-router";
|
||
import {useStore} from "vuex";
|
||
import {checkMenu} from "@/utils/utils";
|
||
|
||
export default {
|
||
name: "NavLeft",
|
||
setup() {
|
||
const store = useStore();
|
||
const state = reactive({
|
||
packup: false,
|
||
screenHeight: document.body.clientHeight, // 屏幕 高度
|
||
rootSubmenuKeys: [
|
||
"sub1",
|
||
"sub2",
|
||
"sub3",
|
||
"sub4",
|
||
"sub5",
|
||
"sub6",
|
||
"sub7",
|
||
"sub8",
|
||
"sub9",
|
||
"sub10",
|
||
"sub11",
|
||
"sub12",
|
||
"sub13",
|
||
"sub14",
|
||
"sub15",
|
||
"sub17",
|
||
"sub18",
|
||
"sub19",
|
||
"sub20",
|
||
"sub21",
|
||
"sub22"
|
||
],
|
||
openKeys: localStorage.getItem("openKeys")
|
||
? JSON.parse(localStorage.getItem("openKeys"))
|
||
: ["sub1"], //默认打开以及打开的一级导航
|
||
selectedKeys: localStorage.getItem("selectedKeys")
|
||
? JSON.parse(localStorage.getItem("selectedKeys"))
|
||
: ["sub1"], //默认选择以及选择的二级导航
|
||
openKeys2: localStorage.getItem("openKeys")
|
||
? JSON.parse(localStorage.getItem("openKeys"))
|
||
: ["sub1"], //默认打开以及打开的一级导航
|
||
selectedKeys2: localStorage.getItem("openKeys")
|
||
? JSON.parse(localStorage.getItem("openKeys"))
|
||
: ["sub1"], //默认选择以及选择的二级导航
|
||
|
||
keysList: [
|
||
{
|
||
href: "/coursereviewedn",
|
||
openKeys: "sub10",
|
||
selectedKeys: "sub10-1",
|
||
pagename: "待审核课程",
|
||
},
|
||
{
|
||
href: "/coursereviewed",
|
||
openKeys: "sub10",
|
||
selectedKeys: "sub10-2",
|
||
pagename: "已审核课程",
|
||
},
|
||
{
|
||
href: "/projectreviewedn",
|
||
openKeys: "sub10",
|
||
selectedKeys: "sub10-3",
|
||
pagename: "待审核项目",
|
||
},
|
||
{
|
||
href: "/projectrrviewed",
|
||
openKeys: "sub10",
|
||
selectedKeys: "sub10-4",
|
||
pagename: "已审核项目",
|
||
},
|
||
{
|
||
href: "/learningpath",
|
||
openKeys: "sub1",
|
||
selectedKeys: "sub1",
|
||
pagename: "学习路径图",
|
||
},
|
||
{
|
||
href: "/leveladd",
|
||
openKeys: "sub1",
|
||
selectedKeys: "sub1",
|
||
pagename: "管理",
|
||
},
|
||
{
|
||
href: "/levelcheck",
|
||
openKeys: "sub1",
|
||
selectedKeys: "sub1",
|
||
pagename: "查看",
|
||
},
|
||
{
|
||
href: "/leveladddetail",
|
||
openKeys: "sub1",
|
||
selectedKeys: "sub1",
|
||
pagename: "关卡",
|
||
},
|
||
{
|
||
href: "/projectmanage",
|
||
openKeys: "sub2",
|
||
selectedKeys: "sub2-1",
|
||
pagename: "项目",
|
||
},
|
||
{
|
||
href: "/projectadd",
|
||
openKeys: "sub2",
|
||
selectedKeys: "sub2-1",
|
||
pagename: "创建项目",
|
||
},
|
||
{
|
||
href: "/templatelibrary",
|
||
openKeys: "sub2",
|
||
selectedKeys: "sub2-2",
|
||
pagename: "模板库",
|
||
},
|
||
{
|
||
href: "/libraryadd",
|
||
openKeys: "sub2",
|
||
selectedKeys: "sub2-2",
|
||
pagename: "查看",
|
||
},
|
||
{
|
||
href: "/coursewaremanage",
|
||
openKeys: "sub3",
|
||
selectedKeys: "sub3-1",
|
||
pagename: "面授管理",
|
||
},
|
||
{
|
||
href: "/onlinemanage",
|
||
openKeys: "sub3",
|
||
selectedKeys: "sub3-2",
|
||
pagename: "在线管理",
|
||
},
|
||
{
|
||
href: "/coursemanage",
|
||
openKeys: "sub3",
|
||
selectedKeys: "sub3-3",
|
||
pagename: "课件管理",
|
||
},
|
||
{
|
||
href: "/courserecommended",
|
||
openKeys: "sub3",
|
||
selectedKeys: "sub3-4",
|
||
pagename: "课程推荐",
|
||
},
|
||
{
|
||
href: "/certificatecenter",
|
||
openKeys: "sub8",
|
||
selectedKeys: "sub8",
|
||
pagename: "证书中心",
|
||
},
|
||
|
||
{
|
||
href: "/systemmanage",
|
||
openKeys: "sub9",
|
||
selectedKeys: "sub9",
|
||
pagename: "系统管理",
|
||
},
|
||
{
|
||
href: "/researchmanage",
|
||
openKeys: "sub5",
|
||
selectedKeys: "sub5",
|
||
pagename: "评估管理",
|
||
},
|
||
|
||
{
|
||
href: "/questionmanage",
|
||
openKeys: "sub11",
|
||
selectedKeys: "sub11-1",
|
||
pagename: "试题管理",
|
||
},
|
||
{
|
||
href: "/papermanage",
|
||
openKeys: "sub11",
|
||
selectedKeys: "sub11-2",
|
||
pagename: "试卷管理",
|
||
},
|
||
{
|
||
href: "/examinationcenter",
|
||
openKeys: "sub11",
|
||
selectedKeys: "sub11-3",
|
||
pagename: "考试管理",
|
||
},
|
||
{
|
||
href: "/casemanage",
|
||
openKeys: "sub12",
|
||
selectedKeys: "sub12-1",
|
||
pagename: "案例管理",
|
||
},
|
||
{
|
||
href: "/caserecommended",
|
||
openKeys: "sub12",
|
||
selectedKeys: "sub12-2",
|
||
pagename: "案例推荐",
|
||
},
|
||
{
|
||
href: "/gratefulnotice",
|
||
openKeys: "sub22",
|
||
selectedKeys: "sub22-1",
|
||
pagename: "通知",
|
||
},
|
||
{
|
||
href: "/gratefulcarousel",
|
||
openKeys: "sub22",
|
||
selectedKeys: "sub22-2",
|
||
pagename: "轮播图",
|
||
},
|
||
{
|
||
href: "/teacherempowerment",
|
||
openKeys: "sub22",
|
||
selectedKeys: "sub22-3",
|
||
pagename: "教师赋能",
|
||
},
|
||
{
|
||
href: "/teachertopic",
|
||
openKeys: "sub22",
|
||
selectedKeys: "sub22-4",
|
||
pagename: "认证讲师库（2023）",
|
||
},
|
||
{
|
||
href: "/tooldown",
|
||
openKeys: "sub22",
|
||
selectedKeys: "sub22-5",
|
||
pagename: "工具下载",
|
||
},
|
||
{
|
||
href: "/teacheropinion",
|
||
openKeys: "sub22",
|
||
selectedKeys: "sub22-6",
|
||
pagename: "意见",
|
||
},
|
||
{
|
||
href: "/articlemanage",
|
||
openKeys: "sub13",
|
||
selectedKeys: "sub13",
|
||
pagename: "文章管理",
|
||
},
|
||
{
|
||
href: "/qamanage",
|
||
openKeys: "sub14",
|
||
selectedKeys: "sub14",
|
||
pagename: "问答管理",
|
||
},
|
||
{
|
||
href: "/download",
|
||
openKeys: "sub15",
|
||
selectedKeys: "sub15",
|
||
pagename: "下载中心",
|
||
},
|
||
{
|
||
href: "/operational",
|
||
openKeys: "sub17",
|
||
selectedKeys: "sub17-1",
|
||
pagename: "运营数据概览",
|
||
},
|
||
{
|
||
href: "/learningpathmap",
|
||
openKeys: "sub17",
|
||
openKeys2: "sub17-2",
|
||
selectedKeys: "sub17-2-1",
|
||
pagename: "学习路径图",
|
||
},
|
||
{
|
||
href: "/reportproject",
|
||
openKeys: "sub17",
|
||
openKeys2: "sub17-2",
|
||
selectedKeys: "sub17-2-2",
|
||
pagename: "项目",
|
||
},
|
||
{
|
||
href: "/curriculum",
|
||
openKeys: "sub17",
|
||
openKeys2: "sub17-2",
|
||
selectedKeys: "sub17-2-3",
|
||
pagename: "课程",
|
||
},
|
||
{
|
||
href: "/caseess",
|
||
openKeys: "sub17",
|
||
openKeys2: "sub17-2",
|
||
selectedKeys: "sub17-2-4",
|
||
pagename: "案例",
|
||
},
|
||
{
|
||
href: "/reportarticle",
|
||
openKeys: "sub17",
|
||
openKeys2: "sub17-2",
|
||
selectedKeys: "sub17-2-5",
|
||
pagename: "文章",
|
||
},
|
||
{
|
||
href: "/questionsandanswers",
|
||
openKeys: "sub17",
|
||
openKeys2: "sub17-2",
|
||
selectedKeys: "sub17-2-6",
|
||
pagename: "问答",
|
||
},
|
||
{
|
||
href: "/reportexamination",
|
||
openKeys: "sub17",
|
||
openKeys2: "sub17-2",
|
||
selectedKeys: "sub17-2-7",
|
||
pagename: "考试",
|
||
},
|
||
{
|
||
href: "/overvoew",
|
||
openKeys: "sub17",
|
||
openKeys2: "sub17-3",
|
||
selectedKeys: "sub17-3-1",
|
||
pagename: "概览",
|
||
},
|
||
{
|
||
href: "/employeelearning",
|
||
openKeys: "sub17",
|
||
openKeys2: "sub17-3",
|
||
selectedKeys: "sub17-3-2",
|
||
pagename: "员工学习数据",
|
||
},
|
||
{
|
||
href: "/oldsystemmanage",
|
||
openKeys: "sub18",
|
||
selectedKeys: "sub18",
|
||
pagename: "旧版管理员界面",
|
||
},
|
||
{
|
||
href: "/readingclubmanage",
|
||
openKeys: "sub19",
|
||
selectedKeys: "sub19",
|
||
pagename: "业务支援读书会管理",
|
||
},
|
||
{
|
||
href: "/dictmanage",
|
||
openKeys: "sub20",
|
||
selectedKeys: "sub20",
|
||
pagename: "字典管理",
|
||
},
|
||
{
|
||
href: "/audiencemanage",
|
||
openKeys: "sub21",
|
||
selectedKeys: "sub21",
|
||
pagename: "受众管理",
|
||
},
|
||
|
||
],
|
||
oldManage: window.location.protocol + process.env.VUE_APP_OLD_MANAGE
|
||
});
|
||
|
||
const onOpenChange = (openKeys) => {
|
||
const latestOpenKey = openKeys.find(
|
||
(key) => state.openKeys.indexOf(key) === -1
|
||
);
|
||
if (state.rootSubmenuKeys.indexOf(latestOpenKey) === -1) {
|
||
state.openKeys = openKeys;
|
||
console.log('111',openKeys)
|
||
} else {
|
||
state.openKeys = latestOpenKey ? [latestOpenKey] : [];
|
||
console.log('222222222222222')
|
||
}
|
||
};
|
||
const selectItem = (e) => {
|
||
let arr = state.keysList;
|
||
arr.map((value) => {
|
||
if (e.key === value.selectedKeys) {
|
||
localStorage.setItem("openKeys", JSON.stringify([value.openKeys]));
|
||
localStorage.setItem(
|
||
"selectedKeys",
|
||
JSON.stringify([value.selectedKeys])
|
||
);
|
||
// console.log('2222',[value.openKeys,value.openKeys2])
|
||
state.openKeys = [value.openKeys,value.openKeys2];
|
||
// state.openKeys=['sub17', 'sub17-2']
|
||
state.selectedKeys = [value.selectedKeys];
|
||
state.openKeys2 = [value.openKeys,value.openKeys2];
|
||
state.selectedKeys2 = [value.openKeys];
|
||
}
|
||
});
|
||
};
|
||
|
||
const route = useRoute();
|
||
watch(
|
||
() => route.fullPath,
|
||
(n) => {
|
||
console.log("监听路由", n, store.state.openpages, state.keysList);
|
||
// console.log("new:" + n.toLowerCase() + ",old:" + o);
|
||
let arr = state.keysList;
|
||
if(!arr.some(page => page.href === n)){
|
||
console.log('不存在',n)
|
||
return
|
||
}
|
||
arr.map((value) => {
|
||
if (n.toLowerCase() === value.href) {
|
||
localStorage.setItem("openKeys", JSON.stringify([value.openKeys]));
|
||
localStorage.setItem(
|
||
"selectedKeys",
|
||
JSON.stringify([value.selectedKeys])
|
||
);
|
||
state.openKeys = [value.openKeys,value.openKeys2];
|
||
state.selectedKeys = [value.selectedKeys];
|
||
state.openKeys2 = [value.openKeys,value.openKeys2];
|
||
state.selectedKeys2 = [value.openKeys];
|
||
}
|
||
});
|
||
let openpages = store.state.openpages;
|
||
if (openpages.length === 0) {
|
||
let pagename = state.keysList.filter((a) => {
|
||
return a.href === n.toLowerCase();
|
||
});
|
||
if (pagename && pagename.length !== 0) {
|
||
let obj = {
|
||
pagename: pagename[0].pagename,
|
||
href: n.toLowerCase(),
|
||
active: true,
|
||
};
|
||
openpages.push(obj);
|
||
}
|
||
} else {
|
||
for (let i = 0; i < openpages.length; i++) {
|
||
openpages[i].active = false;
|
||
}
|
||
for (let i = 0; i < openpages.length; i++) {
|
||
openpages[i].active = false;
|
||
if (n.toLowerCase() === openpages[i].href) {
|
||
console.log("已存在", openpages[i]);
|
||
openpages[i].active = true;
|
||
break;
|
||
} else {
|
||
if (i === openpages.length - 1) {
|
||
let pagename = state.keysList.filter((a) => {
|
||
return a.href === n.toLowerCase();
|
||
});
|
||
if (pagename && pagename.length !== 0) {
|
||
let obj = {
|
||
pagename: pagename[0].pagename,
|
||
href: n.toLowerCase(),
|
||
active: true,
|
||
};
|
||
openpages.push(obj);
|
||
}
|
||
}
|
||
}
|
||
}
|
||
}
|
||
|
||
localStorage.setItem("openpages", JSON.stringify(openpages));
|
||
store.commit("chengeOpenpages", openpages);
|
||
|
||
// store.getters.chengeOpenpages(openpages)
|
||
}
|
||
);
|
||
const packUp = () => {
|
||
state.packup = !state.packup;
|
||
};
|
||
const getClientHeight = () => {
|
||
state.screenHeight = document.body.clientHeight;
|
||
};
|
||
|
||
onMounted(() => {
|
||
// console.log("11111", 1);
|
||
window.addEventListener("resize", getClientHeight, false);
|
||
// judgeUrl();
|
||
});
|
||
onUnmounted(() => {
|
||
window.removeEventListener("resize", getClientHeight, false);
|
||
});
|
||
return {
|
||
...toRefs(state),
|
||
checkMenu,
|
||
onOpenChange,
|
||
selectItem,
|
||
packUp,
|
||
};
|
||
},
|
||
};
|
||
</script>
|
||
<style lang="scss">
|
||
.navLeft {
|
||
width: 208px;
|
||
height: 100%;
|
||
overflow-y: auto;
|
||
overflow-x: hidden;
|
||
background: linear-gradient(0deg, #a9e9f7 0%, #388be1 73%);
|
||
box-shadow: 0px 1px 35px 0px rgba(118, 136, 166, 0.21);
|
||
// margin-top: -50px;
|
||
flex-shrink: 0;
|
||
.treeMenu {
|
||
padding-left: 17px;
|
||
.ant-menu-item-icon {
|
||
width: 10px !important;
|
||
height: 10px;
|
||
min-width: 10px;
|
||
border-radius: 50%;
|
||
margin-right: 10px;
|
||
// background: white;
|
||
border: 2px solid white;
|
||
}
|
||
.ant-menu-title-content {
|
||
box-sizing: border-box;
|
||
// padding-left: 40px !important;
|
||
overflow: hidden;
|
||
text-overflow: ellipsis;
|
||
}
|
||
}
|
||
.packup {
|
||
width: 19px;
|
||
height: 15px;
|
||
margin-top: 23px;
|
||
margin-right: 14px;
|
||
cursor: pointer;
|
||
}
|
||
|
||
//修改导航栏背景颜色
|
||
.ant-menu {
|
||
background-color: rgba(56, 139, 225, 0);
|
||
border: none;
|
||
box-shadow: none;
|
||
}
|
||
|
||
//图标和字放在一行
|
||
.ant-menu-title-content {
|
||
display: flex;
|
||
align-items: center;
|
||
}
|
||
|
||
.packupMenu .ant-menu-title-content {
|
||
display: flex;
|
||
align-items: center;
|
||
justify-content: center;
|
||
}
|
||
|
||
//修改导航文字颜色
|
||
.ant-menu-title-content {
|
||
padding: 0px !important;
|
||
// padding-left: 27px !important;
|
||
font-size: 14px;
|
||
font-weight: 400;
|
||
color: #ffffff;
|
||
line-height: 36px;
|
||
border-right: 3px solid rgba(255, 255, 255, 0);
|
||
margin-left: 0 !important;
|
||
}
|
||
|
||
.ant-menu-item a,
|
||
.ant-menu-item a:hover {
|
||
font-size: 14px;
|
||
font-weight: 400;
|
||
color: #ffffff;
|
||
line-height: 36px;
|
||
}
|
||
|
||
//修改二级导航背景色
|
||
.ant-menu-sub.ant-menu-inline {
|
||
background-color: rgba(56, 139, 225, 0);
|
||
border: none;
|
||
box-shadow: none;
|
||
}
|
||
|
||
//修改左侧padding
|
||
.ant-menu-item,
|
||
.ant-menu-submenu-title {
|
||
padding-left: 14px !important;
|
||
height: 49px !important;
|
||
line-height: 49px !important;
|
||
margin: 0px !important;
|
||
}
|
||
|
||
//左侧图标
|
||
.imgBox {
|
||
width: 20px;
|
||
height: 20px;
|
||
display: flex;
|
||
align-items: center;
|
||
justify-content: center;
|
||
margin-right: 10px;
|
||
}
|
||
|
||
.ant-menu-submenu-arrow {
|
||
color: rgba(255, 255, 255, 1) !important;
|
||
right: 14px !important;
|
||
}
|
||
|
||
// .ant-menu-submenu-active .ant-menu-submenu-arrow {
|
||
// right: 11px !important;
|
||
// }
|
||
//划上背景
|
||
.ant-menu-item-active {
|
||
background: rgba(236, 245, 255, 0.43) !important;
|
||
border-right: 3px solid rgba(255, 255, 255, 1);
|
||
}
|
||
|
||
//选中背景
|
||
.ant-menu-item-selected {
|
||
background: rgba(236, 245, 255, 0.43) !important;
|
||
border-right: 3px solid rgba(255, 255, 255, 1);
|
||
}
|
||
|
||
.ant-menu-vertical .ant-menu-item::after,
|
||
.ant-menu-vertical-left .ant-menu-item::after,
|
||
.ant-menu-vertical-right .ant-menu-item::after,
|
||
.ant-menu-inline .ant-menu-item::after {
|
||
border-right: 0px;
|
||
}
|
||
|
||
.circle {
|
||
width: 10px;
|
||
height: 10px;
|
||
border-radius: 5px;
|
||
border: 2px solid rgba(255, 255, 255, 1);
|
||
margin-left: 18px;
|
||
margin-right: 10px;
|
||
display: inline-block;
|
||
}
|
||
|
||
.circleActive {
|
||
width: 10px;
|
||
height: 10px;
|
||
border-radius: 5px;
|
||
background-color: rgba(255, 255, 255, 1);
|
||
margin-left: 18px;
|
||
margin-right: 10px;
|
||
display: inline-block;
|
||
}
|
||
}
|
||
</style>
|