提交 5426d36d 编写于 作者: yi.li's avatar yi.li

详情接口及健康记录页面

上级 af68b014
......@@ -15,7 +15,8 @@
}
/*恢复messageBox默认样式*/
.el-message-box {
width: 360px;
height: 220px;
}
.el-message-box__status+.el-message-box__message{
padding-left: 20px;
......
......@@ -76,3 +76,39 @@ export const getPatientDetail = (patientId) => {
description: '获取居民详情',
})
};
export const deletePatient = (data) => {
return fetch({
headers,
url: getBaseUrl(`healths/patients/batch`),
method: 'delete',
data: data,
description: '删除居民',
})
};
export const getRemindPatient = (data) => {
return fetch({
headers,
url: getBaseUrl(`healths/patients/remind`),
method: 'post',
data: data,
description: '提醒居民绑定微信',
})
};
export const savePatientInfo = (data) => {
return fetch({
headers,
url: getBaseUrl(`healths/patients/update`),
method: 'post',
data: data,
description: '保存居民信息',
})
};
export const getLabelsList = (params) => {
return fetch({
headers,
url: getBaseUrl(`healths/labels/`),
method: 'get',
params: params,
description: '获取分组列表',
})
};
<template>
<div class="form-warp">
<el-form
:model="patientInfoForm"
:rules="rules"
ref="patientInfoForm"
label-width="150px"
label-suffix=":"
size="small"
:inline="true">
<el-row>
<el-col :span="12">
<el-form-item label="居民姓名" prop="nickname">
<el-input v-model="patientInfoForm.nickname" placeholder="请输入居民姓名"></el-input>
</el-form-item>
</el-col>
<el-col :span="12">
<el-form-item label="手机号" prop="mobilePhone">
<el-input v-model="patientInfoForm.mobilePhone" maxlength="11" placeholder="请输入手机号"></el-input>
</el-form-item>
</el-col>
</el-row>
<div class="has-header">数据记录</div>
<el-row>
<el-col :span="12">
<el-form-item label="诊断" prop="diseaseIdList">
<el-select v-model="patientInfoForm.diseaseIdList" multiple placeholder="请选择居民疾病诊断">
<el-option
v-for="item in diseasesList"
:key="item.diseaseId"
:label="item.diseaseName"
:value="item.diseaseId">
</el-option>
</el-select>
</el-form-item>
</el-col>
<el-col :span="12">
<el-form-item label="分组" prop="labelIdList">
<el-select v-model="patientInfoForm.labelIdList" multiple placeholder="请选择居民分组">
<el-option
v-for="item in labelsList"
:key="item.labelId"
:label="item.labelName"
:value="item.labelId">
</el-option>
</el-select>
</el-form-item>
</el-col>
</el-row>
<div class="has-header">基本信息</div>
<el-row>
<el-col :span="12">
<el-form-item label="身份证" prop="idNo">
<el-input v-model="patientInfoForm.idNo" placeholder="请输入身份证"></el-input>
</el-form-item>
</el-col>
<el-col :span="12">
<el-form-item label="出生年月" prop="birthTime">
<el-date-picker
type="date"
v-model="patientInfoForm.birthTime"
placeholder="请选择出生年月"
value-format="yyyy-MM-dd"
value="yyyy-MM-dd"
style="width:250px">
</el-date-picker>
</el-form-item>
</el-col>
</el-row>
<el-row>
<el-col :span="12">
<el-form-item label="年龄" prop="age">
<span>{{patientInfoForm.age}}</span>
<!--<el-input v-model="patientInfoForm.age" placeholder="请输入身份证"></el-input>-->
</el-form-item>
</el-col>
<el-col :span="12">
<el-form-item label="性别" prop="sex">
<el-radio-group v-model="patientInfoForm.sex">
<el-radio :label="1"></el-radio>
<el-radio :label="2"></el-radio>
</el-radio-group>
</el-form-item>
</el-col>
</el-row>
</el-form>
</div>
</template>
<script>
import { mapGetters } from 'vuex'
import { getDiseasesList, getLabelsList, getPatientDetail, getRemindPatient, deletePatient,savePatientInfo } from '@/utils/patients/patientsapi'
export default {
name: "basicInfo",
components: {},
data() {
return {
diseasesList: [],
labelsList: [],
patientInfoForm: {
nickname: '',
mobilePhone: '',
diseaseIdList: [],
labelIdList: [],
idNo: '',
birthTime: '',
age: '',
},
rules: {
nickname: [{required: true, message: '请输入居民姓名', trigger: ['change', 'blur'] }],
mobilePhone: [{required: true, message: '请输入手机号', trigger: ['change', 'blur'] }],
},
patientId: '99997786', //暂时写死一个居民的patientId
patientInfo: {
isWechatBind: 1,
remark: '',
},
showLabelName: '',
showDiseaseName: '',
birthTimeDisplay: '',
recordList: [{}],
}
},
created() {
this.init();
this.initConstant();
},
computed: {
// ...mapState('planManage',{
// remarkOption: state => state.remarkOption,
// templateOptions: state => state.templateOptions,
// })
...mapGetters([
'_token',
])
},
methods: {
// ...mapActions('planManage', ['getTimeNodeList','getRemarkOption','getFollowupTemplate']),
initConstant(){
getDiseasesList().then((data) => {
if(data.code == '000000') {
this.diseasesList = data.data;
}
});
getLabelsList({
type: 1,
token: 'AB2BEE40C5AD452E93688D31A14E8C12'
}).then((data) => {
if(data.code == '000000') {
this.labelsList = data.data.labelNameList;
}
})
},
init() {
getPatientDetail(this.patientId).then((data) => {
if(data.code == '000000') {
this.patientInfo = data.data;
if(this.patientInfo){
let customLabels = this.patientInfo.customLabels;
let diseases = this.patientInfo.diseases;
let groupLabelNames = [];
let groupDiseaseNames = [];
//对出生日期的处理
if(this.patientInfo.birthTime){
let timeArr = this.patientInfo.birthTime.split('-');
let mm = parseInt(timeArr[1]) < 10 ? `0${parseInt(timeArr[1])}` : parseInt(timeArr[1]);
let dd = parseInt(timeArr[2]) < 10 ? `0${parseInt(timeArr[2])}` : parseInt(timeArr[2]);
this.birthTimeDisplay = `${timeArr[0]}-${mm}-${dd}`;
}else {
this.birthTimeDisplay = '';
}
// 对分组的处理
if(customLabels) {
customLabels.forEach(item => {
groupLabelNames.push(item.label)
});
this.showLabelName = groupLabelNames.join(';');
} else {
this.showLabelName = '';
}
// 对诊断疾病的处理
if(diseases) {
diseases.forEach(item => {
groupDiseaseNames.push(item.diseaseName)
});
this.showDiseaseName = groupDiseaseNames.join(';');
} else {
this.showDiseaseName = '';
}
}
}
})
},
//提醒绑定
remindBind() {
let remindMobileWechatPara = {
qrcodeType: 1,
patientId: this.patientId,
// deviceInfo: window.getDeviceInfo()
}
getRemindPatient({
...remindMobileWechatPara
}).then( data => {
if(data.code == '000000') {
this.$message.success(data.data.respMsg);
}else {
this.$message.error(data.message);
}
})
},
//保存备注
saveRemark() {
savePatientInfo(this.patientInfo).then(data => {
if(data.code == '000000'){
this.$message.success('保存备注成功')
}else {
this.$message.error(data.message);
}
})
},
},
filters: {
emptyFilter: function(value) {
if (!value) {
return '-';
} else {
return value;
}
},
sexFileter: function(value) {
if (!value && value != 0) {
return '-';
} else {
let hash = {
1: '男',
2: '女'
};
return hash[value];
}
},
},
}
</script>
<style lang="scss">
.el-input{
width: 250px;
}
.form-warp{
margin-top: 30px;
.has-header{
padding: 15px 0;
margin-bottom: 20px;
border-bottom: 1px dashed #888;
}
}
</style>
......@@ -8,7 +8,7 @@
</bread-crumb>
<div class="f-main-content screenSet">
<div>
<div class="right-btn-group">
<div class="right-btn-group" v-if="activeName == 'first'">
<el-button plain size="small" @click="deletePatient">删除</el-button>
<el-button type="primary" size="small" @click="editPatient">编辑</el-button>
</div>
......@@ -17,14 +17,14 @@
<div class="section">
<div class="has-header">
<p>基本信息</p>
<p class="right-p"><span>添加时间:{{patientInfo.createdTime}}</span><span>最后修改时间:{{patientInfo.modifiedTime}}</span></p>
<p class="right-p"><span>添加时间:{{patientInfo.createdTime}}</span><span>最后修改时间:{{ patientInfo.modifiedTime ? patientInfo.modifiedTime : patientInfo.createdTime}}</span></p>
</div>
<div class="item">
<div><p class="title">居民姓名:</p><p class="info">{{patientInfo.nickname | emptyFilter}}</p></div>
<div><p class="title">居民姓名:</p><p class="info">{{(patientInfo.nickname || patientInfo.wechatNickname) | emptyFilter}}</p></div>
<div><p class="title">身份证:</p><p class="info">{{patientInfo.idNo | emptyFilter}}</p></div>
</div>
<div class="item">
<div><p class="title">出生年月:</p><p class="info">{{patientInfo.birthTime | emptyFilter}}</p></div>
<div><p class="title">出生年月:</p><p class="info">{{birthTimeDisplay | emptyFilter}}</p></div>
<div><p class="title">性别:</p><p class="info">{{patientInfo.sex | sexFileter}}</p></div>
</div>
<div class="item">
......@@ -37,8 +37,8 @@
</div>
<div class="has-header">数据记录</div>
<div class="item wrap-p">
<div><p class="title">诊断:</p><p class="info">糖尿病;高血压;糖尿病;高血压;糖尿病;高血压;糖尿病;高血压;糖尿病;高血压;</p></div>
<div><p class="title">分组:</p><p class="info">糖尿病高危</p></div>
<div><p class="title">诊断:</p><p class="info">{{showDiseaseName | emptyFilter}}</p></div>
<div><p class="title">分组:</p><p class="info">{{showLabelName | emptyFilter}}</p></div>
</div>
<div class="has-header">联系方式</div>
<div class="item">
......@@ -46,15 +46,16 @@
<div><p class="title"></p><p class="info"></p></div>
</div>
<div class="item">
<div><p class="title">所在地区:</p><p class="info">上海市 上海市 浦东新区</p></div>
<div><p class="title">详细地址:</p><p class="info">{{patientInfo.patientAddress | emptyFilter}}</p></div>
<div><p class="title">所在地区:</p><p class="info">{{patientInfo.patientAddress | emptyFilter}}</p></div>
<div><p class="title">详细地址:</p><p class="info">{{patientInfo.address | emptyFilter}}</p></div>
</div>
<div class="item">
<div><p class="title">工作单位:</p><p class="info">{{patientInfo.workplace | emptyFilter}}</p></div>
<div>
<p class="title">微信:</p>
<p class="info" v-if="patientInfo.isWechatBind == '1'">未绑定 <el-button type="text" class="ml10" @click="remindBind">提醒绑定</el-button></p>
<p class="info" v-if="patientInfo.isWechatBind == '2'">已绑定 <span class="ml10">(微信名:{{patientInfo.wechatNickname | emptyFilter}}</span></p>
<p class="info" v-if="patientInfo.isWechatBind == '1'">未绑定 <el-button type="text" class="ml10" @click="remindBind" v-if="patientInfo.isRemind == '1'">提醒绑定</el-button><span class="ml10" v-if="patientInfo.isRemind == '2'">已提醒</span></p>
<p class="info" v-else-if="patientInfo.isWechatBind == '2'">已绑定 <span class="ml10">(微信名:{{patientInfo.wechatNickname | emptyFilter}}</span></p>
<p class="info" v-else>-</p>
</div>
</div>
<div class="has-header">其他</div>
......@@ -64,10 +65,10 @@
<p class="info">
<el-input
type="textarea"
rows="3"
:autosize="{ minRows: 3, maxRows: 7}"
placeholder="请输入内容"
v-model="patientInfo.remark"
maxlength="30"
maxlength="200"
:show-word-limit="true"
>
</el-input>
......@@ -77,9 +78,54 @@
</div>
</div>
</el-tab-pane>
<el-tab-pane label="健康记录" name="second">
<div class="health-record-list" v-if="recordList.length">
<div class="item">
<div class="record-date">2019-3-20</div>
<div class="record-content">
<div class="record-title">
<p>长海医院2型糖尿病18年随访计划-第3次随访</p>
<span>门诊随访</span>
</div>
<div class="list-visit">
<span class="left-label">患教内容:</span>
<div class="right-item">健康漫画标题</div>
</div>
<div class="list-visit">
<span class="left-label">随访量表:</span>
<div class="right-item">
<p>高血压随访量表<span class="check-btn" @click="openScaleDetail">查看量表</span></p>
<p>糖尿病随访量表<span class="check-btn" @click="openScaleDetail">查看量表</span></p>
</div>
</div>
</div>
</div>
<div class="item">
<div class="record-date">2019-2-20</div>
<div class="record-content">
<div class="record-title">
<p>长海医院2型糖尿病18年随访计划-第3次随访</p>
<span>门诊随访</span>
</div>
<div class="list-visit">
<span class="left-label">患教内容:</span>
<div class="right-item">健康漫画标题</div>
</div>
<div class="list-visit">
<span class="left-label">随访量表:</span>
<div class="right-item">
<p>高血压随访量表<span class="check-btn" @click="openScaleDetail">查看量表</span></p>
</div>
</div>
</div>
</div>
</div>
<div class="no-record-content" v-if="!recordList.length">
<div>
<img src="../../../assets/image/no-content1.png"/>
<p>暂无随访记录或您没有权限访问</p>
</div>
</div>
</el-tab-pane>
</el-tabs>
</div>
......@@ -89,9 +135,10 @@
<script>
import BreadCrumb from '@/components/breadcrumb'
import { getDiseasesList, getPatientDetail } from '@/utils/patients/patientsapi'
import { mapGetters } from 'vuex'
import { getDiseasesList, getPatientDetail, getRemindPatient, deletePatient,savePatientInfo } from '@/utils/patients/patientsapi'
export default {
name: "addNewPlan",
name: "patientDetail",
components: {
BreadCrumb,
},
......@@ -103,9 +150,15 @@
curmbThird: '居民详情',
jumPathThird: '/patients-manage/mypatients-manage/patients-list',
activeName: 'first',
hasBind: false,
remark: '',
patientInfo: {},
patientId: '99997786', //暂时写死一个居民的patientId 99997747
patientInfo: {
isWechatBind: 1,
remark: '',
},
showLabelName: '',
showDiseaseName: '',
birthTimeDisplay: '',
recordList: [{}],
}
},
created() {
......@@ -120,23 +173,60 @@
// remarkOption: state => state.remarkOption,
// templateOptions: state => state.templateOptions,
// })
...mapGetters([
'_token',
])
},
methods: {
// ...mapActions('planManage', ['getTimeNodeList','getRemarkOption','getFollowupTemplate']),
init() {
let patientId = '99997747'; //dev中凤尾花的patientId
getPatientDetail(patientId).then(({data}) => {
this.patientInfo = data;
getPatientDetail(this.patientId).then((data) => {
if(data.code == '000000') {
this.patientInfo = data.data;
if(this.patientInfo){
let customLabels = this.patientInfo.customLabels;
let diseases = this.patientInfo.diseases;
let groupLabelNames = [];
let groupDiseaseNames = [];
//对出生日期的处理
if(this.patientInfo.birthTime){
let timeArr = this.patientInfo.birthTime.split('-');
let mm = parseInt(timeArr[1]) < 10 ? `0${parseInt(timeArr[1])}` : parseInt(timeArr[1]);
let dd = parseInt(timeArr[2]) < 10 ? `0${parseInt(timeArr[2])}` : parseInt(timeArr[2]);
this.birthTimeDisplay = `${timeArr[0]}-${mm}-${dd}`;
}else {
this.birthTimeDisplay = '';
}
// 对分组的处理
if(customLabels) {
customLabels.forEach(item => {
groupLabelNames.push(item.label)
});
this.showLabelName = groupLabelNames.join(';');
} else {
this.showLabelName = '';
}
// 对诊断疾病的处理
if(diseases) {
diseases.forEach(item => {
groupDiseaseNames.push(item.diseaseName)
});
this.showDiseaseName = groupDiseaseNames.join(';');
} else {
this.showDiseaseName = '';
}
}
}
})
},
tabChangeHandler(tab) {
console.log(tab);
// console.log(tab);
},
deletePatient() {
// 把写的提示信心需要换行的地方分成数组 confirmText
const confirmText = ['您确定要删除此居民吗?', '删除后,您将无法对该居民发送患教和进行随访,重新添加该居民依旧可查看历史发送记录及随访记录']
const newDatas = []
const h = this.$createElement
const confirmText = ['您确定要删除此居民吗?', '删除后,您将无法对该居民发送患教和进行随访,重新添加该居民依旧可查看历史发送记录及随访记录'];
const newDatas = [];
const h = this.$createElement;
for (const i in confirmText) {
newDatas.push(h('p', null, confirmText[i]))
}
......@@ -147,10 +237,29 @@
cancelButtonText: '取消',
type: 'warning'
}).then(() => {
this.$message({
type: 'success',
message: '删除成功!'
});
let reqParam = {
patientIdList: [this.patientId],
token: this._token,
// token: 'AB2BEE40C5AD452E93688D31A14E8C12',
};
deletePatient(reqParam).then(data => {
if(data.code == '000000') {
this.$message({
type: 'success',
message: `${this.patientInfo.nickname}居民删除成功!`
});
setTimeout(()=>{
this.$router.push({
path: '/patients-manage/mypatients-manage/patients-list'
})
},2000)
}else {
this.$message({
type: 'error',
message: data.message
});
}
})
}).catch(() => {
this.$message({
type: 'info',
......@@ -160,9 +269,47 @@
},
editPatient() {},
//提醒绑定
remindBind() {},
remindBind() {
let remindMobileWechatPara = {
qrcodeType: 1,
patientId: this.patientId,
// deviceInfo: window.getDeviceInfo()
}
getRemindPatient({
...remindMobileWechatPara
}).then( data => {
if(data.code == '000000') {
this.$message.success(data.data.respMsg);
}else {
this.$message.error(data.message);
}
})
},
//保存备注
saveRemark() {},
saveRemark() {
savePatientInfo(this.patientInfo).then(data => {
if(data.code == '000000'){
this.$message.success('保存备注成功')
}else {
this.$message.error(data.message);
}
})
},
//查看量表详情
openScaleDetail() {
console.log('打开量表');
// this.$router.push({
// path: '/followup/record-manage/form-template',
// query: {
// doctorId: val.doctorId,
// scaleNo: val.resourceId,
// planPatientsTimesId:
// val.planPatientsTimesId,
// showBtn: 0
// }
// });
// window.open()
},
},
filters: {
emptyFilter: function(value) {
......@@ -188,7 +335,6 @@
</script>
<style lang="scss" scoped>
@import '../../../style/patients-style/element-reset.css';
/*@import '../../../style/followup/element-reset.css';*/
.f-main-content{
background: #ffffff;
......@@ -207,7 +353,7 @@
flex: 1;
line-height: 36px;
.title{
width: 180px;
width: 150px;
text-align: right;
}
.info{
......@@ -243,9 +389,75 @@
}
}
}
.health-record-list{
.item{
width: 100%;
margin-bottom: 15px;
.record-date{
color: #999;
padding-bottom: 10px;
}
.record-content{
width: 100%;
border: 1px solid #E4E7ED;
border-radius: 5px;
padding: 10px 15px 13px;
.record-title{
display: flex;
justify-content: space-between;
padding: 5px 0;
span{
color: #999;
font-size: 14px;
}
}
.list-visit{
line-height: 28px;
padding: 6px 0 2px;
display: flex;
display: -webkit-flex;
align-items: flex-start;
font-size: 14px;
color: #999;
.left-label{
line-height: 28px;
}
.right-item{
flex: 1;
line-height: 28px;
p{
line-height: 28px;
.check-btn{
color: #449284;
cursor: pointer;
margin-left: 15px;
}
}
}
}
}
}
}
.no-record-content{
@media screen and (min-width:1240px) and (max-width:1545px){
height: 300px;
}
@media screen and (min-width:1545px) and (max-width:1600px){
height: 500px;
}
@media screen and (min-width:1600px){
height: 600px;
}
text-align: center;
padding: 50px 0 60px;
img{
width: 120px;
}
p{
color: #B9B9C6;
font-size: 20px;
}
}
.ml10{
margin-left: 10px;
}
......
Markdown 格式
0% or
您添加了 0 到此讨论。请谨慎行事。
先完成此消息的编辑!
想要评论请 注册