From c17b60dbe0f84ba5c224ae045f314882956a72de Mon Sep 17 00:00:00 2001
From: =?UTF-8?q?=E7=A0=82=E7=B3=96?= <2178503051@qq.com>
Date: Fri, 5 Jun 2026 14:50:47 +0800
Subject: [PATCH] =?UTF-8?q?feat(mine+defect):=20=E6=96=B0=E5=A2=9E?=
 =?UTF-8?q?=E9=92=A2=E5=8D=B7=E5=BC=82=E5=B8=B8=E7=AE=A1=E7=90=86=E9=A1=B5?=
 =?UTF-8?q?=E9=9D=A2=E5=8F=8A=E7=9B=B8=E5=85=B3=E5=8A=9F=E8=83=BD?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

1. 个人中心页面新增钢卷异常入口
2. 实现钢卷异常列表页：支持按状态筛选、缺陷代码/程度统计
3. 新增异常新增/编辑弹窗，完善表单校验和字段展示
4. 优化列表项UI展示，新增主缺陷标识和元信息展示
---
 .../hand-factory/pages/defect/coil-defect.vue | 398 ++++++++++++++----
 apps/hand-factory/pages/mine/index.vue        |  10 +
 2 files changed, 320 insertions(+), 88 deletions(-)

diff --git a/apps/hand-factory/pages/defect/coil-defect.vue b/apps/hand-factory/pages/defect/coil-defect.vue
index 6f1db4f..41edce3 100644
--- a/apps/hand-factory/pages/defect/coil-defect.vue
+++ b/apps/hand-factory/pages/defect/coil-defect.vue
@@ -32,6 +32,20 @@
 					<text class="form-label-optional">逻辑库区</text>
 					<klp-warehouse-picker v-model="searchForm.warehouseId" placeholder="请选择逻辑库区" />
 				</view>
+				<view class="form-item">
+					<text class="form-label-optional">钢卷状态</text>
+					<view class="status-picker">
+						<view 
+							v-for="s in statusOptions" 
+							:key="s.value" 
+							class="status-option" 
+							:class="{ 'status-active': searchForm.status === s.value }"
+							@click="searchForm.status = s.value"
+						>
+							<text>{{ s.label }}</text>
+						</view>
+					</view>
+				</view>
 			</view>
 			
 			<!-- 查询悬浮按钮 -->
@@ -97,30 +111,34 @@
 				</view>
 			</view>
 			
-			<!-- 异常级别统计卡片 -->
-			<view class="stats-card" v-if="defectList.length > 0">
-				<view class="stat-item" v-for="stat in defectStats" :key="stat.label">
-					<text class="stat-num" :style="{ color: stat.color }">{{ stat.count }}</text>
-					<text class="stat-label">{{ stat.label }}</text>
-				</view>
-			</view>
-			
 			<view v-if="defectList.length === 0" class="empty-list">
 				<text>该钢卷暂无异常记录</text>
 			</view>
 			
 			<view v-for="(item, index) in defectList" :key="item.abnormalId || index" class="defect-card">
 				<view class="defect-card-top">
-					<text class="defect-level" :class="'level-' + (item.abnormalLevel || 'C')">{{ item.abnormalLevel || 'C' }}级</text>
+					<view class="defect-card-top-left">
+						<text class="defect-code-badge">{{ item.defectCode || '-' }}</text>
+						<text class="defect-degree-badge">{{ item.degree || '-' }}</text>
+						<text class="defect-main-badge" v-if="item.mainMark == 1">主缺陷</text>
+					</view>
 					<view class="defect-actions">
 						<text class="action-btn edit-btn" @click="editDefect(item)">编辑</text>
 						<text class="action-btn del-btn" @click="deleteDefect(item)">删除</text>
 					</view>
 				</view>
-				<view class="defect-desc">{{ item.abnormalDesc || '暂无描述' }}</view>
+				<view class="defect-desc">{{ item.remark || '暂无描述' }}</view>
+				<view class="defect-meta">
+					<text class="meta-item" v-if="item.plateSurface">板面: {{ item.plateSurface }}</text>
+					<text class="meta-item" v-if="item.position">断面: {{ item.position }}</text>
+					<text class="meta-item" v-if="item.startPosition || item.endPosition">
+						区间: {{ item.startPosition || '?' }}~{{ item.endPosition || '?' }}
+						<text class="meta-unit" v-if="item.length"> (长 {{ item.length }})</text>
+					</text>
+				</view>
 				<!-- 展示图片 -->
-				<view class="defect-images" v-if="item.imgUrl">
-					<image v-for="(url, i) in item.imgUrl.split(',')" :key="i" :src="url" class="defect-img" mode="aspectFill" @click="previewImage(url)"></image>
+				<view class="defect-images" v-if="item.attachmentFiles">
+					<image v-for="(url, i) in item.attachmentFiles.split(',')" :key="i" :src="url" class="defect-img" mode="aspectFill" @click="previewImage(url)"></image>
 				</view>
 				<view class="defect-time">{{ item.createTime || '' }}</view>
 			</view>
@@ -151,32 +169,56 @@
 						<input v-model="defectForm.coilNo" class="form-input form-input-disabled" disabled placeholder="自动关联" />
 					</view>
 					
-					<!-- 异常描述 -->
+					<!-- 缺陷描述 -->
 					<view class="form-item">
-						<text class="form-label">异常描述 <text class="required">*</text></text>
-						<textarea v-model="defectForm.abnormalDesc" placeholder="请输入异常描述" class="form-textarea" />
+						<text class="form-label">缺陷描述 <text class="required">*</text></text>
+						<textarea v-model="defectForm.remark" placeholder="请输入缺陷描述" class="form-textarea" />
 					</view>
 					
-					<!-- 异常级别 -->
+					<!-- 上下板面 -->
 					<view class="form-item">
-						<text class="form-label">异常级别 <text class="required">*</text></text>
-						<view class="level-picker">
-							<view 
-								v-for="level in levelOptions" 
-								:key="level.value" 
-								class="level-option" 
-								:class="{ 'level-active': defectForm.abnormalLevel === level.value }"
-								:style="{ borderColor: level.value === defectForm.abnormalLevel ? level.color : '#e8e8e8', color: level.value === defectForm.abnormalLevel ? level.color : '#666' }"
-								@click="defectForm.abnormalLevel = level.value"
-							>
-								<text>{{ level.label }}</text>
-							</view>
+						<text class="form-label">上下板面</text>
+						<uni-data-checkbox multiple v-model="defectForm.plateSurface" :localdata="plateSurfaceOptions" />
+					</view>
+					
+					<!-- 断面位置 -->
+					<view class="form-item">
+						<text class="form-label">断面位置</text>
+						<uni-data-checkbox multiple v-model="defectForm.position" :localdata="positionOptions" />
+						<view class="form-tip">异常位置为内圈算起</view>
+					</view>
+					
+					<!-- 异常区间 -->
+					<view class="form-item">
+						<text class="form-label">异常区间 <text class="required">*</text></text>
+						<view class="range-row">
+							<input v-model="defectForm.startPosition" type="number" placeholder="开始位置" class="form-input range-input" @blur="calculateLength" />
+							<text class="range-separator">~</text>
+							<input v-model="defectForm.endPosition" type="number" placeholder="结束位置" class="form-input range-input" @blur="calculateLength" />
 						</view>
 					</view>
 					
-					<!-- 图片上传 -->
+					<!-- 缺陷代码 -->
 					<view class="form-item">
-						<text class="form-label">现场照片</text>
+						<text class="form-label">缺陷代码 <text class="required">*</text></text>
+						<uni-data-checkbox v-model="defectForm.defectCode" :localdata="defectCodeOptions" />
+					</view>
+					
+					<!-- 程度 -->
+					<view class="form-item">
+						<text class="form-label">程度 <text class="required">*</text></text>
+						<uni-data-checkbox v-model="defectForm.degree" :localdata="degreeOptions" />
+					</view>
+					
+					<!-- 主缺陷 -->
+					<view class="form-item">
+						<text class="form-label">主缺陷</text>
+						<uni-data-checkbox multiple v-model="mainMarkBind" :localdata="[{text: '是否为主缺陷', value: '1'}]" />
+					</view>
+					
+					<!-- 缺陷图片（仅主缺陷时显示） -->
+					<view class="form-item" v-if="defectForm.mainMark === 1">
+						<text class="form-label">缺陷图片</text>
 						<view class="upload-area">
 							<!-- 已上传图片预览 -->
 							<view v-for="(url, i) in uploadedImages" :key="i" class="upload-preview">
@@ -190,12 +232,6 @@
 							</view>
 						</view>
 					</view>
-					
-					<!-- 备注 -->
-					<view class="form-item">
-						<text class="form-label-optional">备注</text>
-						<input v-model="defectForm.remark" placeholder="选填备注" class="form-input" />
-					</view>
 				</scroll-view>
 				
 				<view class="popup-footer">
@@ -225,9 +261,19 @@ export default {
 				itemName: '',
 				itemSpecification: '',
 				itemMaterial: '',
-				warehouseId: ''
+				warehouseId: '',
+				status: '',
+				netWeightStart: '',
+				netWeightEnd: ''
 			},
 			
+			// 状态选项
+			statusOptions: [
+				{ label: '全部', value: '' },
+				{ label: '在库', value: '0' },
+				{ label: '已出库', value: '1' }
+			],
+			
 			// 分页
 			pager: {
 				pageNum: 1,
@@ -242,22 +288,31 @@ export default {
 			// 缺陷列表
 			defectList: [],
 			
-			// 缺陷级别选项
-			levelOptions: [
-				{ value: 'A', label: 'A级(严重)', color: '#ff4d4f' },
-				{ value: 'B', label: 'B级(较重)', color: '#fa8c16' },
-				{ value: 'C', label: 'C级(一般)', color: '#fadb14' },
-				{ value: 'D', label: 'D级(轻微)', color: '#52c41a' }
+			// 缺陷代码选项（从字典加载）
+			defectCodeOptions: [],
+			// 断面位置选项（从字典加载）
+			positionOptions: [],
+			// 程度选项（从字典加载）
+			degreeOptions: [],
+			// 上下板面选项
+			plateSurfaceOptions: [
+				{ text: '上板面', value: '上' },
+				{ text: '下板面', value: '下' }
 			],
 			
 			// 缺陷表单
 			defectForm: {
 				coilId: '',
 				coilNo: '',
-				abnormalDesc: '',
-				abnormalLevel: 'C',
-				imgUrl: '',
-				remark: ''
+				remark: '',
+				plateSurface: [],
+				position: [],
+				startPosition: undefined,
+				endPosition: undefined,
+				defectCode: '',
+				degree: '',
+				mainMark: 0,
+				attachmentFiles: ''
 			},
 			formMode: 'add', // add | edit
 			editingId: null,
@@ -275,19 +330,31 @@ export default {
 			if (this.total === 0) return 0
 			return Math.ceil(this.total / this.pager.pageSize)
 		},
-		// 异常统计
+		// 缺陷代码统计
 		defectStats() {
 			const stats = {}
-			this.levelOptions.forEach(lo => {
-				stats[lo.value] = { label: lo.label, color: lo.color, count: 0 }
+			this.defectCodeOptions.forEach(dco => {
+				stats[dco.value] = { label: dco.label, count: 0 }
 			})
 			this.defectList.forEach(d => {
-				const key = d.abnormalLevel || 'C'
+				const key = d.defectCode || ''
 				if (stats[key]) stats[key].count++
 			})
 			return Object.values(stats)
+		},
+		/** 主缺陷双向绑定（uni-data-checkbox multiple 模式需要数组） */
+		mainMarkBind: {
+			get() {
+				return this.defectForm.mainMark === 1 ? ['1'] : []
+			},
+			set(val) {
+				this.defectForm.mainMark = val.length > 0 ? 1 : 0
+			}
 		}
 	},
+	created() {
+		this.loadDicts()
+	},
 	methods: {
 		// ========== 钢卷搜索 ==========
 		async searchCoil() {
@@ -367,10 +434,15 @@ export default {
 			this.defectForm = {
 				coilId: this.selectedCoil.coilId || '',
 				coilNo: this.selectedCoil.currentCoilNo || '',
-				abnormalDesc: '',
-				abnormalLevel: 'C',
-				imgUrl: '',
-				remark: ''
+				remark: '',
+				plateSurface: [],
+				position: [],
+				startPosition: undefined,
+				endPosition: undefined,
+				defectCode: '',
+				degree: '',
+				mainMark: 0,
+				attachmentFiles: ''
 			}
 			this.uploadedImages = []
 			this.$refs.defectPopup.open()
@@ -382,12 +454,17 @@ export default {
 			this.defectForm = {
 				coilId: item.coilId || this.selectedCoil.coilId,
 				coilNo: this.selectedCoil.currentCoilNo || '',
-				abnormalDesc: item.abnormalDesc || '',
-				abnormalLevel: item.abnormalLevel || 'C',
-				imgUrl: item.imgUrl || '',
-				remark: item.remark || ''
+				remark: item.remark || '',
+				plateSurface: item.plateSurface ? item.plateSurface.split(',') : [],
+				position: item.position ? item.position.split(',') : [],
+				startPosition: item.startPosition,
+				endPosition: item.endPosition,
+				defectCode: item.defectCode || '',
+				degree: item.degree || '',
+				mainMark: item.mainMark !== undefined ? item.mainMark : 0,
+				attachmentFiles: item.attachmentFiles || ''
 			}
-			this.uploadedImages = item.imgUrl ? item.imgUrl.split(',').filter(u => u.trim()) : []
+			this.uploadedImages = item.attachmentFiles ? item.attachmentFiles.split(',').filter(u => u.trim()) : []
 			this.$refs.defectPopup.open()
 		},
 		
@@ -470,9 +547,56 @@ export default {
 		},
 		
 		// ========== 提交缺陷表单 ==========
+		/** 计算缺陷长度 */
+		calculateLength() {
+			// 可在 submit 中自动计算
+		},
+		
+		/** 加载字典数据 */
+		loadDicts() {
+			this.getDicts('coil_abnormal_code').then(res => {
+				this.defectCodeOptions = (res.data || []).map(item => ({
+					text: item.dictLabel,
+					value: item.dictValue
+				}))
+			})
+			this.getDicts('coil_abnormal_position').then(res => {
+				this.positionOptions = (res.data || []).map(item => ({
+					text: item.dictLabel,
+					value: item.dictValue
+				}))
+			})
+			this.getDicts('coil_abnormal_degree').then(res => {
+				this.degreeOptions = (res.data || []).map(item => ({
+					text: item.dictLabel,
+					value: item.dictValue
+				}))
+			})
+		},
+		
 		async submitDefectForm() {
-			if (!this.defectForm.abnormalDesc) {
-				uni.showToast({ title: '请输入异常描述', icon: 'none' })
+			if (!this.defectForm.remark) {
+				uni.showToast({ title: '请输入缺陷描述', icon: 'none' })
+				return
+			}
+			if (!this.defectForm.defectCode) {
+				uni.showToast({ title: '请选择缺陷代码', icon: 'none' })
+				return
+			}
+			if (!this.defectForm.degree) {
+				uni.showToast({ title: '请选择程度', icon: 'none' })
+				return
+			}
+			if (this.defectForm.startPosition === undefined || this.defectForm.startPosition === '') {
+				uni.showToast({ title: '请输入开始位置', icon: 'none' })
+				return
+			}
+			if (this.defectForm.endPosition === undefined || this.defectForm.endPosition === '') {
+				uni.showToast({ title: '请输入结束位置', icon: 'none' })
+				return
+			}
+			if (parseInt(this.defectForm.startPosition) > parseInt(this.defectForm.endPosition)) {
+				uni.showToast({ title: '开始位置必须小于结束位置', icon: 'none' })
 				return
 			}
 			
@@ -480,10 +604,16 @@ export default {
 			try {
 				const formData = {
 					coilId: this.defectForm.coilId,
-					abnormalDesc: this.defectForm.abnormalDesc,
-					abnormalLevel: this.defectForm.abnormalLevel,
-					imgUrl: this.uploadedImages.join(','),
-					remark: this.defectForm.remark
+					remark: this.defectForm.remark,
+					plateSurface: this.defectForm.plateSurface.join(','),
+					position: this.defectForm.position.join(','),
+					startPosition: this.defectForm.startPosition,
+					endPosition: this.defectForm.endPosition,
+					length: this.defectForm.endPosition - this.defectForm.startPosition,
+					defectCode: this.defectForm.defectCode,
+					degree: this.defectForm.degree,
+					mainMark: this.defectForm.mainMark,
+					attachmentFiles: this.uploadedImages.join(',')
 				}
 				
 				if (this.formMode === 'add') {
@@ -612,13 +742,33 @@ export default {
 	}
 }
 
-// ========== 级别选择器 ==========
-.level-picker {
+// ========== uni-data-checkbox 适配 ==========
+.uni-data-checklist {
+	width: 100%;
+}
+
+// ========== 范围输入行 ==========
+.range-row {
 	display: flex;
-	flex-wrap: wrap;
+	align-items: center;
 	gap: 16rpx;
 	
-	.level-option {
+	.range-input {
+		flex: 1;
+	}
+	
+	.range-separator {
+		font-size: 28rpx;
+		color: #999;
+	}
+}
+
+// ========== 状态选择器 ==========
+.status-picker {
+	display: flex;
+	gap: 16rpx;
+	
+	.status-option {
 		padding: 14rpx 28rpx;
 		border: 2rpx solid #e8e8e8;
 		border-radius: 12rpx;
@@ -626,9 +776,77 @@ export default {
 		color: #666;
 		background: #f8f9fa;
 		
-		&.level-active {
-			background: #fff;
-			font-weight: 600;
+		&.status-active {
+			background: #e6f7ff;
+			border-color: #1890ff;
+			color: #1890ff;
+			font-weight: 500;
+		}
+	}
+}
+
+// ========== 提示文字 ==========
+.form-tip {
+	font-size: 24rpx;
+	color: #999;
+	margin-top: 8rpx;
+}
+
+// ========== 缺陷代码标识 ==========
+.defect-code-badge {
+	display: inline-block;
+	padding: 4rpx 16rpx;
+	background: #e6f7ff;
+	border-radius: 8rpx;
+	font-size: 24rpx;
+	color: #1890ff;
+	font-weight: 500;
+}
+
+.defect-degree-badge {
+	display: inline-block;
+	padding: 4rpx 16rpx;
+	background: #f6ffed;
+	border-radius: 8rpx;
+	font-size: 24rpx;
+	color: #52c41a;
+	font-weight: 500;
+	margin-left: 8rpx;
+}
+
+.defect-main-badge {
+	display: inline-block;
+	padding: 4rpx 16rpx;
+	background: #fff7e6;
+	border-radius: 8rpx;
+	font-size: 22rpx;
+	color: #fa8c16;
+	font-weight: 500;
+	margin-left: 8rpx;
+}
+
+.defect-card-top-left {
+	display: flex;
+	align-items: center;
+	flex-wrap: wrap;
+	gap: 6rpx;
+}
+
+.defect-meta {
+	display: flex;
+	flex-wrap: wrap;
+	gap: 12rpx;
+	margin-bottom: 12rpx;
+	
+	.meta-item {
+		font-size: 24rpx;
+		color: #666;
+		background: #f8f9fa;
+		padding: 4rpx 14rpx;
+		border-radius: 6rpx;
+		
+		.meta-unit {
+			color: #999;
 		}
 	}
 }
@@ -639,16 +857,16 @@ export default {
 	right: 30rpx;
 	bottom: 60rpx;
 	z-index: 9999;
-	width: 120rpx;
-	height: 120rpx;
+	width: 140rpx;
+	height: 140rpx;
 	border-radius: 50%;
 	display: flex;
 	align-items: center;
 	justify-content: center;
 	color: #fff;
-	font-size: 28rpx;
-	font-weight: 500;
-	box-shadow: 0 6rpx 20rpx rgba(0, 0, 0, 0.15);
+	font-size: 32rpx;
+	font-weight: 600;
+	box-shadow: 0 8rpx 28rpx rgba(0, 0, 0, 0.2);
 	
 	&:active {
 		transform: scale(0.95);
@@ -659,12 +877,15 @@ export default {
 
 .search-btn { background: linear-gradient(135deg, #007aff 0%, #0051d5 100%); }
 .back-btn { background: linear-gradient(135deg, #666 0%, #333 100%); }
-.add-btn { background: linear-gradient(135deg, #52c41a 0%, #389e0d 100%); }
+.add-btn { 
+	background: linear-gradient(135deg, #52c41a 0%, #389e0d 100%);
+	font-size: 60rpx;
+}
 .back-small-btn {
-	right: 180rpx;
-	width: 90rpx;
-	height: 90rpx;
-	font-size: 36rpx;
+	right: 210rpx;
+	width: 100rpx;
+	height: 100rpx;
+	font-size: 48rpx;
 	background: rgba(0,0,0,0.5);
 }
 
@@ -841,12 +1062,13 @@ export default {
 		
 		.defect-actions {
 			display: flex;
-			gap: 16rpx;
+			gap: 20rpx;
 			
 			.action-btn {
-				font-size: 24rpx;
-				padding: 4rpx 16rpx;
-				border-radius: 8rpx;
+				font-size: 28rpx;
+				padding: 12rpx 28rpx;
+				border-radius: 10rpx;
+				font-weight: 500;
 			}
 			
 			.edit-btn { background: #e6f7ff; color: #1890ff; }
@@ -942,7 +1164,7 @@ export default {
 .popup-wrap {
 	background: #fff;
 	border-radius: 24rpx 24rpx 0 0;
-	max-height: 80vh;
+	max-height: 92vh;
 	display: flex;
 	flex-direction: column;
 }
diff --git a/apps/hand-factory/pages/mine/index.vue b/apps/hand-factory/pages/mine/index.vue
index d0277fc..9939bd8 100644
--- a/apps/hand-factory/pages/mine/index.vue
+++ b/apps/hand-factory/pages/mine/index.vue
@@ -40,6 +40,13 @@
 				</view>
 			</view>
 			
+			<view class="list-cell list-cell-arrow" @click="handleToAb">
+				<view class="menu-item-box">
+					<view class="iconfont icon-setting menu-icon"></view>
+					<view>钢卷异常</view>
+				</view>
+			</view>
+			
 			<view class="list-cell list-cell-arrow" @click="handleLogout">
 				<view class="menu-item-box">
 					<view class="iconfont icon-setting menu-icon"></view>
@@ -74,6 +81,9 @@
 			handleToEqp() {
 				this.$tab.navigateTo('/pages/eqp/eqp')
 			},
+			handleToAb() {
+				this.$tab.navigateTo('/pages/defect/coil-defect')
+			},
 			handleLogout() {
 				this.$modal.confirm('确定注销并退出系统吗？').then(() => {
 					this.$store.dispatch('LogOut').then(() => {}).finally(() => {