AiSkinMeasurementMp/pages/skin-assessment/photograph.vue

<template>
    <view class="detect-face-con">
		<!-- <u-navbar is-back="true"  class="nav-bar" title-color="#333" title="皮肤拍照"  :custom-back="onNavBack"></u-navbar> -->
		<div class="comp" :style="{'top': paddTopHeight + 'px'}">
			<face-bio-assay :isDev="false" :top="paddTopHeight" :isShowNavbar="false" ref="faceDetect" @detectFailed="detectFailed" @photoChange="photoChange">
			</face-bio-assay>
		</div>
		
    </view>
</template>

<script>
    import faceBioAssay from '@/components/face-bio-assay/face-bio-assay.vue'
    export default {
        components: {
            faceBioAssay,
        },
		data() {
			return {
				paddTopHeight: '',
				props: {}
			}
		},
        onLoad(props) { //一定要onLoad，onShow在进入相机授权页面退回时会再次触发
            this.$refs.faceDetect.initData();
        },
        methods: {
			onNavBack() {
				console.log("点击了返回", );
				this.$u.route({
					type: 'redirectTo',
					url: '/pages/index/index',
				})
			},
            detectFailed(e) {
				if(e) {
					uni.showToast({
					    title: "您未授权摄像头权限",
					    icon: 'none'
					})
					// setTimeout(() => {
					// 	this.$u.route({
					// 		type: 'switchTab',
					// 		url: '/pages/index/index',
					// 	})
					// }, 1000)
				} else {
					uni.showToast({
					    title: "摄像头加载失败~，请重试~",
					    icon: 'none'
					})
				}
               
                /* uni.navigateBack() */
            },
            async photoChange(path) {
				let image = await this.$api.upload(
					this.$util.tempUrlToUpload(path, `${this.$util.formateDate('yyyy-mm-dd-HH:MM:SS')}_sign.png`,)
				);
				let imgUrl = image.data.fileUrl;
				console.log("imgUrl", imgUrl);
				this.$store.commit('setPhotoPath', imgUrl);
				this.$store.commit('saveAll');
				if(image) {
					// 跳转页面
					uni.redirectTo({
						url: `/pages/skin-assessment/photoProcess`,
					})
				} else {
					uni.showToast({
					    title: "请您重新拍照",
					    icon: 'none'
					})
				}
				
            }
        }
    }
</script>
<style lang="scss" scoped>
	.detect-face-con {
		height: 100vh;
		width: 100vw;
		// overflow: hidden;
		z-index: 950;
		.nav-bar{
			position: absolute;
			top: 0;
			left: 0;
			/* height: 80rpx !important; */
			font-weight: 500 !important;
			z-index: 9999;
		}
		.comp {
			position: relative;
		}
		
	}
	
</style>