From 67d42a761ea34624cfb2de3cbb38f37a319d2631 Mon Sep 17 00:00:00 2001
From: xwt <2740516069@qq.com>
Date: 星期四, 25 九月 2025 19:16:23 +0800
Subject: [PATCH] SJ,XJ,RKJ优化

---
 pages/QC/RKJ/List.vue  |  115 ++
 pages/QC/XJ/Add.vue    |  230 ++++
 pages/QC/SJ/detail.vue |  906 +++++++++++++++++++
 pages/QC/RKJ/Add.vue   |  230 +++++
 pages/QC/SJ/Add.vue    | 1142 +++++++++++++++++++++++-
 pages/QC/XJ/List.vue   |  111 ++
 store/index.js         |    4 
 7 files changed, 2,656 insertions(+), 82 deletions(-)

diff --git a/pages/QC/RKJ/Add.vue b/pages/QC/RKJ/Add.vue
index dd65c69..3a0fa04 100644
--- a/pages/QC/RKJ/Add.vue
+++ b/pages/QC/RKJ/Add.vue
@@ -240,6 +240,7 @@
 				Bom鐢ㄦ枡娓呭崟
 			</button>
 			<button class="action-btn small" @click="viewAttachmentInfo">鏌ョ湅闄勪欢淇℃伅</button>
+			<button class="action-btn small danger" @click="showDeleteConfirmDialog" v-if="formData.id && formData.fsubmit != 1">鍒犻櫎鍗曟嵁</button>
 			<button class="action-btn small" @click="saveRemarks" v-if="formData.fsubmit != 1">娣诲姞涓嶅悎鏍兼弿杩�</button>
 			<button class="action-btn small primary" @click="submitInspection"
 				v-if="formData.fsubmit != 1 && tableData.length > 0">鎻愪氦妫�楠�</button>
@@ -419,6 +420,32 @@
 				</div>
 			</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>
 
@@ -499,6 +526,12 @@
 				workshopIndex: 0,
 				pstypeOptions: ['', '鐗归噰/璁╂浣跨敤', '鎸戦��/杩斿伐浣跨敤', '閫�璐�', '寰呭垽'],
 				pstypeIndex: 0,
+				
+				// 鍒犻櫎纭鐩稿叧鏁版嵁
+				showDeleteConfirm: false,
+				deleteCountdown: 5,
+				countdownProgress: 0,
+				deleteTimer: null,
 			};
 		},
 		onLoad(options) {
@@ -552,6 +585,53 @@
 				}
 			},
 
+			// 鏄剧ず鍒犻櫎纭寮圭獥
+			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() {
 				if (this.formData.id) {
 					this.$post({
@@ -2622,6 +2702,15 @@
 		background-color: #2980b9;
 	}
 
+	.action-btn.danger {
+		background-color: #e74c3c;
+		color: #fff;
+	}
+
+	.action-btn.danger:hover {
+		background-color: #c0392b;
+	}
+
 	/* 灏忓昂瀵告寜閽牱寮� */
 	.action-btn.small {
 		padding: 10px 12px;
@@ -3097,4 +3186,145 @@
 		flex-direction: column;
 		align-items: center;
 	}
+
+	/* 鍒犻櫎纭寮圭獥鏍峰紡 */
+	.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
diff --git a/pages/QC/RKJ/List.vue b/pages/QC/RKJ/List.vue
index 05350a0..6f84ac2 100644
--- a/pages/QC/RKJ/List.vue
+++ b/pages/QC/RKJ/List.vue
@@ -6,13 +6,26 @@
       <!-- 椤堕儴绛涢�夊尯 -->
       <view class="filter-section">
         <view class="filter-controls">
+          <!-- 鏌ヨ鏉′欢閫夋嫨鍣� -->
+          <view class="dropdown-filter">
+            <picker @change="onOptionsChange" :value="optionsIndex" :range="options">
+              <view class="picker">{{options[optionsIndex]}}</view>
+            </picker>
+          </view>
+          
+          <!-- 鎼滅储妗� -->
+          <view class="search-container">
+            <input class="search-input" v-model="searchValue" :placeholder="'璇疯緭鍏�'+options[optionsIndex]" @confirm="btnclicked" />
+            <button class="search-button" @click="btnclicked">鎼滅储</button>
+          </view>
+          
           <!-- 鐘舵�佸垏鎹㈡爣绛� -->
           <view class="status-tabs">
             <button :class="['tab-button', current === 0 ? 'active' : '']" @click="onClickItem({currentIndex: 0})">
-              {{items[0]}}
+              鏈彁浜�({{unsubmittedCount}})
             </button>
             <button :class="['tab-button', current === 1 ? 'active' : '']" @click="onClickItem({currentIndex: 1})">
-              {{items[1]}}
+              宸叉彁浜�({{submittedCount}})
             </button>
           </view>
         </view>
@@ -115,7 +128,15 @@
         totalCount: 0,
         noData: false, // 娌℃湁鏇村鏁版嵁浜�
         isLoading: false, // 鏄惁姝ｅ湪鍔犺浇
-        tipShow: false
+        tipShow: false,
+        searchValue: '',
+        // ===== 鏂板鎼滅储鍔熻兘鐩稿叧鏁版嵁 =====
+        optionsIndex: 0, // 褰撳墠閫夋嫨鐨勬煡璇㈡潯浠剁储寮�
+        options: ['宸ュ崟', '妫�楠屽崟鍙�', '浜х嚎', '鐗╂枡缂栫爜', '鐗╂枡鍚嶇О'], // 鏌ヨ鏉′欢閫夐」
+        selectedField: 'billNo', // 褰撳墠閫夋嫨鐨勬煡璇㈠瓧娈碉紝榛樿涓哄伐鍗�
+        // ===== 鏂板鏁伴噺缁熻鍙橀噺 =====
+        unsubmittedCount: 0, // 鏈彁浜ゆ暟閲�
+        submittedCount: 0 // 宸叉彁浜ゆ暟閲�
       };
     },
     onLoad() {
@@ -123,7 +144,30 @@
       this.init();
     },
     methods: {
-            init() {
+      // ===== 鏂板鏌ヨ鏉′欢閫夋嫨鏂规硶 =====
+      onOptionsChange(e) {
+        this.optionsIndex = e.detail.value;
+        // 鏍规嵁閫夋嫨鐨勯�夐」璁剧疆鎼滅储瀛楁
+        const fieldMap = {
+          0: 'billNo',     // 宸ュ崟
+          1: 'releaseNo',  // 妫�楠屽崟鍙�
+          2: 'daa015',     // 浜х嚎
+          3: 'itemNo',     // 鐗╂枡缂栫爜
+          4: 'itemName'    // 鐗╂枡鍚嶇О
+        };
+        this.selectedField = fieldMap[this.optionsIndex];
+      },
+      
+      //鎼滅储妗嗙偣鍑讳簨浠�
+      btnclicked() {
+        this.pageIndex = 1;
+        this.data = [];
+        this.init();
+      },
+      
+      init() {
+        //鑾峰彇鎼滅储鏉′欢鍐呭
+        let SearchValue = this.searchValue;
 
         let fsubmit = null; // 榛樿鏌ヨ鎵�鏈夋湭鎻愪氦鐨勮褰曪紙鍖呮嫭fsubmit = 0鍜宖submit涓虹┖锛�
         if (this.current == 1) {
@@ -141,7 +185,10 @@
             pageIndex: this.pageIndex,
             limit: this.limit,
             createUser: this.$loginInfo.account,
-            fsubmit: fsubmit
+            fsubmit: fsubmit,
+            SearchValue: SearchValue,
+            selectedIndex: this.optionsIndex, // 鏂板锛氭悳绱㈡潯浠剁储寮�
+            searchField: this.selectedField   // 鏂板锛氭悳绱㈠瓧娈靛悕
           }
         }).then(res => {
           if (this.pageIndex === 1) {
@@ -157,6 +204,13 @@
           }
           this.totalCount = res.data.totalCount;
           this.totalPage = Math.ceil(this.totalCount / this.limit);
+          
+          // 璁剧疆鏁伴噺缁熻 - 鍙傝�僗J鐨勫疄鐜版柟寮�
+          if (this.current === 1) {
+            this.submittedCount = res.data.totalCount;
+          } else {
+            this.unsubmittedCount = res.data.totalCount;
+          }
   
           this.noData = this.pageIndex >= this.totalPage;
           this.isLoading = false; // 缁撴潫鍔犺浇
@@ -164,6 +218,7 @@
           this.isLoading = false; // 鍑虹幇閿欒鏃剁粨鏉熷姞杞�
         });
       },
+      
       handleFabClick() {
         uni.navigateTo({
           url: 'Add?id'
@@ -231,8 +286,51 @@
   
   .filter-controls {
     display: flex;
-    justify-content: center;
-    align-items: center;
+    flex-wrap: wrap;
+    gap: 10px;
+  }
+
+  /* 鏌ヨ鏉′欢閫夋嫨鍣� */
+  .dropdown-filter {
+    min-width: 80px;
+    margin-right: 10px;
+  }
+
+  .picker {
+    padding: 8px 12px;
+    border: 1px solid #ddd;
+    border-radius: 4px;
+    background-color: white;
+    font-size: 14px;
+    min-width: 80px;
+  }
+
+  /* 鎼滅储妗嗘牱寮� */
+  .search-container {
+    display: flex;
+    flex: 1;
+    margin-right: 10px;
+    height: 36px;
+    min-width: 200px;
+  }
+
+  .search-input {
+    flex: 1;
+    padding: 8px 12px;
+    border: 1px solid #ddd;
+    border-radius: 4px 0 0 4px;
+    font-size: 14px;
+    background-color: white;
+  }
+
+  .search-button {
+    padding: 0 12px;
+    border: 1px solid #3498db;
+    border-radius: 0 4px 4px 0;
+    background-color: #3498db;
+    color: white;
+    font-size: 14px;
+    margin: 0;
   }
   
   .status-tabs {
@@ -240,7 +338,8 @@
     border-radius: 4px;
     overflow: hidden;
     background-color: #ecf0f1;
-    width: 300px;
+    flex: 1;
+    min-width: 200px;
   }
   
   .tab-button {
diff --git a/pages/QC/SJ/Add.vue b/pages/QC/SJ/Add.vue
index 558fd68..d60647b 100644
--- a/pages/QC/SJ/Add.vue
+++ b/pages/QC/SJ/Add.vue
@@ -123,10 +123,11 @@
 		<!-- 琛ㄥ崟涓嬫柟鎿嶄綔鎸夐挳鍖� -->
 		<view class="bottom-action-buttons">
 			<button class="action-btn small" v-if="!isUpdate && !isShowTable" @click="toImage">涓婁紶/鏌ョ湅鍥剧墖</button>
+			<button class="action-btn small" v-if="!isUpdate && !isShowTable" @click="viewAttachmentInfo">鏌ョ湅闄勪欢淇℃伅</button>
 			<button class="action-btn small" v-if="!isUpdate && !isShowTable" @click="fetchDrawingNumber(formData.itemNo)">璋冨彇PLM鍥剧焊</button>
 			<button class="action-btn small" v-if="!isUpdate && !isShowTable" @click="getBom">Bom鐢ㄦ枡娓呭崟</button>
 			<button class="action-btn small" v-if="!isUpdate && !isShowTable && formData.xjGenFlag == 0" @click="saveXJ">鐢熸垚宸℃</button>
-			<button class="action-btn small" v-if="false" @click="removeXJ">鍒犻櫎鍗曟嵁</button>
+			<button class="action-btn small danger" v-if="!isUpdate && !isShowTable && formData.fsubmit !== 1" @click="showDeleteConfirmDialog">鍒犻櫎鍗曟嵁</button>
 			<button class="action-btn small" v-if="!isUpdate && !isShowTable" @click="saveRemarks">娣诲姞涓嶅悎鏍兼弿杩�</button>
 			<button class="action-btn small" v-if="!isUpdate && formData.fsubmit == 0 && !isShowTable" @click="getGenUpdate">鑾峰彇妫�楠岄」鐩�</button>
 			<button class="action-btn small primary" v-if="!isUpdate && formData.fsubmit ==0 && !isShowTable" @click="submitInspection">鎻愪氦妫�楠�</button>
@@ -204,6 +205,194 @@
 				</view>
 			</view>
 		</view>
+
+		<!-- 闄勪欢鍒楄〃寮圭獥 -->
+		<view v-if="showAttachmentPopup" class="overlay">
+			<view class="popup attachment-list-popup">
+				<div class="attachment-popup-header">
+					<h3 class="attachment-popup-title">闄勪欢鍒楄〃</h3>
+					<button class="attachment-close-btn" @click="closeAttachmentPopup">鍏抽棴</button>
+				</div>
+				
+				<div class="attachment-popup-content">
+					<div v-if="attachmentsLoading" class="attachment-loading">
+						<div class="loading-spinner"></div>
+						<span class="loading-text">姝ｅ湪鍔犺浇闄勪欢...</span>
+					</div>
+					
+					<div v-else-if="attachments.length === 0" class="attachment-empty">
+						<div class="empty-icon">馃搧</div>
+						<div class="empty-text">鏆傛棤闄勪欢</div>
+						<div class="empty-hint">璇ョ墿鏂欐殏鏈笂浼犱换浣曢檮浠�</div>
+					</div>
+					
+					<div v-else class="attachment-list">
+						<div v-for="item in attachments" :key="item.id" class="attachment-item">
+							<div class="attachment-info">
+								<div class="file-type-badge" :class="getFileTypeClass(item.fattach)">
+									{{ getFileTypeIcon(item.fattach) }}
+								</div>
+								<div class="attachment-details">
+									<div class="attachment-name" @click="showAttachmentDetailDialog(item)">
+										{{ item.fattach }}
+									</div>
+									<div class="attachment-meta">
+										<span class="meta-type">{{ item.ftype || '鏈煡绫诲瀷' }}</span>
+										<span v-if="item.fversion" class="meta-version">v{{ item.fversion }}</span>
+										<span v-if="item.fdate" class="meta-date">{{ formatDate(item.fdate) }}</span>
+									</div>
+								</div>
+							</div>
+							
+							<div class="attachment-actions">
+								<button class="btn-secondary" @click="showAttachmentDetailDialog(item)">璇︽儏</button>
+								<button v-if="isPreviewable(item.fattach)" 
+									class="btn-primary" 
+									@click="previewFtpFile(item)">棰勮</button>
+								<button class="btn-success" @click="downloadAttachment(item)">涓嬭浇</button>
+							</div>
+						</div>
+					</div>
+				</div>
+			</view>
+		</view>
+
+		<!-- 闄勪欢璇︽儏寮圭獥 -->
+		<view v-if="showAttachmentDetail" class="overlay">
+			<view class="popup attachment-detail-popup">
+				<div class="attachment-popup-header">
+					<h3 class="attachment-popup-title">闄勪欢璇︽儏</h3>
+					<button class="attachment-close-btn" @click="closeAttachmentDetail">杩斿洖</button>
+				</div>
+				
+				<div class="attachment-popup-content">
+					<div v-if="selectedAttachment" class="attachment-detail-content">
+						<div class="attachment-detail-header">
+							<div class="file-type-badge large" :class="getFileTypeClass(selectedAttachment.fattach)">
+								{{ getFileTypeIcon(selectedAttachment.fattach) }}
+							</div>
+							<div class="attachment-detail-title">
+								{{ selectedAttachment.fattach }}
+							</div>
+						</div>
+						
+						<div class="attachment-detail-info">
+							<div class="info-row">
+								<div class="info-item">
+									<text class="info-label">ID</text>
+									<text class="info-content">{{ Math.trunc(selectedAttachment.id) }}</text>
+								</div>
+								<div class="info-item">
+									<text class="info-label">绫诲瀷</text>
+									<text class="info-content">{{ selectedAttachment.ftype || '鏈煡绫诲瀷' }}</text>
+								</div>
+							</div>
+							
+							<div class="info-row" v-if="selectedAttachment.fversion">
+								<div class="info-item">
+									<text class="info-label">鐗堟湰</text>
+									<text class="info-content">{{ selectedAttachment.fversion }}</text>
+								</div>
+								<div class="info-item" v-if="selectedAttachment.fdate">
+									<text class="info-label">鍙楁帶鏃ユ湡</text>
+									<text class="info-content">{{ formatDate(selectedAttachment.fdate) }}</text>
+								</div>
+							</div>
+							
+							<div class="info-row" v-if="selectedAttachment.createBy">
+								<div class="info-item">
+									<text class="info-label">涓婁紶浜�</text>
+									<text class="info-content">{{ selectedAttachment.createBy }}</text>
+								</div>
+								<div class="info-item" v-if="selectedAttachment.createDate">
+									<text class="info-label">涓婁紶鏃堕棿</text>
+									<text class="info-content">{{ formatDate(selectedAttachment.createDate) }}</text>
+								</div>
+							</div>
+						</div>
+						
+						<div class="attachment-detail-actions">
+							<button v-if="isPreviewable(selectedAttachment.fattach)" 
+								class="btn-primary" 
+								@click="previewFtpFile(selectedAttachment)">棰勮</button>
+							<button class="btn-success" @click="downloadAttachment(selectedAttachment)">涓嬭浇</button>
+						</div>
+					</div>
+					<div v-else class="attachment-detail-empty">
+						<div class="empty-icon">鉂�</div>
+						<div class="empty-text">鏆傛棤闄勪欢淇℃伅</div>
+					</div>
+				</div>
+			</view>
+		</view>
+
+		<!-- 鏂囦欢棰勮寮圭獥 -->
+		<view v-if="showFilePreviewPopup" class="overlay">
+			<view class="popup file-preview-popup">
+				<h3 class="file-preview-title">{{ previewTitle }}</h3>
+				<div class="file-preview-divider"></div>
+				<div class="file-preview-content">
+					<!-- 鏂囨湰鍐呭棰勮 -->
+					<pre v-if="previewType === 'text'">{{ previewContent }}</pre>
+					
+					<!-- 鍥剧墖鍐呭棰勮 -->
+					<view v-else-if="previewType === 'image'" class="image-preview-container">
+						<image 
+							:src="previewContent" 
+							mode="aspectFit" 
+							class="preview-image-clickable"
+							@click="previewImageInPopup"
+							style="width: 100%; max-height: 400px; cursor: pointer;"
+						/>
+						<div class="image-zoom-hint">鐐瑰嚮鍥剧墖鍙斁澶ф煡鐪�</div>
+					</view>
+					
+					<!-- Excel 绛� Office 鏂囦欢鎻愮ず -->
+					<view v-else-if="previewType === 'excel'" class="unsupported-preview">
+						<view class="unsupported-icon">馃搳</view>
+						<view class="unsupported-text">Excel 鏂囦欢鏆備笉鏀寔鍦ㄧ嚎棰勮</view>
+						<view class="unsupported-hint">璇风偣鍑讳笅杞芥寜閽幏鍙栧畬鏁存枃浠�</view>
+					</view>
+					
+					<!-- 涓嶆敮鎸佺殑鏂囦欢绫诲瀷 -->
+					<view v-else class="unsupported-preview">
+						<view class="unsupported-icon">馃搫</view>
+						<view class="unsupported-text">姝ゆ枃浠舵牸寮忔殏涓嶆敮鎸侀瑙�</view>
+						<view class="unsupported-hint">璇风偣鍑讳笅杞芥寜閽幏鍙栧畬鏁存枃浠�</view>
+					</view>
+				</div>
+				<div class="file-preview-actions">
+					<button v-if="previewType !== 'text'" class="file-preview-btn download-btn" @click="downloadPreviewFile">馃摜 涓嬭浇鏂囦欢</button>
+					<button class="file-preview-btn close-btn" @click="closeFilePreview">鍏抽棴</button>
+				</div>
+			</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>
 <script>
@@ -224,6 +413,8 @@
 					statusUser: "",
 					SJ_MJ: '棣栨',
 					fsubmit:"",
+					mnum: 1,  // 娣诲姞 mnum 瀛楁
+					dnum: "", // 娣诲姞 dnum 瀛楁
 				},
 
 				DAA020List: [],
@@ -256,6 +447,24 @@
 
 				SJ_MJList: ['棣栨', '鏈'],
 				SJ_MJIndex: 0,
+				
+				// 闄勪欢鐩稿叧鏁版嵁
+				showAttachmentPopup: false,
+				showAttachmentDetail: false,
+				showFilePreviewPopup: false,
+				attachments: [],
+				attachmentsLoading: false,
+				selectedAttachment: null,
+				previewTitle: '',
+				previewContent: '',
+				previewType: '',
+				previewFileUrl: '',
+				
+				// 鍒犻櫎纭鐩稿叧鏁版嵁
+				showDeleteConfirm: false,
+				deleteCountdown: 5,
+				countdownProgress: 0,
+				deleteTimer: null
 			};
 		},
 		onLoad(options) {
@@ -322,6 +531,53 @@
 					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() {
 				if (this.formData.id) {
 					this.$post({
@@ -372,7 +628,17 @@
 					}).then(res => {
 						let tbBillListElement = res.data.tbBillList[0];
 						if (tbBillListElement) {
+							// 淇濈暀鍘熸湁鐨� mnum 鍜� dnum 榛樿鍊�
+							const originalMnum = this.formData.mnum;
+							const originalDnum = this.formData.dnum;
 							this.formData = tbBillListElement;
+							// 濡傛灉鍚庣娌℃湁杩斿洖杩欎簺瀛楁锛屼娇鐢ㄩ粯璁ゅ��
+							if (this.formData.mnum === undefined || this.formData.mnum === null) {
+								this.formData.mnum = originalMnum || 1;
+							}
+							if (this.formData.dnum === undefined || this.formData.dnum === null) {
+								this.formData.dnum = originalDnum || "";
+							}
 							this.$post({
 								url: "/SJ/getQSItems",
 								data: {
@@ -955,64 +1221,267 @@
 					return;
 				}
 				
-				// 鍏堣幏鍙栨楠屽崟鐨勮缁嗕俊鎭紝鍖呭惈mnum鍜宒num
+				// 鍙傛暟楠岃瘉
+				if (!this.$loginInfo.account) {
+					this.$showMessage("鐢ㄦ埛淇℃伅涓嶅畬鏁达紝鏃犳硶鑾峰彇妫�楠岄」鐩�");
+					return;
+				}
+				
+				// 鐩存帴浣跨敤 formData 涓殑鍊�
+				const requestData = {
+					id: this.formData.id,
+					no: this.formData.billNo,
+					user: this.$loginInfo.account,
+					mnum: this.formData.mnum || 1,
+					dnum: this.formData.dnum || null
+				};
+				
+				// 娣诲姞璋冭瘯鏃ュ織
+				console.log("SJ GenUpdate 璇锋眰鍙傛暟:", requestData);
+				
 				this.$post({
-					url: "/SJ/getQSItems",
-					data: {
-						pid: this.formData.id
-					}
-				}).then(res => {
-					if (res.data.tbBillList && res.data.tbBillList.length > 0) {
-						// 浠庣涓�涓楠岄」鐩腑鑾峰彇mnum鍜宒num
-						const firstItem = res.data.tbBillList[0];
-						const mnum = firstItem.mnum || 1;
-						const dnum = firstItem.dnum || "";
-						
-						// 璋冪敤GenUpdate
-						this.$post({
-							url: "/SJ/GenUpdate",
-							data: {
-								id: this.formData.id,
-								no: this.formData.billNo,
-								user: this.$loginInfo.account,
-								mnum: mnum,
-								dnum: dnum
-							}
-						}).then(genRes => {
-							if (genRes.data.result === 0) {
-								this.$showMessage("鑾峰彇妫�楠岄」鐩垚鍔�");
-								this.init();
-								// 鑾峰彇鎴愬姛鍚庣洿鎺ヨ繘鍏ュ～鍐欓樁娈�
-								this.isShowTable = false;
-								this.isUpdate = false;
-							} else {
-								this.$showMessage(genRes.data.message || "鑾峰彇澶辫触");
-							}
-						});
+					url: "/SJ/GenUpdate",
+					data: requestData
+				}).then(genRes => {
+					console.log("SJ GenUpdate 鍝嶅簲:", genRes);
+					if (genRes.data.result === 0) {
+						this.$showMessage("鑾峰彇妫�楠岄」鐩垚鍔�");
+						this.init();
+						// 鑾峰彇鎴愬姛鍚庣洿鎺ヨ繘鍏ュ～鍐欓樁娈�
+						this.isShowTable = false;
+						this.isUpdate = false;
 					} else {
-						// 濡傛灉娌℃湁妫�楠岄」鐩紝浣跨敤榛樿鍊�
-						this.$post({
-							url: "/SJ/GenUpdate",
-							data: {
-								id: this.formData.id,
-								no: this.formData.billNo,
-								user: this.$loginInfo.account,
-								mnum: 1,
-								dnum: ""
-							}
-						}).then(genRes => {
-							if (genRes.data.result === 0) {
-								this.$showMessage("鑾峰彇妫�楠岄」鐩垚鍔�");
-								this.init();
-								// 鑾峰彇鎴愬姛鍚庣洿鎺ヨ繘鍏ュ～鍐欓樁娈�
-								this.isShowTable = false;
-								this.isUpdate = false;
-							} else {
-								this.$showMessage(genRes.data.message || "鑾峰彇澶辫触");
-							}
+						this.$showMessage(genRes.data.message || "鑾峰彇澶辫触");
+					}
+				}).catch(err => {
+					console.error("SJ GenUpdate 閿欒:", err);
+					this.$showMessage("鑾峰彇妫�楠岄」鐩け璐ワ細" + (err.message || "鏈煡閿欒"));
+				});
+			},
+			
+			// 闄勪欢鐩稿叧鏂规硶
+			viewAttachmentInfo() {
+				this.showAttachmentPopup = true;
+				this.attachmentsLoading = true;
+				this.attachments = [];
+				this.$post({
+					url: "/SJ/getAttachments",
+					data: { itemNo: this.formData.itemNo }
+				}).then(res => {
+					this.attachmentsLoading = false;
+					if (res.status === 0) {
+						this.attachments = res.data.tbBillList;
+						// 涓烘瘡涓檮浠惰缃粯璁ゅ彲鐢ㄧ姸鎬�
+						this.attachments.forEach((item, index) => {
+							this.$set(item, 'ftpAvailable', true);
+							this.$set(item, 'checking', false);
 						});
+					} else if (res.status === 1 && res.message === "璇ユ楠屽崟鏈笂浼犻檮浠朵俊鎭紒") {
+						uni.showToast({ title: res.message, icon: "none" });
+					} else {
+						uni.showToast({ title: "鑾峰彇闄勪欢澶辫触", icon: "none" });
 					}
 				});
+			},
+			
+			closeAttachmentPopup() {
+				this.showAttachmentPopup = false;
+			},
+			
+			showAttachmentDetailDialog(item) {
+				this.selectedAttachment = item;
+				this.showAttachmentPopup = false;
+				this.showAttachmentDetail = true;
+			},
+			
+			closeAttachmentDetail() {
+				this.showAttachmentDetail = false;
+				this.selectedAttachment = null;
+				this.showAttachmentPopup = true;
+			},
+			
+			isPreviewable(filename) {
+				if (!filename) return false;
+				const ext = filename.trim().split('.').pop().toLowerCase();
+				return [
+					'pdf',
+					'jpg', 'jpeg', 'png', 'gif', 'bmp', 'webp',
+					'txt', 'log', 'md',
+					'doc', 'docx',
+					'xls', 'xlsx',
+					'ppt', 'pptx',
+					'csv'
+				].includes(ext);
+			},
+			
+			// 鑾峰彇鏂囦欢绫诲瀷鍥炬爣
+			getFileTypeIcon(filename) {
+				if (!filename) return '馃搫';
+				const ext = filename.trim().split('.').pop().toLowerCase();
+				const iconMap = {
+					'pdf': '馃摃',
+					'jpg': '馃柤锔�', 'jpeg': '馃柤锔�', 'png': '馃柤锔�', 'gif': '馃柤锔�', 'bmp': '馃柤锔�', 'webp': '馃柤锔�',
+					'txt': '馃摑', 'log': '馃摑', 'md': '馃摑',
+					'doc': '馃摌', 'docx': '馃摌',
+					'xls': '馃搳', 'xlsx': '馃搳',
+					'ppt': '馃摍', 'pptx': '馃摍',
+					'csv': '馃搳',
+					'zip': '馃摝', 'rar': '馃摝', '7z': '馃摝',
+					'dwg': '馃彈锔�', 'dxf': '馃彈锔�'
+				};
+				return iconMap[ext] || '馃搫';
+			},
+			
+			// 鑾峰彇鏂囦欢绫诲瀷CSS绫�
+			getFileTypeClass(filename) {
+				if (!filename) return 'file-unknown';
+				const ext = filename.trim().split('.').pop().toLowerCase();
+				const classMap = {
+					'pdf': 'file-pdf',
+					'jpg': 'file-image', 'jpeg': 'file-image', 'png': 'file-image', 'gif': 'file-image', 'bmp': 'file-image', 'webp': 'file-image',
+					'txt': 'file-text', 'log': 'file-text', 'md': 'file-text',
+					'doc': 'file-word', 'docx': 'file-word',
+					'xls': 'file-excel', 'xlsx': 'file-excel',
+					'ppt': 'file-powerpoint', 'pptx': 'file-powerpoint',
+					'csv': 'file-excel',
+					'zip': 'file-archive', 'rar': 'file-archive', '7z': 'file-archive',
+					'dwg': 'file-cad', 'dxf': 'file-cad'
+				};
+				return classMap[ext] || 'file-unknown';
+			},
+			
+			// 鏍煎紡鍖栨棩鏈�
+			formatDate(dateString) {
+				if (!dateString) return '';
+				try {
+					const date = new Date(dateString);
+					return date.toLocaleDateString('zh-CN', {
+						year: 'numeric',
+						month: '2-digit',
+						day: '2-digit',
+						hour: '2-digit',
+						minute: '2-digit'
+					});
+				} catch (e) {
+					return dateString;
+				}
+			},
+			
+			downloadAttachment(item) {
+				const fileName = item.fattach.replace(/[\s\u3000\r\n]+/g, '').trim();
+				const downloadUrl = this.$store.state.serverInfo.serverAPI + "/SJ/DownloadFtpFile?itemNo=" + 
+					encodeURIComponent(item.itemNo) + "&fileName=" + encodeURIComponent(fileName) + 
+					"&ftpServer=" + encodeURIComponent(this.$store.state.serverInfo.ftpServer);
+				
+				uni.downloadFile({
+					url: downloadUrl,
+					success: (res) => {
+						if (res.statusCode === 200) {
+							uni.showToast({ title: '涓嬭浇鎴愬姛', icon: 'success' });
+						} else {
+							uni.showToast({ title: '涓嬭浇澶辫触', icon: 'none' });
+						}
+					},
+					fail: (err) => {
+						console.error('涓嬭浇澶辫触锛�', err);
+						uni.showToast({ title: '涓嬭浇澶辫触锛岃閲嶈瘯', icon: 'none' });
+					}
+				});
+			},
+			
+			previewFtpFile(item) {
+				const fileName = item.fattach.replace(/[\s\u3000\r\n]+/g, '').trim();
+				const fileExt = fileName.split('.').pop().toLowerCase();
+				
+				if (!this.isPreviewable(fileName)) {
+					uni.showModal({
+						title: '涓嶆敮鎸侀瑙�',
+						content: '璇ユ枃浠剁被鍨嬩笉鏀寔鍦ㄧ嚎棰勮锛岃涓嬭浇鍚庢煡鐪�',
+						showCancel: false
+					});
+					return;
+				}
+				
+				const previewUrl = this.$store.state.serverInfo.serverAPI + "/SJ/PreviewFtpFile?itemNo=" + 
+					encodeURIComponent(item.itemNo) + "&fileName=" + encodeURIComponent(fileName) + 
+					"&ftpServer=" + encodeURIComponent(this.$store.state.serverInfo.ftpServer);
+				
+				if (['pdf'].includes(fileExt)) {
+					this.previewPdfFile(previewUrl, fileName);
+				} else if (['jpg', 'jpeg', 'png', 'gif', 'bmp'].includes(fileExt)) {
+					this.previewImageFile(previewUrl, fileName);
+				} else if (['txt'].includes(fileExt)) {
+					this.previewTextFile(previewUrl, fileName);
+				} else {
+					this.previewOfficeFile(previewUrl, fileName);
+				}
+			},
+			
+			previewPdfFile(url, fileName) {
+				this.previewTitle = fileName;
+				this.previewContent = url;
+				this.previewType = 'pdf';
+				this.previewFileUrl = url;
+				this.showFilePreviewPopup = true;
+				this.showAttachmentDetail = false;
+			},
+			
+			previewImageFile(url, fileName) {
+				this.previewTitle = fileName;
+				this.previewContent = url;
+				this.previewType = 'image';
+				this.previewFileUrl = url;
+				this.showFilePreviewPopup = true;
+				this.showAttachmentDetail = false;
+			},
+			
+			previewTextFile(url, fileName) {
+				this.previewTitle = fileName;
+				this.previewType = 'text';
+				this.previewFileUrl = url;
+				this.showFilePreviewPopup = true;
+				this.showAttachmentDetail = false;
+				
+				uni.request({
+					url: url,
+					method: 'GET',
+					success: (res) => {
+						this.previewContent = res.data;
+					},
+					fail: (err) => {
+						this.previewContent = '棰勮澶辫触锛岃涓嬭浇鍚庢煡鐪�';
+					}
+				});
+			},
+			
+			previewOfficeFile(url, fileName) {
+				this.previewTitle = fileName;
+				this.previewContent = '';
+				this.previewType = 'excel';
+				this.previewFileUrl = url;
+				this.showFilePreviewPopup = true;
+				this.showAttachmentDetail = false;
+			},
+			
+			closeFilePreview() {
+				this.showFilePreviewPopup = false;
+				this.showAttachmentDetail = true;
+			},
+			
+			downloadPreviewFile() {
+				if (this.previewFileUrl && this.selectedAttachment) {
+					this.downloadAttachment(this.selectedAttachment);
+				}
+			},
+			
+			previewImageInPopup() {
+				// 鍦ㄦ柊绐楀彛涓墦寮�鍥剧墖杩涜鏀惧ぇ鏌ョ湅
+				if (this.previewContent) {
+					uni.previewImage({
+						urls: [this.previewContent],
+						current: this.previewContent
+					});
+				}
 			}
 		},
 		onShow() {
@@ -1326,6 +1795,15 @@
   background-color: #2980b9;
 }
 
+.action-btn.danger {
+  background-color: #e74c3c;
+  color: #fff;
+}
+
+.action-btn.danger:hover {
+  background-color: #c0392b;
+}
+
 /* 灏忓昂瀵告寜閽牱寮� */
 .action-btn.small {
   padding: 10px 12px;
@@ -1475,4 +1953,560 @@
 		overflow-x: auto;
 	}
 }
+
+/* 闄勪欢鐩稿叧鏍峰紡 */
+.attachment-list-popup {
+	width: 80vw;
+	max-width: 800px;
+	max-height: 85vh;
+}
+
+.attachment-detail-popup {
+	width: 70vw;
+	max-width: 600px;
+}
+
+.attachment-popup-header {
+	padding: 16px;
+	border-bottom: 1px solid #eee;
+	display: flex;
+	justify-content: space-between;
+	align-items: center;
+	background-color: white;
+}
+
+.attachment-popup-title {
+	font-size: 16px;
+	font-weight: 600;
+	color: #2c3e50;
+	margin: 0;
+}
+
+.attachment-close-btn {
+	padding: 8px 16px;
+	border: 1px solid #ddd;
+	border-radius: 4px;
+	background-color: white;
+	font-size: 14px;
+	transition: all 0.2s;
+	color: #2c3e50;
+}
+
+.attachment-close-btn:hover {
+	background-color: #f8f9fa;
+}
+
+.attachment-popup-content {
+	padding: 16px;
+	max-height: 60vh;
+	overflow-y: auto;
+}
+
+/* 鍔犺浇鐘舵�� */
+.attachment-loading {
+	display: flex;
+	flex-direction: column;
+	align-items: center;
+	justify-content: center;
+	padding: 40px 20px;
+	gap: 16px;
+}
+
+.loading-spinner {
+	width: 32px;
+	height: 32px;
+	border: 3px solid #f3f3f3;
+	border-top: 3px solid #3498db;
+	border-radius: 50%;
+	animation: spin 1s linear infinite;
+}
+
+@keyframes spin {
+	0% { transform: rotate(0deg); }
+	100% { transform: rotate(360deg); }
+}
+
+.loading-text {
+	font-size: 14px;
+	color: #7f8c8d;
+}
+
+/* 绌虹姸鎬� */
+.attachment-empty {
+	display: flex;
+	flex-direction: column;
+	align-items: center;
+	justify-content: center;
+	padding: 40px 20px;
+	gap: 12px;
+	text-align: center;
+}
+
+.empty-icon {
+	font-size: 36px;
+	opacity: 0.6;
+}
+
+.empty-text {
+	font-size: 16px;
+	color: #7f8c8d;
+	font-weight: 500;
+}
+
+.empty-hint {
+	font-size: 14px;
+	color: #95a5a6;
+}
+
+/* 闄勪欢鍒楄〃甯冨眬 */
+.attachment-list {
+	display: flex;
+	flex-direction: column;
+	gap: 16px;
+}
+
+.attachment-item {
+	background-color: white;
+	border-radius: 8px;
+	box-shadow: 0 2px 10px rgba(0, 0, 0, 0.05);
+	overflow: hidden;
+	transition: all 0.3s;
+	border: 1px solid #eee;
+}
+
+.attachment-item:hover {
+	box-shadow: 0 4px 15px rgba(0, 0, 0, 0.1);
+}
+
+.attachment-info {
+	padding: 16px;
+	border-bottom: 1px solid #eee;
+	display: flex;
+	align-items: center;
+	gap: 16px;
+}
+
+.file-type-badge {
+	width: 40px;
+	height: 40px;
+	border-radius: 8px;
+	display: flex;
+	align-items: center;
+	justify-content: center;
+	font-size: 20px;
+	background: #f8f9fa;
+	border: 2px solid #e9ecef;
+	flex-shrink: 0;
+}
+
+.file-type-badge.large {
+	width: 56px;
+	height: 56px;
+	font-size: 28px;
+}
+
+.file-type-badge.file-pdf { background: #ffe6e6; border-color: #ffcccc; }
+.file-type-badge.file-image { background: #e6f3ff; border-color: #cce7ff; }
+.file-type-badge.file-text { background: #e6ffe6; border-color: #ccffcc; }
+.file-type-badge.file-word { background: #e6f0ff; border-color: #cce0ff; }
+.file-type-badge.file-excel { background: #e6ffe6; border-color: #ccffcc; }
+.file-type-badge.file-powerpoint { background: #fff0e6; border-color: #ffe0cc; }
+.file-type-badge.file-archive { background: #f0e6ff; border-color: #e0ccff; }
+.file-type-badge.file-cad { background: #e6fff0; border-color: #ccffe0; }
+.file-type-badge.file-unknown { background: #f5f5f5; border-color: #e0e0e0; }
+
+.attachment-details {
+	flex: 1;
+	min-width: 0;
+}
+
+.attachment-name {
+	font-size: 16px;
+	font-weight: 600;
+	color: #2c3e50;
+	cursor: pointer;
+	overflow: hidden;
+	text-overflow: ellipsis;
+	white-space: nowrap;
+	margin-bottom: 8px;
+	transition: color 0.2s;
+}
+
+.attachment-name:hover {
+	color: #3498db;
+}
+
+.attachment-meta {
+	display: flex;
+	gap: 16px;
+	font-size: 12px;
+	color: #95a5a6;
+}
+
+.meta-type {
+	background-color: #ecf0f1;
+	padding: 2px 6px;
+	border-radius: 10px;
+	color: #7f8c8d;
+}
+
+.meta-version {
+	background-color: #e8f5e8;
+	padding: 2px 6px;
+	border-radius: 10px;
+	color: #2e7d32;
+}
+
+.meta-date {
+	background-color: #fff3e0;
+	padding: 2px 6px;
+	border-radius: 10px;
+	color: #f57c00;
+}
+
+.attachment-actions {
+	padding: 12px 16px;
+	border-top: 1px solid #eee;
+	display: flex;
+	gap: 8px;
+	background-color: #f8f9fa;
+}
+
+/* 鎸夐挳鏍峰紡 */
+.btn-secondary {
+	padding: 8px 16px;
+	border: 1px solid #ddd;
+	border-radius: 4px;
+	background-color: white;
+	font-size: 14px;
+	transition: all 0.2s;
+	color: #2c3e50;
+	flex: 1;
+}
+
+.btn-secondary:hover {
+	background-color: #f8f9fa;
+}
+
+.btn-primary {
+	padding: 8px 16px;
+	border: 1px solid #3498db;
+	border-radius: 4px;
+	background-color: #3498db;
+	color: white;
+	font-size: 14px;
+	transition: all 0.2s;
+	flex: 1;
+}
+
+.btn-primary:hover {
+	background-color: #2980b9;
+}
+
+.btn-success {
+	padding: 8px 16px;
+	border: 1px solid #2ecc71;
+	border-radius: 4px;
+	background-color: #2ecc71;
+	color: white;
+	font-size: 14px;
+	transition: all 0.2s;
+	flex: 1;
+}
+
+.btn-success:hover {
+	background-color: #27ae60;
+}
+
+/* 闄勪欢璇︽儏鏍峰紡 */
+.attachment-detail-header {
+	display: flex;
+	align-items: center;
+	gap: 20px;
+	margin-bottom: 20px;
+	padding-bottom: 16px;
+	border-bottom: 1px solid #eee;
+}
+
+.attachment-detail-title {
+	font-size: 18px;
+	font-weight: 600;
+	color: #2c3e50;
+	flex: 1;
+	word-break: break-all;
+}
+
+.attachment-detail-info {
+	margin-bottom: 20px;
+}
+
+.info-row {
+	display: flex;
+	margin-bottom: 12px;
+	gap: 16px;
+}
+
+.info-item {
+	flex: 1;
+}
+
+.info-label {
+	display: block;
+	font-size: 12px;
+	color: #7f8c8d;
+	margin-bottom: 4px;
+}
+
+.info-content {
+	font-size: 14px;
+	color: #2c3e50;
+	line-height: 1.5;
+}
+
+.attachment-detail-actions {
+	padding: 12px 16px;
+	border-top: 1px solid #eee;
+	display: flex;
+	gap: 8px;
+	background-color: #f8f9fa;
+}
+
+/* 鏂囦欢棰勮寮圭獥鏍峰紡 */
+.file-preview-popup {
+	width: 80vw;
+	max-width: 800px;
+	max-height: 80vh;
+}
+
+.file-preview-title {
+	padding: 20px;
+	margin: 0;
+	font-size: 16px;
+	font-weight: 600;
+	color: #2c3e50;
+	border-bottom: 1px solid #eee;
+	word-break: break-all;
+}
+
+.file-preview-content {
+	padding: 20px;
+	max-height: 60vh;
+	overflow-y: auto;
+}
+
+.file-preview-content pre {
+	white-space: pre-wrap;
+	word-wrap: break-word;
+	font-family: 'Courier New', monospace;
+	font-size: 12px;
+	line-height: 1.4;
+	background: #f8f9fa;
+	padding: 15px;
+	border-radius: 4px;
+	border: 1px solid #e9ecef;
+}
+
+.image-preview-container {
+	text-align: center;
+}
+
+.image-zoom-hint {
+	margin-top: 10px;
+	font-size: 12px;
+	color: #7f8c8d;
+}
+
+.unsupported-preview {
+	text-align: center;
+	padding: 40px 20px;
+}
+
+.unsupported-icon {
+	font-size: 48px;
+	margin-bottom: 16px;
+}
+
+.unsupported-text {
+	font-size: 16px;
+	color: #7f8c8d;
+	margin-bottom: 8px;
+}
+
+.unsupported-hint {
+	font-size: 14px;
+	color: #95a5a6;
+}
+
+.file-preview-actions {
+	padding: 15px 20px;
+	border-top: 1px solid #eee;
+	display: flex;
+	gap: 10px;
+	justify-content: center;
+}
+
+.file-preview-btn {
+	padding: 8px 16px;
+	border-radius: 4px;
+	border: none;
+	font-size: 14px;
+	cursor: pointer;
+	transition: all 0.2s;
+}
+
+.file-preview-btn.download-btn {
+	background: #2ecc71;
+	color: white;
+}
+
+.file-preview-btn.close-btn {
+	background: #95a5a6;
+	color: white;
+}
+
+.file-preview-btn:hover {
+	transform: translateY(-1px);
+	box-shadow: 0 2px 8px rgba(0,0,0,0.15);
+}
+
+/* 鍒犻櫎纭寮圭獥鏍峰紡 */
+.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
diff --git a/pages/QC/SJ/detail.vue b/pages/QC/SJ/detail.vue
index 023ce37..662fca5 100644
--- a/pages/QC/SJ/detail.vue
+++ b/pages/QC/SJ/detail.vue
@@ -122,6 +122,11 @@
                 涓嶅悎鏍兼弿杩�
               </button>
               
+              <button class="btn attachment-btn" @tap="viewAttachmentInfo">
+                <uni-icons type="folder" size="16" color="#fff"></uni-icons>
+                鏌ョ湅闄勪欢淇℃伅
+              </button>
+              
               <input v-if="!isAllCompleted"
                 v-model="formData.fcheckResu"
                 type="text"
@@ -222,6 +227,168 @@
       </view>
     </view>
 
+    <!-- 闄勪欢鍒楄〃寮圭獥 -->
+    <view v-if="showAttachmentPopup" class="overlay">
+      <view class="popup attachment-list-popup">
+        <div class="attachment-popup-header">
+          <h3 class="attachment-popup-title">闄勪欢鍒楄〃</h3>
+          <button class="attachment-close-btn" @click="closeAttachmentPopup">鍏抽棴</button>
+        </div>
+        
+        <div class="attachment-popup-content">
+          <div v-if="attachmentsLoading" class="attachment-loading">
+            <div class="loading-spinner"></div>
+            <span class="loading-text">姝ｅ湪鍔犺浇闄勪欢...</span>
+          </div>
+          
+          <div v-else-if="attachments.length === 0" class="attachment-empty">
+            <div class="empty-icon">馃搧</div>
+            <div class="empty-text">鏆傛棤闄勪欢</div>
+            <div class="empty-hint">璇ョ墿鏂欐殏鏈笂浼犱换浣曢檮浠�</div>
+          </div>
+          
+          <div v-else class="attachment-list">
+            <div v-for="item in attachments" :key="item.id" class="attachment-item">
+              <div class="attachment-info">
+                <div class="file-type-badge" :class="getFileTypeClass(item.fattach)">
+                  {{ getFileTypeIcon(item.fattach) }}
+                </div>
+                <div class="attachment-details">
+                  <div class="attachment-name" @click="showAttachmentDetailDialog(item)">
+                    {{ item.fattach }}
+                  </div>
+                  <div class="attachment-meta">
+                    <span class="meta-type">{{ item.ftype || '鏈煡绫诲瀷' }}</span>
+                    <span v-if="item.fversion" class="meta-version">v{{ item.fversion }}</span>
+                    <span v-if="item.fdate" class="meta-date">{{ formatDate(item.fdate) }}</span>
+                  </div>
+                </div>
+              </div>
+              
+              <div class="attachment-actions">
+                <button class="btn-secondary" @click="showAttachmentDetailDialog(item)">璇︽儏</button>
+                <button v-if="isPreviewable(item.fattach)" 
+                  class="btn-primary" 
+                  @click="previewFtpFile(item)">棰勮</button>
+                <button class="btn-success" @click="downloadAttachment(item)">涓嬭浇</button>
+              </div>
+            </div>
+          </div>
+        </div>
+      </view>
+    </view>
+
+    <!-- 闄勪欢璇︽儏寮圭獥 -->
+    <view v-if="showAttachmentDetail" class="overlay">
+      <view class="popup attachment-detail-popup">
+        <div class="attachment-popup-header">
+          <h3 class="attachment-popup-title">闄勪欢璇︽儏</h3>
+          <button class="attachment-close-btn" @click="closeAttachmentDetail">杩斿洖</button>
+        </div>
+        
+        <div class="attachment-popup-content">
+          <div v-if="selectedAttachment" class="attachment-detail-content">
+            <div class="attachment-detail-header">
+              <div class="file-type-badge large" :class="getFileTypeClass(selectedAttachment.fattach)">
+                {{ getFileTypeIcon(selectedAttachment.fattach) }}
+              </div>
+              <div class="attachment-detail-title">
+                {{ selectedAttachment.fattach }}
+              </div>
+            </div>
+            
+            <div class="attachment-detail-info">
+              <div class="info-row">
+                <div class="info-item">
+                  <text class="info-label">ID</text>
+                  <text class="info-content">{{ Math.trunc(selectedAttachment.id) }}</text>
+                </div>
+                <div class="info-item">
+                  <text class="info-label">绫诲瀷</text>
+                  <text class="info-content">{{ selectedAttachment.ftype || '鏈煡绫诲瀷' }}</text>
+                </div>
+              </div>
+              
+              <div class="info-row" v-if="selectedAttachment.fversion">
+                <div class="info-item">
+                  <text class="info-label">鐗堟湰</text>
+                  <text class="info-content">{{ selectedAttachment.fversion }}</text>
+                </div>
+                <div class="info-item" v-if="selectedAttachment.fdate">
+                  <text class="info-label">鍙楁帶鏃ユ湡</text>
+                  <text class="info-content">{{ formatDate(selectedAttachment.fdate) }}</text>
+                </div>
+              </div>
+              
+              <div class="info-row" v-if="selectedAttachment.createBy">
+                <div class="info-item">
+                  <text class="info-label">涓婁紶浜�</text>
+                  <text class="info-content">{{ selectedAttachment.createBy }}</text>
+                </div>
+                <div class="info-item" v-if="selectedAttachment.createDate">
+                  <text class="info-label">涓婁紶鏃堕棿</text>
+                  <text class="info-content">{{ formatDate(selectedAttachment.createDate) }}</text>
+                </div>
+              </div>
+            </div>
+            
+            <div class="attachment-detail-actions">
+              <button v-if="isPreviewable(selectedAttachment.fattach)" 
+                class="btn-primary" 
+                @click="previewFtpFile(selectedAttachment)">棰勮</button>
+              <button class="btn-success" @click="downloadAttachment(selectedAttachment)">涓嬭浇</button>
+            </div>
+          </div>
+          <div v-else class="attachment-detail-empty">
+            <div class="empty-icon">鉂�</div>
+            <div class="empty-text">鏆傛棤闄勪欢淇℃伅</div>
+          </div>
+        </div>
+      </view>
+    </view>
+
+    <!-- 鏂囦欢棰勮寮圭獥 -->
+    <view v-if="showFilePreviewPopup" class="overlay">
+      <view class="popup file-preview-popup">
+        <h3 class="file-preview-title">{{ previewTitle }}</h3>
+        <div class="file-preview-divider"></div>
+        <div class="file-preview-content">
+          <!-- 鏂囨湰鍐呭棰勮 -->
+          <pre v-if="previewType === 'text'">{{ previewContent }}</pre>
+          
+          <!-- 鍥剧墖鍐呭棰勮 -->
+          <view v-else-if="previewType === 'image'" class="image-preview-container">
+            <image 
+              :src="previewContent" 
+              mode="aspectFit" 
+              class="preview-image-clickable"
+              @click="previewImageInPopup"
+              style="width: 100%; max-height: 400px; cursor: pointer;"
+            />
+            <div class="image-zoom-hint">鐐瑰嚮鍥剧墖鍙斁澶ф煡鐪�</div>
+          </view>
+          
+          <!-- Excel 绛� Office 鏂囦欢鎻愮ず -->
+          <view v-else-if="previewType === 'excel'" class="unsupported-preview">
+            <view class="unsupported-icon">馃搳</view>
+            <view class="unsupported-text">Excel 鏂囦欢鏆備笉鏀寔鍦ㄧ嚎棰勮</view>
+            <view class="unsupported-hint">璇风偣鍑讳笅杞芥寜閽幏鍙栧畬鏁存枃浠�</view>
+          </view>
+          
+          <!-- 涓嶆敮鎸佺殑鏂囦欢绫诲瀷 -->
+          <view v-else class="unsupported-preview">
+            <view class="unsupported-icon">馃搫</view>
+            <view class="unsupported-text">姝ゆ枃浠舵牸寮忔殏涓嶆敮鎸侀瑙�</view>
+            <view class="unsupported-hint">璇风偣鍑讳笅杞芥寜閽幏鍙栧畬鏁存枃浠�</view>
+          </view>
+        </div>
+        <div class="file-preview-actions">
+          <button v-if="previewType !== 'text'" class="file-preview-btn download-btn" @click="downloadPreviewFile">馃摜 涓嬭浇鏂囦欢</button>
+          <button class="file-preview-btn close-btn" @click="closeFilePreview">鍏抽棴</button>
+        </div>
+      </view>
+    </view>
+
   </view>
 </template>
 
@@ -244,7 +411,18 @@
       remarksPopup: false,
       // ===== 鏂板LLJ鏍峰紡鐩稿叧鏁版嵁 =====
       currentTab: 0,
-      tabs: []
+      tabs: [],
+      // ===== 闄勪欢鐩稿叧鏁版嵁 =====
+      showAttachmentPopup: false,
+      showAttachmentDetail: false,
+      showFilePreviewPopup: false,
+      attachments: [],
+      attachmentsLoading: false,
+      selectedAttachment: null,
+      previewTitle: '',
+      previewContent: '',
+      previewType: '',
+      previewFileUrl: ''
     }
   },
   computed: {
@@ -547,6 +725,10 @@
       }).then(res => {
         this.formData = res.data.tbBillList[0];
         this.formData.billNo = this.billNo;
+        
+        console.log("鑾峰彇鍒扮殑 formData:", this.formData);
+        console.log("itemNo 鍊�:", this.formData.itemNo);
+        
         if (this.formData.imageData) {
           this.isShowImg = true;
           this.base64Image = 'data:image/jpeg;base64,' + this.formData.imageData;
@@ -692,6 +874,254 @@
           }
         })
       }
+    },
+
+    // ===== 闄勪欢鐩稿叧鏂规硶 =====
+    viewAttachmentInfo() {
+      this.showAttachmentPopup = true;
+      this.attachmentsLoading = true;
+      this.attachments = [];
+      
+      // 鍏堣幏鍙栫墿鏂欑紪鐮侊紝鐒跺悗鑾峰彇闄勪欢
+      this.$post({
+        url: "/SJ/GetPage",
+        data: {
+          pageIndex: 1,
+          limit: 1,
+          id: this.gid
+        }
+      }).then(res => {
+        let tbBillListElement = res.data.tbBillList[0];
+        if (tbBillListElement && tbBillListElement.itemNo) {
+          console.log("鑾峰彇鍒扮殑鐗╂枡缂栫爜:", tbBillListElement.itemNo);
+          
+          // 浣跨敤鑾峰彇鍒扮殑鐗╂枡缂栫爜璋冪敤闄勪欢鎺ュ彛
+          return this.$post({
+            url: "/SJ/getAttachments",
+            data: { itemNo: tbBillListElement.itemNo }
+          });
+        } else {
+          throw new Error("鏈壘鍒扮墿鏂欑紪鐮佷俊鎭�");
+        }
+      }).then(res => {
+        this.attachmentsLoading = false;
+        if (res.status === 0) {
+          this.attachments = res.data.tbBillList;
+          // 涓烘瘡涓檮浠惰缃粯璁ゅ彲鐢ㄧ姸鎬�
+          this.attachments.forEach((item, index) => {
+            this.$set(item, 'ftpAvailable', true);
+            this.$set(item, 'checking', false);
+          });
+        } else if (res.status === 1 && res.message === "璇ユ楠屽崟鏈笂浼犻檮浠朵俊鎭紒") {
+          uni.showToast({ title: res.message, icon: "none" });
+        } else {
+          uni.showToast({ title: "鑾峰彇闄勪欢澶辫触", icon: "none" });
+        }
+      }).catch(err => {
+        this.attachmentsLoading = false;
+        console.error("鑾峰彇闄勪欢澶辫触:", err);
+        uni.showToast({ title: "鑾峰彇闄勪欢澶辫触锛岃閲嶈瘯", icon: "none" });
+      });
+    },
+    
+    closeAttachmentPopup() {
+      this.showAttachmentPopup = false;
+    },
+    
+    showAttachmentDetailDialog(item) {
+      this.selectedAttachment = item;
+      this.showAttachmentPopup = false;
+      this.showAttachmentDetail = true;
+    },
+    
+    closeAttachmentDetail() {
+      this.showAttachmentDetail = false;
+      this.selectedAttachment = null;
+      this.showAttachmentPopup = true;
+    },
+    
+    isPreviewable(filename) {
+      if (!filename) return false;
+      const ext = filename.trim().split('.').pop().toLowerCase();
+      return [
+        'pdf',
+        'jpg', 'jpeg', 'png', 'gif', 'bmp', 'webp',
+        'txt', 'log', 'md',
+        'doc', 'docx',
+        'xls', 'xlsx',
+        'ppt', 'pptx',
+        'csv'
+      ].includes(ext);
+    },
+    
+    // 鑾峰彇鏂囦欢绫诲瀷鍥炬爣
+    getFileTypeIcon(filename) {
+      if (!filename) return '馃搫';
+      const ext = filename.trim().split('.').pop().toLowerCase();
+      const iconMap = {
+        'pdf': '馃摃',
+        'jpg': '馃柤锔�', 'jpeg': '馃柤锔�', 'png': '馃柤锔�', 'gif': '馃柤锔�', 'bmp': '馃柤锔�', 'webp': '馃柤锔�',
+        'txt': '馃摑', 'log': '馃摑', 'md': '馃摑',
+        'doc': '馃摌', 'docx': '馃摌',
+        'xls': '馃搳', 'xlsx': '馃搳',
+        'ppt': '馃摍', 'pptx': '馃摍',
+        'csv': '馃搳',
+        'zip': '馃摝', 'rar': '馃摝', '7z': '馃摝',
+        'dwg': '馃彈锔�', 'dxf': '馃彈锔�'
+      };
+      return iconMap[ext] || '馃搫';
+    },
+    
+    // 鑾峰彇鏂囦欢绫诲瀷CSS绫�
+    getFileTypeClass(filename) {
+      if (!filename) return 'file-unknown';
+      const ext = filename.trim().split('.').pop().toLowerCase();
+      const classMap = {
+        'pdf': 'file-pdf',
+        'jpg': 'file-image', 'jpeg': 'file-image', 'png': 'file-image', 'gif': 'file-image', 'bmp': 'file-image', 'webp': 'file-image',
+        'txt': 'file-text', 'log': 'file-text', 'md': 'file-text',
+        'doc': 'file-word', 'docx': 'file-word',
+        'xls': 'file-excel', 'xlsx': 'file-excel',
+        'ppt': 'file-powerpoint', 'pptx': 'file-powerpoint',
+        'csv': 'file-excel',
+        'zip': 'file-archive', 'rar': 'file-archive', '7z': 'file-archive',
+        'dwg': 'file-cad', 'dxf': 'file-cad'
+      };
+      return classMap[ext] || 'file-unknown';
+    },
+    
+    // 鏍煎紡鍖栨棩鏈�
+    formatDate(dateString) {
+      if (!dateString) return '';
+      try {
+        const date = new Date(dateString);
+        return date.toLocaleDateString('zh-CN', {
+          year: 'numeric',
+          month: '2-digit',
+          day: '2-digit',
+          hour: '2-digit',
+          minute: '2-digit'
+        });
+      } catch (e) {
+        return dateString;
+      }
+    },
+    
+    downloadAttachment(item) {
+      const fileName = item.fattach.replace(/[\s\u3000\r\n]+/g, '').trim();
+      const downloadUrl = this.$store.state.serverInfo.serverAPI + "/SJ/DownloadFtpFile?itemNo=" + 
+        encodeURIComponent(item.itemNo) + "&fileName=" + encodeURIComponent(fileName) + 
+        "&ftpServer=" + encodeURIComponent(this.$store.state.serverInfo.ftpServer);
+      
+      uni.downloadFile({
+        url: downloadUrl,
+        success: (res) => {
+          if (res.statusCode === 200) {
+            uni.showToast({ title: '涓嬭浇鎴愬姛', icon: 'success' });
+          } else {
+            uni.showToast({ title: '涓嬭浇澶辫触', icon: 'none' });
+          }
+        },
+        fail: (err) => {
+          console.error('涓嬭浇澶辫触锛�', err);
+          uni.showToast({ title: '涓嬭浇澶辫触锛岃閲嶈瘯', icon: 'none' });
+        }
+      });
+    },
+    
+    previewFtpFile(item) {
+      const fileName = item.fattach.replace(/[\s\u3000\r\n]+/g, '').trim();
+      const fileExt = fileName.split('.').pop().toLowerCase();
+      
+      if (!this.isPreviewable(fileName)) {
+        uni.showModal({
+          title: '涓嶆敮鎸侀瑙�',
+          content: '璇ユ枃浠剁被鍨嬩笉鏀寔鍦ㄧ嚎棰勮锛岃涓嬭浇鍚庢煡鐪�',
+          showCancel: false
+        });
+        return;
+      }
+      
+      const previewUrl = this.$store.state.serverInfo.serverAPI + "/SJ/PreviewFtpFile?itemNo=" + 
+        encodeURIComponent(item.itemNo) + "&fileName=" + encodeURIComponent(fileName) + 
+        "&ftpServer=" + encodeURIComponent(this.$store.state.serverInfo.ftpServer);
+      
+      if (['pdf'].includes(fileExt)) {
+        this.previewPdfFile(previewUrl, fileName);
+      } else if (['jpg', 'jpeg', 'png', 'gif', 'bmp'].includes(fileExt)) {
+        this.previewImageFile(previewUrl, fileName);
+      } else if (['txt'].includes(fileExt)) {
+        this.previewTextFile(previewUrl, fileName);
+      } else {
+        this.previewOfficeFile(previewUrl, fileName);
+      }
+    },
+    
+    previewPdfFile(url, fileName) {
+      this.previewTitle = fileName;
+      this.previewContent = url;
+      this.previewType = 'pdf';
+      this.previewFileUrl = url;
+      this.showFilePreviewPopup = true;
+      this.showAttachmentDetail = false;
+    },
+    
+    previewImageFile(url, fileName) {
+      this.previewTitle = fileName;
+      this.previewContent = url;
+      this.previewType = 'image';
+      this.previewFileUrl = url;
+      this.showFilePreviewPopup = true;
+      this.showAttachmentDetail = false;
+    },
+    
+    previewTextFile(url, fileName) {
+      this.previewTitle = fileName;
+      this.previewType = 'text';
+      this.previewFileUrl = url;
+      this.showFilePreviewPopup = true;
+      this.showAttachmentDetail = false;
+      
+      uni.request({
+        url: url,
+        method: 'GET',
+        success: (res) => {
+          this.previewContent = res.data;
+        },
+        fail: (err) => {
+          this.previewContent = '棰勮澶辫触锛岃涓嬭浇鍚庢煡鐪�';
+        }
+      });
+    },
+    
+    previewOfficeFile(url, fileName) {
+      this.previewTitle = fileName;
+      this.previewContent = '';
+      this.previewType = 'excel';
+      this.previewFileUrl = url;
+      this.showFilePreviewPopup = true;
+      this.showAttachmentDetail = false;
+    },
+    
+    closeFilePreview() {
+      this.showFilePreviewPopup = false;
+      this.showAttachmentDetail = true;
+    },
+    
+    downloadPreviewFile() {
+      if (this.previewFileUrl && this.selectedAttachment) {
+        this.downloadAttachment(this.selectedAttachment);
+      }
+    },
+    
+    previewImageInPopup() {
+      // 鍦ㄦ柊绐楀彛涓墦寮�鍥剧墖杩涜鏀惧ぇ鏌ョ湅
+      if (this.previewContent) {
+        uni.previewImage({
+          urls: [this.previewContent],
+          current: this.previewContent
+        });
+      }
     }
   },
   onLoad(options) {
@@ -829,8 +1259,29 @@
     .upload-btn {
       background-color: #909399;
       color: #fff;
-      padding: 0 10px;
+      padding: 10px 12px;
       margin: 0;
+      font-size: 14px;
+      min-height: 44px;
+      white-space: nowrap;
+      flex-shrink: 0;
+      min-width: 80px;
+      max-width: 120px;
+      flex: 1;
+    }
+
+    .attachment-btn {
+      background-color: #17a2b8;
+      color: #fff;
+      padding: 10px 12px;
+      margin: 0;
+      font-size: 14px;
+      min-height: 44px;
+      white-space: nowrap;
+      flex-shrink: 0;
+      min-width: 80px;
+      max-width: 120px;
+      flex: 1;
     }
   }
 }
@@ -1016,17 +1467,22 @@
   display: flex;
   justify-content: center;
   align-items: center;
-  z-index: 1000;
+  z-index: 2000;
 }
 
 .popup {
   background-color: #fff;
-  padding: 20px;
-  border: 1px solid #ccc;
-  box-shadow: 0 0 10px rgba(0, 0, 0, 0.1);
+  padding: 0;
+  border: none;
+  box-shadow: 0 8px 32px rgba(60,60,60,0.18);
   width: 68vw;
-  height: 25vh;
-  border-radius: 8px;
+  max-width: 600px;
+  border-radius: 16px;
+  overflow: hidden;
+  position: relative;
+  z-index: 2001;
+  max-height: 80vh;
+  overflow-y: auto;
 }
 
 .popup-header {
@@ -1109,6 +1565,11 @@
       background-color: #95a5a6;
       color: white;
     }
+
+    &:hover {
+      transform: translateY(-1px);
+      box-shadow: 0 2px 8px rgba(0,0,0,0.15);
+    }
   }
 }
 
@@ -1139,5 +1600,434 @@
   .input-label {
     margin-bottom: 5px;
   }
+
+  .input-wrapper {
+    flex-direction: column;
+    gap: 8px;
+  }
+
+  .upload-btn,
+  .attachment-btn {
+    min-width: 70px;
+    max-width: 100px;
+    padding: 8px 10px;
+    font-size: 13px;
+    min-height: 40px;
+  }
+}
+
+/* 闄勪欢鐩稿叧鏍峰紡 */
+.attachment-list-popup {
+  width: 80vw;
+  max-width: 800px;
+  max-height: 85vh;
+}
+
+.attachment-detail-popup {
+  width: 70vw;
+  max-width: 600px;
+}
+
+.attachment-popup-header {
+  padding: 16px;
+  border-bottom: 1px solid #eee;
+  display: flex;
+  justify-content: space-between;
+  align-items: center;
+  background-color: white;
+}
+
+.attachment-popup-title {
+  font-size: 16px;
+  font-weight: 600;
+  color: #2c3e50;
+  margin: 0;
+}
+
+.attachment-close-btn {
+  padding: 8px 16px;
+  border: 1px solid #ddd;
+  border-radius: 4px;
+  background-color: white;
+  font-size: 14px;
+  transition: all 0.2s;
+  color: #2c3e50;
+}
+
+.attachment-close-btn:hover {
+  background-color: #f8f9fa;
+}
+
+.attachment-popup-content {
+  padding: 16px;
+  max-height: 60vh;
+  overflow-y: auto;
+}
+
+/* 鍔犺浇鐘舵�� */
+.attachment-loading {
+  display: flex;
+  flex-direction: column;
+  align-items: center;
+  justify-content: center;
+  padding: 40px 20px;
+  gap: 16px;
+}
+
+.loading-spinner {
+  width: 32px;
+  height: 32px;
+  border: 3px solid #f3f3f3;
+  border-top: 3px solid #3498db;
+  border-radius: 50%;
+  animation: spin 1s linear infinite;
+}
+
+@keyframes spin {
+  0% { transform: rotate(0deg); }
+  100% { transform: rotate(360deg); }
+}
+
+.loading-text {
+  font-size: 14px;
+  color: #7f8c8d;
+}
+
+/* 绌虹姸鎬� */
+.attachment-empty {
+  display: flex;
+  flex-direction: column;
+  align-items: center;
+  justify-content: center;
+  padding: 40px 20px;
+  gap: 12px;
+  text-align: center;
+}
+
+.empty-icon {
+  font-size: 36px;
+  opacity: 0.6;
+}
+
+.empty-text {
+  font-size: 16px;
+  color: #7f8c8d;
+  font-weight: 500;
+}
+
+.empty-hint {
+  font-size: 14px;
+  color: #95a5a6;
+}
+
+/* 闄勪欢鍒楄〃甯冨眬 */
+.attachment-list {
+  display: flex;
+  flex-direction: column;
+  gap: 16px;
+}
+
+.attachment-item {
+  background-color: white;
+  border-radius: 8px;
+  box-shadow: 0 2px 10px rgba(0, 0, 0, 0.05);
+  overflow: hidden;
+  transition: all 0.3s;
+  border: 1px solid #eee;
+}
+
+.attachment-item:hover {
+  box-shadow: 0 4px 15px rgba(0, 0, 0, 0.1);
+}
+
+.attachment-info {
+  padding: 16px;
+  border-bottom: 1px solid #eee;
+  display: flex;
+  align-items: center;
+  gap: 16px;
+}
+
+.file-type-badge {
+  width: 40px;
+  height: 40px;
+  border-radius: 8px;
+  display: flex;
+  align-items: center;
+  justify-content: center;
+  font-size: 20px;
+  background: #f8f9fa;
+  border: 2px solid #e9ecef;
+  flex-shrink: 0;
+}
+
+.file-type-badge.large {
+  width: 56px;
+  height: 56px;
+  font-size: 28px;
+}
+
+.file-type-badge.file-pdf { background: #ffe6e6; border-color: #ffcccc; }
+.file-type-badge.file-image { background: #e6f3ff; border-color: #cce7ff; }
+.file-type-badge.file-text { background: #e6ffe6; border-color: #ccffcc; }
+.file-type-badge.file-word { background: #e6f0ff; border-color: #cce0ff; }
+.file-type-badge.file-excel { background: #e6ffe6; border-color: #ccffcc; }
+.file-type-badge.file-powerpoint { background: #fff0e6; border-color: #ffe0cc; }
+.file-type-badge.file-archive { background: #f0e6ff; border-color: #e0ccff; }
+.file-type-badge.file-cad { background: #e6fff0; border-color: #ccffe0; }
+.file-type-badge.file-unknown { background: #f5f5f5; border-color: #e0e0e0; }
+
+.attachment-details {
+  flex: 1;
+  min-width: 0;
+}
+
+.attachment-name {
+  font-size: 16px;
+  font-weight: 600;
+  color: #2c3e50;
+  cursor: pointer;
+  overflow: hidden;
+  text-overflow: ellipsis;
+  white-space: nowrap;
+  margin-bottom: 8px;
+  transition: color 0.2s;
+}
+
+.attachment-name:hover {
+  color: #3498db;
+}
+
+.attachment-meta {
+  display: flex;
+  gap: 16px;
+  font-size: 12px;
+  color: #95a5a6;
+}
+
+.meta-type {
+  background-color: #ecf0f1;
+  padding: 2px 6px;
+  border-radius: 10px;
+  color: #7f8c8d;
+}
+
+.meta-version {
+  background-color: #e8f5e8;
+  padding: 2px 6px;
+  border-radius: 10px;
+  color: #2e7d32;
+}
+
+.meta-date {
+  background-color: #fff3e0;
+  padding: 2px 6px;
+  border-radius: 10px;
+  color: #f57c00;
+}
+
+.attachment-actions {
+  padding: 12px 16px;
+  border-top: 1px solid #eee;
+  display: flex;
+  gap: 8px;
+  background-color: #f8f9fa;
+}
+
+/* 鎸夐挳鏍峰紡 */
+.btn-secondary {
+  padding: 8px 16px;
+  border: 1px solid #ddd;
+  border-radius: 4px;
+  background-color: white;
+  font-size: 14px;
+  transition: all 0.2s;
+  color: #2c3e50;
+  flex: 1;
+}
+
+.btn-secondary:hover {
+  background-color: #f8f9fa;
+}
+
+.btn-primary {
+  padding: 8px 16px;
+  border: 1px solid #3498db;
+  border-radius: 4px;
+  background-color: #3498db;
+  color: white;
+  font-size: 14px;
+  transition: all 0.2s;
+  flex: 1;
+}
+
+.btn-primary:hover {
+  background-color: #2980b9;
+}
+
+.btn-success {
+  padding: 8px 16px;
+  border: 1px solid #2ecc71;
+  border-radius: 4px;
+  background-color: #2ecc71;
+  color: white;
+  font-size: 14px;
+  transition: all 0.2s;
+  flex: 1;
+}
+
+.btn-success:hover {
+  background-color: #27ae60;
+}
+
+/* 闄勪欢璇︽儏鏍峰紡 */
+.attachment-detail-header {
+  display: flex;
+  align-items: center;
+  gap: 20px;
+  margin-bottom: 20px;
+  padding-bottom: 16px;
+  border-bottom: 1px solid #eee;
+}
+
+.attachment-detail-title {
+  font-size: 18px;
+  font-weight: 600;
+  color: #2c3e50;
+  flex: 1;
+  word-break: break-all;
+}
+
+.attachment-detail-info {
+  margin-bottom: 20px;
+}
+
+.info-row {
+  display: flex;
+  margin-bottom: 12px;
+  gap: 16px;
+}
+
+.info-item {
+  flex: 1;
+}
+
+.info-label {
+  display: block;
+  font-size: 12px;
+  color: #7f8c8d;
+  margin-bottom: 4px;
+}
+
+.info-content {
+  font-size: 14px;
+  color: #2c3e50;
+  line-height: 1.5;
+}
+
+.attachment-detail-actions {
+  padding: 12px 16px;
+  border-top: 1px solid #eee;
+  display: flex;
+  gap: 8px;
+  background-color: #f8f9fa;
+}
+
+/* 鏂囦欢棰勮寮圭獥鏍峰紡 */
+.file-preview-popup {
+  width: 80vw;
+  max-width: 800px;
+  max-height: 80vh;
+}
+
+.file-preview-title {
+  padding: 20px;
+  margin: 0;
+  font-size: 16px;
+  font-weight: 600;
+  color: #2c3e50;
+  border-bottom: 1px solid #eee;
+  word-break: break-all;
+}
+
+.file-preview-content {
+  padding: 20px;
+  max-height: 60vh;
+  overflow-y: auto;
+}
+
+.file-preview-content pre {
+  white-space: pre-wrap;
+  word-wrap: break-word;
+  font-family: 'Courier New', monospace;
+  font-size: 12px;
+  line-height: 1.4;
+  background: #f8f9fa;
+  padding: 15px;
+  border-radius: 4px;
+  border: 1px solid #e9ecef;
+}
+
+.image-preview-container {
+  text-align: center;
+}
+
+.image-zoom-hint {
+  margin-top: 10px;
+  font-size: 12px;
+  color: #7f8c8d;
+}
+
+.unsupported-preview {
+  text-align: center;
+  padding: 40px 20px;
+}
+
+.unsupported-icon {
+  font-size: 48px;
+  margin-bottom: 16px;
+}
+
+.unsupported-text {
+  font-size: 16px;
+  color: #7f8c8d;
+  margin-bottom: 8px;
+}
+
+.unsupported-hint {
+  font-size: 14px;
+  color: #95a5a6;
+}
+
+.file-preview-actions {
+  padding: 15px 20px;
+  border-top: 1px solid #eee;
+  display: flex;
+  gap: 10px;
+  justify-content: center;
+}
+
+.file-preview-btn {
+  padding: 8px 16px;
+  border-radius: 4px;
+  border: none;
+  font-size: 14px;
+  cursor: pointer;
+  transition: all 0.2s;
+}
+
+.file-preview-btn.download-btn {
+  background: #2ecc71;
+  color: white;
+}
+
+.file-preview-btn.close-btn {
+  background: #95a5a6;
+  color: white;
+}
+
+.file-preview-btn:hover {
+  transform: translateY(-1px);
+  box-shadow: 0 2px 8px rgba(0,0,0,0.15);
 }
 </style>
\ No newline at end of file
diff --git a/pages/QC/XJ/Add.vue b/pages/QC/XJ/Add.vue
index 92453e0..ddfd852 100644
--- a/pages/QC/XJ/Add.vue
+++ b/pages/QC/XJ/Add.vue
@@ -127,7 +127,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 +372,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 +472,13 @@
         previewTitle: '',
         previewContent: '',
         previewType: '',
-        previewFileUrl: ''
+        previewFileUrl: '',
+        
+        // 鍒犻櫎纭鐩稿叧鏁版嵁
+        showDeleteConfirm: false,
+        deleteCountdown: 5,
+        countdownProgress: 0,
+        deleteTimer: null
 
       };
     },
@@ -520,6 +552,53 @@
         } 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() {
@@ -1689,6 +1768,11 @@
     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 {
@@ -2400,6 +2484,7 @@
       padding: 8px 10px;
       font-size: 11px;
       min-height: 40px;
+      flex: 1;
     }
     
     .action-btn.small {
@@ -2489,4 +2574,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
diff --git a/pages/QC/XJ/List.vue b/pages/QC/XJ/List.vue
index b5328b0..1bf9656 100644
--- a/pages/QC/XJ/List.vue
+++ b/pages/QC/XJ/List.vue
@@ -6,13 +6,26 @@
     <!-- 椤堕儴绛涢�夊尯 -->
     <view class="filter-section">
       <view class="filter-controls">
+        <!-- 鏌ヨ鏉′欢閫夋嫨鍣� -->
+        <view class="dropdown-filter">
+          <picker @change="onOptionsChange" :value="optionsIndex" :range="options">
+            <view class="picker">{{options[optionsIndex]}}</view>
+          </picker>
+        </view>
+        
+        <!-- 鎼滅储妗� -->
+        <view class="search-container">
+          <input class="search-input" v-model="searchValue" :placeholder="'璇疯緭鍏�'+options[optionsIndex]" @confirm="btnclicked" />
+          <button class="search-button" @click="btnclicked">鎼滅储</button>
+        </view>
+        
         <!-- 鐘舵�佸垏鎹㈡爣绛� -->
         <view class="status-tabs">
           <button :class="['tab-button', current === 0 ? 'active' : '']" @click="onClickItem({currentIndex: 0})">
-            {{items[0]}}
+            鏈彁浜�({{unsubmittedCount}})
           </button>
           <button :class="['tab-button', current === 1 ? 'active' : '']" @click="onClickItem({currentIndex: 1})">
-            {{items[1]}}
+            宸叉彁浜�({{submittedCount}})
           </button>
         </view>
       </view>
@@ -98,7 +111,15 @@
       items: ['鏈彁浜�', '宸叉彁浜�'],
       current: 0,
       data: [],
-      tipShow: false // 鏄惁鏄剧ず椤堕儴鎻愮ず妗�
+      tipShow: false, // 鏄惁鏄剧ず椤堕儴鎻愮ず妗�
+      searchValue: '',
+      // ===== 鏂板鎼滅储鍔熻兘鐩稿叧鏁版嵁 =====
+      optionsIndex: 0, // 褰撳墠閫夋嫨鐨勬煡璇㈡潯浠剁储寮�
+      options: ['宸ュ崟', '妫�楠屽崟鍙�', '浜х嚎', '鐗╂枡缂栫爜', '鐗╂枡鍚嶇О'], // 鏌ヨ鏉′欢閫夐」
+      selectedField: 'billNo', // 褰撳墠閫夋嫨鐨勬煡璇㈠瓧娈碉紝榛樿涓哄伐鍗�
+      // ===== 鏂板鏁伴噺缁熻鍙橀噺 =====
+      unsubmittedCount: 0, // 鏈彁浜ゆ暟閲�
+      submittedCount: 0 // 宸叉彁浜ゆ暟閲�
     };
   },
   onLoad() {
@@ -106,8 +127,29 @@
     this.init();
   },
   methods: {
+    // ===== 鏂板鏌ヨ鏉′欢閫夋嫨鏂规硶 =====
+    onOptionsChange(e) {
+      this.optionsIndex = e.detail.value;
+      // 鏍规嵁閫夋嫨鐨勯�夐」璁剧疆鎼滅储瀛楁
+      const fieldMap = {
+        0: 'billNo',     // 宸ュ崟
+        1: 'releaseNo',  // 妫�楠屽崟鍙�
+        2: 'daa020',     // 浜х嚎
+        3: 'itemNo',     // 鐗╂枡缂栫爜
+        4: 'itemName'    // 鐗╂枡鍚嶇О
+      };
+      this.selectedField = fieldMap[this.optionsIndex];
+    },
+    
+    //鎼滅储妗嗙偣鍑讳簨浠�
+    btnclicked() {
+      this.init();
+    },
+    
     init() {
-
+      //鑾峰彇鎼滅储鏉′欢鍐呭
+      let SearchValue = this.searchValue;
+      
       let result = "鏈畬鎴�";
       if (this.current === 1) {
         result = "宸插畬鎴�";
@@ -120,10 +162,19 @@
           pageIndex: 1,
           limit: 20,
           createUser: this.$loginInfo.account,
-          result: result
+          result: result,
+          SearchValue: SearchValue,
+          selectedIndex: this.optionsIndex, // 鏂板锛氭悳绱㈡潯浠剁储寮�
+          searchField: this.selectedField   // 鏂板锛氭悳绱㈠瓧娈靛悕
         }
       }).then(res => {
         this.data = res.data.tbBillList;
+        // 璁剧疆鏁伴噺缁熻
+        if (this.current === 1) {
+          this.submittedCount = res.totalCount;
+        } else {
+          this.unsubmittedCount = res.totalCount;
+        }
       })
     },
     handleFabClick() {
@@ -186,8 +237,51 @@
 
 .filter-controls {
   display: flex;
-  justify-content: center;
-  align-items: center;
+  flex-wrap: wrap;
+  gap: 10px;
+}
+
+/* 鏌ヨ鏉′欢閫夋嫨鍣� */
+.dropdown-filter {
+  min-width: 80px;
+  margin-right: 10px;
+}
+
+.picker {
+  padding: 8px 12px;
+  border: 1px solid #ddd;
+  border-radius: 4px;
+  background-color: white;
+  font-size: 14px;
+  min-width: 80px;
+}
+
+/* 鎼滅储妗嗘牱寮� */
+.search-container {
+  display: flex;
+  flex: 1;
+  margin-right: 10px;
+  height: 36px;
+  min-width: 200px;
+}
+
+.search-input {
+  flex: 1;
+  padding: 8px 12px;
+  border: 1px solid #ddd;
+  border-radius: 4px 0 0 4px;
+  font-size: 14px;
+  background-color: white;
+}
+
+.search-button {
+  padding: 0 12px;
+  border: 1px solid #3498db;
+  border-radius: 0 4px 4px 0;
+  background-color: #3498db;
+  color: white;
+  font-size: 14px;
+  margin: 0;
 }
 
 .status-tabs {
@@ -195,7 +289,8 @@
   border-radius: 4px;
   overflow: hidden;
   background-color: #ecf0f1;
-  width: 300px;
+  flex: 1;
+  min-width: 200px;
 }
 
 .tab-button {
diff --git a/store/index.js b/store/index.js
index 28e71bd..7a69cf8 100644
--- a/store/index.js
+++ b/store/index.js
@@ -11,8 +11,8 @@
 			serverURLInt:'http://192.168.11.251:10055',//鏈嶅姟鍣ㄤ綋妫� 10.0.1.104:10054
 			serverURL:'http://localhost:10055',//鏈湴璋冭瘯鍦板潃
 			//serverAPI:'http://localhost:5184/api',//褰撳墠姝ｅ湪浣跨敤鐨勬湇鍔″櫒,榛樿涓哄缃�  localhost
-			//serverAPI:'http://192.168.1.22:10054/api',//鍐呯綉 
-			serverAPI:'http://36.26.21.214:10054/api',
+			serverAPI:'http://192.168.1.22:10054/api',//鍐呯綉 
+			//serverAPI:'http://36.26.21.214:10054/api',
 			ftpServer:'ftp://36.26.21.214',//FTP鏈嶅姟鍣ㄥ湴鍧�
 		}
 	},

--
Gitblit v1.9.3