修改样式

src/views/factoryCalendar/components/factoryCalendar.scss

@@ -151,7 +151,7 @@
       .adjust-detail-grid {
         display: grid;
         grid-template-columns: repeat(2, minmax(0, 1fr));
-        gap: 12px;
+        gap: 14px;
       }
 
       .adjust-detail-field,
@@ -168,8 +168,20 @@
       }
 
       .adjust-detail-field {
-        min-height: 66px;
-        padding: 12px 16px;
+        min-height: 72px;
+        padding: 14px 18px;
+      }
+
+      .adjust-detail-field.is-wide {
+        display: flex;
+        min-height: 78px;
+        grid-column: 1 / -1;
+        justify-content: center;
+        flex-direction: column;
+        border-color: #c8def4;
+        background:
+          linear-gradient(135deg, rgba(255, 255, 255, 0.98), rgba(233, 246, 255, 0.9)),
+          #ffffff;
       }
 
       .adjust-detail-field span,
@@ -193,6 +205,22 @@
         word-break: break-word;
       }
 
+      .adjust-period-value {
+        display: inline-flex;
+        width: fit-content;
+        max-width: 100%;
+        align-items: center;
+        padding: 6px 12px;
+        border: 1px solid rgba(64, 158, 255, 0.16);
+        border-radius: 6px;
+        background: rgba(255, 255, 255, 0.72);
+        color: #1f3a5f;
+        font-size: 17px;
+        line-height: 24px;
+        box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.9);
+        white-space: normal;
+      }
+
       .adjust-detail-field .el-tag {
         height: 28px;
         padding: 0 12px;
@@ -203,8 +231,8 @@
       .adjust-compare {
         display: grid;
         grid-template-columns: repeat(2, minmax(0, 1fr));
-        gap: 12px;
-        margin-top: 12px;
+        gap: 14px;
+        margin-top: 14px;
       }
 
       .adjust-data-card {

src/views/factoryCalendar/index.vue

@@ -642,6 +642,10 @@
             <span>申请单号</span>
             <strong>{{ adjustDetail.applyNo || '-' }}</strong>
           </div>
+          <div class="adjust-detail-field">
+            <span>申请人</span>
+            <strong>{{ getAdjustApplicantName(adjustDetail) }}</strong>
+          </div>
           <div class="adjust-detail-field">
             <span>关联日历</span>
             <strong>{{ adjustDetail.calendarName || '-' }}</strong>
@@ -665,9 +669,9 @@
             <span>调整日期</span>
             <strong>{{ adjustDetail.adjustDate || '-' }}</strong>
           </div>
-          <div class="adjust-detail-field">
+          <div class="adjust-detail-field is-wide">
             <span>生效周期</span>
-            <strong>
+            <strong class="adjust-period-value">
               {{ adjustDetail.effectiveTime || '-' }} 至
               {{ adjustDetail.expireTime || '-' }}
             </strong>
@@ -3415,6 +3419,16 @@
           })
           .join('、');
       },
+      getAdjustApplicantName(row = {}) {
+        return (
+          row.applyUserName ||
+          row.applicantName ||
+          row.createUserName ||
+          row.userName ||
+          row.applyUserId ||
+          '-'
+        );
+      },
       formatApproveNodes(approveNode) {
         if (!approveNode) {
           return [];