组对

2026-06-24 20:50:15 +08:00
parent 41623ecb32
commit 9e9826acbb
9 changed files with 738 additions and 586 deletions
@@ -67,44 +67,22 @@
 		</view>

 		<!-- 焊前拍照 -->
-		<view class="info-group photo-section">
+		<view class="section">
 			<view class="section-header">
 				<text class="section-title">焊前拍照</text>
-				<text class="section-tip" v-if="beforePhotoList.length === 0">请拍摄焊接前照片</text>
 			</view>
-			<view class="photo-grid">
-				<view class="photo-item" v-for="(photo, index) in beforePhotoList" :key="photo._id">
-					<image class="photo-img" :src="photo.src" mode="aspectFill" @click="previewPhoto(beforePhotoList, index)"></image>
-					<view class="photo-tag" v-if="photo.uploaded">&#10003;</view>
-					<view class="photo-delete" @tap.stop="deletePhoto(beforePhotoList, index)">
-						<u-icon name="close" color="#fff" size="14"></u-icon>
-					</view>
-				</view>
-				<view class="photo-item photo-add" @click="handleTakeBeforePhoto" v-if="beforePhotoList.length < 6">
-					<u-icon name="camera" color="#ccc" size="40"></u-icon>
-					<text class="add-text">拍照</text>
-				</view>
+			<view class="section-body">
+				<nbd-photo-upload ref="beforePhotoRef" v-model:attachUrl="preWeldAttachUrl" typeName="WeldingDaily_Before" />
 			</view>
 		</view>

 		<!-- 焊后拍照 -->
-		<view class="info-group photo-section">
+		<view class="section">
 			<view class="section-header">
 				<text class="section-title">焊后拍照</text>
-				<text class="section-tip" v-if="afterPhotoList.length === 0">请拍摄焊接后照片</text>
 			</view>
-			<view class="photo-grid">
-				<view class="photo-item" v-for="(photo, index) in afterPhotoList" :key="photo._id">
-					<image class="photo-img" :src="photo.src" mode="aspectFill" @click="previewPhoto(afterPhotoList, index)"></image>
-					<view class="photo-tag" v-if="photo.uploaded">&#10003;</view>
-					<view class="photo-delete" @tap.stop="deletePhoto(afterPhotoList, index)">
-						<u-icon name="close" color="#fff" size="14"></u-icon>
-					</view>
-				</view>
-				<view class="photo-item photo-add" @click="handleTakeAfterPhoto" v-if="afterPhotoList.length < 6">
-					<u-icon name="camera" color="#ccc" size="40"></u-icon>
-					<text class="add-text">拍照</text>
-				</view>
+			<view class="section-body">
+				<nbd-photo-upload ref="afterPhotoRef" v-model:attachUrl="postWeldAttachUrl" typeName="WeldingDaily_After" />
 			</view>
 		</view>

@@ -127,14 +105,17 @@
 	import { ref } from 'vue'
 	import { onLoad } from '@dcloudio/uni-app'
 	import { reqGetWeldJointByWeldJointId, reqSaveWeldingDailyByWeldJointId, reqGetManualPointSave } from '@/api/hj.js'
-	import { reqWeldingLocation, uploadAttach } from '@/api/base.js'
-	import { baseFileUrl, parseAttachUrls } from '@/utils/request.js'
+	import { reqWeldingLocation } from '@/api/base.js'
 	import { useUserStore } from '@/store'
+
+
 	const userStore = useUserStore()
 	const { userInfo } = userStore

 	// ===== 表单数据 =====
 	const form = ref({})
+	const preWeldAttachUrl = ref('')
+	const postWeldAttachUrl = ref('')

 	// ===== 弹窗 =====
 	const showLocationPicker = ref(false)
@@ -146,79 +127,8 @@
 		{ BaseInfoName: '盖面',     BaseInfoCode: 2 },
 	])

-	// ===== 照片数据 =====
-	const beforePhotoList = ref([])
-	const afterPhotoList = ref([])
-	let photoIdSeed = 0
-
-	// ===== 拍照（只存本地，等填报时统一上传） =====
-	const handleTakeBeforePhoto = () => takePhoto(beforePhotoList)
-	const handleTakeAfterPhoto = () => takePhoto(afterPhotoList)
-
-	const takePhoto = (listRef) => {
-		uni.chooseImage({
-			count: 1,
-			sourceType: ['camera'],
-			success: (res) => {
-				const tempPath = res.tempFilePaths[0]
-				const id = ++photoIdSeed
-				listRef.value.push({
-					_id: id,
-					src: tempPath,
-					uploaded: false
-				})
-			}
-		})
-	}
-
-	// ===== 是否需要上传（本地临时路径才需要） =====
-	const isLocalPath = (src) => src && !src.startsWith(baseFileUrl)
-
-	// ===== 批量上传 =====
-	const uploadAllPhotos = async (listRef, typeName) => {
-		const photos = listRef.value.filter(p => !p.uploaded && isLocalPath(p.src))
-		const urls = []
-		for (const photo of photos) {
-			photo.uploading = true
-			photo.progress = 0
-			try {
-				const result = await uploadAttach(photo.src, { typeName }, (progress) => {
-					photo.progress = progress
-				})
-				photo.uploading = false
-				photo.uploaded = true
-				photo.result = result
-				const url = Array.isArray(result) ? result[0] : result
-				if (url) {
-					urls.push(url)
-					photo.src = `${baseFileUrl}${url}`
-				}
-			} catch (e) {
-				photo.uploading = false
-			}
-		}
-		return urls
-	}
-
-	const hasPendingBefore = () => beforePhotoList.value.some(p => !p.uploaded && isLocalPath(p.src))
-	const hasPendingAfter = () => afterPhotoList.value.some(p => !p.uploaded && isLocalPath(p.src))
-
-	// ===== 预览照片 =====
-	const previewPhoto = (list, index) => {
-		const urls = list.map(p => p.src)
-		uni.previewImage({ current: index, urls })
-	}
-
-	// ===== 删除照片 =====
-	const deletePhoto = (list, index) => {
-		uni.showModal({
-			title: '确认删除',
-			content: '确定要删除这张照片吗？',
-			success: ({ confirm }) => {
-				if (confirm) list.splice(index, 1)
-			}
-		})
-	}
+	const beforePhotoRef = ref(null)
+	const afterPhotoRef = ref(null)

 	// ===== 弹窗 ========
 	const handleShowLocationSelect = () => {
@@ -254,29 +164,13 @@
 			content: '确定要填报吗？',
 			success: async ({ confirm }) => {
 				if (confirm) {
-					const needBefore = hasPendingBefore()
-					const needAfter = hasPendingAfter()
-					let PreWeldAttachUrl = form.value.PreWeldAttachUrl || ''
-					let PostWeldAttachUrl = form.value.PostWeldAttachUrl || ''
-
+					console.log(beforePhotoRef.value?.hasPending())
+					const needBefore = beforePhotoRef.value?.hasPending()
+					const needAfter = afterPhotoRef.value?.hasPending()
 					if (needBefore || needAfter) {
 						uni.showLoading({ title: '上传照片中...', mask: true })
-						if (needBefore) {
-							const urls = await uploadAllPhotos(beforePhotoList, 'WeldingDaily_Before')
-							if (urls.length) {
-								PreWeldAttachUrl = PreWeldAttachUrl
-									? PreWeldAttachUrl + ',' + urls.join(',')
-									: urls.join(',')
-							}
-						}
-						if (needAfter) {
-							const urls = await uploadAllPhotos(afterPhotoList, 'WeldingDaily_After')
-							if (urls.length) {
-								PostWeldAttachUrl = PostWeldAttachUrl
-									? PostWeldAttachUrl + ',' + urls.join(',')
-									: urls.join(',')
-							}
-						}
+						if (needBefore) await beforePhotoRef.value.uploadAll()
+						if (needAfter) await afterPhotoRef.value.uploadAll()
 						uni.hideLoading()
 					}

@@ -286,8 +180,8 @@
 						time: form.value.WeldingDateTemp,
 						weldingLocation: form.value.WeldingLocationId || '',
 						welderType: form.value.welderType,
-						PreWeldAttachUrl,
-						PostWeldAttachUrl
+						PreWeldAttachUrl: preWeldAttachUrl.value || form.value.PreWeldAttachUrl || '',
+						PostWeldAttachUrl: postWeldAttachUrl.value || form.value.PostWeldAttachUrl || ''
 					})
 					uni.showToast({ title: '保存成功', icon: 'none' })
 					setTimeout(() => { uni.navigateBack() }, 1500)
@@ -315,95 +209,35 @@
 			form.value.welderTypeName = "打底/盖面"

 			// 回显已有照片
-			beforePhotoList.value = parseAttachUrls(form.value.PreWeldAttachUrl, photoIdSeed)
-			photoIdSeed += beforePhotoList.value.length
-			afterPhotoList.value = parseAttachUrls(form.value.PostWeldAttachUrl, photoIdSeed)
-			photoIdSeed += afterPhotoList.value.length
+			preWeldAttachUrl.value = form.value.PreWeldAttachUrl || ''
+			postWeldAttachUrl.value = form.value.PostWeldAttachUrl || ''
 		})
 	})
 </script>

 <style scoped lang="scss">
-	.photo-section {
+	.section {
+		background: #ffffff;
+		margin: 24rpx;
+		border-radius: 16rpx;
+		overflow: hidden;
+		box-shadow: 0 2rpx 12rpx rgba(0, 0, 0, 0.06);
+
 		.section-header {
-			padding: 24rpx 32rpx 16rpx;
 			display: flex;
 			align-items: center;
 			justify-content: space-between;
+			padding: 24rpx 32rpx 16rpx;

 			.section-title {
 				font-size: 28rpx;
 				font-weight: 600;
 				color: #333;
 			}
-
-			.section-tip {
-				font-size: 24rpx;
-				color: #999;
-			}
 		}

-		.photo-grid {
-			display: flex;
-			flex-wrap: wrap;
+		.section-body {
 			padding: 0 24rpx 24rpx;
-			gap: 16rpx;
-		}
-
-		.photo-item {
-			width: 200rpx;
-			height: 200rpx;
-			border-radius: 12rpx;
-			overflow: hidden;
-			position: relative;
-			background: #f5f6f8;
-
-			.photo-img {
-				width: 100%;
-				height: 100%;
-			}
-
-			.photo-tag {
-				position: absolute;
-				top: 6rpx;
-				left: 6rpx;
-				width: 36rpx;
-				height: 36rpx;
-				border-radius: 50%;
-				background: rgba(0, 200, 83, 0.85);
-				color: #fff;
-				font-size: 22rpx;
-				display: flex;
-				align-items: center;
-				justify-content: center;
-			}
-
-			.photo-delete {
-				position: absolute;
-				top: 6rpx;
-				right: 6rpx;
-				width: 36rpx;
-				height: 36rpx;
-				border-radius: 50%;
-				background: rgba(0, 0, 0, 0.5);
-				display: flex;
-				align-items: center;
-				justify-content: center;
-			}
-		}
-
-		.photo-add {
-			display: flex;
-			flex-direction: column;
-			align-items: center;
-			justify-content: center;
-			border: 2rpx dashed #ddd;
-
-			.add-text {
-				font-size: 24rpx;
-				color: #ccc;
-				margin-top: 8rpx;
-			}
 		}
 	}
 </style>