新增功能

This commit is contained in:
Your Name
2026-03-04 15:32:30 +08:00
parent a07e844c47
commit ab77f5488d
2266 changed files with 177942 additions and 3444 deletions
+813
View File
@@ -0,0 +1,813 @@
<template>
<div class="edit-drawer">
<el-drawer
v-model="visible"
:title="drawerTitle"
size="60%"
:before-close="handleClose"
:z-index="1500"
:modal="true"
>
<el-tabs v-model="activeTab" class="px-4">
<!-- 基本信息标签页 -->
<el-tab-pane label="基本信息" name="basic">
<el-form
ref="formRef"
:model="formData"
:rules="formRules"
label-width="120px"
>
<!-- 基本信息 -->
<el-divider content-position="left">基本信息</el-divider>
<el-form-item label="患者ID">
<el-input v-model="formData.patient_id" disabled placeholder="系统自动生成" />
</el-form-item>
<el-row :gutter="20">
<el-col :span="12">
<el-form-item label="患者姓名" prop="patient_name">
<el-input
v-model="formData.patient_name"
placeholder="请输入患者姓名"
/>
</el-form-item>
</el-col>
<el-col :span="12">
<el-form-item label="身份证号" prop="id_card">
<el-input
v-model="formData.id_card"
placeholder="请输入身份证号"
maxlength="18"
@blur="handleIdCardBlur"
/>
</el-form-item>
</el-col>
</el-row>
<el-row :gutter="20">
<el-col :span="12">
<el-form-item label="手机号" prop="phone">
<el-input
v-model="formData.phone"
placeholder="请输入手机号"
maxlength="11"
@blur="handlePhoneBlur"
/>
</el-form-item>
</el-col>
<el-col :span="12">
<el-form-item label="性别" prop="gender">
<el-radio-group v-model="formData.gender">
<el-radio :label="1"></el-radio>
<el-radio :label="0"></el-radio>
</el-radio-group>
</el-form-item>
</el-col>
</el-row>
<el-row :gutter="20">
<el-col :span="12">
<el-form-item label="年龄" prop="age">
<el-input-number
v-model="formData.age"
:min="0"
:max="150"
placeholder="请输入年龄"
class="w-full"
/>
</el-form-item>
</el-col>
<el-col :span="12">
<el-form-item label="诊断日期" prop="diagnosis_date">
<el-date-picker
v-model="formData.diagnosis_date"
type="date"
placeholder="请选择诊断日期"
value-format="YYYY-MM-DD"
class="w-full"
:popper-options="{ strategy: 'fixed' }"
popper-class="high-z-index"
/>
</el-form-item>
</el-col>
</el-row>
<el-row :gutter="20">
<el-col :span="12">
<el-form-item label="诊断类型" prop="diagnosis_type">
<el-select
v-model="formData.diagnosis_type"
placeholder="请选择诊断类型"
class="w-full"
:popper-options="{ strategy: 'fixed' }"
popper-class="high-z-index"
>
<el-option
v-for="item in diagnosisTypeOptions"
:key="item.value"
:label="item.name"
:value="item.value"
/>
</el-select>
</el-form-item>
</el-col>
<el-col :span="12">
<el-form-item label="证型" prop="syndrome_type">
<el-select
v-model="formData.syndrome_type"
placeholder="请选择证型"
class="w-full"
:popper-options="{ strategy: 'fixed' }"
popper-class="high-z-index"
>
<el-option
v-for="item in syndromeTypeOptions"
:key="item.value"
:label="item.name"
:value="item.value"
/>
</el-select>
</el-form-item>
</el-col>
</el-row>
<el-row :gutter="20">
<el-col :span="24">
<el-form-item label="状态" prop="status">
<el-radio-group v-model="formData.status">
<el-radio :label="1">启用</el-radio>
<el-radio :label="0">禁用</el-radio>
</el-radio-group>
</el-form-item>
</el-col>
</el-row>
<!-- 现病史 -->
<el-divider content-position="left">现病史</el-divider>
<el-row :gutter="20">
<el-col :span="12">
<el-form-item label="口腔感觉">
<el-radio-group v-model="formData.appetite">
<el-radio v-for="item in appetiteOptions" :key="item.value" :label="item.value">
{{ item.name }}
</el-radio>
</el-radio-group>
</el-form-item>
</el-col>
<el-col :span="12">
<el-form-item label="每日饮水量">
<el-radio-group v-model="formData.water_intake">
<el-radio v-for="item in waterIntakeOptions" :key="item.value" :label="item.value">
{{ item.name }}
</el-radio>
</el-radio-group>
</el-form-item>
</el-col>
</el-row>
<el-form-item label="饮食情况">
<el-checkbox-group v-model="formData.diet_condition">
<el-checkbox v-for="item in dietConditionOptions" :key="item.value" :label="item.value">
{{ item.name }}
</el-checkbox>
</el-checkbox-group>
</el-form-item>
<el-form-item label="体重变化">
<el-radio-group v-model="formData.weight_change">
<el-radio v-for="item in weightChangeOptions" :key="item.value" :label="item.value">
{{ item.name }}
</el-radio>
</el-radio-group>
</el-form-item>
<el-form-item label="肢体感觉">
<el-checkbox-group v-model="formData.body_feeling">
<el-checkbox v-for="item in bodyFeelingOptions" :key="item.value" :label="item.value">
{{ item.name }}
</el-checkbox>
</el-checkbox-group>
</el-form-item>
<el-form-item label="睡眠情况">
<el-checkbox-group v-model="formData.sleep_condition">
<el-checkbox v-for="item in sleepConditionOptions" :key="item.value" :label="item.value">
{{ item.name }}
</el-checkbox>
</el-checkbox-group>
</el-form-item>
<el-form-item label="眼睛情况">
<el-checkbox-group v-model="formData.eye_condition">
<el-checkbox v-for="item in eyeConditionOptions" :key="item.value" :label="item.value">
{{ item.name }}
</el-checkbox>
</el-checkbox-group>
</el-form-item>
<el-form-item label="头部感觉">
<el-checkbox-group v-model="formData.head_feeling">
<el-checkbox v-for="item in headFeelingOptions" :key="item.value" :label="item.value">
{{ item.name }}
</el-checkbox>
</el-checkbox-group>
</el-form-item>
<el-form-item label="出汗情况">
<el-checkbox-group v-model="formData.sweat_condition">
<el-checkbox v-for="item in sweatConditionOptions" :key="item.value" :label="item.value">
{{ item.name }}
</el-checkbox>
</el-checkbox-group>
</el-form-item>
<el-form-item label="皮肤情况">
<el-checkbox-group v-model="formData.skin_condition">
<el-checkbox v-for="item in skinConditionOptions" :key="item.value" :label="item.value">
{{ item.name }}
</el-checkbox>
</el-checkbox-group>
</el-form-item>
<el-form-item label="小便情况">
<el-checkbox-group v-model="formData.urine_condition">
<el-checkbox v-for="item in urineConditionOptions" :key="item.value" :label="item.value">
{{ item.name }}
</el-checkbox>
</el-checkbox-group>
</el-form-item>
<el-form-item label="大便情况">
<el-checkbox-group v-model="formData.stool_condition">
<el-checkbox v-for="item in stoolConditionOptions" :key="item.value" :label="item.value">
{{ item.name }}
</el-checkbox>
</el-checkbox-group>
</el-form-item>
<el-form-item label="腰肾情况">
<el-checkbox-group v-model="formData.kidney_condition">
<el-checkbox v-for="item in kidneyConditionOptions" :key="item.value" :label="item.value">
{{ item.name }}
</el-checkbox>
</el-checkbox-group>
</el-form-item>
<el-form-item label="脂肪肝程度">
<el-radio-group v-model="formData.fatty_liver_degree">
<el-radio v-for="item in fattyLiverDegreeOptions" :key="item.value" :label="item.value">
{{ item.name }}
</el-radio>
</el-radio-group>
</el-form-item>
<!-- 既往史 -->
<el-divider content-position="left">既往史</el-divider>
<el-form-item label="既往史" prop="past_history">
<el-checkbox-group v-model="formData.past_history">
<el-checkbox
v-for="item in pastHistoryOptions"
:key="item.value"
:label="item.value"
>
{{ item.name }}
</el-checkbox>
</el-checkbox-group>
</el-form-item>
<!-- 其他病史 -->
<el-divider content-position="left">其他病史</el-divider>
<el-row :gutter="20">
<el-col :span="8">
<el-form-item label="外伤史">
<el-radio-group v-model="formData.trauma_history">
<el-radio :label="1"></el-radio>
<el-radio :label="0"></el-radio>
</el-radio-group>
</el-form-item>
</el-col>
<el-col :span="8">
<el-form-item label="手术史">
<el-radio-group v-model="formData.surgery_history">
<el-radio :label="1"></el-radio>
<el-radio :label="0"></el-radio>
</el-radio-group>
</el-form-item>
</el-col>
<el-col :span="8">
<el-form-item label="过敏史">
<el-radio-group v-model="formData.allergy_history">
<el-radio :label="1"></el-radio>
<el-radio :label="0"></el-radio>
</el-radio-group>
</el-form-item>
</el-col>
</el-row>
<el-row :gutter="20">
<el-col :span="12">
<el-form-item label="家族病史">
<el-radio-group v-model="formData.family_history">
<el-radio :label="1"></el-radio>
<el-radio :label="0"></el-radio>
</el-radio-group>
</el-form-item>
</el-col>
<el-col :span="12">
<el-form-item label="妊娠哺乳史">
<el-radio-group v-model="formData.pregnancy_history">
<el-radio :label="1"></el-radio>
<el-radio :label="0"></el-radio>
</el-radio-group>
</el-form-item>
</el-col>
</el-row>
<!-- 诊断信息 -->
<el-divider content-position="left">诊断信息</el-divider>
<el-form-item label="舌苔照片">
<material-picker
v-model="formData.tongue_images"
:limit="9"
type="image"
/>
<div class="form-tips">支持上传多张舌苔照片最多9张</div>
</el-form-item>
<el-form-item label="检查报告">
<material-picker
v-model="formData.report_files"
:limit="10"
type="image"
/>
<div class="form-tips">支持上传检查报告病历彩超等影像科检查图片最多10个文件</div>
</el-form-item>
<el-form-item label="症状" prop="symptoms">
<el-input
v-model="formData.symptoms"
type="textarea"
:rows="3"
placeholder="请输入症状"
/>
</el-form-item>
<el-row :gutter="20">
<el-col :span="12">
<el-form-item label="舌苔" prop="tongue_coating">
<el-input
v-model="formData.tongue_coating"
placeholder="请输入舌苔情况"
/>
</el-form-item>
</el-col>
<el-col :span="12">
<el-form-item label="脉象" prop="pulse">
<el-input
v-model="formData.pulse"
placeholder="请输入脉象"
/>
</el-form-item>
</el-col>
</el-row>
<el-form-item label="治则" prop="treatment_principle">
<el-input
v-model="formData.treatment_principle"
type="textarea"
:rows="3"
placeholder="请输入治则"
/>
</el-form-item>
<el-form-item label="处方" prop="prescription">
<el-input
v-model="formData.prescription"
type="textarea"
:rows="3"
placeholder="请输入处方"
/>
</el-form-item>
<el-form-item label="医嘱" prop="doctor_advice">
<el-input
v-model="formData.doctor_advice"
type="textarea"
:rows="3"
placeholder="请输入医嘱"
/>
</el-form-item>
<el-form-item label="备注" prop="remark">
<el-input
v-model="formData.remark"
type="textarea"
:rows="2"
placeholder="请输入备注"
/>
</el-form-item>
</el-form>
</el-tab-pane>
<!-- 血糖血压记录标签页 -->
<el-tab-pane label="血糖血压记录" name="blood" :disabled="!formData.id">
<blood-record-list
v-if="formData.id"
:diagnosis-id="Number(formData.id)"
:patient-id="Number(formData.patient_id)"
/>
<el-empty v-else description="请先保存诊单后再添加血糖血压记录" />
</el-tab-pane>
</el-tabs>
<template #footer>
<div class="flex justify-end gap-3 px-4 pb-4">
<el-button @click="handleClose">取消</el-button>
<el-button
v-if="activeTab === 'basic'"
type="primary"
@click="handleSubmit"
:loading="submitting"
>
确定
</el-button>
</div>
</template>
</el-drawer>
</div>
</template>
<script setup lang="ts">
import { tcmDiagnosisAdd, tcmDiagnosisEdit, tcmDiagnosisDetail, checkPhone, checkIdCard } from '@/api/tcm'
import { getDictData } from '@/api/app'
import feedback from '@/utils/feedback'
import { ElMessage } from 'element-plus'
import BloodRecordList from './components/BloodRecordList.vue'
const emit = defineEmits(['success'])
const visible = ref(false)
const formRef = ref()
const mode = ref('add')
const submitting = ref(false)
const activeTab = ref('basic')
const drawerTitle = computed(() => (mode.value === 'add' ? '新增诊单' : '编辑诊单'))
const formData = ref({
id: '',
patient_id: '',
patient_name: '',
id_card: '',
phone: '',
gender: 1,
age: undefined as number | undefined,
diagnosis_date: '',
diagnosis_type: '',
syndrome_type: '',
// 现病史字段
appetite: '',
water_intake: '',
diet_condition: [],
weight_change: '',
body_feeling: [],
sleep_condition: [],
eye_condition: [],
head_feeling: [],
sweat_condition: [],
skin_condition: [],
urine_condition: [],
stool_condition: [],
kidney_condition: [],
fatty_liver_degree: '',
// 既往史
past_history: [],
// 其他病史
trauma_history: 0,
surgery_history: 0,
allergy_history: 0,
family_history: 0,
pregnancy_history: 0,
// 文件上传
tongue_images: [],
report_files: [],
// 诊断信息
symptoms: '',
tongue_coating: '',
pulse: '',
treatment_principle: '',
prescription: '',
doctor_advice: '',
remark: '',
status: 1
})
// 自定义验证规则
const validatePhone = (rule: any, value: any, callback: any) => {
if (!value) {
callback(new Error('请输入手机号'))
return
}
if (!/^1[3-9]\d{9}$/.test(value)) {
callback(new Error('手机号格式不正确'))
return
}
callback()
}
const validateIdCard = (rule: any, value: any, callback: any) => {
if (value && !/^[1-9]\d{5}(18|19|20)\d{2}(0[1-9]|1[0-2])(0[1-9]|[12]\d|3[01])\d{3}[\dXx]$/.test(value)) {
callback(new Error('身份证号格式不正确'))
return
}
callback()
}
const formRules = {
patient_name: [{ required: true, message: '请输入患者姓名', trigger: 'blur' }],
id_card: [{ validator: validateIdCard, trigger: 'blur' }],
phone: [{ required: true, validator: validatePhone, trigger: 'blur' }],
gender: [{ required: true, message: '请选择性别', trigger: 'change' }],
age: [{ required: true, message: '请输入年龄', trigger: 'blur' }],
diagnosis_date: [{ required: true, message: '请选择诊断日期', trigger: 'change' }],
diagnosis_type: [{ required: true, message: '请选择诊断类型', trigger: 'change' }],
syndrome_type: [{ required: true, message: '请选择证型', trigger: 'change' }]
}
// 获取字典选项
const diagnosisTypeOptions = ref<any[]>([])
const syndromeTypeOptions = ref<any[]>([])
const pastHistoryOptions = ref<any[]>([])
// 现病史字典选项
const appetiteOptions = ref<any[]>([])
const waterIntakeOptions = ref<any[]>([])
const dietConditionOptions = ref<any[]>([])
const weightChangeOptions = ref<any[]>([])
const bodyFeelingOptions = ref<any[]>([])
const sleepConditionOptions = ref<any[]>([])
const eyeConditionOptions = ref<any[]>([])
const headFeelingOptions = ref<any[]>([])
const sweatConditionOptions = ref<any[]>([])
const skinConditionOptions = ref<any[]>([])
const urineConditionOptions = ref<any[]>([])
const stoolConditionOptions = ref<any[]>([])
const kidneyConditionOptions = ref<any[]>([])
const fattyLiverDegreeOptions = ref<any[]>([])
const getDictOptions = async () => {
try {
const [
diagnosisType,
syndromeType,
pastHistory,
appetite,
waterIntake,
dietCondition,
weightChange,
bodyFeeling,
sleepCondition,
eyeCondition,
headFeeling,
sweatCondition,
skinCondition,
urineCondition,
stoolCondition,
kidneyCondition,
fattyLiverDegree
] = await Promise.all([
getDictData({ type: 'diagnosis_type' }),
getDictData({ type: 'syndrome_type' }),
getDictData({ type: 'past_history' }),
getDictData({ type: 'appetite' }),
getDictData({ type: 'water_intake' }),
getDictData({ type: 'diet_condition' }),
getDictData({ type: 'weight_change' }),
getDictData({ type: 'body_feeling' }),
getDictData({ type: 'sleep_condition' }),
getDictData({ type: 'eye_condition' }),
getDictData({ type: 'head_feeling' }),
getDictData({ type: 'sweat_condition' }),
getDictData({ type: 'skin_condition' }),
getDictData({ type: 'urine_condition' }),
getDictData({ type: 'stool_condition' }),
getDictData({ type: 'kidney_condition' }),
getDictData({ type: 'fatty_liver_degree' })
])
diagnosisTypeOptions.value = diagnosisType?.diagnosis_type || []
syndromeTypeOptions.value = syndromeType?.syndrome_type || []
pastHistoryOptions.value = pastHistory?.past_history || []
appetiteOptions.value = appetite?.appetite || []
waterIntakeOptions.value = waterIntake?.water_intake || []
dietConditionOptions.value = dietCondition?.diet_condition || []
weightChangeOptions.value = weightChange?.weight_change || []
bodyFeelingOptions.value = bodyFeeling?.body_feeling || []
sleepConditionOptions.value = sleepCondition?.sleep_condition || []
eyeConditionOptions.value = eyeCondition?.eye_condition || []
headFeelingOptions.value = headFeeling?.head_feeling || []
sweatConditionOptions.value = sweatCondition?.sweat_condition || []
skinConditionOptions.value = skinCondition?.skin_condition || []
urineConditionOptions.value = urineCondition?.urine_condition || []
stoolConditionOptions.value = stoolCondition?.stool_condition || []
kidneyConditionOptions.value = kidneyCondition?.kidney_condition || []
fattyLiverDegreeOptions.value = fattyLiverDegree?.fatty_liver_degree || []
} catch (error) {
console.error('获取字典数据失败:', error)
}
}
// 手机号失焦检查
const handlePhoneBlur = async () => {
if (!formData.value.phone || !/^1[3-9]\d{9}$/.test(formData.value.phone)) {
return
}
try {
const result = await checkPhone({
phone: formData.value.phone,
id: formData.value.id || ''
})
if (result.exists) {
ElMessage.warning(result.message)
}
} catch (error) {
console.error('检查手机号失败:', error)
}
}
// 身份证号失焦检查
const handleIdCardBlur = async () => {
if (!formData.value.id_card || !/^[1-9]\d{5}(18|19|20)\d{2}(0[1-9]|1[0-2])(0[1-9]|[12]\d|3[01])\d{3}[\dXx]$/.test(formData.value.id_card)) {
return
}
try {
const result = await checkIdCard({
id_card: formData.value.id_card,
id: formData.value.id || ''
})
if (result.exists) {
ElMessage.warning(result.message)
}
} catch (error) {
console.error('检查身份证号失败:', error)
}
}
const open = async (type: string, id?: number) => {
mode.value = type
visible.value = true
activeTab.value = 'basic' // 重置到基本信息标签页
// 加载字典数据
await getDictOptions()
if (type === 'edit' && id) {
const data = await tcmDiagnosisDetail({ id })
formData.value = data
}
}
const handleSubmit = async () => {
await formRef.value?.validate()
submitting.value = true
try {
if (mode.value === 'add') {
const result = await tcmDiagnosisAdd(formData.value)
// 如果是新增,保存成功后切换到编辑模式,这样可以添加血糖血压记录
if (result && result.id) {
mode.value = 'edit'
formData.value.id = result.id
// 重新获取详情,确保patient_id等字段正确
try {
const detail = await tcmDiagnosisDetail({ id: result.id })
formData.value.patient_id = detail.patient_id
} catch (error) {
console.error('获取详情失败:', error)
}
}
} else {
await tcmDiagnosisEdit(formData.value)
}
emit('success')
} catch (error) {
console.error('提交失败:', error)
} finally {
submitting.value = false
}
}
const handleClose = () => {
formRef.value?.resetFields()
formData.value = {
id: '',
patient_id: '',
patient_name: '',
id_card: '',
phone: '',
gender: 1,
age: undefined as number | undefined,
diagnosis_date: '',
diagnosis_type: '',
syndrome_type: '',
appetite: '',
water_intake: '',
diet_condition: [],
weight_change: '',
body_feeling: [],
sleep_condition: [],
eye_condition: [],
head_feeling: [],
sweat_condition: [],
skin_condition: [],
urine_condition: [],
stool_condition: [],
kidney_condition: [],
fatty_liver_degree: '',
past_history: [],
trauma_history: 0,
surgery_history: 0,
allergy_history: 0,
family_history: 0,
pregnancy_history: 0,
tongue_images: [],
report_files: [],
symptoms: '',
tongue_coating: '',
pulse: '',
treatment_principle: '',
prescription: '',
doctor_advice: '',
remark: '',
status: 1
}
visible.value = false
}
defineExpose({
open
})
</script>
<style lang="scss" scoped>
.edit-drawer {
:deep(.el-checkbox-group) {
.el-checkbox {
margin-right: 20px;
margin-bottom: 10px;
}
}
:deep(.el-radio-group) {
.el-radio {
margin-right: 20px;
margin-bottom: 10px;
}
}
.form-tips {
font-size: 12px;
color: #999;
margin-top: 5px;
}
}
</style>
<style lang="scss">
/* 全局样式,用于提高弹出层的z-index */
.high-z-index {
z-index: 3000 !important;
}
/* 降低抽屉及其遮罩层的z-index */
.el-drawer {
z-index: 1500 !important;
}
.el-overlay {
z-index: 1499 !important;
}
/* 确保日期选择器和下拉选择器的弹出层在最上层 */
.el-picker__popper,
.el-select__popper,
.el-popper {
z-index: 3000 !important;
}
/* 确保Element Plus的弹出层容器在最上层 */
.el-picker-panel,
.el-select-dropdown {
z-index: 3000 !important;
}
</style>