From 59dc3bbd1fdedab400b56d67a169bcda97dcf75e Mon Sep 17 00:00:00 2001
From: xwt <2740516069@qq.com>
Date: 星期三, 17 十二月 2025 18:51:33 +0800
Subject: [PATCH] SJ,XJ,RKJ优化修改

---
 pages/QC/XJ/Add.vue |  426 ++++++++++++++++++++++++++++++++++++++++++++++-------
 1 files changed, 370 insertions(+), 56 deletions(-)

diff --git a/pages/QC/XJ/Add.vue b/pages/QC/XJ/Add.vue
index c675b58..43b55e2 100644
--- a/pages/QC/XJ/Add.vue
+++ b/pages/QC/XJ/Add.vue
@@ -79,13 +79,15 @@
             <table>
               <thead>
                 <tr>
-                  <th width="20%" style="text-align: center;">妫�楠岄」鐩�</th>
+                  <th width="8%" style="text-align: center;">搴忓彿</th>
+                  <th width="17%" style="text-align: center;">妫�楠岄」鐩�</th>
                   <th width="50%" style="text-align: center;">妫�楠屾弿杩�</th>
                   <th width="15%" style="text-align: center;">璁板綍(鐐瑰嚮)</th>
                 </tr>
               </thead>
               <tbody>
                 <tr v-for="(item, index) in tableData" :key="index">
+                  <td style="text-align: center;">{{ item.forder || (index + 1) }}</td>
                   <td>{{ item.projName }}</td>
                   <td>
                     <view v-if="item.result=='鍚堟牸'" class="watermark approved">
@@ -97,7 +99,7 @@
                     <view v-if="item.result==null || item.result=='鏈畬鎴�'" class="watermark pending">
                       {{ getStatusText(item.result) }}
                     </view>
-                    <view class="description-text">{{ item.projName }}</view>
+                    <view class="description-text">{{ getInspectionDescription(item) }}</view>
                   </td>
                   <td>
                     <button v-if="item.isCheck >= item.levelNum" class="record-btn" @click="toDetail(item)">鏌ョ湅</button>
@@ -127,7 +129,7 @@
 		 </button>
          <button class="action-btn secondary" v-if="!isUpdate && !isShowTable" @click="viewAttachmentInfo">鏌ョ湅闄勪欢淇℃伅</button>
 
-         <button class="action-btn danger" v-if="!isUpdate && !formData.fcheckResu && !isShowTable && formData.fsubmit !== 1" @click="removeXJ">鍒犻櫎鍗曟嵁</button>
+         <button class="action-btn danger" v-if="!isUpdate && !formData.fcheckResu && !isShowTable && formData.fsubmit !== 1" @click="showDeleteConfirmDialog">鍒犻櫎鍗曟嵁</button>
          <button class="action-btn warning" v-if="!isUpdate && !isShowTable && formData.fsubmit !== 1" @click="saveRemarks">娣诲姞涓嶅悎鏍兼弿杩�</button>
          
          <!-- 妫�楠岄」鐩鐞嗘寜閽� -->
@@ -372,6 +374,32 @@
         </view>
       </view>
 
+      <!-- 鍒犻櫎纭寮圭獥 -->
+      <view v-if="showDeleteConfirm" class="overlay">
+        <view class="popup delete-confirm-popup">
+          <h3 class="delete-confirm-title">鈿狅笍 纭鍒犻櫎</h3>
+          <div class="delete-confirm-divider"></div>
+          <div class="delete-confirm-content">
+            <view class="delete-warning-icon">馃棏锔�</view>
+            <view class="delete-warning-text">鎮ㄧ‘瀹氳鍒犻櫎姝ゆ楠屽崟鍚楋紵</view>
+            <view class="delete-warning-detail">鍒犻櫎鍚庡皢鏃犳硶鎭㈠锛岃璋ㄦ厧鎿嶄綔锛�</view>
+            <view class="delete-countdown">
+              <view class="countdown-text">纭鎸夐挳灏嗗湪 <text class="countdown-number">{{ deleteCountdown }}</text> 绉掑悗鍙敤</view>
+              <view class="countdown-progress">
+                <view class="countdown-bar" :style="{ width: countdownProgress + '%' }"></view>
+              </view>
+            </view>
+          </div>
+          <div class="delete-confirm-actions">
+            <button class="delete-confirm-btn cancel-btn" @click="cancelDelete">鍙栨秷</button>
+            <button class="delete-confirm-btn confirm-btn" 
+              :disabled="deleteCountdown > 0" 
+              :class="{ 'disabled': deleteCountdown > 0 }"
+              @click="confirmDelete">纭鍒犻櫎</button>
+          </div>
+        </view>
+      </view>
+
   
     </view>
   </template>
@@ -446,7 +474,13 @@
         previewTitle: '',
         previewContent: '',
         previewType: '',
-        previewFileUrl: ''
+        previewFileUrl: '',
+        
+        // 鍒犻櫎纭鐩稿叧鏁版嵁
+        showDeleteConfirm: false,
+        deleteCountdown: 5,
+        countdownProgress: 0,
+        deleteTimer: null
 
       };
     },
@@ -511,6 +545,62 @@
         } else {
           return statusMap['rejected'] || '涓嶅悎鏍�';
         }
+      },
+      
+      getInspectionDescription(item) {
+        // 鍙朓TEM_MOD瀛楁鐨勫��
+        if (item.itemMod && item.itemMod.trim() !== '') {
+          return item.itemMod;
+        } else {
+          return '妫�楠岄」鐩鎯�';
+        }
+      },
+      
+      // 鏄剧ず鍒犻櫎纭寮圭獥
+      showDeleteConfirmDialog() {
+        this.showDeleteConfirm = true;
+        this.deleteCountdown = 5;
+        this.countdownProgress = 0;
+        this.startDeleteCountdown();
+      },
+      
+      // 寮�濮嬪�掕鏃�
+      startDeleteCountdown() {
+        this.deleteTimer = setInterval(() => {
+          this.deleteCountdown--;
+          this.countdownProgress = ((5 - this.deleteCountdown) / 5) * 100;
+          
+          if (this.deleteCountdown <= 0) {
+            clearInterval(this.deleteTimer);
+            this.deleteTimer = null;
+          }
+        }, 1000);
+      },
+      
+      // 鍙栨秷鍒犻櫎
+      cancelDelete() {
+        this.showDeleteConfirm = false;
+        if (this.deleteTimer) {
+          clearInterval(this.deleteTimer);
+          this.deleteTimer = null;
+        }
+        this.deleteCountdown = 5;
+        this.countdownProgress = 0;
+      },
+      
+      // 纭鍒犻櫎
+      confirmDelete() {
+        if (this.deleteCountdown > 0) {
+          return;
+        }
+        
+        this.showDeleteConfirm = false;
+        if (this.deleteTimer) {
+          clearInterval(this.deleteTimer);
+          this.deleteTimer = null;
+        }
+        
+        this.removeXJ();
       },
       
       removeXJ() {
@@ -767,16 +857,10 @@
                  pid: this.formData.id
                }
              }).then(res1 => {
-               let tableData = res1.data.tbBillList
-               //褰撳凡妫�楠屼釜鏁伴兘涓嶄负绌烘椂鎸夌収妫�娴嬬粨鏋勬帓搴�
+               let tableData = res1.data.tbBillList;
+               // 鎸塅ORDER搴忓彿鎺掑簭
                tableData.sort((a, b) => {
-                 if (a.result === '鏈畬鎴�' && b.result === '鍚堟牸') {
-                   return -1;
-                 } else if (a.result === '鍚堟牸' && b.result === '鏈畬鎴�') {
-                   return 1;
-                 } else {
-                   return 0;
-                 }
+                 return (a.forder || 0) - (b.forder || 0);
                });
                this.tableData = tableData;
                if (this.tableData.length === 0) {
@@ -872,10 +956,15 @@
               userNo: this.$loginInfo.account
             }
           }).then(res => {
-            if (res.data.tbBillList) {
+            if (res.status === 0 && res.data && res.data.tbBillList) {
               this.$showMessage("鎻愪氦鎴愬姛");
               this.init();
+            } else {
+              this.$showMessage(res.message || "鎻愪氦澶辫触");
             }
+          }).catch(err => {
+            console.error("鎻愪氦妫�楠屽け璐�:", err);
+            this.$showMessage(err.message || "鎻愪氦澶辫触锛岃閲嶈瘯");
           });
         }
       },
@@ -1450,7 +1539,8 @@
   <style scoped>
   /* 鍩虹鏍峰紡 */
   .container {
-    padding: 10px;
+    padding: 20px;
+    padding-bottom: 120px; /* 涓哄浐瀹氭寜閽暀鍑烘洿澶氱┖闂达紝閬垮厤閬洊妫�楠岄」鐩� */
     background-color: #f5f7fa;
     min-height: 100vh;
   }
@@ -1556,41 +1646,44 @@
     box-shadow: 0 2px 8px rgba(0, 0, 0, 0.1);
     margin: 25px 0;
   }
-  
+
   .inspection-table table {
     width: 100%;
     border-collapse: collapse;
   }
-  
+
   .inspection-table th {
-    background-color: #f8f9fa;
-    color: #34495e;
+    background: linear-gradient(135deg, #667eea 0%, #764ba2 100%);
+    color: white;
     padding: 12px 15px;
     font-weight: bold;
-    text-align: left;
-    border: 1px solid #ddd;
+    text-align: center;
+    border: none;
   }
-  
+
   .inspection-table td {
     padding: 12px 15px;
     text-align: left;
-    border: 1px solid #ddd;
+    border: none;
+    vertical-align: middle;
   }
-  
+
   .inspection-table tr:nth-child(even) {
     background-color: #f9f9f9;
   }
-  
+
   .inspection-table tr:hover {
     background-color: #f1f5f9;
+    transform: translateY(-1px);
+    box-shadow: 0 2px 8px rgba(0, 0, 0, 0.1);
   }
   
   /* 姘村嵃鏍峰紡 */
   .watermark {
     position: absolute;
-    font-size: 40px;
+    font-size: 32px;
     font-weight: bold;
-    opacity: 1;
+    opacity: 0.8;
     z-index: 1;
     pointer-events: none;
     transform: rotate(-15deg);
@@ -1600,15 +1693,15 @@
     left: 50%;
     transform: translate(-50%, -50%) rotate(-15deg);
   }
-  
+
   .watermark.approved {
     color: #2ecc71;
   }
-  
+
   .watermark.rejected {
     color: #e74c3c;
   }
-  
+
   .watermark.pending {
     color: #f39c12;
   }
@@ -1622,10 +1715,11 @@
   }
   
   /* 璋冩暣琛ㄦ牸鍗曞厓鏍� */
-  .inspection-table td:nth-child(2) {
+  .inspection-table td:nth-child(3) {
     position: relative;
     overflow: hidden;
     padding: 0;
+    min-height: 80px;
   }
   
   .record-btn {
@@ -1646,55 +1740,111 @@
   
   /* 鎿嶄綔鎸夐挳 */
   .action-buttons {
+    position: fixed;
+    bottom: 0;
+    left: 0;
+    right: 0;
+    background-color: white;
+    border-top: 1px solid #e9ecef;
+    padding: 12px;
+    box-shadow: 0 -2px 10px rgba(0, 0, 0, 0.1);
+    z-index: 1000;
     display: flex;
-    flex-direction: column;
-    gap: 10px;
-    margin-bottom: 20px;
+    flex-wrap: wrap;
+    gap: 8px;
+    justify-content: center;
+    align-items: center;
   }
   
   .action-btn {
-    padding: 12px 20px;
+    background-color: #ecf0f1;
+    color: #34495e;
+    padding: 12px 15px;
     border: none;
     border-radius: 6px;
-    font-size: 14px;
-    font-weight: 500;
     cursor: pointer;
-    transition: all 0.2s;
+    font-size: 12px;
+    font-weight: 500;
+    transition: all 0.3s ease;
+    text-align: center;
+    min-height: 44px;
+    display: flex;
+    align-items: center;
+    justify-content: center;
+    white-space: nowrap;
+    flex-shrink: 0;
+    min-width: 80px;
+    max-width: 120px;
+    flex: 1;
   }
-  
+
+  .action-btn:hover {
+    background-color: #d5dbdb;
+    transform: translateY(-1px);
+  }
+
   .action-btn.primary {
     background-color: #3498db;
-    color: white;
+    color: #fff;
   }
-  
+
+  .action-btn.primary:hover {
+    background-color: #2980b9;
+  }
+
   .action-btn.secondary {
-    background-color: #95a5a6;
-    color: white;
+    background-color: #ecf0f1;
+    color: #34495e;
   }
-  
+
+  .action-btn.secondary:hover {
+    background-color: #d5dbdb;
+  }
+
   .action-btn.danger {
     background-color: #e74c3c;
-    color: white;
+    color: #fff;
   }
-  
+
+  .action-btn.danger:hover {
+    background-color: #c0392b;
+  }
+
   .action-btn.warning {
     background-color: #f39c12;
-    color: white;
+    color: #fff;
   }
-  
+
+  .action-btn.warning:hover {
+    background-color: #e67e22;
+  }
+
   .action-btn.success {
     background-color: #2ecc71;
-    color: white;
+    color: #fff;
   }
-  
+
+  .action-btn.success:hover {
+    background-color: #27ae60;
+  }
+
   .action-btn.info {
     background-color: #17a2b8;
-    color: white;
+    color: #fff;
+  }
+
+  .action-btn.info:hover {
+    background-color: #138496;
   }
   
   .action-btn.small {
-    padding: 6px 12px;
+    padding: 10px 12px;
     font-size: 12px;
+    min-height: 44px;
+    white-space: nowrap;
+    flex-shrink: 0;
+    min-width: 80px;
+    max-width: 120px;
   }
   
   /* 寮瑰嚭妗嗘牱寮� */
@@ -2315,12 +2465,37 @@
 
   /* 鍝嶅簲寮忚璁� */
   @media (max-width: 768px) {
+    .container {
+      padding-bottom: 120px; /* 涓哄浐瀹氭寜閽暀鍑虹┖闂达紝閬垮厤閬洊妫�楠岄」鐩� */
+    }
+    
     .info-grid {
       grid-template-columns: 1fr;
     }
     
     .action-buttons {
-      flex-direction: column;
+      flex-direction: row;
+      align-items: center;
+      justify-content: center;
+      padding: 8px;
+      gap: 6px;
+    }
+    
+    .action-btn {
+      min-width: 70px;
+      max-width: 100px;
+      padding: 8px 10px;
+      font-size: 11px;
+      min-height: 40px;
+      flex: 1;
+    }
+    
+    .action-btn.small {
+      min-width: 70px;
+      max-width: 100px;
+      padding: 8px 10px;
+      font-size: 11px;
+      min-height: 40px;
     }
     
     /* 闄勪欢寮圭獥鍝嶅簲寮� */
@@ -2377,9 +2552,7 @@
     .attachment-icon {
       font-size: 20px;
     }
-  }
-  
-  @media (max-width: 480px) {
+    
     .attachment-popup-content {
       padding: 16px;
     }
@@ -2404,4 +2577,145 @@
       font-size: 28px;
     }
   }
+
+  /* 鍒犻櫎纭寮圭獥鏍峰紡 */
+  .delete-confirm-popup {
+    width: 90vw;
+    max-width: 400px;
+    max-height: 70vh;
+    display: flex;
+    flex-direction: column;
+  }
+
+  .delete-confirm-title {
+    font-size: 20px;
+    font-weight: 700;
+    color: #e74c3c;
+    margin-bottom: 8px;
+    text-align: center;
+    letter-spacing: 1px;
+  }
+
+  .delete-confirm-divider {
+    height: 2px;
+    background: linear-gradient(90deg, #e74c3c 0%, #c0392b 100%);
+    margin-bottom: 20px;
+  }
+
+  .delete-confirm-content {
+    text-align: center;
+    margin-bottom: 20px;
+  }
+
+  .delete-warning-icon {
+    font-size: 48px;
+    margin-bottom: 16px;
+    animation: shake 0.5s ease-in-out infinite alternate;
+  }
+
+  @keyframes shake {
+    0% { transform: translateX(-2px); }
+    100% { transform: translateX(2px); }
+  }
+
+  .delete-warning-text {
+    font-size: 18px;
+    font-weight: 600;
+    color: #2c3e50;
+    margin-bottom: 8px;
+  }
+
+  .delete-warning-detail {
+    font-size: 14px;
+    color: #7f8c8d;
+    margin-bottom: 20px;
+    line-height: 1.4;
+  }
+
+  .delete-countdown {
+    background: #f8f9fa;
+    border-radius: 8px;
+    padding: 16px;
+    margin: 16px 0;
+    border: 1px solid #e9ecef;
+  }
+
+  .countdown-text {
+    font-size: 14px;
+    color: #495057;
+    margin-bottom: 8px;
+    text-align: center;
+  }
+
+  .countdown-number {
+    font-weight: 700;
+    color: #e74c3c;
+    font-size: 16px;
+  }
+
+  .countdown-progress {
+    width: 100%;
+    height: 6px;
+    background: #e9ecef;
+    border-radius: 3px;
+    overflow: hidden;
+  }
+
+  .countdown-bar {
+    height: 100%;
+    background: linear-gradient(90deg, #e74c3c, #c0392b);
+    border-radius: 3px;
+    transition: width 1s ease;
+  }
+
+  .delete-confirm-actions {
+    display: flex;
+    gap: 12px;
+    justify-content: center;
+  }
+
+  .delete-confirm-btn {
+    padding: 12px 24px;
+    border: none;
+    border-radius: 8px;
+    font-size: 16px;
+    font-weight: 600;
+    cursor: pointer;
+    transition: all 0.3s ease;
+    display: flex;
+    align-items: center;
+    justify-content: center;
+    min-width: 120px;
+    box-shadow: 0 2px 4px rgba(0, 0, 0, 0.1);
+  }
+
+  .delete-confirm-btn.cancel-btn {
+    background: linear-gradient(135deg, #95a5a6, #7f8c8d);
+    color: white;
+  }
+
+  .delete-confirm-btn.cancel-btn:hover {
+    background: linear-gradient(135deg, #7f8c8d, #6c7b7d);
+    transform: translateY(-1px);
+    box-shadow: 0 4px 8px rgba(0, 0, 0, 0.15);
+  }
+
+  .delete-confirm-btn.confirm-btn {
+    background: linear-gradient(135deg, #e74c3c, #c0392b);
+    color: white;
+  }
+
+  .delete-confirm-btn.confirm-btn:hover:not(.disabled) {
+    background: linear-gradient(135deg, #c0392b, #a93226);
+    transform: translateY(-1px);
+    box-shadow: 0 4px 8px rgba(0, 0, 0, 0.15);
+  }
+
+  .delete-confirm-btn.disabled {
+    background: #bdc3c7;
+    color: #7f8c8d;
+    cursor: not-allowed;
+    transform: none;
+    box-shadow: none;
+  }
   </style>
\ No newline at end of file

--
Gitblit v1.9.3