From ba72e3d15c5e5336201ab2e48c040fcfde423fc7 Mon Sep 17 00:00:00 2001
From: schangxiang@126.com <schangxiang@126.com>
Date: 周六, 17 5月 2025 16:03:02 +0800
Subject: [PATCH] 垂直滚动条效果
---
PipeLineLems/pipelinelems_web/src/widgets/PipeAccessoryAssembly/Views/Pages/PipeAccessoryAssembly/PipeAccessoryAssembly.module.scss | 162 +++++++++++++++++++++++++++++++++++++++++++-----------
1 files changed, 129 insertions(+), 33 deletions(-)
diff --git a/PipeLineLems/pipelinelems_web/src/widgets/PipeAccessoryAssembly/Views/Pages/PipeAccessoryAssembly/PipeAccessoryAssembly.module.scss b/PipeLineLems/pipelinelems_web/src/widgets/PipeAccessoryAssembly/Views/Pages/PipeAccessoryAssembly/PipeAccessoryAssembly.module.scss
index 3bbdcc0..a63ef3a 100644
--- a/PipeLineLems/pipelinelems_web/src/widgets/PipeAccessoryAssembly/Views/Pages/PipeAccessoryAssembly/PipeAccessoryAssembly.module.scss
+++ b/PipeLineLems/pipelinelems_web/src/widgets/PipeAccessoryAssembly/Views/Pages/PipeAccessoryAssembly/PipeAccessoryAssembly.module.scss
@@ -1,6 +1,9 @@
.pipeAccessoryAssemblyContent {
width: 100%;
height: 100%;
+ // height: 100% !important;
+ // overflow-y: auto !important; /* 鍐呭瓒呭嚭鏃舵樉绀烘粴鍔ㄦ潯 */
+ // padding-bottom: 20px; /* 閬垮厤鍐呭琚簳閮ㄩ伄鎸� */
.pipeAccessoryAssemblyList {
width: 100%;
@@ -18,6 +21,24 @@
justify-content: flex-end;
align-items: center;
}
+
+ .h5Form {
+ display: flex;
+ flex-direction: column;
+ gap: 20px; // 琛ㄥ崟椤逛箣闂寸殑闂磋窛
+
+ .el-form-item {
+ margin-bottom: 0; // 绉婚櫎榛樿鐨勫簳閮ㄨ竟璺�
+ width: 100%; // 鍗犳弧鐖跺鍣ㄥ搴�
+ }
+
+ .el-form-item__label {
+ display: block;
+ text-align: left;
+ margin-bottom: 8px;
+ font-weight: 500;
+ }
+ }
}
.tagBox {
@@ -112,46 +133,121 @@
}
}
-.pipeAccessoryAssemblyContent {
- padding: 16px;
- background: #fff;
- border-radius: 4px;
- box-shadow: 0 1px 4px rgba(0, 0, 0, 0.1);
- max-width: 500px; // 闄愬埗鏈�澶у搴�
- margin: 0 auto; // 姘村钩灞呬腑
- width: 90%; // 鍝嶅簲寮忓搴�
- .h5Form {
- display: flex;
- flex-direction: column;
- gap: 20px; // 琛ㄥ崟椤逛箣闂寸殑闂磋窛
- .el-form-item {
- margin-bottom: 0; // 绉婚櫎榛樿鐨勫簳閮ㄨ竟璺�
- 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;
}
- .el-form-item__label {
- display: block;
- text-align: left;
- margin-bottom: 8px;
- font-weight: 500;
+ .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;
}
}
- .formInput {
- width: 100%; // 杈撳叆妗嗗崰婊＄埗瀹瑰櫒瀹藉害
- }
+ .process-table {
+ width: 100%;
+ margin-top: 20px;
- .buttonGroup {
- display: flex;
- justify-content: center;
- gap: 16px; // 鎸夐挳闂磋窛
- margin-top: 16px;
-
- .actionButton {
- flex: 1; // 鎸夐挳骞冲潎鍒嗛厤绌洪棿
- max-width: 200px; // 闄愬埗鎸夐挳鏈�澶у搴�
+ .el-table {
+ border: 1px solid #eaeaea;
+ border-radius: 5px;
}
}
-}
\ No newline at end of file
+}
+
+
+.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;
+}
+
--
Gitblit v1.9.3