$header-height: 40px; $footer-height: 45px; .segmented-header { height: $header-height; line-height: $header-height; background: #ffffff; } :deep(.segmented-control__item--text) { font-size: 16px; font-weight: bold; padding: 3px 0; line-height: $header-height; } $list-header-height: 45px; .segmented-content { margin: 10px 0; height: calc(100% - #{$header-height} - #{$footer-height} - 20px); .work-order-info { width: 100%; height: 100%; background: #ffffff; } .work-order-bom-list { width: 100%; height: 100%; } .material-list { width: 100%; height: 100%; } .list-header { height: $list-header-height; background: #ffffff; padding: 6px 10px; box-sizing: border-box; margin-bottom: 10px; .uni-col { height: 100%; } .list-header-item { width: 100%; height: 100%; line-height: 1.2; color: #004098; background: #f3f5f9; border-radius: 4px; font-size: 14px; image { width: 12px; height: 12px; margin-right: 5px; } } uni-button[disabled] { color: rgba(0, 0, 0, 0.3); } } .list-content { height: calc(100% - #{$list-header-height} - 10px); background: #ffffff; padding: 10px; box-sizing: border-box; overflow: hidden; &.all { height: calc(100% - 0px); } } } .segmented-footer { width: 100%; height: $footer-height; background: #ffffff; box-shadow: 0px -2px 10px 0px rgba(0, 0, 0, 0.1); } .footer-total { width: 100%; height: 100%; } .total-item { width: calc(100% - 90px); } .total-btn { width: 90px; border-radius: 0; } .total-item-text { font-weight: 500; .number { padding: 0 5px; } }