培养方案:专业/年级版本、课程模块、学分校验、复制版本、发布锁定、旧版本归档。
教学任务:学期开课、授课教师、唯一主讲、合班、容量与周次校验、发布及结课。 SQLite 开发库已自动升级,无需删除原数据库。 新增对应 MySQL EF Core 迁移。 Vue 已编译进 wwwroot,仍可只运行 ASP.NET Core 单服务。 桌面端及 390px 窄屏页面验证通过,无前端控制台错误。
This commit is contained in:
@@ -0,0 +1,453 @@
|
||||
<script setup lang="ts">
|
||||
import { computed, onMounted, reactive, ref } from 'vue'
|
||||
import { CopyDocument, Plus, Promotion, Refresh, Search } from '@element-plus/icons-vue'
|
||||
import http, { apiErrorMessage } from '../api/http'
|
||||
import { useAuthStore } from '../stores/auth'
|
||||
|
||||
const auth = useAuthStore()
|
||||
const loading = ref(false)
|
||||
const detailLoading = ref(false)
|
||||
const plans = ref<any[]>([])
|
||||
const total = ref(0)
|
||||
const selected = ref<any | null>(null)
|
||||
const majors = ref<any[]>([])
|
||||
const courses = ref<any[]>([])
|
||||
const planDialog = ref(false)
|
||||
const moduleDialog = ref(false)
|
||||
const courseDialog = ref(false)
|
||||
const cloneDialog = ref(false)
|
||||
const editingPlanId = ref('')
|
||||
const editingModuleId = ref('')
|
||||
const editingCourseId = ref('')
|
||||
const activeModuleId = ref('')
|
||||
const query = reactive({
|
||||
page: 1,
|
||||
pageSize: 20,
|
||||
keyword: '',
|
||||
majorId: undefined as string | undefined,
|
||||
effectiveGrade: undefined as number | undefined,
|
||||
status: undefined as string | undefined,
|
||||
})
|
||||
const planForm = reactive<Record<string, any>>({})
|
||||
const moduleForm = reactive<Record<string, any>>({})
|
||||
const courseForm = reactive<Record<string, any>>({})
|
||||
const cloneForm = reactive<Record<string, any>>({})
|
||||
|
||||
const statusLabels: Record<string, string> = {
|
||||
Draft: '草稿',
|
||||
Published: '已发布',
|
||||
Archived: '已归档',
|
||||
}
|
||||
const courseTypeLabels: Record<string, string> = {
|
||||
Required: '必修',
|
||||
Elective: '选修',
|
||||
}
|
||||
const availableMajors = computed(() =>
|
||||
auth.user?.roles.includes('CollegeAdmin') && auth.user.collegeId
|
||||
? majors.value.filter((item) => item.collegeId === auth.user!.collegeId)
|
||||
: majors.value,
|
||||
)
|
||||
const isDraft = computed(() => selected.value?.status === 'Draft')
|
||||
const configuredCredits = computed(() =>
|
||||
selected.value?.modules.reduce(
|
||||
(sum: number, module: any) => sum + Number(module.requiredCredits),
|
||||
0,
|
||||
) ?? 0,
|
||||
)
|
||||
|
||||
async function loadPlans(keepSelection = true) {
|
||||
loading.value = true
|
||||
try {
|
||||
const { data } = await http.get('/curriculum-plans', {
|
||||
params: {
|
||||
...query,
|
||||
keyword: query.keyword || undefined,
|
||||
},
|
||||
})
|
||||
plans.value = data.items
|
||||
total.value = data.total
|
||||
const targetId = keepSelection && selected.value
|
||||
? selected.value.id
|
||||
: plans.value[0]?.id
|
||||
if (targetId && plans.value.some((item) => item.id === targetId)) {
|
||||
await loadDetail(targetId)
|
||||
} else {
|
||||
selected.value = null
|
||||
}
|
||||
} catch (error) {
|
||||
ElMessage.error(apiErrorMessage(error))
|
||||
} finally {
|
||||
loading.value = false
|
||||
}
|
||||
}
|
||||
|
||||
async function loadDetail(id: string) {
|
||||
detailLoading.value = true
|
||||
try {
|
||||
selected.value = (await http.get(`/curriculum-plans/${id}`)).data
|
||||
} catch (error) {
|
||||
ElMessage.error(apiErrorMessage(error))
|
||||
} finally {
|
||||
detailLoading.value = false
|
||||
}
|
||||
}
|
||||
|
||||
function resetFilters() {
|
||||
Object.assign(query, {
|
||||
page: 1,
|
||||
keyword: '',
|
||||
majorId: undefined,
|
||||
effectiveGrade: undefined,
|
||||
status: undefined,
|
||||
})
|
||||
loadPlans(false)
|
||||
}
|
||||
|
||||
function openPlan(row?: any) {
|
||||
editingPlanId.value = row?.id ?? ''
|
||||
Object.keys(planForm).forEach((key) => delete planForm[key])
|
||||
Object.assign(planForm, {
|
||||
majorId: row?.majorId,
|
||||
name: row?.name ?? '',
|
||||
version: row?.version ?? `${new Date().getFullYear()}版`,
|
||||
effectiveGrade: row?.effectiveGrade ?? new Date().getFullYear(),
|
||||
totalCredits: row?.totalCredits ?? 160,
|
||||
description: row?.description ?? '',
|
||||
})
|
||||
planDialog.value = true
|
||||
}
|
||||
|
||||
async function savePlan() {
|
||||
if (!planForm.majorId || !planForm.name?.trim() || !planForm.version?.trim()) {
|
||||
ElMessage.warning('请填写专业、方案名称和版本号。')
|
||||
return
|
||||
}
|
||||
try {
|
||||
if (editingPlanId.value) {
|
||||
await http.put(`/curriculum-plans/${editingPlanId.value}`, planForm)
|
||||
} else {
|
||||
await http.post('/curriculum-plans', planForm)
|
||||
}
|
||||
ElMessage.success(editingPlanId.value ? '方案信息已更新' : '培养方案草稿已创建')
|
||||
planDialog.value = false
|
||||
await loadPlans(false)
|
||||
} catch (error) {
|
||||
ElMessage.error(apiErrorMessage(error))
|
||||
}
|
||||
}
|
||||
|
||||
function openClone() {
|
||||
Object.assign(cloneForm, {
|
||||
name: selected.value.name,
|
||||
version: `${new Date().getFullYear()}版`,
|
||||
effectiveGrade: Math.max(new Date().getFullYear(), selected.value.effectiveGrade + 1),
|
||||
})
|
||||
cloneDialog.value = true
|
||||
}
|
||||
|
||||
async function clonePlan() {
|
||||
try {
|
||||
await http.post(`/curriculum-plans/${selected.value.id}/clone`, cloneForm)
|
||||
ElMessage.success('已复制为新的草稿版本')
|
||||
cloneDialog.value = false
|
||||
await loadPlans(false)
|
||||
} catch (error) {
|
||||
ElMessage.error(apiErrorMessage(error))
|
||||
}
|
||||
}
|
||||
|
||||
async function publishPlan() {
|
||||
try {
|
||||
await ElMessageBox.confirm(
|
||||
'发布后该版本将锁定,并自动归档同专业、同年级的旧发布版本。确定发布吗?',
|
||||
'发布培养方案',
|
||||
{ type: 'warning', confirmButtonText: '确认发布', cancelButtonText: '取消' },
|
||||
)
|
||||
await http.post(`/curriculum-plans/${selected.value.id}/publish`)
|
||||
ElMessage.success('培养方案已发布')
|
||||
await loadPlans()
|
||||
} catch (error: any) {
|
||||
if (error !== 'cancel' && error !== 'close') ElMessage.error(apiErrorMessage(error))
|
||||
}
|
||||
}
|
||||
|
||||
async function deletePlan() {
|
||||
try {
|
||||
await ElMessageBox.confirm('确定删除这份草稿及其全部课程配置吗?', '删除草稿', {
|
||||
type: 'warning',
|
||||
confirmButtonText: '删除',
|
||||
cancelButtonText: '取消',
|
||||
})
|
||||
await http.delete(`/curriculum-plans/${selected.value.id}`)
|
||||
ElMessage.success('草稿已删除')
|
||||
await loadPlans(false)
|
||||
} catch (error: any) {
|
||||
if (error !== 'cancel' && error !== 'close') ElMessage.error(apiErrorMessage(error))
|
||||
}
|
||||
}
|
||||
|
||||
function openModule(module?: any) {
|
||||
editingModuleId.value = module?.id ?? ''
|
||||
Object.assign(moduleForm, {
|
||||
code: module?.code ?? '',
|
||||
name: module?.name ?? '',
|
||||
requiredCredits: module?.requiredCredits ?? 0,
|
||||
sortOrder: module?.sortOrder ?? (selected.value.modules.length + 1) * 10,
|
||||
})
|
||||
moduleDialog.value = true
|
||||
}
|
||||
|
||||
async function saveModule() {
|
||||
if (!moduleForm.code?.trim() || !moduleForm.name?.trim()) {
|
||||
ElMessage.warning('请填写模块编码和名称。')
|
||||
return
|
||||
}
|
||||
try {
|
||||
const base = `/curriculum-plans/${selected.value.id}/modules`
|
||||
if (editingModuleId.value) await http.put(`${base}/${editingModuleId.value}`, moduleForm)
|
||||
else await http.post(base, moduleForm)
|
||||
moduleDialog.value = false
|
||||
await loadDetail(selected.value.id)
|
||||
} catch (error) {
|
||||
ElMessage.error(apiErrorMessage(error))
|
||||
}
|
||||
}
|
||||
|
||||
async function deleteModule(module: any) {
|
||||
try {
|
||||
await ElMessageBox.confirm(`删除“${module.name}”及其中课程?`, '删除课程模块', {
|
||||
type: 'warning',
|
||||
})
|
||||
await http.delete(`/curriculum-plans/${selected.value.id}/modules/${module.id}`)
|
||||
await loadDetail(selected.value.id)
|
||||
} catch (error: any) {
|
||||
if (error !== 'cancel' && error !== 'close') ElMessage.error(apiErrorMessage(error))
|
||||
}
|
||||
}
|
||||
|
||||
function openCourse(moduleId: string, item?: any) {
|
||||
activeModuleId.value = moduleId
|
||||
editingCourseId.value = item?.id ?? ''
|
||||
Object.assign(courseForm, {
|
||||
courseId: item?.courseId,
|
||||
recommendedSemester: item?.recommendedSemester ?? 1,
|
||||
type: item?.type ?? 'Required',
|
||||
notes: item?.notes ?? '',
|
||||
})
|
||||
courseDialog.value = true
|
||||
}
|
||||
|
||||
async function saveCourse() {
|
||||
if (!courseForm.courseId) {
|
||||
ElMessage.warning('请选择课程。')
|
||||
return
|
||||
}
|
||||
try {
|
||||
const base = `/curriculum-plans/${selected.value.id}/modules/${activeModuleId.value}/courses`
|
||||
if (editingCourseId.value) await http.put(`${base}/${editingCourseId.value}`, courseForm)
|
||||
else await http.post(base, courseForm)
|
||||
courseDialog.value = false
|
||||
await loadDetail(selected.value.id)
|
||||
} catch (error) {
|
||||
ElMessage.error(apiErrorMessage(error))
|
||||
}
|
||||
}
|
||||
|
||||
async function deleteCourse(moduleId: string, item: any) {
|
||||
try {
|
||||
await ElMessageBox.confirm(`从方案中移除“${item.courseName}”?`, '移除课程', {
|
||||
type: 'warning',
|
||||
})
|
||||
await http.delete(
|
||||
`/curriculum-plans/${selected.value.id}/modules/${moduleId}/courses/${item.id}`,
|
||||
)
|
||||
await loadDetail(selected.value.id)
|
||||
} catch (error: any) {
|
||||
if (error !== 'cancel' && error !== 'close') ElMessage.error(apiErrorMessage(error))
|
||||
}
|
||||
}
|
||||
|
||||
onMounted(async () => {
|
||||
const [majorRes, courseRes] = await Promise.all([
|
||||
http.get('/base-data/majors'),
|
||||
http.get('/courses', { params: { page: 1, pageSize: 100, isEnabled: true } }),
|
||||
])
|
||||
majors.value = majorRes.data
|
||||
courses.value = courseRes.data.items
|
||||
await loadPlans(false)
|
||||
})
|
||||
</script>
|
||||
|
||||
<template>
|
||||
<div class="page-stack">
|
||||
<section class="page-intro">
|
||||
<div>
|
||||
<span class="section-kicker">PROGRAMME OF STUDY</span>
|
||||
<h2>培养方案</h2>
|
||||
<p>按专业和入学年级管理版本化课程结构,发布后锁定,避免影响历史年级。</p>
|
||||
</div>
|
||||
<el-button type="primary" :icon="Plus" @click="openPlan()">新建方案</el-button>
|
||||
</section>
|
||||
|
||||
<section class="curriculum-filter">
|
||||
<el-input v-model="query.keyword" :prefix-icon="Search" clearable placeholder="搜索方案、版本或专业" @keyup.enter="query.page = 1; loadPlans(false)" />
|
||||
<el-select v-model="query.majorId" clearable filterable placeholder="全部专业">
|
||||
<el-option v-for="item in availableMajors" :key="item.id" :label="item.name" :value="item.id" />
|
||||
</el-select>
|
||||
<el-input-number v-model="query.effectiveGrade" :min="2000" :max="2200" placeholder="适用年级" />
|
||||
<el-select v-model="query.status" clearable placeholder="全部状态">
|
||||
<el-option v-for="(label, value) in statusLabels" :key="value" :label="label" :value="value" />
|
||||
</el-select>
|
||||
<el-button type="primary" @click="query.page = 1; loadPlans(false)">查询</el-button>
|
||||
<el-button :icon="Refresh" @click="resetFilters">重置</el-button>
|
||||
</section>
|
||||
|
||||
<div class="curriculum-workspace">
|
||||
<aside v-loading="loading" class="plan-list">
|
||||
<button
|
||||
v-for="plan in plans"
|
||||
:key="plan.id"
|
||||
type="button"
|
||||
:class="{ active: selected?.id === plan.id }"
|
||||
@click="loadDetail(plan.id)"
|
||||
>
|
||||
<span>{{ plan.majorName }} · {{ plan.effectiveGrade }}级</span>
|
||||
<b>{{ plan.name }}</b>
|
||||
<small>{{ plan.version }} · {{ plan.courseCount }} 门课程</small>
|
||||
<i :class="plan.status.toLowerCase()">{{ statusLabels[plan.status] }}</i>
|
||||
</button>
|
||||
<el-empty v-if="!loading && plans.length === 0" description="暂无培养方案" :image-size="70" />
|
||||
<div class="plan-pagination">
|
||||
<span>共 {{ total }} 版</span>
|
||||
<el-pagination v-model:current-page="query.page" :page-size="query.pageSize" :total="total" layout="prev, next" @current-change="loadPlans(false)" />
|
||||
</div>
|
||||
</aside>
|
||||
|
||||
<main v-loading="detailLoading" class="plan-detail">
|
||||
<el-empty v-if="!selected" description="请选择或新建一份培养方案" />
|
||||
<template v-else>
|
||||
<header class="plan-detail-head">
|
||||
<div>
|
||||
<span>{{ selected.collegeName }} / {{ selected.majorName }}</span>
|
||||
<h3>{{ selected.name }}</h3>
|
||||
<p>{{ selected.version }} · 适用 {{ selected.effectiveGrade }} 级 · {{ selected.schoolingYears }} 年制</p>
|
||||
</div>
|
||||
<div class="plan-actions">
|
||||
<el-button v-if="isDraft" @click="openPlan(selected)">编辑</el-button>
|
||||
<el-button :icon="CopyDocument" @click="openClone">复制版本</el-button>
|
||||
<el-button v-if="isDraft" type="success" :icon="Promotion" @click="publishPlan">发布</el-button>
|
||||
<el-button v-if="isDraft" type="danger" plain @click="deletePlan">删除</el-button>
|
||||
</div>
|
||||
</header>
|
||||
|
||||
<div class="plan-metrics">
|
||||
<div><span>方案状态</span><b>{{ statusLabels[selected.status] }}</b></div>
|
||||
<div><span>总学分要求</span><b>{{ selected.totalCredits }}</b></div>
|
||||
<div><span>模块学分合计</span><b :class="{ warning: configuredCredits !== Number(selected.totalCredits) }">{{ configuredCredits }}</b></div>
|
||||
<div><span>课程数量</span><b>{{ selected.modules.reduce((sum: number, item: any) => sum + item.courses.length, 0) }}</b></div>
|
||||
</div>
|
||||
|
||||
<div class="module-toolbar">
|
||||
<div>
|
||||
<b>课程结构</b>
|
||||
<span>发布前模块学分合计须与方案总学分一致</span>
|
||||
</div>
|
||||
<el-button v-if="isDraft" :icon="Plus" @click="openModule()">新增模块</el-button>
|
||||
</div>
|
||||
|
||||
<section v-for="module in selected.modules" :key="module.id" class="curriculum-module">
|
||||
<header>
|
||||
<div>
|
||||
<span>{{ module.code }}</span>
|
||||
<h4>{{ module.name }}</h4>
|
||||
</div>
|
||||
<p>最低 {{ module.requiredCredits }} 学分 · 已配置 {{ module.assignedCredits }} 学分</p>
|
||||
<div v-if="isDraft">
|
||||
<el-button link type="primary" @click="openModule(module)">编辑</el-button>
|
||||
<el-button link type="danger" @click="deleteModule(module)">删除</el-button>
|
||||
<el-button size="small" :icon="Plus" @click="openCourse(module.id)">添加课程</el-button>
|
||||
</div>
|
||||
</header>
|
||||
<el-table :data="module.courses" class="curriculum-course-table">
|
||||
<el-table-column prop="courseCode" label="课程编码" width="115" />
|
||||
<el-table-column label="课程名称" min-width="180">
|
||||
<template #default="{ row }"><b>{{ row.courseName }}</b></template>
|
||||
</el-table-column>
|
||||
<el-table-column label="类别" width="80">
|
||||
<template #default="{ row }">{{ courseTypeLabels[row.type] }}</template>
|
||||
</el-table-column>
|
||||
<el-table-column prop="credits" label="学分" width="70" />
|
||||
<el-table-column prop="totalHours" label="学时" width="70" />
|
||||
<el-table-column label="建议学期" width="90">
|
||||
<template #default="{ row }">第 {{ row.recommendedSemester }} 学期</template>
|
||||
</el-table-column>
|
||||
<el-table-column v-if="isDraft" label="操作" width="120">
|
||||
<template #default="{ row }">
|
||||
<el-button link type="primary" @click="openCourse(module.id, row)">编辑</el-button>
|
||||
<el-button link type="danger" @click="deleteCourse(module.id, row)">移除</el-button>
|
||||
</template>
|
||||
</el-table-column>
|
||||
<template #empty><el-empty description="该模块尚未配置课程" :image-size="54" /></template>
|
||||
</el-table>
|
||||
</section>
|
||||
<el-empty v-if="selected.modules.length === 0" description="先建立课程模块,再添加课程" />
|
||||
</template>
|
||||
</main>
|
||||
</div>
|
||||
|
||||
<el-dialog v-model="planDialog" :title="editingPlanId ? '编辑培养方案' : '新建培养方案'" width="620px">
|
||||
<el-form label-position="top">
|
||||
<el-form-item label="适用专业" required>
|
||||
<el-select v-model="planForm.majorId" filterable><el-option v-for="item in availableMajors" :key="item.id" :label="item.name" :value="item.id" /></el-select>
|
||||
</el-form-item>
|
||||
<el-form-item label="方案名称" required><el-input v-model="planForm.name" /></el-form-item>
|
||||
<div class="form-grid">
|
||||
<el-form-item label="版本号" required><el-input v-model="planForm.version" /></el-form-item>
|
||||
<el-form-item label="适用入学年级" required><el-input-number v-model="planForm.effectiveGrade" :min="2000" :max="2200" /></el-form-item>
|
||||
</div>
|
||||
<el-form-item label="毕业总学分要求" required><el-input-number v-model="planForm.totalCredits" :min="0.1" :precision="1" :step="0.5" /></el-form-item>
|
||||
<el-form-item label="方案说明"><el-input v-model="planForm.description" type="textarea" :rows="3" /></el-form-item>
|
||||
</el-form>
|
||||
<template #footer><el-button @click="planDialog = false">取消</el-button><el-button type="primary" @click="savePlan">保存</el-button></template>
|
||||
</el-dialog>
|
||||
|
||||
<el-dialog v-model="cloneDialog" title="复制为新版本" width="520px">
|
||||
<el-form label-position="top">
|
||||
<el-form-item label="方案名称" required><el-input v-model="cloneForm.name" /></el-form-item>
|
||||
<div class="form-grid">
|
||||
<el-form-item label="新版本号" required><el-input v-model="cloneForm.version" /></el-form-item>
|
||||
<el-form-item label="适用入学年级" required><el-input-number v-model="cloneForm.effectiveGrade" :min="2000" :max="2200" /></el-form-item>
|
||||
</div>
|
||||
</el-form>
|
||||
<template #footer><el-button @click="cloneDialog = false">取消</el-button><el-button type="primary" @click="clonePlan">复制</el-button></template>
|
||||
</el-dialog>
|
||||
|
||||
<el-dialog v-model="moduleDialog" :title="editingModuleId ? '编辑课程模块' : '新增课程模块'" width="520px">
|
||||
<el-form label-position="top">
|
||||
<div class="form-grid">
|
||||
<el-form-item label="模块编码" required><el-input v-model="moduleForm.code" /></el-form-item>
|
||||
<el-form-item label="排序"><el-input-number v-model="moduleForm.sortOrder" :min="0" /></el-form-item>
|
||||
</div>
|
||||
<el-form-item label="模块名称" required><el-input v-model="moduleForm.name" /></el-form-item>
|
||||
<el-form-item label="最低学分要求"><el-input-number v-model="moduleForm.requiredCredits" :min="0" :precision="1" :step="0.5" /></el-form-item>
|
||||
</el-form>
|
||||
<template #footer><el-button @click="moduleDialog = false">取消</el-button><el-button type="primary" @click="saveModule">保存</el-button></template>
|
||||
</el-dialog>
|
||||
|
||||
<el-dialog v-model="courseDialog" :title="editingCourseId ? '编辑方案课程' : '添加方案课程'" width="560px">
|
||||
<el-form label-position="top">
|
||||
<el-form-item label="课程" required>
|
||||
<el-select v-model="courseForm.courseId" filterable>
|
||||
<el-option v-for="item in courses" :key="item.id" :label="`${item.code} · ${item.name}`" :value="item.id" />
|
||||
</el-select>
|
||||
</el-form-item>
|
||||
<div class="form-grid">
|
||||
<el-form-item label="修读类别"><el-select v-model="courseForm.type"><el-option v-for="(label, value) in courseTypeLabels" :key="value" :label="label" :value="value" /></el-select></el-form-item>
|
||||
<el-form-item label="建议学期"><el-input-number v-model="courseForm.recommendedSemester" :min="1" :max="selected?.schoolingYears * 2" /></el-form-item>
|
||||
</div>
|
||||
<el-form-item label="备注"><el-input v-model="courseForm.notes" type="textarea" :rows="2" /></el-form-item>
|
||||
</el-form>
|
||||
<template #footer><el-button @click="courseDialog = false">取消</el-button><el-button type="primary" @click="saveCourse">保存</el-button></template>
|
||||
</el-dialog>
|
||||
</div>
|
||||
</template>
|
||||
@@ -86,18 +86,28 @@ onMounted(async () => {
|
||||
<b>教师档案 + 学生档案 + 课程库</b>
|
||||
<i class="done">已建立</i>
|
||||
</div>
|
||||
<div>
|
||||
<span>培养方案</span>
|
||||
<b>{{ data.counts.curriculumPlans ?? 0 }} 个版本 · 模块化课程结构</b>
|
||||
<i class="done">已建立</i>
|
||||
</div>
|
||||
<div>
|
||||
<span>教学任务</span>
|
||||
<b>{{ data.counts.teachingTasks ?? 0 }} 个教学班 · 教师与行政班</b>
|
||||
<i class="done">已建立</i>
|
||||
</div>
|
||||
</div>
|
||||
</article>
|
||||
|
||||
<article class="work-card phase-card">
|
||||
<span class="section-kicker">NEXT MILESTONE</span>
|
||||
<h3>下一段业务链</h3>
|
||||
<p>人员与课程主数据已就绪,下一步进入培养方案、课程开设与教学任务。</p>
|
||||
<p>学期教学任务已可发布,下一步进入时间、教室冲突校验与课表发布。</p>
|
||||
<div class="phase-line">
|
||||
<span class="active">基础底座</span>
|
||||
<span class="active">人员档案</span>
|
||||
<span>培养方案</span>
|
||||
<span>教学运行</span>
|
||||
<span class="active">培养方案</span>
|
||||
<span class="active">教学任务</span>
|
||||
</div>
|
||||
</article>
|
||||
</section>
|
||||
|
||||
@@ -0,0 +1,284 @@
|
||||
<script setup lang="ts">
|
||||
import { computed, onMounted, reactive, ref } from 'vue'
|
||||
import { Plus, Refresh, Search } from '@element-plus/icons-vue'
|
||||
import http, { apiErrorMessage } from '../api/http'
|
||||
import { useAuthStore } from '../stores/auth'
|
||||
|
||||
const auth = useAuthStore()
|
||||
const loading = ref(false)
|
||||
const rows = ref<any[]>([])
|
||||
const total = ref(0)
|
||||
const dialogVisible = ref(false)
|
||||
const editingId = ref('')
|
||||
const terms = ref<any[]>([])
|
||||
const courses = ref<any[]>([])
|
||||
const teachers = ref<any[]>([])
|
||||
const classes = ref<any[]>([])
|
||||
const majors = ref<any[]>([])
|
||||
const query = reactive({
|
||||
page: 1,
|
||||
pageSize: 20,
|
||||
keyword: '',
|
||||
academicTermId: undefined as string | undefined,
|
||||
status: undefined as string | undefined,
|
||||
})
|
||||
const form = reactive<Record<string, any>>({})
|
||||
const statusLabels: Record<string, string> = {
|
||||
Draft: '草稿',
|
||||
Published: '已发布',
|
||||
Closed: '已结课',
|
||||
}
|
||||
const availableClasses = computed(() => {
|
||||
if (!auth.user?.roles.includes('CollegeAdmin') || !auth.user.collegeId) return classes.value
|
||||
const ids = new Set(
|
||||
majors.value.filter((item) => item.collegeId === auth.user!.collegeId).map((item) => item.id),
|
||||
)
|
||||
return classes.value.filter((item) => ids.has(item.majorId))
|
||||
})
|
||||
const selectedTeachers = computed(() =>
|
||||
teachers.value.filter((item) => form.teacherIds?.includes(item.id)),
|
||||
)
|
||||
|
||||
async function load() {
|
||||
loading.value = true
|
||||
try {
|
||||
const { data } = await http.get('/teaching-tasks', {
|
||||
params: {
|
||||
...query,
|
||||
keyword: query.keyword || undefined,
|
||||
},
|
||||
})
|
||||
rows.value = data.items
|
||||
total.value = data.total
|
||||
} catch (error) {
|
||||
ElMessage.error(apiErrorMessage(error))
|
||||
} finally {
|
||||
loading.value = false
|
||||
}
|
||||
}
|
||||
|
||||
function resetFilters() {
|
||||
Object.assign(query, {
|
||||
page: 1,
|
||||
keyword: '',
|
||||
academicTermId: undefined,
|
||||
status: undefined,
|
||||
})
|
||||
load()
|
||||
}
|
||||
|
||||
function resetForm(detail?: any) {
|
||||
Object.keys(form).forEach((key) => delete form[key])
|
||||
const currentTerm = terms.value.find((item) => item.isCurrent)
|
||||
Object.assign(form, {
|
||||
taskNumber: '',
|
||||
name: '',
|
||||
academicTermId: currentTerm?.id,
|
||||
courseId: undefined,
|
||||
capacity: 60,
|
||||
startWeek: 1,
|
||||
endWeek: 16,
|
||||
weeklyHours: 2,
|
||||
teacherIds: [],
|
||||
primaryTeacherId: undefined,
|
||||
classIds: [],
|
||||
notes: '',
|
||||
}, detail ?? {})
|
||||
}
|
||||
|
||||
function openCreate() {
|
||||
editingId.value = ''
|
||||
resetForm()
|
||||
dialogVisible.value = true
|
||||
}
|
||||
|
||||
async function openEdit(row: any) {
|
||||
try {
|
||||
const detail = (await http.get(`/teaching-tasks/${row.id}`)).data
|
||||
editingId.value = row.id
|
||||
resetForm(detail)
|
||||
dialogVisible.value = true
|
||||
} catch (error) {
|
||||
ElMessage.error(apiErrorMessage(error))
|
||||
}
|
||||
}
|
||||
|
||||
function onTeachersChanged(values: string[]) {
|
||||
if (form.primaryTeacherId && !values.includes(form.primaryTeacherId)) {
|
||||
form.primaryTeacherId = undefined
|
||||
}
|
||||
}
|
||||
|
||||
async function save() {
|
||||
if (!form.taskNumber?.trim() || !form.name?.trim() || !form.academicTermId || !form.courseId) {
|
||||
ElMessage.warning('请填写任务编号、名称、学期和课程。')
|
||||
return
|
||||
}
|
||||
if (form.startWeek > form.endWeek) {
|
||||
ElMessage.warning('开始周不能晚于结束周。')
|
||||
return
|
||||
}
|
||||
try {
|
||||
if (editingId.value) await http.put(`/teaching-tasks/${editingId.value}`, form)
|
||||
else await http.post('/teaching-tasks', form)
|
||||
ElMessage.success(editingId.value ? '教学任务已更新' : '教学任务草稿已创建')
|
||||
dialogVisible.value = false
|
||||
await load()
|
||||
} catch (error) {
|
||||
ElMessage.error(apiErrorMessage(error))
|
||||
}
|
||||
}
|
||||
|
||||
async function remove(row: any) {
|
||||
try {
|
||||
await ElMessageBox.confirm(`确定删除教学任务“${row.name}”吗?`, '删除草稿', {
|
||||
type: 'warning',
|
||||
})
|
||||
await http.delete(`/teaching-tasks/${row.id}`)
|
||||
await load()
|
||||
} catch (error: any) {
|
||||
if (error !== 'cancel' && error !== 'close') ElMessage.error(apiErrorMessage(error))
|
||||
}
|
||||
}
|
||||
|
||||
async function publish(row: any) {
|
||||
try {
|
||||
await ElMessageBox.confirm(
|
||||
'发布后任务将锁定,并可进入排课与选课流程。确定发布吗?',
|
||||
'发布教学任务',
|
||||
{ type: 'warning', confirmButtonText: '发布', cancelButtonText: '取消' },
|
||||
)
|
||||
await http.post(`/teaching-tasks/${row.id}/publish`)
|
||||
ElMessage.success('教学任务已发布')
|
||||
await load()
|
||||
} catch (error: any) {
|
||||
if (error !== 'cancel' && error !== 'close') ElMessage.error(apiErrorMessage(error))
|
||||
}
|
||||
}
|
||||
|
||||
async function closeTask(row: any) {
|
||||
try {
|
||||
await ElMessageBox.confirm('结课后将停止后续选课和排课调整,确定继续吗?', '教学任务结课', {
|
||||
type: 'warning',
|
||||
confirmButtonText: '确认结课',
|
||||
cancelButtonText: '取消',
|
||||
})
|
||||
await http.post(`/teaching-tasks/${row.id}/close`)
|
||||
await load()
|
||||
} catch (error: any) {
|
||||
if (error !== 'cancel' && error !== 'close') ElMessage.error(apiErrorMessage(error))
|
||||
}
|
||||
}
|
||||
|
||||
onMounted(async () => {
|
||||
const [termRes, courseRes, teacherRes, classRes, majorRes] = await Promise.all([
|
||||
http.get('/base-data/terms'),
|
||||
http.get('/courses', { params: { page: 1, pageSize: 100, isEnabled: true } }),
|
||||
http.get('/personnel/teachers', { params: { page: 1, pageSize: 100, teacherStatus: 'Active' } }),
|
||||
http.get('/base-data/classes'),
|
||||
http.get('/base-data/majors'),
|
||||
])
|
||||
terms.value = termRes.data
|
||||
courses.value = courseRes.data.items
|
||||
teachers.value = teacherRes.data.items
|
||||
classes.value = classRes.data
|
||||
majors.value = majorRes.data
|
||||
query.academicTermId = terms.value.find((item) => item.isCurrent)?.id
|
||||
await load()
|
||||
})
|
||||
</script>
|
||||
|
||||
<template>
|
||||
<div class="page-stack">
|
||||
<section class="page-intro">
|
||||
<div>
|
||||
<span class="section-kicker">TEACHING COMMISSION</span>
|
||||
<h2>教学任务</h2>
|
||||
<p>将学期、课程、授课教师和行政班组合为可排课、可选课的教学班。</p>
|
||||
</div>
|
||||
<el-button type="primary" :icon="Plus" @click="openCreate">新建教学任务</el-button>
|
||||
</section>
|
||||
|
||||
<section class="task-summary">
|
||||
<div><span>当前结果</span><b>{{ total }}</b><small>个教学班</small></div>
|
||||
<p>发布校验:主讲教师唯一 · 行政班已关联 · 容量覆盖在籍学生 · 周次有效</p>
|
||||
</section>
|
||||
|
||||
<section class="data-card">
|
||||
<div class="filter-bar">
|
||||
<el-input v-model="query.keyword" :prefix-icon="Search" clearable placeholder="搜索任务编号、教学班或课程" @keyup.enter="query.page = 1; load()" />
|
||||
<el-select v-model="query.academicTermId" clearable placeholder="全部学期">
|
||||
<el-option v-for="item in terms" :key="item.id" :label="item.name" :value="item.id" />
|
||||
</el-select>
|
||||
<el-select v-model="query.status" clearable placeholder="全部状态">
|
||||
<el-option v-for="(label, value) in statusLabels" :key="value" :label="label" :value="value" />
|
||||
</el-select>
|
||||
<el-button type="primary" @click="query.page = 1; load()">查询</el-button>
|
||||
<el-button :icon="Refresh" @click="resetFilters">重置</el-button>
|
||||
</div>
|
||||
|
||||
<el-table v-loading="loading" :data="rows" class="data-table task-table">
|
||||
<el-table-column label="任务编号" width="155"><template #default="{ row }"><span class="registry-number">{{ row.taskNumber }}</span></template></el-table-column>
|
||||
<el-table-column label="教学班 / 课程" min-width="230">
|
||||
<template #default="{ row }"><div class="course-name"><b>{{ row.name }}</b><span>{{ row.courseCode }} · {{ row.courseName }}</span></div></template>
|
||||
</el-table-column>
|
||||
<el-table-column prop="termName" label="开课学期" min-width="180" />
|
||||
<el-table-column label="授课教师" min-width="130"><template #default="{ row }">{{ row.teacherNames.join('、') || '未安排' }}</template></el-table-column>
|
||||
<el-table-column label="行政班" min-width="150"><template #default="{ row }">{{ row.classNames.join('、') || '未关联' }}</template></el-table-column>
|
||||
<el-table-column label="人数 / 容量" width="105"><template #default="{ row }">{{ row.studentCount }} / {{ row.capacity }}</template></el-table-column>
|
||||
<el-table-column label="周次" width="105"><template #default="{ row }">{{ row.startWeek }}—{{ row.endWeek }} 周</template></el-table-column>
|
||||
<el-table-column label="状态" width="90"><template #default="{ row }"><span class="table-status" :class="{ off: row.status === 'Closed' }">{{ statusLabels[row.status] }}</span></template></el-table-column>
|
||||
<el-table-column label="操作" width="185" fixed="right">
|
||||
<template #default="{ row }">
|
||||
<el-button v-if="row.status === 'Draft'" link type="primary" @click="openEdit(row)">编辑</el-button>
|
||||
<el-button v-if="row.status === 'Draft'" link type="success" @click="publish(row)">发布</el-button>
|
||||
<el-button v-if="row.status === 'Draft'" link type="danger" @click="remove(row)">删除</el-button>
|
||||
<el-button v-if="row.status === 'Published'" link type="warning" @click="closeTask(row)">结课</el-button>
|
||||
<span v-if="row.status === 'Closed'" class="muted-action">已归档</span>
|
||||
</template>
|
||||
</el-table-column>
|
||||
<template #empty><el-empty description="没有符合条件的教学任务" /></template>
|
||||
</el-table>
|
||||
<div class="pagination-bar">
|
||||
<span>共 {{ total }} 个教学班</span>
|
||||
<el-pagination v-model:current-page="query.page" :page-size="query.pageSize" :total="total" layout="prev, pager, next" @current-change="load" />
|
||||
</div>
|
||||
</section>
|
||||
|
||||
<el-dialog v-model="dialogVisible" :title="editingId ? '编辑教学任务' : '新建教学任务'" width="720px">
|
||||
<el-form label-position="top">
|
||||
<div class="form-grid">
|
||||
<el-form-item label="任务编号" required><el-input v-model="form.taskNumber" placeholder="如 2026-1-CS101-01" /></el-form-item>
|
||||
<el-form-item label="教学班名称" required><el-input v-model="form.name" /></el-form-item>
|
||||
</div>
|
||||
<div class="form-grid">
|
||||
<el-form-item label="开课学期" required><el-select v-model="form.academicTermId"><el-option v-for="item in terms" :key="item.id" :label="item.name" :value="item.id" /></el-select></el-form-item>
|
||||
<el-form-item label="课程" required><el-select v-model="form.courseId" filterable><el-option v-for="item in courses" :key="item.id" :label="`${item.code} · ${item.name}`" :value="item.id" /></el-select></el-form-item>
|
||||
</div>
|
||||
<div class="form-grid three">
|
||||
<el-form-item label="容量"><el-input-number v-model="form.capacity" :min="1" /></el-form-item>
|
||||
<el-form-item label="开始周"><el-input-number v-model="form.startWeek" :min="1" :max="30" /></el-form-item>
|
||||
<el-form-item label="结束周"><el-input-number v-model="form.endWeek" :min="1" :max="30" /></el-form-item>
|
||||
</div>
|
||||
<el-form-item label="周学时"><el-input-number v-model="form.weeklyHours" :min="1" :max="40" /></el-form-item>
|
||||
<el-form-item label="授课教师">
|
||||
<el-select v-model="form.teacherIds" multiple filterable @change="onTeachersChanged">
|
||||
<el-option v-for="item in teachers" :key="item.id" :label="`${item.teacherNumber} · ${item.name}`" :value="item.id" />
|
||||
</el-select>
|
||||
</el-form-item>
|
||||
<el-form-item label="主讲教师">
|
||||
<el-select v-model="form.primaryTeacherId" clearable :disabled="!form.teacherIds?.length">
|
||||
<el-option v-for="item in selectedTeachers" :key="item.id" :label="item.name" :value="item.id" />
|
||||
</el-select>
|
||||
</el-form-item>
|
||||
<el-form-item label="关联行政班">
|
||||
<el-select v-model="form.classIds" multiple filterable>
|
||||
<el-option v-for="item in availableClasses" :key="item.id" :label="`${item.code} · ${item.name}`" :value="item.id" />
|
||||
</el-select>
|
||||
</el-form-item>
|
||||
<el-form-item label="备注"><el-input v-model="form.notes" type="textarea" :rows="2" /></el-form-item>
|
||||
</el-form>
|
||||
<template #footer><el-button @click="dialogVisible = false">取消</el-button><el-button type="primary" @click="save">保存草稿</el-button></template>
|
||||
</el-dialog>
|
||||
</div>
|
||||
</template>
|
||||
Reference in New Issue
Block a user