feat: 新增年级/班级时已添加的选项禁用显示
- 新增年级弹窗:已挂载的年级显示为灰色不可选(已添加) - 新增班级弹窗:已挂载的班级显示为灰色不可选(已添加) - 从树形数据中获取已有年级/班级的ID列表传递给弹窗
This commit is contained in:
parent
20d9fd24d1
commit
40fe55b42a
|
|
@ -16,8 +16,8 @@
|
||||||
<el-checkbox-group v-model="form.classIds">
|
<el-checkbox-group v-model="form.classIds">
|
||||||
<el-row :gutter="10">
|
<el-row :gutter="10">
|
||||||
<el-col :span="8" v-for="item in classOptions" :key="item.value">
|
<el-col :span="8" v-for="item in classOptions" :key="item.value">
|
||||||
<el-checkbox :label="item.value" style="margin-bottom: 8px;">
|
<el-checkbox :label="item.value" :disabled="item.disabled" style="margin-bottom: 8px;">
|
||||||
{{ item.label }}
|
{{ item.label }}{{ item.disabled ? '(已添加)' : '' }}
|
||||||
</el-checkbox>
|
</el-checkbox>
|
||||||
</el-col>
|
</el-col>
|
||||||
</el-row>
|
</el-row>
|
||||||
|
|
@ -56,6 +56,9 @@ const form = ref({
|
||||||
classIds: []
|
classIds: []
|
||||||
})
|
})
|
||||||
|
|
||||||
|
// 已有班级ID列表
|
||||||
|
const existingClassIds = ref([])
|
||||||
|
|
||||||
// 获取班级选项
|
// 获取班级选项
|
||||||
const fetchClassOptions = async () => {
|
const fetchClassOptions = async () => {
|
||||||
try {
|
try {
|
||||||
|
|
@ -65,7 +68,7 @@ const fetchClassOptions = async () => {
|
||||||
classOptions.value = (res.data || []).map(item => ({
|
classOptions.value = (res.data || []).map(item => ({
|
||||||
value: item.classId,
|
value: item.classId,
|
||||||
label: item.className,
|
label: item.className,
|
||||||
disabled: false
|
disabled: existingClassIds.value.includes(item.classId)
|
||||||
}))
|
}))
|
||||||
}
|
}
|
||||||
} catch (error) {
|
} catch (error) {
|
||||||
|
|
@ -74,15 +77,19 @@ const fetchClassOptions = async () => {
|
||||||
}
|
}
|
||||||
|
|
||||||
// 打开弹窗
|
// 打开弹窗
|
||||||
// schoolData: { schoolId, schoolName, schoolGradeId, gradeName }
|
// schoolData: { schoolId, schoolName, schoolGradeId, gradeName, existingClassIds }
|
||||||
const open = (schoolData) => {
|
const open = (schoolData) => {
|
||||||
dialogVisible.value = true
|
dialogVisible.value = true
|
||||||
currentSchool.value = schoolData
|
currentSchool.value = schoolData
|
||||||
|
// 保存已有班级ID列表
|
||||||
|
existingClassIds.value = schoolData.existingClassIds || []
|
||||||
form.value = {
|
form.value = {
|
||||||
schoolId: schoolData.schoolId,
|
schoolId: schoolData.schoolId,
|
||||||
schoolGradeId: schoolData.schoolGradeId,
|
schoolGradeId: schoolData.schoolGradeId,
|
||||||
classIds: []
|
classIds: []
|
||||||
}
|
}
|
||||||
|
// 重新获取班级选项(更新禁用状态)
|
||||||
|
fetchClassOptions()
|
||||||
}
|
}
|
||||||
|
|
||||||
// 提交表单
|
// 提交表单
|
||||||
|
|
|
||||||
|
|
@ -16,8 +16,8 @@
|
||||||
<el-checkbox-group v-model="form.gradeIds">
|
<el-checkbox-group v-model="form.gradeIds">
|
||||||
<el-row :gutter="10">
|
<el-row :gutter="10">
|
||||||
<el-col :span="8" v-for="item in gradeOptions" :key="item.value">
|
<el-col :span="8" v-for="item in gradeOptions" :key="item.value">
|
||||||
<el-checkbox :label="item.value" style="margin-bottom: 8px;">
|
<el-checkbox :label="item.value" :disabled="item.disabled" style="margin-bottom: 8px;">
|
||||||
{{ item.label }}
|
{{ item.label }}{{ item.disabled ? '(已添加)' : '' }}
|
||||||
</el-checkbox>
|
</el-checkbox>
|
||||||
</el-col>
|
</el-col>
|
||||||
</el-row>
|
</el-row>
|
||||||
|
|
@ -55,6 +55,9 @@ const form = ref({
|
||||||
gradeIds: []
|
gradeIds: []
|
||||||
})
|
})
|
||||||
|
|
||||||
|
// 已有年级ID列表
|
||||||
|
const existingGradeIds = ref([])
|
||||||
|
|
||||||
// 获取年级选项
|
// 获取年级选项
|
||||||
const fetchGradeOptions = async () => {
|
const fetchGradeOptions = async () => {
|
||||||
try {
|
try {
|
||||||
|
|
@ -64,7 +67,7 @@ const fetchGradeOptions = async () => {
|
||||||
gradeOptions.value = (res.data || []).map(item => ({
|
gradeOptions.value = (res.data || []).map(item => ({
|
||||||
value: item.gradeId,
|
value: item.gradeId,
|
||||||
label: item.gradeName,
|
label: item.gradeName,
|
||||||
disabled: false
|
disabled: existingGradeIds.value.includes(item.gradeId)
|
||||||
}))
|
}))
|
||||||
}
|
}
|
||||||
} catch (error) {
|
} catch (error) {
|
||||||
|
|
@ -76,10 +79,14 @@ const fetchGradeOptions = async () => {
|
||||||
const open = (school) => {
|
const open = (school) => {
|
||||||
dialogVisible.value = true
|
dialogVisible.value = true
|
||||||
currentSchool.value = school
|
currentSchool.value = school
|
||||||
|
// 保存已有年级ID列表
|
||||||
|
existingGradeIds.value = school.existingGradeIds || []
|
||||||
form.value = {
|
form.value = {
|
||||||
schoolId: school.schoolId,
|
schoolId: school.schoolId,
|
||||||
gradeIds: []
|
gradeIds: []
|
||||||
}
|
}
|
||||||
|
// 重新获取年级选项(更新禁用状态)
|
||||||
|
fetchGradeOptions()
|
||||||
}
|
}
|
||||||
|
|
||||||
// 提交表单
|
// 提交表单
|
||||||
|
|
|
||||||
|
|
@ -232,9 +232,15 @@ const handleEdit = (row) => {
|
||||||
|
|
||||||
// 新增年级 - 学校下新增年级,选择对应的年级挂载
|
// 新增年级 - 学校下新增年级,选择对应的年级挂载
|
||||||
const handleAddGrade = (row) => {
|
const handleAddGrade = (row) => {
|
||||||
|
// 获取学校已有的年级ID列表
|
||||||
|
const existingGradeIds = (row.children || [])
|
||||||
|
.filter(child => child.type === 'grade')
|
||||||
|
.map(child => child.gradeId)
|
||||||
|
|
||||||
const schoolData = {
|
const schoolData = {
|
||||||
schoolId: row.id,
|
schoolId: row.id,
|
||||||
schoolName: row.name
|
schoolName: row.name,
|
||||||
|
existingGradeIds: existingGradeIds
|
||||||
}
|
}
|
||||||
gradeDialogRef.value?.open(schoolData)
|
gradeDialogRef.value?.open(schoolData)
|
||||||
}
|
}
|
||||||
|
|
@ -243,11 +249,17 @@ const handleAddGrade = (row) => {
|
||||||
const handleAddClass = (row) => {
|
const handleAddClass = (row) => {
|
||||||
// 从 treeData 中查找学校名称
|
// 从 treeData 中查找学校名称
|
||||||
const school = treeData.value.find(s => s.id === row.schoolId)
|
const school = treeData.value.find(s => s.id === row.schoolId)
|
||||||
|
// 获取年级已有的班级ID列表
|
||||||
|
const existingClassIds = (row.children || [])
|
||||||
|
.filter(child => child.type === 'class')
|
||||||
|
.map(child => child.classId)
|
||||||
|
|
||||||
const schoolData = {
|
const schoolData = {
|
||||||
schoolId: row.schoolId,
|
schoolId: row.schoolId,
|
||||||
schoolName: school ? school.name : '',
|
schoolName: school ? school.name : '',
|
||||||
schoolGradeId: row.id,
|
schoolGradeId: row.id,
|
||||||
gradeName: row.name
|
gradeName: row.name,
|
||||||
|
existingClassIds: existingClassIds
|
||||||
}
|
}
|
||||||
classDialogRef.value?.open(schoolData)
|
classDialogRef.value?.open(schoolData)
|
||||||
}
|
}
|
||||||
|
|
|
||||||
Loading…
Reference in New Issue