Работа над журналом для ст. мед сестер
This commit is contained in:
204
resources/js/Pages/Nurse/Components/AddMedicalHistoryModal.vue
Normal file
204
resources/js/Pages/Nurse/Components/AddMedicalHistoryModal.vue
Normal file
@@ -0,0 +1,204 @@
|
||||
<script setup>
|
||||
import {NModal, NSteps, NStep, NTabs, NTabPane, NFlex, NGrid, NGi, NButton, NRadioGroup, NSelect, NInput, NFormItemGi, NDatePicker} from 'naive-ui'
|
||||
import {computed, ref, watch} from "vue";
|
||||
import AppRadio from "../../../Components/AppRadio.vue";
|
||||
import {useDebounceFn} from "@vueuse/core";
|
||||
import {format} from "date-fns";
|
||||
const show = defineModel('show', { default: false })
|
||||
|
||||
const currentStep = ref(1)
|
||||
const currentStatus = ref('process')
|
||||
const isFinallyStep = computed(() => currentStep.value === 2)
|
||||
const disableFillable = ref(false)
|
||||
|
||||
const form = ref({
|
||||
patient_source: 'mis',
|
||||
id: null,
|
||||
medical_card_number: null,
|
||||
full_name: '',
|
||||
urgency_id: 1,
|
||||
visit_result_id: 0,
|
||||
birth_date: null,
|
||||
recipient_date: new Date(),
|
||||
death_date: null,
|
||||
extract_date: null
|
||||
})
|
||||
|
||||
const resetForm = () => {
|
||||
form.value = {
|
||||
...form.value,
|
||||
id: null,
|
||||
medical_card_number: null,
|
||||
full_name: '',
|
||||
urgency_id: 1,
|
||||
visit_result_id: 0,
|
||||
birth_date: null,
|
||||
recipient_date: new Date(),
|
||||
death_date: null,
|
||||
extract_date: null
|
||||
}
|
||||
}
|
||||
|
||||
const urgencyOptions = [
|
||||
{
|
||||
label: '0 - Не определено',
|
||||
value: 0
|
||||
},
|
||||
{
|
||||
label: '1 - Планово',
|
||||
value: 1
|
||||
},
|
||||
{
|
||||
label: '2 - Экстренно',
|
||||
value: 2
|
||||
}
|
||||
]
|
||||
const visitResultOptions = [
|
||||
{
|
||||
label: '0 - Не определено',
|
||||
value: 0
|
||||
},
|
||||
{
|
||||
label: '1 - Выписан',
|
||||
value: 1
|
||||
}
|
||||
]
|
||||
|
||||
const prev = () => {
|
||||
if (currentStep.value === 0)
|
||||
currentStep.value = null
|
||||
else currentStep.value--
|
||||
}
|
||||
|
||||
const next = () => {
|
||||
if (currentStep.value === null)
|
||||
currentStep.value = 1
|
||||
else currentStep.value++
|
||||
}
|
||||
|
||||
const submit = () => {
|
||||
axios.post('/api/nurse/patients', {
|
||||
...form.value
|
||||
}).then(res => {
|
||||
console.log(res)
|
||||
})
|
||||
}
|
||||
|
||||
const searchOptions = ref([])
|
||||
|
||||
const debounceSearch = useDebounceFn((s) => {
|
||||
if (s.length === 0 || s.length === 1) return
|
||||
search(s)
|
||||
}, 1000)
|
||||
|
||||
const search = (search) => {
|
||||
axios.post('/api/nurse/patients/search', {
|
||||
search
|
||||
}).then(res => {
|
||||
searchOptions.value = res.data
|
||||
})
|
||||
}
|
||||
|
||||
const onChangeSearch = (historyId) => {
|
||||
axios.get(`/api/nurse/patients/${historyId}`).then(res => {
|
||||
form.value.medical_card_number = res.data.medical_card_number
|
||||
form.value.full_name = res.data.full_name
|
||||
form.value.urgency_id = res.data.urgency_id
|
||||
form.value.visit_result_id = res.data.visit_result_id
|
||||
|
||||
form.value.birth_date = res.data.birth_date ? format(new Date(res.data.birth_date), 'yyyy-MM-dd HH:mm:ss') : null
|
||||
form.value.death_date = res.data.death_date ? format(new Date(res.data.death_date), 'yyyy-MM-dd HH:mm:ss') : null
|
||||
form.value.extract_date = res.data.extract_date ? format(new Date(res.data.extract_date), 'yyyy-MM-dd HH:mm:ss') : null
|
||||
form.value.recipient_date = res.data.recipient_date ? format(new Date(res.data.recipient_date), 'yyyy-MM-dd HH:mm:ss') : null
|
||||
})
|
||||
}
|
||||
|
||||
watch(() => currentStep.value, (val) => {
|
||||
if (val === 1) resetForm()
|
||||
})
|
||||
</script>
|
||||
|
||||
<template>
|
||||
<NModal v-model:show="show"
|
||||
segmented
|
||||
preset="card"
|
||||
title="Добавление пациента"
|
||||
class="max-w-xl min-h-[500px]"
|
||||
draggable
|
||||
>
|
||||
<NSteps size="small" :current="currentStep" :status="currentStatus">
|
||||
<NStep title="Тип пациента" description="Укажите тип пациента" />
|
||||
<NStep title="Добавление пациента" description="Заполните базовую информацию" />
|
||||
</NSteps>
|
||||
<NTabs tab-class="hidden!" :value="currentStep">
|
||||
<NTabPane :name="1" class="mt-4">
|
||||
<NRadioGroup class="w-full space-y-2!" v-model:value="form.patient_source">
|
||||
<AppRadio title="МИС" value="mis" description="Выберите, если пациента можно найти в системе МИС" />
|
||||
<AppRadio title="Спец. контингент" value="special" description="Выберите, если пациента нет в системе МИС" />
|
||||
</NRadioGroup>
|
||||
</NTabPane>
|
||||
<NTabPane :name="2">
|
||||
<NGrid cols="2" x-gap="8">
|
||||
<NFormItemGi v-if="form.patient_source === 'mis'" span="2" label="Поиск пациента">
|
||||
<NSelect v-model:value="form.id"
|
||||
filterable
|
||||
placeholder="Найти пациента по ФИО"
|
||||
remote
|
||||
:options="searchOptions"
|
||||
@search="debounceSearch"
|
||||
@change="onChangeSearch"
|
||||
/>
|
||||
</NFormItemGi>
|
||||
<NFormItemGi span="2" label="ФИО">
|
||||
<NInput v-model:value="form.full_name" placeholder="Иванов Иван Иванович" />
|
||||
</NFormItemGi>
|
||||
<NFormItemGi span="2" label="№ карты">
|
||||
<NInput v-model:value="form.medical_card_number" />
|
||||
</NFormItemGi>
|
||||
|
||||
<NFormItemGi span="1" label="Срочность">
|
||||
<NSelect filterable v-model:value="form.urgency_id" :options="urgencyOptions" />
|
||||
</NFormItemGi>
|
||||
<NFormItemGi span="1" label="Исход госпитализации">
|
||||
<NSelect filterable v-model:value="form.visit_result_id" :options="visitResultOptions" />
|
||||
</NFormItemGi>
|
||||
<NFormItemGi span="1" label="Дата рождения">
|
||||
<NDatePicker v-model:value="form.birth_date" class="w-full" value-format="yyyy-MM-dd" />
|
||||
</NFormItemGi>
|
||||
<NFormItemGi span="1" label="Дата и время госпитализации">
|
||||
<NDatePicker v-model:value="form.recipient_date" type="datetime" class="w-full" value-format="yyyy-MM-dd HH:mm:ss" />
|
||||
</NFormItemGi>
|
||||
<NFormItemGi span="1" label="Дата и время выписки">
|
||||
<NDatePicker v-model:value="form.extract_date" type="datetime" class="w-full" value-format="yyyy-MM-dd HH:mm:ss" />
|
||||
</NFormItemGi>
|
||||
<NFormItemGi span="1" label="Дата и время смерти">
|
||||
<NDatePicker v-model:value="form.death_date" type="datetime" class="w-full" value-format="yyyy-MM-dd HH:mm:ss" />
|
||||
</NFormItemGi>
|
||||
</NGrid>
|
||||
</NTabPane>
|
||||
</NTabs>
|
||||
<template #action>
|
||||
<NGrid cols="2" justify="space-between">
|
||||
<NGi>
|
||||
<NButton v-if="currentStep > 1" secondary @click="prev">
|
||||
Назад
|
||||
</NButton>
|
||||
</NGi>
|
||||
<NGi>
|
||||
<NFlex justify="end">
|
||||
<NButton v-if="isFinallyStep" secondary type="primary" @click="submit">
|
||||
Добавить
|
||||
</NButton>
|
||||
<NButton v-else secondary type="primary" @click="next">
|
||||
Далее
|
||||
</NButton>
|
||||
</NFlex>
|
||||
</NGi>
|
||||
</NGrid>
|
||||
</template>
|
||||
</NModal>
|
||||
</template>
|
||||
|
||||
<style scoped>
|
||||
|
||||
</style>
|
||||
Reference in New Issue
Block a user