【新增】教师管理页面
This commit is contained in:
任维炳
96
src/views/exam/teacher/TeacherAssignRoleForm.vue
Normal file
96
src/views/exam/teacher/TeacherAssignRoleForm.vue
Normal file
@@ -0,0 +1,96 @@
|
|||||||
|
<template>
|
||||||
|
<Dialog v-model="dialogVisible" title="分配角色">
|
||||||
|
<el-form ref="formRef" v-loading="formLoading" :model="formData" label-width="80px">
|
||||||
|
<el-form-item label="用户名称">
|
||||||
|
<el-input v-model="formData.username" :disabled="true" />
|
||||||
|
</el-form-item>
|
||||||
|
<el-form-item label="用户昵称">
|
||||||
|
<el-input v-model="formData.nickname" :disabled="true" />
|
||||||
|
</el-form-item>
|
||||||
|
<el-form-item label="角色">
|
||||||
|
<el-select v-model="formData.roleIds" multiple placeholder="请选择角色">
|
||||||
|
<el-option v-for="item in roleList" :key="item.id" :label="item.name" :value="item.id" />
|
||||||
|
</el-select>
|
||||||
|
</el-form-item>
|
||||||
|
</el-form>
|
||||||
|
<template #footer>
|
||||||
|
<el-button :disabled="formLoading" type="primary" @click="submitForm">确 定</el-button>
|
||||||
|
<el-button @click="dialogVisible = false">取 消</el-button>
|
||||||
|
</template>
|
||||||
|
</Dialog>
|
||||||
|
</template>
|
||||||
|
<script lang="ts" setup>
|
||||||
|
import * as PermissionApi from '@/api/system/permission'
|
||||||
|
import * as UserApi from '@/api/system/user'
|
||||||
|
import * as RoleApi from '@/api/system/role'
|
||||||
|
|
||||||
|
defineOptions({ name: 'SystemUserAssignRoleForm' })
|
||||||
|
|
||||||
|
const { t } = useI18n() // 国际化
|
||||||
|
const message = useMessage() // 消息弹窗
|
||||||
|
|
||||||
|
const dialogVisible = ref(false) // 弹窗的是否展示
|
||||||
|
const formLoading = ref(false) // 表单的加载中：1）修改时的数据加载；2）提交的按钮禁用
|
||||||
|
const formData = ref({
|
||||||
|
id: -1,
|
||||||
|
nickname: '',
|
||||||
|
username: '',
|
||||||
|
roleIds: []
|
||||||
|
})
|
||||||
|
const formRef = ref() // 表单 Ref
|
||||||
|
const roleList = ref([] as RoleApi.RoleVO[]) // 角色的列表
|
||||||
|
|
||||||
|
/** 打开弹窗 */
|
||||||
|
const open = async (row: UserApi.UserVO) => {
|
||||||
|
dialogVisible.value = true
|
||||||
|
resetForm()
|
||||||
|
// 设置数据
|
||||||
|
formData.value.id = row.id
|
||||||
|
formData.value.username = row.username
|
||||||
|
formData.value.nickname = row.nickname
|
||||||
|
// 获得角色拥有的菜单集合
|
||||||
|
formLoading.value = true
|
||||||
|
try {
|
||||||
|
formData.value.roleIds = await PermissionApi.getUserRoleList(row.id)
|
||||||
|
} finally {
|
||||||
|
formLoading.value = false
|
||||||
|
}
|
||||||
|
// 获得角色列表
|
||||||
|
roleList.value = await RoleApi.getSimpleRoleList()
|
||||||
|
}
|
||||||
|
defineExpose({ open }) // 提供 open 方法，用于打开弹窗
|
||||||
|
|
||||||
|
/** 提交表单 */
|
||||||
|
const emit = defineEmits(['success']) // 定义 success 事件，用于操作成功后的回调
|
||||||
|
const submitForm = async () => {
|
||||||
|
// 校验表单
|
||||||
|
if (!formRef) return
|
||||||
|
const valid = await formRef.value.validate()
|
||||||
|
if (!valid) return
|
||||||
|
// 提交请求
|
||||||
|
formLoading.value = true
|
||||||
|
try {
|
||||||
|
await PermissionApi.assignUserRole({
|
||||||
|
userId: formData.value.id,
|
||||||
|
roleIds: formData.value.roleIds
|
||||||
|
})
|
||||||
|
message.success(t('common.updateSuccess'))
|
||||||
|
dialogVisible.value = false
|
||||||
|
// 发送操作成功的事件
|
||||||
|
emit('success', true)
|
||||||
|
} finally {
|
||||||
|
formLoading.value = false
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
/** 重置表单 */
|
||||||
|
const resetForm = () => {
|
||||||
|
formData.value = {
|
||||||
|
id: -1,
|
||||||
|
nickname: '',
|
||||||
|
username: '',
|
||||||
|
roleIds: []
|
||||||
|
}
|
||||||
|
formRef.value?.resetFields()
|
||||||
|
}
|
||||||
|
</script>
|
||||||
287
src/views/exam/teacher/TeacherForm.vue
Normal file
287
src/views/exam/teacher/TeacherForm.vue
Normal file
@@ -0,0 +1,287 @@
|
|||||||
|
<template>
|
||||||
|
<Dialog v-model="dialogVisible" :title="dialogTitle">
|
||||||
|
<el-form
|
||||||
|
ref="formRef"
|
||||||
|
v-loading="formLoading"
|
||||||
|
:model="formData"
|
||||||
|
:rules="formRules"
|
||||||
|
label-width="80px"
|
||||||
|
>
|
||||||
|
<el-row>
|
||||||
|
<el-col :span="12">
|
||||||
|
<el-form-item label="教师昵称" prop="nickname">
|
||||||
|
<el-input v-model="formData.nickname" placeholder="请输入教师昵称" />
|
||||||
|
</el-form-item>
|
||||||
|
</el-col>
|
||||||
|
<el-col :span="12">
|
||||||
|
<el-form-item label="手机号码" prop="mobile">
|
||||||
|
<el-input v-model="formData.mobile" maxlength="11" placeholder="请输入手机号码" />
|
||||||
|
</el-form-item>
|
||||||
|
</el-col>
|
||||||
|
<!-- <el-col :span="12">-->
|
||||||
|
<!-- <el-form-item label="归属部门" prop="deptId">-->
|
||||||
|
<!-- <el-tree-select-->
|
||||||
|
<!-- v-model="formData.deptId"-->
|
||||||
|
<!-- :data="deptList"-->
|
||||||
|
<!-- :props="defaultProps"-->
|
||||||
|
<!-- check-strictly-->
|
||||||
|
<!-- node-key="id"-->
|
||||||
|
<!-- placeholder="请选择归属部门"-->
|
||||||
|
<!-- />-->
|
||||||
|
<!-- </el-form-item>-->
|
||||||
|
<!-- </el-col>-->
|
||||||
|
</el-row>
|
||||||
|
<el-row>
|
||||||
|
<el-col :span="12">
|
||||||
|
<el-form-item v-if="formData.id === undefined" label="教师账号" prop="username">
|
||||||
|
<el-input v-model="formData.username" placeholder="请输入教师账号" />
|
||||||
|
</el-form-item>
|
||||||
|
</el-col>
|
||||||
|
<el-col :span="12">
|
||||||
|
<el-form-item v-if="formData.id === undefined" label="密码" prop="password">
|
||||||
|
<el-input
|
||||||
|
v-model="formData.password"
|
||||||
|
placeholder="请输入密码"
|
||||||
|
show-password
|
||||||
|
type="password"
|
||||||
|
/>
|
||||||
|
</el-form-item>
|
||||||
|
</el-col>
|
||||||
|
</el-row>
|
||||||
|
<el-row>
|
||||||
|
<el-col :span="12">
|
||||||
|
<el-form-item label="性别">
|
||||||
|
<el-select v-model="formData.sex" placeholder="请选择">
|
||||||
|
<el-option
|
||||||
|
v-for="dict in getIntDictOptions(DICT_TYPE.SYSTEM_USER_SEX)"
|
||||||
|
:key="dict.value"
|
||||||
|
:label="dict.label"
|
||||||
|
:value="dict.value"
|
||||||
|
/>
|
||||||
|
</el-select>
|
||||||
|
</el-form-item>
|
||||||
|
</el-col>
|
||||||
|
<el-col :span="12">
|
||||||
|
<el-form-item label="班级">
|
||||||
|
<el-select v-model="formData.classIds" multiple placeholder="请选择">
|
||||||
|
<el-option
|
||||||
|
v-for="item in classList"
|
||||||
|
:key="item.id"
|
||||||
|
:label="item.name"
|
||||||
|
:value="item.id!"
|
||||||
|
/>
|
||||||
|
</el-select>
|
||||||
|
</el-form-item>
|
||||||
|
</el-col>
|
||||||
|
</el-row>
|
||||||
|
<el-row>
|
||||||
|
<el-col :span="24">
|
||||||
|
<el-form-item label="备注">
|
||||||
|
<el-input v-model="formData.remark" placeholder="请输入内容" type="textarea" />
|
||||||
|
</el-form-item>
|
||||||
|
<el-form-item label="头像" prop="avatar">
|
||||||
|
<UploadImg v-model="formData.avatar" />
|
||||||
|
</el-form-item>
|
||||||
|
</el-col>
|
||||||
|
</el-row>
|
||||||
|
<el-form-item label="专业权限">
|
||||||
|
<el-card class="w-full h-400px !overflow-y-scroll" shadow="never">
|
||||||
|
<template #header>
|
||||||
|
全选/全不选:
|
||||||
|
<el-switch
|
||||||
|
v-model="treeNodeAll"
|
||||||
|
active-text="是"
|
||||||
|
inactive-text="否"
|
||||||
|
inline-prompt
|
||||||
|
@change="handleCheckedTreeNodeAll"
|
||||||
|
/>
|
||||||
|
全部展开/折叠:
|
||||||
|
<el-switch
|
||||||
|
v-model="menuExpand"
|
||||||
|
active-text="展开"
|
||||||
|
inactive-text="折叠"
|
||||||
|
inline-prompt
|
||||||
|
@change="handleCheckedTreeExpand"
|
||||||
|
/>
|
||||||
|
</template>
|
||||||
|
<el-tree
|
||||||
|
ref="treeRef"
|
||||||
|
:data="menuOptions"
|
||||||
|
:props="defaultProps"
|
||||||
|
empty-text="加载中，请稍候"
|
||||||
|
node-key="id"
|
||||||
|
show-checkbox
|
||||||
|
/>
|
||||||
|
</el-card>
|
||||||
|
</el-form-item>
|
||||||
|
</el-form>
|
||||||
|
<template #footer>
|
||||||
|
<el-button :disabled="formLoading" type="primary" @click="submitForm">确 定</el-button>
|
||||||
|
<el-button @click="dialogVisible = false">取 消</el-button>
|
||||||
|
</template>
|
||||||
|
</Dialog>
|
||||||
|
</template>
|
||||||
|
<script lang="ts" setup>
|
||||||
|
import { DICT_TYPE, getIntDictOptions } from '@/utils/dict'
|
||||||
|
import { CommonStatusEnum } from '@/utils/constants'
|
||||||
|
import {defaultProps, handleTree} from '@/utils/tree'
|
||||||
|
import * as DeptApi from '@/api/system/dept'
|
||||||
|
import * as UserApi from '@/api/system/user'
|
||||||
|
import * as ClassApi from '@/api/exam/class'
|
||||||
|
import * as SpecialtyApi from '@/api/exam/specialty'
|
||||||
|
|
||||||
|
import { FormRules } from 'element-plus'
|
||||||
|
import * as PermissionApi from "@/api/system/permission";
|
||||||
|
|
||||||
|
defineOptions({ name: 'SystemUserForm' })
|
||||||
|
const treeNodeAll = ref(false) // 全选/全不选
|
||||||
|
const menuExpand = ref(false) // 展开/折叠
|
||||||
|
const treeRef = ref() // 菜单树组件 Ref
|
||||||
|
const { t } = useI18n() // 国际化
|
||||||
|
const message = useMessage() // 消息弹窗
|
||||||
|
const menuOptions = ref<any[]>([]) // 菜单树形结构
|
||||||
|
const dialogVisible = ref(false) // 弹窗的是否展示
|
||||||
|
const dialogTitle = ref('') // 弹窗的标题
|
||||||
|
const formLoading = ref(false) // 表单的加载中：1）修改时的数据加载；2）提交的按钮禁用
|
||||||
|
const formType = ref('') // 表单的类型：create - 新增；update - 修改
|
||||||
|
const formData = ref({
|
||||||
|
userType: '1',
|
||||||
|
nickname: '',
|
||||||
|
deptId: '',
|
||||||
|
mobile: '',
|
||||||
|
email: '',
|
||||||
|
id: undefined,
|
||||||
|
username: '',
|
||||||
|
password: '',
|
||||||
|
sex: undefined,
|
||||||
|
classIds: [],
|
||||||
|
remark: '',
|
||||||
|
avatar: '',
|
||||||
|
status: CommonStatusEnum.ENABLE,
|
||||||
|
roleIds: [],
|
||||||
|
specialtyIds: []
|
||||||
|
})
|
||||||
|
const formRules = reactive<FormRules>({
|
||||||
|
username: [{ required: true, message: '教师名称不能为空', trigger: 'blur' }],
|
||||||
|
nickname: [{ required: true, message: '教师昵称不能为空', trigger: 'blur' }],
|
||||||
|
password: [{ required: true, message: '教师密码不能为空', trigger: 'blur' }],
|
||||||
|
mobile: [
|
||||||
|
{
|
||||||
|
pattern: /^(?:(?:\+|00)86)?1(?:3[\d]|4[5-79]|5[0-35-9]|6[5-7]|7[0-8]|8[\d]|9[189])\d{8}$/,
|
||||||
|
message: '请输入正确的手机号码',
|
||||||
|
trigger: 'blur'
|
||||||
|
}
|
||||||
|
]
|
||||||
|
})
|
||||||
|
const formRef = ref() // 表单 Ref
|
||||||
|
const deptList = ref<Tree[]>([]) // 树形结构
|
||||||
|
const classList = ref([] as ClassApi.ClassIdVO[] ) // 岗位列表
|
||||||
|
|
||||||
|
/** 打开弹窗 */
|
||||||
|
const open = async (type: string, id?: number) => {
|
||||||
|
dialogVisible.value = true
|
||||||
|
dialogTitle.value = t('action.' + type)
|
||||||
|
formType.value = type
|
||||||
|
resetForm()
|
||||||
|
// 加载 Menu 列表。注意，必须放在前面，不然下面 setChecked 没数据节点
|
||||||
|
menuOptions.value = handleTree(await SpecialtyApi.getSpecialtyPart())
|
||||||
|
|
||||||
|
// 修改时，设置数据
|
||||||
|
if (id) {
|
||||||
|
formLoading.value = true
|
||||||
|
try {
|
||||||
|
formData.value = await UserApi.getUser(id)
|
||||||
|
try {
|
||||||
|
formData.value.specialtyIds = await PermissionApi.getTeacherSpecialtyList(id)
|
||||||
|
// 设置选中
|
||||||
|
formData.value.specialtyIds.forEach((menuId: number) => {
|
||||||
|
treeRef.value.setChecked(menuId, true, false)
|
||||||
|
})
|
||||||
|
} finally {
|
||||||
|
formLoading.value = false
|
||||||
|
}
|
||||||
|
} finally {
|
||||||
|
formLoading.value = false
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
// 加载部门树
|
||||||
|
deptList.value = handleTree(await DeptApi.getSimpleDeptList())
|
||||||
|
// 加载岗位列表
|
||||||
|
classList.value = await ClassApi.ClassApi.getClassIdName()
|
||||||
|
}
|
||||||
|
|
||||||
|
defineExpose({ open }) // 提供 open 方法，用于打开弹窗
|
||||||
|
|
||||||
|
/** 提交表单 */
|
||||||
|
const emit = defineEmits(['success']) // 定义 success 事件，用于操作成功后的回调
|
||||||
|
const submitForm = async () => {
|
||||||
|
// 校验表单
|
||||||
|
if (!formRef) return
|
||||||
|
const valid = await formRef.value.validate()
|
||||||
|
formData.value.userType = "1"
|
||||||
|
if (!valid) return
|
||||||
|
// 提交请求
|
||||||
|
formLoading.value = true
|
||||||
|
try {
|
||||||
|
const datas = {
|
||||||
|
menuIds: [
|
||||||
|
...(treeRef.value.getCheckedKeys(false) as unknown as Array<number>), // 获得当前选中节点
|
||||||
|
...(treeRef.value.getHalfCheckedKeys() as unknown as Array<number>) // 获得半选中的父节点
|
||||||
|
]
|
||||||
|
}
|
||||||
|
formData.value.specialtyIds = datas.menuIds
|
||||||
|
console.log(formData.value)
|
||||||
|
const data = formData.value as unknown as UserApi.UserVO
|
||||||
|
if (formType.value === 'create') {
|
||||||
|
await UserApi.createTeacher(data)
|
||||||
|
message.success(t('common.createSuccess'))
|
||||||
|
} else {
|
||||||
|
await UserApi.updateTeacher(data)
|
||||||
|
message.success(t('common.updateSuccess'))
|
||||||
|
}
|
||||||
|
dialogVisible.value = false
|
||||||
|
// 发送操作成功的事件
|
||||||
|
emit('success')
|
||||||
|
} finally {
|
||||||
|
formLoading.value = false
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
/** 重置表单 */
|
||||||
|
const resetForm = () => {
|
||||||
|
formData.value = {
|
||||||
|
userType: '0',
|
||||||
|
nickname: '',
|
||||||
|
deptId: '',
|
||||||
|
mobile: '',
|
||||||
|
email: '',
|
||||||
|
id: undefined,
|
||||||
|
username: '',
|
||||||
|
password: '',
|
||||||
|
sex: undefined,
|
||||||
|
postIds: [],
|
||||||
|
remark: '',
|
||||||
|
status: CommonStatusEnum.ENABLE,
|
||||||
|
roleIds: [],
|
||||||
|
specialtyIds: []
|
||||||
|
}
|
||||||
|
treeNodeAll.value = false
|
||||||
|
formRef.value?.resetFields()
|
||||||
|
}
|
||||||
|
/** 全选/全不选 */
|
||||||
|
const handleCheckedTreeNodeAll = () => {
|
||||||
|
treeRef.value.setCheckedNodes(treeNodeAll.value ? menuOptions.value : [])
|
||||||
|
}
|
||||||
|
|
||||||
|
/** 展开/折叠全部 */
|
||||||
|
const handleCheckedTreeExpand = () => {
|
||||||
|
const nodes = treeRef.value?.store.nodesMap
|
||||||
|
for (let node in nodes) {
|
||||||
|
if (nodes[node].expanded === menuExpand.value) {
|
||||||
|
continue
|
||||||
|
}
|
||||||
|
nodes[node].expanded = menuExpand.value
|
||||||
|
}
|
||||||
|
}
|
||||||
|
</script>
|
||||||
138
src/views/exam/teacher/TeacherImportForm.vue
Normal file
138
src/views/exam/teacher/TeacherImportForm.vue
Normal file
@@ -0,0 +1,138 @@
|
|||||||
|
<template>
|
||||||
|
<Dialog v-model="dialogVisible" title="用户导入" width="400">
|
||||||
|
<el-upload
|
||||||
|
ref="uploadRef"
|
||||||
|
v-model:file-list="fileList"
|
||||||
|
:action="importUrl + '?updateSupport=' + updateSupport"
|
||||||
|
:auto-upload="false"
|
||||||
|
:disabled="formLoading"
|
||||||
|
:headers="uploadHeaders"
|
||||||
|
:limit="1"
|
||||||
|
:on-error="submitFormError"
|
||||||
|
:on-exceed="handleExceed"
|
||||||
|
:on-success="submitFormSuccess"
|
||||||
|
accept=".xlsx, .xls"
|
||||||
|
drag
|
||||||
|
>
|
||||||
|
<Icon icon="ep:upload" />
|
||||||
|
<div class="el-upload__text">将文件拖到此处，或<em>点击上传</em></div>
|
||||||
|
<template #tip>
|
||||||
|
<div class="el-upload__tip text-center">
|
||||||
|
<div class="el-upload__tip">
|
||||||
|
<el-checkbox v-model="updateSupport" />
|
||||||
|
是否更新已经存在的用户数据
|
||||||
|
</div>
|
||||||
|
<span>仅允许导入 xls、xlsx 格式文件。</span>
|
||||||
|
<el-link
|
||||||
|
:underline="false"
|
||||||
|
style="font-size: 12px; vertical-align: baseline"
|
||||||
|
type="primary"
|
||||||
|
@click="importTemplate"
|
||||||
|
>
|
||||||
|
下载模板
|
||||||
|
</el-link>
|
||||||
|
</div>
|
||||||
|
</template>
|
||||||
|
</el-upload>
|
||||||
|
<template #footer>
|
||||||
|
<el-button :disabled="formLoading" type="primary" @click="submitForm">确 定</el-button>
|
||||||
|
<el-button @click="dialogVisible = false">取 消</el-button>
|
||||||
|
</template>
|
||||||
|
</Dialog>
|
||||||
|
</template>
|
||||||
|
<script lang="ts" setup>
|
||||||
|
import * as UserApi from '@/api/system/user'
|
||||||
|
import { getAccessToken, getTenantId } from '@/utils/auth'
|
||||||
|
import download from '@/utils/download'
|
||||||
|
|
||||||
|
defineOptions({ name: 'SystemUserImportForm' })
|
||||||
|
|
||||||
|
const message = useMessage() // 消息弹窗
|
||||||
|
|
||||||
|
const dialogVisible = ref(false) // 弹窗的是否展示
|
||||||
|
const formLoading = ref(false) // 表单的加载中
|
||||||
|
const uploadRef = ref()
|
||||||
|
const importUrl =
|
||||||
|
import.meta.env.VITE_BASE_URL + import.meta.env.VITE_API_URL + '/system/student/import'
|
||||||
|
const uploadHeaders = ref() // 上传 Header 头
|
||||||
|
const fileList = ref([]) // 文件列表
|
||||||
|
const updateSupport = ref(0) // 是否更新已经存在的用户数据
|
||||||
|
|
||||||
|
/** 打开弹窗 */
|
||||||
|
const open = () => {
|
||||||
|
dialogVisible.value = true
|
||||||
|
updateSupport.value = 0
|
||||||
|
fileList.value = []
|
||||||
|
resetForm()
|
||||||
|
}
|
||||||
|
defineExpose({ open }) // 提供 open 方法，用于打开弹窗
|
||||||
|
|
||||||
|
/** 提交表单 */
|
||||||
|
const submitForm = async () => {
|
||||||
|
if (fileList.value.length == 0) {
|
||||||
|
message.error('请上传文件')
|
||||||
|
return
|
||||||
|
}
|
||||||
|
// 提交请求
|
||||||
|
uploadHeaders.value = {
|
||||||
|
Authorization: 'Bearer ' + getAccessToken(),
|
||||||
|
'tenant-id': getTenantId()
|
||||||
|
}
|
||||||
|
formLoading.value = true
|
||||||
|
uploadRef.value!.submit()
|
||||||
|
}
|
||||||
|
|
||||||
|
/** 文件上传成功 */
|
||||||
|
const emits = defineEmits(['success'])
|
||||||
|
const submitFormSuccess = (response: any) => {
|
||||||
|
if (response.code !== 0) {
|
||||||
|
message.error(response.msg)
|
||||||
|
formLoading.value = false
|
||||||
|
return
|
||||||
|
}
|
||||||
|
// 拼接提示语
|
||||||
|
const data = response.data
|
||||||
|
let text = '上传成功数量：' + data.createUsernames.length + ';'
|
||||||
|
for (let username of data.createUsernames) {
|
||||||
|
text += '< ' + username + ' >'
|
||||||
|
}
|
||||||
|
text += '更新成功数量：' + data.updateUsernames.length + ';'
|
||||||
|
for (const username of data.updateUsernames) {
|
||||||
|
text += '< ' + username + ' >'
|
||||||
|
}
|
||||||
|
text += '更新失败数量：' + Object.keys(data.failureUsernames).length + ';'
|
||||||
|
for (const username in data.failureUsernames) {
|
||||||
|
text += '< ' + username + ': ' + data.failureUsernames[username] + ' >'
|
||||||
|
}
|
||||||
|
message.alert(text)
|
||||||
|
formLoading.value = false
|
||||||
|
dialogVisible.value = false
|
||||||
|
// 发送操作成功的事件
|
||||||
|
emits('success')
|
||||||
|
}
|
||||||
|
|
||||||
|
/** 上传错误提示 */
|
||||||
|
const submitFormError = (): void => {
|
||||||
|
message.error('上传失败，请您重新上传！')
|
||||||
|
formLoading.value = false
|
||||||
|
}
|
||||||
|
|
||||||
|
/** 重置表单 */
|
||||||
|
const resetForm = async (): Promise<void> => {
|
||||||
|
// 重置上传状态和文件
|
||||||
|
formLoading.value = false
|
||||||
|
await nextTick()
|
||||||
|
uploadRef.value?.clearFiles()
|
||||||
|
}
|
||||||
|
|
||||||
|
/** 文件数超出提示 */
|
||||||
|
const handleExceed = (): void => {
|
||||||
|
message.error('最多只能上传一个文件！')
|
||||||
|
}
|
||||||
|
|
||||||
|
/** 下载模板操作 */
|
||||||
|
const importTemplate = async () => {
|
||||||
|
const res = await UserApi.importUserTemplate()
|
||||||
|
download.excel(res, '用户导入模版.xls')
|
||||||
|
}
|
||||||
|
</script>
|
||||||
324
src/views/exam/teacher/index.vue
Normal file
324
src/views/exam/teacher/index.vue
Normal file
@@ -0,0 +1,324 @@
|
|||||||
|
<template>
|
||||||
|
<!-- 搜索 -->
|
||||||
|
<ContentWrap>
|
||||||
|
<el-form
|
||||||
|
class="-mb-15px"
|
||||||
|
:model="queryParams"
|
||||||
|
ref="queryFormRef"
|
||||||
|
:inline="true"
|
||||||
|
label-width="68px"
|
||||||
|
>
|
||||||
|
<el-form-item label="教师名称" prop="username">
|
||||||
|
<el-input
|
||||||
|
v-model="queryParams.username"
|
||||||
|
placeholder="请输入教师名称"
|
||||||
|
clearable
|
||||||
|
@keyup.enter="handleQuery"
|
||||||
|
class="!w-240px"
|
||||||
|
/>
|
||||||
|
</el-form-item>
|
||||||
|
<el-form-item label="手机号码" prop="mobile">
|
||||||
|
<el-input
|
||||||
|
v-model="queryParams.mobile"
|
||||||
|
placeholder="请输入手机号码"
|
||||||
|
clearable
|
||||||
|
@keyup.enter="handleQuery"
|
||||||
|
class="!w-240px"
|
||||||
|
/>
|
||||||
|
</el-form-item>
|
||||||
|
<el-form-item label="状态" prop="status">
|
||||||
|
<el-select
|
||||||
|
v-model="queryParams.status"
|
||||||
|
placeholder="请选择教师状态"
|
||||||
|
clearable
|
||||||
|
class="!w-240px"
|
||||||
|
>
|
||||||
|
<el-option
|
||||||
|
v-for="dict in getIntDictOptions(DICT_TYPE.COMMON_STATUS)"
|
||||||
|
:key="dict.value"
|
||||||
|
:label="dict.label"
|
||||||
|
:value="dict.value"
|
||||||
|
/>
|
||||||
|
</el-select>
|
||||||
|
</el-form-item>
|
||||||
|
<!-- <el-form-item label="创建时间" prop="createTime">-->
|
||||||
|
<!-- <el-date-picker-->
|
||||||
|
<!-- v-model="queryParams.createTime"-->
|
||||||
|
<!-- value-format="YYYY-MM-DD HH:mm:ss"-->
|
||||||
|
<!-- type="datetimerange"-->
|
||||||
|
<!-- start-placeholder="开始日期"-->
|
||||||
|
<!-- end-placeholder="结束日期"-->
|
||||||
|
<!-- class="!w-240px"-->
|
||||||
|
<!-- />-->
|
||||||
|
<!-- </el-form-item>-->
|
||||||
|
<el-form-item>
|
||||||
|
<el-button @click="handleQuery"><Icon icon="ep:search" />搜索</el-button>
|
||||||
|
<el-button @click="resetQuery"><Icon icon="ep:refresh" />重置</el-button>
|
||||||
|
<el-button
|
||||||
|
type="primary"
|
||||||
|
plain
|
||||||
|
@click="openForm('create')"
|
||||||
|
>
|
||||||
|
<Icon icon="ep:plus" /> 新增
|
||||||
|
</el-button>
|
||||||
|
<el-button
|
||||||
|
type="warning"
|
||||||
|
plain
|
||||||
|
@click="handleImport"
|
||||||
|
>
|
||||||
|
<Icon icon="ep:upload" /> 导入
|
||||||
|
</el-button>
|
||||||
|
<el-button
|
||||||
|
type="success"
|
||||||
|
plain
|
||||||
|
@click="handleExport"
|
||||||
|
:loading="exportLoading"
|
||||||
|
>
|
||||||
|
<Icon icon="ep:download" />导出
|
||||||
|
</el-button>
|
||||||
|
</el-form-item>
|
||||||
|
</el-form>
|
||||||
|
</ContentWrap>
|
||||||
|
<ContentWrap>
|
||||||
|
<el-table v-loading="loading" :data="list">
|
||||||
|
<el-table-column label="教师编号" align="center" key="id" prop="id" />
|
||||||
|
<el-table-column
|
||||||
|
label="教师账号"
|
||||||
|
align="center"
|
||||||
|
prop="username"
|
||||||
|
:show-overflow-tooltip="true"
|
||||||
|
/>
|
||||||
|
<el-table-column
|
||||||
|
label="教师昵称"
|
||||||
|
align="center"
|
||||||
|
prop="nickname"
|
||||||
|
:show-overflow-tooltip="true"
|
||||||
|
/>
|
||||||
|
<el-table-column label="手机号码" align="center" prop="mobile" width="120" />
|
||||||
|
<el-table-column label="状态" key="status" align="center" >
|
||||||
|
<template #default="scope">
|
||||||
|
<el-switch
|
||||||
|
v-model="scope.row.status"
|
||||||
|
:active-value="0"
|
||||||
|
:inactive-value="1"
|
||||||
|
@change="handleStatusChange(scope.row)"
|
||||||
|
/>
|
||||||
|
</template>
|
||||||
|
</el-table-column>
|
||||||
|
<el-table-column
|
||||||
|
label="创建时间"
|
||||||
|
align="center"
|
||||||
|
prop="createTime"
|
||||||
|
:formatter="dateFormatter"
|
||||||
|
width="180"
|
||||||
|
/>
|
||||||
|
<el-table-column label="操作" align="center" width="260">
|
||||||
|
<template #default="scope">
|
||||||
|
<div class="flex items-center justify-center">
|
||||||
|
<el-button
|
||||||
|
type="primary"
|
||||||
|
link
|
||||||
|
@click="openForm('update', scope.row.id)"
|
||||||
|
>
|
||||||
|
<Icon icon="ep:edit" />修改
|
||||||
|
</el-button>
|
||||||
|
<el-dropdown
|
||||||
|
@command="(command) => handleCommand(command, scope.row)"
|
||||||
|
>
|
||||||
|
<el-button type="primary" link><Icon icon="ep:d-arrow-right" /> 更多</el-button>
|
||||||
|
<template #dropdown>
|
||||||
|
<el-dropdown-menu>
|
||||||
|
<el-dropdown-item
|
||||||
|
command="handleDelete"
|
||||||
|
>
|
||||||
|
<Icon icon="ep:delete" />删除
|
||||||
|
</el-dropdown-item>
|
||||||
|
<el-dropdown-item
|
||||||
|
command="handleResetPwd"
|
||||||
|
>
|
||||||
|
<Icon icon="ep:key" />重置密码
|
||||||
|
</el-dropdown-item>
|
||||||
|
<el-dropdown-item
|
||||||
|
command="handleRole"
|
||||||
|
>
|
||||||
|
<Icon icon="ep:circle-check" />分配角色
|
||||||
|
</el-dropdown-item>
|
||||||
|
</el-dropdown-menu>
|
||||||
|
</template>
|
||||||
|
</el-dropdown>
|
||||||
|
</div>
|
||||||
|
</template>
|
||||||
|
</el-table-column>
|
||||||
|
</el-table>
|
||||||
|
<Pagination
|
||||||
|
:total="total"
|
||||||
|
v-model:page="queryParams.pageNo"
|
||||||
|
v-model:limit="queryParams.pageSize"
|
||||||
|
@pagination="getList"
|
||||||
|
/>
|
||||||
|
</ContentWrap>
|
||||||
|
|
||||||
|
<!-- 添加或修改用户对话框 -->
|
||||||
|
<TeacherForm ref="formRef" @success="getList" />
|
||||||
|
<!-- 用户导入对话框 -->
|
||||||
|
<TeacherImportForm ref="importFormRef" @success="getList" />
|
||||||
|
<!-- 分配角色 -->
|
||||||
|
<TeacherAssignRoleForm ref="assignRoleFormRef" @success="getList" />
|
||||||
|
</template>
|
||||||
|
<script lang="ts" setup>
|
||||||
|
import { DICT_TYPE, getIntDictOptions } from '@/utils/dict'
|
||||||
|
import { dateFormatter } from '@/utils/formatTime'
|
||||||
|
import download from '@/utils/download'
|
||||||
|
import { CommonStatusEnum } from '@/utils/constants'
|
||||||
|
import * as UserApi from '@/api/system/user'
|
||||||
|
import TeacherForm from './TeacherForm.vue'
|
||||||
|
import TeacherImportForm from './TeacherImportForm.vue'
|
||||||
|
import TeacherAssignRoleForm from './TeacherAssignRoleForm.vue'
|
||||||
|
|
||||||
|
defineOptions({ name: 'SystemUser' })
|
||||||
|
|
||||||
|
const message = useMessage() // 消息弹窗
|
||||||
|
const { t } = useI18n() // 国际化
|
||||||
|
|
||||||
|
const loading = ref(true) // 列表的加载中
|
||||||
|
const total = ref(0) // 列表的总页数
|
||||||
|
const list = ref([]) // 列表的数
|
||||||
|
const queryParams = reactive({
|
||||||
|
pageNo: 1,
|
||||||
|
pageSize: 10,
|
||||||
|
userType: "1",
|
||||||
|
username: undefined,
|
||||||
|
mobile: undefined,
|
||||||
|
status: undefined,
|
||||||
|
deptId: undefined,
|
||||||
|
createTime: []
|
||||||
|
})
|
||||||
|
const queryFormRef = ref() // 搜索的表单
|
||||||
|
|
||||||
|
/** 查询列表 */
|
||||||
|
const getList = async () => {
|
||||||
|
loading.value = true
|
||||||
|
try {
|
||||||
|
const data = await UserApi.getUserPage(queryParams)
|
||||||
|
list.value = data.list
|
||||||
|
total.value = data.total
|
||||||
|
} finally {
|
||||||
|
loading.value = false
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
/** 搜索按钮操作 */
|
||||||
|
const handleQuery = () => {
|
||||||
|
queryParams.pageNo = 1
|
||||||
|
getList()
|
||||||
|
}
|
||||||
|
|
||||||
|
/** 重置按钮操作 */
|
||||||
|
const resetQuery = () => {
|
||||||
|
queryFormRef.value?.resetFields()
|
||||||
|
handleQuery()
|
||||||
|
}
|
||||||
|
|
||||||
|
/** 添加/修改操作 */
|
||||||
|
const formRef = ref()
|
||||||
|
const openForm = (type: string, id?: number) => {
|
||||||
|
formRef.value.open(type, id)
|
||||||
|
}
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
/** 用户导入 */
|
||||||
|
const importFormRef = ref()
|
||||||
|
const handleImport = () => {
|
||||||
|
importFormRef.value.open()
|
||||||
|
}
|
||||||
|
|
||||||
|
/** 修改用户状态 */
|
||||||
|
const handleStatusChange = async (row: UserApi.UserVO) => {
|
||||||
|
try {
|
||||||
|
// 修改状态的二次确认
|
||||||
|
const text = row.status === CommonStatusEnum.ENABLE ? '启用' : '停用'
|
||||||
|
await message.confirm('确认要"' + text + '""' + row.username + '"用户吗?')
|
||||||
|
// 发起修改状态
|
||||||
|
await UserApi.updateUserStatus(row.id, row.status)
|
||||||
|
// 刷新列表
|
||||||
|
await getList()
|
||||||
|
} catch {
|
||||||
|
// 取消后，进行恢复按钮
|
||||||
|
row.status =
|
||||||
|
row.status === CommonStatusEnum.ENABLE ? CommonStatusEnum.DISABLE : CommonStatusEnum.ENABLE
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
/** 导出按钮操作 */
|
||||||
|
const exportLoading = ref(false)
|
||||||
|
const handleExport = async () => {
|
||||||
|
try {
|
||||||
|
// 导出的二次确认
|
||||||
|
await message.exportConfirm()
|
||||||
|
// 发起导出
|
||||||
|
exportLoading.value = true
|
||||||
|
const data = await UserApi.exportUser(queryParams)
|
||||||
|
download.excel(data, '用户数据.xls')
|
||||||
|
} catch {
|
||||||
|
} finally {
|
||||||
|
exportLoading.value = false
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
/** 操作分发 */
|
||||||
|
const handleCommand = (command: string, row: UserApi.UserVO) => {
|
||||||
|
switch (command) {
|
||||||
|
case 'handleDelete':
|
||||||
|
handleDelete(row.id)
|
||||||
|
break
|
||||||
|
case 'handleResetPwd':
|
||||||
|
handleResetPwd(row)
|
||||||
|
break
|
||||||
|
case 'handleRole':
|
||||||
|
handleRole(row)
|
||||||
|
break
|
||||||
|
default:
|
||||||
|
break
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
/** 删除按钮操作 */
|
||||||
|
const handleDelete = async (id: number) => {
|
||||||
|
try {
|
||||||
|
// 删除的二次确认
|
||||||
|
await message.delConfirm()
|
||||||
|
// 发起删除
|
||||||
|
await UserApi.deleteUser(id)
|
||||||
|
message.success(t('common.delSuccess'))
|
||||||
|
// 刷新列表
|
||||||
|
await getList()
|
||||||
|
} catch {}
|
||||||
|
}
|
||||||
|
|
||||||
|
/** 重置密码 */
|
||||||
|
const handleResetPwd = async (row: UserApi.UserVO) => {
|
||||||
|
try {
|
||||||
|
// 重置的二次确认
|
||||||
|
const result = await message.prompt(
|
||||||
|
'请输入"' + row.username + '"的新密码',
|
||||||
|
t('common.reminder')
|
||||||
|
)
|
||||||
|
const password = result.value
|
||||||
|
// 发起重置
|
||||||
|
await UserApi.resetUserPassword(row.id, password)
|
||||||
|
message.success('修改成功，新密码是：' + password)
|
||||||
|
} catch {}
|
||||||
|
}
|
||||||
|
|
||||||
|
/** 分配角色 */
|
||||||
|
const assignRoleFormRef = ref()
|
||||||
|
const handleRole = (row: UserApi.UserVO) => {
|
||||||
|
assignRoleFormRef.value.open(row)
|
||||||
|
}
|
||||||
|
|
||||||
|
/** 初始化 */
|
||||||
|
onMounted(() => {
|
||||||
|
getList()
|
||||||
|
})
|
||||||
|
</script>
|
||||||
Reference in New Issue
Block a user