table { width: 100%; } .data-fill-list-box { position: relative; .hc-collapse-item-header { flex: 1; position: relative; margin-left: 46px; display: flex; align-items: center; .item-title { flex: 1; position: relative; user-select: none; color: #50545E; font-size: 16px; font-weight: 400; cursor: pointer; } .hc-extra-text-box { position: relative; padding-right: 24px; } } .data-fill-list-item-content { position: relative; display: flex; height: calc(100vh - 386px); .data-fill-table-form-box { flex: 1; position: relative; height: 100%; overflow: hidden; border: 8px solid #c4c4c4; &.is-window { border: 0; .hc-window-tip { position: relative; height: 100%; display: flex; justify-content: center; align-items: center; .table-form-no { position: relative; img { width: 380px; } .desc { text-align: center; font-size: 20px; color: #aaa; } } } } } .hc-window-switch-box { display: flex; align-items: center; position: absolute; top: 14px; right: 260px; .icon-btn-view { padding: 0 18px; height: 34px; display: flex; align-items: center; justify-content: center; color: #ffffff; cursor: pointer; user-select: none; border-radius: 80px; box-shadow: 4px 4px 8px 0 rgba(54, 92, 167, 0.15), -3px -2px 8px 0 #ffffff; background: linear-gradient(to right, var(--el-color-primary-light-5), var(--el-color-primary), var(--el-color-primary-dark-2)); background-size: 200%; transition: background-position .5s; .icon { font-size: 16px; } &:hover { background-position: 100% 0; } } } .data-fill-table-tip-box { width: 240px; position: relative; border-left: 1px solid #E9E9E9; padding: 20px 15px 80px; .tip-title { font-size: 16px; margin-bottom: 10px; display: flex; align-items: center; } .tip-item { margin-bottom: 20px; } .table-tip-foot { position: absolute; bottom: 15px; right: 0; left: 0; display: flex; align-items: center; padding: 0 15px; .tip-left-btn { flex: 1; .dow-text { cursor: pointer; display: flex; align-items: center; } } } } } } .radio-group-box { text-align: center; }