rtdeviceApp/pages/device/tongue/facePhoto.nvue

<template>
	<view class="live-pusher-box" :style="{width: width + 'px',height: height + 'px'}"> 
		
		<Ba-CameraView ref="cameraView" :load="loadData" :style="{flex: 1,width: width + 'px', height: cameraHeight + 'px',display:'none'}" ></Ba-CameraView>
		
		<cover-view class="cover-view" :style="{width: width + 'px',height: height + 'px'}">
			<cover-view class="uni-nav-bar" :style="{width: width + 'px'}">
				<cover-view class="uni-nav-bar" :style="{width: width + 'px',top:statusBarHeight}">
					<!-- <cover-view :style="{height: statusBarHeight,width: width + 'px'}"></cover-view> -->
						<cover-view class="uni-nav-barbox">
							<cover-view class="flex-center" @click="back">
								<cover-image class="uni-nav-back" src="@/static/image/new/icon_back1.png" mode="aspectFill"></cover-image>
								<text class="uni-nav-title-t">返回</text>
							</cover-view>
						</cover-view>
						<cover-view class="title-box" :style="{width: width + 'px'}">
							<cover-view :style="{height: statusBarHeight,width: width + 'px'}"></cover-view>
							<text class="title">请您正对摄像头</text>
							<text class="tips">确保正脸在辅助框内，保持面部无遮挡，表情自然</text>
						</cover-view>
						<!-- <cover-view :style="{height: statusBarHeight,width: width + 'px'}"></cover-view> -->
							<cover-view class="uni-nav-barbox">
								<cover-view class="flex-center" @click="showConfirmModal">
									<cover-image class="uni-nav-back" src="@/static/image/new/icon_home.png" mode="aspectFill"></cover-image>
									<text class="uni-nav-title-t">首页</text>
								</cover-view>
							</cover-view>
				</cover-view>
			</cover-view>
			<!-- <cover-view class="title-box" :style="{width: width + 'px'}">
				<cover-view :style="{height: statusBarHeight,width: width + 'px'}"></cover-view>
				<text class="title">请您正对摄像头</text>
				<text class="tips">确保正脸在辅助框内，保持面部无遮挡，表情自然</text>
			</cover-view> -->
			<cover-view class="imagebox" :style="{width:width + 'px',height: height+ 'px'}">
					<!-- <view v-if="width<height" :style="{width:width + 'px',height: height/4+ 'px'}" style="background:#262523 ;"></view> -->
					<image  class="face"  :style="{width:width + 'px',height: height+ 'px'}" src="@/static/image/new/mask_face.png" mode="aspectFill"></image>
			  <cover-view class="countdown-box" :style="{width:width + 'px',height: height+ 'px'}">
			  <text class="title" v-if="countdownTimer && currentCount > 0">{{ currentCount }}</text>
			 <image  v-if="isResult" class="success" src="@/static/image/new/icon_success.png" mode="aspectFill"></image>
			 <text v-if="isResult" class="desc">即将开始舌诊检测 {{countDown2}}s</text>
			 <text v-if="hasTakenPhoto" class="error"  @click="handleReScan">重新扫描</text>
			  </cover-view>
			  </cover-view>
			<!-- <cover-view class="box" :style="{width:width + 'px',height: height + 'px'}">
					<cover-view class="imagebox" :style="{width:width + 'px'}">
						<cover-image class="face" :style="{width:width + 'px'}" src="@/static/image/device/facial_photography_mask_bg.png" mode="aspectFill"></cover-image>
					</cover-view>
			</cover-view> -->
		</cover-view>
		<!-- <view class="camera-footer" id="camera-footer" :style="{width: width + 'px'}">
			<view class="camera-options" :style="{width: width + 'px'}">
				<view class="camera-options-left camera-item" @click="handleAlbum">
					<image src="@/static/image/device/album_icon24.png" mode="scaleToFill" style="width: 34rpx;height:34rpx;margin-bottom: 5rpx;"></image>
					<text class="camera-item-t">相册上传</text>
				</view>
				<view class="camera-options-center camera-item" @click="handleShutter">
					<view class="photograph-btn"></view>
				</view>
				<view class="camera-options-ritht camera-item" @click="handleReversal">
					<image src="@/static/image/device/switch_camera_icon24.png" mode="scaleToFill" style="width: 34rpx;height:34rpx;margin-bottom: 5rpx;"></image>
					<text class="camera-item-t">切换摄像头</text>
				</view>
			</view>
		</view> -->
	</view>

</template>

<script>
	import { isAgreePrivacy } from '@/utils/common.js'
	import shareBox from "@/components/share-box/share-boxN.vue"
	import {getCount,add,addFace} from '@/api/healthTongue.js'
	import { premissionCheck } from "@/js_sdk/wa-permission/permission.js"
	// 这个组件仅限APP使用！！！
	export default {
		components: {
			shareBox
		},
		data() {
			// 在data初始化时就进行设备检测
			const systemInfo = uni.getSystemInfoSync();
			console.log('设备信息:', systemInfo);
			// // 判断是否为平板设备
			// const isTabletBySize = systemInfo.screenWidth > 800 && systemInfo.screenHeight > 1200;
			const isTabletByModel = systemInfo.brand && (
				//systemInfo.model.toLowerCase().includes('tablet') ||
				//systemInfo.model.toLowerCase().includes('pad') ||
				systemInfo.brand.toLowerCase().includes('shimeta')
			);
			
			const isTablet = isTabletByModel;
			const defaultCameraFacing = isTablet ? false : true; // 平板默认后置，手机默认前置
			console.log('设备检测结果:', {
				isTablet,
				defaultCameraFacing: defaultCameraFacing ? '前置' : '后置',
				screenSize: `${systemInfo.screenWidth}x${systemInfo.screenHeight}`,
				model: systemInfo.model
			});
			
			return {
				baseUrl:uni.getStorageSync('requestPath'),
				height: uni.getSystemInfoSync().screenHeight,
				width: uni.getSystemInfoSync().screenWidth,
				cameraHeight: uni.getSystemInfoSync().screenHeight - uni.getSystemInfoSync().statusBarHeight - 100,
				statusBarHeight: uni.getSystemInfoSync().statusBarHeight + 'px',
				livePusher: null,
				ready: true,
				cameraHeight: '', //相机画面宽度
				coverImage: null,
				counts: 0,
				marginTop: uni.getSystemInfoSync().statusBarHeight + uni.upx2px(130),
				device: 'back',
				cameraContext: null,
				shutterShow: false,
				menuLeft: '100%',
				// 设备类型检测
				isTablet: isTablet,
				isShimeta: isTablet,
				loadData: { //配置
				    isToast: false,
					isShowVibrate:false,
					isFacingFront: defaultCameraFacing, // 根据设备类型设置默认摄像头
					captureQuality:"HIGH", //摄像头清晰度 **HIGH**: 1920x1080 (高清)  **MEDIUM**: 1280x720 (中等) **LOW**: 640x480 (低清)
					autoZoomEnabled: true,     // 启用自动变焦
					autoZoomMode: "FACE",       // 变焦模式：FACE(面部) 或 TONGUE(舌诊)
					isTablet: isTablet // 设备类型配置
				},
				currentQuality:0,
				currentZoomMode:"FACE", // 默认使用舌诊模式
				statusMessage:"",
				windowResizeCallback:null,
				cameraReady: false, // 相机是否初始化完成
				 countdown: 5, // 倒计时总时长（秒）
				 currentCount: 0, // 当前剩余倒计时
				 countdownTimer: null, // 倒计时定时器实例（用于后续清除）
				 hasTakenPhoto: false, // 是否已完成拍照，避免重复触发
				 user:{},
				 isResult:false,//结果
				 countDown2: 3, // 初始倒计时5秒
				 timer: null ,// 定时器标识
				 isShow:false//中途退出
			}
                
		},
		created(){
			let that=this;
			// uni.$on('navigateBack', function(data) {
			// 	that.handleReversal();
			// });
		},
		onLoad() {
			//this.getCount();
			this.setListener();
			
			
		},
		mounted() {
			// 强制应用配置，确保平板设备使用后置摄像头
			// this.$nextTick(() => {
			// 	this.forceApplyConfig();
			// });
		},
		onShow() {
			this.user=JSON.parse(uni.getStorageSync('userInfo'));
			console.log("用户缓存",this.user)
			this.windowResizeCallback = (res) => {
				// 重新获取屏幕尺寸
				this.getScreenSize(res.size);
			}
			uni.onWindowResize(this.windowResizeCallback);
		},
		onReady() {
			setTimeout(()=>{
				this.switchZoomMode(this.loadData.autoZoomMode);
			},200);
		},
		onUnload() {
			this.clearCountdownTimer();
			clearInterval(this.timer);
			this.timer = null;
			 if (this.windowResizeCallback) {
			      uni.offWindowResize(this.windowResizeCallback);
			      this.windowResizeCallback = null;
			    }
			// uni.$off('navigateBack');
		},
		methods: {
			showConfirmModal() {
				this.clearCountdownTimer()
			  uni.showModal({
			    title: "提示", // 弹窗标题
			    content: "确定要中断当前操作，返回首页吗～", // 弹窗内容
			    showCancel: true, // 是否显示取消按钮（默认 true）
			    cancelText: "取消", // 取消按钮文本
			    confirmText: "确定", // 确认按钮文本
			    cancelColor: "#37C3A0", // 取消按钮颜色
			    confirmColor: "#37C3A0", // 确认按钮颜色
			    success: (res) => {
			      // 回调：用户点击确认/取消
			      if (res.confirm) {
					  uni.reLaunch({
					  	url: '/pages/index/index',
					  	animationType: 'none',
					  	animationDuration: 2000
					  })
			        console.log("用户点击确定");
			        // 执行后续业务逻辑（如删除数据）
			      } else if (res.cancel) {
			        console.log("用户点击取消");
			      }
			    }
			  });
			},
			   // 清除倒计时定时器
			    clearCountdownTimer() {
			      if (this.countdownTimer) {
			        clearInterval(this.countdownTimer);
			        this.countdownTimer = null;
					//this.hasTakenPhoto=true
			      }
			    },
				// 倒计时逻辑
				   startCountDown() {
				     this.timer = setInterval(() => {
				       if (this.countDown2 > 0) {
				         this.countDown2--;
				       } else {
				         // 倒计时结束，清除定时器
				         clearInterval(this.timer);
				         this.timer = null;
						 this.isResult=false;
						 this.hasTakenPhoto = false;
						uni.redirectTo({
						  url:"/pages/device/tongue/indexOld"
						});
				       }
				     }, 1000);
				   },
				//重新扫描
				handleReScan() {
				      this.isResult = false;
				      this.hasTakenPhoto = false;
				      this.startCountdownTakePhoto();
				    },
			getScreenSize(res) {
				this.width = res.windowWidth
			    this.height = res.windowHeight
				if (this.$refs.cameraView) { 
					
				    this.switchZoomMode(this.loadData.autoZoomMode);
				    } else {
				        
				    }
			},
			switchZoomMode(currentMode) {
				//启动舌诊模式自动变焦
				this.$refs.cameraView.setAutoZoom((result) => {
					if (result.ok) {
						console.log('自动变焦设置成功:', this.loadData.autoZoomMode);
						this.cameraReady=true
						this.startCountdownTakePhoto();
					} else {
						console.error('自动变焦模式:', result.msg);
					}
				}, {
					enabled: this.loadData.autoZoomEnabled,
					mode: currentMode
				});
			},
			
			getCount(){
				getCount().then(
					res => {
						if(res.code==200){
							this.counts=res.data;
						}else{
							uni.showToast({
								icon:'none',
								title: "请求失败",
							});
						}
					},
					rej => {}
				);
			},
		
			// 快门
			handleShutter() {
				if (this.ready) {
					this.ready = false;
					let options={scaleW:403,scaleH:620,isCrop:false};
					this.$refs.cameraView.takePicture((res) => {
						  this.ready = true;
						  const filePath=res.data.path;
						  console.log("qxj takePicture",res);
						  plus.io.resolveLocalFileSystemURL(filePath, (entry) => {
								 let url= entry.toLocalURL();
								 this.startDetectionFace(url)
								 // uni.navigateTo({
								 // 	url:"/pages/device/tongue/index?rightUrl="+url
								 // })
						   }, (error) => {
								console.error('Failed to resolve file system URL:', error);
						   });
					  },options);
					
				}
			},
			//面诊
			startDetectionFace(url){
				if(!url){
					uni.showToast({
						title: '扫描失败，请重试',
						icon: 'none'
					});
					return;
				}
				uni.showLoading({
					title:"扫描中...",
					mask:true
				})
				uni.uploadFile({
					url: uni.getStorageSync('requestPath')+'/app/common/uploadOSS', //仅为示例，非真实的接口地址
					filePath: url,
					name: 'file',
					formData: {
						'user': 'test'  // 上传附带参数
					},
					success: (uploadFileRes) => {
						console.log('---',this.user)
						// console.log('---',JSON.parse(uploadFileRes.data).url)
						var data={
							userId:this.user.fsUserId,
							sex:this.user.sex,
							name:this.user.username,
							surfaceUrl:JSON.parse(uploadFileRes.data).url,
						}
						addFace(data).then(res => {
							    console.log('zaiFC',data,res)
								if(res.code==200){
									uni.hideLoading();
								    this.isResult=true
									this.startCountDown()
								}else{
									uni.hideLoading();
									this.errMsg= res.msg;
									this.hasTakenPhoto=true
									uni.showToast({
										icon:'none',
										title: res.msg,
									});
								}
							},
							rej => {}
						);
					},fail: (err) => {
								uni.hideLoading();
								uni.showToast({
									title: '上传失败，请重试',
									icon: 'none'
								});
								console.error('上传失败：', err);
							}
				});
			},
			// 相册
			async handleAlbum() {
				// #ifdef APP-PLUS
				 uni.chooseImage({
						count: 1, //默认9
						sizeType: ['original', 'compressed'], //可以指定是原图还是压缩图，默认二者都有
						sourceType: ['album'], //从相册选择
						success: (res) => {
							uni.setStorageSync("tongueUrl",res.tempFilePaths[0])
							let url= res.tempFilePaths[0]
							uni.redirectTo({
								url:"/pages/device/tongue/index?rightUrl="+url
							})
						}
				 });
				// #endif
			},
			// 反转摄像头
			handleReversal() {
				if(this.isShimeta){
					uni.showToast({
						title:"该设备不支持切换摄像头",
						icon:"none"
					});
					return;
				}
				this.switchZoomMode(this.loadData.autoZoomMode)
				this.$refs.cameraView.switchCamera((result) => {
				    if (result.ok) {
						this.loadData.isFacingFront = !this.loadData.isFacingFront;
						this.statusMessage = `已切换到${this.loadData.isFacingFront ? '前置' : '后置'}摄像头`;
				        uni.showToast({
				            title: "切换成功",
				            icon: 'none'
				        });
				    } else {
						this.statusMessage = '切换摄像头失败: ' + result.msg;
				    }
				});
			},
			// 强制应用当前配置（确保平板设备配置生效）
			forceApplyConfig() {
				console.log('强制应用配置:', this.loadData);
				// 如果是平板设备，确保使用后置摄像头
				if (this.isTablet && this.loadData.isFacingFront) {
					console.log('检测到平板设备使用前置摄像头，强制切换到后置');
					this.loadData.isFacingFront = false;
					this.statusMessage = '平板设备强制使用后置摄像头';
					// 调用底层API确保配置生效
					this.setRearCamera();
					
					// 平板设备切换摄像头后，重新应用自动变焦设置
					if (this.loadData.autoZoomEnabled) {
						setTimeout(() => {
							this.reapplyAutoZoom();
						}, 1000); // 等待摄像头切换完成
					}
				}
				// 更新状态显示
				this.statusMessage = this.isTablet ? 
					'平板设备 - 后置摄像头' : 
					(this.loadData.isFacingFront ? '手机设备 - 前置摄像头' : '手机设备 - 后置摄像头');
			},
			
			// 重新应用自动变焦设置
			reapplyAutoZoom() {
				console.log('重新应用自动变焦设置:', {
					enabled: this.loadData.autoZoomEnabled,
					mode: this.currentZoomMode
				});
				this.$refs.cameraView.setAutoZoom((result) => {
					if (result.ok) {
						this.statusMessage = `平板设备 - 自动变焦已重新应用 (${this.currentZoomMode}模式)`;
						console.log('平板设备自动变焦重新应用成功');
					} else {
						this.statusMessage = '重新应用自动变焦失败: ' + result.msg;
						console.error('Failed to reapply auto zoom:', result.msg);
					}
				}, {
					enabled: this.loadData.autoZoomEnabled,
					mode: this.currentZoomMode
				});
			},
			// 舌诊记录
			handleReportlist() {
				uni.navigateTo({
					url: "/pages/user/tongue/tongueList"
				})
			},
			// 启动5秒倒计时，结束后拍照
			    startCountdownTakePhoto() {
			      // 边界判断：相机未就绪、已拍照、定时器已存在，直接返回
			      if (!this.cameraReady || this.countdownTimer) {
			        return;
			      }
			      
			      // 初始化当前剩余倒计时
			      this.currentCount = this.countdown;
			      console.log(`倒计时开始：${this.currentCount} 秒`);
			      
			      // 启动倒计时定时器（每秒执行一次）
			      this.countdownTimer = setInterval(() => {
			        // 倒计时递减
			        this.currentCount--;
			        console.log(`剩余：${this.currentCount} 秒`);
			        
			        // 倒计时结束
			        if (this.currentCount <= 0) {
			          this.clearCountdownTimer(); // 清除定时器
			          this.handleShutter(); // 触发自动拍照
			        }
			      }, 1000); // 1000毫秒 = 1秒
			      
			      // 可选：如果不需要可视倒计时，直接延迟5秒拍照（更简洁）
			      // setTimeout(() => {
			      //   this.autoTakePhoto();
			      // }, 5000);
			    },
			setListener() {
				this.$refs.cameraView.setListener((res) => {
					console.log("qxj setListener",res);
					if (res.action == "error") {
						this.showToast(res.msg)
					}else{ // 新增：监听相机初始化就绪事件（需子组件支持）
          this.cameraReady = true;
          console.log("相机初始化完成，即将开始5秒倒计时");
          // 相机就绪后，启动倒计时拍照
          
        }
				});
			},
			showToast(msg) {
				uni.showToast({
					title: msg,
					icon: 'none'
				});
			},
			navTo() {
				uni.navigateTo({
					url: "/pages/device/tongue/ques"
				})
			},
			// 返回
			back(){
				uni.navigateBack();
			},
		
		}
	}
</script>

<style lang="scss" scoped>
	@mixin u-flex($flexD, $alignI, $justifyC) {
		display: flex;
		flex-direction: $flexD;
		align-items: $alignI;
		justify-content: $justifyC;
	}
	/* 遮罩层样式 */
		.mask {
			position: fixed;
			top: 0;
			left: 0;
			right: 0;
			bottom: 0;
			background-color: rgba(0, 0, 0, 0.5);
			display: flex;
			justify-content: center;
			align-items: center;
			z-index: 999;
			animation: fadeIn 0.3s ease;
		}
	
		/* 弹窗容器样式 */
		.popup-container {
			//width: 50%;
			width: 620px;
			height: 352px;
			background: #FFFFFF;
			border-radius: 39px 39px 39px 39px;
			animation: scaleIn 0.3s ease;
			overflow: hidden;
			display: flex;
			flex-direction: column;
			align-items: center;
			justify-content: space-between;
			padding:43px;
			position: relative;
			.bg{
				width: 1005;
				height: 244px;
				position: absolute;
				top:0
			}
			.title-t {
				image{
					width: 153px;
					height: 25px;
				}
				text{
					font-family: PingFang SC, PingFang SC;
					font-weight: 500;
					font-size: 32px;
					color: #333333;
					margin: 0 10px;
				}
			}
	
			.title-r {
				font-family: PingFang SC, PingFang SC;
				font-weight: 400;
				font-size: 28px;
				color: #333333;
			}
	       .btn-l{
			   display: flex;
			   align-items: center;
			   justify-content: center;
			   font-family: PingFang SC, PingFang SC;
			   font-weight: 600;
			   font-size: 28px;
			   color: #37C3A0;
			   width: 220px;
			   height: 64px;
			   border-radius: 121px 121px 121px 121px;
			   border: 2px solid #37C3A0;
			   margin-right: 40px;
		   }
			.btn-r {
				display: flex;
				align-items: center;
				justify-content: center;
				width: 220px;
				height: 64px;
				background: #37C3A0;
				border-radius: 121px 121px 121px 121px;
				font-family: PingFang SC, PingFang SC;
				font-weight: 600;
				font-size: 28px;
				color: #FFFFFF;
			}
		}
	.flex-center {
		@include u-flex(row, center, center);
	}
	.live-pusher-box {
		background: #666;
		@include u-flex(column, center, center);
	}
	.imagebox {
		// margin-top: 200px;
		// top:0;
		// left: 0;
		// right: 0; // 新增：让容器铺满屏幕宽度，确保文本居中生效
		// overflow: hidden;
		display: flex;
		flex-direction: column;
		align-items: center;
		justify-content: center;
		position: relative;
		// padding-bottom: 100rpx;
		.desc{
			margin-top: 20px;
			font-family: PingFang SC, PingFang SC;
			font-weight: 500;
			font-size: 24px;
			color: #fff;
		}
	}
	.face {
		 width: 100%;
		 height: 100%;
	}
	.countdown-box{
		  position: absolute;
		  display: flex;
		  align-items: center;
		  justify-content: center;
		  top:0;
		  z-index: 99;
		  .title{
			  font-family: PingFang SC, PingFang SC;
			  font-weight: 500;
			  font-size: 240px;
			  line-height: 300px !important;
			  color: #fff;
		  }
		  .success{
			  width: 180px;
			  height: 180px;
		  }
		  .error{
			  text-align: center;
			  line-height:68px;
			  width: 200px;
			  height: 68px;
			  background: #37C3A0;
			  border-radius: 69px 69px 69px 69px;
			  font-family: PingFang SC, PingFang SC;
			  font-weight: 600;
			  font-size: 28px;
			  color: #FFFFFF;
		  }
	}
	.cover-view {
		width: 100%;
		position: absolute;
		top: 0;
		left: 0;
	   @include u-flex(column, center, center);
	}
	.title-box{
		 position: fixed;
		  left: 0;
		  right: 0; // 新增：让容器铺满屏幕宽度，确保文本居中生效
		  z-index: 998; // 低于导航栏 z-index:999，避免遮挡导航栏
		  width: 100%;
	}
	.title {
		// margin-top: calc(var(--status-bar-height) + 130rpx);
		font-family: PingFang SC, PingFang SC;
		font-weight: 500;
		font-size: 36px;
		color: #FFFFFF;
		// line-height: 54px;
		text-align: center;
	}
	.tips {
		margin-top: 20px;
		// margin-bottom: 60rpx;
		font-family: PingFang SC, PingFang SC;
		font-weight: 400;
		font-size: 28px;
		color: #FFFFFF;
		text-align: center;
	}
	.boder-box{
		width: 66rpx;
		height: 32rpx;
		background: rgba(255,255,255,0.2);
		border-radius: 8rpx;
		border: 1px solid #FFFFFF;
	}
	.uni-nav-bar {
		position: fixed;
		left: 0px;
		width: 100%;
		z-index: 999;
		overflow: hidden;
		font-family: PingFang SC, PingFang SC;
		font-weight: 500;
		color: #fff;
		padding-left: 28px;
		padding-right: 28px;
		// background-color: #000;
		@include u-flex(row, center, space-between);
		.uni-nav-barbox {
		width: 140px;
		height: 48px;
		background: rgba(2,2,2,0.15);
		border-radius: 41px 41px 41px 41px;
		border: 1px solid rgba(255,255,255,0.3);
		@include u-flex(row, center, center);
		}
		.uni-nav-title-t {
			font-family: SourceHanSansSC;
			font-weight: 400;
			margin-left: 5rpx;
			color: #fff;
			/* #ifdef APP-PLUS */
			font-size: 14rpx;
			/* #endif */
			/* #ifndef APP-PLUS */
			font-size: 14rpx;
			/* #endif */
		}
		.uni-nav-title {
			font-family: PingFang SC, PingFang SC;
			font-weight: 500;
			font-size: 22px;
			color: #FFFFFF;
			text-align: left;
			@include u-flex(row, center, center);
			.ques {
				// flex-shrink: 0;
				width: 33rpx;
				height: 33rpx;
				margin-left: 9rpx;
			}
		}
		.uni-nav-back {
			width: 16rpx;
			height: 16rpx;
		}
	}
	.uni-nav-bar2 {
		position: fixed;
		 top: 28px;
		right: 28px;
		width: 100%;
		z-index: 999;
		overflow: hidden;
		font-family: PingFang SC, PingFang SC;
		font-weight: 500;
		color: #fff;
		// background-color: #000;
		.uni-nav-barbox {
		width: 140px;
		height: 48px;
		background: rgba(2,2,2,0.15);
		border-radius: 41px 41px 41px 41px;
		border: 1px solid rgba(255,255,255,0.3);
		@include u-flex(row, center, center);
		}
		.uni-nav-title-t {
			font-family: SourceHanSansSC;
			font-weight: 400;
			margin-left: 5rpx;
			color: #fff;
			/* #ifdef APP-PLUS */
			font-size: 14rpx;
			/* #endif */
			/* #ifndef APP-PLUS */
			font-size: 14rpx;
			/* #endif */
		}
		.uni-nav-title {
			font-family: PingFang SC, PingFang SC;
			font-weight: 500;
			font-size: 22px;
			color: #FFFFFF;
			text-align: left;
			@include u-flex(row, center, center);
			.ques {
				// flex-shrink: 0;
				width: 33rpx;
				height: 33rpx;
				margin-left: 9rpx;
			}
		}
		.uni-nav-back {
			width: 16rpx;
			height: 16rpx;
		}
	}
	// .center-box{
	// 	width: 100%;
	// 	display: flex;
	// 	align-items: center;
	// 	justify-content: space-around;
	// }
	.camera-footer {
		background-color: #000;
		overflow: hidden;
		position: fixed;
		bottom: 0;
		left: 0;
	}
	.usenum {
		text-align: center;
		@include u-flex(row, center, center);
		.usenum-t {
			font-family: SourceHanSansCN;
			font-weight: 400;
			font-size: 24rpx;
			color: #FFFFFF;
			padding: 14rpx;
		}
	}
	.camera-options {
		width: 100%;
		padding-top: 15rpx;
		padding-bottom: 15rpx;
		// box-sizing: border-box;
		@include u-flex(row, center, space-around);
	}
	.camera-item {
		display: flex;
		flex-direction: column;
		align-items: center;
	}
	.camera-item-t {
		font-family: SourceHanSansCN;
		font-weight: 400;
		font-size: 16rpx;
		color: #FFFFFF;
	}
	.camera-options-center {
		width: 52rpx;
		height: 52rpx;
		border-radius: 50%;
		border-radius: 50%;
		border: 3px solid #FFFFFF;
		display: flex;
		align-items: center;
		justify-content: center;
	}
	.photograph-btn {
		width: 45rpx;
		height: 45rpx;
		background: #8F6726;
		border-radius: 50%;
	}

</style>