新增功能
This commit is contained in:
@@ -0,0 +1,442 @@
|
||||
<template>
|
||||
<div class="edit-drawer">
|
||||
<el-drawer
|
||||
v-model="visible"
|
||||
:title="drawerTitle"
|
||||
direction="rtl"
|
||||
size="780px"
|
||||
:before-close="handleClose"
|
||||
>
|
||||
<el-form ref="formRef" :model="formData" label-width="100px" :rules="formRules">
|
||||
<el-divider content-position="left">基本信息</el-divider>
|
||||
|
||||
<!-- 医助创建诊单数(仅编辑时显示) -->
|
||||
<el-form-item v-if="mode === 'edit' && formData.diagnosis_count != null" label="创建诊单数">
|
||||
<span class="text-primary font-medium">{{ formData.diagnosis_count }}</span>
|
||||
<span class="text-tx-secondary text-sm ml-2">条</span>
|
||||
</el-form-item>
|
||||
|
||||
<!-- 账号输入框 -->
|
||||
<el-form-item label="账号" prop="account">
|
||||
<el-input
|
||||
v-model="formData.account"
|
||||
placeholder="请输入账号"
|
||||
clearable
|
||||
/>
|
||||
</el-form-item>
|
||||
|
||||
<!-- 医生头像 -->
|
||||
<el-form-item label="头像">
|
||||
<div>
|
||||
<div>
|
||||
<material-picker v-model="formData.avatar" :limit="1" />
|
||||
</div>
|
||||
<div class="form-tips">建议尺寸:100*100px,支持jpg,jpeg,png格式</div>
|
||||
</div>
|
||||
</el-form-item>
|
||||
|
||||
<!-- 姓名输入框 -->
|
||||
<el-form-item label="姓名" prop="name">
|
||||
<el-input v-model="formData.name" placeholder="请输入姓名" clearable />
|
||||
</el-form-item>
|
||||
|
||||
<!-- 性别 -->
|
||||
<el-form-item label="性别" prop="gender">
|
||||
<el-radio-group v-model="formData.gender">
|
||||
<el-radio :label="1">男</el-radio>
|
||||
<el-radio :label="2">女</el-radio>
|
||||
</el-radio-group>
|
||||
</el-form-item>
|
||||
|
||||
<!-- 年龄 -->
|
||||
<el-form-item label="年龄" prop="age">
|
||||
<el-input-number v-model="formData.age" :min="18" :max="100" placeholder="请输入年龄" />
|
||||
</el-form-item>
|
||||
|
||||
<!-- 手机号输入框 -->
|
||||
<el-form-item label="手机号" prop="phone">
|
||||
<el-input v-model="formData.phone" placeholder="请输入手机号" clearable />
|
||||
</el-form-item>
|
||||
|
||||
<el-divider content-position="left">组织信息</el-divider>
|
||||
|
||||
<!-- 归属部门 -->
|
||||
<el-form-item label="归属部门" prop="dept_id">
|
||||
<el-tree-select
|
||||
class="flex-1"
|
||||
v-model="formData.dept_id"
|
||||
:data="optionsData.dept"
|
||||
clearable
|
||||
multiple
|
||||
node-key="id"
|
||||
:props="{
|
||||
label: 'name',
|
||||
disabled(data: any) {
|
||||
return data.status !== 1
|
||||
}
|
||||
}"
|
||||
check-strictly
|
||||
:default-expand-all="true"
|
||||
placeholder="请选择归属部门"
|
||||
/>
|
||||
</el-form-item>
|
||||
|
||||
<!-- 岗位 -->
|
||||
<el-form-item label="岗位" prop="jobs_id">
|
||||
<el-select
|
||||
class="flex-1"
|
||||
v-model="formData.jobs_id"
|
||||
clearable
|
||||
multiple
|
||||
placeholder="请选择岗位"
|
||||
>
|
||||
<el-option
|
||||
v-for="(item, index) in optionsData.jobs"
|
||||
:key="index"
|
||||
:label="item.name"
|
||||
:value="item.id"
|
||||
/>
|
||||
</el-select>
|
||||
</el-form-item>
|
||||
|
||||
<el-divider content-position="left">专业信息</el-divider>
|
||||
|
||||
<!-- 职称 -->
|
||||
<el-form-item label="职称" prop="title">
|
||||
<el-input v-model="formData.title" placeholder="如:主任医师、副主任医师" clearable />
|
||||
</el-form-item>
|
||||
|
||||
<!-- 所属科室 -->
|
||||
<el-form-item label="所属科室" prop="department">
|
||||
<el-input v-model="formData.department" placeholder="如:中医科、内科" clearable />
|
||||
</el-form-item>
|
||||
|
||||
<!-- 擅长领域 -->
|
||||
<el-form-item label="擅长领域" prop="specialty">
|
||||
<el-input
|
||||
v-model="formData.specialty"
|
||||
type="textarea"
|
||||
:rows="3"
|
||||
placeholder="请输入擅长领域"
|
||||
/>
|
||||
</el-form-item>
|
||||
|
||||
<el-divider content-position="left">履历信息</el-divider>
|
||||
|
||||
<!-- 教育背景 -->
|
||||
<el-form-item label="教育背景" prop="education">
|
||||
<el-input
|
||||
v-model="formData.education"
|
||||
type="textarea"
|
||||
:rows="3"
|
||||
placeholder="请输入教育背景,如:北京中医药大学 中医学博士"
|
||||
/>
|
||||
</el-form-item>
|
||||
|
||||
<!-- 工作经历 -->
|
||||
<el-form-item label="工作经历" prop="experience">
|
||||
<el-input
|
||||
v-model="formData.experience"
|
||||
type="textarea"
|
||||
:rows="4"
|
||||
placeholder="请输入工作经历"
|
||||
/>
|
||||
</el-form-item>
|
||||
|
||||
<!-- 荣誉资质 -->
|
||||
<el-form-item label="荣誉资质" prop="honors">
|
||||
<el-input
|
||||
v-model="formData.honors"
|
||||
type="textarea"
|
||||
:rows="3"
|
||||
placeholder="请输入荣誉资质"
|
||||
/>
|
||||
</el-form-item>
|
||||
|
||||
<el-divider content-position="left">账号设置</el-divider>
|
||||
|
||||
<!-- 密码输入框 -->
|
||||
<el-form-item label="密码" prop="password">
|
||||
<el-input
|
||||
v-model="formData.password"
|
||||
show-password
|
||||
clearable
|
||||
:placeholder="mode === 'edit' ? '不修改请留空' : '请输入密码'"
|
||||
/>
|
||||
</el-form-item>
|
||||
|
||||
<!-- 确认密码输入框 -->
|
||||
<el-form-item label="确认密码" prop="password_confirm">
|
||||
<el-input
|
||||
v-model="formData.password_confirm"
|
||||
show-password
|
||||
clearable
|
||||
:placeholder="mode === 'edit' ? '不修改请留空' : '请输入确认密码'"
|
||||
/>
|
||||
</el-form-item>
|
||||
|
||||
<!-- 医生状态 -->
|
||||
<el-form-item label="医生状态">
|
||||
<el-switch v-model="formData.disable" :active-value="0" :inactive-value="1" />
|
||||
<span class="ml-2 text-gray-500">{{ formData.disable === 0 ? '启用' : '禁用' }}</span>
|
||||
</el-form-item>
|
||||
|
||||
<!-- 多处登录 -->
|
||||
<el-form-item label="多处登录">
|
||||
<div>
|
||||
<el-switch
|
||||
v-model="formData.multipoint_login"
|
||||
:active-value="1"
|
||||
:inactive-value="0"
|
||||
/>
|
||||
<div class="form-tips">允许多人同时在线登录</div>
|
||||
</div>
|
||||
</el-form-item>
|
||||
</el-form>
|
||||
|
||||
<template #footer>
|
||||
<div class="flex justify-end">
|
||||
<el-button @click="handleClose">取消</el-button>
|
||||
<el-button type="primary" @click="handleSubmit" :loading="loading">确定</el-button>
|
||||
</div>
|
||||
</template>
|
||||
</el-drawer>
|
||||
</div>
|
||||
</template>
|
||||
|
||||
<script lang="ts" setup>
|
||||
import type { FormInstance } from 'element-plus'
|
||||
import { adminAdd, adminDetail, adminEdit } from '@/api/perms/admin'
|
||||
import { deptAll } from '@/api/org/department'
|
||||
import { jobsAll } from '@/api/org/post'
|
||||
import { useDictOptions } from '@/hooks/useDictOptions'
|
||||
import feedback from '@/utils/feedback'
|
||||
|
||||
const emit = defineEmits(['success', 'close'])
|
||||
const formRef = shallowRef<FormInstance>()
|
||||
const visible = ref(false)
|
||||
const mode = ref('add')
|
||||
const loading = ref(false)
|
||||
|
||||
const drawerTitle = computed(() => {
|
||||
return mode.value == 'edit' ? '编辑医助' : '新增医助'
|
||||
})
|
||||
|
||||
const formData = reactive({
|
||||
id: '',
|
||||
account: '',
|
||||
name: '',
|
||||
gender: 1,
|
||||
age: null as number | null,
|
||||
phone: '',
|
||||
role_id: [2], // 固定为医助角色
|
||||
dept_id: [],
|
||||
jobs_id: [],
|
||||
avatar: '',
|
||||
title: '', // 职称
|
||||
department: '', // 所属科室
|
||||
specialty: '', // 擅长领域
|
||||
education: '', // 教育背景
|
||||
experience: '', // 工作经历
|
||||
honors: '', // 荣誉资质
|
||||
password: '',
|
||||
password_confirm: '',
|
||||
disable: 0,
|
||||
multipoint_login: 1,
|
||||
diagnosis_count: null as number | null // 医助创建诊单数(详情接口返回)
|
||||
})
|
||||
|
||||
// 获取部门和岗位选项
|
||||
const { optionsData } = useDictOptions<{
|
||||
jobs: any[]
|
||||
dept: any[]
|
||||
}>({
|
||||
jobs: {
|
||||
api: jobsAll
|
||||
},
|
||||
dept: {
|
||||
api: deptAll
|
||||
}
|
||||
})
|
||||
|
||||
// 密码确认验证
|
||||
const passwordConfirmValidator = (rule: object, value: string, callback: any) => {
|
||||
if (formData.password) {
|
||||
if (!value) callback(new Error('请再次输入密码'))
|
||||
if (value !== formData.password) callback(new Error('两次输入密码不一致!'))
|
||||
}
|
||||
callback()
|
||||
}
|
||||
|
||||
// 手机号验证
|
||||
const phoneValidator = (rule: object, value: string, callback: any) => {
|
||||
if (value && !/^1[3-9]\d{9}$/.test(value)) {
|
||||
callback(new Error('请输入正确的手机号'))
|
||||
} else {
|
||||
callback()
|
||||
}
|
||||
}
|
||||
|
||||
const formRules = reactive({
|
||||
account: [
|
||||
{
|
||||
required: true,
|
||||
message: '请输入账号',
|
||||
trigger: ['blur']
|
||||
}
|
||||
],
|
||||
name: [
|
||||
{
|
||||
required: true,
|
||||
message: '请输入姓名',
|
||||
trigger: ['blur']
|
||||
}
|
||||
],
|
||||
gender: [
|
||||
{
|
||||
required: true,
|
||||
message: '请选择性别',
|
||||
trigger: ['change']
|
||||
}
|
||||
],
|
||||
phone: [
|
||||
{
|
||||
validator: phoneValidator,
|
||||
trigger: 'blur'
|
||||
}
|
||||
],
|
||||
password: [
|
||||
{
|
||||
required: true,
|
||||
message: '请输入密码',
|
||||
trigger: ['blur']
|
||||
}
|
||||
] as any[],
|
||||
password_confirm: [
|
||||
{
|
||||
required: true,
|
||||
message: '请输入确认密码',
|
||||
trigger: ['blur']
|
||||
},
|
||||
{
|
||||
validator: passwordConfirmValidator,
|
||||
trigger: 'blur'
|
||||
}
|
||||
] as any[]
|
||||
})
|
||||
|
||||
const handleSubmit = async () => {
|
||||
try {
|
||||
await formRef.value?.validate()
|
||||
loading.value = true
|
||||
|
||||
mode.value == 'edit' ? await adminEdit(formData) : await adminAdd(formData)
|
||||
|
||||
feedback.msgSuccess(mode.value == 'edit' ? '编辑成功' : '新增成功')
|
||||
visible.value = false
|
||||
emit('success')
|
||||
} catch (error) {
|
||||
console.error('提交失败:', error)
|
||||
} finally {
|
||||
loading.value = false
|
||||
}
|
||||
}
|
||||
|
||||
const open = (type = 'add') => {
|
||||
mode.value = type
|
||||
visible.value = true
|
||||
|
||||
// 重置表单
|
||||
if (type === 'add') {
|
||||
Object.assign(formData, {
|
||||
id: '',
|
||||
account: '',
|
||||
name: '',
|
||||
gender: 1,
|
||||
age: null,
|
||||
phone: '',
|
||||
role_id: [2],
|
||||
dept_id: [],
|
||||
jobs_id: [],
|
||||
avatar: '',
|
||||
title: '',
|
||||
department: '',
|
||||
specialty: '',
|
||||
education: '',
|
||||
experience: '',
|
||||
honors: '',
|
||||
password: '',
|
||||
password_confirm: '',
|
||||
disable: 0,
|
||||
multipoint_login: 1,
|
||||
diagnosis_count: null
|
||||
})
|
||||
|
||||
// 新增时密码必填
|
||||
formRules.password = [
|
||||
{
|
||||
required: true,
|
||||
message: '请输入密码',
|
||||
trigger: ['blur']
|
||||
}
|
||||
]
|
||||
formRules.password_confirm = [
|
||||
{
|
||||
required: true,
|
||||
message: '请输入确认密码',
|
||||
trigger: ['blur']
|
||||
},
|
||||
{
|
||||
validator: passwordConfirmValidator,
|
||||
trigger: 'blur'
|
||||
}
|
||||
]
|
||||
}
|
||||
}
|
||||
|
||||
const setFormData = async (row: any) => {
|
||||
// 编辑时密码不是必填
|
||||
formRules.password = []
|
||||
formRules.password_confirm = [
|
||||
{
|
||||
validator: passwordConfirmValidator,
|
||||
trigger: 'blur'
|
||||
}
|
||||
]
|
||||
|
||||
const data = await adminDetail({
|
||||
id: row.id
|
||||
})
|
||||
|
||||
for (const key in formData) {
|
||||
if (data[key] != null && data[key] != undefined) {
|
||||
//@ts-ignore
|
||||
formData[key] = data[key]
|
||||
}
|
||||
}
|
||||
|
||||
// 确保role_id包含医助角色
|
||||
if (!formData.role_id.includes(2)) {
|
||||
formData.role_id.push(2)
|
||||
}
|
||||
}
|
||||
|
||||
const handleClose = () => {
|
||||
visible.value = false
|
||||
emit('close')
|
||||
}
|
||||
|
||||
defineExpose({
|
||||
open,
|
||||
setFormData
|
||||
})
|
||||
</script>
|
||||
|
||||
<style scoped lang="scss">
|
||||
.form-tips {
|
||||
color: #999;
|
||||
font-size: 12px;
|
||||
line-height: 1.5;
|
||||
margin-top: 4px;
|
||||
}
|
||||
</style>
|
||||
@@ -0,0 +1,164 @@
|
||||
<!-- 医助列表 -->
|
||||
<template>
|
||||
<div class="doctor-list">
|
||||
<el-card class="!border-none" shadow="never">
|
||||
<el-form class="mb-[-16px]" :model="formData" inline>
|
||||
<el-form-item class="w-[280px]" label="医助账号">
|
||||
<el-input
|
||||
v-model="formData.account"
|
||||
placeholder="请输入医助账号"
|
||||
clearable
|
||||
@keyup.enter="resetPage"
|
||||
/>
|
||||
</el-form-item>
|
||||
<el-form-item class="w-[280px]" label="医助名称">
|
||||
<el-input
|
||||
v-model="formData.name"
|
||||
placeholder="请输入医助名称"
|
||||
clearable
|
||||
@keyup.enter="resetPage"
|
||||
/>
|
||||
</el-form-item>
|
||||
<el-form-item>
|
||||
<el-button type="primary" @click="resetPage">查询</el-button>
|
||||
<el-button @click="resetParams">重置</el-button>
|
||||
</el-form-item>
|
||||
</el-form>
|
||||
</el-card>
|
||||
|
||||
<el-card v-loading="pager.loading" class="mt-4 !border-none" shadow="never">
|
||||
<el-button v-perms="['auth.admin/add']" type="primary" @click="handleAdd">
|
||||
<template #icon>
|
||||
<icon name="el-icon-Plus" />
|
||||
</template>
|
||||
新增医助
|
||||
</el-button>
|
||||
|
||||
<div class="mt-4">
|
||||
<el-table :data="pager.lists" size="large">
|
||||
<el-table-column label="ID" prop="id" min-width="60" />
|
||||
<el-table-column label="头像" min-width="100">
|
||||
<template #default="{ row }">
|
||||
<el-avatar :size="50" :src="row.avatar"></el-avatar>
|
||||
</template>
|
||||
</el-table-column>
|
||||
<el-table-column label="账号" prop="account" min-width="120" />
|
||||
<el-table-column label="姓名" prop="name" min-width="100" />
|
||||
<el-table-column label="手机号" prop="phone" min-width="120" />
|
||||
<el-table-column label="创建时间" prop="create_time" min-width="180" />
|
||||
<el-table-column label="最近登录时间" prop="login_time" min-width="180" />
|
||||
<el-table-column label="最近登录IP" prop="login_ip" min-width="120" />
|
||||
<el-table-column label="状态" min-width="100" v-perms="['auth.admin/edit']">
|
||||
<template #default="{ row }">
|
||||
<el-switch
|
||||
v-model="row.disable"
|
||||
:active-value="0"
|
||||
:inactive-value="1"
|
||||
@change="changeStatus(row)"
|
||||
/>
|
||||
</template>
|
||||
</el-table-column>
|
||||
<el-table-column label="操作" width="120" fixed="right">
|
||||
<template #default="{ row }">
|
||||
<el-button
|
||||
v-perms="['auth.admin/edit']"
|
||||
type="primary"
|
||||
link
|
||||
@click="handleEdit(row)"
|
||||
>
|
||||
编辑
|
||||
</el-button>
|
||||
<el-button
|
||||
v-perms="['auth.admin/delete']"
|
||||
type="danger"
|
||||
link
|
||||
@click="handleDelete(row.id)"
|
||||
>
|
||||
删除
|
||||
</el-button>
|
||||
</template>
|
||||
</el-table-column>
|
||||
</el-table>
|
||||
</div>
|
||||
|
||||
<div class="flex mt-4 justify-end">
|
||||
<pagination v-model="pager" @change="getLists" />
|
||||
</div>
|
||||
</el-card>
|
||||
|
||||
<edit-popup v-if="showEdit" ref="editRef" @success="getLists" @close="showEdit = false" />
|
||||
</div>
|
||||
</template>
|
||||
|
||||
<script lang="ts" setup name="doctorList">
|
||||
import { adminDelete, adminEdit, adminLists } from '@/api/perms/admin'
|
||||
import { usePaging } from '@/hooks/usePaging'
|
||||
import feedback from '@/utils/feedback'
|
||||
|
||||
import EditPopup from './edit.vue'
|
||||
|
||||
const editRef = shallowRef<InstanceType<typeof EditPopup>>()
|
||||
|
||||
// 表单数据 - 固定role_id=1查询医助
|
||||
const formData = reactive({
|
||||
account: '',
|
||||
name: '',
|
||||
role_id: 2 // 固定为医助角色
|
||||
})
|
||||
|
||||
const showEdit = ref(false)
|
||||
|
||||
const { pager, getLists, resetParams, resetPage } = usePaging({
|
||||
fetchFun: adminLists,
|
||||
params: formData
|
||||
})
|
||||
|
||||
// 修改状态
|
||||
const changeStatus = (data: any) => {
|
||||
adminEdit({
|
||||
id: data.id,
|
||||
avatar: data.avatar,
|
||||
account: data.account,
|
||||
name: data.name,
|
||||
role_id: data.role_id,
|
||||
jobs_id: data.jobs_id,
|
||||
dept_id: data.dept_id,
|
||||
disable: data.disable,
|
||||
multipoint_login: data.multipoint_login
|
||||
}).finally(() => {
|
||||
getLists()
|
||||
})
|
||||
}
|
||||
|
||||
// 新增医助
|
||||
const handleAdd = async () => {
|
||||
showEdit.value = true
|
||||
await nextTick()
|
||||
editRef.value?.open('add')
|
||||
}
|
||||
|
||||
// 编辑医助
|
||||
const handleEdit = async (data: any) => {
|
||||
showEdit.value = true
|
||||
await nextTick()
|
||||
editRef.value?.open('edit')
|
||||
editRef.value?.setFormData(data)
|
||||
}
|
||||
|
||||
// 删除医助
|
||||
const handleDelete = async (id: number) => {
|
||||
await feedback.confirm('确定要删除该医助吗?')
|
||||
await adminDelete({ id })
|
||||
getLists()
|
||||
}
|
||||
|
||||
onMounted(() => {
|
||||
getLists()
|
||||
})
|
||||
</script>
|
||||
|
||||
<style scoped lang="scss">
|
||||
.doctor-list {
|
||||
padding: 20px;
|
||||
}
|
||||
</style>
|
||||
Reference in New Issue
Block a user