You can not select more than 25 topics
Topics must start with a letter or number, can include dashes ('-') and can be up to 35 characters long.
669 lines
17 KiB
669 lines
17 KiB
<template>
|
|
<div class="patient-detail">
|
|
<div class="patient-info-box">
|
|
<a-card class="patient-info-card">
|
|
<div class="patient-info-header">
|
|
<div class="patient-info-header-title">患者基本信息</div>
|
|
<div class="patient-info-header-btn"><a-button @click="goEditPatient"
|
|
v-if="!authEdit && patientDataCur.id">编辑</a-button>
|
|
</div>
|
|
</div>
|
|
<div class="patient-info-body">
|
|
<a-form-model ref="ruleForm" :label-col="{ span: 4 }" :wrapper-col="{ span: 20 }" labelAlign="left"
|
|
class="create-form" :model="form" :rules="rules">
|
|
|
|
<a-row :gutter="20">
|
|
<a-col :span="12">
|
|
<a-form-model-item label="姓名" prop="patientName1">
|
|
<a-input v-model="form.patientName" placeholder="请输入姓名" v-if="authEdit"></a-input>
|
|
<div v-else class="edititem"> {{patientDataCur.patientName}} </div>
|
|
</a-form-model-item>
|
|
</a-col>
|
|
<a-col :span="12">
|
|
<a-form-model-item label="民族">
|
|
<a-select v-model="form.patientNation" placeholder="请选择民族" v-if="authEdit">
|
|
<a-select-option v-for="item in nationList" :key="item" :value="item">
|
|
{{ item }}
|
|
</a-select-option>
|
|
</a-select>
|
|
<div v-else class="edititem"> {{patientDataCur.patientNation}} </div>
|
|
</a-form-model-item>
|
|
</a-col>
|
|
<a-col :span="12">
|
|
<a-form-model-item label="性别">
|
|
<a-select v-model="form.patientGender" placeholder="请选择性别" v-if="authEdit">
|
|
<a-select-option :value="0">男</a-select-option>
|
|
<a-select-option :value="1">女</a-select-option>
|
|
</a-select>
|
|
<div v-else class="edititem">
|
|
<span v-if="patientDataCur.patientGender == 0">男</span>
|
|
<span v-else-if="patientDataCur.patientGender == 1">女</span>
|
|
</div>
|
|
</a-form-model-item>
|
|
</a-col>
|
|
<a-col :span="12">
|
|
<a-form-model-item label="身高">
|
|
<a-input v-model="form.height" placeholder="请输入身高 (cm)"
|
|
@change="bmiChange($event, 'height')" v-if="authEdit" />
|
|
<div v-else class="edititem"> {{patientDataCur.height}} </div>
|
|
</a-form-model-item>
|
|
</a-col>
|
|
<a-col :span="12">
|
|
<a-form-model-item label="体重">
|
|
<a-input v-model="form.weight" placeholder="请输入体重 (kg)"
|
|
@change="bmiChange($event, 'weight')" v-if="authEdit" />
|
|
<div v-else class="edititem"> {{patientDataCur.weight}} </div>
|
|
</a-form-model-item>
|
|
</a-col>
|
|
<a-col :span="12">
|
|
<a-form-model-item label="BMI">
|
|
<div class="edititem" v-if="authEdit">{{form.bmi}}</div>
|
|
<div class="edititem" v-else>{{patientDataCur.bmi}}</div>
|
|
</a-form-model-item>
|
|
</a-col>
|
|
<a-col :span="18">
|
|
<a-form-model-item label="身份证号" :label-col="{ span: 6 }" :wrapper-col="{ span: 18 }"
|
|
placeholder="请输入身份证号">
|
|
<keyboard placeHolder="" :index-num="indexNum" @keyboard-input="handleKeyBoard"
|
|
:old-value="form.patientIdCardNo" v-if="authEdit" />
|
|
<div v-else class="edititem">
|
|
{{patientDataCur.patientIdCardNo ? utils.maskIDCard(patientDataCur.patientIdCardNo) : '-'}}
|
|
</div>
|
|
</a-form-model-item>
|
|
</a-col>
|
|
<a-col :span="6" style="padding-top: 0.15vw;" v-if="authEdit">
|
|
<a-button type="primary" class="idcard" @click="openCamera">扫描身份证</a-button>
|
|
</a-col>
|
|
<a-col :span="16">
|
|
<a-form-model-item label="联系方式" :label-col="{ span: 6 }" :wrapper-col="{ span: 18 }"
|
|
placeholder="请输入联系方式">
|
|
<a-input v-model="form.contract" placeholder="请输入联系方式" v-if="authEdit" />
|
|
<div v-else class="edititem">{{patientDataCur.contract}}</div>
|
|
</a-form-model-item>
|
|
</a-col>
|
|
<a-col :span="24">
|
|
<a-divider />
|
|
</a-col>
|
|
<a-col :span="12">
|
|
<a-form-model-item label="急救类型" :label-col="{ span: 8 }" :wrapper-col="{ span: 16 }">
|
|
<a-select v-model="form.type" placeholder="请选择类型" v-if="authEdit">
|
|
<a-select-option :value="0">卒中急救</a-select-option>
|
|
<a-select-option :value="1">胸痛</a-select-option>
|
|
<a-select-option :value="2">创伤</a-select-option>
|
|
</a-select>
|
|
<div v-else class="edititem">
|
|
<span v-if="patientDataCur.type == 0">卒中急救</span>
|
|
<span v-else-if="patientDataCur.type == 1">胸痛</span>
|
|
<span v-else-if="patientDataCur.type == 2">创伤</span>
|
|
</div>
|
|
</a-form-model-item>
|
|
</a-col>
|
|
<a-col :span="12">
|
|
<a-form-model-item label="平车">
|
|
<!-- <a-select v-model="form.carNo" placeholder="请选择平车号" v-if="authEdit">
|
|
<a-select-option :value="0">否</a-select-option>
|
|
<a-select-option :value="1">是</a-select-option>
|
|
</a-select> -->
|
|
<a-select v-model="form.carNo" placeholder="请选择平车号" v-if="authEdit">
|
|
<a-select-option v-for="item in carList" :key="item.id" :value="item.deviceNo">
|
|
{{ item.deviceNo }}
|
|
</a-select-option>
|
|
</a-select>
|
|
<div v-else class="edititem">{{patientDataCur.carNo}}</div>
|
|
</a-form-model-item>
|
|
</a-col>
|
|
<a-col :span="12">
|
|
<a-form-model-item label="绿道状态" :label-col="{ span: 8 }" :wrapper-col="{ span: 16 }">
|
|
<a-switch v-model="form.greenRoadFlag" v-if="authEdit" />
|
|
<a-switch v-model="patientDataCur.greenRoadFlag" v-else disabled />
|
|
<!-- <div v-else class="edititem">{{patientDataCur.greenRoadFlag ? '启用' : '禁用'}}</div> -->
|
|
</a-form-model-item>
|
|
</a-col>
|
|
</a-row>
|
|
</a-form-model>
|
|
</div>
|
|
<div class="patient-info-footer">
|
|
<template v-if="!authEdit">
|
|
<!-- <a-button block @click="goPatientList">返回</a-button> -->
|
|
<a-button block type="primary" class="next" @click="goNext">下一步</a-button>
|
|
</template>
|
|
<template v-else>
|
|
<a-button block @click="handleCancel">取消</a-button>
|
|
<a-button block type="primary" class="next" @click="handleSubmit"
|
|
:loading="confirmLoading">完成</a-button>
|
|
</template>
|
|
|
|
|
|
</div>
|
|
</a-card>
|
|
</div>
|
|
<patient-create ref="patientCreate"></patient-create>
|
|
</div>
|
|
</template>
|
|
|
|
<script>
|
|
import {
|
|
mapMutations,
|
|
mapState
|
|
} from 'vuex';
|
|
import PatientCreate from './patient-create.vue';
|
|
import PatientList from './patient-list.vue';
|
|
import keyboard from '@/components/keyboard.vue';
|
|
import {
|
|
create,
|
|
uploadIdcard,
|
|
idcardInfo,
|
|
idcardInfoBase64,
|
|
createFirstAid,
|
|
createPatient,
|
|
eduitPatient,
|
|
messageQuery
|
|
} from 'api';
|
|
export default {
|
|
data() {
|
|
return {
|
|
indexNum: 0, //必填字段,为键盘索引,每个键盘必须具有唯一值
|
|
patientIdCardNo: '',
|
|
confirmLoading: false,
|
|
authEdit: false,
|
|
form: {},
|
|
firstAidId: '',
|
|
rules: {
|
|
patientName: [{
|
|
required: true,
|
|
message: '请输入姓名',
|
|
trigger: 'blur'
|
|
}, ],
|
|
}
|
|
}
|
|
},
|
|
props: ['firstAidData', 'carList', 'carNo'],
|
|
components: {
|
|
PatientCreate,
|
|
PatientList,
|
|
keyboard
|
|
},
|
|
computed: {
|
|
...mapState('storm', ['nationList', 'APP_DEVICE_NO']),
|
|
...mapState('patient', ['patientData', 'timerData', 'patientDataCur']),
|
|
},
|
|
async created() {
|
|
// console.log('patientDataCur', this.patientDataCur)
|
|
},
|
|
watch: {
|
|
patientData() {
|
|
const {
|
|
firstAidId
|
|
} = this.patientData;
|
|
console.log('firstAidId', this.patientData)
|
|
if (!firstAidId) return;
|
|
this.firstAidId = firstAidId
|
|
}
|
|
},
|
|
methods: {
|
|
...mapMutations('patient', [
|
|
'setPatientData',
|
|
'setOverviewType',
|
|
'setTimerData',
|
|
'setVideo',
|
|
'setBook',
|
|
]),
|
|
bmiChange(e, filed) {
|
|
if (this.form.height && this.form.weight) {
|
|
const bmi = this.utils.computeBMI(this.form.weight, this.form.height)
|
|
// console.log(this.form.height, this.form.weight, bmi)
|
|
if (!isNaN(bmi)) this.form.bmi = bmi
|
|
}
|
|
},
|
|
goPatientList() {
|
|
this.$emit('change', 'patient-list')
|
|
},
|
|
async goNext(e) {
|
|
|
|
e.preventDefault();
|
|
this.$refs.ruleForm.validate(async (valid) => {
|
|
if (valid) {
|
|
this.confirmLoading = true;
|
|
// const reg =
|
|
// /^(^[1-9]\d{7}((0\d)|(1[0-2]))(([0|1|2]\d)|3[0-1])\d{3}$)|(^[1-9]\d{5}[1-9]\d{3}((0\d)|(1[0-2]))(([0|1|2]\d)|3[0-1])((\d{4})|\d{3}[Xx])$)$/;
|
|
|
|
// if (!reg.test(this.patientIdCardNo) && this.patientIdCardNo) {
|
|
// this.$message.error('身份证格式不正确');
|
|
// return;
|
|
// }
|
|
// if (typeof this.firstAidData.greenRoadFlag == 'boolean') {
|
|
// this.firstAidData.greenRoadFlag = 0;
|
|
// }
|
|
let res = await create({
|
|
param: {
|
|
...this.patientDataCur,
|
|
// patientIdCardNo: "142422199802281819",
|
|
// identityNo: "142422199802281819",
|
|
},
|
|
});
|
|
|
|
const {
|
|
data,
|
|
code,
|
|
msg
|
|
} = res;
|
|
if (code === 200) {
|
|
|
|
await this.home.queryAid(data.firstAidId, false);
|
|
// this.setPatientData({ ...this.patientDataCur, firstAidId: data.firstAidId })
|
|
this.authEdit = false
|
|
this.$message.success('更新成功');
|
|
// this.$router.push('/firstaid/thrombolysis')
|
|
this.getMessageQuery(0, data.firstAidId)
|
|
this.$router.push({
|
|
name: 'Thrombolysis',
|
|
query: {
|
|
r: new Date().getTime()
|
|
}
|
|
});
|
|
// this.$emit('on-success', data);
|
|
}
|
|
this.confirmLoading = false;
|
|
}
|
|
});
|
|
// this.$router.push('/firstaid/thrombolysis')
|
|
},
|
|
goEditPatient() {
|
|
this.form = JSON.parse(JSON.stringify(this.patientDataCur))
|
|
this.authEdit = true
|
|
},
|
|
handleCancel() {
|
|
this.authEdit = false
|
|
this.confirmLoading = false
|
|
this.form = {}
|
|
},
|
|
handleSubmit(e) {
|
|
e.preventDefault();
|
|
this.$refs.ruleForm.validate(async (valid) => {
|
|
if (valid) {
|
|
this.confirmLoading = true;
|
|
const reg =
|
|
/^(^[1-9]\d{7}((0\d)|(1[0-2]))(([0|1|2]\d)|3[0-1])\d{3}$)|(^[1-9]\d{5}[1-9]\d{3}((0\d)|(1[0-2]))(([0|1|2]\d)|3[0-1])((\d{4})|\d{3}[Xx])$)$/;
|
|
|
|
if (!reg.test(this.patientIdCardNo) && this.patientIdCardNo) {
|
|
this.$message.error('身份证格式不正确');
|
|
this.confirmLoading = false;
|
|
return;
|
|
}
|
|
// if (typeof this.firstAidData.greenRoadFlag == 'boolean') {
|
|
// this.firstAidData.greenRoadFlag = 0;
|
|
// }
|
|
let res = await eduitPatient({
|
|
param: {
|
|
...this.patientDataCur,
|
|
...this.form
|
|
// patientIdCardNo: this.patientIdCardNo,
|
|
},
|
|
});
|
|
|
|
const {
|
|
data,
|
|
code,
|
|
msg
|
|
} = res;
|
|
if (code === 200) {
|
|
this.setPatientData(this.form)
|
|
this.authEdit = false
|
|
this.$message.success('更新成功');
|
|
// this.$router.push('/firstaid/thrombolysis')
|
|
this.$emit('on-success', data);
|
|
}
|
|
this.confirmLoading = false;
|
|
}
|
|
});
|
|
},
|
|
handleClickPatient(item) {
|
|
const {
|
|
sourceId,
|
|
patientName,
|
|
patientAge,
|
|
patientGender,
|
|
firstAidId,
|
|
} = item;
|
|
this.setPatientData({
|
|
sourceId,
|
|
patientName,
|
|
patientAge,
|
|
patientGender,
|
|
firstAidId,
|
|
});
|
|
},
|
|
handleKeyBoard(value) {
|
|
//value为在输入框里面输入的值
|
|
this.patientIdCardNo = value;
|
|
},
|
|
|
|
openCamera() {
|
|
const cmr = plus.camera.getCamera();
|
|
const res = cmr.supportedImageResolutions[0];
|
|
const fmt = cmr.supportedImageFormats[0];
|
|
cmr.captureImage(
|
|
(path) => {
|
|
plus.io.resolveLocalFileSystemURL(
|
|
path,
|
|
(entry) => {
|
|
//压缩图片
|
|
this.compressImage(entry.toLocalURL(), entry.name);
|
|
},
|
|
(e) => {
|
|
plus.nativeUI.toast(
|
|
'读取拍照文件错误:' + e.message
|
|
);
|
|
}
|
|
);
|
|
},
|
|
(error) => {
|
|
// alert("Capture image failed: " + error.message);
|
|
}, {
|
|
resolution: res,
|
|
format: fmt,
|
|
filter: 'image',
|
|
}
|
|
);
|
|
},
|
|
//压缩图片
|
|
compressImage(url, filename) {
|
|
var name = '_doc/upload/' + filename;
|
|
plus.zip.compressImage({
|
|
src: url, //src: (String 类型 )压缩转换原始图片的路径
|
|
dst: name, //压缩转换目标图片的路径
|
|
quality: 90, //quality: (Number 类型 )压缩图片的质量.取值范围为1-100
|
|
overwrite: true, //overwrite: (Boolean 类型 )覆盖生成新文件
|
|
width: '250',
|
|
height: '320',
|
|
},
|
|
(zip) => {
|
|
//页面显示图片
|
|
this.showPics(zip.target, name);
|
|
},
|
|
(error) => {
|
|
plus.nativeUI.toast('压缩图片失败,请稍候再试');
|
|
}
|
|
);
|
|
},
|
|
//显示图片
|
|
showPics(url, name) {
|
|
let _this = this;
|
|
//根据路径读取到文件
|
|
plus.io.resolveLocalFileSystemURL(url, (entry) => {
|
|
entry.file((file) => {
|
|
var fileReader = new plus.io.FileReader();
|
|
fileReader.readAsDataURL(file);
|
|
fileReader.onloadend = (e) => {
|
|
var picUrl = e.target.result.toString();
|
|
this.idcardInfoBase64(picUrl);
|
|
};
|
|
});
|
|
});
|
|
},
|
|
async idcardInfoBase64(url) {
|
|
let res = await idcardInfoBase64(url);
|
|
const {
|
|
data,
|
|
code,
|
|
msg
|
|
} = res;
|
|
if (code === 200) {
|
|
const {
|
|
name,
|
|
sex,
|
|
idCardNo,
|
|
nation
|
|
} = data;
|
|
this.form.patientName = name
|
|
this.form.patientGender = sex
|
|
this.form.patientNation = nation
|
|
this.patientIdCardNo = idCardNo;
|
|
} else {
|
|
this.$message.error(res.msg);
|
|
}
|
|
},
|
|
|
|
|
|
async queryMessage() {
|
|
const {
|
|
firstAidId
|
|
} = this.patientData;
|
|
const res = await messageQuery(firstAidId);
|
|
const {
|
|
code,
|
|
msg
|
|
} = res;
|
|
if (code === 200) {
|
|
this.setTimerData(res.data);
|
|
}
|
|
},
|
|
// 消息提示
|
|
async handMessageQuery() {
|
|
// 异步
|
|
const {
|
|
firstAidId
|
|
} = this.patientData;
|
|
if (firstAidId) {
|
|
const res = await messageQuery(firstAidId);
|
|
const {
|
|
code,
|
|
msg
|
|
} = res;
|
|
if (code === 200) {
|
|
this.setTimerData(res.data);
|
|
const {
|
|
map,
|
|
haveFlagInspect,
|
|
finishStatus,
|
|
} = res.data;
|
|
// console.log('firstAidInspectDataDtos: ', haveFlagInspect);
|
|
// if(finishStatus == 1){
|
|
// this.setTimerData({})
|
|
// this.request = 0
|
|
// this.setPatientData({})
|
|
// this.setPatientDataCur({})
|
|
// }
|
|
for (let k in map) {
|
|
if (map[k]) {
|
|
this.taskList = {
|
|
text: map[k],
|
|
status: false,
|
|
};
|
|
}
|
|
if (map[k] && this.taskList.status === false) {
|
|
// 记录不重复弹窗
|
|
if (this.taskList.text === map[k]) {
|
|
this.taskList.status = true;
|
|
}
|
|
|
|
|
|
|
|
if (
|
|
this.$route.name !== 'Min' &&
|
|
this.$route.name !== 'PatientList'
|
|
) {
|
|
this.tip = {
|
|
visible: true,
|
|
k,
|
|
content: map[k],
|
|
};
|
|
}
|
|
}
|
|
}
|
|
// 检验调取 判断是否有急诊号 1 弹窗, 0 不弹窗 Thrombolysis
|
|
if (haveFlagInspect) {
|
|
if (
|
|
this.$route.name !== 'Inspect' &&
|
|
this.$route.name !== 'PatientList'
|
|
) {
|
|
this.tip.Lnspect = true;
|
|
}
|
|
}
|
|
} else {
|
|
this.$message.error(msg);
|
|
}
|
|
}
|
|
},
|
|
async getMessageQuery(min, firstAidId) {
|
|
const n = min;
|
|
if (this.request === n) {
|
|
// 符合轮训条件
|
|
console.log('十秒');
|
|
this.request = n + 1;
|
|
await this.handMessageQuery();
|
|
}
|
|
},
|
|
}
|
|
}
|
|
</script>
|
|
|
|
<style lang="less" scoped>
|
|
.patient-detail {
|
|
display: flex;
|
|
height: calc(100vh - 180px);
|
|
overflow-y: auto;
|
|
|
|
.patient-dlist {
|
|
flex: 1;
|
|
}
|
|
|
|
.patient-info {
|
|
flex: 1;
|
|
}
|
|
|
|
.patient-info-box {
|
|
flex: 2;
|
|
// padding: 0 2rem 1rem;
|
|
|
|
.patient-info-card {
|
|
border-color: rgba(0, 0, 0, 0.09);
|
|
border-radius: .2rem;
|
|
box-shadow: 0 0.18vw 0.73vw rgba(0, 0, 0, 0.09);
|
|
padding: 1rem;
|
|
box-sizing: border-box;
|
|
font-size: 1.3rem;
|
|
|
|
.patient-info-header {
|
|
display: flex;
|
|
justify-content: space-between;
|
|
|
|
.patient-info-header-title {
|
|
font-size: 1rem;
|
|
font-weight: bold;
|
|
color: #000;
|
|
}
|
|
|
|
.patient-info-header-btn {}
|
|
}
|
|
|
|
.patient-info-body {
|
|
margin: 1rem 0;
|
|
// .ant-col{
|
|
// margin-bottom: 1rem;
|
|
// }
|
|
}
|
|
|
|
.patient-info-footer {
|
|
padding: 2rem 15%;
|
|
|
|
.ant-btn {
|
|
margin-top: 1rem;
|
|
}
|
|
}
|
|
}
|
|
}
|
|
|
|
|
|
}
|
|
</style>
|
|
|
|
<style lang="less">
|
|
.patient-detail {
|
|
.ant-card-body {
|
|
padding: 1rem;
|
|
}
|
|
|
|
.ant-form-item {
|
|
margin-bottom: .5rem;
|
|
|
|
.ant-form-item-label>label::after {
|
|
content: ':';
|
|
}
|
|
|
|
.ant-form-item-label {
|
|
label {
|
|
// font-size: 0.75rem;
|
|
}
|
|
|
|
}
|
|
|
|
.ant-input {
|
|
font-size: 1rem;
|
|
border: none;
|
|
background: #F5F5F5;
|
|
border-radius: .3rem;
|
|
|
|
.acitve {
|
|
border: none !important;
|
|
}
|
|
}
|
|
|
|
.ant-select {
|
|
|
|
.ant-select-selection,
|
|
.inputText {
|
|
background-color: #F5F5F5;
|
|
border: none;
|
|
|
|
.acitve {
|
|
border: none !important;
|
|
}
|
|
|
|
}
|
|
|
|
.ant-input:hover {
|
|
border: none
|
|
}
|
|
|
|
.ant-select-arrow {
|
|
position: absolute;
|
|
top: 36%;
|
|
|
|
svg {
|
|
font-size: 1rem;
|
|
color: #ccc;
|
|
}
|
|
}
|
|
}
|
|
|
|
.input-container {
|
|
background-color: #F5F5F5;
|
|
border: none;
|
|
}
|
|
|
|
.ant-switch {
|
|
height: 2.73vw;
|
|
width: 4.55vw;
|
|
color: #f5f5f5;
|
|
background-color: #f5f5f5;
|
|
}
|
|
|
|
.ant-switch::after {
|
|
width: 2.3vw;
|
|
height: 2.3vw;
|
|
top: 1.5px;
|
|
}
|
|
|
|
.ant-switch-checked {
|
|
background-color: #34C759;
|
|
}
|
|
}
|
|
|
|
.edititem {
|
|
font-size: 16px;
|
|
color: #000;
|
|
// font-weight: 600;
|
|
}
|
|
}
|
|
</style>
|