<template>
|
<div class="app-container" v-loading="loading">
|
<template v-if="archive">
|
<div class="action-bar">
|
<el-button @click="$router.go(-1)" icon="el-icon-back">返回</el-button>
|
<el-button :type="editing ? 'success' : 'primary'" :icon="editing ? 'el-icon-check' : 'el-icon-edit'" @click="toggleEdit">{{ editing ? '保存' : '编辑' }}</el-button>
|
<el-tag :type="subTypeTag(archive.subType)" style="margin-left:12px">{{ archive.subTypeLabel }}</el-tag>
|
</div>
|
|
<!-- 患者基本信息 -->
|
<el-card class="info-card" shadow="never">
|
<div slot="header" class="card-header"><span>患者基本信息</span></div>
|
<el-row :gutter="20">
|
<el-col :span="6"><InfoField label="姓名" :value="archive.patname" /></el-col>
|
<el-col :span="6"><InfoField label="性别" :value="archive.sex == 1 ? '男' : '女'" /></el-col>
|
<el-col :span="6"><InfoField label="年龄" :value="archive.age" /></el-col>
|
<el-col :span="6"><InfoField label="电话" :value="archive.telcode" /></el-col>
|
</el-row>
|
<el-row :gutter="20" style="margin-top:10px">
|
<el-col :span="6"><InfoField label="科室" :value="archive.deptname" /></el-col>
|
<el-col :span="6"><InfoField label="诊断" :value="archive.diagname" /></el-col>
|
<el-col :span="6"><InfoField label="主治医生" :value="archive.drname" /></el-col>
|
<el-col :span="6"><InfoField label="来源" :value="sourceLabel" /></el-col>
|
</el-row>
|
</el-card>
|
|
<!-- 家长信息 -->
|
<el-card class="info-card" shadow="never" style="margin-top:14px">
|
<div slot="header" class="card-header"><span>家长/监护人信息</span></div>
|
<el-row :gutter="20">
|
<el-col :span="6">
|
<InfoField label="家长姓名" :value="parentInfo.parentName" :editing="editing" v-model="parentInfo.parentName" />
|
</el-col>
|
<el-col :span="6">
|
<InfoField label="与儿童关系" :value="relationLabel" :editing="editing" type="select" :options="relationOptions" @change="v => parentInfo.relation = v" />
|
</el-col>
|
<el-col :span="6">
|
<InfoField label="联系电话" :value="parentInfo.parentPhone" :editing="editing" v-model="parentInfo.parentPhone" />
|
</el-col>
|
<el-col :span="6">
|
<InfoField label="身份证号" :value="parentInfo.parentIdCard" :editing="editing" v-model="parentInfo.parentIdCard" />
|
</el-col>
|
</el-row>
|
<el-row :gutter="20" style="margin-top:10px">
|
<el-col :span="12">
|
<InfoField label="联系地址" :value="parentInfo.address" :editing="editing" v-model="parentInfo.address" />
|
</el-col>
|
</el-row>
|
</el-card>
|
|
<!-- 档案基本信息 -->
|
<el-card class="info-card" shadow="never" style="margin-top:14px">
|
<div slot="header" class="card-header">
|
<span>档案基本信息</span>
|
<span class="header-sub">{{ archive.createTime ? archive.createTime.substring(0,10) : '-' }} 建档</span>
|
</div>
|
<el-row :gutter="20">
|
<el-col :span="8"><InfoField label="建档类型" :value="archive.subTypeLabel" /></el-col>
|
<el-col :span="8"><InfoField label="建档医生" :value="archive.archiveForm.doctorName" :editing="editing" v-model="archive.archiveForm.doctorName" /></el-col>
|
<el-col :span="8"><InfoField label="建档时间" :value="archive.createTime" /></el-col>
|
</el-row>
|
</el-card>
|
|
<!-- 高危儿专案 → 可编辑表格 -->
|
<el-card v-if="archive.subType === 'highRisk'" class="info-card" shadow="never" style="margin-top:14px">
|
<div slot="header" class="card-header"><span>高危儿专案管理</span></div>
|
<el-tabs v-model="activeTab" type="border-card">
|
<el-tab-pane label="生长发育监测" name="growth">
|
<EditableTable :data.sync="growthData" :editing="editing" :columns="growthColumns" />
|
</el-tab-pane>
|
<el-tab-pane label="神经系统评估" name="neuro">
|
<EditableTable :data.sync="neuroData" :editing="editing" :columns="neuroColumns" />
|
</el-tab-pane>
|
<el-tab-pane label="干预记录" name="intervention">
|
<EditableTable :data.sync="interventionData" :editing="editing" :columns="interventionColumns" />
|
</el-tab-pane>
|
</el-tabs>
|
</el-card>
|
|
<!-- 营养性疾病专案 → 可编辑表格 -->
|
<el-card v-if="archive.subType === 'nutrition'" class="info-card" shadow="never" style="margin-top:14px">
|
<div slot="header" class="card-header"><span>营养性疾病专案管理</span></div>
|
<el-tabs v-model="activeTab" type="border-card">
|
<el-tab-pane label="体格测量" name="measure">
|
<EditableTable :data.sync="measureData" :editing="editing" :columns="measureColumns" />
|
</el-tab-pane>
|
<el-tab-pane label="膳食评估" name="diet">
|
<EditableTable :data.sync="dietData" :editing="editing" :columns="dietColumns" />
|
</el-tab-pane>
|
<el-tab-pane label="干预方案" name="plan">
|
<EditableTable :data.sync="planData" :editing="editing" :columns="planColumns" />
|
</el-tab-pane>
|
</el-tabs>
|
</el-card>
|
|
<!-- 学习困难专案 → 单一表单 -->
|
<el-card v-if="archive.subType === 'learning'" class="info-card" shadow="never" style="margin-top:14px">
|
<div slot="header" class="card-header"><span>学习困难专案管理</span></div>
|
<el-form :model="form" label-width="130px" size="small" :disabled="!editing">
|
<el-divider content-position="left">学习能力评估</el-divider>
|
<el-row :gutter="20">
|
<el-col :span="8"><el-form-item label="评估日期"><el-date-picker v-model="form.assessDate" value-format="yyyy-MM-dd" style="width:100%" /></el-form-item></el-col>
|
<el-col :span="8"><el-form-item label="测评工具"><el-input v-model="form.testName" /></el-form-item></el-col>
|
<el-col :span="8"><el-form-item label="智商(IQ)"><el-input-number v-model="form.iq" :min="40" :max="160" /></el-form-item></el-col>
|
</el-row>
|
<el-row :gutter="20">
|
<el-col :span="8"><el-form-item label="阅读能力"><el-select v-model="form.reading" style="width:100%"><el-option v-for="o in gradeOptions" :key="o" :label="o" :value="o" /></el-select></el-form-item></el-col>
|
<el-col :span="8"><el-form-item label="书写能力"><el-select v-model="form.writing" style="width:100%"><el-option v-for="o in gradeOptions" :key="o" :label="o" :value="o" /></el-select></el-form-item></el-col>
|
<el-col :span="8"><el-form-item label="计算能力"><el-select v-model="form.math" style="width:100%"><el-option v-for="o in gradeOptions" :key="o" :label="o" :value="o" /></el-select></el-form-item></el-col>
|
</el-row>
|
<el-form-item label="综合结论"><el-input v-model="form.result" type="textarea" :rows="2" /></el-form-item>
|
|
<el-divider content-position="left">行为评估</el-divider>
|
<el-row :gutter="20">
|
<el-col :span="8"><el-form-item label="评估日期"><el-date-picker v-model="form.behaviorDate" value-format="yyyy-MM-dd" style="width:100%" /></el-form-item></el-col>
|
<el-col :span="4"><el-form-item label="注意力"><el-input-number v-model="form.attention" :min="0" :max="36" /></el-form-item></el-col>
|
<el-col :span="4"><el-form-item label="多动"><el-input-number v-model="form.hyperactivity" :min="0" :max="36" /></el-form-item></el-col>
|
<el-col :span="4"><el-form-item label="冲动"><el-input-number v-model="form.impulsivity" :min="0" :max="36" /></el-form-item></el-col>
|
<el-col :span="4"><el-form-item label="情绪"><el-input-number v-model="form.emotional" :min="0" :max="36" /></el-form-item></el-col>
|
</el-row>
|
<el-row :gutter="20">
|
<el-col :span="8"><el-form-item label="总分"><el-input-number v-model="form.totalScore" disabled /></el-form-item></el-col>
|
<el-col :span="8"><el-form-item label="评价"><el-select v-model="form.evaluation" style="width:100%"><el-option label="正常范围" value="正常范围" /><el-option label="轻度异常" value="轻度异常" /><el-option label="中度异常" value="中度异常" /></el-select></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="训练日期"><el-date-picker v-model="form.trainDate" value-format="yyyy-MM-dd" style="width:100%" /></el-form-item></el-col>
|
<el-col :span="8"><el-form-item label="训练类型"><el-input v-model="form.trainingType" /></el-form-item></el-col>
|
<el-col :span="8"><el-form-item label="时长(分钟)"><el-input-number v-model="form.duration" :min="10" :max="120" /></el-form-item></el-col>
|
</el-row>
|
<el-form-item label="训练内容"><el-input v-model="form.trainContent" type="textarea" :rows="2" /></el-form-item>
|
<el-row :gutter="20">
|
<el-col :span="8"><el-form-item label="训练师"><el-input v-model="form.trainer" /></el-form-item></el-col>
|
<el-col :span="8"><el-form-item label="进展"><el-select v-model="form.progress" style="width:100%"><el-option label="良好" value="良好" /><el-option label="一般" value="一般" /><el-option label="缓慢" value="缓慢" /></el-select></el-form-item></el-col>
|
</el-row>
|
</el-form>
|
</el-card>
|
</template>
|
<div v-else class="empty-wrap">档案不存在或已删除</div>
|
</div>
|
</template>
|
|
<script>
|
import EditableTable from "../components/EditableTable.vue";
|
import InfoField from "./InfoField.vue";
|
|
export default {
|
name: "ChildHealthArchiveDetail",
|
components: { EditableTable, InfoField },
|
data() {
|
return {
|
loading: false, archive: null, editing: false, activeTab: "growth",
|
relationOptions: [
|
{ label:"父亲", value:"father" },{ label:"母亲", value:"mother" },{ label:"祖父", value:"grandfather" },{ label:"祖母", value:"grandmother" },{ label:"其他", value:"other" },
|
],
|
gradeOptions: ["优秀","良好","中等","中下","差"],
|
form: { assessDate:"", testName:"", reading:"中等", writing:"中等", math:"中等", iq:null, result:"",
|
behaviorDate:"", attention:null, hyperactivity:null, impulsivity:null, emotional:null, totalScore:null, evaluation:"正常范围",
|
trainDate:"", trainingType:"", trainContent:"", duration:40, trainer:"", progress:"良好" },
|
growthData: [], neuroData: [], interventionData: [],
|
measureData: [], dietData: [], planData: [],
|
growthColumns: [
|
{ prop:"checkDate", label:"检查日期", width:120, type:"date" },{ prop:"monthAge", label:"月龄", width:80 },
|
{ prop:"weight", label:"体重(kg)", width:100, type:"number" },{ prop:"height", label:"身高(cm)", width:100, type:"number" },
|
{ prop:"headCircum", label:"头围(cm)", width:100, type:"number" },{ prop:"weightPercentile", label:"体重百分位", width:110 },
|
{ prop:"heightPercentile", label:"身高百分位", width:110 },{ prop:"evaluation", label:"评估结果", type:"select", options:["正常","偏瘦","偏胖","发育迟缓"] },
|
{ prop:"doctor", label:"检查医生", width:100 },
|
],
|
neuroColumns: [
|
{ prop:"checkDate", label:"评估日期", width:120, type:"date" },{ prop:"monthAge", label:"月龄", width:70 },
|
{ prop:"muscleTone", label:"肌张力", width:100 },{ prop:"reflex", label:"原始反射", width:100 },
|
{ prop:"gms", label:"GMs评估", width:120 },{ prop:"nbnaScore", label:"NBNA评分", width:100, type:"number" },
|
{ prop:"evaluation", label:"综合评估", type:"select", options:["正常","异常","可疑"] },{ prop:"doctor", label:"评估医生", width:100 },
|
],
|
interventionColumns: [
|
{ prop:"date", label:"日期", width:120, type:"date" },{ prop:"type", label:"干预类型", width:140 },
|
{ prop:"content", label:"干预内容", minWidth:200 },{ prop:"frequency", label:"频率", width:120 },
|
{ prop:"effect", label:"效果评价", width:100 },{ prop:"executor", label:"执行人", width:100 },
|
],
|
measureColumns: [
|
{ prop:"checkDate", label:"检查日期", width:120, type:"date" },{ prop:"weight", label:"体重(kg)", width:100, type:"number" },
|
{ prop:"height", label:"身高(cm)", width:100, type:"number" },{ prop:"bmi", label:"BMI", width:80, type:"number" },
|
{ prop:"bmiPercentile", label:"BMI百分位", width:110 },{ prop:"waistHip", label:"腰围/臀围", width:120 },
|
{ prop:"evaluation", label:"营养评价", type:"select", options:["正常","超重","肥胖","营养不良"] },
|
],
|
dietColumns: [
|
{ prop:"date", label:"评估日期", width:120, type:"date" },{ prop:"energy", label:"能量(kcal/d)", width:120, type:"number" },
|
{ prop:"protein", label:"蛋白质(g/d)", width:120, type:"number" },{ prop:"fat", label:"脂肪(g/d)", width:100, type:"number" },
|
{ prop:"carbs", label:"碳水(g/d)", width:100, type:"number" },{ prop:"dietScore", label:"膳食评分", width:100 },
|
{ prop:"problem", label:"存在问题", minWidth:160 },
|
],
|
planColumns: [
|
{ prop:"date", label:"制定日期", width:120, type:"date" },{ prop:"target", label:"干预目标", minWidth:200 },
|
{ prop:"energyTarget", label:"能量目标(kcal)", width:130, type:"number" },{ prop:"foodGuide", label:"膳食指导", minWidth:200 },
|
{ prop:"exercise", label:"运动建议", minWidth:180 },{ prop:"reviewDate", label:"复查日期", width:120 },
|
],
|
};
|
},
|
computed: {
|
parentInfo() { return (this.archive && this.archive.parentInfo) ? this.archive.parentInfo : {}; },
|
sourceLabel() {
|
const map = { standalone:"独立建档", outpatient:"门诊记录", inpatient:"在院记录" };
|
return map[this.archive?.sourcePage] || this.archive?.sourcePage || "-";
|
},
|
relationLabel() {
|
const r = this.relationOptions.find(o => o.value === (this.archive?.parentInfo?.relation));
|
return r ? r.label : "-";
|
},
|
},
|
created() {
|
const id = this.$route.query.id;
|
if (id) this.loadArchive(id);
|
},
|
methods: {
|
loadArchive(id) {
|
this.loading = true;
|
const all = JSON.parse(localStorage.getItem("patientArchives") || "[]");
|
this.archive = all.find(item => item.id === id) || null;
|
if (this.archive) {
|
if (this.archive.subType === 'highRisk') {
|
this.activeTab = "growth";
|
this.growthData = this.archive.growthData || getDefaultGrowthData();
|
this.neuroData = this.archive.neuroData || getDefaultNeuroData();
|
this.interventionData = this.archive.interventionData || getDefaultInterventionData();
|
} else if (this.archive.subType === 'nutrition') {
|
this.activeTab = "measure";
|
this.measureData = this.archive.measureData || getDefaultMeasureData();
|
this.dietData = this.archive.dietData || getDefaultDietData();
|
this.planData = this.archive.planData || getDefaultPlanData();
|
} else if (this.archive.subType === 'learning' && this.archive.archiveForm?.learningData) {
|
Object.assign(this.form, this.archive.archiveForm.learningData);
|
}
|
}
|
this.loading = false;
|
},
|
toggleEdit() {
|
if (this.editing) {
|
if (this.archive.subType === 'learning') {
|
if (!this.archive.archiveForm) this.archive.archiveForm = {};
|
this.archive.archiveForm.learningData = JSON.parse(JSON.stringify(this.form));
|
}
|
if (this.archive.subType === 'highRisk') {
|
this.archive.growthData = JSON.parse(JSON.stringify(this.growthData));
|
this.archive.neuroData = JSON.parse(JSON.stringify(this.neuroData));
|
this.archive.interventionData = JSON.parse(JSON.stringify(this.interventionData));
|
}
|
if (this.archive.subType === 'nutrition') {
|
this.archive.measureData = JSON.parse(JSON.stringify(this.measureData));
|
this.archive.dietData = JSON.parse(JSON.stringify(this.dietData));
|
this.archive.planData = JSON.parse(JSON.stringify(this.planData));
|
}
|
this.archive.updateTime = new Date().toISOString().replace("T"," ").substring(0,19);
|
const all = JSON.parse(localStorage.getItem("patientArchives") || "[]");
|
const idx = all.findIndex(item => item.id === this.archive.id);
|
if (idx >= 0) all[idx] = JSON.parse(JSON.stringify(this.archive));
|
localStorage.setItem("patientArchives", JSON.stringify(all));
|
this.$message.success("保存成功");
|
}
|
this.editing = !this.editing;
|
},
|
subTypeTag(type) { const m={highRisk:"danger",nutrition:"warning",learning:"info"}; return m[type]||""; },
|
},
|
};
|
|
function getDefaultGrowthData() {
|
return [
|
{ checkDate:"2026-07-01", monthAge:"1月", weight:4.2, height:54.5, headCircum:37.0, weightPercentile:"P25", heightPercentile:"P30", evaluation:"正常", doctor:"张医生" },
|
{ checkDate:"2026-08-01", monthAge:"2月", weight:5.3, height:58.0, headCircum:39.0, weightPercentile:"P35", heightPercentile:"P40", evaluation:"正常", doctor:"张医生" },
|
];
|
}
|
function getDefaultNeuroData() {
|
return [
|
{ checkDate:"2026-07-01", monthAge:"1月", muscleTone:"正常", reflex:"存在", gms:"正常扭动", nbnaScore:38, evaluation:"正常", doctor:"王医生" },
|
];
|
}
|
function getDefaultInterventionData() {
|
return [
|
{ date:"2026-07-01", type:"早期干预训练", content:"俯卧抬头训练、视觉追踪训练", frequency:"每日2次", effect:"良好", executor:"康复师赵" },
|
];
|
}
|
function getDefaultMeasureData() {
|
return [
|
{ checkDate:"2026-07-05", weight:28.5, height:132.0, bmi:16.4, bmiPercentile:"P85", waistHip:"62/74", evaluation:"超重" },
|
];
|
}
|
function getDefaultDietData() {
|
return [
|
{ date:"2026-07-05", energy:2200, protein:65, fat:80, carbs:320, dietScore:"65", problem:"能量摄入偏高、蔬菜水果摄入不足" },
|
];
|
}
|
function getDefaultPlanData() {
|
return [
|
{ date:"2026-07-05", target:"3个月内BMI降至P75以下", energyTarget:1800, foodGuide:"控制零食、增加蔬菜至每日300g", exercise:"每日运动60分钟", reviewDate:"2026-10-05" },
|
];
|
}
|
</script>
|
|
<style lang="scss" scoped>
|
.action-bar { margin-bottom: 16px; }
|
.info-card { margin-bottom: 0; }
|
.card-header { display: flex; justify-content: space-between; align-items: center; font-size: 16px; font-weight: 600; }
|
.header-sub { font-size: 13px; color: #909399; font-weight: normal; }
|
.empty-wrap { text-align: center; padding: 100px 0; color: #c0c4cc; font-size: 16px; }
|
</style>
|
