<div class="container">
<!-- 校验 -->
<div class="alertDialog" v-if="dialog">
<el-alert
:title="errorText"
type="error"
show-icon>
</el-alert>
</div>
<div class="alertDialog" v-else></div>
<AsseScore :paramesItem="paramesItem" :totalArr="totalArr" @reset="reset" @getinput="getinput" @change="change" />
</div>
</template>
<script setup>
import AsseScore from "../com/AsseScore/index.vue"
import {
ref,
onMounted,
computed
} from 'vue';
// 弹框
const errorText = ref('')
const dialog = ref(false);
const colorFn = ref(['#d9d9d9', 'green', 'yellow', 'red']);
const getinput = ({id,value}) => {
let reg = /^\d{1,3}$/;
if (id == '2') {
reg = /^([1-9]\d{0,2}|0)(\.\d{1,2})?$/;
}
if(!reg.test(value)) return;
const index = paramesItem.value.findIndex((item) => item.id === id);
const obj = paramesItem.value[index];
const {max,min} = obj;
console.log(max,min,value);
if(value < min/1 || value > max/1) {
dialog.value = true;
errorText.value = `请输入${min}-${max}的值`;
setTimeout(() => {
dialog.value = false;
},2000)
}else {
dialog.value = false;
}
}
// 评分项数据
const paramesItem = ref([{
id: 1,
paramsName: 'RR(rpm)',
placeholder: '0~150',
type: 'input',
value: '',
score: '',
color: '',
leixing: 'number',
max: '150',
min: '0',
},
{
id: 2,
paramsName: 'Temp(°F)',
placeholder: '32.2~122.0',
type: 'input',
value: '',
score: '',
color: '',
leixing: 'number',
max: '122.0',
min: '32.2'
},
{
id: 3,
paramsName: 'BP-S(mmHg)',
placeholder: '40~270',
type: 'input',
value: '',
score: '',
color: '',
leixing: 'number',
max: '270',
min: '40'
},
{
id: 4,
paramsName: 'HR(bpm)',
placeholder: '20~300',
type: 'input',
value: '',
score: '',
color: '',
leixing: 'number',
max: '300',
min: '20'
},
{
id: 5,
paramsName: '意识(AVPU)',
type: 'select',
value: '',
score: '',
color: '',
selections: [{
name: '清醒',
id: '1'
},
{
name: '对声音有反应',
id: '2'
},
{
name: '对疼痛有反应',
id: '3'
},
{
name: '无反应',
id: '4'
},
]
},
]);
// 总分数据
const totalArr = ref([{
area: [1, 3],
color: 'green',
advice: [{
id: 1,
content: 'xxx'
}, {
id: 2,
content: 'xxx'
}, {
id: 3,
content: 'xxx'
}]
},
{
area: [4, 6],
color: 'yellow',
advice: [{
id: 1,
content: 'xxx'
}, {
id: 2,
content: 'xxx'
}, {
id: 3,
content: 'xxx'
}]
},
{
area: [7, 14],
color: 'red',
advice: [{
id: 1,
content: 'xxx'
}, {
id: 2,
content: 'xxx'
}, {
id: 3,
content: 'xxx'
}]
}
])
const change = ({id, value, totalScore}) => {
// 已经计算过的情况下, 输入框变化，则清空其他值，否则正常输入
if (totalScore) {
paramesItem.value.forEach((item, index) => {
// 清空
item.value = '';
item.score = '';
item.color = '';
})
}
// 添加分数(实际情况后端写)
const index = paramesItem.value.findIndex((item) => item.id === id);
const obj = paramesItem.value[index]
paramesItem.value[index].value = value;
paramesItem.value[index].score = parseScore(obj.paramsName, obj.value);
paramesItem.value[index].color = colorFn.value[paramesItem.value[index].score];
console.log(paramesItem.value[index]);
};
const isComputed = ref(false)
// 重置
const reset = () => {
paramesItem.value.forEach(item => {
item.value = '';
item.score = '';
item.color = '';
});
};
// 计算分数，后端处理
const parseScore = (type, value) => {
/*
* 真实场景：掉接口(举例)
api.xx({type,value}).then(res => {
return res.score
})
*/
/*
* 假数据
*/
// RR
const arr1 = [{
area: [0, 8],
score: '2'
},
{
area: [9, 14],
score: '0'
},
{
area: [15, 20],
score: '1'
},
{
area: [21, 29],
score: '2'
},
{
area: [30, 150],
score: '3'
},
];
// Temp
const arr2 = [{
area: [32.2, 34],
score: '2'
},
{
area: [35, 38.4],
score: '0'
},
{
area: [38.5, 122.0],
score: '2'
},
];
// BP-S(mmHg)
const arr3 = [{
area: [40, 70],
score: '3'
},
{
area: [71, 80],
score: '2'
},
{
area: [81, 100],
score: '1'
},
{
area: [101, 199],
score: '0'
},
{
area: [200, 270],
score: '2'
},
];
// HR(bpm)
const arr4 = [{
area: [20, 40],
score: '2'
},
{
area: [41, 50],
score: '1'
},
{
area: [51, 100],
score: '0'
},
{
area: [101, 110],
score: '1'
},
{
area: [111, 129],
score: '2'
},
{
area: [130, 300],
score: '3'
},
];
// 意识(AVPU)
const arr5 = [{
text: '',
score: ''
},
{
text: '清醒',
score: '0'
},
{
text: '对声音有反应',
score: '1'
},
{
text: '对疼痛有反应',
score: '2'
},
{
text: '无反应',
score: '3'
},
]
const typeObj = {
'RR(rpm)': arr1,
'Temp(°F)': arr2,
'BP-S(mmHg)': arr3,
'HR(bpm)': arr4,
'意识(AVPU)': arr5
}
// select
if (type == '意识(AVPU)') {
const index = typeObj[type].findIndex(item => item.text == value);
return typeObj[type][index].score
}
// input
const num = Number(value);
const arr = typeObj[type];
for (let i = 0; i < arr.length; i++) {
if (num <= arr[i].area[1] && num >= arr[i].area[0]) {
if(value != ''){
return arr[i].score;
}
}
}
}
</script>
<style lang="less" scoped>
.alertDialog{
height: 34px;
}
</style>
