新增功能
This commit is contained in:
Your Name
@@ -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>
|
||||
@@ -509,7 +509,11 @@ const getOrderTypeText = (type: number) => {
|
||||
const typeMap: Record<number, string> = {
|
||||
1: '挂号费',
|
||||
2: '问诊费',
|
||||
3: '药品费用'
|
||||
3: '药品费用',
|
||||
4: '首付费用',
|
||||
5: '尾款费用',
|
||||
6:'其他费用',
|
||||
7:'全部费用',
|
||||
}
|
||||
return typeMap[type] || '未知'
|
||||
}
|
||||
|
||||
@@ -190,6 +190,15 @@
|
||||
>
|
||||
视频二维码
|
||||
</el-button>
|
||||
<el-button
|
||||
v-if="row.status === 1"
|
||||
v-perms="['tcm.diagnosis/kaifang']"
|
||||
type="primary"
|
||||
link
|
||||
@click="handlePrescription(row)"
|
||||
>
|
||||
开方
|
||||
</el-button>
|
||||
</template>
|
||||
</el-table-column>
|
||||
</el-table>
|
||||
@@ -250,8 +259,8 @@
|
||||
<!-- 编辑患者弹窗 -->
|
||||
<edit-popup ref="editRef" @success="getLists" />
|
||||
|
||||
<!-- 处方单抽屉 -->
|
||||
<prescription-drawer ref="prescriptionDrawerRef" @success="loadData" />
|
||||
<!-- 中医处方单 -->
|
||||
<tcm-prescription ref="prescriptionRef" @success="loadData" />
|
||||
|
||||
<!-- 聊天对话框 -->
|
||||
<chat-dialog ref="chatDialogRef" />
|
||||
@@ -298,7 +307,7 @@ import { appointmentLists, cancelAppointment, completeAppointment, appointmentDe
|
||||
import { getCallSignature, generateMiniProgramQrcode } from '@/api/tcm'
|
||||
import feedback from '@/utils/feedback'
|
||||
import EditPopup from '../diagnosis/edit.vue'
|
||||
import PrescriptionDrawer from './components/prescription-drawer.vue'
|
||||
import TcmPrescription from '@/components/tcm-prescription/index.vue'
|
||||
import ChatDialog from '@/components/chat-dialog/index.vue'
|
||||
import useUserStore from '@/stores/modules/user'
|
||||
import { getWeappConfig } from '@/api/channel/weapp'
|
||||
@@ -392,7 +401,7 @@ const handleReset = () => {
|
||||
const detailVisible = ref(false)
|
||||
const detailData = ref<any>(null)
|
||||
const editRef = ref()
|
||||
const prescriptionDrawerRef = ref()
|
||||
const prescriptionRef = ref()
|
||||
const chatDialogRef = ref()
|
||||
|
||||
// 小程序二维码相关
|
||||
@@ -525,6 +534,15 @@ const handleMiniProgramQRCode = async (row: any) => {
|
||||
}
|
||||
}
|
||||
|
||||
// 开处方
|
||||
const handlePrescription = (row: any) => {
|
||||
if (!row.diagnosis_id && !row.patient_id) {
|
||||
feedback.msgWarning('该预约缺少诊单信息，请先编辑患者')
|
||||
return
|
||||
}
|
||||
prescriptionRef.value?.open(row)
|
||||
}
|
||||
|
||||
// 重新生成二维码
|
||||
const handleRegenerateQRCode = () => {
|
||||
if (currentQRCodeRow.value) {
|
||||
|
||||
@@ -284,6 +284,10 @@
|
||||
<el-option label="挂号费" :value="1" />
|
||||
<el-option label="问诊费" :value="2" />
|
||||
<el-option label="药品费用" :value="3" />
|
||||
<el-option label="首付费用" :value="4" />
|
||||
<el-option label="尾款费用" :value="5" />
|
||||
<el-option label="其他费用" :value="6" />
|
||||
<el-option label="全部费用" :value="7" />
|
||||
</el-select>
|
||||
</el-form-item>
|
||||
|
||||
|
||||
@@ -1,6 +1,8 @@
|
||||
<template>
|
||||
<div class="workbench">
|
||||
<div class="lg:flex">
|
||||
|
||||
|
||||
<!-- <div class="lg:flex">
|
||||
<el-card class="!border-none mb-4 lg:mr-4 lg:w-[350px]" shadow="never">
|
||||
<template #header>
|
||||
<span class="card-title">版本信息</span>
|
||||
@@ -72,8 +74,8 @@
|
||||
</div>
|
||||
</div>
|
||||
</el-card>
|
||||
</div>
|
||||
<div class="function mb-4">
|
||||
</div> -->
|
||||
<!-- <div class="function mb-4">
|
||||
<el-card class="flex-1 !border-none" shadow="never">
|
||||
<template #header>
|
||||
<span>常用功能</span>
|
||||
@@ -91,7 +93,232 @@
|
||||
</div>
|
||||
</div>
|
||||
</el-card>
|
||||
</div>
|
||||
</div> -->
|
||||
|
||||
|
||||
<!-- 医助理诊单统计 -->
|
||||
<el-card class="!border-none mt-4 w-full" shadow="never">
|
||||
<template #header>
|
||||
<div class="flex justify-between items-center">
|
||||
<span>医助理诊单统计</span>
|
||||
<div class="flex items-center gap-2">
|
||||
<span class="text-tx-secondary text-sm">
|
||||
{{ assistantStats.date_range?.[0] }} 至 {{ assistantStats.date_range?.[1] }}
|
||||
</span>
|
||||
<el-select v-model="assistantStats.days" class="w-28" @change="loadAssistantStats">
|
||||
<el-option label="今天" :value="0" />
|
||||
<el-option label="最近7天" :value="7" />
|
||||
<el-option label="最近14天" :value="14" />
|
||||
<el-option label="最近30天" :value="30" />
|
||||
</el-select>
|
||||
<el-button type="primary" link @click="loadAssistantStats">刷新</el-button>
|
||||
</div>
|
||||
</div>
|
||||
</template>
|
||||
<!-- 今日统计 -->
|
||||
<div class="mb-4 p-4 rounded-lg bg-blue-50 border border-blue-100">
|
||||
<div class="flex items-center justify-between flex-wrap gap-4">
|
||||
<div class="flex items-center gap-6">
|
||||
<div>
|
||||
<span class="text-tx-secondary text-sm">今日创建诊单</span>
|
||||
<div class="text-2xl font-bold text-primary mt-1">{{ assistantStats.today_total ?? 0 }}</div>
|
||||
</div>
|
||||
<div v-if="assistantStats.today_ranking?.length" class="flex items-center gap-4 pl-6 border-l border-blue-200">
|
||||
<span class="text-tx-secondary text-sm">今日排行：</span>
|
||||
<div class="flex flex-wrap gap-2">
|
||||
<span
|
||||
v-for="(a, idx) in assistantStats.today_ranking.slice(0, 5)"
|
||||
:key="a.id"
|
||||
class="inline-flex items-center gap-1 px-2 py-1 rounded text-sm bg-white"
|
||||
>
|
||||
<span class="text-amber-500 font-medium">{{ idx + 1 }}.</span>
|
||||
<span>{{ a.name }}</span>
|
||||
<span class="text-primary font-medium">{{ a.count }}</span>
|
||||
</span>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<div class="grid grid-cols-1 lg:grid-cols-3 gap-4">
|
||||
<!-- 医助排行 -->
|
||||
<div class="lg:col-span-1">
|
||||
<div class="font-medium text-gray-800 mb-3">医助排行</div>
|
||||
<div v-if="assistantStats.ranking?.length" class="space-y-2">
|
||||
<div
|
||||
v-for="(a, idx) in assistantStats.ranking"
|
||||
:key="a.id"
|
||||
class="flex items-center justify-between py-2 px-3 rounded-lg"
|
||||
:class="idx < 3 ? 'bg-amber-50' : 'bg-gray-50'"
|
||||
>
|
||||
<span class="flex items-center gap-2">
|
||||
<span
|
||||
class="w-6 h-6 rounded-full text-center text-xs font-medium leading-6"
|
||||
:class="idx === 0 ? 'bg-amber-400 text-white' : idx === 1 ? 'bg-gray-300 text-gray-700' : idx === 2 ? 'bg-amber-200 text-amber-800' : 'bg-gray-200 text-gray-600'"
|
||||
>
|
||||
{{ idx + 1 }}
|
||||
</span>
|
||||
<span class="text-gray-800">{{ a.name }}</span>
|
||||
</span>
|
||||
<span class="font-semibold text-primary">{{ a.count }}</span>
|
||||
</div>
|
||||
</div>
|
||||
<div v-else class="py-8 text-center text-tx-secondary">暂无排行数据</div>
|
||||
</div>
|
||||
<!-- 图表 -->
|
||||
<div class="lg:col-span-2">
|
||||
<div class="font-medium text-gray-800 mb-2">诊单数分布</div>
|
||||
<v-charts
|
||||
v-if="assistantStats.chart.xAxis?.length"
|
||||
ref="assistantChart"
|
||||
style="height: 320px"
|
||||
:option="assistantChartOption"
|
||||
:autoresize="true"
|
||||
/>
|
||||
<div v-else class="h-[320px] flex items-center justify-center text-tx-secondary">
|
||||
暂无数据
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<div v-if="assistantStats.departments?.length" class="mt-4 pt-4 border-t border-gray-100">
|
||||
<div class="font-medium text-gray-800 mb-3">按部门统计</div>
|
||||
<div class="grid grid-cols-1 md:grid-cols-2 lg:grid-cols-3 gap-4">
|
||||
<div
|
||||
v-for="dept in assistantStats.departments"
|
||||
:key="dept.dept_id"
|
||||
class="p-4 rounded-lg bg-gray-50"
|
||||
>
|
||||
<div class="font-medium text-gray-800 mb-2">{{ dept.dept_name }}（共{{ dept.total }}）</div>
|
||||
<div class="space-y-1 text-sm">
|
||||
<div
|
||||
v-for="a in dept.assistants"
|
||||
:key="`${dept.dept_id}-${a.id}`"
|
||||
class="flex justify-between"
|
||||
>
|
||||
<span class="text-gray-600">{{ a.name }}</span>
|
||||
<span class="font-medium">{{ a.count }}</span>
|
||||
</div>
|
||||
<div v-if="!dept.assistants?.length" class="text-tx-secondary">暂无医助</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</el-card>
|
||||
|
||||
<!-- 订单统计 -->
|
||||
<el-card class="!border-none mt-4 w-full" shadow="never">
|
||||
<template #header>
|
||||
<span>订单统计</span>
|
||||
</template>
|
||||
<div class="order-stats-panel">
|
||||
<div class="flex justify-between items-center mb-4 flex-wrap gap-2">
|
||||
<span class="text-tx-secondary text-sm">{{ orderStatsDateRangeText }}</span>
|
||||
<div class="flex items-center gap-3">
|
||||
<span class="text-gray-600 text-sm">统计类型</span>
|
||||
<el-select v-model="orderStatsType" style="width: 120px" @change="loadOrderStats">
|
||||
<el-option label="挂号费" :value="1" />
|
||||
<el-option label="问诊费" :value="2" />
|
||||
<el-option label="药品费用" :value="3" />
|
||||
<el-option label="首付费用" :value="4" />
|
||||
<el-option label="尾款费用" :value="5" />
|
||||
<el-option label="其他费用" :value="6" />
|
||||
<el-option label="退款统计" :value="0" />
|
||||
</el-select>
|
||||
<span class="text-gray-600 text-sm">时间范围</span>
|
||||
<el-select v-model="orderStatsDays" style="width: 110px" @change="loadOrderStats">
|
||||
<el-option label="今天" :value="0" />
|
||||
<el-option label="最近7天" :value="7" />
|
||||
<el-option label="最近30天" :value="30" />
|
||||
</el-select>
|
||||
<el-button type="primary" link @click="loadOrderStats">刷新</el-button>
|
||||
</div>
|
||||
</div>
|
||||
<div class="mb-4 p-4 rounded-lg bg-green-50 border border-green-100">
|
||||
<div class="flex items-center gap-6 flex-wrap">
|
||||
<div>
|
||||
<span class="text-tx-secondary text-sm">今日单数</span>
|
||||
<div class="text-2xl font-bold text-primary mt-1">{{ orderStatsData.today_total ?? 0 }}</div>
|
||||
</div>
|
||||
<div>
|
||||
<span class="text-tx-secondary text-sm">今日金额</span>
|
||||
<div class="text-2xl font-bold text-primary mt-1">¥{{ orderStatsData.today_amount ?? '0.00' }}</div>
|
||||
</div>
|
||||
<div v-if="orderStatsData.today_ranking?.length" class="flex items-center gap-4 pl-6 border-l border-green-200">
|
||||
<span class="text-tx-secondary text-sm">今日排行：</span>
|
||||
<div class="flex flex-wrap gap-2">
|
||||
<span
|
||||
v-for="(a, idx) in orderStatsData.today_ranking.slice(0, 5)"
|
||||
:key="a.id"
|
||||
class="inline-flex items-center gap-1 px-2 py-1 rounded text-sm bg-white"
|
||||
>
|
||||
<span class="text-amber-500 font-medium">{{ Number(idx) + 1 }}.</span>
|
||||
<span>{{ a.name }}</span>
|
||||
<span class="text-primary font-medium">{{ a.count }}</span>
|
||||
<span class="text-gray-500">¥{{ a.amount }}</span>
|
||||
</span>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<div class="grid grid-cols-1 lg:grid-cols-3 gap-4">
|
||||
<div class="lg:col-span-1">
|
||||
<div class="font-medium text-gray-800 mb-3">排行</div>
|
||||
<div v-if="orderStatsData.ranking?.length" class="space-y-2">
|
||||
<div
|
||||
v-for="(a, idx) in orderStatsData.ranking"
|
||||
:key="a.id"
|
||||
class="flex items-center justify-between py-2 px-3 rounded-lg bg-gray-50"
|
||||
>
|
||||
<span class="flex items-center gap-2">
|
||||
<span class="w-6 h-6 rounded-full text-center text-xs font-medium leading-6 bg-gray-200 text-gray-600">{{ Number(idx) + 1 }}</span>
|
||||
<span class="text-gray-800">{{ a.name }}</span>
|
||||
</span>
|
||||
<span class="text-right">
|
||||
<span class="font-semibold text-primary">{{ a.count }}</span>
|
||||
<span class="text-gray-500 text-sm ml-1">¥{{ a.amount }}</span>
|
||||
</span>
|
||||
</div>
|
||||
</div>
|
||||
<div v-else class="py-8 text-center text-tx-secondary">暂无数据</div>
|
||||
</div>
|
||||
<div class="lg:col-span-2">
|
||||
<div class="font-medium text-gray-800 mb-2">单数分布</div>
|
||||
<v-charts
|
||||
v-if="orderStatsData.chart?.xAxis?.length"
|
||||
:key="'order-chart-' + orderStatsType"
|
||||
style="height: 280px"
|
||||
:option="orderChartOption"
|
||||
:autoresize="true"
|
||||
/>
|
||||
<div v-else class="h-[280px] flex items-center justify-center text-tx-secondary">暂无数据</div>
|
||||
</div>
|
||||
</div>
|
||||
<div v-if="orderStatsData.departments?.length" class="mt-4 pt-4 border-t border-gray-100">
|
||||
<div class="font-medium text-gray-800 mb-3">按部门统计</div>
|
||||
<div class="grid grid-cols-1 md:grid-cols-2 lg:grid-cols-3 gap-4">
|
||||
<div
|
||||
v-for="dept in orderStatsData.departments"
|
||||
:key="dept.dept_id"
|
||||
class="p-4 rounded-lg bg-gray-50"
|
||||
>
|
||||
<div class="font-medium text-gray-800 mb-2">{{ dept.dept_name }}（{{ dept.total }}单 ¥{{ dept.amount }}）</div>
|
||||
<div class="space-y-1 text-sm">
|
||||
<div
|
||||
v-for="m in dept.members"
|
||||
:key="`${dept.dept_id}-${m.id}`"
|
||||
class="flex justify-between"
|
||||
>
|
||||
<span class="text-gray-600">{{ m.name }}</span>
|
||||
<span><span class="font-medium">{{ m.count }}</span> <span class="text-gray-500">¥{{ m.amount }}</span></span>
|
||||
</div>
|
||||
<div v-if="!dept.members?.length" class="text-tx-secondary">暂无</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</el-card>
|
||||
|
||||
<div class="lg:flex gap-4">
|
||||
<el-card class="!border-none mb-4 lg:mb-0 w-full lg:w-2/3" shadow="never">
|
||||
<template #header>
|
||||
@@ -127,6 +354,8 @@
|
||||
import vCharts from 'vue-echarts'
|
||||
|
||||
import { getWorkbench } from '@/api/app'
|
||||
import { assistantDiagnosisStats } from '@/api/tcm'
|
||||
import { orderStats } from '@/api/order'
|
||||
import useSettingStore from '@/stores/modules/setting'
|
||||
import { useComponentRef } from '@/utils/getExposeType'
|
||||
import { calcColor } from '@/utils/util'
|
||||
@@ -134,6 +363,138 @@ import { calcColor } from '@/utils/util'
|
||||
const settingStore = useSettingStore()
|
||||
const saleChart = useComponentRef(vCharts)
|
||||
const visitorChart = useComponentRef(vCharts)
|
||||
const assistantChart = useComponentRef(vCharts)
|
||||
|
||||
const assistantStats = reactive<{
|
||||
days: number
|
||||
date_range?: [string, string]
|
||||
today_total?: number
|
||||
today_ranking?: { id: number; name: string; count: number }[]
|
||||
departments: any[]
|
||||
ranking: { id: number; name: string; count: number }[]
|
||||
chart: { xAxis: string[]; series: any[] }
|
||||
}>({
|
||||
days: 7,
|
||||
departments: [],
|
||||
today_ranking: [],
|
||||
ranking: [],
|
||||
chart: { xAxis: [], series: [] }
|
||||
})
|
||||
|
||||
const assistantChartOption = computed(() => ({
|
||||
xAxis: {
|
||||
type: 'category',
|
||||
data: assistantStats.chart.xAxis || [],
|
||||
axisLabel: { rotate: 30 }
|
||||
},
|
||||
yAxis: { type: 'value', name: '诊单数' },
|
||||
tooltip: { trigger: 'axis' },
|
||||
grid: { left: '3%', right: '4%', bottom: '15%', containLabel: true },
|
||||
series: (assistantStats.chart.series || []).map((s: any) => ({
|
||||
...s,
|
||||
type: 'bar',
|
||||
barWidth: '50%',
|
||||
itemStyle: {
|
||||
borderRadius: [6, 6, 0, 0],
|
||||
color: {
|
||||
type: 'linear',
|
||||
x: 0,
|
||||
y: 0,
|
||||
x2: 0,
|
||||
y2: 1,
|
||||
colorStops: [
|
||||
{ offset: 0, color: calcColor(settingStore.theme, 0.8) },
|
||||
{ offset: 1, color: settingStore.theme }
|
||||
]
|
||||
}
|
||||
}
|
||||
}))
|
||||
}))
|
||||
|
||||
const loadAssistantStats = () => {
|
||||
assistantDiagnosisStats({ days: assistantStats.days })
|
||||
.then((res: any) => {
|
||||
assistantStats.date_range = res.date_range
|
||||
assistantStats.today_total = res.today_total ?? 0
|
||||
assistantStats.today_ranking = res.today_ranking || []
|
||||
assistantStats.departments = res.departments || []
|
||||
assistantStats.ranking = res.ranking || []
|
||||
assistantStats.chart = res.chart || { xAxis: [], series: [] }
|
||||
})
|
||||
.catch(() => {})
|
||||
}
|
||||
|
||||
const orderStatsType = ref(1)
|
||||
const orderStatsDays = ref(7)
|
||||
const orderStatsData = reactive<any>({
|
||||
date_range: [] as string[],
|
||||
today_total: 0,
|
||||
today_amount: '0.00',
|
||||
today_ranking: [],
|
||||
departments: [],
|
||||
ranking: [],
|
||||
chart: { xAxis: [], series: [] }
|
||||
})
|
||||
const orderStatsDateRangeText = computed(() => {
|
||||
const arr = orderStatsData.date_range
|
||||
if (arr?.length >= 2) return `${arr[0]} 至 ${arr[1]}`
|
||||
const days = orderStatsDays.value
|
||||
const end = new Date()
|
||||
const start = new Date()
|
||||
if (days === 0) {
|
||||
start.setHours(0, 0, 0, 0)
|
||||
return `${formatDate(start)} 至 ${formatDate(end)}`
|
||||
}
|
||||
start.setDate(start.getDate() - (days || 7))
|
||||
return `${formatDate(start)} 至 ${formatDate(end)}`
|
||||
})
|
||||
function formatDate(d: Date) {
|
||||
return d.getFullYear() + '-' + String(d.getMonth() + 1).padStart(2, '0') + '-' + String(d.getDate()).padStart(2, '0')
|
||||
}
|
||||
const orderChartOption = computed(() => ({
|
||||
xAxis: {
|
||||
type: 'category',
|
||||
data: orderStatsData.chart?.xAxis || [],
|
||||
axisLabel: { rotate: 30 }
|
||||
},
|
||||
yAxis: { type: 'value', name: '单数' },
|
||||
tooltip: { trigger: 'axis' },
|
||||
grid: { left: '3%', right: '4%', bottom: '15%', containLabel: true },
|
||||
series: (orderStatsData.chart?.series || []).map((s: any) => ({
|
||||
...s,
|
||||
type: 'bar',
|
||||
barWidth: '50%',
|
||||
itemStyle: {
|
||||
borderRadius: [6, 6, 0, 0],
|
||||
color: {
|
||||
type: 'linear',
|
||||
x: 0,
|
||||
y: 0,
|
||||
x2: 0,
|
||||
y2: 1,
|
||||
colorStops: [
|
||||
{ offset: 0, color: calcColor(settingStore.theme, 0.8) },
|
||||
{ offset: 1, color: settingStore.theme }
|
||||
]
|
||||
}
|
||||
}
|
||||
}))
|
||||
}))
|
||||
const loadOrderStats = () => {
|
||||
orderStats({ order_type: orderStatsType.value, days: orderStatsDays.value })
|
||||
.then((res: any) => {
|
||||
Object.assign(orderStatsData, {
|
||||
date_range: res.date_range || [],
|
||||
today_total: res.today_total ?? 0,
|
||||
today_amount: res.today_amount ?? '0.00',
|
||||
today_ranking: res.today_ranking || [],
|
||||
departments: res.departments || [],
|
||||
ranking: res.ranking || [],
|
||||
chart: res.chart || { xAxis: [], series: [] }
|
||||
})
|
||||
})
|
||||
.catch(() => {})
|
||||
}
|
||||
|
||||
watch(
|
||||
() => settingStore.theme,
|
||||
@@ -347,6 +708,8 @@ const updateColor = () => {
|
||||
|
||||
onMounted(() => {
|
||||
getData()
|
||||
loadAssistantStats()
|
||||
loadOrderStats()
|
||||
})
|
||||
</script>
|
||||
|
||||
|
||||
Reference in New Issue
Block a user