记录增加状态字段

src/pages/stagger-holidays/recordList.vue

@@ -16,10 +16,31 @@
           <text class="label">休假类型：</text>
           <text class="value">{{ record.leaveType }}</text>
         </view>
+
+        <!-- 新增的审批状态行 -->
+        <view class="record-row" style="position: relative;">
+          <view class="status-container">
+            <text class="value status-black" v-if="record.examineStatus==0">
+              审核中
+            </text>
+            <text class="value status-passed" v-if="record.examineStatus==1">
+              已通过
+            </text>
+            <text class="value status-rejected" v-if="record.examineStatus==2">
+              不通过
+            </text>
+            <text class="value status-rejected" v-if="record.examineStatus==3">
+              已撤回
+            </text>
+          </view>
+        </view>
+
         <view class="record-row">
           <text class="label">休假开始时间：</text>
           <text class="value">{{ record.leaveStartDate }}</text>
         </view>
+
+
         <view class="record-row">
           <text class="label">休假结束时间：</text>
           <text class="value">{{ record.leaveEndDate }}</text>
@@ -47,8 +68,9 @@
 </template>
 
 <script>
-    import { listLeaveReporting, deleteHolidayByIdApi } from '@/api/stagger-holidays/index.js'
+import {listLeaveReporting, deleteHolidayByIdApi} from '@/api/stagger-holidays/index.js'
-    export default {
+
+export default {
   name: 'RecordList',
   data() {
     return {
@@ -61,7 +83,7 @@
   },
   methods: {
     fetchRecords() {
-                listLeaveReporting({ type: '轮休' }).then((response) => {
+      listLeaveReporting({type: '轮休'}).then((response) => {
         console.log('response轮休列表', response)
         this.records = response.data
         console.log('records', this.records)
@@ -82,10 +104,10 @@
         content: '是否确认删除该条数据？',
         success: async (res) => {
           if (res.confirm) {
-                            const result = await deleteHolidayByIdApi({ uuid })
+            const result = await deleteHolidayByIdApi({uuid})
 
             if (result.code === 200) {
-                                uni.showToast({ title: '删除成功！', icon: 'none' })
+              uni.showToast({title: '删除成功！', icon: 'none'})
               this.fetchRecords()
             }
           }
@@ -98,75 +120,100 @@
       this.$emit('onEditData', uuid)
     },
   },
-    }
+}
 </script>
 
 <style lang="scss">
-    .records-container {
+.records-container {
-        padding: 20rpx;
+  padding: 20 rpx;
-    }
+}
 
-    .record-item {
+.record-item {
   background: #fff;
-        border-radius: 12rpx;
+  border-radius: 12 rpx;
-        padding: 20rpx;
+  padding: 20 rpx;
-        margin-bottom: 20rpx;
+  margin-bottom: 20 rpx;
-        box-shadow: 0 2rpx 4rpx rgba(0, 0, 0, 0.1);
+  box-shadow: 0 2 rpx 4 rpx rgba(0, 0, 0, 0.1);
-    }
+}
 
-    .record-header {
+.record-header {
   display: flex;
   justify-content: space-between;
   align-items: center;
-        margin-bottom: 16rpx;
+  margin-bottom: 16 rpx;
-    }
+}
 
-    .detail-link {
+.detail-link {
   color: #007aff;
-        font-size: 28rpx;
+  font-size: 28 rpx;
-    }
+}
 
-    .record-row {
+.record-row {
   display: flex;
-        margin-bottom: 8rpx;
+  //margin-bottom: 8 rpx;
-    }
+  margin: 5rpx 0;
+}
 
-    .label {
+.label {
   color: #666;
-        font-size: 28rpx;
+  font-size: 28 rpx;
   width: 110px;
-    }
+}
 
-    .value {
+.value {
   color: #333;
-        font-size: 28rpx;
+  font-size: 28 rpx;
   flex: 1;
-    }
+}
 
-    .btn-container {
+.btn-container {
   display: flex;
   justify-content: space-around;
 
   text {
     width: 30%;
-            height: 68rpx;
+    height: 68 rpx;
-            line-height: 68rpx;
+    line-height: 68 rpx;
     text-align: center;
-            font-size: 28rpx;
+    font-size: 28 rpx;
-            border-radius: 4rpx;
+    border-radius: 4 rpx;
   }
 
   & text:first-child {
     border: 1px solid #4080ff;
     color: #4080ff;
   }
+
   & text:nth-child(2) {
     border: 1px solid #e6a23c;
     color: #e6a23c;
   }
+
   & text:last-child {
     border: 1px solid #f56c6c;
     color: #f56c6c;
   }
-    }
+}
+
+.status-passed {
+  color: green;
+  font-size: 18px;
+}
+
+.status-rejected {
+  color: red;
+  font-size: 18px;
+}
+
+.status-black {
+  color: #FBC02D;
+  font-size: 18px;
+}
+
+.status-container {
+  position: absolute;
+  right: 5%;
+  top: 50%;
+  transform: translateY(-50%);
+}
 </style>

src/pages/temporary-outing/recordList.vue

@@ -16,6 +16,25 @@
                     <text class="label">外出事由：</text>
                     <text class="value">{{ record.leaveReason }}</text>
                 </view>
+
+              <!-- 新增的审批状态行 -->
+              <view class="record-row" style="position: relative;">
+                <view class="status-container">
+                  <text class="value status-black" v-if="record.examineStatus==0">
+                    审核中
+                  </text>
+                  <text class="value status-passed" v-if="record.examineStatus==1">
+                    已通过
+                  </text>
+                  <text class="value status-rejected" v-if="record.examineStatus==2">
+                    不通过
+                  </text>
+                  <text class="value status-rejected" v-if="record.examineStatus==3">
+                    已撤回
+                  </text>
+                </view>
+              </view>
+
                 <view class="record-row">
                     <text class="label">外出开始时间：</text>
                     <text class="value">{{ record.leaveStartDate }}</text>
@@ -128,7 +147,7 @@
 
     .record-row {
         display: flex;
-        margin-bottom: 8rpx;
+        margin: 5rpx 0;
     }
 
     .label {
@@ -169,4 +188,26 @@
             color: #f56c6c;
         }
     }
+
+    .status-passed {
+      color: green;
+      font-size: 18px !important;
+    }
+
+    .status-rejected {
+      color: red;
+      font-size: 18px !important;
+    }
+
+    .status-black {
+      color: #FBC02D;
+      font-size: 18px !important;
+    }
+
+    .status-container {
+      position: absolute;
+      right: 5%;
+      top: 50%;
+      transform: translateY(-50%);
+    }
 </style>