|
|
@@ -24,7 +24,7 @@
|
|
|
</div>
|
|
|
<Breadcrumb />
|
|
|
<div class="padding12 bg_color_fff border_radius_16 box_shadow_card">
|
|
|
- <div class="typeList flex-between typeborder">
|
|
|
+ <div class="typeList flex-between typeborder" :class="{isShow:isShowStudyStage}">
|
|
|
<div class="gray font_size14 typeName">{{$t('common.studyStage')}}:</div>
|
|
|
<div class="flex_1 gap10">
|
|
|
<div class="font_size14 typeItem" :class="{'active':searchFom.studyStage === ''}"
|
|
|
@@ -39,8 +39,16 @@
|
|
|
{{item.dictLabel}}
|
|
|
</div>
|
|
|
</div>
|
|
|
+ <div>
|
|
|
+ <el-link type="primary" v-if="!isShowStudyStage" @click="isShowStudyStage = true;">
|
|
|
+ {{$t('common.expand')}}<el-icon><ArrowDown /></el-icon>
|
|
|
+ </el-link>
|
|
|
+ <el-link type="primary" v-else @click="isShowStudyStage = false;">
|
|
|
+ {{$t('common.collapse')}}<el-icon><ArrowDown /></el-icon>
|
|
|
+ </el-link>
|
|
|
+ </div>
|
|
|
</div>
|
|
|
- <div class="typeList flex-between typeborder">
|
|
|
+ <div class="typeList flex-between typeborder" :class="{isShow:isShowCourseCategory}">
|
|
|
<div class="gray font_size14 typeName">{{$t('common.courseCategory')}}:</div>
|
|
|
<div class="flex_1 gap10">
|
|
|
<div class="font_size14 typeItem" :class="{'active':searchFom.courseCategory === ''}"
|
|
|
@@ -55,8 +63,16 @@
|
|
|
{{item.dictLabel}}
|
|
|
</div>
|
|
|
</div>
|
|
|
+ <div>
|
|
|
+ <el-link type="primary" v-if="!isShowCourseCategory" @click="isShowCourseCategory = true;">
|
|
|
+ {{$t('common.expand')}}<el-icon><ArrowDown /></el-icon>
|
|
|
+ </el-link>
|
|
|
+ <el-link type="primary" v-else @click="isShowCourseCategory = false;">
|
|
|
+ {{$t('common.collapse')}}<el-icon><ArrowDown /></el-icon>
|
|
|
+ </el-link>
|
|
|
+ </div>
|
|
|
</div>
|
|
|
- <div class="typeList flex-between">
|
|
|
+ <div class="typeList flex-between" :class="{isShow:isShowSkillTag}">
|
|
|
<div class="gray font_size14 typeName">{{$t('common.skillTag')}}:</div>
|
|
|
<div class="flex_1 gap10">
|
|
|
<div class="font_size14 typeItem" :class="{'active':searchFom.skillTag === ''}"
|
|
|
@@ -71,6 +87,14 @@
|
|
|
{{item.dictLabel}}
|
|
|
</div>
|
|
|
</div>
|
|
|
+ <div>
|
|
|
+ <el-link type="primary" v-if="!isShowSkillTag" @click="isShowSkillTag = true;">
|
|
|
+ {{$t('common.expand')}}<el-icon><ArrowDown /></el-icon>
|
|
|
+ </el-link>
|
|
|
+ <el-link type="primary" v-else @click="isShowSkillTag = false;">
|
|
|
+ {{$t('common.collapse')}}<el-icon><ArrowDown /></el-icon>
|
|
|
+ </el-link>
|
|
|
+ </div>
|
|
|
</div>
|
|
|
</div>
|
|
|
<!-- 列表 -->
|
|
|
@@ -157,6 +181,13 @@
|
|
|
|
|
|
const openLoginDialog = inject('openLoginDialog')
|
|
|
|
|
|
+ // 学习阶段
|
|
|
+ const isShowStudyStage = ref(false);
|
|
|
+ // 课程分类
|
|
|
+ const isShowCourseCategory = ref(false);
|
|
|
+ // 技能标签
|
|
|
+ const isShowSkillTag = ref(false);
|
|
|
+
|
|
|
|
|
|
|
|
|
// 一级分类列表
|
|
|
@@ -243,6 +274,11 @@
|
|
|
.LearningSystem {
|
|
|
.typeList{
|
|
|
padding: 20px 0;
|
|
|
+ height: 71.75px;
|
|
|
+ overflow: hidden;
|
|
|
+ &.isShow{
|
|
|
+ height: auto;
|
|
|
+ }
|
|
|
&.typeborder{
|
|
|
border-bottom: 1px dashed #DCDFE6;
|
|
|
}
|