完善了教师新增功能,新增教师名称和角色选择项。

This commit is contained in:
LiuQAQQWQ 2025-12-08 16:28:00 +08:00
parent cc775a5500
commit 104dc73597
3 changed files with 85 additions and 27 deletions

View File

@ -11,7 +11,7 @@ export function teacherDetail(params: Record<string, any>) {
} }
// 教师信息扩展新增 // 教师信息扩展新增
export function teacherAdd(params: Record<string, any>) { export function teacherAdd(params: any) {
return request.post({ url: '/teacher/add', params }) return request.post({ url: '/teacher/add', params })
} }

View File

@ -12,6 +12,9 @@
<el-form-item label="教师工号" prop="teacherCode"> <el-form-item label="教师工号" prop="teacherCode">
<el-input v-model="formData.teacherCode" placeholder="请输入教师工号" /> <el-input v-model="formData.teacherCode" placeholder="请输入教师工号" />
</el-form-item> </el-form-item>
<el-form-item label="教师名称" prop="name">
<el-input v-model="formData.name" placeholder="请输入教师名称" />
</el-form-item>
<el-form-item label="所属学院" prop="collegeId"> <el-form-item label="所属学院" prop="collegeId">
<el-select <el-select
v-model="formData.collegeId" v-model="formData.collegeId"
@ -22,12 +25,25 @@
v-for="college in getCollegeLists.lists" v-for="college in getCollegeLists.lists"
:key="college.id" :key="college.id"
:value="college.id" :value="college.id"
:label="college.college_name" :label="college.collegeName"
/> />
</el-select> </el-select>
</el-form-item> </el-form-item>
<el-form-item label="职称" prop="title"> <el-form-item label="角色" prop="roleId">
<el-input v-model="formData.title" placeholder="请输入职称" /> <el-select
v-model="formData.roleId"
class="flex-1"
multiple
placeholder="请选择角色"
clearable
>
<el-option
v-for="(item, index) in optionsData.role"
:key="index"
:label="item.name"
:value="item.id"
/>
</el-select>
</el-form-item> </el-form-item>
<el-form-item label="联系电话" prop="contactPhone"> <el-form-item label="联系电话" prop="contactPhone">
<el-input v-model="formData.contactPhone" placeholder="请输入联系电话" /> <el-input v-model="formData.contactPhone" placeholder="请输入联系电话" />
@ -35,13 +51,6 @@
<el-form-item label="联系邮箱" prop="contactEmail"> <el-form-item label="联系邮箱" prop="contactEmail">
<el-input v-model="formData.contactEmail" placeholder="请输入联系邮箱" /> <el-input v-model="formData.contactEmail" placeholder="请输入联系邮箱" />
</el-form-item> </el-form-item>
<el-form-item label="教师状态" prop="teacherStatus">
<el-radio-group v-model="formData.teacherStatus" placeholder="请选择教师状态">
<el-radio :label="1">在职</el-radio>
<el-radio :label="2">休假</el-radio>
<el-radio :label="3">离职</el-radio>
</el-radio-group>
</el-form-item>
</el-form> </el-form>
</popup> </popup>
</div> </div>
@ -51,8 +60,10 @@ import type { FormInstance } from 'element-plus'
import type { PropType } from 'vue' import type { PropType } from 'vue'
import { collegeLists } from '@/api/college' import { collegeLists } from '@/api/college'
import { roleAll } from '@/api/perms/role'
import { teacherAdd, teacherDetail, teacherEdit } from '@/api/teacher' import { teacherAdd, teacherDetail, teacherEdit } from '@/api/teacher'
import Popup from '@/components/popup/index.vue' import Popup from '@/components/popup/index.vue'
import { useDictOptions } from '@/hooks/useDictOptions'
import feedback from '@/utils/feedback' import feedback from '@/utils/feedback'
import { snakeToCamel } from '@/utils/format' import { snakeToCamel } from '@/utils/format'
defineProps({ defineProps({
@ -65,22 +76,37 @@ const emit = defineEmits(['success', 'close'])
const formRef = shallowRef<FormInstance>() const formRef = shallowRef<FormInstance>()
const popupRef = shallowRef<InstanceType<typeof Popup>>() const popupRef = shallowRef<InstanceType<typeof Popup>>()
const mode = ref('add') const mode = ref('add')
const getCollegeLists = ref<{ lists: Array<{ id: number; college_name: string }> }>({ lists: [] }) const getCollegeLists = ref<{ lists: Array<{ id: number; collegeName: string }> }>({ lists: [] })
const popupTitle = computed(() => { const popupTitle = computed(() => {
return mode.value == 'edit' ? '编辑教师信息扩展' : '新增教师信息扩展' return mode.value == 'edit' ? '编辑教师信息扩展' : '新增教师信息扩展'
}) })
const { optionsData } = useDictOptions<{
role: any[]
}>({
role: {
api: roleAll
}
})
const formData = reactive({ const formData = reactive({
id: '', id: '',
name: '',
roleId: [],
adminId: '', adminId: '',
teacherCode: '', teacherCode: '',
title: '',
collegeId: '', collegeId: '',
contactPhone: '', contactPhone: '',
contactEmail: '', contactEmail: ''
teacherStatus: ''
}) })
const roleIdValidator = (rule: object, value: string, callback: any) => {
if (formData.roleId.length) {
callback()
} else {
callback(new Error('请选择角色'))
}
}
const formRules = { const formRules = {
id: [ id: [
{ {
@ -88,23 +114,47 @@ const formRules = {
message: '请输入', message: '请输入',
trigger: ['blur'] trigger: ['blur']
} }
] ],
} teacherCode: [
{
const fetchCollegeLists = async () => { required: true,
try { message: '请输入教师工号',
const res = await collegeLists() // trigger: ['blur']
getCollegeLists.value = res //
} catch (err) {
feedback.msgError('获取学院列表失败')
} }
],
name: [
{
required: true,
message: '请输入教师名称',
trigger: ['blur']
}
],
roleId: [
{
required: true,
validator: roleIdValidator
}
],
collegeId: [
{
required: true,
message: '请选择所属学院',
trigger: ['change']
}
],
contactPhone: [
{
required: true,
message: '请输入联系电话',
trigger: ['blur']
}
]
} }
const handleSubmit = async () => { const handleSubmit = async () => {
await formRef.value?.validate() await formRef.value?.validate()
const data: any = { ...formData } const data: any = { ...formData }
const camelData = snakeToCamel(data) mode.value == 'edit' ? await teacherEdit(data) : await teacherAdd(data)
mode.value == 'edit' ? await teacherEdit(camelData) : await teacherAdd(camelData)
popupRef.value?.close() popupRef.value?.close()
feedback.msgSuccess('操作成功') feedback.msgSuccess('操作成功')
emit('success') emit('success')
@ -116,6 +166,15 @@ const open = (type = 'add') => {
popupRef.value?.open() popupRef.value?.open()
} }
const fetchCollegeLists = async () => {
try {
const res = await collegeLists() //
getCollegeLists.value = res //
} catch (err) {
feedback.msgError('获取学院列表失败')
}
}
const setFormData = async (data: Record<string, any>) => { const setFormData = async (data: Record<string, any>) => {
const camelData = snakeToCamel(data) const camelData = snakeToCamel(data)
for (const key in formData) { for (const key in formData) {

View File

@ -35,7 +35,6 @@
</div> </div>
<el-table class="mt-4" size="large" v-loading="pager.loading" :data="pager.lists"> <el-table class="mt-4" size="large" v-loading="pager.loading" :data="pager.lists">
<el-table-column label="教师工号" prop="teacherCode" min-width="100" /> <el-table-column label="教师工号" prop="teacherCode" min-width="100" />
<el-table-column label="职称" prop="title" min-width="100" />
<el-table-column label="姓名" prop="name" min-width="100" /> <el-table-column label="姓名" prop="name" min-width="100" />
<el-table-column label="所属学院" prop="collegeName" min-width="100" /> <el-table-column label="所属学院" prop="collegeName" min-width="100" />
<el-table-column label="联系电话" prop="contactPhone" min-width="100" /> <el-table-column label="联系电话" prop="contactPhone" min-width="100" />