diff --git a/openhis-ui-vue3/src/views/clinicmanagement/dayEnd/index.vue b/openhis-ui-vue3/src/views/clinicmanagement/dayEnd/index.vue index 3fbbf196..6072744a 100755 --- a/openhis-ui-vue3/src/views/clinicmanagement/dayEnd/index.vue +++ b/openhis-ui-vue3/src/views/clinicmanagement/dayEnd/index.vue @@ -267,8 +267,6 @@ getPharmacyCabinetLists(); .report-container { width: 100%; max-width: 1200px; - min-width: 900px; - margin: 0 auto; box-sizing: border-box; padding: 24px 32px; background: #fff; @@ -295,38 +293,46 @@ getPharmacyCabinetLists(); .report-row { display: grid; margin: 12px 0; - gap: 12px 24px; + gap: 8px 16px; align-items: center; } .cols-4 { - grid-template-columns: repeat(4, 1fr); + grid-template-columns: repeat(auto-fit, minmax(250px, 1fr)); } .span-2 { grid-column: span 2; } .report-item { - display: grid; - grid-template-columns: 120px 1fr; + display: flex; align-items: center; box-sizing: border-box; min-width: 0; } .label { + min-width: 100px; + flex-shrink: 0; color: #606266; white-space: nowrap; text-align: right; - padding-right: 4px; } .value { color: #303133; font-weight: 500; white-space: nowrap; flex: 1; - min-width: 0;} +} .divider { height: 1px; background-color: #dcdfe6; - margin: 16px 0; + margin: 12px 0; +} +@media screen and (max-width: 1200px) { + .cols-4 { + grid-template-columns: repeat(2, 1fr); + } + .span-2 { + grid-column: span 2; + } } @media screen and (max-width: 768px) { .cols-4 { @@ -335,8 +341,8 @@ getPharmacyCabinetLists(); .span-2 { grid-column: span 1; } - .report-item { - grid-template-columns: 100px 1fr; + .label { + min-width: 80px; } }