更新患者档案

chenyc

2024-08-21 59ba223820054f296191f581bd413f5b9cff9e7f

更新患者档案

 package-lock.json

@@ -15,6 +15,7 @@
                "axios": "^1.6.8",
                "countup.js": "^2.8.0",
                "cropperjs": "^1.6.1",
                "dayjs": "^1.11.13",
                "echarts": "^5.5.0",
                "echarts-gl": "^2.0.9",
                "echarts-wordcloud": "^2.1.0",
@@ -2008,9 +2009,9 @@
            }
        },
        "node_modules/dayjs": {
            "version": "1.11.7",
            "resolved": "https://registry.npmjs.org/dayjs/-/dayjs-1.11.7.tgz",
            "integrity": "sha512-+Yw9U6YO5TQohxLcIkrXBeY73WP3ejHWVvx8XCk3gxvQDCTEmS48ZrSZCKciI7Bhl/uCMyxYtE9UqRILmFphkQ=="
            "version": "1.11.13",
            "resolved": "https://registry.npmmirror.com/dayjs/-/dayjs-1.11.13.tgz",
            "integrity": "sha512-oaMBel6gjolK862uaPQOVTA7q3TZhuSvuMQAAglQDOWYO9A91IrAOUJEyKVlqJlHE0vq5p5UXxzdPfMH/x6xNg=="
        },
        "node_modules/debug": {
            "version": "4.3.4",
@@ -5617,9 +5618,9 @@
            }
        },
        "dayjs": {
            "version": "1.11.7",
            "resolved": "https://registry.npmjs.org/dayjs/-/dayjs-1.11.7.tgz",
            "integrity": "sha512-+Yw9U6YO5TQohxLcIkrXBeY73WP3ejHWVvx8XCk3gxvQDCTEmS48ZrSZCKciI7Bhl/uCMyxYtE9UqRILmFphkQ=="
            "version": "1.11.13",
            "resolved": "https://registry.npmmirror.com/dayjs/-/dayjs-1.11.13.tgz",
            "integrity": "sha512-oaMBel6gjolK862uaPQOVTA7q3TZhuSvuMQAAglQDOWYO9A91IrAOUJEyKVlqJlHE0vq5p5UXxzdPfMH/x6xNg=="
        },
        "debug": {
            "version": "4.3.4",

 package.json

@@ -16,6 +16,7 @@
        "axios": "^1.6.8",
        "countup.js": "^2.8.0",
        "cropperjs": "^1.6.1",
        "dayjs": "^1.11.13",
        "echarts": "^5.5.0",
        "echarts-gl": "^2.0.9",
        "echarts-wordcloud": "^2.1.0",

 src/api/Patients/index.ts

@@ -27,4 +27,19 @@
        params
    });
}
/**
 * 
 * @param params 
 * @returns 患者检验结果
 */
export function getLisResults(params: object) {
    return request({
        url: '/nutrition/getLisResults',
        method: 'post',
        headers: {
            'Content-Type': 'application/x-www-form-urlencoded'
            },
        params
    });
}


 src/views/home/components/lis_.ui.vue

New file
@@ -0,0 +1,91 @@
<template>
    <div class="dietarySurvey-home">
        <div v-if="patientsInfo.id">
           <div class="lisview">
            <div class="child">
                1的撒啊啊啊啊啊啊啊啊啊啊啊啊啊啊啊啊啊
            </div>
            <div class="child">
                1
            </div>
            <div class="child">
                大水水水水水水水水水水水水水水
            </div>
            <div class="child">
                1
            </div>
            <div class="child">
                1
            </div>
            <div class="child">
                1
            </div>
            <div class="child">
                1
            </div>
            <div class="child">
                1
            </div>
            <div class="child">
                大水水水水水水水水水水水水水水水水水水
            </div>
            <div class="child">
                34222222222222222222222222222222222222222222222222222222222反倒是水水水水水水水水水水水水水水水水十大啊啊啊啊啊啊啊啊啊啊啊啊啊啊啊啊啊
            </div>
           </div>
        </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">

.lisview{
    display: flex; /* 使用Flexbox布局 */
    flex-wrap: wrap;
    .child {
        margin: 5px; /* 为了清楚地展示间隔 */
        padding: 10px;
        border: 1px solid #000;
    }
}
    


</style>

 src/views/home/components/patient_file.vue

@@ -1,33 +1,78 @@
<template>
    <div class="dietarySurvey-home">
        <div v-if="patientsInfo.id">
        <div v-if="patientsInfo.id" v-loading="state.loading">
            <el-card class="box-card">
                <div  class="clearfix">
                    <span>患者基本信息</span> 
                    <el-icon size="16" color="#409efc"><Briefcase /></el-icon>  <span> &nbsp; 服务套餐</span> 
                </div>
                <div>
                   基础服务100套餐
                   膳食套餐，
                   体检套餐，
                </div>
            </el-card>
            <el-card class="box-card" style="margin-top:10px;">
                <div  class="clearfix" >
                    <el-icon size="16" color="#409efc"><CreditCard /></el-icon>  <span> &nbsp; 患者基本信息</span> 
                </div>
                <div>
                    <table class="gridtable">
                        <tr>
                            <td>姓名：{{patientsInfo.patientName}}</td>
                            <td>年龄：{{patientsInfo.age}}</td>
                            <td>年龄：<span v-if="patientsInfo.age">{{patientsInfo.age}}  岁</span></td>
                            <td>性别：{{patientsInfo.patientGenderText}}</td>
                            <td>身高：{{patientsInfo.patientHeight}}</td>
                            <td>干体重：{{state.patientData.干体重}}</td>
                            <td>干体重:<span v-if="state.patientData.干体重">{{state.patientData.干体重}} (kg)</span></td>
                            
                        </tr>
                        <tr>
                            <td>透析龄：{{patientsInfo.dialysisAge}}</td>
                            <td>透析龄：<span v-if="patientsInfo.medHistoryStatByMonth">{{patientsInfo.medHistoryStatByMonth}} (月)</span></td>
                          
                            <td colspan="4">证件号：{{patientsInfo.patientIdentityNo}}</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>
                            <td >电话号码：{{patientsInfo.patientTelNo}}</td>
                            <td >家属电话：{{patientsInfo.patientTelNoRelative}}</td>
                            <td colspan="3">家庭地址：{{patientsInfo.patientAddress}}</td>
                            
                        </tr>
                        <tr>
                            <td colspan="5">患者诊断：{{state.patientData.诊断}}</td>
                        </tr>
                    </table>
                </div>
            </el-card>
            <el-card class="box-card" style="margin-top:10px;">
                <div  class="clearfix" >
                    <el-icon size="16" color="#409efc"><CreditCard /></el-icon>  <span> &nbsp; 最新生化数据</span> 
                </div>
                <div >
                    <el-row :gutter="10" v-if="state.listData.lis">
                  
                        <div v-for="(item, key) in state.listData.lis" :key="key">
                            <div class="itemLis" v-if="item?.结果列表.length>0" >
                                <div class="title">
                                    {{key}}
                                </div>
                                <div  class="itemRes" v-for="(itemRes, resIndex) in item?.结果列表" :key="resIndex">
                                    <div  class="itemResDtile" v-for="(tdKey, ttIndex) in formatResKeys(itemRes)" :key="ttIndex" >
                                       <div>
                                        {{ itemRes[tdKey].name }}
                                       </div>
                                       <div>
                                        {{ itemRes[tdKey].result }}<span class="tdate">{{itemRes[tdKey].unit}}</span>
                                       </div>
                                    </div>
                                </div>
                                <div  class="tdate" >
                                    {{item?.结果列表[0]?.标本日期}}
                                </div>
                               
                            </div>
                          
                        </div>
                    </el-row>
                </div>
            </el-card>
            
@@ -40,10 +85,16 @@
<script setup lang="ts">
import { storeToRefs } from 'pinia';
import { usePatientsInfo } from '/@/stores/patientsInfo';
import { computed, reactive } from 'vue';
import { getPatData } from '/@/api/Patients';
import { useUserInfo } from '/@/stores/userInfo';
import { computed, onMounted, reactive } from 'vue';
import { getPatData,getLisResults } from '/@/api/Patients';
import { userInfo } from 'os';
import dayjs from 'dayjs';
const storesPat = usePatientsInfo();
const stores = useUserInfo();

const { patientsInfo } = storeToRefs(storesPat);
const { userInfos } = storeToRefs(stores);
const props = defineProps(['tableHeight'])
const state = reactive({
    tableData: [],
@@ -54,33 +105,122 @@
        证件号:"",
        诊断:'',
        身高:''
    }
    },
    listData:<any>{}
})
const tableHe = computed(() => {
    return props.tableHeight - 130
})
// 第一步：定义子组件里面的方法
const getData = (str: string) => {
    console.log("患者档案子组件获取显示数据！" + str);
    console.log(props.tableHeight)
const getData = async (str: string) => {
    var pam = {
        patCode: patientsInfo.value.code,
    }
    state.loading = true
    getPatData(pam).then(re=>{
        console.log(re.data)
        state.patientData=re.data
    })
    const pam2={
        clientCode:userInfos.value.clientCode,
        patCode:patientsInfo.value.code,
        date1:dayjs().add(-30, 'day').format('YYYY-MM-DD'),
        date2:dayjs().format('YYYY-MM-DD'),
}
    try{
        state.loading = true
        const [res1,res2]=await Promise.all([
            getPatData(pam),
            getLisResults(pam2)
        ])
        state.patientData=res1.data
        state.listData=res2.data
        console.log('lis数据',state.listData)
        state.loading = false
    }
    catch(error){
        state.loading = false
    }
    // 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
    // })
    
}
onMounted(()=>{
    // console.log(dayjs().add(-7, 'day').format('YYYY-MM-DD'),'---shan')
    if(state.listData.lis){
        console.log('有意义------------------')
    }
})
const formatResKeys = (obj: Object) => {
    return Object.keys(obj).filter((k) => k !== '标本日期');
};
const formatResKeysDate = (obj: Object) => {
    return Object.keys(obj).filter((k) => k === '标本日期');
};

// 第二步：暴露方法
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 {font-family: verdana,arial,sans-serif;font-size:14px;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;}
.clearfix{
    font-weight: 800;
    flex: 1;
    height: inherit;
    display: flex;
    align-items: center;
    margin-top: -10px;margin-bottom: 10px;
}

.itemLis{
    min-width: 120px;
    padding-left: 10px;
    padding-right: 10px;
    height: 100px;
    // margin-top: 10px;
    // line-height: 33px;
    border: 1px solid #c7c9cd;
    border-left: 3px solid #409EFF;
    border-radius: 5px;
    text-align: center;
    margin-left: 10px;
    .title{
        text-align: left;
        color: #909399;
        font-size: 13px;
        height: 20px;
        line-height: 20px;
    }
    .itemRes{
        height: 60px;
        flex: 1;
        display: flex;
        align-items: center;
        color: #303133;
        font-size: 16px;
        div{
            line-height: 30px;text-align: center; padding-left: 10px; padding-right: 10px;
        }
        .itemResDtile:not(:first-child) {
            /* 在这里添加你想要的样式 */
            border-left: 1px solid #909399; /* 示例样式：为除第一个div外的所有div添加红色边框 */
        }
    }
    .tdate{
        color: #909399;
        font-size: 13px;
        height: 20px;
        line-height: 20px;
    }
}


</style>

 src/views/home/index.vue

@@ -45,7 +45,7 @@
                                <span style="margin-left: 5px">生化数据</span>
                            </span>
                        </template>
                        Config
                        <lisUi ref="lisUiRef"></lisUi>
                    </el-tab-pane>
                    <el-tab-pane label="用药记录" name="用药记录">
                        <template #label>
@@ -131,6 +131,8 @@
import dietarySurvey from './components/dietary_survey.vue'
// 患者档案
import patientFile from './components/patient_file.vue'
// 化验结果
import lisUi from './components/lis_.ui.vue'
interface User {
    code:string,
    patientName: string
@@ -140,6 +142,7 @@
const MedicationRecordsRef=ref()
const patientFileRef=ref()
const currentRow=ref()
const lisUiRef=ref()
const state = reactive({
    global: {
        homeChartOne: null,