学籍异动：休学、复学、退学申请及辅导员→学院→教务处分级审批。
毕业审核：批次计算、缺失课程检查、人工复核、结果发布。 学位授予：毕业资格与 GPA 计算、人工调整、发布授予结果。 毕业离校：离校事项配置、责任角色分工、逐项办理及批次关闭。
This commit is contained in:
Vendored
+3
@@ -27,6 +27,9 @@ declare module 'vue' {
|
||||
ElMenuItem: typeof import('element-plus/es')['ElMenuItem']
|
||||
ElOption: typeof import('element-plus/es')['ElOption']
|
||||
ElPagination: typeof import('element-plus/es')['ElPagination']
|
||||
ElProgress: typeof import('element-plus/es')['ElProgress']
|
||||
ElRadioButton: typeof import('element-plus/es')['ElRadioButton']
|
||||
ElRadioGroup: typeof import('element-plus/es')['ElRadioGroup']
|
||||
ElSelect: typeof import('element-plus/es')['ElSelect']
|
||||
ElSwitch: typeof import('element-plus/es')['ElSwitch']
|
||||
ElTable: typeof import('element-plus/es')['ElTable']
|
||||
|
||||
@@ -12,6 +12,8 @@ import {
|
||||
CircleCheck,
|
||||
DocumentChecked,
|
||||
AlarmClock,
|
||||
RefreshRight,
|
||||
Medal,
|
||||
User,
|
||||
UserFilled,
|
||||
} from '@element-plus/icons-vue'
|
||||
@@ -45,6 +47,10 @@ const pageTitle = computed(() => {
|
||||
'course-selections': '选课与教学班',
|
||||
grades: '成绩与学业档案',
|
||||
exams: '考试与考场',
|
||||
'student-status-changes': '学籍异动',
|
||||
'graduation-audits': '毕业资格审核',
|
||||
'degree-awards': '学位授予审核',
|
||||
'graduation-clearance': '毕业离校办理',
|
||||
users: '用户与权限',
|
||||
}
|
||||
return titles[String(route.name)] ?? '教务管理'
|
||||
@@ -147,6 +153,34 @@ onMounted(() => auth.refresh().catch(() => undefined))
|
||||
<el-icon><AlarmClock /></el-icon>
|
||||
<template #title>{{ auth.user?.roles.includes('Student') ? '我的考试' : auth.user?.roles.includes('Teacher') ? '我的监考' : '考试管理' }}</template>
|
||||
</el-menu-item>
|
||||
<el-menu-item
|
||||
v-if="auth.user?.roles.some((role) => ['SuperAdmin', 'AcademicAdmin', 'CollegeAdmin', 'Counselor', 'Student'].includes(role))"
|
||||
index="/student-status-changes"
|
||||
>
|
||||
<el-icon><RefreshRight /></el-icon>
|
||||
<template #title>{{ auth.user?.roles.includes('Student') ? '学籍异动' : '异动审核' }}</template>
|
||||
</el-menu-item>
|
||||
<el-menu-item
|
||||
v-if="auth.user?.roles.some((role) => ['SuperAdmin', 'AcademicAdmin', 'CollegeAdmin', 'Student'].includes(role))"
|
||||
index="/graduation-audits"
|
||||
>
|
||||
<el-icon><Medal /></el-icon>
|
||||
<template #title>{{ auth.user?.roles.includes('Student') ? '毕业资格' : '毕业审核' }}</template>
|
||||
</el-menu-item>
|
||||
<el-menu-item
|
||||
v-if="auth.user?.roles.some((role) => ['SuperAdmin', 'AcademicAdmin', 'CollegeAdmin', 'Student'].includes(role))"
|
||||
index="/degree-awards"
|
||||
>
|
||||
<el-icon><Medal /></el-icon>
|
||||
<template #title>{{ auth.user?.roles.includes('Student') ? '学位结果' : '学位授予' }}</template>
|
||||
</el-menu-item>
|
||||
<el-menu-item
|
||||
v-if="auth.user?.roles.some((role) => ['SuperAdmin', 'AcademicAdmin', 'CollegeAdmin', 'Counselor', 'Student'].includes(role))"
|
||||
index="/graduation-clearance"
|
||||
>
|
||||
<el-icon><CircleCheck /></el-icon>
|
||||
<template #title>{{ auth.user?.roles.includes('Student') ? '毕业离校' : '离校办理' }}</template>
|
||||
</el-menu-item>
|
||||
<el-menu-item v-if="auth.isSuperAdmin" index="/users">
|
||||
<el-icon><User /></el-icon>
|
||||
<template #title>用户与权限</template>
|
||||
@@ -155,7 +189,7 @@ onMounted(() => auth.refresh().catch(() => undefined))
|
||||
|
||||
<div v-if="!collapsed" class="phase-note">
|
||||
<span>第一阶段 · 核心可用版</span>
|
||||
<p>教学运行、选课与成绩管理已就绪</p>
|
||||
<p>教学运行、学籍与毕业审核已就绪</p>
|
||||
</div>
|
||||
</aside>
|
||||
|
||||
|
||||
@@ -80,6 +80,38 @@ const router = createRouter({
|
||||
component: () => import('../views/ExamsView.vue'),
|
||||
meta: { roles: ['SuperAdmin', 'AcademicAdmin', 'Teacher', 'Student'] },
|
||||
},
|
||||
{
|
||||
path: 'student-status-changes',
|
||||
name: 'student-status-changes',
|
||||
component: () => import('../views/StudentStatusChangesView.vue'),
|
||||
meta: {
|
||||
roles: ['SuperAdmin', 'AcademicAdmin', 'CollegeAdmin', 'Counselor', 'Student'],
|
||||
},
|
||||
},
|
||||
{
|
||||
path: 'graduation-audits',
|
||||
name: 'graduation-audits',
|
||||
component: () => import('../views/GraduationAuditsView.vue'),
|
||||
meta: {
|
||||
roles: ['SuperAdmin', 'AcademicAdmin', 'CollegeAdmin', 'Student'],
|
||||
},
|
||||
},
|
||||
{
|
||||
path: 'degree-awards',
|
||||
name: 'degree-awards',
|
||||
component: () => import('../views/DegreeAwardsView.vue'),
|
||||
meta: {
|
||||
roles: ['SuperAdmin', 'AcademicAdmin', 'CollegeAdmin', 'Student'],
|
||||
},
|
||||
},
|
||||
{
|
||||
path: 'graduation-clearance',
|
||||
name: 'graduation-clearance',
|
||||
component: () => import('../views/GraduationClearanceView.vue'),
|
||||
meta: {
|
||||
roles: ['SuperAdmin', 'AcademicAdmin', 'CollegeAdmin', 'Counselor', 'Student'],
|
||||
},
|
||||
},
|
||||
{
|
||||
path: 'users',
|
||||
name: 'users',
|
||||
|
||||
@@ -546,6 +546,221 @@ button { cursor: pointer; }
|
||||
.exam-ticket-grid p { margin:0; color:var(--muted); font-size:10px; }
|
||||
.exam-ticket-grid footer { grid-column:1/-1; padding:12px 17px; display:flex; align-items:center; gap:7px; border-top:1px dashed var(--line); color:#586275; font-size:10px; }
|
||||
|
||||
.status-identity {
|
||||
min-height: 130px; padding: 24px 28px; display: flex; align-items: center;
|
||||
justify-content: space-between; gap: 28px; color: white;
|
||||
background:
|
||||
linear-gradient(90deg, rgba(255,255,255,.04) 1px, transparent 1px),
|
||||
linear-gradient(135deg, #172858, #263e7c 65%, #176d70);
|
||||
background-size: 35px 35px, auto;
|
||||
}
|
||||
.status-identity span { color: #70ded0; font: 700 9px Consolas, monospace; letter-spacing: .14em; }
|
||||
.status-identity b { display: block; margin: 8px 0 6px; font: 600 27px "STZhongsong","Songti SC",serif; }
|
||||
.status-identity p { margin: 0; color: #c4cee6; font-size: 10px; }
|
||||
.status-available { min-width: 290px; padding: 17px 20px; border: 1px solid rgba(255,255,255,.15); }
|
||||
.status-available > span { display: block; margin-bottom: 11px; }
|
||||
.status-available strong { display: inline-block; margin-right: 7px; padding: 7px 12px; color: white; border: 1px solid rgba(112,222,208,.55); font-size: 11px; }
|
||||
.status-available em { color: #c4cee6; font-size: 10px; font-style: normal; }
|
||||
.status-review-summary { display: grid; grid-template-columns: repeat(3, 170px) 1fr; color: white; background: #182955; }
|
||||
.status-review-summary > div { min-height: 104px; padding: 20px 24px; border-right: 1px solid rgba(255,255,255,.12); }
|
||||
.status-review-summary span { display: block; color: #9eacd0; font-size: 9px; }
|
||||
.status-review-summary b { display: inline-block; margin-top: 12px; color: #65d7c8; font: 700 28px/1 Consolas, monospace; }
|
||||
.status-review-summary small { margin-left: 5px; color: #aeb9d6; font-size: 9px; }
|
||||
.status-review-summary p { margin: 0; padding: 24px 28px; align-self: center; color: #bdc7e0; font-size: 10px; line-height: 1.7; }
|
||||
.status-folio-list { display: grid; gap: 13px; min-height: 180px; }
|
||||
.status-folio-list > article { border: 1px solid var(--line); background: white; box-shadow: 0 5px 18px rgba(30,44,77,.035); }
|
||||
.status-folio-list > article.actionable { border-left: 3px solid var(--teal); }
|
||||
.status-folio-list article > header { min-height: 100px; display: grid; grid-template-columns: 150px 1fr auto; align-items: center; gap: 24px; padding: 18px 22px; border-bottom: 1px solid var(--line); }
|
||||
.folio-number { align-self: stretch; display: grid; place-content: center; padding-right: 22px; border-right: 1px dashed var(--line); }
|
||||
.folio-number span { color: var(--teal); font: 700 8px Consolas,monospace; letter-spacing: .12em; }
|
||||
.folio-number b { margin-top: 8px; color: var(--indigo); font: 700 16px Consolas,monospace; }
|
||||
.folio-person > span { color: var(--teal); font-size: 9px; }
|
||||
.folio-person h3 { margin: 7px 0 5px; font: 600 18px "STZhongsong","Songti SC",serif; }
|
||||
.folio-person p { margin: 0; color: var(--muted); font-size: 9px; }
|
||||
.folio-reason { padding: 17px 22px; display: grid; grid-template-columns: 125px 1fr; gap: 25px; border-bottom: 1px solid var(--line); }
|
||||
.folio-reason span { color: var(--muted); font-size: 9px; }
|
||||
.folio-reason p { margin: 0; color: #40495a; font-size: 11px; line-height: 1.7; }
|
||||
.approval-track { padding: 20px 22px; display: grid; grid-template-columns: repeat(3, 1fr); border-bottom: 1px solid var(--line); }
|
||||
.approval-track > div { min-height: 55px; display: grid; grid-template-columns: 36px 1fr; align-content: center; position: relative; }
|
||||
.approval-track > div:not(:last-child)::after { content:""; position:absolute; left:30px; right:8px; top:17px; height:1px; background:#d9dee7; }
|
||||
.approval-track i { width: 34px; height: 34px; display: grid; place-items: center; z-index:1; color:#8d95a4; border:1px solid #cfd5df; border-radius:50%; background:white; font:normal 700 10px Consolas,monospace; }
|
||||
.approval-track b, .approval-track small { grid-column: 2; padding-left: 8px; }
|
||||
.approval-track b { margin-top: -31px; font-size: 11px; }
|
||||
.approval-track small { margin-top: 4px; color: var(--muted); font-size: 8px; }
|
||||
.approval-track .done i { color:white; border-color:var(--teal); background:var(--teal); }
|
||||
.approval-track .done::after { background:var(--teal) !important; }
|
||||
.approval-track .active i { color:white; border-color:var(--indigo); background:var(--indigo); box-shadow:0 0 0 4px #e9edf7; }
|
||||
.approval-track .stopped i { color:white; border-color:#b44c4c; background:#b44c4c; }
|
||||
.status-folio-list article > footer { min-height: 65px; padding: 12px 22px; display:flex; align-items:center; justify-content:space-between; gap:18px; background:#fafbfc; }
|
||||
.review-comment span, .review-comment b { display:block; }
|
||||
.review-comment span { color:var(--muted); font-size:8px; }
|
||||
.review-comment b { margin-top:5px; color:#515a6c; font-size:10px; }
|
||||
.folio-actions { display:flex; gap:8px; }
|
||||
.folio-actions .el-button + .el-button { margin-left:0; }
|
||||
.review-target { margin-bottom: 18px; padding: 16px 18px; border-left: 3px solid var(--teal); background:#f5f7fa; }
|
||||
.review-target span { color:var(--teal); font:700 9px Consolas,monospace; }
|
||||
.review-target b { display:block; margin:6px 0 4px; font-size:14px; }
|
||||
.review-target p { margin:0; color:var(--muted); font-size:9px; }
|
||||
|
||||
.graduation-batch-strip { padding:10px; display:flex; gap:9px; overflow-x:auto; border:1px solid var(--line); background:white; }
|
||||
.graduation-batch-strip button { flex:0 0 290px; padding:14px; display:grid; grid-template-columns:1fr auto; gap:6px; text-align:left; border:1px solid var(--line); background:#fafbfc; }
|
||||
.graduation-batch-strip button.active { color:white; border-color:var(--indigo); background:var(--indigo); }
|
||||
.graduation-batch-strip b { grid-column:1/-1; font:600 15px "STZhongsong","Songti SC",serif; }
|
||||
.graduation-batch-strip span,.graduation-batch-strip small,.graduation-batch-strip i { color:#8b93a2; font-size:9px; font-style:normal; }
|
||||
.graduation-batch-strip button.active span,.graduation-batch-strip button.active small { color:#c5cee5; }
|
||||
.graduation-workbench { border:1px solid var(--line); background:white; }
|
||||
.graduation-workbench > header { padding:21px 24px; display:flex; align-items:center; justify-content:space-between; gap:20px; border-bottom:1px solid var(--line); }
|
||||
.graduation-workbench header span { color:var(--teal); font:700 9px Consolas,monospace; letter-spacing:.13em; }
|
||||
.graduation-workbench header h3 { margin:7px 0 5px; font:600 21px "STZhongsong","Songti SC",serif; }
|
||||
.graduation-workbench header p { margin:0; color:var(--muted); font-size:9px; }
|
||||
.graduation-summary { display:grid; grid-template-columns:repeat(4,1fr); color:white; background:linear-gradient(110deg,#172958,#273e7c 70%,#176c70); }
|
||||
.graduation-summary > div { min-height:82px; padding:17px 21px; border-right:1px solid rgba(255,255,255,.12); }
|
||||
.graduation-summary span { display:block; color:#aeb8d7; font-size:8px; }
|
||||
.graduation-summary b { display:inline-block; margin-top:10px; color:#66d9ca; font:700 24px/1 Consolas,monospace; }
|
||||
.graduation-summary small { margin-left:5px; color:#bfc8df; font-size:8px; }
|
||||
.graduation-filter { padding:13px 18px; display:flex; align-items:center; gap:9px; border-bottom:1px solid var(--line); background:#fafbfc; }
|
||||
.graduation-filter .el-input { width:300px; }
|
||||
.graduation-filter .el-select { width:155px; }
|
||||
.graduation-filter > span { margin-left:auto; color:var(--muted); font-size:9px; }
|
||||
.graduation-result-list { padding:0 20px 18px; }
|
||||
.graduation-result-list article { min-height:105px; display:grid; grid-template-columns:minmax(200px,1.2fr) 170px 185px 130px 70px; align-items:center; gap:20px; border-bottom:1px solid var(--line); }
|
||||
.graduation-student span { color:var(--teal); font-size:8px; }
|
||||
.graduation-student h4 { margin:6px 0 4px; font-size:14px; }
|
||||
.graduation-student p { margin:0; color:var(--muted); font-size:8px; }
|
||||
.credit-progress span,.course-clearance span { color:var(--muted); font-size:8px; }
|
||||
.credit-progress b,.course-clearance b { display:block; margin:7px 0; color:var(--indigo); font:700 15px Consolas,monospace; }
|
||||
.course-clearance { padding-left:17px; border-left:1px solid var(--line); }
|
||||
.course-clearance small { display:block; max-width:180px; color:#8e5960; font-size:8px; white-space:nowrap; overflow:hidden; text-overflow:ellipsis; }
|
||||
.graduation-conclusion { padding:12px; display:grid; grid-template-columns:24px 1fr; gap:2px 7px; color:#9a555b; border:1px solid #ead7d9; background:#fffafa; }
|
||||
.graduation-conclusion.eligible { color:#21796d; border-color:#cbe4df; background:#f6fbfa; }
|
||||
.graduation-conclusion .el-icon { grid-row:1/3; align-self:center; font-size:20px; }
|
||||
.graduation-conclusion span { font-size:9px; font-weight:700; }
|
||||
.graduation-conclusion small { font-size:7px; opacity:.7; }
|
||||
.graduation-certificate { overflow:hidden; border:1px solid var(--line); background:white; box-shadow:0 12px 35px rgba(24,41,85,.07); }
|
||||
.graduation-certificate > header { min-height:82px; padding:21px 28px; display:flex; align-items:center; justify-content:space-between; color:white; background:linear-gradient(110deg,#172958,#263e7c 70%,#176c70); }
|
||||
.graduation-certificate > header span { color:#73dfd1; font:700 10px Consolas,monospace; letter-spacing:.18em; }
|
||||
.graduation-certificate > header i { font:normal 700 28px "STZhongsong","Songti SC",serif; }
|
||||
.certificate-person { display:grid; grid-template-columns:repeat(3,1fr); border-bottom:1px solid var(--line); }
|
||||
.certificate-person > div { padding:20px 28px; border-right:1px solid var(--line); }
|
||||
.certificate-person span,.certificate-person b { display:block; }
|
||||
.certificate-person span { color:var(--muted); font-size:8px; }
|
||||
.certificate-person b { margin-top:7px; font-size:14px; }
|
||||
.certificate-conclusion { min-height:145px; padding:28px; display:flex; align-items:center; justify-content:center; gap:20px; color:#a14e55; background:#fffafa; border-bottom:1px solid var(--line); }
|
||||
.certificate-conclusion.eligible { color:#19796b; background:#f5fbf9; }
|
||||
.certificate-conclusion .el-icon { font-size:48px; }
|
||||
.certificate-conclusion span { font-size:9px; letter-spacing:.08em; }
|
||||
.certificate-conclusion h3 { margin:7px 0 5px; font:600 27px "STZhongsong","Songti SC",serif; }
|
||||
.certificate-conclusion p { margin:0; color:var(--muted); font-size:9px; }
|
||||
.certificate-metrics { display:grid; grid-template-columns:repeat(3,1fr); }
|
||||
.certificate-metrics > div { min-height:115px; padding:23px 28px; border-right:1px solid var(--line); }
|
||||
.certificate-metrics span { display:block; color:var(--muted); font-size:8px; }
|
||||
.certificate-metrics b { display:block; margin:10px 0; color:var(--indigo); font:700 22px Consolas,monospace; }
|
||||
.certificate-metrics p { margin:0; color:var(--muted); font-size:8px; }
|
||||
.graduation-certificate > footer { padding:20px 28px; display:grid; gap:13px; background:#fafbfc; }
|
||||
.graduation-certificate > footer span,.graduation-certificate > footer b { display:block; }
|
||||
.graduation-certificate > footer span { color:var(--muted); font-size:8px; }
|
||||
.graduation-certificate > footer b { margin-top:5px; font-size:10px; }
|
||||
|
||||
.degree-batch-strip { padding:10px; display:flex; gap:9px; overflow-x:auto; border:1px solid var(--line); background:white; }
|
||||
.degree-batch-strip button { flex:0 0 290px; padding:14px; display:grid; grid-template-columns:1fr auto; gap:6px; text-align:left; border:1px solid var(--line); background:#fafbfc; }
|
||||
.degree-batch-strip button.active { color:white; border-color:#8b692d; background:linear-gradient(120deg,#263968,#8b692d); }
|
||||
.degree-batch-strip b { grid-column:1/-1; font:600 15px "STZhongsong","Songti SC",serif; }
|
||||
.degree-batch-strip span,.degree-batch-strip small,.degree-batch-strip i { color:#8b93a2; font-size:9px; font-style:normal; }
|
||||
.degree-batch-strip button.active span,.degree-batch-strip button.active small { color:#e3d8bd; }
|
||||
.degree-workbench { border:1px solid var(--line); background:white; }
|
||||
.degree-workbench > header { padding:21px 24px; display:flex; align-items:center; justify-content:space-between; gap:20px; border-bottom:1px solid var(--line); }
|
||||
.degree-workbench header span { color:#a27b36; font:700 9px Consolas,monospace; letter-spacing:.13em; }
|
||||
.degree-workbench header h3 { margin:7px 0 5px; font:600 21px "STZhongsong","Songti SC",serif; }
|
||||
.degree-workbench header p { margin:0; color:var(--muted); font-size:9px; }
|
||||
.degree-summary { display:grid; grid-template-columns:repeat(4,1fr); color:white; background:linear-gradient(110deg,#182957,#2d4178 67%,#8b692d); }
|
||||
.degree-summary > div { min-height:82px; padding:17px 21px; border-right:1px solid rgba(255,255,255,.12); }
|
||||
.degree-summary span { display:block; color:#c3c9dc; font-size:8px; }
|
||||
.degree-summary b { display:block; margin-top:10px; color:#e5c87f; font:700 24px Consolas,monospace; }
|
||||
.degree-result-list { padding:0 20px 18px; }
|
||||
.degree-result-list article { min-height:105px; display:grid; grid-template-columns:minmax(190px,1.2fr) 150px minmax(180px,1fr) 125px 70px; align-items:center; gap:20px; border-bottom:1px solid var(--line); }
|
||||
.degree-result-list article > div:first-child span { color:#a27b36; font-size:8px; }
|
||||
.degree-result-list h4 { margin:6px 0 4px; font-size:14px; }
|
||||
.degree-result-list p { margin:0; color:var(--muted); font-size:8px; }
|
||||
.degree-result-list article > div:nth-child(2) span,.degree-rule-note span { color:var(--muted); font-size:8px; }
|
||||
.degree-result-list article > div:nth-child(2) b { display:block; margin:7px 0; color:var(--indigo); font:700 20px Consolas,monospace; }
|
||||
.degree-result-list article > div:nth-child(2) small { color:var(--muted); font-size:8px; }
|
||||
.degree-rule-note { padding-left:16px; border-left:1px solid var(--line); }
|
||||
.degree-rule-note b { display:block; margin-top:7px; color:#5f6879; font-size:9px; line-height:1.5; }
|
||||
.degree-result-chip { padding:11px; display:grid; grid-template-columns:22px 1fr; color:#9a555b; border:1px solid #ead7d9; background:#fffafa; }
|
||||
.degree-result-chip.granted { color:#7b622d; border-color:#dfd1aa; background:#fdfbf5; }
|
||||
.degree-result-chip .el-icon { grid-row:1/3; align-self:center; font-size:17px; }
|
||||
.degree-result-chip b { font-size:9px; }
|
||||
.degree-result-chip small { font-size:7px; opacity:.7; }
|
||||
.degree-certificate { min-height:380px; display:grid; grid-template-columns:220px 1fr; border:1px solid var(--line); background:white; box-shadow:0 12px 35px rgba(24,41,85,.07); }
|
||||
.degree-seal { display:grid; place-content:center; gap:16px; text-align:center; color:#c7a75d; background:linear-gradient(150deg,#172858,#2b3f76 70%,#80622b); }
|
||||
.degree-seal .el-icon { margin:auto; font-size:70px; }
|
||||
.degree-seal span { font:700 9px Consolas,monospace; letter-spacing:.17em; }
|
||||
.degree-copy { padding:45px 48px; }
|
||||
.degree-copy > span { color:#a27b36; font:700 9px Consolas,monospace; letter-spacing:.12em; }
|
||||
.degree-copy h3 { margin:15px 0 10px; color:#9c555b; font:600 34px "STZhongsong","Songti SC",serif; }
|
||||
.degree-certificate.granted .degree-copy h3 { color:#80652c; }
|
||||
.degree-copy > p { margin:0; color:#596274; font-size:12px; }
|
||||
.degree-copy dl { margin:32px 0; display:grid; grid-template-columns:repeat(3,1fr); border:1px solid var(--line); }
|
||||
.degree-copy dl div { padding:17px 20px; border-right:1px solid var(--line); }
|
||||
.degree-copy dt { color:var(--muted); font-size:8px; }
|
||||
.degree-copy dd { margin:7px 0 0; color:var(--indigo); font:700 16px Consolas,monospace; }
|
||||
.degree-copy footer { padding-top:18px; border-top:1px solid var(--line); }
|
||||
.degree-copy footer span,.degree-copy footer b { display:block; }
|
||||
.degree-copy footer span { color:var(--muted); font-size:8px; }
|
||||
.degree-copy footer b { margin-top:7px; font-size:10px; }
|
||||
|
||||
.clearance-batch-strip { padding:10px; display:flex; gap:9px; overflow-x:auto; border:1px solid var(--line); background:white; }
|
||||
.clearance-batch-strip button { flex:0 0 300px; padding:14px; display:grid; grid-template-columns:1fr auto; gap:6px; text-align:left; border:1px solid var(--line); background:#fafbfc; }
|
||||
.clearance-batch-strip button.active { color:white; border-color:var(--indigo); background:linear-gradient(120deg,#182958,#234477 66%,#19736f); }
|
||||
.clearance-batch-strip b { grid-column:1/-1; font:600 15px "STZhongsong","Songti SC",serif; }
|
||||
.clearance-batch-strip span,.clearance-batch-strip small,.clearance-batch-strip i { color:#8b93a2; font-size:9px; font-style:normal; }
|
||||
.clearance-batch-strip button.active span,.clearance-batch-strip button.active small { color:#c4d6dd; }
|
||||
.clearance-workbench { border:1px solid var(--line); background:white; }
|
||||
.clearance-workbench > header { padding:21px 24px; display:flex; align-items:center; justify-content:space-between; gap:20px; border-bottom:1px solid var(--line); }
|
||||
.clearance-workbench header span { color:var(--teal); font:700 9px Consolas,monospace; letter-spacing:.13em; }
|
||||
.clearance-workbench header h3 { margin:7px 0 5px; font:600 21px "STZhongsong","Songti SC",serif; }
|
||||
.clearance-workbench header p { margin:0; color:var(--muted); font-size:9px; }
|
||||
.clearance-item-legend { display:flex; overflow-x:auto; color:white; background:linear-gradient(105deg,#182958,#29417c 70%,#19736f); }
|
||||
.clearance-item-legend > div { flex:1 0 180px; min-height:80px; padding:16px 20px; border-right:1px solid rgba(255,255,255,.12); }
|
||||
.clearance-item-legend span,.clearance-item-legend b,.clearance-item-legend small { display:block; }
|
||||
.clearance-item-legend span { color:#64d7c8; font:700 8px Consolas,monospace; }
|
||||
.clearance-item-legend b { margin:7px 0 5px; font-size:10px; }
|
||||
.clearance-item-legend small { color:#bfc9e1; font-size:8px; }
|
||||
.clearance-ledgers { padding:18px; display:grid; gap:14px; background:#f5f7fa; }
|
||||
.clearance-ledgers > article { border:1px solid var(--line); background:white; }
|
||||
.clearance-ledgers article > header { padding:16px 20px; display:flex; align-items:center; justify-content:space-between; border-bottom:1px solid var(--line); }
|
||||
.clearance-ledgers header span { color:var(--teal); font-size:8px; }
|
||||
.clearance-ledgers header h4 { margin:5px 0 3px; font-size:14px; }
|
||||
.clearance-ledgers header p { margin:0; color:var(--muted); font-size:8px; }
|
||||
.clearance-ledgers header > b { color:var(--indigo); font:700 22px Consolas,monospace; }
|
||||
.clearance-record-grid { display:grid; grid-template-columns:repeat(auto-fit,minmax(190px,1fr)); }
|
||||
.clearance-record-grid > div { min-height:125px; padding:18px; display:grid; grid-template-columns:24px 1fr; align-content:start; border-right:1px solid var(--line); border-bottom:1px solid var(--line); }
|
||||
.clearance-record-grid .el-icon { grid-row:1/4; color:#bbc1cc; font-size:18px; }
|
||||
.clearance-record-grid > div.done .el-icon { color:var(--teal); }
|
||||
.clearance-record-grid span { color:var(--muted); font-size:8px; }
|
||||
.clearance-record-grid b { margin:6px 0 4px; font-size:10px; }
|
||||
.clearance-record-grid small { color:#a06a6e; font-size:8px; }
|
||||
.clearance-record-grid > div.done small { color:#318276; }
|
||||
.clearance-record-grid > div > div { grid-column:1/-1; margin-top:13px; }
|
||||
.clearance-record-grid .el-button + .el-button { margin-left:5px; }
|
||||
.clearance-pass { border:1px solid var(--line); background:white; }
|
||||
.clearance-pass > header { min-height:125px; padding:25px 28px; display:flex; align-items:center; justify-content:space-between; color:white; background:linear-gradient(115deg,#182958,#2a407c 68%,#19736f); }
|
||||
.clearance-pass header span { color:#67d9ca; font:700 9px Consolas,monospace; letter-spacing:.14em; }
|
||||
.clearance-pass header h3 { margin:9px 0 6px; font:600 24px "STZhongsong","Songti SC",serif; }
|
||||
.clearance-pass header p { margin:0; color:#c1cce3; font-size:9px; }
|
||||
.clearance-pass header > b { font:700 30px Consolas,monospace; }
|
||||
.clearance-student-list { padding:12px 26px 25px; }
|
||||
.clearance-student-list article { min-height:90px; display:grid; grid-template-columns:45px 1fr auto; align-items:center; gap:16px; position:relative; border-bottom:1px solid var(--line); }
|
||||
.clearance-student-list article:not(:last-child)::after { content:""; position:absolute; left:17px; top:62px; bottom:-29px; width:1px; background:#d8dde6; }
|
||||
.clearance-student-list i { width:35px; height:35px; display:grid; place-items:center; z-index:1; color:#8c94a3; border:1px solid #cfd5df; border-radius:50%; background:white; font:normal 700 10px Consolas,monospace; }
|
||||
.clearance-student-list article.done i { color:white; border-color:var(--teal); background:var(--teal); }
|
||||
.clearance-student-list article > div span { color:var(--teal); font-size:8px; }
|
||||
.clearance-student-list h4 { margin:5px 0 3px; font-size:12px; }
|
||||
.clearance-student-list p { margin:0; color:var(--muted); font-size:8px; }
|
||||
.clearance-form-head { margin:10px 0; display:flex; align-items:center; justify-content:space-between; }
|
||||
.clearance-form-list { display:grid; gap:8px; max-height:340px; overflow-y:auto; }
|
||||
.clearance-form-list > div { display:grid; grid-template-columns:110px 1fr 1fr 130px 80px 45px; gap:8px; align-items:center; }
|
||||
|
||||
.login-page { min-height: 100vh; display: grid; grid-template-columns: minmax(440px, 1.2fr) minmax(420px, .8fr); background: white; }
|
||||
.login-story { min-height: 100vh; padding: 54px clamp(45px, 6vw, 90px); display: flex; flex-direction: column; color: white; background: linear-gradient(142deg, #13224d, #243a77 62%, #176b71); overflow: hidden; position: relative; }
|
||||
.login-story::before { content: ""; position: absolute; inset: 0; opacity: .28; background-image: linear-gradient(rgba(255,255,255,.06) 1px, transparent 1px), linear-gradient(90deg, rgba(255,255,255,.06) 1px, transparent 1px); background-size: 46px 46px; }
|
||||
@@ -698,6 +913,48 @@ button { cursor: pointer; }
|
||||
.exam-staff { padding:10px 0 0; border-left:none; border-top:1px solid var(--line); }
|
||||
.exam-row-actions { grid-column:auto; padding:0; }
|
||||
.exam-ticket-grid { grid-template-columns:1fr; }
|
||||
.status-identity { align-items:flex-start; flex-direction:column; }
|
||||
.status-available { width:100%; min-width:0; }
|
||||
.status-review-summary { grid-template-columns:repeat(3,1fr); }
|
||||
.status-review-summary > div { min-height:86px; padding:16px; }
|
||||
.status-review-summary p { grid-column:1/-1; padding:16px; border-top:1px solid rgba(255,255,255,.12); }
|
||||
.status-folio-list article > header { grid-template-columns:1fr auto; gap:14px; }
|
||||
.folio-number { grid-column:1/-1; display:block; padding:0 0 12px; border-right:none; border-bottom:1px dashed var(--line); }
|
||||
.folio-number b { margin-left:10px; }
|
||||
.folio-reason { grid-template-columns:1fr; gap:7px; }
|
||||
.approval-track { grid-template-columns:1fr; gap:13px; }
|
||||
.approval-track > div:not(:last-child)::after { left:17px; right:auto; top:31px; bottom:-14px; width:1px; height:auto; }
|
||||
.status-folio-list article > footer { align-items:stretch; flex-direction:column; }
|
||||
.folio-actions, .folio-actions .el-button { width:100%; }
|
||||
.graduation-workbench > header { align-items:flex-start; flex-direction:column; }
|
||||
.graduation-summary { grid-template-columns:1fr 1fr; }
|
||||
.graduation-summary > div:nth-child(2) { border-right:none; }
|
||||
.graduation-filter { flex-wrap:wrap; }
|
||||
.graduation-filter .el-input { width:100%; }
|
||||
.graduation-filter .el-select { flex:1; width:auto; }
|
||||
.graduation-result-list article { padding:16px 0; grid-template-columns:1fr 1fr; gap:13px; }
|
||||
.graduation-student { grid-column:1/-1; }
|
||||
.graduation-result-list article > .el-button { justify-self:end; }
|
||||
.certificate-person,.certificate-metrics { grid-template-columns:1fr; }
|
||||
.certificate-person > div,.certificate-metrics > div { border-right:none; border-bottom:1px solid var(--line); }
|
||||
.certificate-conclusion { justify-content:flex-start; padding:24px 20px; }
|
||||
.degree-workbench > header { align-items:flex-start; flex-direction:column; }
|
||||
.degree-summary { grid-template-columns:1fr 1fr; }
|
||||
.degree-result-list article { padding:16px 0; grid-template-columns:1fr 1fr; gap:13px; }
|
||||
.degree-result-list article > div:first-child { grid-column:1/-1; }
|
||||
.degree-rule-note { padding-left:0; border-left:none; }
|
||||
.degree-result-list article > .el-button { justify-self:end; }
|
||||
.degree-certificate { grid-template-columns:1fr; }
|
||||
.degree-seal { min-height:150px; }
|
||||
.degree-seal .el-icon { font-size:48px; }
|
||||
.degree-copy { padding:28px 22px; }
|
||||
.degree-copy dl { grid-template-columns:1fr; }
|
||||
.degree-copy dl div { border-right:none; border-bottom:1px solid var(--line); }
|
||||
.clearance-workbench > header { align-items:flex-start; flex-direction:column; }
|
||||
.clearance-ledgers { padding:10px; }
|
||||
.clearance-record-grid { grid-template-columns:1fr; }
|
||||
.clearance-pass > header { align-items:flex-start; gap:18px; }
|
||||
.clearance-form-list > div { grid-template-columns:1fr 1fr; padding:10px; border:1px solid var(--line); }
|
||||
.el-drawer { width: 100% !important; }
|
||||
}
|
||||
|
||||
|
||||
@@ -122,13 +122,33 @@ onMounted(async () => {
|
||||
<b>{{ data.counts.examPlans ?? 0 }} 个计划 · {{ data.counts.examSessions ?? 0 }} 个场次</b>
|
||||
<i class="done">已建立</i>
|
||||
</div>
|
||||
<div>
|
||||
<span>学籍异动</span>
|
||||
<b>{{ data.counts.studentStatusChanges ?? 0 }} 项申请 · {{ data.counts.pendingStudentStatusChanges ?? 0 }} 项审核中</b>
|
||||
<i class="done">已建立</i>
|
||||
</div>
|
||||
<div>
|
||||
<span>毕业审核</span>
|
||||
<b>{{ data.counts.graduationAuditBatches ?? 0 }} 个批次 · {{ data.counts.publishedGraduationAuditBatches ?? 0 }} 个已发布</b>
|
||||
<i class="done">已建立</i>
|
||||
</div>
|
||||
<div>
|
||||
<span>学位授予</span>
|
||||
<b>{{ data.counts.degreeAwardBatches ?? 0 }} 个批次 · {{ data.counts.publishedDegreeAwardBatches ?? 0 }} 个已发布</b>
|
||||
<i class="done">已建立</i>
|
||||
</div>
|
||||
<div>
|
||||
<span>毕业离校</span>
|
||||
<b>{{ data.counts.graduationClearanceBatches ?? 0 }} 个批次 · {{ data.counts.openGraduationClearanceBatches ?? 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>
|
||||
@@ -137,6 +157,10 @@ onMounted(async () => {
|
||||
<span class="active">学生选课</span>
|
||||
<span class="active">成绩管理</span>
|
||||
<span class="active">考试考场</span>
|
||||
<span class="active">学籍异动</span>
|
||||
<span class="active">毕业审核</span>
|
||||
<span class="active">学位授予</span>
|
||||
<span class="active">毕业离校</span>
|
||||
</div>
|
||||
</article>
|
||||
</section>
|
||||
|
||||
@@ -0,0 +1,201 @@
|
||||
<script setup lang="ts">
|
||||
import { computed, onMounted, reactive, ref } from 'vue'
|
||||
import { Check, Close, Medal, Plus, Refresh, Stamp } from '@element-plus/icons-vue'
|
||||
import http, { apiErrorMessage } from '../api/http'
|
||||
import { useAuthStore } from '../stores/auth'
|
||||
|
||||
const auth = useAuthStore()
|
||||
const isStudent = computed(() => auth.user?.roles.includes('Student') ?? false)
|
||||
const isPublisher = computed(() =>
|
||||
auth.user?.roles.some((role) => ['SuperAdmin', 'AcademicAdmin'].includes(role)) ?? false)
|
||||
const loading = ref(false)
|
||||
const batches = ref<any[]>([])
|
||||
const selected = ref<any | null>(null)
|
||||
const myResult = ref<any | null>(null)
|
||||
const createDialog = ref(false)
|
||||
const reviewDialog = ref(false)
|
||||
const reviewTarget = ref<any | null>(null)
|
||||
const keyword = ref('')
|
||||
const conclusionFilter = ref('')
|
||||
const batchForm = reactive({
|
||||
name: '2030届学士学位授予审核',
|
||||
graduationYear: 2030,
|
||||
degreeName: '工学学士',
|
||||
minimumGradePoint: 2,
|
||||
notes: '',
|
||||
})
|
||||
const reviewForm = reactive({ conclusion: 'NotGranted', comment: '' })
|
||||
const conclusionLabels: Record<string, string> = {
|
||||
Granted: '建议授予',
|
||||
NotGranted: '暂不授予',
|
||||
}
|
||||
const filteredResults = computed(() => {
|
||||
const q = keyword.value.trim().toLowerCase()
|
||||
return (selected.value?.results ?? []).filter((x: any) =>
|
||||
(!conclusionFilter.value || x.conclusion === conclusionFilter.value) &&
|
||||
(!q || `${x.studentNumber}${x.name}${x.className}${x.majorName}`.toLowerCase().includes(q)))
|
||||
})
|
||||
function dateText(value?: string) {
|
||||
if (!value) return '—'
|
||||
return new Intl.DateTimeFormat('zh-CN', {
|
||||
year: 'numeric', month: '2-digit', day: '2-digit',
|
||||
hour: '2-digit', minute: '2-digit', hour12: false,
|
||||
}).format(new Date(value))
|
||||
}
|
||||
async function load() {
|
||||
loading.value = true
|
||||
try {
|
||||
if (isStudent.value) {
|
||||
myResult.value = (await http.get('/degree-awards/my-result')).data
|
||||
return
|
||||
}
|
||||
batches.value = (await http.get('/degree-awards/batches')).data
|
||||
const batch = batches.value.find((x) => x.id === selected.value?.id) ?? batches.value[0]
|
||||
if (batch) await selectBatch(batch.id)
|
||||
else selected.value = null
|
||||
} catch (error) {
|
||||
ElMessage.error(apiErrorMessage(error))
|
||||
} finally {
|
||||
loading.value = false
|
||||
}
|
||||
}
|
||||
async function selectBatch(id: string) {
|
||||
selected.value = (await http.get(`/degree-awards/batches/${id}`)).data
|
||||
}
|
||||
async function createBatch() {
|
||||
try {
|
||||
const response = await http.post('/degree-awards/batches', batchForm)
|
||||
createDialog.value = false
|
||||
await http.post(`/degree-awards/batches/${response.data.id}/calculate`)
|
||||
ElMessage.success('授予批次已建立，并完成首次规则计算。')
|
||||
await load()
|
||||
} catch (error) {
|
||||
ElMessage.error(apiErrorMessage(error))
|
||||
}
|
||||
}
|
||||
async function calculate() {
|
||||
try {
|
||||
await ElMessageBox.confirm('重新计算会覆盖当前人工复核结论。', '重新计算学位资格', {
|
||||
type: 'warning', confirmButtonText: '重新计算',
|
||||
})
|
||||
await http.post(`/degree-awards/batches/${selected.value.id}/calculate`)
|
||||
await load()
|
||||
} catch (error: any) {
|
||||
if (error !== 'cancel' && error !== 'close') ElMessage.error(apiErrorMessage(error))
|
||||
}
|
||||
}
|
||||
function openReview(row: any) {
|
||||
reviewTarget.value = row
|
||||
reviewForm.conclusion = row.conclusion
|
||||
reviewForm.comment = row.reviewComment ?? ''
|
||||
reviewDialog.value = true
|
||||
}
|
||||
async function saveReview() {
|
||||
if (reviewForm.comment.trim().length < 5) {
|
||||
ElMessage.warning('复核意见至少填写 5 个字。')
|
||||
return
|
||||
}
|
||||
try {
|
||||
await http.put(`/degree-awards/results/${reviewTarget.value.id}`, reviewForm)
|
||||
reviewDialog.value = false
|
||||
ElMessage.success('学位复核结论已保存。')
|
||||
await selectBatch(selected.value.id)
|
||||
} catch (error) {
|
||||
ElMessage.error(apiErrorMessage(error))
|
||||
}
|
||||
}
|
||||
async function publish() {
|
||||
try {
|
||||
await ElMessageBox.confirm('发布后授予结论将锁定并开放学生查询。', '发布学位授予结果', {
|
||||
type: 'warning', confirmButtonText: '确认发布',
|
||||
})
|
||||
await http.post(`/degree-awards/batches/${selected.value.id}/publish`)
|
||||
await load()
|
||||
ElMessage.success('学位授予结果已发布。')
|
||||
} catch (error: any) {
|
||||
if (error !== 'cancel' && error !== 'close') ElMessage.error(apiErrorMessage(error))
|
||||
}
|
||||
}
|
||||
|
||||
onMounted(load)
|
||||
</script>
|
||||
|
||||
<template>
|
||||
<div class="page-stack degree-page">
|
||||
<section class="page-intro">
|
||||
<div>
|
||||
<span class="section-kicker">DEGREE CONFERRAL</span>
|
||||
<h2>{{ isStudent ? '我的学位授予结果' : '学位授予审核' }}</h2>
|
||||
<p>{{ isStudent ? '查看学校正式发布的学位授予结论。' : '以已发布毕业资格为前置条件，结合正式成绩加权平均绩点生成授予建议。' }}</p>
|
||||
</div>
|
||||
<el-button v-if="isPublisher && !isStudent" type="primary" :icon="Plus" @click="createDialog = true">新建授予批次</el-button>
|
||||
<el-button v-else :icon="Refresh" @click="load">刷新</el-button>
|
||||
</section>
|
||||
|
||||
<template v-if="isStudent">
|
||||
<section v-if="myResult" class="degree-certificate" :class="{ granted: myResult.conclusion === 'Granted' }" v-loading="loading">
|
||||
<div class="degree-seal"><el-icon><Medal /></el-icon><span>DEGREE CONFERRAL</span></div>
|
||||
<div class="degree-copy">
|
||||
<span>{{ myResult.graduationYear }}届 · {{ myResult.batchName }}</span>
|
||||
<h3>{{ conclusionLabels[myResult.conclusion] }}</h3>
|
||||
<p>{{ myResult.name }}（{{ myResult.studentNumber }}），{{ myResult.majorName }}</p>
|
||||
<dl><div><dt>学位名称</dt><dd>{{ myResult.degreeName }}</dd></div><div><dt>平均绩点</dt><dd>{{ myResult.averageGradePoint }}</dd></div><div><dt>最低要求</dt><dd>{{ myResult.minimumGradePoint }}</dd></div></dl>
|
||||
<footer><span>发布于 {{ dateText(myResult.publishedAt) }}</span><b>{{ myResult.reviewComment || myResult.exceptionReason || '符合批次授予规则' }}</b></footer>
|
||||
</div>
|
||||
</section>
|
||||
<el-empty v-else v-loading="loading" description="学校尚未发布你的学位授予结果" />
|
||||
</template>
|
||||
|
||||
<template v-else>
|
||||
<section class="degree-batch-strip">
|
||||
<button v-for="batch in batches" :key="batch.id" :class="{ active: selected?.id === batch.id }" @click="selectBatch(batch.id)">
|
||||
<span>{{ batch.graduationYear }}届 · {{ batch.degreeName }}</span><b>{{ batch.name }}</b>
|
||||
<small>{{ batch.resultCount }} 人 · {{ batch.grantedCount }} 人建议授予</small><i>{{ batch.status === 'Published' ? '已发布' : '审核中' }}</i>
|
||||
</button>
|
||||
</section>
|
||||
<section v-if="selected" class="degree-workbench" v-loading="loading">
|
||||
<header>
|
||||
<div><span>CONFERRAL REGISTER</span><h3>{{ selected.name }}</h3><p>{{ selected.degreeName }} · 最低平均绩点 {{ selected.minimumGradePoint }} · 计算于 {{ dateText(selected.calculatedAt) }}</p></div>
|
||||
<div v-if="selected.status === 'Draft' && isPublisher"><el-button :icon="Refresh" @click="calculate">重新计算</el-button><el-button type="primary" :icon="Stamp" @click="publish">发布结果</el-button></div>
|
||||
<el-tag v-else type="success" effect="plain">授予结果已锁定</el-tag>
|
||||
</header>
|
||||
<div class="degree-summary">
|
||||
<div><span>参审人数</span><b>{{ selected.results.length }}</b></div>
|
||||
<div><span>建议授予</span><b>{{ selected.results.filter((x: any) => x.conclusion === 'Granted').length }}</b></div>
|
||||
<div><span>暂不授予</span><b>{{ selected.results.filter((x: any) => x.conclusion === 'NotGranted').length }}</b></div>
|
||||
<div><span>人工调整</span><b>{{ selected.results.filter((x: any) => x.isOverridden).length }}</b></div>
|
||||
</div>
|
||||
<div class="graduation-filter">
|
||||
<el-input v-model="keyword" clearable placeholder="搜索学号、姓名、专业或班级" />
|
||||
<el-select v-model="conclusionFilter" clearable placeholder="全部结论"><el-option label="建议授予" value="Granted" /><el-option label="暂不授予" value="NotGranted" /></el-select>
|
||||
<span>显示 {{ filteredResults.length }} 条</span>
|
||||
</div>
|
||||
<div class="degree-result-list">
|
||||
<article v-for="row in filteredResults" :key="row.id">
|
||||
<div><span>{{ row.studentNumber }} · {{ row.className }}</span><h4>{{ row.name }}</h4><p>{{ row.majorName }}</p></div>
|
||||
<div><span>加权平均绩点</span><b>{{ row.averageGradePoint }}</b><small>批次要求 ≥ {{ selected.minimumGradePoint }}</small></div>
|
||||
<div class="degree-rule-note"><span>规则说明</span><b>{{ row.exceptionReason || '毕业资格与绩点均符合' }}</b></div>
|
||||
<div class="degree-result-chip" :class="{ granted: row.conclusion === 'Granted' }"><el-icon><Check v-if="row.conclusion === 'Granted'" /><Close v-else /></el-icon><b>{{ conclusionLabels[row.conclusion] }}</b><small>{{ row.isOverridden ? '人工复核' : '规则计算' }}</small></div>
|
||||
<el-button v-if="selected.status === 'Draft'" link type="primary" @click="openReview(row)">人工复核</el-button>
|
||||
</article>
|
||||
<el-empty v-if="!filteredResults.length" description="没有符合筛选条件的授予记录" />
|
||||
</div>
|
||||
</section>
|
||||
<el-empty v-else v-loading="loading" description="尚未建立学位授予批次" />
|
||||
</template>
|
||||
|
||||
<el-dialog v-model="createDialog" title="新建学位授予批次" width="640px">
|
||||
<el-form label-position="top">
|
||||
<el-form-item label="批次名称"><el-input v-model="batchForm.name" /></el-form-item>
|
||||
<div class="form-grid three"><el-form-item label="毕业年份"><el-input-number v-model="batchForm.graduationYear" :min="2000" :max="2200" /></el-form-item><el-form-item label="学位名称"><el-input v-model="batchForm.degreeName" /></el-form-item><el-form-item label="最低平均绩点"><el-input-number v-model="batchForm.minimumGradePoint" :min="0" :max="5" :step="0.1" /></el-form-item></div>
|
||||
<el-form-item label="说明"><el-input v-model="batchForm.notes" type="textarea" :rows="3" /></el-form-item>
|
||||
</el-form>
|
||||
<template #footer><el-button @click="createDialog=false">取消</el-button><el-button type="primary" @click="createBatch">建立并计算</el-button></template>
|
||||
</el-dialog>
|
||||
<el-dialog v-model="reviewDialog" title="人工复核学位授予结论" width="620px">
|
||||
<div v-if="reviewTarget" class="review-target"><span>{{ reviewTarget.studentNumber }}</span><b>{{ reviewTarget.name }} · 平均绩点 {{ reviewTarget.averageGradePoint }}</b><p>规则结论：{{ conclusionLabels[reviewTarget.calculatedConclusion] }}</p></div>
|
||||
<el-form label-position="top"><el-form-item label="复核结论"><el-radio-group v-model="reviewForm.conclusion"><el-radio-button value="Granted">建议授予</el-radio-button><el-radio-button value="NotGranted">暂不授予</el-radio-button></el-radio-group></el-form-item><el-form-item label="复核意见"><el-input v-model="reviewForm.comment" type="textarea" :rows="4" maxlength="500" show-word-limit /></el-form-item></el-form>
|
||||
<template #footer><el-button @click="reviewDialog=false">取消</el-button><el-button type="primary" @click="saveReview">保存复核结论</el-button></template>
|
||||
</el-dialog>
|
||||
</div>
|
||||
</template>
|
||||
@@ -0,0 +1,248 @@
|
||||
<script setup lang="ts">
|
||||
import { computed, onMounted, reactive, ref } from 'vue'
|
||||
import { Check, DocumentChecked, Plus, Refresh, Stamp } from '@element-plus/icons-vue'
|
||||
import http, { apiErrorMessage } from '../api/http'
|
||||
import { useAuthStore } from '../stores/auth'
|
||||
|
||||
const auth = useAuthStore()
|
||||
const isStudent = computed(() => auth.user?.roles.includes('Student') ?? false)
|
||||
const isPublisher = computed(() =>
|
||||
auth.user?.roles.some((role) => ['SuperAdmin', 'AcademicAdmin'].includes(role)) ?? false)
|
||||
const batches = ref<any[]>([])
|
||||
const selected = ref<any | null>(null)
|
||||
const myResult = ref<any | null>(null)
|
||||
const loading = ref(false)
|
||||
const createDialog = ref(false)
|
||||
const decisionDialog = ref(false)
|
||||
const decisionTarget = ref<any | null>(null)
|
||||
const keyword = ref('')
|
||||
const conclusionFilter = ref('')
|
||||
const batchForm = reactive({
|
||||
name: '2030届本科生毕业资格审核',
|
||||
graduationYear: 2030,
|
||||
enrollmentYear: 2026,
|
||||
notes: '',
|
||||
})
|
||||
const decisionForm = reactive({ conclusion: 'Ineligible', comment: '' })
|
||||
const statusLabels: Record<string, string> = { Draft: '审核中', Published: '已发布' }
|
||||
const conclusionLabels: Record<string, string> = { Eligible: '符合毕业条件', Ineligible: '暂不符合' }
|
||||
const filteredResults = computed(() => {
|
||||
const q = keyword.value.trim().toLowerCase()
|
||||
return (selected.value?.results ?? []).filter((x: any) =>
|
||||
(!conclusionFilter.value || x.conclusion === conclusionFilter.value) &&
|
||||
(!q || `${x.studentNumber}${x.name}${x.className}${x.majorName}`.toLowerCase().includes(q)))
|
||||
})
|
||||
|
||||
function percent(earned: number, required: number) {
|
||||
if (!required) return 0
|
||||
return Math.min(100, Math.round((earned / required) * 100))
|
||||
}
|
||||
function dateText(value?: string) {
|
||||
if (!value) return '—'
|
||||
return new Intl.DateTimeFormat('zh-CN', {
|
||||
year: 'numeric', month: '2-digit', day: '2-digit',
|
||||
hour: '2-digit', minute: '2-digit', hour12: false,
|
||||
}).format(new Date(value))
|
||||
}
|
||||
async function load() {
|
||||
loading.value = true
|
||||
try {
|
||||
if (isStudent.value) {
|
||||
myResult.value = (await http.get('/graduation-audits/my-result')).data
|
||||
return
|
||||
}
|
||||
batches.value = (await http.get('/graduation-audits/batches')).data
|
||||
const batch = batches.value.find((x) => x.id === selected.value?.id) ?? batches.value[0]
|
||||
if (batch) await selectBatch(batch.id)
|
||||
else selected.value = null
|
||||
} catch (error) {
|
||||
ElMessage.error(apiErrorMessage(error))
|
||||
} finally {
|
||||
loading.value = false
|
||||
}
|
||||
}
|
||||
async function selectBatch(id: string) {
|
||||
selected.value = (await http.get(`/graduation-audits/batches/${id}`)).data
|
||||
}
|
||||
async function createBatch() {
|
||||
if (!batchForm.name.trim()) return
|
||||
try {
|
||||
const response = await http.post('/graduation-audits/batches', batchForm)
|
||||
createDialog.value = false
|
||||
await http.post(`/graduation-audits/batches/${response.data.id}/calculate`)
|
||||
ElMessage.success('审核批次已建立，并完成首次资格计算。')
|
||||
await load()
|
||||
} catch (error) {
|
||||
ElMessage.error(apiErrorMessage(error))
|
||||
}
|
||||
}
|
||||
async function calculate() {
|
||||
try {
|
||||
await ElMessageBox.confirm('重新计算会覆盖当前人工调整结果，是否继续？', '重新计算资格', {
|
||||
type: 'warning', confirmButtonText: '重新计算',
|
||||
})
|
||||
await http.post(`/graduation-audits/batches/${selected.value.id}/calculate`)
|
||||
ElMessage.success('已按最新培养方案与发布成绩重新计算。')
|
||||
await load()
|
||||
} catch (error: any) {
|
||||
if (error !== 'cancel' && error !== 'close') ElMessage.error(apiErrorMessage(error))
|
||||
}
|
||||
}
|
||||
function openDecision(row: any) {
|
||||
decisionTarget.value = row
|
||||
decisionForm.conclusion = row.conclusion
|
||||
decisionForm.comment = row.reviewComment ?? ''
|
||||
decisionDialog.value = true
|
||||
}
|
||||
async function saveDecision() {
|
||||
if (decisionForm.comment.trim().length < 5) {
|
||||
ElMessage.warning('人工复核意见至少填写 5 个字。')
|
||||
return
|
||||
}
|
||||
try {
|
||||
await http.put(`/graduation-audits/results/${decisionTarget.value.id}`, decisionForm)
|
||||
decisionDialog.value = false
|
||||
ElMessage.success('人工复核结论已保存。')
|
||||
await selectBatch(selected.value.id)
|
||||
} catch (error) {
|
||||
ElMessage.error(apiErrorMessage(error))
|
||||
}
|
||||
}
|
||||
async function publish() {
|
||||
try {
|
||||
await ElMessageBox.confirm(
|
||||
'发布后结果不可修改；符合条件的在籍学生将同步为“毕业”状态。',
|
||||
'发布毕业审核结果',
|
||||
{ type: 'warning', confirmButtonText: '确认发布' },
|
||||
)
|
||||
await http.post(`/graduation-audits/batches/${selected.value.id}/publish`)
|
||||
ElMessage.success('毕业审核结果已正式发布。')
|
||||
await load()
|
||||
} catch (error: any) {
|
||||
if (error !== 'cancel' && error !== 'close') ElMessage.error(apiErrorMessage(error))
|
||||
}
|
||||
}
|
||||
|
||||
onMounted(load)
|
||||
</script>
|
||||
|
||||
<template>
|
||||
<div class="page-stack graduation-page">
|
||||
<section class="page-intro">
|
||||
<div>
|
||||
<span class="section-kicker">DEGREE CLEARANCE</span>
|
||||
<h2>{{ isStudent ? '我的毕业资格' : '毕业资格审核' }}</h2>
|
||||
<p>{{ isStudent ? '查看学校正式发布的毕业资格审核结论和未完成项目。' : '以培养方案和已发布成绩为依据批量计算，支持人工复核并形成不可变发布结果。' }}</p>
|
||||
</div>
|
||||
<el-button v-if="isPublisher && !isStudent" type="primary" :icon="Plus" @click="createDialog = true">新建审核批次</el-button>
|
||||
<el-button v-else :icon="Refresh" @click="load">刷新</el-button>
|
||||
</section>
|
||||
|
||||
<template v-if="isStudent">
|
||||
<section v-if="myResult" class="graduation-certificate" v-loading="loading">
|
||||
<header>
|
||||
<span>OFFICIAL DEGREE CLEARANCE</span>
|
||||
<i>{{ myResult.graduationYear }}</i>
|
||||
</header>
|
||||
<div class="certificate-person">
|
||||
<div><span>学生姓名</span><b>{{ myResult.name }}</b></div>
|
||||
<div><span>学号</span><b>{{ myResult.studentNumber }}</b></div>
|
||||
<div><span>专业</span><b>{{ myResult.majorName }}</b></div>
|
||||
</div>
|
||||
<div class="certificate-conclusion" :class="{ eligible: myResult.conclusion === 'Eligible' }">
|
||||
<el-icon><DocumentChecked /></el-icon>
|
||||
<div><span>毕业资格审核结论</span><h3>{{ conclusionLabels[myResult.conclusion] }}</h3><p>{{ myResult.batchName }} · 发布于 {{ dateText(myResult.publishedAt) }}</p></div>
|
||||
</div>
|
||||
<div class="certificate-metrics">
|
||||
<div><span>学分完成</span><b>{{ myResult.earnedCredits }} / {{ myResult.requiredCredits }}</b><el-progress :percentage="percent(myResult.earnedCredits, myResult.requiredCredits)" :show-text="false" /></div>
|
||||
<div><span>必修课程</span><b>{{ myResult.passedRequiredCourseCount }} / {{ myResult.requiredCourseCount }}</b><p>已通过 / 应通过</p></div>
|
||||
<div><span>未解决不及格</span><b>{{ myResult.failedCourseCount }}</b><p>门课程</p></div>
|
||||
</div>
|
||||
<footer>
|
||||
<div><span>未完成课程</span><b>{{ myResult.missingCourseNames || '无' }}</b></div>
|
||||
<div v-if="myResult.reviewComment"><span>复核意见</span><b>{{ myResult.reviewComment }}</b></div>
|
||||
</footer>
|
||||
</section>
|
||||
<el-empty v-else v-loading="loading" description="学校尚未发布你的毕业资格审核结果" />
|
||||
</template>
|
||||
|
||||
<template v-else>
|
||||
<section class="graduation-batch-strip">
|
||||
<button v-for="batch in batches" :key="batch.id" :class="{ active: selected?.id === batch.id }" @click="selectBatch(batch.id)">
|
||||
<span>{{ batch.graduationYear }}届 · {{ batch.enrollmentYear }}级</span>
|
||||
<b>{{ batch.name }}</b>
|
||||
<small>{{ batch.resultCount }} 人 · {{ batch.eligibleCount }} 人符合</small>
|
||||
<i>{{ statusLabels[batch.status] }}</i>
|
||||
</button>
|
||||
</section>
|
||||
|
||||
<section v-if="selected" class="graduation-workbench" v-loading="loading">
|
||||
<header>
|
||||
<div><span>AUDIT REGISTER</span><h3>{{ selected.name }}</h3><p>计算时间 {{ dateText(selected.calculatedAt) }} · 规则基于已发布培养方案与成绩</p></div>
|
||||
<div v-if="selected.status === 'Draft' && isPublisher">
|
||||
<el-button :icon="Refresh" @click="calculate">重新计算</el-button>
|
||||
<el-button type="primary" :icon="Stamp" @click="publish">发布结果</el-button>
|
||||
</div>
|
||||
<el-tag v-else type="success" effect="plain">结果已锁定</el-tag>
|
||||
</header>
|
||||
|
||||
<div class="graduation-summary">
|
||||
<div><span>参审学生</span><b>{{ selected.results.length }}</b><small>人</small></div>
|
||||
<div><span>符合条件</span><b>{{ selected.results.filter((x: any) => x.conclusion === 'Eligible').length }}</b><small>人</small></div>
|
||||
<div><span>暂不符合</span><b>{{ selected.results.filter((x: any) => x.conclusion === 'Ineligible').length }}</b><small>人</small></div>
|
||||
<div><span>人工调整</span><b>{{ selected.results.filter((x: any) => x.isOverridden).length }}</b><small>人</small></div>
|
||||
</div>
|
||||
|
||||
<div class="graduation-filter">
|
||||
<el-input v-model="keyword" clearable placeholder="搜索学号、姓名、专业或班级" />
|
||||
<el-select v-model="conclusionFilter" clearable placeholder="全部结论">
|
||||
<el-option label="符合毕业条件" value="Eligible" />
|
||||
<el-option label="暂不符合" value="Ineligible" />
|
||||
</el-select>
|
||||
<span>显示 {{ filteredResults.length }} 条</span>
|
||||
</div>
|
||||
|
||||
<div class="graduation-result-list">
|
||||
<article v-for="row in filteredResults" :key="row.id">
|
||||
<div class="graduation-student"><span>{{ row.studentNumber }} · {{ row.className }}</span><h4>{{ row.name }}</h4><p>{{ row.majorName }} · {{ row.planName || '未匹配培养方案' }}</p></div>
|
||||
<div class="credit-progress"><span>学分完成度</span><b>{{ row.earnedCredits }} / {{ row.requiredCredits }}</b><el-progress :percentage="percent(row.earnedCredits, row.requiredCredits)" :show-text="false" /></div>
|
||||
<div class="course-clearance"><span>必修通过</span><b>{{ row.passedRequiredCourseCount }} / {{ row.requiredCourseCount }}</b><small v-if="row.missingCourseNames">缺：{{ row.missingCourseNames }}</small><small v-else>必修项目已完成</small></div>
|
||||
<div class="graduation-conclusion" :class="{ eligible: row.conclusion === 'Eligible' }"><el-icon><Check /></el-icon><span>{{ conclusionLabels[row.conclusion] }}</span><small v-if="row.isOverridden">人工复核</small><small v-else>规则计算</small></div>
|
||||
<el-button v-if="selected.status === 'Draft'" link type="primary" @click="openDecision(row)">人工复核</el-button>
|
||||
</article>
|
||||
<el-empty v-if="!filteredResults.length" description="没有符合筛选条件的审核结果" />
|
||||
</div>
|
||||
</section>
|
||||
<el-empty v-else v-loading="loading" description="尚未建立毕业资格审核批次" />
|
||||
</template>
|
||||
|
||||
<el-dialog v-model="createDialog" title="新建毕业资格审核批次" width="620px">
|
||||
<el-form label-position="top">
|
||||
<el-form-item label="批次名称"><el-input v-model="batchForm.name" /></el-form-item>
|
||||
<div class="form-grid">
|
||||
<el-form-item label="毕业年份"><el-input-number v-model="batchForm.graduationYear" :min="2000" :max="2200" /></el-form-item>
|
||||
<el-form-item label="目标入学年级"><el-input-number v-model="batchForm.enrollmentYear" :min="2000" :max="2200" /></el-form-item>
|
||||
</div>
|
||||
<el-form-item label="说明"><el-input v-model="batchForm.notes" type="textarea" :rows="3" /></el-form-item>
|
||||
</el-form>
|
||||
<template #footer><el-button @click="createDialog = false">取消</el-button><el-button type="primary" @click="createBatch">建立并计算</el-button></template>
|
||||
</el-dialog>
|
||||
|
||||
<el-dialog v-model="decisionDialog" title="人工复核毕业资格" width="620px">
|
||||
<div v-if="decisionTarget" class="review-target">
|
||||
<span>{{ decisionTarget.studentNumber }}</span><b>{{ decisionTarget.name }} · {{ decisionTarget.majorName }}</b>
|
||||
<p>规则结论：{{ conclusionLabels[decisionTarget.calculatedConclusion] }} · 学分 {{ decisionTarget.earnedCredits }} / {{ decisionTarget.requiredCredits }}</p>
|
||||
</div>
|
||||
<el-form label-position="top">
|
||||
<el-form-item label="复核结论">
|
||||
<el-radio-group v-model="decisionForm.conclusion">
|
||||
<el-radio-button value="Eligible">符合毕业条件</el-radio-button>
|
||||
<el-radio-button value="Ineligible">暂不符合</el-radio-button>
|
||||
</el-radio-group>
|
||||
</el-form-item>
|
||||
<el-form-item label="复核意见"><el-input v-model="decisionForm.comment" type="textarea" :rows="4" maxlength="500" show-word-limit /></el-form-item>
|
||||
</el-form>
|
||||
<template #footer><el-button @click="decisionDialog = false">取消</el-button><el-button type="primary" @click="saveDecision">保存复核结论</el-button></template>
|
||||
</el-dialog>
|
||||
</div>
|
||||
</template>
|
||||
@@ -0,0 +1,252 @@
|
||||
<script setup lang="ts">
|
||||
import { computed, onMounted, reactive, ref } from 'vue'
|
||||
import { Check, CircleCheck, Plus, Refresh, Stamp } from '@element-plus/icons-vue'
|
||||
import http, { apiErrorMessage } from '../api/http'
|
||||
import { useAuthStore } from '../stores/auth'
|
||||
|
||||
const auth = useAuthStore()
|
||||
const isStudent = computed(() => auth.user?.roles.includes('Student') ?? false)
|
||||
const isManager = computed(() =>
|
||||
auth.user?.roles.some((role) => ['SuperAdmin', 'AcademicAdmin'].includes(role)) ?? false)
|
||||
const batches = ref<any[]>([])
|
||||
const selected = ref<any | null>(null)
|
||||
const myClearance = ref<any | null>(null)
|
||||
const loading = ref(false)
|
||||
const createDialog = ref(false)
|
||||
const recordDialog = ref(false)
|
||||
const recordTarget = ref<any | null>(null)
|
||||
const recordForm = reactive({ status: 'Completed', notes: '' })
|
||||
const batchForm = reactive({
|
||||
name: '2030届毕业生离校手续',
|
||||
graduationYear: 2030,
|
||||
notes: '',
|
||||
items: [
|
||||
{ code: 'LIBRARY', name: '图书资料归还', responsibleUnit: '图书馆', responsibleRole: 'AcademicAdmin', isRequired: true },
|
||||
{ code: 'FINANCE', name: '财务费用结清', responsibleUnit: '财务处', responsibleRole: 'AcademicAdmin', isRequired: true },
|
||||
{ code: 'DORM', name: '宿舍退宿确认', responsibleUnit: '学生工作办公室', responsibleRole: 'Counselor', isRequired: true },
|
||||
{ code: 'COLLEGE', name: '学院材料归档', responsibleUnit: '所在学院', responsibleRole: 'CollegeAdmin', isRequired: true },
|
||||
{ code: 'CERTIFICATE', name: '毕业证书领取', responsibleUnit: '教务处', responsibleRole: 'AcademicAdmin', isRequired: false },
|
||||
],
|
||||
})
|
||||
const statusLabels: Record<string, string> = {
|
||||
Pending: '待办理', Completed: '已完成', Waived: '已豁免',
|
||||
}
|
||||
const roleLabels: Record<string, string> = {
|
||||
AcademicAdmin: '校级办理', CollegeAdmin: '学院办理', Counselor: '辅导员办理',
|
||||
}
|
||||
const studentLedgers = computed(() => {
|
||||
const map = new Map<string, any>()
|
||||
for (const record of selected.value?.records ?? []) {
|
||||
if (!map.has(record.studentId)) {
|
||||
map.set(record.studentId, {
|
||||
studentId: record.studentId,
|
||||
studentNumber: record.studentNumber,
|
||||
name: record.name,
|
||||
className: record.className,
|
||||
majorName: record.majorName,
|
||||
records: [],
|
||||
})
|
||||
}
|
||||
map.get(record.studentId).records.push(record)
|
||||
}
|
||||
return [...map.values()]
|
||||
})
|
||||
function dateText(value?: string) {
|
||||
if (!value) return '—'
|
||||
return new Intl.DateTimeFormat('zh-CN', {
|
||||
year: 'numeric', month: '2-digit', day: '2-digit',
|
||||
hour: '2-digit', minute: '2-digit', hour12: false,
|
||||
}).format(new Date(value))
|
||||
}
|
||||
function completedCount(records: any[]) {
|
||||
return records.filter((x) => x.status !== 'Pending').length
|
||||
}
|
||||
function canManage(record: any) {
|
||||
const roles = auth.user?.roles ?? []
|
||||
return roles.includes('SuperAdmin') || roles.includes(record.responsibleRole)
|
||||
}
|
||||
function tagType(status: string) {
|
||||
if (status === 'Completed') return 'success'
|
||||
if (status === 'Waived') return 'info'
|
||||
return 'warning'
|
||||
}
|
||||
async function load() {
|
||||
loading.value = true
|
||||
try {
|
||||
if (isStudent.value) {
|
||||
myClearance.value = (await http.get('/graduation-clearance/my-clearance')).data
|
||||
return
|
||||
}
|
||||
batches.value = (await http.get('/graduation-clearance/batches')).data
|
||||
const batch = batches.value.find((x) => x.id === selected.value?.id) ?? batches.value[0]
|
||||
if (batch) await selectBatch(batch.id)
|
||||
else selected.value = null
|
||||
} catch (error) {
|
||||
ElMessage.error(apiErrorMessage(error))
|
||||
} finally {
|
||||
loading.value = false
|
||||
}
|
||||
}
|
||||
async function selectBatch(id: string) {
|
||||
selected.value = (await http.get(`/graduation-clearance/batches/${id}`)).data
|
||||
}
|
||||
function addItem() {
|
||||
batchForm.items.push({
|
||||
code: '', name: '', responsibleUnit: '',
|
||||
responsibleRole: 'AcademicAdmin', isRequired: true,
|
||||
})
|
||||
}
|
||||
function removeItem(index: number) {
|
||||
batchForm.items.splice(index, 1)
|
||||
}
|
||||
async function createBatch() {
|
||||
if (!batchForm.items.length || batchForm.items.some((x) =>
|
||||
!x.code.trim() || !x.name.trim() || !x.responsibleUnit.trim())) {
|
||||
ElMessage.warning('请完整填写每一项离校事项。')
|
||||
return
|
||||
}
|
||||
try {
|
||||
const response = await http.post('/graduation-clearance/batches', batchForm)
|
||||
createDialog.value = false
|
||||
await http.post(`/graduation-clearance/batches/${response.data.id}/generate`)
|
||||
ElMessage.success('离校批次已建立，并生成毕业生办理清单。')
|
||||
await load()
|
||||
} catch (error) {
|
||||
ElMessage.error(apiErrorMessage(error))
|
||||
}
|
||||
}
|
||||
async function generate() {
|
||||
try {
|
||||
await http.post(`/graduation-clearance/batches/${selected.value.id}/generate`)
|
||||
ElMessage.success('已补齐最新毕业生的离校办理记录。')
|
||||
await load()
|
||||
} catch (error) {
|
||||
ElMessage.error(apiErrorMessage(error))
|
||||
}
|
||||
}
|
||||
function openRecord(record: any, status: string) {
|
||||
recordTarget.value = record
|
||||
recordForm.status = status
|
||||
recordForm.notes = record.notes ?? ''
|
||||
recordDialog.value = true
|
||||
}
|
||||
async function saveRecord() {
|
||||
try {
|
||||
await http.put(`/graduation-clearance/records/${recordTarget.value.id}`, recordForm)
|
||||
recordDialog.value = false
|
||||
ElMessage.success('离校事项办理状态已更新。')
|
||||
await selectBatch(selected.value.id)
|
||||
} catch (error) {
|
||||
ElMessage.error(apiErrorMessage(error))
|
||||
}
|
||||
}
|
||||
async function closeBatch() {
|
||||
try {
|
||||
await ElMessageBox.confirm('关闭后所有办理记录将锁定，请确认必办事项均已办结。', '关闭离校批次', {
|
||||
type: 'warning', confirmButtonText: '确认关闭',
|
||||
})
|
||||
await http.post(`/graduation-clearance/batches/${selected.value.id}/close`)
|
||||
ElMessage.success('离校批次已关闭。')
|
||||
await load()
|
||||
} catch (error: any) {
|
||||
if (error !== 'cancel' && error !== 'close') ElMessage.error(apiErrorMessage(error))
|
||||
}
|
||||
}
|
||||
|
||||
onMounted(load)
|
||||
</script>
|
||||
|
||||
<template>
|
||||
<div class="page-stack clearance-page">
|
||||
<section class="page-intro">
|
||||
<div>
|
||||
<span class="section-kicker">GRADUATION CLEARANCE</span>
|
||||
<h2>{{ isStudent ? '我的毕业离校' : '毕业离校办理' }}</h2>
|
||||
<p>{{ isStudent ? '查看各责任部门的离校手续办理进度。' : '按毕业生生成跨部门事项清单，责任角色分工办理，必办事项全部完成后统一关闭。' }}</p>
|
||||
</div>
|
||||
<el-button v-if="isManager && !isStudent" type="primary" :icon="Plus" @click="createDialog = true">新建离校批次</el-button>
|
||||
<el-button v-else :icon="Refresh" @click="load">刷新</el-button>
|
||||
</section>
|
||||
|
||||
<template v-if="isStudent">
|
||||
<section v-if="myClearance" class="clearance-pass" v-loading="loading">
|
||||
<header>
|
||||
<div><span>LEAVING CAMPUS CHECKLIST</span><h3>{{ myClearance.name }}</h3><p>{{ myClearance.graduationYear }}届 · {{ myClearance.status === 'Closed' ? '离校手续已完成' : '离校手续办理中' }}</p></div>
|
||||
<b>{{ completedCount(myClearance.items) }} / {{ myClearance.items.length }}</b>
|
||||
</header>
|
||||
<div class="clearance-student-list">
|
||||
<article v-for="(item, index) in myClearance.items" :key="item.id" :class="{ done: item.status !== 'Pending' }">
|
||||
<i><el-icon v-if="item.status !== 'Pending'"><Check /></el-icon><span v-else>{{ Number(index) + 1 }}</span></i>
|
||||
<div><span>{{ item.responsibleUnit }}</span><h4>{{ item.itemName }}</h4><p>{{ item.notes || (item.isRequired ? '必办事项' : '非必办事项') }}</p></div>
|
||||
<el-tag :type="tagType(item.status)" effect="plain">{{ statusLabels[item.status] }}</el-tag>
|
||||
</article>
|
||||
</div>
|
||||
</section>
|
||||
<el-empty v-else v-loading="loading" description="暂未生成你的毕业离校办理清单" />
|
||||
</template>
|
||||
|
||||
<template v-else>
|
||||
<section class="clearance-batch-strip">
|
||||
<button v-for="batch in batches" :key="batch.id" :class="{ active: selected?.id === batch.id }" @click="selectBatch(batch.id)">
|
||||
<span>{{ batch.graduationYear }}届 · {{ batch.itemCount }} 项手续</span><b>{{ batch.name }}</b>
|
||||
<small>{{ batch.studentCount }} 名毕业生 · {{ batch.completedCount }}/{{ batch.recordCount }} 项已办</small><i>{{ batch.status === 'Closed' ? '已关闭' : '办理中' }}</i>
|
||||
</button>
|
||||
</section>
|
||||
|
||||
<section v-if="selected" class="clearance-workbench" v-loading="loading">
|
||||
<header>
|
||||
<div><span>CLEARANCE LEDGER</span><h3>{{ selected.name }}</h3><p>{{ selected.items.length }} 项离校手续 · {{ studentLedgers.length }} 名毕业生</p></div>
|
||||
<div v-if="selected.status === 'Open' && isManager"><el-button :icon="Refresh" @click="generate">补齐名单</el-button><el-button type="primary" :icon="Stamp" @click="closeBatch">关闭批次</el-button></div>
|
||||
<el-tag v-else type="success" effect="plain">批次已锁定</el-tag>
|
||||
</header>
|
||||
<div class="clearance-item-legend">
|
||||
<div v-for="item in selected.items" :key="item.id"><span>{{ item.code }}</span><b>{{ item.name }}</b><small>{{ item.responsibleUnit }} · {{ roleLabels[item.responsibleRole] }}</small></div>
|
||||
</div>
|
||||
<div class="clearance-ledgers">
|
||||
<article v-for="student in studentLedgers" :key="student.studentId">
|
||||
<header><div><span>{{ student.studentNumber }} · {{ student.className }}</span><h4>{{ student.name }}</h4><p>{{ student.majorName }}</p></div><b>{{ completedCount(student.records) }}/{{ student.records.length }}</b></header>
|
||||
<div class="clearance-record-grid">
|
||||
<div v-for="record in student.records" :key="record.id" :class="{ done: record.status !== 'Pending' }">
|
||||
<el-icon><CircleCheck /></el-icon>
|
||||
<span>{{ record.responsibleUnit }}</span><b>{{ record.itemName }}</b>
|
||||
<small>{{ statusLabels[record.status] }}<template v-if="record.completedAt"> · {{ dateText(record.completedAt) }}</template></small>
|
||||
<div v-if="selected.status === 'Open' && canManage(record)">
|
||||
<el-button link type="primary" @click="openRecord(record, 'Completed')">办结</el-button>
|
||||
<el-button link @click="openRecord(record, 'Waived')">豁免</el-button>
|
||||
<el-button v-if="record.status !== 'Pending'" link type="danger" @click="openRecord(record, 'Pending')">重置</el-button>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</article>
|
||||
<el-empty v-if="!studentLedgers.length" description="尚未生成毕业生离校办理记录" />
|
||||
</div>
|
||||
</section>
|
||||
<el-empty v-else v-loading="loading" description="尚未建立毕业离校批次" />
|
||||
</template>
|
||||
|
||||
<el-dialog v-model="createDialog" title="新建毕业离校批次" width="900px">
|
||||
<el-form label-position="top">
|
||||
<div class="form-grid"><el-form-item label="批次名称"><el-input v-model="batchForm.name" /></el-form-item><el-form-item label="毕业年份"><el-input-number v-model="batchForm.graduationYear" :min="2000" :max="2200" /></el-form-item></div>
|
||||
<el-form-item label="说明"><el-input v-model="batchForm.notes" /></el-form-item>
|
||||
<div class="clearance-form-head"><b>离校事项配置</b><el-button :icon="Plus" @click="addItem">增加事项</el-button></div>
|
||||
<div class="clearance-form-list">
|
||||
<div v-for="(item, index) in batchForm.items" :key="index">
|
||||
<el-input v-model="item.code" placeholder="事项编码" />
|
||||
<el-input v-model="item.name" placeholder="事项名称" />
|
||||
<el-input v-model="item.responsibleUnit" placeholder="责任部门" />
|
||||
<el-select v-model="item.responsibleRole"><el-option label="校级教务" value="AcademicAdmin" /><el-option label="学院教务" value="CollegeAdmin" /><el-option label="辅导员" value="Counselor" /></el-select>
|
||||
<el-switch v-model="item.isRequired" active-text="必办" />
|
||||
<el-button link type="danger" @click="removeItem(index)">移除</el-button>
|
||||
</div>
|
||||
</div>
|
||||
</el-form>
|
||||
<template #footer><el-button @click="createDialog=false">取消</el-button><el-button type="primary" @click="createBatch">建立并生成清单</el-button></template>
|
||||
</el-dialog>
|
||||
|
||||
<el-dialog v-model="recordDialog" title="更新离校事项" width="580px">
|
||||
<div v-if="recordTarget" class="review-target"><span>{{ recordTarget.studentNumber }}</span><b>{{ recordTarget.name }} · {{ recordTarget.itemName }}</b><p>{{ recordTarget.responsibleUnit }}</p></div>
|
||||
<el-form label-position="top"><el-form-item label="办理状态"><el-radio-group v-model="recordForm.status"><el-radio-button value="Completed">已完成</el-radio-button><el-radio-button value="Waived">已豁免</el-radio-button><el-radio-button value="Pending">重置待办</el-radio-button></el-radio-group></el-form-item><el-form-item label="办理备注"><el-input v-model="recordForm.notes" type="textarea" :rows="4" maxlength="500" show-word-limit /></el-form-item></el-form>
|
||||
<template #footer><el-button @click="recordDialog=false">取消</el-button><el-button type="primary" @click="saveRecord">保存办理状态</el-button></template>
|
||||
</el-dialog>
|
||||
</div>
|
||||
</template>
|
||||
@@ -0,0 +1,282 @@
|
||||
<script setup lang="ts">
|
||||
import { computed, onMounted, reactive, ref } from 'vue'
|
||||
import { Check, Close, Plus, RefreshRight, Stamp } from '@element-plus/icons-vue'
|
||||
import http, { apiErrorMessage } from '../api/http'
|
||||
import { useAuthStore } from '../stores/auth'
|
||||
|
||||
type ChangeState =
|
||||
| 'Submitted'
|
||||
| 'CounselorApproved'
|
||||
| 'CollegeApproved'
|
||||
| 'Approved'
|
||||
| 'Rejected'
|
||||
| 'Cancelled'
|
||||
|
||||
const auth = useAuthStore()
|
||||
const isStudent = computed(() => auth.user?.roles.includes('Student') ?? false)
|
||||
const changes = ref<any[]>([])
|
||||
const options = ref<any | null>(null)
|
||||
const loading = ref(false)
|
||||
const applyDialog = ref(false)
|
||||
const reviewDialog = ref(false)
|
||||
const selected = ref<any | null>(null)
|
||||
const reviewApproved = ref(true)
|
||||
const applyForm = reactive({ type: '', reason: '' })
|
||||
const reviewForm = reactive({ comment: '' })
|
||||
|
||||
const typeLabels: Record<string, string> = {
|
||||
Suspension: '休学',
|
||||
Resumption: '复学',
|
||||
Withdrawal: '退学',
|
||||
}
|
||||
const statusLabels: Record<string, string> = {
|
||||
Active: '在籍',
|
||||
Suspended: '休学',
|
||||
Withdrawn: '退学',
|
||||
Graduated: '毕业',
|
||||
}
|
||||
const stateLabels: Record<ChangeState, string> = {
|
||||
Submitted: '待辅导员审核',
|
||||
CounselorApproved: '待学院审核',
|
||||
CollegeApproved: '待校级审核',
|
||||
Approved: '已批准',
|
||||
Rejected: '已驳回',
|
||||
Cancelled: '已撤回',
|
||||
}
|
||||
const steps = [
|
||||
{ label: '辅导员审核', state: 'Submitted' },
|
||||
{ label: '学院审核', state: 'CounselorApproved' },
|
||||
{ label: '校级审批', state: 'CollegeApproved' },
|
||||
]
|
||||
const currentQueue = computed(() => changes.value.filter(canReview))
|
||||
const finishedCount = computed(() =>
|
||||
changes.value.filter((x) => ['Approved', 'Rejected', 'Cancelled'].includes(x.state)).length)
|
||||
|
||||
function dateText(value?: string) {
|
||||
if (!value) return '—'
|
||||
return new Intl.DateTimeFormat('zh-CN', {
|
||||
year: 'numeric', month: '2-digit', day: '2-digit',
|
||||
hour: '2-digit', minute: '2-digit', hour12: false,
|
||||
}).format(new Date(value))
|
||||
}
|
||||
function stageIndex(state: ChangeState) {
|
||||
if (state === 'Submitted') return 0
|
||||
if (state === 'CounselorApproved') return 1
|
||||
if (state === 'CollegeApproved') return 2
|
||||
if (state === 'Approved') return 3
|
||||
return -1
|
||||
}
|
||||
function stepClass(change: any, index: number) {
|
||||
const current = stageIndex(change.state)
|
||||
return {
|
||||
done: change.state === 'Approved' || current > index,
|
||||
active: current === index,
|
||||
stopped: ['Rejected', 'Cancelled'].includes(change.state) && index === Math.max(current, 0),
|
||||
}
|
||||
}
|
||||
function canReview(change: any) {
|
||||
const roles = auth.user?.roles ?? []
|
||||
return (
|
||||
(change.state === 'Submitted' && roles.includes('Counselor')) ||
|
||||
(change.state === 'CounselorApproved' && roles.includes('CollegeAdmin')) ||
|
||||
(change.state === 'CollegeApproved' &&
|
||||
roles.some((role) => ['AcademicAdmin', 'SuperAdmin'].includes(role)))
|
||||
)
|
||||
}
|
||||
function stateTagType(state: ChangeState) {
|
||||
if (state === 'Approved') return 'success'
|
||||
if (state === 'Rejected') return 'danger'
|
||||
if (state === 'Cancelled') return 'info'
|
||||
return 'warning'
|
||||
}
|
||||
|
||||
async function load() {
|
||||
loading.value = true
|
||||
try {
|
||||
const requests = [http.get('/student-status-changes')]
|
||||
if (isStudent.value) requests.push(http.get('/student-status-changes/options'))
|
||||
const [changeResponse, optionResponse] = await Promise.all(requests)
|
||||
changes.value = changeResponse.data
|
||||
if (optionResponse) options.value = optionResponse.data
|
||||
} catch (error) {
|
||||
ElMessage.error(apiErrorMessage(error))
|
||||
} finally {
|
||||
loading.value = false
|
||||
}
|
||||
}
|
||||
function openApply() {
|
||||
applyForm.type = options.value?.types?.[0] ?? ''
|
||||
applyForm.reason = ''
|
||||
applyDialog.value = true
|
||||
}
|
||||
async function submitApply() {
|
||||
if (!applyForm.type || applyForm.reason.trim().length < 10) {
|
||||
ElMessage.warning('请选择异动类型，并填写至少 10 个字的申请说明。')
|
||||
return
|
||||
}
|
||||
try {
|
||||
await http.post('/student-status-changes', applyForm)
|
||||
applyDialog.value = false
|
||||
ElMessage.success('申请已提交，等待辅导员审核。')
|
||||
await load()
|
||||
} catch (error) {
|
||||
ElMessage.error(apiErrorMessage(error))
|
||||
}
|
||||
}
|
||||
async function cancel(change: any) {
|
||||
try {
|
||||
await ElMessageBox.confirm('撤回后本次申请将结束，需要时可重新提交。', '撤回申请', {
|
||||
type: 'warning', confirmButtonText: '确认撤回',
|
||||
})
|
||||
await http.post(`/student-status-changes/${change.id}/cancel`)
|
||||
ElMessage.success('申请已撤回。')
|
||||
await load()
|
||||
} catch (error: any) {
|
||||
if (error !== 'cancel' && error !== 'close') ElMessage.error(apiErrorMessage(error))
|
||||
}
|
||||
}
|
||||
function openReview(change: any, approved: boolean) {
|
||||
selected.value = change
|
||||
reviewApproved.value = approved
|
||||
reviewForm.comment = ''
|
||||
reviewDialog.value = true
|
||||
}
|
||||
async function submitReview() {
|
||||
if (!reviewApproved.value && !reviewForm.comment.trim()) {
|
||||
ElMessage.warning('驳回申请时必须填写审核意见。')
|
||||
return
|
||||
}
|
||||
try {
|
||||
await http.post(`/student-status-changes/${selected.value.id}/review`, {
|
||||
approved: reviewApproved.value,
|
||||
comment: reviewForm.comment,
|
||||
})
|
||||
reviewDialog.value = false
|
||||
ElMessage.success(reviewApproved.value ? '审核已通过，申请进入下一环节。' : '申请已驳回。')
|
||||
await load()
|
||||
} catch (error) {
|
||||
ElMessage.error(apiErrorMessage(error))
|
||||
}
|
||||
}
|
||||
|
||||
onMounted(load)
|
||||
</script>
|
||||
|
||||
<template>
|
||||
<div class="page-stack status-change-page">
|
||||
<section class="page-intro">
|
||||
<div>
|
||||
<span class="section-kicker">STUDENT RECORD TRANSFER</span>
|
||||
<h2>{{ isStudent ? '学籍异动申请' : '学籍异动审核' }}</h2>
|
||||
<p>{{ isStudent ? '在线办理休学、复学或退学申请，清晰跟踪每一级审核进度。' : '按辅导员、学院、学校三级权限逐级审核，最终结果同步学生学籍。' }}</p>
|
||||
</div>
|
||||
<el-button
|
||||
v-if="isStudent"
|
||||
type="primary"
|
||||
:icon="Plus"
|
||||
:disabled="options?.hasPending || !options?.types?.length"
|
||||
@click="openApply"
|
||||
>发起申请</el-button>
|
||||
<el-button v-else :icon="RefreshRight" @click="load">刷新队列</el-button>
|
||||
</section>
|
||||
|
||||
<section v-if="isStudent && options" class="status-identity">
|
||||
<div>
|
||||
<span>CURRENT STUDENT STATUS</span>
|
||||
<b>{{ statusLabels[options.status] }}</b>
|
||||
<p>{{ options.hasPending ? '当前有申请正在流转，请等待处理。' : '当前可以提交新的学籍异动申请。' }}</p>
|
||||
</div>
|
||||
<div class="status-available">
|
||||
<span>可申请业务</span>
|
||||
<strong v-for="type in options.types" :key="type">{{ typeLabels[type] }}</strong>
|
||||
<em v-if="!options.types.length">当前状态无可申请业务</em>
|
||||
</div>
|
||||
</section>
|
||||
|
||||
<section v-if="!isStudent" class="status-review-summary">
|
||||
<div><span>当前待我审核</span><b>{{ currentQueue.length }}</b><small>件</small></div>
|
||||
<div><span>辖区申请总数</span><b>{{ changes.length }}</b><small>件</small></div>
|
||||
<div><span>已结束</span><b>{{ finishedCount }}</b><small>件</small></div>
|
||||
<p>系统仅开放当前审核层级的操作，所有越级请求都会由服务端拒绝。</p>
|
||||
</section>
|
||||
|
||||
<section class="status-folio-list" v-loading="loading">
|
||||
<article v-for="change in changes" :key="change.id" :class="{ actionable: canReview(change) }">
|
||||
<header>
|
||||
<div class="folio-number">
|
||||
<span>APPLICATION FOLIO</span>
|
||||
<b>{{ change.studentNumber }}</b>
|
||||
</div>
|
||||
<div class="folio-person">
|
||||
<span>{{ change.collegeName }} · {{ change.className }}</span>
|
||||
<h3>{{ change.name }} · {{ typeLabels[change.type] }}申请</h3>
|
||||
<p>{{ statusLabels[change.originalStatus] }} → {{ statusLabels[change.targetStatus] }} · 提交于 {{ dateText(change.submittedAt) }}</p>
|
||||
</div>
|
||||
<el-tag :type="stateTagType(change.state)" effect="plain">{{ stateLabels[change.state as ChangeState] }}</el-tag>
|
||||
</header>
|
||||
|
||||
<div class="folio-reason">
|
||||
<span>申请说明</span>
|
||||
<p>{{ change.reason }}</p>
|
||||
</div>
|
||||
|
||||
<div class="approval-track">
|
||||
<div v-for="(step, index) in steps" :key="step.state" :class="stepClass(change, index)">
|
||||
<i><el-icon v-if="stepClass(change, index).done"><Check /></el-icon><span v-else>{{ index + 1 }}</span></i>
|
||||
<b>{{ step.label }}</b>
|
||||
<small>{{ stepClass(change, index).done ? '已通过' : stepClass(change, index).active ? '处理中' : '待流转' }}</small>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<footer>
|
||||
<div v-if="change.reviewComment" class="review-comment">
|
||||
<span>最近审核意见</span><b>{{ change.reviewComment }}</b>
|
||||
</div>
|
||||
<div v-else class="review-comment"><span>流程编号</span><b>{{ change.id.slice(0, 8).toUpperCase() }}</b></div>
|
||||
<div class="folio-actions">
|
||||
<el-button v-if="isStudent && change.state === 'Submitted'" type="danger" plain @click="cancel(change)">撤回申请</el-button>
|
||||
<template v-if="canReview(change)">
|
||||
<el-button :icon="Close" type="danger" plain @click="openReview(change, false)">驳回</el-button>
|
||||
<el-button :icon="Stamp" type="primary" @click="openReview(change, true)">审核通过</el-button>
|
||||
</template>
|
||||
</div>
|
||||
</footer>
|
||||
</article>
|
||||
<el-empty v-if="!changes.length && !loading" :description="isStudent ? '尚未提交学籍异动申请' : '当前辖区暂无学籍异动申请'" />
|
||||
</section>
|
||||
|
||||
<el-dialog v-model="applyDialog" title="发起学籍异动申请" width="620px">
|
||||
<el-form label-position="top">
|
||||
<el-form-item label="申请类型">
|
||||
<el-radio-group v-model="applyForm.type">
|
||||
<el-radio-button v-for="type in options?.types" :key="type" :value="type">{{ typeLabels[type] }}</el-radio-button>
|
||||
</el-radio-group>
|
||||
</el-form-item>
|
||||
<el-form-item label="申请说明">
|
||||
<el-input v-model="applyForm.reason" type="textarea" :rows="6" maxlength="1000" show-word-limit placeholder="请说明申请原因、预计时间以及需要学校了解的情况（至少 10 个字）" />
|
||||
</el-form-item>
|
||||
</el-form>
|
||||
<template #footer>
|
||||
<el-button @click="applyDialog = false">取消</el-button>
|
||||
<el-button type="primary" @click="submitApply">提交申请</el-button>
|
||||
</template>
|
||||
</el-dialog>
|
||||
|
||||
<el-dialog v-model="reviewDialog" :title="reviewApproved ? '审核通过' : '驳回申请'" width="600px">
|
||||
<div v-if="selected" class="review-target">
|
||||
<span>{{ selected.studentNumber }}</span>
|
||||
<b>{{ selected.name }} · {{ typeLabels[selected.type] }}申请</b>
|
||||
<p>{{ selected.collegeName }} · {{ selected.className }}</p>
|
||||
</div>
|
||||
<el-form label-position="top">
|
||||
<el-form-item :label="reviewApproved ? '审核意见（选填）' : '驳回原因（必填）'">
|
||||
<el-input v-model="reviewForm.comment" type="textarea" :rows="4" maxlength="500" show-word-limit />
|
||||
</el-form-item>
|
||||
</el-form>
|
||||
<template #footer>
|
||||
<el-button @click="reviewDialog = false">取消</el-button>
|
||||
<el-button :type="reviewApproved ? 'primary' : 'danger'" @click="submitReview">{{ reviewApproved ? '确认通过' : '确认驳回' }}</el-button>
|
||||
</template>
|
||||
</el-dialog>
|
||||
</div>
|
||||
</template>
|
||||
Reference in New Issue
Block a user