34

chenyc

2025-03-04 a015563dbe5adccd2837d33d69e9c032e2a7efa9

34

 src/views/home/index.vue

@@ -1,7 +1,7 @@
<template>
    <div class="home-container layout-pd ">
        <div class="container">
            <div class="container-left">
            <div class="container-left" v-if="isLeftVisible">
                <div class="patTabel">
                    <el-table :data="state.filterTableData" stripe :height="state.tableHeight.left" size="default"
                        highlight-current-row @current-change="handleCurrentChange" style="width: 300px">
@@ -35,7 +35,7 @@
                    </el-table>
                </div>
            </div>
            <div class="right" style="width: 100%;">
            <div class="right" :class="{'full-width': !isLeftVisible}" style="width: 100%;">
                <div style="width: 100%;">
                    <el-tabs v-model="state.activeName" class="demo-tabs" @tab-click="handleClick">
                        <el-tab-pane label="患者档案" name="患者档案">
@@ -153,9 +153,11 @@
                </div>
            </div>
        </div>
        <div class="fixed-div" v-show="patientsInfo.patientName">
        <div class="fixed-div" v-show="patientsInfo.patientName" @click="toggleVisibility">
            <el-avatar :size="80" :src="patientsInfo.patientAvatarIcon" />
            <div>{{ patientsInfo.patientName }}</div>
            <el-icon size="20" v-if="isLeftVisible"><Fold /></el-icon>
            <el-icon size="20" v-else><Expand /></el-icon>
        </div>
    </div>
</template>
@@ -207,7 +209,9 @@
const fangAnRef=ref()
const suifangjiluRef=ref()
const jilubiaoRef=ref()
const isLeftVisible=ref(true)
const state = reactive({
    
    global: {
        homeChartOne: null,
        homeChartTwo: null,
@@ -227,6 +231,10 @@
    setTableHeight()
    getPatients()
})
// 定义一个方法来切换左边div的显示状态
const toggleVisibility = () => {
  isLeftVisible.value = !isLeftVisible.value;
};
const handleCurrentChange = (val: any | undefined) => {
    if (val) {
        console.log(val)
@@ -347,11 +355,14 @@

.container-left {
    width: 300px; /* 右边div的固定宽度 */
.right {
    background-color: #409EFF;
    flex-grow: 1; /* 让这个div扩展以填充可用空间 */
    margin-left: 20px; /* 如果需要的话，可以给右边的div留出一些间距 */
    transition: all 0.3s ease; /* 添加过渡效果，使宽度变化更加平滑 */
}
.right {
    flex-grow: 1; /* 让这个div扩展以填充可用空间 */
    transition: all 0.3s ease; /* 添加过渡效果，使宽度变化更加平滑 */
}
.full-width {
    width: 100%; /* 当左边div隐藏时，右边div占据全部宽度 */
}
.home-container {
    overflow: hidden;
@@ -406,7 +417,7 @@
    align-items: center;
    bottom: 10px;
    right: 30px;
    width: 200px;
    width: 220px;
    height: 100px;
    color: rgb(16, 3, 3);
    padding: 10px;