Files
zyt/admin/src/views/tcm/diagnosis/edit.vue
T
2026-03-14 11:16:04 +08:00

1096 lines
42 KiB
Vue
Raw Blame History

This file contains ambiguous Unicode characters
This file contains Unicode characters that might be confused with other characters. If you think that this is intentional, you can safely ignore this warning. Use the Escape button to reveal them.
<template>
<div class="edit-drawer">
<el-drawer
v-model="visible"
:title="drawerTitle"
size="70%"
:before-close="handleClose"
:z-index="1500"
:modal="true"
class="diagnosis-drawer"
>
<el-tabs v-model="activeTab" class="diagnosis-tabs">
<!-- 基本信息标签页 -->
<el-tab-pane label="基本信息" name="basic">
<el-form
ref="formRef"
:model="formData"
:rules="formRules"
label-width="160px"
>
<!-- 基本信息 -->
<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-divider content-position="left">生命体征</el-divider>
<el-row :gutter="20">
<el-col :span="8">
<el-form-item label="婚姻状态" prop="marital_status">
<el-select
v-model="formData.marital_status"
placeholder="请选择婚姻状态"
class="w-full"
:popper-options="{ strategy: 'fixed' }"
popper-class="high-z-index"
>
<el-option label="未婚" :value="0" />
<el-option label="已婚" :value="1" />
<el-option label="离异" :value="2" />
</el-select>
</el-form-item>
</el-col>
<el-col :span="8">
<el-form-item label="身高(cm)" prop="height">
<el-input-number
v-model="formData.height"
:min="0"
:max="300"
placeholder="请输入身高"
class="w-full"
/>
</el-form-item>
</el-col>
<el-col :span="8">
<el-form-item label="体重(kg)" prop="weight">
<el-input-number
v-model="formData.weight"
:min="0"
:max="500"
:step="0.1"
placeholder="请输入体重"
class="w-full"
/>
</el-form-item>
</el-col>
</el-row>
<el-row :gutter="20">
<el-col :span="8">
<el-form-item label="地区" prop="region">
<el-input
v-model="formData.region"
placeholder="请输入地区"
/>
</el-form-item>
</el-col>
<el-col :span="8">
<el-form-item label="收缩压(mmHg)" prop="systolic_pressure">
<el-input-number
v-model="formData.systolic_pressure"
:min="0"
:max="250"
placeholder="请输入收缩压"
class="w-full"
/>
</el-form-item>
</el-col>
<el-col :span="8">
<el-form-item label="舒张压(mmHg)" prop="diastolic_pressure">
<el-input-number
v-model="formData.diastolic_pressure"
:min="0"
:max="150"
placeholder="请输入舒张压"
class="w-full"
/>
</el-form-item>
</el-col>
</el-row>
<el-row :gutter="20">
<el-col :span="8">
<el-form-item label="空腹血糖(mmol/L)" prop="fasting_blood_sugar">
<el-input-number
v-model="formData.fasting_blood_sugar"
:min="0"
:max="50"
:step="0.1"
placeholder="请输入空腹血糖"
class="w-full"
/>
</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="12">
<el-form-item label="糖尿病期数" prop="diabetes_type">
<el-select
v-model="formData.diabetes_type"
placeholder="请选择糖尿病期数"
class="w-full"
:popper-options="{ strategy: 'fixed' }"
popper-class="high-z-index"
>
<el-option
v-for="item in diabetesTypeOptions"
:key="item.value"
:label="item.name + (item.remark ? ' (' + item.remark + ')' : '')"
:value="item.value"
/>
</el-select>
</el-form-item>
</el-col>
<el-col :span="12">
<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="发现糖尿病就患病史" prop="diabetes_discovery_year">
<el-input-number
v-model="formData.diabetes_discovery_year"
:min="0"
:max="100"
placeholder="请输入年数"
class="w-full"
/>
<template #append></template>
</el-form-item>
</el-col>
</el-row>
<el-form-item label="当地医院诊断结果" class="checkbox-form-item">
<el-checkbox-group v-model="formData.local_hospital_diagnosis">
<el-checkbox-button label="糖尿病">糖尿病</el-checkbox-button>
<el-checkbox-button label="高血压">高血压</el-checkbox-button>
<el-checkbox-button label="糖尿病高血压">糖尿病高血压</el-checkbox-button>
</el-checkbox-group>
</el-form-item>
<el-form-item label="当地就诊医院名称" prop="local_hospital_name">
<el-input
v-model="formData.local_hospital_name"
placeholder="请输入当地就诊医院名称(不能填写当地、本地、互联网等关键词)"
/>
</el-form-item>
<el-divider content-position="left">现病史</el-divider>
<el-row :gutter="20">
<el-col :span="12">
<el-form-item label="口腔感觉" class="compact-form-item">
<el-radio-group v-model="formData.appetite">
<el-radio-button v-for="item in appetiteOptions" :key="item.value" :label="item.value">
{{ item.name }}
</el-radio-button>
</el-radio-group>
</el-form-item>
</el-col>
</el-row>
<el-row :gutter="20">
<el-col :span="20">
<el-form-item label="每日饮水量" class="compact-form-item">
<el-radio-group v-model="formData.water_intake">
<el-radio-button v-for="item in waterIntakeOptions" :key="item.value" :label="item.value">
{{ item.name }}
</el-radio-button>
</el-radio-group>
</el-form-item>
</el-col>
</el-row>
<el-row :gutter="20">
<el-col :span="12">
<el-form-item label="近一个月体重变化" class="compact-form-item">
<el-radio-group v-model="formData.weight_change">
<el-radio-button v-for="item in weightChangeOptions" :key="item.value" :label="item.value">
{{ item.name }}
</el-radio-button>
</el-radio-group>
</el-form-item>
</el-col>
</el-row>
<el-row :gutter="20">
<el-col :span="12">
<el-form-item label="脂肪肝程度" class="compact-form-item">
<el-radio-group v-model="formData.fatty_liver_degree">
<el-radio-button v-for="item in fattyLiverDegreeOptions" :key="item.value" :label="item.value">
{{ item.name }}
</el-radio-button>
</el-radio-group>
</el-form-item>
</el-col>
</el-row>
<el-form-item label="饮食情况" class="checkbox-form-item">
<el-checkbox-group v-model="formData.diet_condition">
<el-checkbox-button v-for="item in dietConditionOptions" :key="item.value" :label="item.value">
{{ item.name }}
</el-checkbox-button>
</el-checkbox-group>
</el-form-item>
<el-form-item label="肢体感觉" class="checkbox-form-item">
<el-checkbox-group v-model="formData.body_feeling">
<el-checkbox-button v-for="item in bodyFeelingOptions" :key="item.value" :label="item.value">
{{ item.name }}
</el-checkbox-button>
</el-checkbox-group>
</el-form-item>
<el-form-item label="睡眠情况" class="checkbox-form-item">
<el-checkbox-group v-model="formData.sleep_condition">
<el-checkbox-button v-for="item in sleepConditionOptions" :key="item.value" :label="item.value">
{{ item.name }}
</el-checkbox-button>
</el-checkbox-group>
</el-form-item>
<el-form-item label="眼睛情况" class="checkbox-form-item">
<el-checkbox-group v-model="formData.eye_condition">
<el-checkbox-button v-for="item in eyeConditionOptions" :key="item.value" :label="item.value">
{{ item.name }}
</el-checkbox-button>
</el-checkbox-group>
</el-form-item>
<el-form-item label="头部感觉" class="checkbox-form-item">
<el-checkbox-group v-model="formData.head_feeling">
<el-checkbox-button v-for="item in headFeelingOptions" :key="item.value" :label="item.value">
{{ item.name }}
</el-checkbox-button>
</el-checkbox-group>
</el-form-item>
<el-form-item label="出汗情况" class="checkbox-form-item">
<el-checkbox-group v-model="formData.sweat_condition">
<el-checkbox-button v-for="item in sweatConditionOptions" :key="item.value" :label="item.value">
{{ item.name }}
</el-checkbox-button>
</el-checkbox-group>
</el-form-item>
<el-form-item label="皮肤情况" class="checkbox-form-item">
<el-checkbox-group v-model="formData.skin_condition">
<el-checkbox-button v-for="item in skinConditionOptions" :key="item.value" :label="item.value">
{{ item.name }}
</el-checkbox-button>
</el-checkbox-group>
</el-form-item>
<el-form-item label="小便情况" class="checkbox-form-item">
<el-checkbox-group v-model="formData.urine_condition">
<el-checkbox-button v-for="item in urineConditionOptions" :key="item.value" :label="item.value">
{{ item.name }}
</el-checkbox-button>
</el-checkbox-group>
</el-form-item>
<el-form-item label="大便情况" class="checkbox-form-item">
<el-checkbox-group v-model="formData.stool_condition">
<el-checkbox-button v-for="item in stoolConditionOptions" :key="item.value" :label="item.value">
{{ item.name }}
</el-checkbox-button>
</el-checkbox-group>
</el-form-item>
<el-form-item label="腰肾情况" class="checkbox-form-item">
<el-checkbox-group v-model="formData.kidney_condition">
<el-checkbox-button v-for="item in kidneyConditionOptions" :key="item.value" :label="item.value">
{{ item.name }}
</el-checkbox-button>
</el-checkbox-group>
</el-form-item>
<el-form-item label="病逝补充" prop="symptoms">
<el-input
v-model="formData.symptoms"
type="textarea"
:rows="3"
placeholder="请输入症状"
/>
</el-form-item>
<!-- 既往史 -->
<el-divider content-position="left">既往史</el-divider>
<el-form-item label="" prop="past_history" class="checkbox-form-item">
<el-checkbox-group v-model="formData.past_history">
<el-checkbox-button
v-for="item in pastHistoryOptions"
:key="item.value"
:label="item.value"
>
{{ item.name }}
</el-checkbox-button>
</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-button :label="1"></el-radio-button>
<el-radio-button :label="0"></el-radio-button>
</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-button :label="1"></el-radio-button>
<el-radio-button :label="0"></el-radio-button>
</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-button :label="1"></el-radio-button>
<el-radio-button :label="0"></el-radio-button>
</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-button :label="1"></el-radio-button>
<el-radio-button :label="0"></el-radio-button>
</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-button :label="1"></el-radio-button>
<el-radio-button :label="0"></el-radio-button>
</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-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 useUserStore from '@/stores/modules/user'
import { ElMessage } from 'element-plus'
import { QuestionFilled } from '@element-plus/icons-vue'
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: '',
diabetes_type: '',
diabetes_discovery_year: undefined as number | undefined,
local_hospital_diagnosis: [],
local_hospital_name: '',
marital_status: undefined as number | undefined,
height: undefined as number | undefined,
weight: undefined as number | undefined,
region: '',
systolic_pressure: undefined as number | undefined,
diastolic_pressure: undefined as number | undefined,
fasting_blood_sugar: undefined as number | undefined,
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,
external_userid: ''
})
// 自定义验证规则
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' }],
diabetes_type: [{ required: true, message: '请选择糖尿病期数', trigger: 'change' }]
}
// 获取字典选项
const diagnosisTypeOptions = ref<any[]>([])
const syndromeTypeOptions = ref<any[]>([])
const diabetesTypeOptions = 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,
diabetesType,
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: 'diabetes_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 || []
diabetesTypeOptions.value = diabetesType?.diabetes_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
} else if (type === 'add') {
const userStore = useUserStore()
formData.value.assistant_id = userStore.userInfo?.id || ''
}
}
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,
diabetes_type: '',
marital_status: undefined as number | undefined,
height: undefined as number | undefined,
weight: undefined as number | undefined,
region: '',
systolic_pressure: undefined as number | undefined,
diastolic_pressure: undefined as number | undefined,
fasting_blood_sugar: undefined as number | undefined,
diabetes_discovery_year: undefined as number | undefined,
local_hospital_diagnosis: [],
local_hospital_name: '',
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,
external_userid: ''
}
visible.value = false
}
defineExpose({
open
})
</script>
<style lang="scss" scoped>
.edit-drawer {
font-size: 12px;
:deep(.el-form) {
padding-bottom: 20px;
font-size: 12px;
}
:deep(.el-divider) {
margin: 24px 0 20px;
.el-divider__text {
font-size: 13px;
font-weight: 600;
color: #303133;
background: #f5f7fa;
padding: 0 16px;
}
}
:deep(.el-form-item) {
margin-bottom: 18px;
}
:deep(.el-form-item__label) {
font-size: 12px;
font-weight: 500;
color: #606266;
}
:deep(.el-input__inner) {
font-size: 12px;
}
:deep(.el-textarea__inner) {
font-size: 12px;
}
:deep(.el-radio-button__inner) {
font-size: 12px;
}
:deep(.el-checkbox-button__inner) {
font-size: 12px;
}
:deep(.el-button) {
font-size: 12px;
}
// 紧凑型表单项(单选框)
.compact-form-item {
:deep(.el-radio-group) {
display: flex;
flex-wrap: wrap;
gap: 12px;
.el-radio {
margin-right: 0;
margin-bottom: 0;
}
}
}
// 复选框表单项
.checkbox-form-item {
:deep(.el-checkbox-group) {
display: flex;
flex-wrap: wrap;
gap: 12px 16px;
.el-checkbox {
margin-right: 0;
margin-bottom: 0;
}
}
}
// 通用单选框样式
:deep(.el-radio-group) {
.el-radio {
margin-right: 16px;
margin-bottom: 8px;
&:last-child {
margin-right: 0;
}
}
}
// 通用复选框样式
:deep(.el-checkbox-group) {
.el-checkbox {
margin-right: 16px;
margin-bottom: 8px;
}
}
.form-tips {
font-size: 12px;
color: #909399;
margin-top: 4px;
line-height: 1.5;
}
// 输入框样式优化
:deep(.el-input__inner),
:deep(.el-textarea__inner) {
border-radius: 4px;
}
// 选择器样式优化
:deep(.el-select) {
.el-input__inner {
border-radius: 4px;
}
}
// 日期选择器样式优化
:deep(.el-date-editor) {
.el-input__inner {
border-radius: 4px;
}
}
}
</style>
<style lang="scss" scoped>
/* 全局样式,用于提高弹出层的z-index */
.high-z-index {
z-index: 3000 !important;
}
/* 降低抽屉及其遮罩层的z-index */
.el-drawer {
z-index: 1500 !important;
}
.el-overlay {
z-index: 1499 ;
}
/* 确保日期选择器和下拉选择器的弹出层在最上层 */
.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>