AiSkinMeasurementMp/pages/skin-assessment/photoProcess.vue

<template>
	<view class="photo-process">
		<!-- <u-navbar is-back="true" class="nav-bar" :border-bottom	="false" title-color="#333" title="图片识别" :custom-back="onNavBack">
		</u-navbar> -->

		<image class="photo-process-img" :src="detectFaceImg" mode="widthFix"></image>
		<cover-view class="action">
			<cover-view shape="circle" hover-class="none" class="btn" @click="onPhotoReSet">重拍</cover-view>
			<cover-view shape="circle" hover-class="none" class="btn full" @click="onSubmit">确认</cover-view>
		</cover-view>

	</view>
</template>

<script>
	export default {
		data() {
			return {
				paddTopHeight: '',
				imgSize: null,
				props: {}
			}
		},
		computed: {
			detectFaceImg() {
				return this.$store.state.user.photoPath
			}
		},
		methods: {
			
			onNavBack() {
				uni.redirectTo({
					url: `/pages/index/index`,
				})
			},
			async onSubmit() {
				uni.redirectTo({
					url: `/pages/details/index`,
				})
			},
			onPhotoReSet() {
				// 重拍，返回拍照页面
				this.onNavBack();
			},
			getImgSize() {
				let that = this;
				if(that.detectFaceImg) {
					const fileSystemManager = uni.getFileSystemManager();
					// 获取文件状态
					fileSystemManager.stat({
						path: that.detectFaceImg,
						success: function (statRes) {
							console.log('文件大小：', statRes.stats.size);
							const fileSizeInMB = (statRes.stats.size / (1024 * 1024)).toFixed(2); // 转换为MB
							that.imgSize = fileSizeInMB;
							console.log('文件大小：', fileSizeInMB, 'MB'); // 输出文件大小，单位是MB// 文件大小，单位是字节
						},
						fail: function (err) {
							console.error('获取文件状态失败：', err);
						}
					});
				}
				
			}
			

		},
		onLoad() {
			// this.paddTopHeight = this.$util.getPaddTopheight();
		}
	}
</script>

<style lang="scss">
	.photo-process {
		height: 100vh;
		width: 100vw;
		overflow: hidden;

		.action {
			height: 120rpx;
			width: 100vw;
			position: fixed;
			bottom: 60rpx;
			left: 0;
			display: flex;
			justify-content: center;
			align-items: center;
			background: none;
			z-index: 9999;

			.btn {
				height: 70rpx;
				line-height: 70rpx;
				width: 266rpx;
				border: 4rpx solid #333;
				text-align: center;
				border-radius: 60rpx;
				font-family: OPPOSans;
				font-weight: bold;
				font-size: 32rpx;
				color: #333;

				&.full {
					background-color: #333;
					color: #F3D4A3;
					margin-left: 30rpx;
					font-weight: bold;
				}
			}


		}

		.nav-bar {	
		}
		.photo-process-img {
			position: relative;
			height: 100vh;
			width: 100vw;
		}

		.canvas-con {
			position: relative;
			z-index: 999;

			#myCanvas {
				height: 100vh;
				width: 100vw;
				z-index: 999;
			}
		}



	}
</style>