新增后台「教师名册」页

纯只读页面,形态与学生名册一致(#19)。

- src/api/gxmu/teacher:分页查询与导出接口
- src/views/gxmu/teacherRoster:学院/教工号/姓名/状态筛选 + 列表 + CSV 导出
- 导出按钮按 gxmu:teacher:export 权限渲染,与查询权限分开
- 手机号按 spec §5.2 不进任何列表接口,页面与导出均无该列
This commit is contained in:
2026-09-15 17:21:38 +08:00
parent a592e66f78
commit b2b7d4208e
3 changed files with 314 additions and 0 deletions
+28
View File
@@ -0,0 +1,28 @@
import request from '@/utils/request';
import type { ApiResult, PageResult } from '@/api';
import type { TeacherRoster, TeacherRosterParam } from './model';
/** 教师名册分页查询 */
export async function pageTeacherRoster(params: TeacherRosterParam) {
const res = await request.get<ApiResult<PageResult<TeacherRoster>>>(
'/gxmu/teacher/page',
{ params }
);
if (res.data.code === 0 && res.data.data) {
return res.data.data;
}
return Promise.reject(new Error(res.data.message));
}
/** 导出教师名册(返回列表,由前端生成文件;响应中不含手机号) */
export async function exportTeacherRoster(params: TeacherRosterParam) {
const res = await request.post<ApiResult<TeacherRoster[]>>(
'/gxmu/teacher/export',
null,
{ params }
);
if (res.data.code === 0 && res.data.data) {
return res.data.data;
}
return Promise.reject(new Error(res.data.message));
}
+43
View File
@@ -0,0 +1,43 @@
/**
* 教师名册(开放平台同步)
*/
/** 教师名册记录 */
export interface TeacherRoster {
id: number;
/** 教工号(开放平台外部键) */
jgh: string;
/** 姓名 */
xm?: string;
/** 性别码 */
xbm?: string;
/** 性别 */
sex?: string;
/** 单位号(平台原始值) */
dwh?: string;
/** 解析出的学院ID */
collegeId?: number;
/** 学院名称 */
collegeName?: string;
/** 科室教研室编号 */
ksjybh?: string;
/** 状态:1启用 0停用 */
status?: number;
/** 最近同步时间 */
syncTime?: string;
}
/**
* 教师名册查询参数
*
* 说明:教师手机号由后端落盘但不出任何列表接口(spec §5.2),故此处没有该字段,
* 页面也不展示。
*/
export interface TeacherRosterParam {
page?: number;
limit?: number;
collegeId?: number;
jgh?: string;
xm?: string;
status?: number;
}
+243
View File
@@ -0,0 +1,243 @@
<template>
<div class="page">
<div class="ele-body">
<a-card :bordered="false" :body-style="{ padding: '16px' }">
<ele-pro-table
ref="tableRef"
row-key="id"
:columns="columns"
:datasource="datasource"
:scroll="{ x: 1200 }"
tool-class="ele-toolbar-form"
>
<template #toolbar>
<a-space style="flex-wrap: wrap">
<a-select
v-model:value="collegeId"
allow-clear
show-search
option-filter-prop="label"
style="width: 220px"
placeholder="学院"
:options="collegeOptions"
/>
<a-input
v-model:value="jgh"
allow-clear
style="width: 160px"
placeholder="教工号"
@pressEnter="reload"
/>
<a-input
v-model:value="xm"
allow-clear
style="width: 140px"
placeholder="姓名"
@pressEnter="reload"
/>
<a-select
v-model:value="status"
style="width: 130px"
placeholder="状态"
:options="statusOptions"
/>
<a-button type="primary" @click="reload">查询</a-button>
<a-button @click="resetSearch">重置</a-button>
<a-button
v-if="hasPermission('gxmu:teacher:export')"
:loading="exporting"
@click="doExport"
>
导出
</a-button>
</a-space>
</template>
<template #bodyCell="{ column, record }">
<template v-if="column.key === 'status'">
<a-tag :color="record.status === 1 ? 'green' : 'default'">
{{ record.status === 1 ? '启用' : '停用' }}
</a-tag>
</template>
</template>
</ele-pro-table>
</a-card>
</div>
</div>
</template>
<script lang="ts" setup>
import { onMounted, ref } from 'vue';
import { message } from 'ant-design-vue';
import type { EleProTable } from 'ele-admin-pro';
import { toDateString } from 'ele-admin-pro';
import type {
DatasourceFunction,
ColumnItem
} from 'ele-admin-pro/es/ele-pro-table/types';
import { hasPermission } from '@/utils/permission';
import { listOrganizations } from '@/api/system/organization';
import { exportTeacherRoster, pageTeacherRoster } from '@/api/gxmu/teacher';
import type {
TeacherRoster,
TeacherRosterParam
} from '@/api/gxmu/teacher/model';
/** 学院挂载的父节点:广西医科大学 */
const COLLEGE_PARENT_ID = 24;
const tableRef = ref<InstanceType<typeof EleProTable> | null>(null);
const collegeId = ref<number | undefined>(undefined);
const jgh = ref<string>('');
const xm = ref<string>('');
const status = ref<number>(1);
const exporting = ref(false);
const collegeOptions = ref<{ label: string; value: number }[]>([]);
/** 停用=上游已消失,默认不显示(ADR-0004) */
const statusOptions = [
{ label: '启用', value: 1 },
{ label: '停用', value: 0 }
];
const columns = ref<ColumnItem[]>([
{ title: '教工号', dataIndex: 'jgh', key: 'jgh', width: 140 },
{ title: '姓名', dataIndex: 'xm', key: 'xm', width: 110 },
{ title: '性别', dataIndex: 'sex', key: 'sex', width: 80 },
{
title: '学院',
dataIndex: 'collegeName',
key: 'collegeName',
width: 220,
customRender: ({ text }) => text || '-'
},
{
title: '单位号',
dataIndex: 'dwh',
key: 'dwh',
width: 120,
customRender: ({ text }) => text || '-'
},
{
title: '科室教研室编号',
dataIndex: 'ksjybh',
key: 'ksjybh',
width: 160,
customRender: ({ text }) => text || '-'
},
{
title: '状态',
dataIndex: 'status',
key: 'status',
align: 'center',
width: 90
},
{
title: '同步时间',
dataIndex: 'syncTime',
key: 'syncTime',
width: 170,
customRender: ({ text }) => (text ? toDateString(text) : '-')
}
]);
const currentParam = (): TeacherRosterParam => ({
collegeId: collegeId.value,
jgh: jgh.value.trim() || undefined,
xm: xm.value.trim() || undefined,
status: status.value
});
const datasource: DatasourceFunction = ({ page, limit }) => {
return pageTeacherRoster({ ...currentParam(), page, limit }).catch((e) => {
message.error(e.message);
return { list: [] as TeacherRoster[], count: 0 };
});
};
const reload = () => {
tableRef.value?.reload();
};
const loadColleges = () => {
// 学院取组织树中「广西医科大学」的直接子节点,与学生名册一致
listOrganizations({ parentId: COLLEGE_PARENT_ID })
.then((list) => {
collegeOptions.value = list.map((item) => ({
label: item.organizationFullName || item.organizationName || '',
value: item.organizationId || 0
}));
})
.catch((e) => {
message.error(e.message);
});
};
const resetSearch = () => {
collegeId.value = undefined;
jgh.value = '';
xm.value = '';
status.value = 1;
reload();
};
const doExport = () => {
exporting.value = true;
exportTeacherRoster(currentParam())
.then((list) => {
if (!list.length) {
message.warning('没有可导出的数据');
return;
}
// 手机号不在导出范围内:后端不返回该字段(spec §5.2)
const header = [
'教工号',
'姓名',
'性别',
'学院',
'单位号',
'科室教研室编号',
'状态'
];
const lines = list.map((item) =>
[
item.jgh,
item.xm,
item.sex,
item.collegeName,
item.dwh || '',
item.ksjybh || '',
item.status === 1 ? '启用' : '停用'
]
.map((v) => `"${String(v ?? '').replace(/"/g, '""')}"`)
.join(',')
);
const csv = '\uFEFF' + [header.join(','), ...lines].join('\r\n');
const blob = new Blob([csv], { type: 'text/csv;charset=utf-8' });
const url = URL.createObjectURL(blob);
const a = document.createElement('a');
a.href = url;
a.download = `教师名册_${new Date().toISOString().slice(0, 10)}.csv`;
a.click();
URL.revokeObjectURL(url);
message.success(`已导出 ${list.length}`);
})
.catch((e) => {
message.error(e.message || '导出失败');
})
.finally(() => {
exporting.value = false;
});
};
onMounted(() => {
loadColleges();
});
defineExpose({ reload });
</script>
<script lang="ts">
export default {
name: 'TeacherRoster'
};
</script>