add:如果打手端使用的设备是移动端,验证图片和验证视频上传的时候加个调用相机的功能

This commit is contained in:
2026-10-24 17:03:57 +08:00
parent 0ee5554f57
commit 0d3dd3eacd
7 changed files with 266 additions and 20 deletions
+44
View File
@@ -0,0 +1,44 @@
/** 上传场景:只有打手端(worker)在移动设备上需要直接调起系统相机。 */
export type CameraEntryScope = 'admin' | 'worker' | 'collect'
/** 相机捕获类型:图片走拍照,视频走拍摄。 */
export type CameraCaptureKind = 'image' | 'video'
type ResolveCameraEntryOptions = {
/** 当前是否为移动端布局(useIsMobile,宽度 <= 768) */
isMobile: boolean
/** 上传作用域 */
scope?: CameraEntryScope | (string & {})
/** 显式开关:传了就以此为准(true 强制显示,false 强制隐藏) */
allowCamera?: boolean
}
/**
* 是否显示「拍照 / 拍摄」入口。
*
* 规则:默认仅「打手端 + 移动端」显示。管理端/采集端仍只保留相册选择;
* 桌面端(宽度 > 768)隐藏,避免出现点了只会打开文件选择的无效入口。
*
* 说明:这里用 `<input type="file" capture="environment">` 调起系统相机,
* 不依赖 getUserMedia,因此在局域网 HTTP(如 http://192.168.10.8:8080)下同样可用。
*/
export function resolveCameraEntryEnabled(options: ResolveCameraEntryOptions): boolean {
if (typeof options.allowCamera === 'boolean') return options.allowCamera
return options.isMobile && options.scope === 'worker'
}
/**
* 系统相机 file input 的属性。
*
* `capture="environment"` 让移动浏览器优先打开后置摄像头;iOS Safari 的部分版本会
* 忽略该属性并弹出「拍照 / 从相册选择」菜单,属于预期内的降级行为。
*/
export function cameraCaptureInputProps(kind: CameraCaptureKind): {
accept: string
capture: 'environment'
} {
return {
accept: kind === 'image' ? 'image/*' : 'video/*',
capture: 'environment',
}
}
+1 -1
View File
@@ -264,7 +264,7 @@ export async function compressVideoForUpload(
} finally {
if (frameHandle) cancelAnimationFrame(frameHandle)
try {
audioContext?.close()
void audioContext?.close()
} catch {
// ignore
}