<template>
|
<div class="app-container">
|
<!-- 头部盒子 -->
|
<div class="personages">
|
<el-row :gutter="20">
|
<el-col :span="18">
|
<div class="headportrait">
|
<div class="text-center">
|
<img
|
v-imgError="require('@/assets/images/shoushuzhudaoyisheng.png')"
|
src=""
|
/>
|
</div>
|
<div style="margin-left: 10px">{{ userform.name }}</div>
|
<div style="margin-left: 10px" class="text-title">
|
{{ userform.sex == 1 ? "男" : "女" }}
|
</div>
|
<div style="margin-left: 10px" class="text-title">
|
{{ userform.age }}岁
|
</div>
|
<div style="margin-left: 10px" class="text-title">
|
{{ userform.birthdate }}
|
</div>
|
<div style="margin-left: 10px" class="text-title">
|
{{ userform.nation }}
|
</div>
|
<div style="margin-left: 10px" class="text-title">
|
{{ userform.birthplace }}
|
</div>
|
</div></el-col
|
>
|
</el-row>
|
</div>
|
|
<el-tabs type="border-card" v-model="activeName" @tab-click="handleClick">
|
<el-tab-pane name="health">
|
<span class="mulsz" slot="label"
|
><i class="el-icon-date"></i> 患者档案</span
|
>
|
</el-tab-pane>
|
<el-tab-pane name="medical">
|
<span class="mulsz" slot="label"
|
><i class="el-icon-s-management"></i> 医疗档案</span
|
>
|
<el-tabs v-model="sonactiveName" @tab-click="handleClickson">
|
<el-tab-pane name="outpatient"
|
><span class="mulsz" slot="label">门诊</span></el-tab-pane
|
>
|
<el-tab-pane name="inhospital"
|
><span class="mulsz" slot="label">在院 </span></el-tab-pane
|
>
|
<el-tab-pane name="checkout"
|
><span class="mulsz" slot="label">出院 </span></el-tab-pane
|
>
|
</el-tabs>
|
</el-tab-pane>
|
<el-tab-pane name="monitor">
|
<span class="mulsz" slot="label"
|
><i class="el-icon-s-data"></i> 健康监测</span
|
>
|
|
<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
|
>
|
<el-tab-pane name="glucose"
|
><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>身高头围趋势
|
</span></el-tab-pane
|
>
|
<!-- <el-tab-pane name="heartrate"
|
><span class="mulsz" slot="label"
|
><i class="el-icon-s-operation"></i>心率
|
</span></el-tab-pane
|
>
|
<el-tab-pane name="bloodoxygen"
|
><span class="mulsz" slot="label"
|
><i class="el-icon-s-data"></i>血氧
|
</span></el-tab-pane
|
>
|
<el-tab-pane name="animalheat"
|
><span class="mulsz" slot="label"
|
><i class="el-icon-s-opportunity"></i>体温
|
</span></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
|
>
|
</el-tab-pane>
|
</el-tabs>
|
|
<!-- 健康档案模块 -->
|
<div class="information-content" v-if="activeName == 'health'">
|
<div class="top-message">
|
<div class="headlines">
|
<div>基础信息</div>
|
<el-button type="primary" @click="savefile">保存患者档案</el-button>
|
</div>
|
<div class="detailed">
|
<el-form
|
ref="userform"
|
:model="userform"
|
:rules="rules"
|
label-width="100px"
|
>
|
<el-row :gutter="20">
|
<el-col :span="12">
|
<el-form-item label="患者姓名" prop="name">
|
<el-input
|
v-model="userform.name"
|
placeholder="请输入姓名"
|
maxlength="30"
|
disabled
|
></el-input> </el-form-item
|
></el-col>
|
<el-col :span="12"
|
><el-form-item label="联系方式" prop="telcode">
|
<el-input
|
v-model="userform.telcode"
|
placeholder="请输入联系方式"
|
maxlength="30"
|
/> </el-form-item
|
></el-col>
|
</el-row>
|
<el-row :gutter="20">
|
<el-col :span="24">
|
<el-form-item label="出生地" prop="birthplace">
|
<el-input
|
v-model="userform.birthplace"
|
placeholder="国、省、地市、区县、街道等详细信息"
|
maxlength="50"
|
/> </el-form-item
|
></el-col>
|
</el-row>
|
<el-row :gutter="20">
|
<el-col :span="24"
|
><el-form-item label="居住地" prop="placeOfResidence">
|
<el-input
|
v-model="userform.placeOfResidence"
|
placeholder="国、省、地市、区县、街道等详细信息"
|
maxlength="50"
|
/> </el-form-item
|
></el-col>
|
</el-row>
|
<el-row :gutter="20">
|
<el-col :span="24">
|
<el-form-item label="标签" prop="desc">
|
<div class="xinz-inf">
|
<el-tag
|
:key="tag.tagname"
|
type="success"
|
v-for="tag in dynamicTags"
|
v-if="tag.isoperation != 3"
|
closable
|
:disable-transitions="false"
|
@close="handleClose(tag)"
|
>
|
{{ tag.tagname }}
|
</el-tag>
|
<el-select
|
v-if="inputVisible"
|
v-model="inputValue"
|
@change="handleInputConfirm"
|
filterable
|
remote
|
:remote-method="remoteMethod"
|
allow-create
|
default-first-option
|
placeholder="请选择/查询"
|
>
|
<el-option
|
v-for="item in options"
|
:key="item.tagid"
|
:label="item.tagname"
|
:value="item.tagname"
|
>
|
</el-option>
|
</el-select>
|
|
<el-button
|
v-else
|
class="button-new-tag"
|
size="small"
|
@click="showInput"
|
>+ 新增标签</el-button
|
>
|
</div>
|
</el-form-item>
|
</el-col>
|
</el-row>
|
</el-form>
|
</div>
|
</div>
|
<div class="top-message">
|
<div class="headline">病史</div>
|
<div class="detailed">
|
<el-form :model="form" label-width="100px">
|
<el-row>
|
<el-col :span="8">
|
<el-form-item label="过往疾病" prop="name">
|
<el-input
|
v-model="form.pastIllnesses"
|
placeholder="请输入"
|
maxlength="30"
|
/>
|
</el-form-item>
|
</el-col>
|
<el-col :span="8">
|
<el-form-item label="药物过敏" prop="sex">
|
<el-input
|
v-model="form.drugAllergy"
|
placeholder="请输入具体药物/无"
|
maxlength="30"
|
/>
|
</el-form-item>
|
</el-col>
|
<el-col :span="8">
|
<el-form-item label="家族病史" prop="age">
|
<el-input
|
v-model="form.familyHistory"
|
placeholder="请输入具体疾病/无"
|
maxlength="30"
|
/>
|
</el-form-item>
|
</el-col>
|
</el-row>
|
<el-row>
|
<el-col :span="8">
|
<el-form-item label="手术史" prop="name">
|
<el-input
|
v-model="form.surgicalHistory"
|
placeholder="请输入手术/无"
|
maxlength="30"
|
/>
|
</el-form-item>
|
</el-col>
|
<el-col :span="8">
|
<el-form-item label="生育史" prop="age">
|
<el-input
|
v-model="form.reproductiveHistory"
|
placeholder="请输入胎数/无"
|
maxlength="30"
|
/>
|
</el-form-item>
|
</el-col>
|
<el-col :span="8">
|
<el-form-item label="月经史" prop="menstrualHistory">
|
<el-radio-group v-model="form.menstrualHistory">
|
<el-radio label="1">有</el-radio>
|
<el-radio label="2">无</el-radio>
|
</el-radio-group>
|
</el-form-item>
|
</el-col>
|
</el-row>
|
<el-row>
|
<el-col :span="8">
|
<el-form-item label="吸烟情况" prop="smoking">
|
<el-radio-group v-model="form.smoking">
|
<el-radio label="1">有</el-radio>
|
<el-radio label="2">无</el-radio>
|
</el-radio-group>
|
</el-form-item>
|
</el-col>
|
<el-col :span="8">
|
<el-form-item label="饮酒情况" prop="drink">
|
<el-radio-group v-model="form.drink">
|
<el-radio label="1">有</el-radio>
|
<el-radio label="2">无</el-radio>
|
</el-radio-group>
|
</el-form-item>
|
</el-col>
|
<el-col :span="8">
|
<el-form-item label="运动情况" prop="motion">
|
<el-radio-group v-model="form.motion">
|
<el-radio label="1">有</el-radio>
|
<el-radio label="2">无</el-radio>
|
</el-radio-group>
|
</el-form-item>
|
</el-col>
|
</el-row>
|
<el-row>
|
<el-col :span="12">
|
<el-form-item label="饮食情况" prop="diet">
|
<el-radio-group v-model="form.diet">
|
<el-radio label="1">过度饮食</el-radio>
|
<el-radio label="2">正常饮食</el-radio>
|
<el-radio label="3">食欲不振</el-radio>
|
</el-radio-group>
|
</el-form-item> </el-col
|
><el-col :span="12">
|
<el-form-item label="心理情况" prop="psychology">
|
<el-radio-group v-model="form.psychology">
|
<el-radio label="1">心情愉悦</el-radio>
|
<el-radio label="2">轻微焦虑</el-radio>
|
<el-radio label="3">抑郁</el-radio>
|
</el-radio-group>
|
</el-form-item>
|
</el-col>
|
</el-row>
|
</el-form>
|
</div>
|
</div>
|
<!-- 联系电话 -->
|
<div class="bottom-message">
|
<div class="headline">
|
亲属号码维护<span style="margin-right: 60px"> </span>
|
<el-button type="primary" @click="addcompiletb">+新增</el-button>
|
</div>
|
<div class="Table-screen">
|
<el-table
|
:data="tableData"
|
style="width: 100%"
|
:row-class-name="tableRowClassName"
|
>
|
<el-table-column prop="id" label="序号" width="180">
|
</el-table-column>
|
<el-table-column prop="contactname" label="姓名" width="180">
|
</el-table-column>
|
<el-table-column prop="contactway" label="联系方式" width="180">
|
</el-table-column>
|
<el-table-column prop="relation" label="关系"> </el-table-column>
|
<el-table-column
|
label-class-name="columcz"
|
fixed="right"
|
label="操作"
|
width="300"
|
>
|
<template slot-scope="scope">
|
<el-button
|
type="success"
|
size="small"
|
@click="defaulttb(scope.row)"
|
>设为默认联系方式</el-button
|
>
|
<el-button
|
@click="compiletb(scope.row)"
|
type="warning"
|
size="small"
|
>编辑</el-button
|
>
|
|
<el-button @click="deltb(scope.row)" type="danger" size="small"
|
>删除</el-button
|
>
|
</template>
|
</el-table-column>
|
</el-table>
|
</div>
|
</div>
|
</div>
|
<!-- 医疗档案 -->
|
<div class="medical-record" v-else-if="activeName == 'medical'">
|
<!-- 门诊 -->
|
<div v-if="sonactiveName == 'outpatient'">
|
<el-table :data="serviceData" style="width: 100%">
|
<el-table-column
|
label="就诊时间"
|
align="center"
|
key="createTime"
|
prop="createTime"
|
width="160"
|
>
|
<template slot-scope="scope">
|
<span>{{ formatTime(scope.row.createTime) }}</span>
|
</template>
|
</el-table-column>
|
|
<el-table-column
|
label="门诊号"
|
align="center"
|
key="patid"
|
prop="patid"
|
/>
|
<el-table-column
|
label="姓名"
|
align="center"
|
key="patname"
|
prop="patname"
|
/>
|
|
<el-table-column
|
label="联系电话"
|
align="center"
|
key="telcode"
|
prop="telcode"
|
width="120"
|
/>
|
<el-table-column
|
label="入院诊断"
|
align="center"
|
key="diagname"
|
prop="diagname"
|
width="190"
|
/>
|
<el-table-column
|
label="出院诊断"
|
align="center"
|
key="leavediagname"
|
prop="leavediagname"
|
width="190"
|
/>
|
|
<el-table-column
|
label="就诊科室"
|
align="center"
|
key="deptname"
|
prop="deptname"
|
width="120"
|
/>
|
<el-table-column
|
label="所在病区"
|
align="center"
|
key="leavehospitaldistrictname"
|
prop="leavehospitaldistrictname"
|
width="120"
|
/>
|
<!-- <el-table-column
|
label="主治医生"
|
align="center"
|
key="drname"
|
prop="drname"
|
width="120"
|
/>
|
|
<el-table-column
|
label="责任护士"
|
align="center"
|
key="nurseName"
|
prop="nurseName"
|
width="120"
|
/> -->
|
</el-table>
|
<pagination
|
v-show="total > 0"
|
:total="total"
|
:page.sync="queryParams.pageNum"
|
:limit.sync="queryParams.pageSize"
|
@pagination="getList"
|
/>
|
</div>
|
<!-- 住院 -->
|
<div v-if="sonactiveName == 'inhospital'">
|
<el-table :data="serviceDatary" style="width: 100%">
|
<el-table-column
|
label="住院号"
|
align="center"
|
key="patno"
|
prop="patno"
|
width="180"
|
/>
|
<el-table-column
|
label="姓名"
|
align="center"
|
key="patname"
|
prop="patname"
|
/>
|
<el-table-column
|
label="联系电话"
|
align="center"
|
key="telcode"
|
prop="telcode"
|
width="120"
|
/>
|
<el-table-column
|
label="入院诊断"
|
align="center"
|
key="diagname"
|
prop="diagname"
|
width="190"
|
/>
|
<el-table-column
|
label="出院诊断"
|
align="center"
|
key="leavediagname"
|
prop="leavediagname"
|
width="190"
|
/>
|
|
<el-table-column
|
label="就诊科室"
|
align="center"
|
key="deptname"
|
prop="deptname"
|
width="120"
|
/>
|
<el-table-column
|
label="所在病区"
|
align="center"
|
key="leavehospitaldistrictname"
|
prop="leavehospitaldistrictname"
|
width="120"
|
/>
|
<el-table-column
|
label="主治医生"
|
align="center"
|
key="drname"
|
prop="drname"
|
width="120"
|
/>
|
|
<el-table-column
|
label="责任护士"
|
align="center"
|
key="nurseName"
|
prop="nurseName"
|
width="120"
|
/>
|
<el-table-column
|
label="床位号"
|
align="center"
|
key="bedNo"
|
prop="bedNo"
|
width="120"
|
/>
|
</el-table>
|
</div>
|
<!-- 出院 -->
|
<div v-if="sonactiveName == 'checkout'">
|
<el-table :data="serviceDatacy" style="width: 100%">
|
<el-table-column
|
label="住院号"
|
align="center"
|
key="patno"
|
prop="patno"
|
width="120"
|
/>
|
<el-table-column
|
label="姓名"
|
align="center"
|
key="patname"
|
prop="patname"
|
/>
|
<el-table-column
|
label="联系电话"
|
align="center"
|
key="telcode"
|
prop="telcode"
|
width="120"
|
/>
|
<el-table-column
|
label="入院诊断"
|
align="center"
|
key="diagname"
|
prop="diagname"
|
width="190"
|
/>
|
<el-table-column
|
label="出院诊断"
|
align="center"
|
key="leavediagname"
|
prop="leavediagname"
|
width="190"
|
/>
|
|
<el-table-column
|
label="就诊科室"
|
align="center"
|
key="deptname"
|
prop="deptname"
|
width="120"
|
/>
|
<el-table-column
|
label="所在病区"
|
align="center"
|
key="leavehospitaldistrictname"
|
prop="leavehospitaldistrictname"
|
width="120"
|
/>
|
<el-table-column
|
label="主治医生"
|
align="center"
|
key="drname"
|
prop="drname"
|
width="120"
|
/>
|
|
<el-table-column
|
label="责任护士"
|
align="center"
|
key="nurseName"
|
prop="nurseName"
|
width="120"
|
/>
|
|
<el-table-column
|
label="床位号"
|
align="center"
|
key="bedNo"
|
prop="bedNo"
|
width="120"
|
/>
|
</el-table>
|
</div>
|
</div>
|
|
<!-- 服务记录 -->
|
<div
|
class="medical-recordc"
|
style="margin-top: 20px; font-size: 20px !important"
|
v-else-if="activeName == 'serve'"
|
>
|
<div style="margin-bottom: 15px" v-for="item in record">
|
<el-card class="box-card">
|
<div
|
style="
|
font-size: 22px;
|
padding-left: 5px;
|
margin: 15px 0;
|
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>
|
</div>
|
<el-divider></el-divider>
|
<div style="margin-top: 10px">
|
服务名称：<span style="color: #2775b6">{{
|
item.templatename
|
}}</span>
|
</div>
|
<div style="margin-top: 10px">
|
创建时间：<span style="color: #2775b6">{{ item.createTime }}</span>
|
</div>
|
<div style="margin-top: 10px">
|
完成时间：<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.deptname }}</span></el-col
|
>
|
<el-col :span="12"
|
>病区：
|
<span style="color: #2775b6">{{
|
item.leavehospitaldistrictname
|
}}</span></el-col
|
>
|
</el-row>
|
</div>
|
|
<div
|
style="
|
font-size: 20px;
|
padding-left: 5px;
|
margin: 15px 0;
|
border-left: 4px solid rgb(65, 161, 190);
|
"
|
>
|
人工记录
|
</div>
|
<div style="margin-top: 10px">
|
<el-row :gutter="20">
|
<el-col :span="6"
|
>负责人：
|
<span style="color: #2775b6">{{ item.createBy }}</span></el-col
|
>
|
<el-col :span="6"
|
>主治医生：
|
<span style="color: #2775b6">{{ item.drname }}</span></el-col
|
>
|
<el-col :span="6"
|
>责任护士
|
<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>
|
</div>
|
<!-- <div style="margin-top: 10px">
|
备注：
|
<span style="color: #2775b6">提醒注意饮食健康</span>
|
</div> -->
|
</el-card>
|
</div>
|
</div>
|
<!-- 健康监测 -->
|
<div class="medical-record" v-show="activeName == 'monitor'">
|
<!-- <div v-show="sontwoactiveName == 'blood'" style="display: flex">
|
<div
|
id="xyeCharts"
|
class="sontwoactiveName"
|
style="width: 880px; height: 560px"
|
></div>
|
<div style="width: 400px">
|
<el-card class="box-card">
|
<SFtable
|
:currentList="tableDatalist"
|
:tableLabel="tableLabelxy"
|
:center="false"
|
:multiplechoice="false"
|
/>
|
</el-card>
|
</div>
|
</div> -->
|
<!-- <div v-show="sontwoactiveName == 'glucose'" style="display: flex">
|
<div
|
id="xteCharts"
|
class="sontwoactiveName"
|
style="width: 880px; height: 560px"
|
></div>
|
<div style="width: 400px">
|
<el-card class="box-card">
|
<SFtable
|
:currentList="tableDatalist"
|
:tableLabel="tableLabelxt"
|
:center="false"
|
:multiplechoice="false"
|
/>
|
</el-card>
|
</div>
|
</div> -->
|
<div v-show="sontwoactiveName == 'weight'" style="display: flex">
|
<div
|
id="tzeCharts"
|
class="sontwoactiveName"
|
style="width: 880px; height: 560px"
|
></div>
|
<div style="width: 400px">
|
<el-card class="box-card">
|
<el-button @click="borninfoVisible = true" type="success" round
|
>添加数据</el-button
|
>
|
<SFtable
|
:currentList="borninfooptions"
|
:tableLabel="tableLabeltz"
|
:serialnumber="false"
|
:center="false"
|
:multiplechoice="false"
|
/>
|
</el-card>
|
</div>
|
</div>
|
<!-- <div v-show="sontwoactiveName == 'heartrate'" style="display: flex">
|
<div
|
id="xleCharts"
|
class="sontwoactiveName"
|
style="width: 880px; height: 560px"
|
></div>
|
<div style="width: 400px">
|
<el-card class="box-card">
|
<SFtable
|
:currentList="tableDatalist"
|
:tableLabel="tableLabelxl"
|
:center="false"
|
:multiplechoice="false"
|
/>
|
</el-card>
|
</div>
|
</div> -->
|
<!-- <div v-show="sontwoactiveName == 'bloodoxygen'" style="display: flex">
|
<div
|
id="xueyangeCharts"
|
class="sontwoactiveName"
|
style="width: 880px; height: 560px"
|
></div>
|
<div style="width: 400px">
|
<el-card class="box-card">
|
<SFtable
|
:currentList="tableDatalist"
|
:tableLabel="tableLabelxueyang"
|
:center="false"
|
:multiplechoice="false"
|
/>
|
</el-card>
|
</div>
|
</div> -->
|
<!-- <div v-show="sontwoactiveName == 'animalheat'" style="display: flex">
|
<div
|
id="tweCharts"
|
class="sontwoactiveName"
|
style="width: 880px; height: 560px"
|
></div>
|
<div style="width: 400px">
|
<el-card class="box-card">
|
<SFtable
|
:currentList="tableDatalist"
|
:tableLabel="tableLabeltw"
|
:center="false"
|
:multiplechoice="false"
|
/>
|
</el-card>
|
</div>
|
</div> -->
|
</div>
|
|
<el-dialog :title="titletb" :visible.sync="AddanumberVisible">
|
<el-form :model="numberform" label-width="100px">
|
<el-form-item label="姓名">
|
<el-input v-model="numberform.contactname"></el-input>
|
</el-form-item>
|
<el-form-item label="联系电话">
|
<el-input v-model="numberform.telcode"></el-input>
|
</el-form-item>
|
<el-form-item label="关系">
|
<el-input v-model="numberform.relation"></el-input>
|
</el-form-item>
|
</el-form>
|
<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>
|
</template>
|
|
<script>
|
import userAvatar from "./userAvatar";
|
import userInfo from "./userInfo";
|
import resetPwd from "./resetPwd";
|
import * as echarts from "echarts";
|
import SFtable from "@/components/SFtable"; //表格组件
|
import { listtag } from "@/api/system/label";
|
import {
|
messagelistpatient,
|
addmedicalhistory,
|
getmedicalhistory,
|
editmedicalhistory,
|
addcontactinformation,
|
editcontactinformation,
|
getcontactinformation,
|
delcontactinformation,
|
listcontactinformation,
|
alterpatient,
|
Patientclinic,
|
} from "@/api/patient/homepage";
|
|
import { getsearchrResults, getTaskservelist } from "@/api/AiCentre/index";
|
import {
|
listPatouthosp,
|
newborninfoadd,
|
newborninfolist,
|
} from "@/api/smartor/patouthosp";
|
import { listpatient } from "@/api/patient/record";
|
|
export default {
|
name: "Profile",
|
components: { userAvatar, userInfo, resetPwd, SFtable },
|
data() {
|
return {
|
userform: {},
|
roleGroup: {},
|
postGroup: {},
|
form: {},
|
mznumber: 14,
|
zynumber: 34,
|
jynumber: 32,
|
jcnumber: 12,
|
tjnumber: 12,
|
yynumber: 12,
|
total: 0, // 总条数
|
borninfoVisible: false,
|
titletb: "新增联系方式",
|
activeTab: "userinfo",
|
id: "",
|
loading: false,
|
activeName: "health", //一类导航
|
sonactiveName: "inhospital", //健康监测导航
|
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: "随访任务",
|
serviceType: "2",
|
templatename: "心血管随访一期",
|
createTime: "2024-11-11",
|
finishtime: "2024-11-14",
|
createBy: "章程",
|
drname: "刘明",
|
nurseName: "李丽",
|
excep: "0",
|
deptname: "呼吸科",
|
leavehospitaldistrictname: "五病区",
|
},
|
// {
|
// name: "问卷调查",
|
// },
|
],
|
borninfoform: {},
|
inputVisible: false,
|
AddanumberVisible: false,
|
inputValue: "",
|
// 查询参数
|
queryParams: {
|
pageNum: 1,
|
pageSize: 10,
|
jobName: undefined,
|
jobGroup: undefined,
|
status: undefined,
|
},
|
numberform: {},
|
echartdom: {},
|
xtechartdom: {},
|
tzechartdom: {},
|
tableData: [],
|
tableDatalist: [
|
{
|
id: 12,
|
date: "2016-05-02",
|
name: "121",
|
address: "89",
|
},
|
{
|
id: 12,
|
date: "2016-05-02",
|
name: "121",
|
address: "89",
|
},
|
{
|
id: 12,
|
date: "2016-05-02",
|
name: "121",
|
address: "89",
|
},
|
],
|
serviceData: [],
|
serviceDatary: [],
|
serviceDatacy: [],
|
options: [
|
{
|
value: "1",
|
label: "会员",
|
},
|
{
|
value: "2",
|
label: "糖尿病",
|
},
|
{
|
value: "3",
|
label: "高血压",
|
},
|
{
|
value: "4",
|
label: "体检",
|
},
|
],
|
borninfooptions: [],
|
tableLabelxy: [
|
{ label: "测量时间", width: "", prop: "name" },
|
{ label: "收缩压", width: "", prop: "sex" },
|
{ label: "舒张压", width: "", prop: "age" },
|
],
|
tableLabelxt: [
|
{ label: "测量时间", width: "", prop: "name" },
|
{ label: "收缩压", width: "", prop: "sex" },
|
{ label: "舒张压", width: "", prop: "age" },
|
],
|
tableLabeltz: [
|
{ label: "责任医生", width: "", prop: "doctor" },
|
{ label: "身高", width: "", prop: "height" },
|
{ label: "头围", width: "", prop: "headCir" },
|
],
|
tableLabelxl: [
|
{ label: "测量时间", width: "", prop: "name" },
|
{ label: "心率", width: "", prop: "sex" },
|
],
|
tableLabelxueyang: [
|
{ label: "测量时间", width: "", prop: "name" },
|
{ label: "血氧饱和度", width: "", prop: "sex" },
|
],
|
tableLabeltw: [
|
{ label: "测量时间", width: "", prop: "name" },
|
{ label: "体温", width: "", prop: "sex" },
|
],
|
// 表单校验
|
rules: {
|
name: [
|
{ required: true, message: "用户名称不能为空", trigger: "blur" },
|
{
|
min: 2,
|
max: 20,
|
message: "用户名称长度必须介于 2 和 20 之间",
|
trigger: "blur",
|
},
|
],
|
|
sex: [{ required: true, message: "性别不能为空", trigger: "blur" }],
|
age: [{ required: true, message: "年龄不能为空", trigger: "blur" }],
|
nation: [{ required: true, message: "民族不能为空", trigger: "blur" }],
|
telcode: [
|
{ required: true, message: "联系方式不能为空", trigger: "blur" },
|
{
|
pattern: /^1[3|4|5|6|7|8|9][0-9]\d{8}$/,
|
message: "请输入正确的手机号码",
|
trigger: "blur",
|
},
|
],
|
idcardtype: [
|
{ required: true, message: "证件类型不能为空", trigger: "blur" },
|
],
|
idcardno: [
|
{ required: true, message: "证件号能为空", trigger: "blur" },
|
],
|
placeOfResidence: [
|
{ required: true, message: "居住地不能为空", trigger: "blur" },
|
],
|
},
|
};
|
},
|
created() {
|
this.id = this.$route.query.id;
|
this.getuserinfo();
|
this.gettabList();
|
},
|
|
methods: {
|
// 查询医疗档案各列表信息
|
getList(type) {
|
this.loading = true;
|
if (type == 0) {
|
// 门诊记录
|
listPatouthosp({ patid: this.id }).then((response) => {
|
if (response.code == 200) {
|
// this.serviceData = response.rows;
|
this.serviceData = [];
|
}
|
});
|
} else if (type == 1) {
|
listpatient({ patid: this.id, cry: 0 }).then((response) => {
|
if (response.code == 200) {
|
this.serviceDatary = response.rows;
|
}
|
});
|
} else if (type == 2) {
|
listpatient({ patid: this.id, cry: 1 }).then((response) => {
|
if (response.code == 200) {
|
this.serviceDatacy = response.rows;
|
console.log(this.serviceDatacy);
|
this.$forceUpdate();
|
}
|
});
|
}
|
},
|
checkAgeExists(newAge) {
|
// 假设已有数据存储在 this.existingData 中
|
return this.borninfooptions.some((item) => item.age === parseInt(newAge));
|
},
|
getcontactlist() {
|
listcontactinformation({ patid: this.id }).then((response) => {
|
this.tableData = response.rows;
|
});
|
},
|
processElement(element) {
|
return { ...element, isoperation: null };
|
},
|
// 获取基础信息
|
getuserinfo() {
|
const queryParams = {
|
pid: Number(this.id),
|
allhosp: "0",
|
pageNum: 1,
|
};
|
// 患者基础信息
|
messagelistpatient(queryParams).then((response) => {
|
this.userform = response.rows[0];
|
// this.dynamicTags = response.rows[0].tagList;
|
this.dynamicTags = response.rows[0].tagList.map(this.processElement);
|
console.log(this.dynamicTags);
|
});
|
// 病史信息
|
getmedicalhistory({ pid: this.id }).then((res) => {
|
if (res.code == 200 && res.rows[0]) {
|
this.form = res.rows[0];
|
}
|
});
|
// 联系信息
|
this.getcontactlist();
|
},
|
// 保存患者档案
|
savefile() {
|
this.$refs["userform"].validate((valid) => {
|
if (valid) {
|
this.userform.isoperation = 2;
|
this.userform.tagList = this.dynamicTags;
|
alterpatient(this.userform).then((res) => {
|
if (res.code == 200) {
|
this.$modal.msgSuccess("基础信息保存成功");
|
} else {
|
this.$modal.msgError("基础信息修改失败");
|
}
|
});
|
// 病史
|
this.medicalhistory();
|
}
|
});
|
},
|
// 病史
|
medicalhistory() {
|
if (this.form.id) {
|
editmedicalhistory(this.form).then((res) => {
|
if (res.code == 200) {
|
this.$modal.msgSuccess("病史保存成功");
|
} else {
|
this.$modal.msgError("病史修改失败");
|
}
|
});
|
} else {
|
this.form.pid = this.id;
|
addmedicalhistory(this.form).then((res) => {
|
if (res.code == 200) {
|
this.$modal.msgSuccess("病史保存成功");
|
} else {
|
this.$modal.msgError("病史修改失败");
|
}
|
});
|
}
|
},
|
// 联系方式---------------
|
archivecontact() {
|
if (this.numberform.id) {
|
editcontactinformation(this.numberform).then((res) => {
|
if (res.code == 200) {
|
this.$modal.msgSuccess("联系方式修改成功");
|
this.getcontactlist();
|
this.AddanumberVisible = false;
|
} else {
|
this.$modal.msgError("联系方式修改失败");
|
}
|
});
|
} else {
|
this.numberform.patid = this.id;
|
addcontactinformation(this.numberform).then((res) => {
|
if (res.code == 200) {
|
this.$modal.msgSuccess("联系方式新增成功");
|
this.getcontactlist();
|
this.AddanumberVisible = false;
|
} else {
|
this.$modal.msgError("联系方式新增失败");
|
}
|
});
|
}
|
this.numberform = {};
|
},
|
deltb(row) {
|
this.$modal
|
.confirm("是否确认删除该数据项？")
|
.then(() => {
|
if (row.id) {
|
delcontactinformation(row.id).then((res) => {
|
if (res.code == 200) {
|
this.$modal.msgSuccess("联系方式删除成功");
|
this.getcontactlist();
|
} else {
|
this.$modal.msgError("联系方式删除失败");
|
}
|
});
|
} else {
|
let index = this.tableData.indexOf(obj);
|
this.tableData.splice(index, 1);
|
}
|
this.$modal.msgSuccess("删除成功");
|
})
|
.catch(() => {});
|
},
|
addcompiletb() {
|
this.titletb = "新增联系方式";
|
this.AddanumberVisible = true;
|
},
|
compiletb(row) {
|
this.numberform = row;
|
this.titletb = "修改联系方式";
|
this.AddanumberVisible = true;
|
},
|
defaulttb(row) {
|
this.$modal
|
.confirm("是否确认设置该数据项为默认联系人？")
|
.then(() => {
|
this.tableData.forEach((obj, index) => {
|
if (obj === row) {
|
obj.isdefault = 1;
|
this.numberform = obj;
|
this.archivecontact();
|
} else if (obj.isdefault == 1) {
|
obj.isdefault = 0;
|
this.numberform = obj;
|
this.archivecontact();
|
} else {
|
obj.isdefault = 0;
|
}
|
});
|
this.$modal.msgSuccess("设置成功");
|
})
|
.catch(() => {});
|
},
|
tableRowClassName({ row, rowIndex }) {
|
if (row.isdefault == "1") {
|
return "warning-row";
|
}
|
return "";
|
},
|
// tab切换
|
handleClick(tab, event) {
|
if (tab.index == "1") {
|
this.getList(1);
|
} else if (tab.index == "2") {
|
this.newbornList();
|
} else if (tab.index == "3") {
|
this.handleClickfw();
|
}
|
},
|
handleClickson(tab, event) {
|
console.log(tab, "son");
|
this.getList(tab.index);
|
},
|
// 查询服务记录
|
handleClickfw() {
|
getTaskservelist({
|
patid: this.id,
|
}).then((res) => {
|
if (res.code == 200) {
|
this.record = res.rows[0].serviceSubtaskList;
|
}
|
});
|
},
|
// 联系方式新增
|
Addanumber() {},
|
// 标签--------------------------
|
/** 查询标签列表 */
|
gettabList() {
|
const tagqueryParams = {
|
pageNum: 1,
|
pageSize: 10000,
|
tagcategoryid: "0",
|
};
|
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,
|
tagname: value,
|
tagcategoryid: "0",
|
};
|
this.loading = true;
|
setTimeout(() => {
|
this.loading = false;
|
listtag(illnessqueryParams).then((response) => {
|
this.options = response.rows;
|
});
|
}, 200);
|
},
|
handleClose(tag) {
|
const lindex = this.dynamicTags.indexOf(tag);
|
// this.dynamicTags.splice(this.dynamicTags.indexOf(tag), 1);
|
this.dynamicTags[lindex].isoperation = 3;
|
},
|
|
showInput() {
|
this.inputVisible = true;
|
console.log("展示");
|
},
|
|
handleInputConfirm() {
|
let tagvalue = {};
|
let tagname = this.inputValue;
|
if (tagname) {
|
listtag({
|
pageNum: 1,
|
pageSize: 1000,
|
tagcategoryid: "0",
|
tagname: tagname,
|
}).then((res) => {
|
if (res.rows[0]) {
|
tagvalue = res.rows[0];
|
tagvalue.isoperation = 1;
|
} else {
|
tagvalue = {
|
tagname: tagname,
|
isoperation: 1,
|
};
|
}
|
console.log(tagvalue);
|
// this.userform.tagList.push(tagvalue);
|
this.dynamicTags.push(tagvalue);
|
console.log(this.userform.tagList);
|
console.log(this.dynamicTags);
|
});
|
}
|
console.log("关了");
|
this.inputVisible = false;
|
this.inputValue = "";
|
},
|
|
// 血压图表部分
|
echartsInit() {
|
// 基于准备好的dom，初始化echarts实例
|
var myxyChart = echarts.init(this.echartdom);
|
var option = {
|
title: {
|
text: "历史血压记录",
|
},
|
tooltip: {
|
trigger: "axis",
|
},
|
legend: {},
|
toolbox: {
|
show: true,
|
feature: {
|
dataZoom: {
|
yAxisIndex: "none",
|
},
|
dataView: { readOnly: false },
|
magicType: { type: ["line", "bar"] },
|
restore: {},
|
saveAsImage: {},
|
},
|
},
|
xAxis: {
|
type: "category",
|
boundaryGap: false,
|
data: ["一月", "二月", "三月", "四月", "五月", "六月", "七月"],
|
},
|
yAxis: {
|
type: "value",
|
axisLabel: {
|
formatter: "{value}",
|
},
|
},
|
series: [
|
{
|
name: "收缩压",
|
type: "line",
|
data: [100, 120, 130, 121, 132, 142, 119],
|
itemStyle: {
|
normal: {
|
color: "#ff7979",
|
},
|
},
|
markPoint: {
|
data: [{ type: "max", name: "舒张压高值" }],
|
},
|
markLine: {
|
data: [{ yAxis: 140, name: "正常舒张压高值" }],
|
},
|
},
|
{
|
name: "舒张压",
|
type: "line",
|
data: [71, 79, 82, 85, 93, 82, 90],
|
itemStyle: {
|
normal: {
|
color: "#409eff",
|
},
|
},
|
markPoint: {
|
data: [{ name: "周最低", type: "min" }],
|
},
|
markLine: {
|
data: [{ yAxis: 80, name: "正常舒张压高值" }],
|
},
|
},
|
],
|
};
|
// 使用刚指定的配置项和数据显示图表。
|
myxyChart.setOption(option);
|
},
|
// 血糖图表
|
xtechartsInit() {
|
// 基于准备好的dom，初始化echarts实例
|
|
var myxyChart = echarts.init(this.xtechartdom);
|
const data = [
|
["2000-06-05", 116],
|
["2000-06-06", 129],
|
["2000-06-07", 135],
|
["2000-06-08", 86],
|
["2000-06-09", 73],
|
["2000-06-10", 85],
|
["2000-06-11", 73],
|
["2000-06-12", 68],
|
["2000-06-13", 92],
|
["2000-06-14", 130],
|
["2000-06-15", 245],
|
["2000-06-16", 139],
|
["2000-06-17", 115],
|
["2000-06-18", 111],
|
["2000-06-19", 309],
|
["2000-06-20", 206],
|
["2000-06-21", 137],
|
["2000-06-22", 128],
|
["2000-06-23", 85],
|
];
|
const dateList = data.map(function (item) {
|
return item[0];
|
});
|
const valueList = data.map(function (item) {
|
return item[1];
|
});
|
var option = {
|
title: {
|
text: "历史血糖记录",
|
},
|
// 侧边小功能
|
toolbox: {
|
show: true,
|
feature: {
|
dataZoom: {
|
yAxisIndex: "none",
|
},
|
dataView: { readOnly: false },
|
magicType: { type: ["line", "bar"] },
|
restore: {},
|
saveAsImage: {},
|
},
|
},
|
visualMap: [
|
{
|
show: false,
|
type: "continuous",
|
seriesIndex: 0,
|
min: 0,
|
max: 400,
|
},
|
],
|
title: [
|
{
|
left: "center",
|
text: "血糖历史监测",
|
},
|
],
|
tooltip: {
|
trigger: "axis",
|
},
|
xAxis: [
|
{
|
data: dateList,
|
},
|
],
|
yAxis: [{}],
|
series: [
|
{
|
type: "line",
|
showSymbol: false,
|
data: valueList,
|
lineStyle: {
|
width: 3,
|
type: "solid",
|
color: new echarts.graphic.LinearGradient(0, 0, 0, 1, [
|
{
|
offset: 0,
|
color: "#FE7D2F",
|
},
|
{
|
offset: 1,
|
color: "#F9D423",
|
},
|
]),
|
},
|
},
|
],
|
};
|
// 使用刚指定的配置项和数据显示图表。
|
myxyChart.setOption(option);
|
},
|
tzechartsInit() {
|
// 获取数据集合
|
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;
|
}
|
|
// 动态生成xAxis数据（从1周到最大周）
|
const xAxisData = Array.from(
|
{ length: maxAge },
|
(_, i) => `${i + 1}周`
|
);
|
|
// 初始化数据数组
|
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() {
|
var myxyChart = echarts.init(this.xlechartdom);
|
const data = [
|
["2000-06-05", 116],
|
["2000-06-06", 129],
|
["2000-06-07", 135],
|
["2000-06-08", 86],
|
["2000-06-09", 73],
|
["2000-06-10", 85],
|
["2000-06-11", 73],
|
["2000-06-12", 68],
|
["2000-06-13", 92],
|
["2000-06-14", 130],
|
["2000-06-15", 245],
|
["2000-06-16", 139],
|
["2000-06-17", 115],
|
["2000-06-18", 111],
|
["2000-06-19", 309],
|
["2000-06-20", 206],
|
["2000-06-21", 137],
|
["2000-06-22", 128],
|
["2000-06-23", 85],
|
];
|
const dateList = data.map(function (item) {
|
return item[0];
|
});
|
const valueList = data.map(function (item) {
|
return item[1];
|
});
|
var option = {
|
title: {
|
text: "历史心率记录",
|
},
|
visualMap: [
|
{
|
show: false,
|
type: "continuous",
|
seriesIndex: 0,
|
min: 0,
|
max: 400,
|
},
|
],
|
|
tooltip: {
|
trigger: "axis",
|
},
|
xAxis: [
|
{
|
data: dateList,
|
},
|
],
|
yAxis: [{}],
|
series: [
|
{
|
type: "line",
|
showSymbol: false,
|
data: valueList,
|
lineStyle: {
|
width: 3,
|
type: "solid",
|
color: new echarts.graphic.LinearGradient(0, 0, 0, 1, [
|
{
|
offset: 0,
|
color: "#22a2c3",
|
},
|
{
|
offset: 1,
|
color: "#b0d5df",
|
},
|
]),
|
},
|
},
|
],
|
};
|
// 使用刚指定的配置项和数据显示图表。
|
myxyChart.setOption(option);
|
},
|
// 血氧
|
xueyangechartsInit() {
|
var myxyChart = echarts.init(this.xueyangechartdom);
|
const data = [
|
["2000-06-05", 116],
|
["2000-06-06", 129],
|
["2000-06-07", 135],
|
["2000-06-08", 86],
|
["2000-06-09", 73],
|
["2000-06-10", 85],
|
["2000-06-11", 73],
|
["2000-06-12", 68],
|
["2000-06-13", 92],
|
["2000-06-14", 130],
|
["2000-06-15", 245],
|
["2000-06-16", 139],
|
["2000-06-17", 115],
|
["2000-06-18", 111],
|
["2000-06-19", 309],
|
["2000-06-20", 206],
|
["2000-06-21", 137],
|
["2000-06-22", 128],
|
["2000-06-23", 85],
|
];
|
const dateList = data.map(function (item) {
|
return item[0];
|
});
|
const valueList = data.map(function (item) {
|
return item[1];
|
});
|
var option = {
|
title: {
|
text: "历史血氧记录",
|
},
|
visualMap: [
|
{
|
show: false,
|
type: "continuous",
|
seriesIndex: 0,
|
min: 0,
|
max: 400,
|
},
|
],
|
|
tooltip: {
|
trigger: "axis",
|
},
|
xAxis: [
|
{
|
data: dateList,
|
},
|
],
|
yAxis: [{}],
|
series: [
|
{
|
type: "line",
|
showSymbol: false,
|
data: valueList,
|
lineStyle: {
|
width: 3,
|
type: "solid",
|
color: new echarts.graphic.LinearGradient(0, 0, 0, 1, [
|
{
|
offset: 0,
|
color: "#45b787",
|
},
|
{
|
offset: 1,
|
color: "#c4d7d6",
|
},
|
]),
|
},
|
},
|
],
|
};
|
// 使用刚指定的配置项和数据显示图表。
|
myxyChart.setOption(option);
|
},
|
// 体温
|
twechartsInit() {
|
var myxyChart = echarts.init(this.twechartdom);
|
console.log(myxyChart);
|
const data = [
|
["2000-06-05", 36.8],
|
["2000-06-06", 36.2],
|
["2000-06-07", 37.8],
|
["2000-06-08", 37.8],
|
["2000-06-09", 37.2],
|
["2000-06-10", 36.2],
|
["2000-06-11", 37.8],
|
["2000-06-12", 36.9],
|
["2000-06-13", 36.8],
|
["2000-06-14", 36.4],
|
["2000-06-15", 37.1],
|
["2000-06-16", 36.9],
|
["2000-06-17", 36.4],
|
["2000-06-18", 38.8],
|
["2000-06-19", 37.5],
|
["2000-06-20", 36.6],
|
["2000-06-21", 36.8],
|
["2000-06-22", 36.2],
|
["2000-06-23", 37.8],
|
];
|
const dateList = data.map(function (item) {
|
return item[0];
|
});
|
const valueList = data.map(function (item) {
|
return item[1];
|
});
|
var option = {
|
title: {
|
text: "历史体温记录",
|
},
|
visualMap: [
|
{
|
show: false,
|
type: "continuous",
|
seriesIndex: 0,
|
min: 0,
|
max: 400,
|
},
|
],
|
|
tooltip: {
|
trigger: "axis",
|
},
|
xAxis: [
|
{
|
data: dateList,
|
},
|
],
|
yAxis: [{}],
|
series: [
|
{
|
type: "line",
|
showSymbol: false,
|
data: valueList,
|
},
|
],
|
};
|
// 使用刚指定的配置项和数据显示图表。
|
myxyChart.setOption(option);
|
},
|
},
|
};
|
</script>
|
|
<style lang="scss" scoped>
|
.personages {
|
height: 88px;
|
width: 100%;
|
background-color: #5e86f9;
|
border-radius: 5px;
|
padding: 20px;
|
margin-bottom: 10px;
|
line-height: 48px;
|
font-size: 25px;
|
font-weight: 600;
|
color: #ffffff;
|
.headportrait {
|
display: flex;
|
.text-center {
|
width: 55px;
|
height: 55px;
|
margin-right: 10px;
|
img {
|
width: 100%;
|
height: 100%;
|
border-radius: 50%;
|
}
|
}
|
.text-title {
|
font-size: 20px;
|
font-weight: 500;
|
color: #ecfcfc;
|
}
|
}
|
}
|
.xinz-inf {
|
font-size: 18px;
|
// white-space: nowrap;
|
overflow: hidden;
|
text-overflow: ellipsis;
|
|
line-height: 48px;
|
|
.el-tag + .el-tag {
|
margin-left: 10px;
|
}
|
.button-new-tag {
|
margin-left: 10px;
|
height: 32px;
|
line-height: 30px;
|
padding-top: 0;
|
padding-bottom: 0;
|
}
|
.input-new-tag {
|
width: 90px;
|
margin-left: 10px;
|
vertical-align: bottom;
|
}
|
}
|
.el-tabs--border-card {
|
// font-size: 25px;
|
.mulsz {
|
font-size: 25px;
|
margin-top: 20px;
|
}
|
}
|
.information-content {
|
margin-top: 20px;
|
background: #ffffff;
|
border: 1px solid #dcdfe6;
|
-webkit-box-shadow: 0 2px 4px 0 rgba(0, 0, 0, 0.12),
|
0 0 6px 0 rgba(0, 0, 0, 0.04);
|
.top-message {
|
margin-top: 25px;
|
margin-left: 100px;
|
.detailed {
|
width: 88%;
|
border-radius: 8px;
|
padding: 30px;
|
margin-bottom: 30px;
|
background-color: #ddf0f8;
|
.bg-purple {
|
margin-bottom: 20px;
|
}
|
.spanvalue {
|
display: inline-block;
|
min-width: 200px;
|
border-bottom: 1px solid rgb(172, 172, 172);
|
}
|
}
|
}
|
|
.headline {
|
font-size: 25px;
|
padding-left: 5px;
|
margin-bottom: 10px;
|
border-left: 8px solid rgb(65, 161, 190);
|
}
|
.headlines {
|
font-size: 25px;
|
display: flex;
|
width: 88%;
|
justify-content: space-between;
|
padding-left: 5px;
|
margin-bottom: 10px;
|
border-left: 8px solid rgb(65, 161, 190);
|
}
|
.bottom-message {
|
margin-bottom: 25px;
|
margin-left: 100px;
|
.Table-screen {
|
width: 88%;
|
padding: 30px;
|
margin-bottom: 30px;
|
border-radius: 8px;
|
background-color: #ddf0f8;
|
font-size: 20px !important;
|
}
|
}
|
}
|
.medical-record {
|
margin-top: 20px;
|
margin: 20px;
|
padding: 30px;
|
background: #ffffff;
|
border: 1px solid #dcdfe6;
|
-webkit-box-shadow: 0 2px 4px 0 rgba(0, 0, 0, 0.12),
|
0 0 6px 0 rgba(0, 0, 0, 0.04);
|
}
|
.sontwoactiveName {
|
margin: 0 auto;
|
}
|
::v-deep.el-table .warning-row {
|
background: oldlace;
|
}
|
</style>
|
