fix:联调评论接口、新增流程管理列表模块页面

src/styles/common.scss

@@ -22,13 +22,14 @@ body {
 }
 
 
+// popover 筛选框的全局样式
 .filter-popper.el-popover.el-popper {
     --el-popover-padding: 0;
     border-radius: var(--mj-popper-radius);
     box-shadow: 0 4px 16px rgba(0, 0, 0, 0.1);
 }
 
-// 全局重新element相关样式
+// 全局重写element相关样式
 .mj-input-form {
     .el-input {
         --el-border-radius-base: 10px;
@@ -38,7 +39,7 @@ body {
 
 
 // 搜索框动画
-.search-dict-input {
+.search-auto-expand-input {
     --default-width: 160px;
     --max-width: 224px;
     width: var(--default-width);
@@ -71,7 +72,7 @@ body {
 }
 
 
-// 筛选框全局样式内容
+// 筛选框内容的全局样式内容
 .mj-filter-content {
   min-width: 380px;
   background: #fff;
@@ -132,4 +133,42 @@ body {
       border-color: #407eff;
     }
   }
+}
+
+
+
+// 全局单行省略样式
+.mj-ellipsis-one-line {
+  overflow: hidden;
+  text-overflow: ellipsis;
+  white-space: nowrap;
+}
+
+
+
+// 卡片的全局样式
+
+.mj-card-container{
+  display: grid;
+  gap: 16px;
+  width: 100%;
+  // 默认：一行 5 列
+  grid-template-columns: repeat(5, 1fr);
+  // 1400px 以下：觉得 5 个太挤，切到一行 4 列
+  @media (max-width: 1400px) {
+    grid-template-columns: repeat(4, 1fr);
+  }
+  // 1100px 以下 (iPad横屏区间)：一行 3 列
+  @media (max-width: 1100px) {
+    grid-template-columns: repeat(3, 1fr);
+  }
+  // 768px 以下 (iPad竖屏)：一行 2 列
+  @media (max-width: 768px) {
+    grid-template-columns: repeat(2, 1fr);
+    gap: 12px;
+  }
+  // 480px 以下 (手机端)：一行 1 列
+  @media (max-width: 480px) {
+    grid-template-columns: repeat(1, 1fr);
+  }
 }