wangyizhe/his
1
3
Fork 0
Code Issues Pull Requests 2 Actions Packages Projects Releases Wiki Activity

fix(#611): 补费弹窗操作栏移至顶部，无需滚动即可确认

Browse Source 
根因: 确认/取消按钮、执行时间、补费总金额在弹窗底部(70vh滚动区域后)
       当划价项目多时按钮被挤出首屏，需滚动才能操作

修复: 将操作栏从底部移至顶部(划价组套按钮后面)
      - 执行时间 + 总金额 + 确认/取消 水平排列
      - 灰色背景视觉区分，始终可见无需滚动
This commit is contained in:
华佗
2026-06-15 09:12:19 +08:00
parent e877dfd259
commit d5e2eb6479
1 changed files with 41 additions and 40 deletions
Download Patch File Download Diff File Expand all files Collapse all files

81
healthlink-his-ui/src/views/inpatientNurse/InpatientBilling/components/FeeDialog.vue
View File

@@ -55,6 +55,47 @@
划价组套
</el-button>
</div>
<!-- 操作栏：执行时间 + 总金额 + 确认/取消（固定在顶部，无需滚动） -->
<div
style="
margin-bottom: 10px;
padding: 8px 12px;
background: #f5f7fa;
border-radius: 6px;
display: flex;
align-items: center;
justify-content: space-between;
flex-wrap: wrap;
gap: 10px;
"
>
<div style="display: flex; align-items: center; gap: 10px">
<span style="white-space: nowrap">执行时间：</span>
<el-date-picker
v-model="executeTime"
type="datetime"
format="YYYY-MM-DD HH:mm:ss"
value-format="YYYY-MM-DD HH:mm:ss"
placeholder="选择日期时间"
style="width: 200px"
/>
</div>
<div style="display: flex; align-items: center; gap: 15px">
<span style="font-size: 14px; font-weight: bold; white-space: nowrap">
本次补费总金额：<span style="color: #ff4d4f">{{ totalAmount.toFixed(6) }}</span>
</span>
<el-button @click="handleCancel">
取消
</el-button>
<el-button
type="primary"
@click="handleConfirm"
>
确定
</el-button>
</div>
</div>
<!-- 弹窗内容 - 左右布局 -->
<div style="display: flex; gap: 20px; height: 70vh">
<div
@@ -300,46 +341,6 @@
</div>
</div>
<!-- 底部信息区域 -->
<div style="margin-top: 15px; display: flex; flex-wrap: wrap; gap: 15px">
<div style="display: flex; align-items: center">
<span style="margin-right: 8px">执行时间：</span>
<el-date-picker
v-model="executeTime"
type="datetime"
format="YYYY-MM-DD HH:mm:ss"
value-format="YYYY-MM-DD HH:mm:ss"
placeholder="选择日期时间"
style="width: 200px"
/>
</div>
</div>
<!-- 总金额和操作按钮（固定在弹窗底部） -->
<div
style="
margin-top: 15px;
padding-top: 15px;
border-top: 1px solid #e4e7ed;
display: flex;
justify-content: space-between;
align-items: center;
"
>
<div style="font-size: 14px; font-weight: bold; text-align: right">
本次补费总金额：<span style="color: #ff4d4f">{{ totalAmount.toFixed(6) }}</span>
</div>
<div>
<el-button @click="handleCancel">
取消
</el-button>
<el-button
type="primary"
@click="handleConfirm"
>
确定
</el-button>
</div>
</div>
</el-dialog>
<!-- 划价组套选择对话框 -->
<el-dialog