feat(course): 岗位选择器添加全选按钮
- 在选择岗位弹窗中添加全选/取消全选功能 - 支持对当前筛选结果进行全选操作 Co-authored-by: Cursor <cursoragent@cursor.com>
This commit is contained in:
@@ -552,6 +552,13 @@
|
|||||||
<el-icon><Search /></el-icon>
|
<el-icon><Search /></el-icon>
|
||||||
</template>
|
</template>
|
||||||
</el-input>
|
</el-input>
|
||||||
|
<el-button
|
||||||
|
type="primary"
|
||||||
|
:plain="!isAllSelected"
|
||||||
|
@click="toggleSelectAll"
|
||||||
|
>
|
||||||
|
{{ isAllSelected ? '取消全选' : '全选' }}
|
||||||
|
</el-button>
|
||||||
</div>
|
</div>
|
||||||
|
|
||||||
<div class="available-positions">
|
<div class="available-positions">
|
||||||
@@ -719,6 +726,30 @@ const filteredAvailablePositions = computed(() => {
|
|||||||
return filtered
|
return filtered
|
||||||
})
|
})
|
||||||
|
|
||||||
|
// 是否全选
|
||||||
|
const isAllSelected = computed(() => {
|
||||||
|
if (filteredAvailablePositions.value.length === 0) return false
|
||||||
|
return filteredAvailablePositions.value.every(
|
||||||
|
(p: any) => selectedPositions.value.includes(p.id)
|
||||||
|
)
|
||||||
|
})
|
||||||
|
|
||||||
|
// 全选/取消全选
|
||||||
|
const toggleSelectAll = () => {
|
||||||
|
if (isAllSelected.value) {
|
||||||
|
// 取消全选:移除当前筛选结果中的所有岗位
|
||||||
|
const filteredIds = filteredAvailablePositions.value.map((p: any) => p.id)
|
||||||
|
selectedPositions.value = selectedPositions.value.filter(
|
||||||
|
id => !filteredIds.includes(id)
|
||||||
|
)
|
||||||
|
} else {
|
||||||
|
// 全选:添加当前筛选结果中的所有岗位
|
||||||
|
const filteredIds = filteredAvailablePositions.value.map((p: any) => p.id)
|
||||||
|
const newSelection = new Set([...selectedPositions.value, ...filteredIds])
|
||||||
|
selectedPositions.value = Array.from(newSelection)
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
// 考试设置相关
|
// 考试设置相关
|
||||||
const examSettingsLoading = ref(false)
|
const examSettingsLoading = ref(false)
|
||||||
const examSettings = reactive({
|
const examSettings = reactive({
|
||||||
@@ -2920,6 +2951,9 @@ const loadAvailablePositions = async () => {
|
|||||||
// 岗位选择器样式
|
// 岗位选择器样式
|
||||||
.position-selector-content {
|
.position-selector-content {
|
||||||
.selector-header {
|
.selector-header {
|
||||||
|
display: flex;
|
||||||
|
align-items: center;
|
||||||
|
gap: 12px;
|
||||||
margin-bottom: 20px;
|
margin-bottom: 20px;
|
||||||
}
|
}
|
||||||
|
|
||||||
|
|||||||
Reference in New Issue
Block a user