feat(detail): 参会人表新增 增值税及附加/摘要/现场照片 3 列 + 劳务协议展示, 角色=劳务形式, 费项改名 应发金额/个税税金/实发金额

ry-h5/utils/camera.ts

@@ -0,0 +1,138 @@
+/**
+ * 摄像头工具 (H5 only)
+ *
+ * - openCamera(video, facing): 申请摄像头权限并把实时流挂到 <video>
+ * - stopCamera(video): 停掉所有轨道
+ * - captureFrame(video): 截当前帧为 JPEG Base64
+ * - describeCameraError(err): 错误码转中文提示
+ */
+export type Facing = 'user' | 'environment'
+
+export async function openCamera(video: HTMLVideoElement, facing: Facing): Promise<void> {
+	if (!navigator.mediaDevices?.getUserMedia) {
+		throw new Error('当前浏览器不支持摄像头访问,请升级浏览器或使用 Chrome / Safari')
+	}
+
+	// 先停掉旧的 stream,防止多 stream 冲突
+	stopCamera(video)
+
+	const constraints: MediaStreamConstraints = {
+		audio: false,
+		video: {
+			facingMode: { ideal: facing },
+			width: { ideal: 1920 },
+			height: { ideal: 1080 },
+		},
+	}
+
+	let stream: MediaStream
+	try {
+		stream = await navigator.mediaDevices.getUserMedia(constraints)
+	} catch (err) {
+		// facingMode 不被支持时降级为不指定
+		if ((err as DOMException)?.name === 'OverconstrainedError') {
+			stream = await navigator.mediaDevices.getUserMedia({
+				audio: false,
+				video: true,
+			})
+		} else {
+			throw err
+		}
+	}
+
+	// 三重保险赋值 srcObject:
+//   1. 直接赋值 (标准做法)
+//   2. 100ms 后若 readyState 仍 0,强制 Object.defineProperty
+//   3. 还不行就 src=blobURL (老 API,兼容性最广)
+video.srcObject = stream
+console.log('[camera] 第1次赋值 srcObject, readyState:', video.readyState, 'isStream:', video.srcObject === stream)
+
+// iOS 必须: 不加 playsinline 会弹原生全屏播放器
+video.setAttribute('playsinline', 'true')
+// iOS 必须: 不静音黑屏 (否则 iOS 拒绝播放)
+video.muted = true
+
+const fallbackTimer = setTimeout(() => {
+	if (video.readyState < 1) {
+		console.warn('[camera] srcObject 没生效,尝试 Object.defineProperty 强写')
+		try {
+			Object.defineProperty(video, 'srcObject', {
+				value: stream,
+				writable: true,
+				configurable: true,
+			})
+			console.log('[camera] defineProperty 后 srcObject isStream:', video.srcObject === stream)
+		} catch (e) {
+			console.error('[camera] defineProperty 也失败:', e)
+		}
+		// 再兜底: src=blobURL
+		if (video.readyState < 1) {
+			console.warn('[camera] 仍 readyState 0,改用 src=blobURL')
+			try {
+				video.src = URL.createObjectURL(stream)
+			} catch (e) {
+				console.error('[camera] blobURL 兜底失败:', e)
+			}
+		}
+	}
+}, 100)
+
+video.addEventListener(
+	'loadedmetadata',
+	() => {
+		clearTimeout(fallbackTimer)
+		console.log('[camera] loadedmetadata 触发, readyState:', video.readyState, 'isStream:', video.srcObject === stream)
+	},
+	{ once: true }
+)
+
+// 不手动调 video.play():
+//   1. UTS 把 HTMLVideoElement.play() 类型当 void,链式 .catch 会报 undefined.catch
+//   2. <video autoplay muted playsinline> + srcObject 已让浏览器自动起流
+// 若某些浏览器不自动播放,在用户点击 shutter 等交互中再触发 play()
+}
+
+export function stopCamera(video: HTMLVideoElement): void {
+	const obj = video.srcObject as MediaStream | null
+	if (obj) {
+		obj.getTracks().forEach((t) => t.stop())
+		video.srcObject = null
+	}
+}
+
+export function captureFrame(video: HTMLVideoElement): string {
+	const w = video.videoWidth || video.clientWidth
+	const h = video.videoHeight || video.clientHeight
+	if (!w || !h) {
+		throw new Error('视频流尚未就绪,无法截图')
+	}
+	const canvas = document.createElement('canvas')
+	canvas.width = w
+	canvas.height = h
+	const ctx = canvas.getContext('2d')
+	if (!ctx) throw new Error('无法获取 canvas 2D 上下文')
+	ctx.drawImage(video, 0, 0, w, h)
+	return canvas.toDataURL('image/jpeg', 0.85)
+}
+
+export function describeCameraError(err: unknown): string {
+	const name = (err as DOMException)?.name || ''
+	switch (name) {
+		case 'NotAllowedError':
+		case 'PermissionDeniedError':
+			return '请在浏览器设置中允许使用摄像头权限'
+		case 'NotFoundError':
+		case 'DevicesNotFoundError':
+			return '未检测到摄像头设备'
+		case 'NotReadableError':
+		case 'TrackStartError':
+			return '摄像头被其他程序占用,请关闭后重试'
+		case 'OverconstrainedError':
+		case 'ConstraintNotSatisfiedError':
+			return '摄像头参数不支持,已自动降级'
+		case 'SecurityError':
+			return '请通过 HTTPS 或 localhost 访问以使用摄像头'
+		default:
+			return '打开摄像头失败:' + ((err as Error)?.message || String(err))
+	}
+}