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.
520 lines
12 KiB
520 lines
12 KiB
5 months ago
|
<template>
|
||
|
|
<div class="throm-befor1">
|
||
|
|
<a-form class="medical-form" :form="form" layout="vertical">
|
||
|
|
<a-form-item class="jmrs-form-item pt" v-for="(k, v) in recordDict" :key="v" >
|
||
|
|
<div class="jmrs-form-item-con" :class="k.type">
|
||
|
|
<div class="ant-form-item-label">
|
||
|
|
<label :for="`${v}`">
|
||
|
|
{{ `${k.text}` }}
|
||
|
|
<span class="label-info" v-if="k.description">
|
||
|
|
{{ k.description }}
|
||
|
|
</span>
|
||
|
|
<a-tooltip placement="top">
|
||
|
|
<template slot="title">
|
||
|
|
<div v-for="(k, v) in k.labelList" :key="k">
|
||
|
|
{{ `${k}` }}
|
||
|
|
</div>
|
||
|
|
</template>
|
||
|
|
<a-icon
|
||
|
|
v-if="k.labelList"
|
||
|
|
class="item-icon"
|
||
|
|
type="question-circle"
|
||
|
|
/>
|
||
|
|
</a-tooltip>
|
||
|
|
</label>
|
||
|
|
</div>
|
||
|
|
<div class="">
|
||
|
|
<!-- slider -->
|
||
|
|
<div class="common-slider" v-if="k.type === 'slider'">
|
||
|
|
<van-stepper
|
||
|
|
:disabled="writeAble"
|
||
|
|
:integer="true"
|
||
|
|
v-model="k.value"
|
||
|
|
step="10"
|
||
|
|
class="ten"
|
||
|
|
theme="round"
|
||
|
|
/>
|
||
|
|
<van-stepper
|
||
|
|
:disabled="writeAble"
|
||
|
|
:integer="true"
|
||
|
|
v-model="k.value"
|
||
|
|
step="5"
|
||
|
|
class="five"
|
||
|
|
theme="round"
|
||
|
|
/>
|
||
|
|
<van-stepper
|
||
|
|
:disabled="writeAble"
|
||
|
|
:integer="true"
|
||
|
|
v-model="k.value"
|
||
|
|
step="1"
|
||
|
|
class="one"
|
||
|
|
theme="round"
|
||
|
|
/>
|
||
|
|
<van-slider
|
||
|
|
:disabled="writeAble"
|
||
|
|
class="common-slider-slider"
|
||
|
|
:min="0"
|
||
|
|
:max="300"
|
||
|
|
step="10"
|
||
|
|
v-model="k.value"
|
||
|
|
>
|
||
|
|
<template #button>
|
||
|
|
<a-input-number
|
||
|
|
:disabled="writeAble"
|
||
|
|
type="number"
|
||
|
|
id="inputNumber"
|
||
|
|
v-model="k.value"
|
||
|
|
:min="0"
|
||
|
|
:max="300"
|
||
|
|
/>
|
||
|
|
<a-icon
|
||
|
|
class="slider-icon"
|
||
|
|
type="caret-down"
|
||
|
|
/>
|
||
|
|
<div class="inner-circle"></div>
|
||
|
|
</template>
|
||
|
|
</van-slider>
|
||
|
|
</div>
|
||
|
|
<!-- radio
|
||
|
|
v-decorator="[v, { initialValue: k.default }]"-->
|
||
|
|
<div class="mrsitem">
|
||
|
|
<a-radio-group
|
||
|
|
:disabled="writeAble"
|
||
|
|
size="large"
|
||
|
|
v-if="k.type === 'radio'"
|
||
|
|
v-model="k.value"
|
||
|
|
button-style="solid"
|
||
|
|
@change="changeRadio($event, v)"
|
||
|
|
>
|
||
|
|
<a-radio-button
|
||
|
|
:disabled="writeAble"
|
||
|
|
v-for="(item, index) in k.range"
|
||
|
|
:key="item"
|
||
|
|
:value="item"
|
||
|
|
>
|
||
|
|
{{ item }}
|
||
|
|
</a-radio-button>
|
||
|
|
</a-radio-group>
|
||
|
|
</div>
|
||
|
|
<div class="niss-list" v-if="k.type === 'pageText' && false">
|
||
|
|
<div class="niss-list-item">
|
||
|
|
<div class="item-name">
|
||
|
|
<span class="item-info">得分</span>
|
||
|
|
</div>
|
||
|
|
<a-input-number
|
||
|
|
:type="k.inputType"
|
||
|
|
:min="0"
|
||
|
|
:max="100"
|
||
|
|
style="width: 20%; margin-left: 20px"
|
||
|
|
v-decorator="[v]"
|
||
|
|
/>
|
||
|
|
</div>
|
||
|
|
<div
|
||
|
|
class="niss-list-item"
|
||
|
|
v-for="(item, index) in k.range"
|
||
|
|
:key="item.text"
|
||
|
|
>
|
||
|
|
<div class="item-name">
|
||
|
|
<span class="item-info">{{
|
||
|
|
item.text
|
||
|
|
}}</span>
|
||
|
|
<a-tooltip placement="top">
|
||
|
|
<template slot="title">
|
||
|
|
{{ item.description }}
|
||
|
|
</template>
|
||
|
|
<a-icon
|
||
|
|
v-if="item.description"
|
||
|
|
class="item-icon"
|
||
|
|
type="question-circle"
|
||
|
|
/>
|
||
|
|
</a-tooltip>
|
||
|
|
</div>
|
||
|
|
<a-popover
|
||
|
|
v-model="item.visible"
|
||
|
|
placement="bottom"
|
||
|
|
>
|
||
|
|
<template slot="content" v-if="item.range">
|
||
|
|
<a-radio-group
|
||
|
|
:disabled="writeAble"
|
||
|
|
v-model="nissValue"
|
||
|
|
button-style="solid"
|
||
|
|
@change="changeRangeRadio(item, v)"
|
||
|
|
>
|
||
|
|
<a-radio-button
|
||
|
|
v-for="(
|
||
|
|
val, index
|
||
|
|
) in item.range"
|
||
|
|
:key="val.value"
|
||
|
|
:value="val.value"
|
||
|
|
@click="item.visible = false"
|
||
|
|
>
|
||
|
|
{{ val.value }}
|
||
|
|
</a-radio-button>
|
||
|
|
</a-radio-group>
|
||
|
|
</template>
|
||
|
|
<a-input-number
|
||
|
|
:disabled="writeAble"
|
||
|
|
ref="inputNumber"
|
||
|
|
class="noControls"
|
||
|
|
@focus="focusInput(index)"
|
||
|
|
@click="changeInput($event, item)"
|
||
|
|
style="width: 20%; margin-left: 20px"
|
||
|
|
v-model="item.value"
|
||
|
|
:min="0"
|
||
|
|
:max="10"
|
||
|
|
/>
|
||
|
|
</a-popover>
|
||
|
|
</div>
|
||
|
|
</div>
|
||
|
|
</div>
|
||
|
|
</div>
|
||
|
|
</a-form-item>
|
||
|
|
</a-form>
|
||
|
|
<div class="btns">
|
||
|
|
<a-button :disabled="writeAble" class="common-button" block type="primary" size="large" @click="onSubmit">下一步</a-button>
|
||
|
|
</div>
|
||
|
|
</div>
|
||
|
|
</template>
|
||
|
|
|
||
|
|
<script>
|
||
|
|
import { mapMutations, mapState } from 'vuex';
|
||
|
|
import {
|
||
|
|
EMERGENCY_CODE,
|
||
|
|
EMERGENCY_Q_CODE,
|
||
|
|
EMERGENCY_15_CODE,
|
||
|
|
EMERGENCY_30_CODE,
|
||
|
|
EMERGENCY_45_CODE,
|
||
|
|
EMERGENCY_60_CODE,
|
||
|
|
NIHSS_LIST,
|
||
|
|
} from '@/config/code.js';
|
||
|
|
export default {
|
||
|
|
name: 'Emergency',
|
||
|
|
data() {
|
||
|
|
return {
|
||
|
|
NIHSS_LIST,
|
||
|
|
nissValue: '',
|
||
|
|
form: this.$form.createForm(this, {
|
||
|
|
name: 'Emergency',
|
||
|
|
}),
|
||
|
|
codeForm: {
|
||
|
|
'RYPG-SYSTOLIC-PRESSURE': '',
|
||
|
|
'RYPG-DIASTOLIC-PRESSURE': '',
|
||
|
|
'RYPG-MRS': '',
|
||
|
|
'RYPG-NIHSS': '',
|
||
|
|
},
|
||
|
|
codeFormData: {
|
||
|
|
'JMRS-Q-NIHSS': {
|
||
|
|
'JMRS-Q-NIHSS': '',
|
||
|
|
'JMRS-Q-DIASTOLIC-PRESSURE': '',
|
||
|
|
'JMRS-Q-SYSTOLIC-PRESSURE': '',
|
||
|
|
},
|
||
|
|
'JMRS-15-NIHSS': {
|
||
|
|
'JMRS-15-NIHSS': '',
|
||
|
|
'JMRS-15-SYSTOLIC-PRESSURE': '',
|
||
|
|
'JMRS-15-DIASTOLIC-PRESSURE': '',
|
||
|
|
},
|
||
|
|
'JMRS-30-NIHSS': {
|
||
|
|
'JMRS-30-NIHSS': '',
|
||
|
|
'JMRS-30-SYSTOLIC-PRESSURE': '',
|
||
|
|
'JMRS-30-DIASTOLIC-PRESSURE': '',
|
||
|
|
},
|
||
|
|
'JMRS-45-NIHSS': {
|
||
|
|
'JMRS-45-NIHSS': '',
|
||
|
|
'JMRS-45-SYSTOLIC-PRESSURE': '',
|
||
|
|
'JMRS-45-DIASTOLIC-PRESSURE': '',
|
||
|
|
},
|
||
|
|
'JMRS-60-NIHSS': {
|
||
|
|
'JMRS-60-NIHSS': '',
|
||
|
|
'JMRS-60-SYSTOLIC-PRESSURE': '',
|
||
|
|
'JMRS-60-DIASTOLIC-PRESSURE': '',
|
||
|
|
},
|
||
|
|
},
|
||
|
|
EMERGENCY_CODE,
|
||
|
|
recordDict: EMERGENCY_CODE,
|
||
|
|
dataForm: {
|
||
|
|
'JMRS-Q-NIHSS': EMERGENCY_Q_CODE,
|
||
|
|
'JMRS-15-NIHSS': EMERGENCY_15_CODE,
|
||
|
|
'JMRS-30-NIHSS': EMERGENCY_30_CODE,
|
||
|
|
'JMRS-45-NIHSS': EMERGENCY_45_CODE,
|
||
|
|
'JMRS-60-NIHSS': EMERGENCY_60_CODE,
|
||
|
|
},
|
||
|
|
};
|
||
|
|
},
|
||
|
|
components: {},
|
||
|
|
computed: {
|
||
|
|
...mapState('patient', ['patientData', 'timerData', 'writeAble']),
|
||
|
|
},
|
||
|
|
mounted() {
|
||
|
|
console.log(this.timerData)
|
||
|
|
const { code } = this.timerData;
|
||
|
|
if (code) {
|
||
|
|
this.recordDict = this.dataForm[`${code}`];
|
||
|
|
}else{
|
||
|
|
this.recordDict = EMERGENCY_CODE;
|
||
|
|
}
|
||
|
|
|
||
|
|
const { recordValDict } = this.patientData;
|
||
|
|
if (recordValDict) {
|
||
|
|
this.$nextTick(() => {
|
||
|
|
this.echo(recordValDict);
|
||
|
|
});
|
||
|
|
}
|
||
|
|
},
|
||
|
|
methods: {
|
||
|
|
...mapMutations('patient', ['setPatientData']),
|
||
|
|
echo(data) {
|
||
|
|
const { code } = this.timerData;
|
||
|
|
const wangbadan = code
|
||
|
|
? this.codeFormData[`${code}`]
|
||
|
|
: this.codeForm;
|
||
|
|
for (let k in wangbadan) {
|
||
|
|
if (data[k]) {
|
||
|
|
const { answer } = data[k][0];
|
||
|
|
this.form.getFieldDecorator([`${k}`], {
|
||
|
|
preserve: true, //即便字段不再使用，也保留该字段的值
|
||
|
|
});
|
||
|
|
this.form.setFieldsValue({
|
||
|
|
[`${k}`]: answer.toString(),
|
||
|
|
});
|
||
|
|
let value = this.recordDict[k];
|
||
|
|
if (value && value.value) {
|
||
|
|
value.value = Number(answer.toString());
|
||
|
|
}
|
||
|
|
}
|
||
|
|
}
|
||
|
|
},
|
||
|
|
focusInput(index) {
|
||
|
|
this.$refs.inputNumber[index].readOnly = true;
|
||
|
|
this.$refs.inputNumber[index].blur();
|
||
|
|
},
|
||
|
|
changeInput(value, item) {
|
||
|
|
item.visible = false;
|
||
|
|
item.value = value;
|
||
|
|
this.nissValue = '';
|
||
|
|
},
|
||
|
|
changeRangeRadio(item, code) {
|
||
|
|
const text = item.text;
|
||
|
|
let score = 0;
|
||
|
|
let NIHSS_LIST = [].concat(this.NIHSS_LIST);
|
||
|
|
NIHSS_LIST.forEach((item, index) => {
|
||
|
|
if (item.text === text) {
|
||
|
|
item.value = this.nissValue;
|
||
|
|
}
|
||
|
|
if (item.value) {
|
||
|
|
score += item.value;
|
||
|
|
}
|
||
|
|
});
|
||
|
|
this.form.getFieldDecorator([`${code}`], {
|
||
|
|
preserve: true, //即便字段不再使用，也保留该字段的值
|
||
|
|
});
|
||
|
|
this.form.setFieldsValue({
|
||
|
|
[`${code}`]: score,
|
||
|
|
});
|
||
|
|
item.visible = false;
|
||
|
|
},
|
||
|
|
changeRadio(e, v) {
|
||
|
|
this.codeForm[v] = e.target.value;
|
||
|
|
},
|
||
|
|
computeShow(code, codeForm) {
|
||
|
|
return this.utils.computeShow(code, codeForm);
|
||
|
|
},
|
||
|
|
async onSubmit(e) {
|
||
|
|
e.preventDefault();
|
||
|
|
this.form.validateFields(async (err, values) => {
|
||
|
|
// if (err) return
|
||
|
|
const { firstAidId } = this.patientData;
|
||
|
|
let codeAndAnswerList = [];
|
||
|
|
const { recordDict } = this;
|
||
|
|
const codes = [
|
||
|
|
// 'RYPG-MRS',
|
||
|
|
'RYPG-NIHSS',
|
||
|
|
'JMRS-Q-NIHSS',
|
||
|
|
'JMRS-15-NIHSS',
|
||
|
|
'JMRS-30-NIHSS',
|
||
|
|
'JMRS-45-NIHSS',
|
||
|
|
'JMRS-60-NIHSS',
|
||
|
|
];
|
||
|
|
const codesEm = ['RYPG-MRS', 'RYPG-NIHSS'];
|
||
|
|
const codesQ = [
|
||
|
|
'JMRS-Q-NIHSS',
|
||
|
|
'JMRS-15-NIHSS',
|
||
|
|
'JMRS-30-NIHSS',
|
||
|
|
'JMRS-45-NIHSS',
|
||
|
|
'JMRS-60-NIHSS',
|
||
|
|
];
|
||
|
|
for (let k in recordDict) {
|
||
|
|
if (
|
||
|
|
recordDict[k].value !== 'undefined' &&
|
||
|
|
recordDict[k].value !== 'null'
|
||
|
|
) {
|
||
|
|
if (!codes.includes(k)) {
|
||
|
|
codeAndAnswerList.push({
|
||
|
|
questionCode: k,
|
||
|
|
answer: [recordDict[k].value],
|
||
|
|
time: '',
|
||
|
|
});
|
||
|
|
}
|
||
|
|
}
|
||
|
|
}
|
||
|
|
for (let k in values) {
|
||
|
|
if (
|
||
|
|
this.$route.name === 'Emergency' &&
|
||
|
|
codesEm.includes(k) &&
|
||
|
|
values[k] !== 'undefined' &&
|
||
|
|
values[k] !== 'null'
|
||
|
|
) {
|
||
|
|
codeAndAnswerList.push({
|
||
|
|
questionCode: k,
|
||
|
|
answer: [values[k]],
|
||
|
|
time: '',
|
||
|
|
});
|
||
|
|
} else if (
|
||
|
|
this.$route.name === 'Min' &&
|
||
|
|
codesQ.includes(k) &&
|
||
|
|
values[k] !== 'undefined' &&
|
||
|
|
values[k] !== 'null'
|
||
|
|
) {
|
||
|
|
codeAndAnswerList.push({
|
||
|
|
questionCode: k,
|
||
|
|
answer: [values[k]],
|
||
|
|
time: '',
|
||
|
|
});
|
||
|
|
}
|
||
|
|
}
|
||
|
|
this.home.updateAidCode({
|
||
|
|
codeAndAnswerList,
|
||
|
|
}, false);
|
||
|
|
|
||
|
|
this.$emit('next')
|
||
|
|
});
|
||
|
|
},
|
||
|
|
},
|
||
|
|
beforeDestroy() {
|
||
|
|
console.log('beforeDestroy')
|
||
|
|
NIHSS_LIST.forEach((item, index) => {
|
||
|
|
item.value = null;
|
||
|
|
});
|
||
|
|
this.NIHSS_LIST = NIHSS_LIST;
|
||
|
|
},
|
||
|
|
};
|
||
|
|
</script>
|
||
|
|
|
||
|
|
<style scoped lang="less">
|
||
|
|
.throm-befor1 {
|
||
|
|
// padding: 1rem;
|
||
|
|
flex: 1;
|
||
|
|
display: flex;
|
||
|
|
flex-direction: column;
|
||
|
|
|
||
|
|
// .noControls {
|
||
|
|
// /deep/ .ant-input-number-handler-wrap {
|
||
|
|
// display: none;
|
||
|
|
// }
|
||
|
|
// }
|
||
|
|
|
||
|
|
// .patient-form {
|
||
|
|
// flex: 1;
|
||
|
|
// overflow-y: auto;
|
||
|
|
|
||
|
|
// .pt {
|
||
|
|
// padding-top: 36px;
|
||
|
|
// }
|
||
|
|
|
||
|
|
// .content-left {
|
||
|
|
// width: 30%;
|
||
|
|
|
||
|
|
// label {
|
||
|
|
// display: flex;
|
||
|
|
// align-items: center;
|
||
|
|
// }
|
||
|
|
// }
|
||
|
|
|
||
|
|
// .content-right {
|
||
|
|
// flex: 1;
|
||
|
|
// }
|
||
|
|
// }
|
||
|
|
|
||
|
|
// .xy-wrapper {
|
||
|
|
// display: flex;
|
||
|
|
// justify-content: space-between;
|
||
|
|
// align-items: center;
|
||
|
|
// padding-bottom: 20px;
|
||
|
|
|
||
|
|
// .xy-label {
|
||
|
|
// font-size: 26px;
|
||
|
|
// font-family: Source Han Sans CN, Source Han Sans CN-Medium;
|
||
|
|
// font-weight: 500;
|
||
|
|
// text-align: left;
|
||
|
|
// color: #565e6f;
|
||
|
|
// }
|
||
|
|
// }
|
||
|
|
|
||
|
|
.niss-list {
|
||
|
|
display: flex;
|
||
|
|
flex-wrap: wrap;
|
||
|
|
justify-content: space-between;
|
||
|
|
.niss-list-item {
|
||
|
|
width: 45%;
|
||
|
|
display: flex;
|
||
|
|
justify-content: space-between;
|
||
|
|
|
||
|
|
.item-name {
|
||
|
|
display: flex;
|
||
|
|
align-items: center;
|
||
|
|
justify-content: space-between;
|
||
|
|
flex: 1;
|
||
|
|
}
|
||
|
|
|
||
|
|
.item-info {
|
||
|
|
flex: 1;
|
||
|
|
font-size: 1rem;
|
||
|
|
font-family: Source Han Sans CN, Source Han Sans CN-Bold;
|
||
|
|
font-weight: 600;
|
||
|
|
text-align: left;
|
||
|
|
color: #565e6f;
|
||
|
|
}
|
||
|
|
}
|
||
|
|
}
|
||
|
|
|
||
|
|
.item-icon {
|
||
|
|
width: 25px;
|
||
|
|
font-size: 22px;
|
||
|
|
color: #007AFF;
|
||
|
|
}
|
||
|
|
|
||
|
|
}
|
||
|
|
// .common-slider-slider{
|
||
|
|
// background: linear-gradient(#007AFF, #52A5FF);
|
||
|
|
// }
|
||
|
|
// .common-slider .common-slider-slider .slider-icon{
|
||
|
|
// color: #007AFF;
|
||
|
|
// // position: relative;
|
||
|
|
// // left: -0.64vw;
|
||
|
|
// // top: -3.6vw;
|
||
|
|
|
||
|
|
// }
|
||
|
|
</style>
|
||
|
|
|
||
|
|
<style lang="less">
|
||
|
|
.throm-befor1{
|
||
|
|
.ant-form .ant-form-item{
|
||
|
|
margin-bottom: 1.5rem;
|
||
|
|
}
|
||
|
|
.ant-form .ant-form-item {
|
||
|
|
border: none;
|
||
|
|
}
|
||
|
|
}
|
||
|
|
.mrsitem{
|
||
|
|
text-align:center;
|
||
|
|
}
|
||
|
|
// .common-slider .common-slider-slider .ant-input-number .ant-input-number-input {
|
||
|
|
// text-align: center;
|
||
|
|
// font-size: 2vw;
|
||
|
|
// }
|
||
|
|
// .common-slider .common-slider-slider .van-slider__button-wrapper {
|
||
|
|
// background: #fff;
|
||
|
|
// // border: 0.6vw solid #007AFF;
|
||
|
|
// // width: 2.5vw;
|
||
|
|
// // height: 2.5vw;
|
||
|
|
// }
|
||
|
|
</style>
|