| | |
| | | > |
| | | </el-tabs> |
| | | </el-tab-pane> |
| | | <!-- <el-tab-pane name="monitor"> |
| | | <el-tab-pane name="monitor"> |
| | | <span class="mulsz" slot="label" |
| | | ><i class="el-icon-s-data"></i> 健康监测</span |
| | | > |
| | | |
| | | <el-tabs v-model="sontwoactiveName" @tab-click="handleClick"> |
| | | <el-tab-pane name="blood" |
| | | <el-tabs v-model="sontwoactiveName"> |
| | | <!-- <el-tab-pane name="blood" |
| | | ><span class="mulsz" slot="label" |
| | | ><i class="el-icon-s-operation"></i> 血压</span |
| | | ></el-tab-pane |
| | |
| | | ><span class="mulsz" slot="label" |
| | | ><i class="el-icon-odometer"></i>血糖 |
| | | </span></el-tab-pane |
| | | > |
| | | > --> |
| | | <el-tab-pane name="weight" |
| | | ><span class="mulsz" slot="label" |
| | | ><i class="el-icon-s-data"></i>体重 |
| | | ><i class="el-icon-s-data"></i>身高头围趋势 |
| | | </span></el-tab-pane |
| | | > |
| | | <el-tab-pane name="heartrate" |
| | | <!-- <el-tab-pane name="heartrate" |
| | | ><span class="mulsz" slot="label" |
| | | ><i class="el-icon-s-operation"></i>心率 |
| | | </span></el-tab-pane |
| | |
| | | ><span class="mulsz" slot="label" |
| | | ><i class="el-icon-s-opportunity"></i>体温 |
| | | </span></el-tab-pane |
| | | > |
| | | </el-tabs></el-tab-pane |
| | | > --> |
| | | > --> |
| | | </el-tabs> |
| | | </el-tab-pane> |
| | | <el-tab-pane name="serve"> |
| | | <span class="mulsz" slot="label" |
| | | ><i class="el-icon-s-custom"></i> 服务记录</span |
| | |
| | | v-model="userform.name" |
| | | placeholder="请输入姓名" |
| | | maxlength="30" |
| | | disabled |
| | | ></el-input> </el-form-item |
| | | ></el-col> |
| | | <el-col :span="12" |
| | |
| | | v-model="inputValue" |
| | | @change="handleInputConfirm" |
| | | filterable |
| | | remote |
| | | :remote-method="remoteMethod" |
| | | allow-create |
| | | default-first-option |
| | | placeholder="请选择/查询" |
| | |
| | | prop="leavehospitaldistrictname" |
| | | width="120" |
| | | /> |
| | | <el-table-column |
| | | <!-- <el-table-column |
| | | label="主治医生" |
| | | align="center" |
| | | key="drname" |
| | |
| | | key="nurseName" |
| | | prop="nurseName" |
| | | width="120" |
| | | /> |
| | | /> --> |
| | | </el-table> |
| | | <pagination |
| | | v-show="total > 0" |
| | |
| | | prop="bedNo" |
| | | width="120" |
| | | /> |
| | | |
| | | </el-table> |
| | | </div> |
| | | <!-- 出院 --> |
| | |
| | | prop="bedNo" |
| | | width="120" |
| | | /> |
| | | |
| | | </el-table> |
| | | </div> |
| | | </div> |
| | |
| | | border-left: 4px solid rgb(190, 65, 134); |
| | | " |
| | | > |
| | | <span v-if="item.serviceType==2">出院随访</span> |
| | | <span v-if="item.serviceType==1">监测评估</span> |
| | | <span v-if="item.serviceType==3">门诊随访</span> |
| | | <span v-if="item.serviceType==4">宣教关怀</span> |
| | | <span v-if="item.serviceType == 2">出院随访</span> |
| | | <span v-if="item.serviceType == 1">监测评估</span> |
| | | <span v-if="item.serviceType == 3">门诊随访</span> |
| | | <span v-if="item.serviceType == 4">宣教关怀</span> |
| | | </div> |
| | | <el-divider></el-divider> |
| | | <div style="margin-top: 10px"> |
| | | 服务名称:<span style="color: #2775b6" |
| | | >{{ item.templatename }}</span |
| | | > |
| | | 服务名称:<span style="color: #2775b6">{{ |
| | | item.templatename |
| | | }}</span> |
| | | </div> |
| | | <div style="margin-top: 10px"> |
| | | 创建时间:<span style="color: #2775b6" |
| | | >{{item.createTime}}</span |
| | | > |
| | | 创建时间:<span style="color: #2775b6">{{ item.createTime }}</span> |
| | | </div> |
| | | <div style="margin-top: 10px"> |
| | | 完成时间:<span style="color: #2775b6" |
| | | >{{ item.finishtime }}</span |
| | | > |
| | | 完成时间:<span style="color: #2775b6">{{ item.finishtime }}</span> |
| | | </div> |
| | | <div style="margin-top: 10px"> |
| | | <el-row :gutter="20"> |
| | |
| | | > |
| | | <el-col :span="12" |
| | | >病区: |
| | | <span style="color: #2775b6">{{ item.leavehospitaldistrictname }}</span></el-col |
| | | <span style="color: #2775b6">{{ |
| | | item.leavehospitaldistrictname |
| | | }}</span></el-col |
| | | > |
| | | |
| | | </el-row> |
| | | </div> |
| | | |
| | |
| | | <span style="color: #2775b6">{{ item.drname }}</span></el-col |
| | | > |
| | | <el-col :span="6" |
| | | >责任护士 <span style="color: #2775b6">{{ item.nurseName }}</span></el-col |
| | | >责任护士 |
| | | <span style="color: #2775b6">{{ item.nurseName }}</span></el-col |
| | | > |
| | | </el-row> |
| | | </div> |
| | | <div style="margin-top: 10px"> |
| | | 结果状态: |
| | | <span style="color: #2775b6" v-if="item.excep==0">服务正常</span> |
| | | <span style="color: #B55E54" v-if="item.excep==1">异常</span> |
| | | |
| | | <span style="color: #2775b6" v-if="item.excep == 0">服务正常</span> |
| | | <span style="color: #b55e54" v-if="item.excep == 1">异常</span> |
| | | </div> |
| | | <!-- <div style="margin-top: 10px"> |
| | | 备注: |
| | |
| | | </div> |
| | | </div> |
| | | <!-- 健康监测 --> |
| | | <!-- <div class="medical-record" v-show="activeName == 'monitor'"> |
| | | <div v-show="sontwoactiveName == 'blood'" style="display: flex"> |
| | | <div class="medical-record" v-show="activeName == 'monitor'"> |
| | | <!-- <div v-show="sontwoactiveName == 'blood'" style="display: flex"> |
| | | <div |
| | | id="xyeCharts" |
| | | class="sontwoactiveName" |
| | |
| | | /> |
| | | </el-card> |
| | | </div> |
| | | </div> |
| | | <div v-show="sontwoactiveName == 'glucose'" style="display: flex"> |
| | | </div> --> |
| | | <!-- <div v-show="sontwoactiveName == 'glucose'" style="display: flex"> |
| | | <div |
| | | id="xteCharts" |
| | | class="sontwoactiveName" |
| | |
| | | /> |
| | | </el-card> |
| | | </div> |
| | | </div> |
| | | </div> --> |
| | | <div v-show="sontwoactiveName == 'weight'" style="display: flex"> |
| | | <div |
| | | id="tzeCharts" |
| | |
| | | ></div> |
| | | <div style="width: 400px"> |
| | | <el-card class="box-card"> |
| | | <el-button @click="borninfoVisible = true" type="success" round |
| | | >添加数据</el-button |
| | | > |
| | | <SFtable |
| | | :currentList="tableDatalist" |
| | | :currentList="borninfooptions" |
| | | :tableLabel="tableLabeltz" |
| | | :serialnumber="false" |
| | | :center="false" |
| | | :multiplechoice="false" |
| | | /> |
| | | </el-card> |
| | | </div> |
| | | </div> |
| | | <div v-show="sontwoactiveName == 'heartrate'" style="display: flex"> |
| | | <!-- <div v-show="sontwoactiveName == 'heartrate'" style="display: flex"> |
| | | <div |
| | | id="xleCharts" |
| | | class="sontwoactiveName" |
| | |
| | | /> |
| | | </el-card> |
| | | </div> |
| | | </div> |
| | | <div v-show="sontwoactiveName == 'bloodoxygen'" style="display: flex"> |
| | | </div> --> |
| | | <!-- <div v-show="sontwoactiveName == 'bloodoxygen'" style="display: flex"> |
| | | <div |
| | | id="xueyangeCharts" |
| | | class="sontwoactiveName" |
| | |
| | | /> |
| | | </el-card> |
| | | </div> |
| | | </div> |
| | | <div v-show="sontwoactiveName == 'animalheat'" style="display: flex"> |
| | | </div> --> |
| | | <!-- <div v-show="sontwoactiveName == 'animalheat'" style="display: flex"> |
| | | <div |
| | | id="tweCharts" |
| | | class="sontwoactiveName" |
| | |
| | | /> |
| | | </el-card> |
| | | </div> |
| | | </div> |
| | | </div> --> |
| | | </div> --> |
| | | </div> |
| | | |
| | | <el-dialog :title="titletb" :visible.sync="AddanumberVisible"> |
| | | <el-form :model="numberform" label-width="100px"> |
| | |
| | | <div slot="footer" class="dialog-footer"> |
| | | <el-button @click="AddanumberVisible = false">取 消</el-button> |
| | | <el-button type="primary" @click="archivecontact">确 定</el-button> |
| | | </div> |
| | | </el-dialog> |
| | | <el-dialog title="新生儿数据新增" :visible.sync="borninfoVisible"> |
| | | <el-form |
| | | :rules="borninforules" |
| | | ref="borninfoform" |
| | | :model="borninfoform" |
| | | label-width="120px" |
| | | > |
| | | <!-- 身高 --> |
| | | <el-form-item label="身高(cm)" prop="height"> |
| | | <el-input |
| | | v-model.number="borninfoform.height" |
| | | autocomplete="off" |
| | | placeholder="请输入身高(30-120cm)" |
| | | > |
| | | </el-input> |
| | | </el-form-item> |
| | | |
| | | <!-- 头围 --> |
| | | <el-form-item label="头围(cm)" prop="headCir"> |
| | | <el-input |
| | | v-model.number="borninfoform.headCir" |
| | | autocomplete="off" |
| | | placeholder="请输入头围(20-60cm)" |
| | | > |
| | | </el-input> |
| | | </el-form-item> |
| | | |
| | | <!-- 胎龄 --> |
| | | <el-form-item label="胎龄(周)" prop="age"> |
| | | <el-input |
| | | v-model.number="borninfoform.age" |
| | | autocomplete="off" |
| | | placeholder="请输入胎龄" |
| | | > |
| | | </el-input> |
| | | </el-form-item> |
| | | </el-form> |
| | | <div slot="footer" class="dialog-footer"> |
| | | <el-button @click="borninfoVisible = false">取 消</el-button> |
| | | <el-button type="primary" @click="newborninfoadd">确 定</el-button> |
| | | </div> |
| | | </el-dialog> |
| | | </div> |
| | |
| | | Patientclinic, |
| | | } from "@/api/patient/homepage"; |
| | | |
| | | import { getsearchrResults, getTaskservelist } from "@/api/AiCentre/index"; |
| | | import { |
| | | getsearchrResults, |
| | | getTaskservelist, |
| | | } from "@/api/AiCentre/index"; |
| | | import { listPatouthosp } from "@/api/smartor/patouthosp"; |
| | | listPatouthosp, |
| | | newborninfoadd, |
| | | newborninfolist, |
| | | } from "@/api/smartor/patouthosp"; |
| | | import { listpatient } from "@/api/patient/record"; |
| | | |
| | | export default { |
| | |
| | | tjnumber: 12, |
| | | yynumber: 12, |
| | | total: 0, // 总条数 |
| | | borninfoVisible: false, |
| | | titletb: "新增联系方式", |
| | | activeTab: "userinfo", |
| | | id: "", |
| | | loading: false, |
| | | activeName: "health", //一类导航 |
| | | sonactiveName: "inhospital", //健康监测导航 |
| | | sontwoactiveName: "blood", //医疗档案导航 |
| | | sontwoactiveName: "weight", //医疗档案导航 |
| | | dynamicTags: [], |
| | | borninforules: { |
| | | height: [ |
| | | { required: true, message: "身高不能为空", trigger: "blur" }, |
| | | { |
| | | type: "number", |
| | | message: "必须为数字值", |
| | | trigger: "blur", |
| | | }, |
| | | { |
| | | validator: (rule, value, callback) => { |
| | | // 新生儿身高一般范围:30-120cm |
| | | if (value < 30 || value > 120) { |
| | | callback(new Error("请输入30-120cm之间的合理身高值")); |
| | | } else if (!/^[0-9]+(\.[0-9]{1})?$/.test(value)) { |
| | | callback(new Error("最多保留一位小数")); |
| | | } else { |
| | | callback(); |
| | | } |
| | | }, |
| | | trigger: "blur", |
| | | }, |
| | | ], |
| | | headCir: [ |
| | | { required: true, message: "头围不能为空", trigger: "blur" }, |
| | | { type: "number", message: "必须为数字值" }, |
| | | { |
| | | validator: (rule, value, callback) => { |
| | | // 新生儿头围一般范围:20-60cm |
| | | if (value < 20 || value > 60) { |
| | | callback(new Error("请输入20-60cm之间的合理头围值")); |
| | | } else { |
| | | callback(); |
| | | } |
| | | }, |
| | | trigger: "blur", |
| | | }, |
| | | ], |
| | | age: [ |
| | | { required: true, message: "胎龄不能为空", trigger: "blur" }, |
| | | { type: "integer", message: "必须为整数周数" }, |
| | | { |
| | | validator: (rule, value, callback) => { |
| | | // 检查是否已存在该周数数据 |
| | | if (this.checkAgeExists(value)) { |
| | | callback(new Error("该周数数据已存在,请勿重复添加")); |
| | | } else { |
| | | callback(); |
| | | } |
| | | }, |
| | | trigger: "blur", |
| | | }, |
| | | ], |
| | | }, |
| | | record: [ |
| | | { |
| | | name: "宣教任务", |
| | | serviceType: "4", |
| | | templatename: "管饲宣教一期", |
| | | createTime: "2024-11-10", |
| | | finishtime: "2024-11-12", |
| | | createBy: "王政", |
| | | drname: "刘明", |
| | | nurseName: "张淑琴", |
| | | excep: "0", |
| | | deptname: "呼吸科", |
| | | leavehospitaldistrictname: "五病区", |
| | | }, |
| | | { |
| | | name: "通知任务", |
| | | name: "随访任务", |
| | | serviceType: "2", |
| | | templatename: "心血管随访一期", |
| | | createTime: "2024-11-11", |
| | | finishtime: "2024-11-14", |
| | | createBy: "章程", |
| | | drname: "刘明", |
| | | nurseName: "李丽", |
| | | excep: "0", |
| | | deptname: "呼吸科", |
| | | leavehospitaldistrictname: "五病区", |
| | | }, |
| | | { |
| | | name: "问卷调查", |
| | | }, |
| | | // { |
| | | // name: "问卷调查", |
| | | // }, |
| | | ], |
| | | borninfoform: {}, |
| | | inputVisible: false, |
| | | AddanumberVisible: false, |
| | | inputValue: "", |
| | |
| | | label: "体检", |
| | | }, |
| | | ], |
| | | borninfooptions: [], |
| | | tableLabelxy: [ |
| | | { label: "测量时间", width: "", prop: "name" }, |
| | | { label: "收缩压", width: "", prop: "sex" }, |
| | |
| | | { label: "舒张压", width: "", prop: "age" }, |
| | | ], |
| | | tableLabeltz: [ |
| | | { label: "测量时间", width: "", prop: "name" }, |
| | | { label: "身高", width: "", prop: "sex" }, |
| | | { label: "体重", width: "", prop: "age" }, |
| | | { label: "BMI指数", width: "", prop: "update_by" }, |
| | | { label: "责任医生", width: "", prop: "doctor" }, |
| | | { label: "身高", width: "", prop: "height" }, |
| | | { label: "头围", width: "", prop: "headCir" }, |
| | | ], |
| | | tableLabelxl: [ |
| | | { label: "测量时间", width: "", prop: "name" }, |
| | |
| | | this.id = this.$route.query.id; |
| | | this.getuserinfo(); |
| | | this.gettabList(); |
| | | this.$nextTick(function () { |
| | | this.echartdom = document.getElementById("xyeCharts"); |
| | | this.xtechartdom = document.getElementById("xteCharts"); |
| | | this.tzechartdom = document.getElementById("tzeCharts"); |
| | | this.xlechartdom = document.getElementById("xleCharts"); |
| | | this.xueyangechartdom = document.getElementById("xueyangeCharts"); |
| | | this.twechartdom = document.getElementById("tweCharts"); |
| | | |
| | | this.echartsInit(); |
| | | this.xtechartsInit(); |
| | | this.tzechartsInit(); |
| | | this.xlechartsInit(); |
| | | this.xueyangechartsInit(); |
| | | this.twechartsInit(); |
| | | }); |
| | | }, |
| | | |
| | | methods: { |
| | |
| | | if (response.code == 200) { |
| | | this.serviceDatacy = response.rows; |
| | | console.log(this.serviceDatacy); |
| | | this.$forceUpdate() |
| | | this.$forceUpdate(); |
| | | } |
| | | }); |
| | | } |
| | | }, |
| | | checkAgeExists(newAge) { |
| | | // 假设已有数据存储在 this.existingData 中 |
| | | return this.borninfooptions.some((item) => item.age === parseInt(newAge)); |
| | | }, |
| | | getcontactlist() { |
| | | listcontactinformation({ patid: this.id }).then((response) => { |
| | |
| | | handleClick(tab, event) { |
| | | if (tab.index == "1") { |
| | | this.getList(1); |
| | | }else if (tab.index == "2") { |
| | | this.handleClickfw(); |
| | | } else if (tab.index == "2") { |
| | | this.newbornList(); |
| | | } else if (tab.index == "3") { |
| | | this.handleClickfw(); |
| | | } |
| | | }, |
| | | handleClickson(tab, event) { |
| | |
| | | this.getList(tab.index); |
| | | }, |
| | | // 查询服务记录 |
| | | handleClickfw(){ |
| | | handleClickfw() { |
| | | getTaskservelist({ |
| | | patid: this.id, |
| | | }).then((res) => { |
| | | if (res.code == 200) { |
| | | this.record = res.rows; |
| | | this.record = res.rows[0].serviceSubtaskList; |
| | | } |
| | | }); |
| | | }, |
| | |
| | | }; |
| | | listtag(tagqueryParams).then((response) => { |
| | | this.options = response.rows; |
| | | |
| | | console.log(this.options, "标签"); |
| | | }); |
| | | }, |
| | | newcharts() { |
| | | this.$nextTick(function () { |
| | | // this.echartdom = document.getElementById("xyeCharts"); |
| | | // this.xtechartdom = document.getElementById("xteCharts"); |
| | | this.tzechartdom = document.getElementById("tzeCharts"); |
| | | // this.xlechartdom = document.getElementById("xleCharts"); |
| | | // this.xueyangechartdom = document.getElementById("xueyangeCharts"); |
| | | // this.twechartdom = document.getElementById("tweCharts"); |
| | | |
| | | // this.echartsInit(); |
| | | // this.xtechartsInit(); |
| | | this.tzechartsInit(); |
| | | // this.xlechartsInit(); |
| | | // this.xueyangechartsInit(); |
| | | // this.twechartsInit(); |
| | | }); |
| | | }, |
| | | |
| | | // 保存指标数据 |
| | | newborninfoadd() { |
| | | this.$refs["borninfoform"].validate((valid) => { |
| | | if (valid) { |
| | | this.borninfoform.patId = this.id; |
| | | |
| | | newborninfoadd(this.borninfoform).then((res) => { |
| | | if (res.code == 200) { |
| | | this.$modal.msgSuccess("新增成功"); |
| | | this.newbornList(); |
| | | this.borninfoVisible = false; |
| | | } else { |
| | | this.$modal.msgError("新增失败"); |
| | | this.newbornList(); |
| | | this.borninfoVisible = false; |
| | | } |
| | | }); |
| | | } |
| | | }); |
| | | }, |
| | | remoteMethod(value) { |
| | | console.log("触发"); |
| | | |
| | | const illnessqueryParams = { |
| | | pageNum: 1, |
| | | pageSize: 100, |
| | |
| | | // 使用刚指定的配置项和数据显示图表。 |
| | | myxyChart.setOption(option); |
| | | }, |
| | | // 体重图表 |
| | | tzechartsInit() { |
| | | // 基于准备好的dom,初始化echarts实例 |
| | | // 获取数据集合 |
| | | this.newbornList() |
| | | .then(() => { |
| | | // 检查数据有效性 |
| | | if (!this.borninfooptions || this.borninfooptions.length === 0) { |
| | | console.warn("没有可用的新生儿数据"); |
| | | return; |
| | | } |
| | | // 找出最大的age值(确定X轴范围) |
| | | const maxAge = Math.max( |
| | | ...this.borninfooptions.map((item) => parseInt(item.age) || 0) |
| | | ); |
| | | if (maxAge <= 0) { |
| | | console.error("无效的周数数据"); |
| | | return; |
| | | } |
| | | |
| | | var myxyChart = echarts.init(this.tzechartdom); |
| | | var option = { |
| | | title: { |
| | | text: "体重指标图", |
| | | }, |
| | | tooltip: { |
| | | trigger: "axis", |
| | | }, |
| | | legend: { |
| | | data: ["身高", "体重", "BMI指数"], |
| | | }, |
| | | grid: { |
| | | left: "3%", |
| | | right: "4%", |
| | | bottom: "3%", |
| | | containLabel: true, |
| | | }, |
| | | toolbox: { |
| | | feature: { |
| | | saveAsImage: {}, |
| | | }, |
| | | }, |
| | | xAxis: { |
| | | type: "category", |
| | | boundaryGap: false, |
| | | data: ["一月", "二月", "三月", "四月", "五月", "六月", "七月"], |
| | | }, |
| | | yAxis: { |
| | | type: "value", |
| | | }, |
| | | series: [ |
| | | { |
| | | name: "身高", |
| | | type: "line", |
| | | stack: "Total", |
| | | data: [120, 132, 101, 134, 90, 230, 210], |
| | | }, |
| | | { |
| | | name: "体重", |
| | | type: "line", |
| | | stack: "Total", |
| | | data: [220, 182, 191, 234, 290, 330, 310], |
| | | }, |
| | | // 动态生成xAxis数据(从1周到最大周) |
| | | const xAxisData = Array.from( |
| | | { length: maxAge }, |
| | | (_, i) => `${i + 1}周` |
| | | ); |
| | | |
| | | { |
| | | name: "BMI指数", |
| | | type: "line", |
| | | stack: "Total", |
| | | data: [320, 332, 301, 334, 390, 330, 320], |
| | | }, |
| | | ], |
| | | }; |
| | | // 使用刚指定的配置项和数据显示图表。 |
| | | myxyChart.setOption(option); |
| | | // 初始化数据数组 |
| | | const heightData = Array(maxAge).fill(null); |
| | | const headCirData = Array(maxAge).fill(null); |
| | | |
| | | // 遍历所有数据点,填充到对应位置 |
| | | this.borninfooptions.forEach((item) => { |
| | | try { |
| | | const age = parseInt(item.age); |
| | | const height = parseFloat(item.height); |
| | | const headCir = parseFloat(item.headCir); |
| | | |
| | | // 确保数据有效且周数在范围内 |
| | | if (age > 0 && age <= maxAge) { |
| | | const weekIndex = age - 1; |
| | | if (!isNaN(height)) heightData[weekIndex] = height; |
| | | if (!isNaN(headCir)) headCirData[weekIndex] = headCir; |
| | | } |
| | | } catch (e) { |
| | | console.error("数据处理错误:", e); |
| | | } |
| | | }); |
| | | |
| | | // 获取患者姓名(使用第一条有效数据) |
| | | const patientName = this.borninfooptions[0]?.name || "未知"; |
| | | |
| | | // 初始化图表 |
| | | const myxyChart = echarts.init(this.tzechartdom); |
| | | const option = { |
| | | title: { |
| | | text: `${patientName}生长发育指标图`, |
| | | left: "center", |
| | | }, |
| | | tooltip: { |
| | | trigger: "axis", |
| | | formatter: function (params) { |
| | | let result = params[0].axisValue + "<br/>"; |
| | | params.forEach((item) => { |
| | | const value = item.value !== null ? item.value : "暂无数据"; |
| | | result += `${item.marker} ${item.seriesName}: ${value}<br/>`; |
| | | }); |
| | | return result; |
| | | }, |
| | | }, |
| | | legend: { |
| | | data: ["身高(cm)", "头围(cm)"], |
| | | bottom: 10, |
| | | }, |
| | | grid: { |
| | | left: "3%", |
| | | right: "4%", |
| | | bottom: "15%", // 为图例留出空间 |
| | | containLabel: true, |
| | | }, |
| | | toolbox: { |
| | | feature: { |
| | | saveAsImage: { |
| | | title: "保存图片", |
| | | pixelRatio: 2, |
| | | }, |
| | | dataView: { |
| | | title: "数据视图", |
| | | readOnly: true, |
| | | }, |
| | | }, |
| | | right: 20, |
| | | }, |
| | | xAxis: { |
| | | type: "category", |
| | | boundaryGap: false, |
| | | data: xAxisData, |
| | | axisLabel: { |
| | | interval: 0, // 显示所有标签 |
| | | rotate: 30, // 标签旋转防止重叠 |
| | | }, |
| | | }, |
| | | yAxis: { |
| | | type: "value", |
| | | axisLabel: { |
| | | formatter: "{value} cm", |
| | | }, |
| | | }, |
| | | series: [ |
| | | { |
| | | name: "身高", |
| | | type: "line", |
| | | data: heightData, |
| | | symbol: "circle", |
| | | symbolSize: 8, |
| | | itemStyle: { |
| | | color: "#5470C6", |
| | | }, |
| | | lineStyle: { |
| | | width: 3, |
| | | }, |
| | | connectNulls: true, // 连接空值 |
| | | }, |
| | | { |
| | | name: "头围", |
| | | type: "line", |
| | | data: headCirData, |
| | | symbol: "circle", |
| | | symbolSize: 8, |
| | | itemStyle: { |
| | | color: "#91CC75", |
| | | }, |
| | | lineStyle: { |
| | | width: 3, |
| | | }, |
| | | connectNulls: true, // 连接空值 |
| | | }, |
| | | ], |
| | | animationDuration: 1000, // 动画时长 |
| | | }; |
| | | |
| | | // 使用配置项显示图表 |
| | | myxyChart.setOption(option); |
| | | |
| | | // 窗口大小变化时重新调整图表大小 |
| | | const resizeHandler = () => myxyChart.resize(); |
| | | window.addEventListener("resize", resizeHandler); |
| | | |
| | | // 在组件销毁时移除事件监听(如果是Vue/React组件) |
| | | this.$once("hook:beforeDestroy", () => { |
| | | window.removeEventListener("resize", resizeHandler); |
| | | myxyChart.dispose(); |
| | | }); |
| | | }) |
| | | .catch((error) => { |
| | | console.error("加载数据失败:", error); |
| | | }); |
| | | }, |
| | | |
| | | // 获取新生儿数据 |
| | | newbornList() { |
| | | return newborninfolist({ patId: this.id }) |
| | | .then((response) => { |
| | | this.borninfooptions = response.rows || []; |
| | | |
| | | this.newcharts(); |
| | | console.log("加载的新生儿数据:", this.borninfooptions); |
| | | return Promise.resolve(); |
| | | }) |
| | | .catch((error) => { |
| | | console.error("请求数据失败:", error); |
| | | this.borninfooptions = []; |
| | | return Promise.reject(error); |
| | | }); |
| | | }, |
| | | // 心率 |
| | | xlechartsInit() { |