From a5d06bcaaf7761b594ee7425206e2732b05c5e16 Mon Sep 17 00:00:00 2001
From: chenyc <501753378@qq.com>
Date: 星期四, 16 一月 2025 15:02:07 +0800
Subject: [PATCH] gx生化显示
---
src/views/home/index.vue | 315 +++++++++++++++++++++++++++++++---------------------
1 files changed, 187 insertions(+), 128 deletions(-)
diff --git a/src/views/home/index.vue b/src/views/home/index.vue
index 628e315..98d4402 100644
--- a/src/views/home/index.vue
+++ b/src/views/home/index.vue
@@ -1,121 +1,148 @@
<template>
- <div class="home-container layout-pd ">
- <el-row :gutter="15" >
- <el-col :xs="8" :sm="6" :md="4" :lg="3" class="patTabel">
- <el-table :data="state.filterTableData"
- stripe
- :height="state.tableHeight.left"
- size="default"
- highlight-current-row
- @current-change="handleCurrentChange"
- style="width: 100%">
+ <div class="home-container layout-pd ">
+ <el-row :gutter="10">
+ <el-col class="patTabel" :xs="6" :sm="6" :md="4" :lg="3" :xl="3" v-if="state.isTable">
+ <el-table :data="state.filterTableData" stripe :height="state.tableHeight.left" size="default"
+ highlight-current-row @current-change="handleCurrentChange" style="width: 100%">
<el-table-column>
<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>
+ <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"/>
+ <el-input size="default" @change="getPatients" v-model="state.search" placeholder="支持模糊查询"
+ :prefix-icon="Search" />
</template>
<template #default="scope">
<el-row>
- <el-col :span="12">{{scope.row.patientName}}</el-col>
- <el-col :span="6">{{scope.row.patientGenderText}}</el-col>
- <el-col :span="6">{{scope.row.age}}</el-col>
+ <el-col :span="12">{{ scope.row.patientName }}</el-col>
+ <el-col :span="6">{{ scope.row.patientGenderText }}</el-col>
+ <el-col :span="6">{{ scope.row.age }}</el-col>
</el-row>
</template>
</el-table-column>
</el-table>
</el-col>
- <el-col :xs="14" :sm="18" :md="20" :lg="21" class="detailRight">
+ <el-col :xs="18" :sm="18" :md="20" :lg="21" :xl="21" >
<el-tabs v-model="state.activeName" class="demo-tabs" @tab-click="handleClick">
<el-tab-pane label="患者档案" name="患者档案">
<template #label>
<span class="custom-tabs-label home-title">
- <el-icon><Avatar /></el-icon>
+ <el-icon>
+ <Avatar />
+ </el-icon>
<span style="margin-left: 5px">患者档案</span>
</span>
</template>
- <patientFile :tableHeight="state.tableHeight.detailRight" ref="patientFileRef"></patientFile>
</el-tab-pane>
- <el-tab-pane label="生化数据" name="生化数据">
+
+ <!-- <el-tab-pane label="历史服务" name="历史服务">
<template #label>
<span class="custom-tabs-label home-title">
- <el-icon><Aim /></el-icon>
- <span style="margin-left: 5px">生化数据</span>
- </span>
- </template>
- <lisUi ref="lisUiRef"></lisUi>
- </el-tab-pane>
- <el-tab-pane label="用药记录" name="用药记录">
- <template #label>
- <span class="custom-tabs-label home-title">
- <el-icon><Edit /></el-icon>
- <span style="margin-left: 5px">用药记录</span>
- </span>
- </template>
- <MedicationRecords :tableHeight="state.tableHeight.detailRight" ref="MedicationRecordsRef"></MedicationRecords>
- </el-tab-pane>
- <el-tab-pane label="历史服务" name="历史服务">
- <template #label>
- <span class="custom-tabs-label home-title">
- <el-icon><ZoomIn /></el-icon>
+ <el-icon>
+ <ZoomIn />
+ </el-icon>
<span style="margin-left: 5px">历史服务</span>
</span>
</template>
- Task
+ <el-empty description="该功能未开发"></el-empty>
+ </el-tab-pane> -->
+ <el-tab-pane label="营养筛查评估" name="营养筛查评估">
+ <template #label>
+ <span class="custom-tabs-label home-title">
+ <el-icon>
+ <Histogram />
+ </el-icon>
+ <span style="margin-left: 5px">营养筛查评估</span>
+ </span>
+ </template>
+
</el-tab-pane>
<el-tab-pane label="膳食调查" name="膳食调查">
<template #label>
<span class="custom-tabs-label home-title">
- <el-icon><Notification /></el-icon>
+ <el-icon>
+ <Notification />
+ </el-icon>
<span style="margin-left: 5px">膳食调查</span>
</span>
</template>
- <dietarySurvey></dietarySurvey>
+
</el-tab-pane>
- <el-tab-pane label="营养筛查评估" name="营养筛查评估">
- <template #label>
- <span class="custom-tabs-label home-title">
- <el-icon><Histogram /></el-icon>
- <span style="margin-left: 5px">营养筛查评估</span>
- </span>
- </template>
- Task
- </el-tab-pane>
+
<el-tab-pane label="方案" name="方案">
<template #label>
<span class="custom-tabs-label home-title">
- <el-icon><Grid /></el-icon>
+ <el-icon>
+ <Grid />
+ </el-icon>
<span style="margin-left: 5px">方案</span>
</span>
</template>
- Task
+ <!-- <el-empty description="该功能未开发"></el-empty> -->
</el-tab-pane>
<el-tab-pane label="随访记录" name="随访记录">
<template #label>
<span class="custom-tabs-label home-title">
- <el-icon><ChatDotRound /></el-icon>
+ <el-icon>
+ <ChatDotRound />
+ </el-icon>
<span style="margin-left: 5px">随访记录</span>
</span>
</template>
- Task
+ <!-- <el-empty description="该功能未开发"></el-empty> -->
+ </el-tab-pane>
+ <el-tab-pane label="生化数据" name="生化数据">
+ <template #label>
+ <span class="custom-tabs-label home-title">
+ <el-icon>
+ <Aim />
+ </el-icon>
+ <span style="margin-left: 5px">生化数据</span>
+ </span>
+ </template>
+ </el-tab-pane>
+ <el-tab-pane label="用药记录" name="用药记录">
+ <template #label>
+ <span class="custom-tabs-label home-title">
+ <el-icon>
+ <Edit />
+ </el-icon>
+ <span style="margin-left: 5px">用药记录</span>
+ </span>
+ </template>
+
</el-tab-pane>
</el-tabs>
+ <div class="itemDoby">
+ <patientFile v-show="state.activeName === '患者档案'" :tableHeight="state.tableHeight.detailRight"
+ ref="patientFileRef" />
+ <lisUi v-show="state.activeName === '生化数据'" ref="lisUiRef">
+ </lisUi>
+ <MedicationRecords v-show="state.activeName === '用药记录'" :tableHeight="state.tableHeight.detailRight" ref="MedicationRecordsRef">
+ </MedicationRecords>
+ <dietarySurvey ref="dietarySurveyRef" v-show="state.activeName === '膳食调查'" :tableHeight="state.tableHeight.detailRight"></dietarySurvey>
+ <pinggubiao ref="pinggubiaoRef" v-show="state.activeName === '营养筛查评估'" :tableHeight="state.tableHeight.detailRight"></pinggubiao>
+ <fangAn ref="fangAnRef" v-show="state.activeName === '方案'" :tableHeight="state.tableHeight.detailRight"></fangAn>
+ <suifangjilu ref="suifangjiluRef" v-show="state.activeName === '随访记录'" :tableHeight="state.tableHeight.detailRight"></suifangjilu>
+
+ </div>
+
</el-col>
</el-row>
<div class="fixed-div" v-show="patientsInfo.patientName">
<el-avatar :size="80" :src="patientsInfo.patientAvatarIcon" />
- <div>{{patientsInfo.patientName}}</div>
-
+ <div @click="state.isTable = false">{{ patientsInfo.patientName }}</div>
</div>
- </div>
+ </div>
</template>
<script setup lang="ts" name="home">
import huanzheliebiao from '/@/assets/imgs/huanzheliebiao.png'
import { reactive, onMounted, ref, watch, nextTick, onActivated, markRaw } from 'vue';
-import {QueryList} from '/@/api/Patients'
+import { QueryList } from '/@/api/Patients'
import { storeToRefs } from 'pinia';
import { useUserInfo } from '/@/stores/userInfo';
import { usePatientsInfo } from '/@/stores/patientsInfo';
@@ -126,133 +153,156 @@
import { ElLoading, TabsPaneContext } from 'element-plus'
import { Search } from '@element-plus/icons-vue'
// 用药记录
-import MedicationRecords from './components/Medication_records.vue'
+import MedicationRecords from './components/Medication_records.vue'
// 膳食调查
import dietarySurvey from './components/dietary_survey.vue'
// 患者档案
import patientFile from './components/patient_file.vue'
// 化验结果
import lisUi from './components/lis_.ui.vue'
+// 评估表
+import pinggubiao from './components/pingubiao/index.vue'
+// 方案
+import fangAn from './components/fangAn/index.vue'
+// 随访记录
+import suifangjilu from './components/suifangjilu/index.vue'
interface User {
- code:string,
+ code: string,
patientName: string
patientGenderText: string
age: string
}
-const MedicationRecordsRef=ref()
-const patientFileRef=ref()
-const currentRow=ref()
-const lisUiRef=ref()
+const MedicationRecordsRef = ref()
+const patientFileRef = ref()
+const currentRow = ref()
+const lisUiRef = ref()
+const pinggubiaoRef=ref()
+const dietarySurveyRef=ref()// 膳食调查
+const fangAnRef=ref()
+const suifangjiluRef=ref()
const state = reactive({
- global: {
- homeChartOne: null,
- homeChartTwo: null,
- homeCharThree: null,
- dispose: [null, '', undefined],
- } as any,
- filterTableData:[],
- activeName:'患者档案',
- tableHeight:{
- left:0,
- detailRight:0
+ global: {
+ homeChartOne: null,
+ homeChartTwo: null,
+ homeCharThree: null,
+ dispose: [null, '', undefined],
+ } as any,
+ filterTableData: [],
+ activeName: '患者档案',
+ tableHeight: {
+ left: 0,
+ detailRight: 0
},
- search:''
+ search: '',
+ isTable: true,
});
-onMounted(()=>{
+onMounted(() => {
setTableHeight()
getPatients()
})
const handleCurrentChange = (val: any | undefined) => {
- console.log('-----------------333')
- console.log(val)
- if(val){
+ if (val) {
currentRow.value = val
//缓存到vuex 中
storesPat.setPatientsInfo(val)
+ console.log(val)
getTabsData()
}
}
/**获取患者列表 */
-const getPatients=()=>{
+const getPatients = () => {
const loading = ElLoading.service({
lock: true,
text: 'Loading',
background: 'rgba(0, 0, 0, 0.7)',
})
- var ps= {
+ var ps = {
page: 0,
size: 0,
- wherecondition:`client_code="${userInfos.value.clientCode}" and (patient_name like "%${state.search.toLowerCase()}%"
+ 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: ''
+ id: '',
+ code: '',
+ age: 0,
+ patientName: '',
+ patientGenderText: '',
+ patientAvatarIcon: '',
+ clientCode:''
+
})
- QueryList(ps).then(res=>{
+ QueryList(ps).then(res => {
console.log('----------------患者--------')
console.log(res.data)
- state.filterTableData=res.data.list
- }).finally(()=>{
+ state.filterTableData = res.data.list
+ }).finally(() => {
loading.close()
})
}
/**设置高度 */
const setTableHeight = () => {
- let height = document.documentElement.clientHeight;
+ let height = document.documentElement.clientHeight;
console.log('窗口高度')
- const navDom = document.querySelector('.layout-navbars-breadcrumb-index');
- if (navDom) {
- height -= navDom.scrollHeight;
- }
- state.tableHeight.detailRight=height
- state.tableHeight.left = height-77;
- // const demoFormDom = document.querySelector('.card_box_search')
+ const navDom = document.querySelector('.layout-navbars-breadcrumb-index');
+ if (navDom) {
+ height -= navDom.scrollHeight;
+ }
+ state.tableHeight.detailRight = height
+ state.tableHeight.left = height - 77;
+ // const demoFormDom = document.querySelector('.card_box_search')
};
/** 切换明细tabs*/
-const handleClick=(tab: TabsPaneContext, event: Event)=>{
- alert('1')
- state.activeName=tab.paneName as string
+const handleClick = (tab: TabsPaneContext, event: Event) => {
+ state.activeName = tab.paneName as string
getTabsData()
}
/** 获取明细项数据 */
-const getTabsData=()=>{
- if(MedicationRecordsRef.value&&patientsInfo.value.id){
- if(state.activeName==='用药记录'){
+const getTabsData = () => {
+ if (patientsInfo.value.id) {
+ if (state.activeName === '用药记录') {
MedicationRecordsRef.value.getData()
- }else if(state.activeName==='患者档案'){
- console.log(patientFileRef.value)
+ } else if (state.activeName === '患者档案') {
patientFileRef.value.getData()
+ } else if(state.activeName === '膳食调查'){
+ dietarySurveyRef.value.getData()
+
+ }else if(state.activeName === '营养筛查评估'){
+ pinggubiaoRef.value.getData()
+
+ }else if(state.activeName==='方案'){
+ fangAnRef.value.getData()
+ }else if(state.activeName==='随访记录'){
+ suifangjiluRef.value.getData()
}
-
}
}
</script>
-<style lang="scss">
+<style lang="scss">
$homeNavLengh: 8;
+
.home-container {
- overflow: hidden;
- .patTabel{
+ overflow: hidden;
+
+ .patTabel {
.el-table th.el-table__cell {
- background-color: #6babfa;
- color:#606266;
+ background-color: #6babfa;
+ color: #ffffff;
}
- .el-table__body tr.current-row>td.el-table__cell{
- background: #E4F6DE;
- color: #5FCD00;
+
+ .el-table__body tr.current-row>td.el-table__cell {
+ background: rgb(197.7, 225.9, 255);
+ color: #409EFF;
/* height: 25px; */
/* border: tomato solid 1px; */
- }
+ }
}
-
+
}
-.patTitle{
+
+.patTitle {
height: 25px;
font-family: AlibabaPuHuiTi, AlibabaPuHuiTi;
font-weight: 500;
@@ -264,15 +314,22 @@
font-style: normal;
// margin-top: -10px;
}
-.home-title{
+
+.home-title {
margin-bottom: 4px;
flex: 1;
height: inherit;
display: flex;
align-items: center;
}
-.detailRight{
+
+.detailRight {
+ margin-left: 10px;
background-color: #ffffff;
+}
+.itemDoby{
+ width: 100%; /* 设置容器宽度 */
+ overflow-x: auto; /* 横向内容溢出时显示滚动条 */
}
.fixed-div {
position: fixed;
@@ -283,17 +340,19 @@
right: 30px;
width: 200px;
height: 100px;
- background-color:#ffffff;
color: rgb(16, 3, 3);
padding: 10px;
z-index: 999;
-
- div{
+
+ div {
font-weight: 800;
margin-left: 10px;
font-size: 20px;
}
- }
+}
+.parent {
+ display: grid;
+ grid-template-columns: minmax(150px, 20%) 1fr;
+}
</style>
-
--
Gitblit v1.8.0