fix(#770): 修复门诊手术申请弹窗footer遮盖字段 + 表格列宽/固定列对齐

- dialog 添加 :teleported="false",使 scoped CSS flex 布局生效,防止 footer 按钮遮盖表单底部字段
  - 固定列操作列表头:添加 ref + nextTick recalculate(),数据加载后同步主表与固定列表头高度
  - 手术室确认人列宽 100→140,序号列宽 60→70,内容展示更完整
  - 简化 cancelled-row 样式,去掉不必要的 :deep() 嵌套
This commit is contained in:
wangjian963
2026-06-22 13:42:31 +08:00
parent ad9c47ed28
commit dff83f6d91

View File

@@ -29,6 +29,7 @@
<!-- 手术申请记录表格 -->
<vxe-table
ref="surgeryTableRef"
v-loading="loading"
:data="surgeryList"
border
@@ -39,7 +40,7 @@
<vxe-column
type="seq"
title="序号"
width="60"
width="70"
align="center"
/>
@@ -131,7 +132,7 @@
title="手术室确认人"
align="center"
field="operatingRoomConfirmUser"
width="100"
width="140"
/>
<!-- 状态 -->
@@ -198,6 +199,7 @@
width="1200px"
class="surgery-dialog"
:close-on-click-modal="false"
:teleported="false"
@close="cancel"
>
<el-form
@@ -934,7 +936,7 @@
</template>
<script setup name="SurgeryApplication">
import { getCurrentInstance, ref, computed, watch, onMounted } from 'vue'
import { getCurrentInstance, ref, computed, watch, onMounted, nextTick } from 'vue'
import { getSurgeryPage, addSurgery, updateSurgery, deleteSurgery, getSurgeryDetail, updateSurgeryStatus } from '@/api/surgerymanage'
import { getEncounterDiagnosis, getDiagnosisTreatmentList, queryParticipantList } from '../api'
import { listUser } from '@/api/system/user'
@@ -1001,6 +1003,7 @@ const form = ref({
secondarySurgeries: [] // 次要手术列表
})
const surgeryRef = ref()
const surgeryTableRef = ref()
const viewData = ref({})
const title = ref('')
const doctorList = ref([])
@@ -1095,6 +1098,7 @@ function getList() {
surgeryList.value = []
}).finally(() => {
loading.value = false
nextTick(() => surgeryTableRef.value?.recalculate())
})
}
@@ -1804,15 +1808,14 @@ defineExpose({
}
/* 表格样式 */
.vxe-table {
:deep(.cancelled-row) {
background-color: #f5f5f5;
color: #999;
text-decoration: line-through;
:deep(.cell) {
opacity: 0.6;
}
:deep(.cancelled-row) {
background-color: #f5f5f5;
color: #999;
text-decoration: line-through;
.cell {
opacity: 0.6;
}
}
}