From 7b5531fccfc16406e303c337526424e40d960f1a Mon Sep 17 00:00:00 2001
From: chenyc <501753378@qq.com>
Date: 星期二, 20 八月 2024 20:39:33 +0800
Subject: [PATCH] 更新首页
---
src/stores/patientsInfo.ts | 24 +++
src/views/home/index.vue | 103 +++++++++---
src/views/home/components/patient_file.vue | 86 ++++++++++
src/types/pinia.d.ts | 15 +
src/views/home/components/Medication_records.vue | 97 ++++++++++++
src/views/home/components/dietary_survey.vue | 127 +++++++++++++++
src/api/Patients/index.ts | 15 +
src/views/login/component/account.vue | 2
src/api/doctors_orders/index.ts | 9 +
9 files changed, 449 insertions(+), 29 deletions(-)
diff --git a/src/api/Patients/index.ts b/src/api/Patients/index.ts
index b5df8c4..5b55b1a 100644
--- a/src/api/Patients/index.ts
+++ b/src/api/Patients/index.ts
@@ -14,4 +14,17 @@
},
params
});
-}
\ No newline at end of file
+}
+
+
+export function getPatData(params: object) {
+ return request({
+ url: '/nutrition/getPatData',
+ method: 'post',
+ headers: {
+ 'Content-Type': 'application/x-www-form-urlencoded'
+ },
+ params
+ });
+}
+
diff --git a/src/api/doctors_orders/index.ts b/src/api/doctors_orders/index.ts
new file mode 100644
index 0000000..6c8441d
--- /dev/null
+++ b/src/api/doctors_orders/index.ts
@@ -0,0 +1,9 @@
+import request from "/@/utils/request";
+/** 临时医嘱 */
+export function patientDrugList3(params: object) {
+ return request({
+ url: '/patient/drug/order/vs/patient/list3',
+ method: 'post',
+ data:params
+ })
+}
\ No newline at end of file
diff --git a/src/stores/patientsInfo.ts b/src/stores/patientsInfo.ts
new file mode 100644
index 0000000..b36a8ab
--- /dev/null
+++ b/src/stores/patientsInfo.ts
@@ -0,0 +1,24 @@
+import { defineStore } from 'pinia';
+
+/**
+ * 选择患者缓存到临时
+ * @methods setPatientsInfo 设置选择患者缓存
+ */
+export const usePatientsInfo = defineStore('PatientsInfo', {
+ state: (): patientsInfoState => ({
+ patientsInfo:{
+ id: '',
+ code: '',
+ age: 0,
+ patientName: '',
+ patientGenderText: '',
+ patientAvatarIcon: ''
+ }
+ }),
+ actions: {
+ /**设置患者缓存 */
+ async setPatientsInfo(routes:patientsInfo) {
+ this.patientsInfo = routes;
+ },
+ },
+});
diff --git a/src/types/pinia.d.ts b/src/types/pinia.d.ts
index 806a210..5a056bc 100644
--- a/src/types/pinia.d.ts
+++ b/src/types/pinia.d.ts
@@ -17,6 +17,21 @@
userInfos: UserInfos;
}
+// 患者信息
+declare interface patientsInfo<T=any>{
+ id:string,
+ code:string,
+ age:number,
+ patientName:string,
+ patientGenderText:string,
+ //头像
+ patientAvatarIcon:string,
+ [key: string]: T;
+}
+declare interface patientsInfoState {
+ patientsInfo: patientsInfo;
+}
+
// 路由缓存列表
declare interface KeepAliveNamesState {
keepAliveNames: string[];
diff --git a/src/views/home/components/Medication_records.vue b/src/views/home/components/Medication_records.vue
new file mode 100644
index 0000000..086f7b7
--- /dev/null
+++ b/src/views/home/components/Medication_records.vue
@@ -0,0 +1,97 @@
+<template>
+ <div>
+ <div v-if="patientsInfo.id">
+ <!-- <div> <el-button type="primary" @click="getData">刷新</el-button></div> -->
+ <el-table size="default" :data="state.tableData" stripe style="width: 100%" v-loading="state.loading" :height="tableHe">
+ <el-table-column fixed label="NO" type="index" widtd="80" >
+ <template #header>
+ <el-icon @click="getData"><RefreshRight /></el-icon>
+ </template>
+
+ </el-table-column>
+ <el-table-column prop="执行时间" label="用药时间" show-overflow-tooltip />
+ <el-table-column prop="drugName" :width="300" label="医嘱名称" show-overflow-tooltip >
+ <template #default="scope">
+ <el-tooltip placement="bottom">
+ <template #content> {{scope.row.isPushEveryTime===1?'每次都推送':scope.row.pushCondition}} </template>
+ <span :style="{color:scope.row.orderIsPush===true?'#67C23A': (scope.row.stopDoctor ? 'red' : '')}"> {{scope.row.drugName}}</span>
+ </el-tooltip>
+
+ </template>
+ </el-table-column>
+ <el-table-column :width="140" label="规格" show-overflow-tooltip>
+ <template #default="scope">
+ <span >
+ {{scope.row.drugSpec}}
+ </span>
+ </template>
+ </el-table-column>
+ <el-table-column prop="drugOrderInfo.orderUsage" label="单次用量" show-overflow-tooltip >
+ <template #default="scope">
+ <span v-if="scope.row.orderUsage!==0">
+ {{scope.row.orderUsage}}
+ {{scope.row.drugUnit}}
+ </span>
+
+ </template>
+ </el-table-column>
+ <el-table-column prop="drugFrom" label="给药途径" show-overflow-tooltip >
+
+ </el-table-column>
+ <el-table-column prop="orderFreq" label="执行频率" show-overflow-tooltip >
+
+ </el-table-column>
+ <el-table-column prop="orderDoctor" label="开嘱医生" >
+
+ </el-table-column>
+ </el-table>
+ </div>
+ <el-empty v-else description="无数据，请先选择患者"></el-empty>
+ </div>
+
+</template>
+
+<script setup lang="ts">
+import { storeToRefs } from 'pinia';
+import { usePatientsInfo } from '/@/stores/patientsInfo';
+import {patientDrugList3} from '/@/api/doctors_orders'
+import { computed, reactive } from 'vue';
+const storesPat = usePatientsInfo();
+const { patientsInfo } = storeToRefs(storesPat);
+const props = defineProps(['tableHeight'])
+const state = reactive({
+ tableData:[],
+ loading:false,
+})
+const tableHe=computed(()=>{
+ return props.tableHeight-130
+})
+// 第一步：定义子组件里面的方法
+const getData = (str: string) => {
+ console.log("子组件获取显示数据！" + str);
+ console.log(props.tableHeight)
+ var pam={
+ patientCode:patientsInfo.value.code,
+ page: 1,
+ size: 100,
+ orderType:1,
+ orderIsUse:2,
+ desc:1,
+ orderName:'',
+ }
+ state.loading=true
+ patientDrugList3(pam).then(re=>{
+ console.log(re)
+ state.tableData=re.data
+
+ }).finally(()=>{
+ state.loading=false
+ })
+}
+
+// 第二步：暴露方法
+defineExpose({ getData })
+</script>
+
+<style scoped>
+</style>
diff --git a/src/views/home/components/dietary_survey.vue b/src/views/home/components/dietary_survey.vue
new file mode 100644
index 0000000..98fbadf
--- /dev/null
+++ b/src/views/home/components/dietary_survey.vue
@@ -0,0 +1,127 @@
+<template>
+ <div class="dietarySurvey-home">
+ <div v-if="patientsInfo.id">
+ <table class="gridtable">
+ <tr>
+ <th colspan="4">膳食调查表</th>
+ <th>初次调查日期</th>
+ <th></th>
+ </tr>
+ <tr>
+ <th colspan="4"></th>
+ <th>更新日期</th>
+ <th></th>
+ </tr>
+ <tr>
+ <th colspan="4"></th>
+ <th>记录者</th>
+ <th></th>
+ </tr>
+ <tr>
+ <td>
+ 1.人员构成
+ </td>
+ <td>
+ 独居
+ </td>
+ <td>
+ （ ）人
+ </td>
+ <td>
+ 家族
+ </td>
+ <td colspan="2">
+ （ ）
+ </td>
+
+ </tr>
+ <tr>
+ <td>
+ 2.烹饪主要操作者
+ </td>
+ <td>
+ 本人
+ </td>
+ <td>
+ 配偶
+ </td>
+ <td>
+ 其他
+ </td>
+ <td colspan="2">
+ （ ）
+ </td>
+
+ </tr>
+ <tr>
+ <td>
+ 3.食材采购
+ </td>
+ <td>
+ 外采
+ </td>
+ <td>
+ 家种
+ </td>
+ <td>
+
+ </td>
+ <td colspan="2">
+
+ </td>
+
+ </tr>
+ </table>
+
+ </div>
+ <el-empty v-else description="无数据，请先选择患者"></el-empty>
+ </div>
+
+</template>
+
+<script setup lang="ts">
+import { storeToRefs } from 'pinia';
+import { usePatientsInfo } from '/@/stores/patientsInfo';
+import { computed, reactive } from 'vue';
+const storesPat = usePatientsInfo();
+const { patientsInfo } = storeToRefs(storesPat);
+const props = defineProps(['tableHeight'])
+const state = reactive({
+ tableData: [],
+ loading: false,
+})
+const tableHe = computed(() => {
+ return props.tableHeight - 130
+})
+// 第一步：定义子组件里面的方法
+const getData = (str: string) => {
+ console.log("子组件获取显示数据！" + str);
+ console.log(props.tableHeight)
+ var pam = {
+ patientCode: patientsInfo.value.code,
+ page: 1,
+ size: 100,
+ orderType: 1,
+ orderIsUse: 2,
+ desc: 1,
+ orderName: '',
+ }
+ state.loading = true
+
+}
+
+// 第二步：暴露方法
+defineExpose({ getData })
+</script>
+
+<style lang="scss">
+
+
+ .gridtable {font-family: verdana,arial,sans-serif;font-size:11px;color:#333333;border-width: 1px;border-color: #666666;border-collapse: collapse;width: 100%;}
+
+ .gridtable th {border-width: 1px;padding: 8px;border-style: solid;border-color: #666666;background-color: #dedede;}
+
+ .gridtable td {border-width: 1px;padding: 8px;border-style: solid;border-color: #666666;background-color: #ffffff;}
+
+
+</style>
diff --git a/src/views/home/components/patient_file.vue b/src/views/home/components/patient_file.vue
new file mode 100644
index 0000000..1275017
--- /dev/null
+++ b/src/views/home/components/patient_file.vue
@@ -0,0 +1,86 @@
+<template>
+ <div class="dietarySurvey-home">
+ <div v-if="patientsInfo.id">
+ <el-card class="box-card">
+ <div class="clearfix">
+ <span>患者基本信息</span>
+ </div>
+ <div>
+ <table class="gridtable">
+ <tr>
+ <td>姓名：{{patientsInfo.patientName}}</td>
+ <td>年龄：{{patientsInfo.age}}</td>
+ <td>性别：{{patientsInfo.patientGenderText}}</td>
+ <td>身高：{{patientsInfo.patientHeight}}</td>
+ <td>干体重：{{state.patientData.干体重}}</td>
+
+ </tr>
+ <tr>
+ <td>透析龄：{{patientsInfo.dialysisAge}}</td>
+
+
+ <td colspan="4">患者诊断：{{state.patientData.诊断}}</td>
+ </tr>
+ <tr>
+ <td >电话号码：{{patientsInfo.mobile}}</td>
+ <td colspan="2">家庭地址：{{patientsInfo.patientAddress}}</td>
+ <td colspan="2">证件号：{{patientsInfo.patientIdentityNo}}</td>
+ </tr>
+ </table>
+
+ </div>
+ </el-card>
+
+ </div>
+ <el-empty v-else description="无数据，请先选择患者"></el-empty>
+ </div>
+
+</template>
+
+<script setup lang="ts">
+import { storeToRefs } from 'pinia';
+import { usePatientsInfo } from '/@/stores/patientsInfo';
+import { computed, reactive } from 'vue';
+import { getPatData } from '/@/api/Patients';
+const storesPat = usePatientsInfo();
+const { patientsInfo } = storeToRefs(storesPat);
+const props = defineProps(['tableHeight'])
+const state = reactive({
+ tableData: [],
+ loading: false,
+ patientData:{
+ 姓名:'',
+ 干体重:'',
+ 证件号:"",
+ 诊断:'',
+ 身高:''
+ }
+})
+const tableHe = computed(() => {
+ return props.tableHeight - 130
+})
+// 第一步：定义子组件里面的方法
+const getData = (str: string) => {
+ console.log("患者档案子组件获取显示数据！" + str);
+ console.log(props.tableHeight)
+ var pam = {
+ patCode: patientsInfo.value.code,
+ }
+ state.loading = true
+ getPatData(pam).then(re=>{
+ console.log(re.data)
+ state.patientData=re.data
+ })
+}
+
+// 第二步：暴露方法
+defineExpose({ getData })
+</script>
+
+<style lang="scss">
+ .gridtable {font-family: verdana,arial,sans-serif;font-size:11px;color:#333333;border-width: 1px;border-color: #666666;border-collapse: collapse;width: 100%;}
+
+.gridtable th {border-width: 1px;padding: 8px;border-style: solid;border-color: #666666;background-color: #dedede;}
+
+.gridtable td {border-width: 1px;padding: 8px;border-style: solid;border-color: #666666;background-color: #ffffff;}
+</style>
diff --git a/src/views/home/index.vue b/src/views/home/index.vue
index 3c14bf2..fd3aa45 100644
--- a/src/views/home/index.vue
+++ b/src/views/home/index.vue
@@ -1,7 +1,7 @@
<template>
<div class="home-container layout-pd ">
<el-row :gutter="15" >
- <el-col :span="4" class="patTabel">
+ <el-col :xs="8" :sm="6" :md="4" :lg="3" class="patTabel">
<el-table :data="state.filterTableData"
stripe
:height="state.tableHeight.left"
@@ -13,7 +13,6 @@
<template #header>
<div class="home-title">
<el-avatar shape="square" style="width: 16px; height: 16px;background-color: #ffffff;margin-right: 10px;margin-left: 10px;" fit="contain" :src="huanzheliebiao" />
-
<div class="titleHome">患者列表</div>
</div>
<el-input size="default" @change="getPatients" v-model="state.search" placeholder="支持模糊查询" :prefix-icon="Search"/>
@@ -28,7 +27,7 @@
</el-table-column>
</el-table>
</el-col>
- <el-col :span="20" class="detailRight">
+ <el-col :xs="14" :sm="18" :md="20" :lg="21" class="detailRight">
<el-tabs v-model="state.activeName" class="demo-tabs" @tab-click="handleClick">
<el-tab-pane label="患者档案" name="患者档案">
<template #label>
@@ -37,7 +36,7 @@
<span style="margin-left: 5px">患者档案</span>
</span>
</template>
- 患者档案
+ <patientFile :tableHeight="state.tableHeight.detailRight" ref="patientFileRef"></patientFile>
</el-tab-pane>
<el-tab-pane label="生化数据" name="生化数据">
<template #label>
@@ -55,7 +54,7 @@
<span style="margin-left: 5px">用药记录</span>
</span>
</template>
- Role
+ <MedicationRecords :tableHeight="state.tableHeight.detailRight" ref="MedicationRecordsRef"></MedicationRecords>
</el-tab-pane>
<el-tab-pane label="历史服务" name="历史服务">
<template #label>
@@ -73,7 +72,7 @@
<span style="margin-left: 5px">膳食调查</span>
</span>
</template>
- Task
+ <dietarySurvey></dietarySurvey>
</el-tab-pane>
<el-tab-pane label="营养筛查评估" name="营养筛查评估">
<template #label>
@@ -105,6 +104,11 @@
</el-tabs>
</el-col>
</el-row>
+ <div class="fixed-div" v-show="patientsInfo.patientName">
+ <el-avatar :size="80" :src="patientsInfo.patientAvatarIcon" />
+ <div>{{patientsInfo.patientName}}</div>
+
+ </div>
</div>
</template>
@@ -114,16 +118,27 @@
import {QueryList} from '/@/api/Patients'
import { storeToRefs } from 'pinia';
import { useUserInfo } from '/@/stores/userInfo';
+import { usePatientsInfo } from '/@/stores/patientsInfo';
const stores = useUserInfo();
+const storesPat = usePatientsInfo();
const { userInfos } = storeToRefs(stores);
+const { patientsInfo } = storeToRefs(storesPat);
import { ElLoading, TabsPaneContext } from 'element-plus'
import { Search } from '@element-plus/icons-vue'
+// 用药记录
+import MedicationRecords from './components/Medication_records.vue'
+// 膳食调查
+import dietarySurvey from './components/dietary_survey.vue'
+// 患者档案
+import patientFile from './components/patient_file.vue'
interface User {
code:string,
patientName: string
patientGenderText: string
age: string
}
+const MedicationRecordsRef=ref()
+const patientFileRef=ref()
const currentRow=ref()
const state = reactive({
global: {
@@ -132,23 +147,7 @@
homeCharThree: null,
dispose: [null, '', undefined],
} as any,
- filterTableData:[
- {
- name: '张山',
- sex: '男',
- age: '12',
- },
- {
- name: '张山二',
- sex: '男',
- age: '12',
- },
- {
- name: '王二小',
- sex: '男',
- age: '12',
- },
- ],
+ filterTableData:[],
activeName:'患者档案',
tableHeight:{
left:0,
@@ -160,9 +159,17 @@
setTableHeight()
getPatients()
})
-const handleCurrentChange = (val: User | undefined) => {
- currentRow.value = val
+const handleCurrentChange = (val: any | undefined) => {
+ console.log('-----------------333')
+ console.log(val)
+ if(val){
+ currentRow.value = val
+ //缓存到vuex 中
+ storesPat.setPatientsInfo(val)
+ getTabsData()
+ }
}
+/**获取患者列表 */
const getPatients=()=>{
const loading = ElLoading.service({
lock: true,
@@ -175,11 +182,19 @@
wherecondition:`client_code="${userInfos.value.clientCode}" and (patient_name like "%${state.search.toLowerCase()}%"
OR patient_name_py like "%${state.search.toLowerCase()}%")`
}
+ storesPat.setPatientsInfo({
+ id: '',
+ code: '',
+ age: 0,
+ patientName: '',
+ patientGenderText: '',
+ patientAvatarIcon: ''
+ })
QueryList(ps).then(res=>{
console.log('----------------患者--------')
console.log(res.data)
state.filterTableData=res.data.list
- }).finally(e=>{
+ }).finally(()=>{
loading.close()
})
}
@@ -198,7 +213,21 @@
};
/** 切换明细tabs*/
const handleClick=(tab: TabsPaneContext, event: Event)=>{
- console.log(tab, event)
+ alert('1')
+ state.activeName=tab.paneName as string
+ getTabsData()
+}
+/** 获取明细项数据 */
+const getTabsData=()=>{
+ if(MedicationRecordsRef.value&&patientsInfo.value.id){
+ if(state.activeName==='用药记录'){
+ MedicationRecordsRef.value.getData()
+ }else if(state.activeName==='患者档案'){
+ console.log(patientFileRef.value)
+ patientFileRef.value.getData()
+ }
+
+ }
}
</script>
@@ -242,6 +271,26 @@
.detailRight{
background-color: #ffffff;
}
+.fixed-div {
+ position: fixed;
+ flex: 1;
+ display: flex;
+ align-items: center;
+ bottom: 10px;
+ right: 30px;
+ width: 200px;
+ height: 100px;
+ background-color:#ffffff;
+ color: rgb(16, 3, 3);
+ padding: 10px;
+ z-index: 999;
+
+ div{
+ font-weight: 800;
+ margin-left: 10px;
+ font-size: 20px;
+ }
+ }
</style>
diff --git a/src/views/login/component/account.vue b/src/views/login/component/account.vue
index 03b0338..5fc48b0 100644
--- a/src/views/login/component/account.vue
+++ b/src/views/login/component/account.vue
@@ -80,7 +80,7 @@
const state = reactive({
isShowPassword: false,
ruleForm: {
- userName: 'admin',
+ userName: 'cycems',
password: '123456',
code: '1234',
},
--
Gitblit v1.8.0