|
|
|
@ -3,15 +3,15 @@ |
|
|
|
<!-- 渲染试管架列表 --> |
|
|
|
<div class="tube-rack-list"> |
|
|
|
<div |
|
|
|
v-for="(tubeRack, index) in tubeRacks" |
|
|
|
v-for="(tubeRack, index) in testTubeStore.tubeRacks" |
|
|
|
:key="tubeRack.uuid" |
|
|
|
class="tube-rack-container" |
|
|
|
> |
|
|
|
<TestTubeRack |
|
|
|
<TestTubeRackComponent |
|
|
|
:tubeRack="tubeRack" |
|
|
|
:index="index" |
|
|
|
:projects="consumables.projectsAvailable" |
|
|
|
:bloodTypes="bloodTypes" |
|
|
|
:bloodTypes="settingTubeStore.bloodTypes" |
|
|
|
@delete:rack="deleteTubeRack" |
|
|
|
@active:rack="handleActivateChange" |
|
|
|
@patient:edit="handleChangeUser" |
|
|
|
@ -30,7 +30,10 @@ |
|
|
|
<section class="project-area"> |
|
|
|
<h2 class="title">项目选择</h2> |
|
|
|
<div class="project-list"> |
|
|
|
<div v-for="proj in consumables.projectsAvailable" :key="proj.projName"> |
|
|
|
<div |
|
|
|
v-for="proj in consumables.projectsAvailable" |
|
|
|
:key="proj.projName" |
|
|
|
> |
|
|
|
<div |
|
|
|
class="project-item" |
|
|
|
:class="{ active: isProjElemActive(proj) }" |
|
|
|
@ -39,7 +42,7 @@ |
|
|
|
> |
|
|
|
<span class="proj-name">{{ proj.projName }}</span> |
|
|
|
<span class="proj-num">{{ |
|
|
|
`${projIdCntMap[proj.projId] || 0}/${proj.num}` |
|
|
|
`${projIdCntMap[proj.projId || 1] || 0}/${proj.num}` |
|
|
|
}}</span> |
|
|
|
</div> |
|
|
|
</div> |
|
|
|
@ -48,7 +51,7 @@ |
|
|
|
<section class="blood-type-area"> |
|
|
|
<h2 class="title">血液类型</h2> |
|
|
|
<div class="blood-list"> |
|
|
|
<div v-for="type in bloodTypes" :key="type.key"> |
|
|
|
<div v-for="type in settingTubeStore.bloodTypes" :key="type.key"> |
|
|
|
<div |
|
|
|
class="blood-item" |
|
|
|
:class="{ active: selectedBloodTypeKey === type.key }" |
|
|
|
@ -74,67 +77,44 @@ |
|
|
|
</div> |
|
|
|
</template> |
|
|
|
|
|
|
|
<script setup> |
|
|
|
import { |
|
|
|
ref, |
|
|
|
onMounted, |
|
|
|
onBeforeUnmount, |
|
|
|
nextTick, |
|
|
|
computed, |
|
|
|
onActivated, |
|
|
|
} from 'vue' |
|
|
|
<script setup lang="ts"> |
|
|
|
import { ref, computed } from 'vue' |
|
|
|
import * as R from 'ramda' |
|
|
|
import { useRouter } from 'vue-router' |
|
|
|
import TestTubeRack from '../components/TestTube/TestTubeRack.vue' |
|
|
|
import TestTubeRackComponent from '../components/TestTube/TestTubeRack.vue' |
|
|
|
import { |
|
|
|
addTestTube, |
|
|
|
getTestTube, |
|
|
|
deleteTube, |
|
|
|
updateTubeConfig, |
|
|
|
getBloodTypes, |
|
|
|
updateTubeActivationStatus, |
|
|
|
} from '../../../services/Index/testTube' |
|
|
|
import { eventBus } from '../../../eventBus' |
|
|
|
|
|
|
|
import { |
|
|
|
useConsumablesStore, |
|
|
|
useTestTubeStore, |
|
|
|
useSettingTestTubeStore, |
|
|
|
} from '../../../store' |
|
|
|
import { ElMessage, ElDialog } from 'element-plus' |
|
|
|
import { ReactionPlateGroup, TestTubeRack } from '@/websocket/socket' |
|
|
|
|
|
|
|
const router = useRouter() |
|
|
|
|
|
|
|
const settingTubeStore = useSettingTestTubeStore() |
|
|
|
const testTubeStore = useTestTubeStore() |
|
|
|
|
|
|
|
const consumables = useConsumablesStore() |
|
|
|
|
|
|
|
const tubeRacks = ref([]) //<DataItem[]> |
|
|
|
const bloodTypes = ref([]) |
|
|
|
const loading = ref(false) // 控制加载状态 |
|
|
|
|
|
|
|
const selectedProjIds = ref([]) // number[] |
|
|
|
const selectedProjIds = ref<number[]>([]) |
|
|
|
const selectedBloodTypeKey = ref('WHOLE_BLOOD') |
|
|
|
|
|
|
|
const deleteRackDialogVisible = ref(false) |
|
|
|
|
|
|
|
const onTubeSettingUpdate = () => { |
|
|
|
getTubeData() |
|
|
|
const isProjElemActive = (proj: ReactionPlateGroup) => { |
|
|
|
return selectedProjIds.value.includes(proj.projId!) |
|
|
|
} |
|
|
|
|
|
|
|
onMounted(() => { |
|
|
|
eventBus.on('AppTubeSettingUpdateEvent', onTubeSettingUpdate) |
|
|
|
getTubeData() |
|
|
|
getBloodTypeData() |
|
|
|
}) |
|
|
|
onBeforeUnmount(() => { |
|
|
|
eventBus.off('AppTubeSettingUpdateEvent', onTubeSettingUpdate) |
|
|
|
}) |
|
|
|
|
|
|
|
const isProjElemActive = (proj) => { |
|
|
|
return selectedProjIds.value.includes(proj.projId) |
|
|
|
} |
|
|
|
|
|
|
|
const styleOfProjElem = (proj) => { |
|
|
|
const styleOfProjElem = (proj: ReactionPlateGroup) => { |
|
|
|
const active = isProjElemActive(proj) |
|
|
|
if (active) { |
|
|
|
return { |
|
|
|
@ -151,13 +131,13 @@ const styleOfProjElem = (proj) => { |
|
|
|
} |
|
|
|
} |
|
|
|
|
|
|
|
const clickProjectItem = (proj) => { |
|
|
|
if (selectedProjIds.value.includes(proj.projId)) { |
|
|
|
const clickProjectItem = (proj: ReactionPlateGroup) => { |
|
|
|
if (selectedProjIds.value.includes(proj.projId!)) { |
|
|
|
selectedProjIds.value = selectedProjIds.value.filter( |
|
|
|
(pId) => pId !== proj.projId, |
|
|
|
) |
|
|
|
} else { |
|
|
|
selectedProjIds.value = [...selectedProjIds.value, proj.projId].sort() |
|
|
|
selectedProjIds.value = [...selectedProjIds.value, proj.projId!].sort() |
|
|
|
} |
|
|
|
} |
|
|
|
|
|
|
|
@ -189,55 +169,13 @@ const projIdCntMap = computed(() => { |
|
|
|
return acc |
|
|
|
}, |
|
|
|
{}, |
|
|
|
tubeRacks.value, |
|
|
|
testTubeStore.tubeRacks, |
|
|
|
) |
|
|
|
}) |
|
|
|
|
|
|
|
const getBloodTypeData = async () => { |
|
|
|
loading.value = true |
|
|
|
const res = await getBloodTypes() |
|
|
|
loading.value = false |
|
|
|
|
|
|
|
if (res.success) { |
|
|
|
bloodTypes.value = res.data |
|
|
|
// console.log(res.data) |
|
|
|
} else { |
|
|
|
ElMessage({ |
|
|
|
message: '加载血液类型失败', |
|
|
|
type: 'error', |
|
|
|
duration: 2000, |
|
|
|
}) |
|
|
|
} |
|
|
|
} |
|
|
|
|
|
|
|
const mockData = (data) => { |
|
|
|
// if (data.length > 0) { |
|
|
|
// data[0].tubeSettings.splice(0, 2) |
|
|
|
// } |
|
|
|
return data |
|
|
|
} |
|
|
|
|
|
|
|
//获取已经配置的试管信息 |
|
|
|
const getTubeData = async () => { |
|
|
|
loading.value = true |
|
|
|
const res = await getTestTube() |
|
|
|
|
|
|
|
if (res.success) { |
|
|
|
tubeRacks.value = mockData(res.data) |
|
|
|
// console.log(tubeRacks.value) |
|
|
|
} else { |
|
|
|
ElMessage({ |
|
|
|
message: '加载试管架数据失败', |
|
|
|
type: 'error', |
|
|
|
duration: 2000, |
|
|
|
}) |
|
|
|
} |
|
|
|
loading.value = false |
|
|
|
} |
|
|
|
|
|
|
|
//编辑患者信息 |
|
|
|
const handleChangeUser = async (index) => { |
|
|
|
const rack = tubeRacks.value[index] |
|
|
|
const handleChangeUser = async (index: number) => { |
|
|
|
const rack = testTubeStore.tubeRacks[index] |
|
|
|
if (rack.state !== 'INACTIVE') { |
|
|
|
ElMessage({ |
|
|
|
message: '试管架处理激活状态，不可修改', |
|
|
|
@ -252,25 +190,21 @@ const handleChangeUser = async (index) => { |
|
|
|
}) |
|
|
|
} |
|
|
|
|
|
|
|
const existValidProject = (tubeRack) => { |
|
|
|
const existValidProject = (tubeRack: TestTubeRack) => { |
|
|
|
return tubeRack.tubeSettings.some( |
|
|
|
(s) => (s.projId || []).length > 0 && !!s.bloodType, |
|
|
|
) |
|
|
|
} |
|
|
|
|
|
|
|
let confirmDeleteRackUuid = null |
|
|
|
let confirmDeleteRackUuid: string | undefined = undefined |
|
|
|
const confirmDeleteTube = async () => { |
|
|
|
deleteRackDialogVisible.value = false |
|
|
|
const res = await deleteTube(confirmDeleteRackUuid) |
|
|
|
const res = await deleteTube(confirmDeleteRackUuid!) |
|
|
|
if (res.success) { |
|
|
|
tubeRacks.value = tubeRacks.value.filter( |
|
|
|
(v) => v.uuid !== confirmDeleteRackUuid, |
|
|
|
) |
|
|
|
ElMessage({ |
|
|
|
message: '删除成功', |
|
|
|
type: 'success', |
|
|
|
}) |
|
|
|
// getTubeData() |
|
|
|
} else { |
|
|
|
ElMessage({ |
|
|
|
message: '删除失败', |
|
|
|
@ -280,8 +214,8 @@ const confirmDeleteTube = async () => { |
|
|
|
} |
|
|
|
|
|
|
|
//删除试管架 |
|
|
|
const deleteTubeRack = async (idx) => { |
|
|
|
const rack = tubeRacks.value[idx] |
|
|
|
const deleteTubeRack = async (idx: number) => { |
|
|
|
const rack = testTubeStore.tubeRacks[idx] |
|
|
|
if (rack.state !== 'INACTIVE') { |
|
|
|
ElMessage({ |
|
|
|
message: '试管架处理激活状态，不可删除', |
|
|
|
@ -302,7 +236,7 @@ const addTubeRack = async () => { |
|
|
|
|
|
|
|
const response = await addTestTube() |
|
|
|
if (response && response.success) { |
|
|
|
tubeRacks.value = [...tubeRacks.value, response.data] |
|
|
|
// do nothing |
|
|
|
} else { |
|
|
|
ElMessage({ |
|
|
|
message: '试管架添加失败', |
|
|
|
@ -313,8 +247,8 @@ const addTubeRack = async () => { |
|
|
|
} |
|
|
|
|
|
|
|
// 处理试管架激活状态变化 |
|
|
|
const handleActivateChange = async (index) => { |
|
|
|
const rack = tubeRacks.value[index] |
|
|
|
const handleActivateChange = async (index: number) => { |
|
|
|
const rack = testTubeStore.tubeRacks[index] |
|
|
|
if (rack.state === 'LOCKED') { |
|
|
|
ElMessage({ |
|
|
|
message: '试管已锁定，不能修改', |
|
|
|
@ -332,12 +266,7 @@ const handleActivateChange = async (index) => { |
|
|
|
active: destState === 'ACTIVE', |
|
|
|
}) |
|
|
|
if (res.success) { |
|
|
|
tubeRacks.value = tubeRacks.value.map((rack, idx) => { |
|
|
|
if (idx === index) { |
|
|
|
rack.state = destState |
|
|
|
} |
|
|
|
return rack |
|
|
|
}) |
|
|
|
// do nothing |
|
|
|
} else { |
|
|
|
ElMessage({ |
|
|
|
message: '更改激活状态失败', |
|
|
|
@ -346,12 +275,12 @@ const handleActivateChange = async (index) => { |
|
|
|
} |
|
|
|
} |
|
|
|
|
|
|
|
const updateTubeSettings = async (rackIdx, tubeIdx) => { |
|
|
|
const updateTubeSettings = async (rackIdx:number, tubeIdx:number) => { |
|
|
|
if (!selectedBloodTypeKey.value) { |
|
|
|
ElMessage.error('请选择血液类型') |
|
|
|
return |
|
|
|
} |
|
|
|
const rack = tubeRacks.value[rackIdx] |
|
|
|
const rack = testTubeStore.tubeRacks[rackIdx] |
|
|
|
if (rack.state !== 'INACTIVE') { |
|
|
|
ElMessage({ |
|
|
|
message: '试管架已激活，不能修改', |
|
|
|
@ -372,17 +301,7 @@ const updateTubeSettings = async (rackIdx, tubeIdx) => { |
|
|
|
setting: [updSetting], |
|
|
|
}) |
|
|
|
if (response.success) { |
|
|
|
tubeRacks.value = tubeRacks.value.map((rack, idx) => { |
|
|
|
if (idx === rackIdx) { |
|
|
|
rack.tubeSettings = rack.tubeSettings.map((tube, index) => { |
|
|
|
if (index === tubeIdx) { |
|
|
|
return updSetting |
|
|
|
} |
|
|
|
return tube |
|
|
|
}) |
|
|
|
} |
|
|
|
return rack |
|
|
|
}) |
|
|
|
// do nothing |
|
|
|
} else { |
|
|
|
ElMessage.error('设置更新失败') |
|
|
|
} |
|
|
|
|
zhangjiming
7 months ago