|
|
@@ -1,8 +1,8 @@
|
|
|
<template>
|
|
|
- <div class="filter-bar">
|
|
|
+ <div class="filter-bar" style="background: white; padding-top: 30px;padding-left: 40px;padding-bottom: 30px;padding-right: 40px">
|
|
|
<!-- 所选院系 -->
|
|
|
- <div class="filter-group" style="width: 100%">
|
|
|
- <span class="filter-group-title">所属单位:</span>
|
|
|
+ <div class="filter-group">
|
|
|
+ <span class="filter-group-title">所选单位:</span>
|
|
|
<!-- <a-radio-group v-model:value="selectedDept" >
|
|
|
<a-radio-button v-for="dept in selectedDepts" :key="dept" :value="dept">{{ dept }}</a-radio-button>
|
|
|
</a-radio-group> -->
|
|
|
@@ -22,38 +22,36 @@
|
|
|
:index="index"
|
|
|
></MyRadioButtonOffOut>
|
|
|
</MyRadioButtonGroup>
|
|
|
- <div style="height: 10px"></div>
|
|
|
- <div style="border: 1px solid #f4f5f9" v-show="selectedDeptBigs.length > 0">
|
|
|
- <MyRadioButtonGroup
|
|
|
- ref="Big"
|
|
|
- v-show="selectedDeptBigs.length > 0"
|
|
|
- v-model="selectedDeptBig"
|
|
|
- @change="handleSelectedCourses"
|
|
|
- >
|
|
|
- <MyRadioButton
|
|
|
- v-for="(item, index) in selectedDeptBigs"
|
|
|
- :key="index"
|
|
|
- :value="index"
|
|
|
- :label="item.name"
|
|
|
- :index="index"
|
|
|
- ></MyRadioButton>
|
|
|
- </MyRadioButtonGroup>
|
|
|
- <div style="height: 10px"></div>
|
|
|
- <MyRadioButtonGroup
|
|
|
- ref="Smail"
|
|
|
- v-show="selectedDeptSmails.length > 0"
|
|
|
- v-model="selectedDeptSmail"
|
|
|
- @change="handleSelectedSmails"
|
|
|
- >
|
|
|
- <MyRadioButton
|
|
|
- v-for="(item, index) in selectedDeptSmails"
|
|
|
- :key="index"
|
|
|
- :value="index"
|
|
|
- :label="item.name"
|
|
|
- :index="index"
|
|
|
- ></MyRadioButton>
|
|
|
- </MyRadioButtonGroup>
|
|
|
- </div>
|
|
|
+ <div style="height: 5px"></div>
|
|
|
+ <MyRadioButtonGroup
|
|
|
+ ref="Big"
|
|
|
+ v-show="selectedDeptBigs.length > 0"
|
|
|
+ v-model="selectedDeptBig"
|
|
|
+ @change="handleSelectedCourses"
|
|
|
+ >
|
|
|
+ <MyRadioButton
|
|
|
+ v-for="(item, index) in selectedDeptBigs"
|
|
|
+ :key="index"
|
|
|
+ :value="index"
|
|
|
+ :label="item.name"
|
|
|
+ :index="index"
|
|
|
+ ></MyRadioButton>
|
|
|
+ </MyRadioButtonGroup>
|
|
|
+ <div style="height: 5px"></div>
|
|
|
+ <MyRadioButtonGroup
|
|
|
+ ref="Smail"
|
|
|
+ v-show="selectedDeptSmails.length > 0"
|
|
|
+ v-model="selectedDeptSmail"
|
|
|
+ @change="handleSelectedSmails"
|
|
|
+ >
|
|
|
+ <MyRadioButton
|
|
|
+ v-for="(item, index) in selectedDeptSmails"
|
|
|
+ :key="index"
|
|
|
+ :value="index"
|
|
|
+ :label="item.name"
|
|
|
+ :index="index"
|
|
|
+ ></MyRadioButton>
|
|
|
+ </MyRadioButtonGroup>
|
|
|
</div>
|
|
|
</a-spin>
|
|
|
</div>
|
|
|
@@ -98,7 +96,6 @@
|
|
|
:index="index"
|
|
|
></MyRadioButton>
|
|
|
</MyRadioButtonGroup>
|
|
|
- <div style="border: 1px solid #f4f5f9" v-show="selectedTypes.length > 0">
|
|
|
<MyRadioButtonGroup
|
|
|
ref="Type"
|
|
|
v-show="selectedTypes.length > 0"
|
|
|
@@ -113,7 +110,20 @@
|
|
|
:index="index"
|
|
|
></MyRadioButton>
|
|
|
</MyRadioButtonGroup>
|
|
|
- </div>
|
|
|
+ <MyRadioButtonGroup
|
|
|
+ ref="TypeSmail"
|
|
|
+ v-show="selectedTypesSmail.length > 0"
|
|
|
+ v-model="selectedTypeSmail"
|
|
|
+ @change="handleTypeChangeSmail"
|
|
|
+ >
|
|
|
+ <MyRadioButton
|
|
|
+ v-for="(item, index) in selectedTypesSmail"
|
|
|
+ :key="index"
|
|
|
+ :value="index"
|
|
|
+ :label="item.name"
|
|
|
+ :index="index"
|
|
|
+ ></MyRadioButton>
|
|
|
+ </MyRadioButtonGroup>
|
|
|
</div>
|
|
|
</a-spin>
|
|
|
</div>
|
|
|
@@ -146,8 +156,9 @@
|
|
|
<div style="display: flex; align-items: center; margin-top: 7px">
|
|
|
<a-tag
|
|
|
v-for="(tag, index) in selectedTagKeys"
|
|
|
- class="tagItem"
|
|
|
+ style="display: flex; justify-content: center; align-items: center"
|
|
|
:key="index"
|
|
|
+ :bordered="false"
|
|
|
closable
|
|
|
@close="handleTagClose(tag, index)"
|
|
|
>
|
|
|
@@ -186,6 +197,7 @@
|
|
|
const selectedCourse = ref('')
|
|
|
const selectedTypeBig = ref('')
|
|
|
const selectedType = ref('')
|
|
|
+ const selectedTypeSmail = ref('')
|
|
|
const selectedFormat = ref('')
|
|
|
const Dept = ref(null)
|
|
|
const Big = ref(null)
|
|
|
@@ -193,6 +205,7 @@
|
|
|
const Course = ref(null)
|
|
|
const TypeBig = ref(null)
|
|
|
const Type = ref(null)
|
|
|
+ const TypeSmail = ref(null)
|
|
|
const Format = ref(null)
|
|
|
|
|
|
const selectedTags = ref([])
|
|
|
@@ -231,6 +244,7 @@
|
|
|
const selectedTypesBig = ref([])
|
|
|
const spinningSelectedTypesBig = ref(false)
|
|
|
const selectedTypes = ref([])
|
|
|
+ const selectedTypesSmail = ref([])
|
|
|
const selectedFormats = ref([])
|
|
|
const spinningSelectedFormats = ref(false)
|
|
|
|
|
|
@@ -242,6 +256,7 @@
|
|
|
} else {
|
|
|
selectedDeptBigs.value = selectedDeptBigsList.value[e]
|
|
|
}
|
|
|
+ console.log('handleSelectedDept', e,selectedDeptBigsList.value)
|
|
|
selectedDeptSmails.value = []
|
|
|
if (selectedDeptBigs.value.length > 0) {
|
|
|
Big.value.setClean(-1)
|
|
|
@@ -256,6 +271,7 @@
|
|
|
} else {
|
|
|
selectedDeptSmails.value = selectedDeptSmailsList.value[e - 1]
|
|
|
}
|
|
|
+ console.log('handleSelectedCourses', e, selectedDeptSmails.value)
|
|
|
if (selectedDeptSmails.value.length > 0) {
|
|
|
Smail.value.setClean(-1)
|
|
|
}
|
|
|
@@ -264,31 +280,54 @@
|
|
|
updateSelectedTags()
|
|
|
}
|
|
|
const handleSelectedSmails = (e) => {
|
|
|
- // if (e == 0) {
|
|
|
- // selectedDeptSmails.value = []
|
|
|
- // } else {
|
|
|
- // selectedDeptSmails.value = selectedDeptSmailsList.value[e]
|
|
|
- // }
|
|
|
+ if (e == 0) {
|
|
|
+ selectedDeptSmails.value = []
|
|
|
+ } else {
|
|
|
+ selectedDeptSmails.value = selectedDeptSmailsList.value[e]
|
|
|
+ }
|
|
|
// selectedDeptSmails.value = selectedDeptSmailsList.value[e]
|
|
|
updateSelectedTags()
|
|
|
}
|
|
|
// 处理课程类型选择变化
|
|
|
const handleTypeChangeBig = (e) => {
|
|
|
+ selectedTypesSmail.value = []
|
|
|
if (e == 0) {
|
|
|
selectedTypes.value = []
|
|
|
+
|
|
|
} else {
|
|
|
selectedTypes.value = selectedTypesBigList.value[e]
|
|
|
}
|
|
|
+
|
|
|
+ console.log('handleTypeChangeBig', e,selectedTypesBigList.value)
|
|
|
if (selectedTypes.value.length > 0) {
|
|
|
Type.value.setClean(-1)
|
|
|
}
|
|
|
+ if (selectedTypeSmail.value.length > 0) {
|
|
|
+ TypeSmail.value.setClean(-1)
|
|
|
+ }
|
|
|
selectedType.value = -1
|
|
|
- // selectedDeptSmails.value = selectedDeptSmailsList.value[e]
|
|
|
- // updateSelectedTags()
|
|
|
- // selectedFormat.value = undefined // 选择课程类型时,重置课件格式
|
|
|
+ selectedTypeSmail.value = -1
|
|
|
updateSelectedTags()
|
|
|
}
|
|
|
const handleTypeChange = (e) => {
|
|
|
+ console.log('handleTypeChange', ' e ', e, selectedTypes.value)
|
|
|
+ if (e == 0) {
|
|
|
+ selectedTypesSmail.value = []
|
|
|
+ } else {
|
|
|
+ selectedTypesSmail.value = selectedTypesList.value[e - 1]
|
|
|
+ }
|
|
|
+
|
|
|
+ // selectedFormat.value = undefined // 选择课程类型时,重置课件格式
|
|
|
+ // updateSelectedTags()
|
|
|
+ updateSelectedTags()
|
|
|
+ }
|
|
|
+ const handleTypeChangeSmail = (e) => {
|
|
|
+ console.log('handleTypeChange', ' e ', e, selectedTypes.value)
|
|
|
+ // if (e == 0) {
|
|
|
+ // selectedTypesSmail.value = []
|
|
|
+ // } else {
|
|
|
+ // selectedTypesSmail.value = selectedTypesList.value[e - 1]
|
|
|
+ // }
|
|
|
// selectedFormat.value = undefined // 选择课程类型时,重置课件格式
|
|
|
// updateSelectedTags()
|
|
|
updateSelectedTags()
|
|
|
@@ -311,6 +350,9 @@
|
|
|
// ...(selectedType.value !== '全部' ? { key: 'Type', list: [selectedType.value] } : []),
|
|
|
// ...(selectedFormat.value !== '全部' ? { key: 'Format', list: [selectedFormat.value] } : [])
|
|
|
// ]
|
|
|
+ console.log('筛选条件第一个', selectedDept.value, selectedDepts.value)
|
|
|
+ console.log('筛选条件第二个', selectedDeptBig.value, selectedDeptBigs.value)
|
|
|
+ console.log('筛选条件第三个', selectedDeptSmail.value, selectedDeptSmails.value)
|
|
|
if (
|
|
|
selectedDept.value !== undefined &&
|
|
|
selectedDept.value !== '' &&
|
|
|
@@ -347,6 +389,7 @@
|
|
|
queryData['collegeTwoId'] = selectedDeptBigs.value[selectedDeptBig.value].id
|
|
|
}
|
|
|
}
|
|
|
+ console.log('selectedDeptSmail', selectedDeptSmail.value, selectedDeptSmails.value)
|
|
|
if (
|
|
|
selectedDeptSmail.value !== undefined &&
|
|
|
selectedDeptSmail.value !== '' &&
|
|
|
@@ -402,6 +445,25 @@
|
|
|
queryData['resourceTwoType'] = selectedTypes.value[selectedType.value].id
|
|
|
}
|
|
|
}
|
|
|
+ if (
|
|
|
+ selectedTypeSmail.value !== undefined &&
|
|
|
+ selectedTypeSmail.value !== '' &&
|
|
|
+ selectedTypeSmail.value > 0 &&
|
|
|
+ selectedTypesSmail.value.length > 0
|
|
|
+ ) {
|
|
|
+ if (selectedTypesSmail.value[selectedTypeSmail.value]) {
|
|
|
+ selectedTags.value.push(...[selectedTypesSmail.value[selectedTypeSmail.value].name])
|
|
|
+ selectedTagKeys.value.push({
|
|
|
+ listType: 6,
|
|
|
+ key: 'resourceThreeType',
|
|
|
+ index: selectedTypeSmail.value,
|
|
|
+ name: selectedTypesSmail.value[selectedTypeSmail.value].name,
|
|
|
+ id: selectedTypesSmail.value[selectedTypeSmail.value].id
|
|
|
+ })
|
|
|
+ queryData['resourceThreeType'] = selectedTypesSmail.value[selectedTypeSmail.value].id
|
|
|
+ }
|
|
|
+ console.log('123123',selectedTagKeys.value)
|
|
|
+ }
|
|
|
if (
|
|
|
selectedFormat.value !== undefined &&
|
|
|
selectedFormat.value !== '' &&
|
|
|
@@ -433,6 +495,7 @@
|
|
|
// selectedTags.value.push(...[selectedFormat.value])
|
|
|
// selectedTagKeys.value.push('Format')
|
|
|
// }
|
|
|
+ console.log('筛选条件', selectedTags.value, selectedTagKeys.value)
|
|
|
|
|
|
EventBus.emit('upLoadList', queryData)
|
|
|
}
|
|
|
@@ -479,7 +542,15 @@
|
|
|
selectedDeptBig.value = -1
|
|
|
Dept.value.setClean(-1)
|
|
|
selectedDept.value = -1
|
|
|
+ TypeSmail.value.setClean(-1)
|
|
|
+ selectedTypeSmail.value = -1
|
|
|
+ }
|
|
|
+ if (tag.key == 'selectedTypeSmail') {
|
|
|
+
|
|
|
+ TypeSmail.value.setClean(-1)
|
|
|
+ selectedTypeSmail.value = -1
|
|
|
}
|
|
|
+ console.log('要删除的东西', tag)
|
|
|
|
|
|
updateSelectedTags()
|
|
|
}
|
|
|
@@ -516,6 +587,7 @@
|
|
|
selectedDeptBig.value = -1
|
|
|
Dept.value.setClean(-1)
|
|
|
selectedDept.value = -1
|
|
|
+ // console.log('要删除的东西', tag)
|
|
|
|
|
|
updateSelectedTags()
|
|
|
}
|
|
|
@@ -534,7 +606,7 @@
|
|
|
// Format.value.setClean('全部')
|
|
|
spinningSelectedDepts.value = true
|
|
|
collegeApi.treeAll().then((data) => {
|
|
|
- selectedDepts.value = data
|
|
|
+ selectedDepts.value = data.data
|
|
|
selectedDepts.value.forEach((item) => {
|
|
|
selectedDeptBigsList.value.push(item.children)
|
|
|
if (item.children) {
|
|
|
@@ -546,6 +618,7 @@
|
|
|
}
|
|
|
})
|
|
|
spinningSelectedDepts.value = false
|
|
|
+ console.log('看看最小的', selectedDeptSmailsList.value)
|
|
|
// Dept.value.setClean(0)
|
|
|
// handleSelectedDept(0)
|
|
|
// handleSelectedCourses(0)
|
|
|
@@ -565,6 +638,7 @@
|
|
|
})
|
|
|
spinningSelectedTypesBig.value = false
|
|
|
})
|
|
|
+ console.log('有数据吗',selectedTypesList.value)
|
|
|
spinningSelectedFormats.value = true
|
|
|
getAllListFileFormat().then((data) => {
|
|
|
selectedFormats.value = data.data
|
|
|
@@ -574,6 +648,7 @@
|
|
|
// selectedDepts.value.unshift({ name: '全部' })
|
|
|
// selectedDeptBigsList.value.unshift({ name: '全部' })
|
|
|
// selectedDeptSmailsList.value.unshift({ name: '全部' })
|
|
|
+ // console.log('看看呢', selectedDepts.value)
|
|
|
// updateSelectedTags()
|
|
|
}
|
|
|
|
|
|
@@ -585,9 +660,11 @@
|
|
|
|
|
|
<style scoped>
|
|
|
.filter-bar {
|
|
|
+ border: 1px solid #00000011; /* 灰色细边框 */
|
|
|
padding-left: 20px;
|
|
|
padding-right: 20px;
|
|
|
padding-top: 5px;
|
|
|
+ padding-bottom: 20px;
|
|
|
}
|
|
|
|
|
|
.filter-group {
|
|
|
@@ -595,27 +672,18 @@
|
|
|
}
|
|
|
.filter-group-title {
|
|
|
color: rgba(0, 0, 0, 0.521);
|
|
|
+ font-size: 14px;
|
|
|
min-width: 80px;
|
|
|
- margin-top: 6px;
|
|
|
+ margin-top: 5px;
|
|
|
}
|
|
|
|
|
|
.line {
|
|
|
width: 100%;
|
|
|
height: 0.25px;
|
|
|
- background-color: #ebebeb;
|
|
|
+ background-color: #00000013;
|
|
|
}
|
|
|
.clean {
|
|
|
- color: #1890ff;
|
|
|
+ color: rgb(133, 183, 224);
|
|
|
cursor: pointer;
|
|
|
}
|
|
|
- .tagItem {
|
|
|
- display: flex;
|
|
|
- justify-content: center;
|
|
|
- align-items: center;
|
|
|
- font-size: 14px;
|
|
|
- height: 32px;
|
|
|
- line-height: 32px;
|
|
|
- border:none;
|
|
|
- background-color: rgba(0, 0, 0, 0.04);
|
|
|
- }
|
|
|
</style>
|