.pipeAccessoryAssemblyContent {
|
width: 100%;
|
height: 100%;
|
// height: 100% !important;
|
// overflow-y: auto !important; /* 内容超出时显示滚动条 */
|
// padding-bottom: 20px; /* 避免内容被底部遮挡 */
|
|
.pipeAccessoryAssemblyList {
|
width: 100%;
|
height: calc(100% - 70px);
|
}
|
.headerContent {
|
display: flex;
|
justify-content: space-between;
|
align-items: center;
|
height: 43px;
|
}
|
.header {
|
margin-bottom: 12px;
|
display: flex;
|
justify-content: flex-end;
|
align-items: center;
|
}
|
|
.h5Form {
|
display: flex;
|
flex-direction: column;
|
gap: 20px; // 表单项之间的间距
|
|
.el-form-item {
|
margin-bottom: 0; // 移除默认的底部边距
|
width: 100% !important; // 占满父容器宽度
|
}
|
|
.el-form-item__label {
|
display: block;
|
text-align: left;
|
margin-bottom: 8px;
|
font-weight: 500;
|
}
|
}
|
}
|
|
.tagBox {
|
width: auto;
|
min-width: 80px;
|
height: 24px;
|
background: #ffffff;
|
border-radius: 19px 19px 19px 19px;
|
opacity: 1;
|
border: 1px dashed #bcc4cc;
|
width: 50px;
|
height: 20px;
|
font-size: 14px;
|
font-family: PingFang SC, PingFang SC;
|
font-weight: 400;
|
color: #5a84ff;
|
display: flex;
|
justify-content: center;
|
align-items: center;
|
// cursor: pointer;
|
}
|
|
.group {
|
display: flex;
|
justify-content: space-between;
|
align-items: center;
|
}
|
|
.groupTable {
|
width: 100%;
|
}
|
|
.overBox {
|
width: 100%;
|
height: calc(100% - 20px);
|
overflow: auto;
|
:global(.cs-collapse-item__header) {
|
background-color: #f1f1f1;
|
padding: 0 20px;
|
height: 35px;
|
font-size: 16px;
|
font-family: PingFang SC, PingFang SC;
|
font-weight: 500;
|
}
|
:global(.cs-collapse-item__content) {
|
padding-bottom: 0px;
|
}
|
}
|
.groupHeader {
|
width: 100%;
|
height: 30px;
|
background: #ccc;
|
}
|
|
.hideBlock {
|
display: none;
|
}
|
.queryForm {
|
padding: 10px;
|
background: #f5f7fa;
|
margin-bottom: 0px;
|
border-radius: 4px;
|
|
.el-form-item {
|
margin-right: 20px;
|
margin-bottom: 0;
|
|
// 统一输入框和选择框的宽度
|
.el-input, .el-select {
|
width: 200px; // 设置统一的宽度
|
}
|
|
// 选择框内部输入框样式
|
.el-select .el-input__wrapper {
|
height: 32px; // 与输入框高度一致
|
padding: 1px 11px; // 与输入框内边距一致
|
}
|
|
// 日期选择器宽度
|
.el-date-editor {
|
width: 220px;
|
}
|
}
|
}
|
|
// 如果需要更精确的控制,可以单独设置
|
.formItem {
|
width: 200px;
|
|
&.el-input, &.el-select {
|
width: 100%;
|
}
|
}
|
|
|
|
.newPageContent {
|
display: flex;
|
flex-wrap: wrap;
|
gap: 20px;
|
padding: 20px;
|
background-color: white;
|
|
.info-block {
|
background-color: #f9f9f9;
|
border: 1px solid #eaeaea;
|
border-radius: 5px;
|
padding: 20px;
|
width: calc(33.33% - 20px);
|
|
.block-title {
|
font-size: 20px;
|
font-weight: bold;
|
margin-bottom: 15px;
|
}
|
|
.info-tags {
|
display: flex;
|
flex-wrap: wrap;
|
gap: 10px;
|
|
.info-tag {
|
display: flex;
|
align-items: center;
|
gap: 5px;
|
|
.tag-label {
|
font-weight: bold;
|
}
|
}
|
}
|
|
.action-buttons {
|
display: flex;
|
gap: 10px;
|
margin-top: 20px;
|
}
|
|
.equipment-image {
|
width: 100%;
|
height: auto;
|
margin-top: 20px;
|
}
|
|
.status-normal {
|
color: green;
|
}
|
}
|
|
.process-table {
|
width: 100%;
|
margin-top: 20px;
|
|
.el-table {
|
border: 1px solid #eaeaea;
|
border-radius: 5px;
|
}
|
}
|
}
|
|
|
.modelRrow {
|
display: flex; /* 弹性布局 */
|
gap: 20px; /* 控件间距 */
|
align-items: center; /* 垂直居中 */
|
margin-bottom: 12px; /* 底部间距 */
|
width: 100%;
|
|
.el-form-item {
|
flex: 1 !important; /* 均分空间 */
|
margin-bottom: 0;
|
max-width: none; // 移除最大宽度限制
|
}
|
|
.el-select {
|
width: 100%; // 确保Select占满父容器宽度
|
|
// 移除可能影响宽度的内部样式
|
.el-input__wrapper {
|
width: 100%;
|
}
|
}
|
|
// 响应式设计
|
@media (max-width: 1200px) {
|
.model-row {
|
flex-wrap: wrap;
|
|
.el-form-item {
|
flex: 1 0 calc(50% - 10px); // 在中等屏幕上每行显示2个
|
margin-bottom: 10px;
|
}
|
}
|
}
|
|
@media (max-width: 768px) {
|
.model-row {
|
flex-direction: column;
|
|
.el-form-item {
|
width: 100%; // 在小屏幕上每行显示1个
|
}
|
}
|
}
|
}
|
|
.action-buttons {
|
display: flex;
|
gap: 10px;
|
margin-top: 20px;
|
}
|