检查项目设置-套餐设置-套餐管理界面放大或缩小数据显示不全
This commit is contained in:
@@ -8,9 +8,9 @@
|
|||||||
</div>
|
</div>
|
||||||
|
|
||||||
<!-- 可滚动的内容区域 -->
|
<!-- 可滚动的内容区域 -->
|
||||||
<div class="prescription-scroll-container" style="flex: 1; overflow-y: auto; overflow-x: hidden; max-height: calc(100vh - 300px);">
|
<div class="prescription-scroll-container" style="flex: 1; overflow-y: auto; overflow-x: auto; max-height: calc(100vh - 300px); width: 100%;">
|
||||||
<!-- 循环显示所有西药方 -->
|
<!-- 循环显示所有西药方 -->
|
||||||
<div v-for="(prescription, pIndex) in westernPrescriptions" :key="prescription.id" style="margin-bottom: 20px; border: 1px solid #e4e7ed; border-radius: 8px; padding: 10px;">
|
<div v-for="(prescription, pIndex) in westernPrescriptions" :key="prescription.id" style="margin-bottom: 20px; border: 1px solid #e4e7ed; border-radius: 8px; padding: 10px; min-width: fit-content;">
|
||||||
<!-- 西药方标题栏 -->
|
<!-- 西药方标题栏 -->
|
||||||
<div style="margin-bottom: 10px; display: flex; align-items: center; justify-content: space-between; background: #f5f7fa; padding: 10px 12px; border-radius: 4px;">
|
<div style="margin-bottom: 10px; display: flex; align-items: center; justify-content: space-between; background: #f5f7fa; padding: 10px 12px; border-radius: 4px;">
|
||||||
<span style="font-weight: 600; font-size: 14px; color: #409eff;">{{ prescription.name }}</span>
|
<span style="font-weight: 600; font-size: 14px; color: #409eff;">{{ prescription.name }}</span>
|
||||||
@@ -79,6 +79,7 @@
|
|||||||
@row-dblclick="(row, event) => clickRowDb(row, event, prescription.id)"
|
@row-dblclick="(row, event) => clickRowDb(row, event, prescription.id)"
|
||||||
v-loading="loading"
|
v-loading="loading"
|
||||||
:expand-row-keys="prescription.expandOrder || []"
|
:expand-row-keys="prescription.expandOrder || []"
|
||||||
|
style="width: 100%; min-width: 100%;"
|
||||||
>
|
>
|
||||||
<el-table-column type="expand" width="1" style="width: 0">
|
<el-table-column type="expand" width="1" style="width: 0">
|
||||||
<template #default="scope">
|
<template #default="scope">
|
||||||
@@ -3437,14 +3438,19 @@ defineExpose({ getListInfo, getDiagnosisInfo, getSignedPrescriptionInfo });
|
|||||||
margin-bottom: 0px;
|
margin-bottom: 0px;
|
||||||
}
|
}
|
||||||
|
|
||||||
/* 优化滚动条样式 */
|
/* 优化滚动条样式 - 支持水平和垂直滚动 */
|
||||||
.prescription-scroll-container {
|
.prescription-scroll-container {
|
||||||
scrollbar-width: thin;
|
scrollbar-width: thin;
|
||||||
scrollbar-color: #c1c1c1 #f1f1f1;
|
scrollbar-color: #c1c1c1 #f1f1f1;
|
||||||
|
/* 确保内容可以超出容器宽度,触发水平滚动 */
|
||||||
|
overflow-x: auto;
|
||||||
|
overflow-y: auto;
|
||||||
}
|
}
|
||||||
|
|
||||||
|
/* 垂直滚动条样式 */
|
||||||
.prescription-scroll-container::-webkit-scrollbar {
|
.prescription-scroll-container::-webkit-scrollbar {
|
||||||
width: 8px;
|
width: 8px;
|
||||||
|
height: 8px;
|
||||||
}
|
}
|
||||||
|
|
||||||
.prescription-scroll-container::-webkit-scrollbar-track {
|
.prescription-scroll-container::-webkit-scrollbar-track {
|
||||||
@@ -3460,4 +3466,18 @@ defineExpose({ getListInfo, getDiagnosisInfo, getSignedPrescriptionInfo });
|
|||||||
.prescription-scroll-container::-webkit-scrollbar-thumb:hover {
|
.prescription-scroll-container::-webkit-scrollbar-thumb:hover {
|
||||||
background: #a8a8a8;
|
background: #a8a8a8;
|
||||||
}
|
}
|
||||||
|
|
||||||
|
/* 水平滚动条样式 */
|
||||||
|
.prescription-scroll-container::-webkit-scrollbar:horizontal {
|
||||||
|
height: 8px;
|
||||||
|
}
|
||||||
|
|
||||||
|
/* 确保表格可以水平滚动 */
|
||||||
|
.prescription-scroll-container .el-table {
|
||||||
|
min-width: 100%;
|
||||||
|
}
|
||||||
|
|
||||||
|
.prescription-scroll-container .el-table__body-wrapper {
|
||||||
|
overflow-x: auto;
|
||||||
|
}
|
||||||
</style>
|
</style>
|
||||||
@@ -78,13 +78,14 @@
|
|||||||
|
|
||||||
<!-- 表格展示区 -->
|
<!-- 表格展示区 -->
|
||||||
<div class="table-section">
|
<div class="table-section">
|
||||||
<el-table
|
<div class="table-wrapper">
|
||||||
:data="tableData"
|
<el-table
|
||||||
border
|
:data="tableData"
|
||||||
style="width: 100%"
|
border
|
||||||
v-loading="loading"
|
style="width: 100%"
|
||||||
:max-height="600"
|
v-loading="loading"
|
||||||
>
|
:max-height="600"
|
||||||
|
>
|
||||||
<el-table-column prop="id" label="ID" width="80" align="center" />
|
<el-table-column prop="id" label="ID" width="80" align="center" />
|
||||||
<el-table-column prop="organization" label="卫生机构" width="120" align="center" />
|
<el-table-column prop="organization" label="卫生机构" width="120" align="center" />
|
||||||
<el-table-column prop="maintainDate" label="日期" width="120" align="center" />
|
<el-table-column prop="maintainDate" label="日期" width="120" align="center" />
|
||||||
@@ -169,6 +170,7 @@
|
|||||||
</template>
|
</template>
|
||||||
</el-table-column>
|
</el-table-column>
|
||||||
</el-table>
|
</el-table>
|
||||||
|
</div>
|
||||||
</div>
|
</div>
|
||||||
|
|
||||||
<!-- 底部分页 -->
|
<!-- 底部分页 -->
|
||||||
@@ -568,6 +570,10 @@ function handleDelete(row) {
|
|||||||
padding: 24px;
|
padding: 24px;
|
||||||
background-color: #f5f7fa;
|
background-color: #f5f7fa;
|
||||||
min-height: 100vh;
|
min-height: 100vh;
|
||||||
|
width: 100%;
|
||||||
|
height: 100%;
|
||||||
|
overflow: auto;
|
||||||
|
box-sizing: border-box;
|
||||||
}
|
}
|
||||||
|
|
||||||
.filter-section {
|
.filter-section {
|
||||||
@@ -576,6 +582,8 @@ function handleDelete(row) {
|
|||||||
padding: 20px;
|
padding: 20px;
|
||||||
margin-bottom: 16px;
|
margin-bottom: 16px;
|
||||||
box-shadow: 0 2px 8px rgba(0, 0, 0, 0.03);
|
box-shadow: 0 2px 8px rgba(0, 0, 0, 0.03);
|
||||||
|
width: 100%;
|
||||||
|
box-sizing: border-box;
|
||||||
}
|
}
|
||||||
|
|
||||||
.filter-section :deep(.el-form-item) {
|
.filter-section :deep(.el-form-item) {
|
||||||
@@ -587,6 +595,17 @@ function handleDelete(row) {
|
|||||||
border-radius: 8px;
|
border-radius: 8px;
|
||||||
padding: 20px;
|
padding: 20px;
|
||||||
box-shadow: 0 2px 8px rgba(0, 0, 0, 0.03);
|
box-shadow: 0 2px 8px rgba(0, 0, 0, 0.03);
|
||||||
|
width: 100%;
|
||||||
|
box-sizing: border-box;
|
||||||
|
overflow: hidden;
|
||||||
|
}
|
||||||
|
|
||||||
|
.table-wrapper {
|
||||||
|
width: 100%;
|
||||||
|
overflow-x: auto;
|
||||||
|
overflow-y: auto;
|
||||||
|
max-height: calc(100vh - 400px);
|
||||||
|
min-height: 400px;
|
||||||
}
|
}
|
||||||
|
|
||||||
.pagination-section {
|
.pagination-section {
|
||||||
@@ -599,6 +618,40 @@ function handleDelete(row) {
|
|||||||
box-shadow: 0 2px 8px rgba(0, 0, 0, 0.03);
|
box-shadow: 0 2px 8px rgba(0, 0, 0, 0.03);
|
||||||
}
|
}
|
||||||
|
|
||||||
|
/* 优化滚动条样式 - 支持水平和垂直滚动 */
|
||||||
|
.table-wrapper {
|
||||||
|
scrollbar-width: thin;
|
||||||
|
scrollbar-color: #c1c1c1 #f1f1f1;
|
||||||
|
}
|
||||||
|
|
||||||
|
.table-wrapper::-webkit-scrollbar {
|
||||||
|
width: 8px;
|
||||||
|
height: 8px;
|
||||||
|
}
|
||||||
|
|
||||||
|
.table-wrapper::-webkit-scrollbar-track {
|
||||||
|
background: #f1f1f1;
|
||||||
|
border-radius: 4px;
|
||||||
|
}
|
||||||
|
|
||||||
|
.table-wrapper::-webkit-scrollbar-thumb {
|
||||||
|
background: #c1c1c1;
|
||||||
|
border-radius: 4px;
|
||||||
|
}
|
||||||
|
|
||||||
|
.table-wrapper::-webkit-scrollbar-thumb:hover {
|
||||||
|
background: #a8a8a8;
|
||||||
|
}
|
||||||
|
|
||||||
|
/* 确保表格可以水平滚动 */
|
||||||
|
.table-wrapper :deep(.el-table) {
|
||||||
|
min-width: 100%;
|
||||||
|
}
|
||||||
|
|
||||||
|
.table-wrapper :deep(.el-table__body-wrapper) {
|
||||||
|
overflow-x: auto;
|
||||||
|
}
|
||||||
|
|
||||||
/* 响应式设计 */
|
/* 响应式设计 */
|
||||||
@media (max-width: 1200px) {
|
@media (max-width: 1200px) {
|
||||||
.filter-section :deep(.el-form) {
|
.filter-section :deep(.el-form) {
|
||||||
@@ -617,6 +670,10 @@ function handleDelete(row) {
|
|||||||
.pagination-section {
|
.pagination-section {
|
||||||
padding: 16px;
|
padding: 16px;
|
||||||
}
|
}
|
||||||
|
|
||||||
|
.table-wrapper {
|
||||||
|
max-height: calc(100vh - 350px);
|
||||||
|
}
|
||||||
}
|
}
|
||||||
</style>
|
</style>
|
||||||
|
|
||||||
|
|||||||
@@ -562,6 +562,11 @@ select {
|
|||||||
flex: 1;
|
flex: 1;
|
||||||
margin-left: 160px;
|
margin-left: 160px;
|
||||||
padding: 24px;
|
padding: 24px;
|
||||||
|
width: calc(100% - 160px);
|
||||||
|
height: 100vh;
|
||||||
|
overflow-x: auto;
|
||||||
|
overflow-y: auto;
|
||||||
|
box-sizing: border-box;
|
||||||
}
|
}
|
||||||
|
|
||||||
.header {
|
.header {
|
||||||
|
|||||||
Reference in New Issue
Block a user