From ef955236912a45fa33b715b8e4866eff1e74436c Mon Sep 17 00:00:00 2001
From: "SD-20230427NBFT\\Administrator" <609306725@qq.com>
Date: Tue, 30 Jul 2024 19:22:40 +0800
Subject: [PATCH] 111111

---
 pagesA/merge/face_1.vue  | 352 ++++++++++++++++++++++++++++++++++++++-
 pagesA/merge/this.scss   | 233 ++++++++++++++++++++++++++
 pagesA/photo/photo_1.vue |  11 +-
 3 files changed, 588 insertions(+), 8 deletions(-)
 create mode 100644 pagesA/merge/this.scss

diff --git a/pagesA/merge/face_1.vue b/pagesA/merge/face_1.vue
index e3cde39..a304408 100644
--- a/pagesA/merge/face_1.vue
+++ b/pagesA/merge/face_1.vue
@@ -1,22 +1,366 @@
 <template>
 	<view>
-		少时诵诗书所所所所所所
+		<view class="content ">
+			<custom_navbar :title="navbar_title" @getNavHeight="getNavHeight" :theme="theme" />
+			<view class="photo_main_face" :style="'margin-top:-'+margin_top+'px'">
+				<view class="photo_main_face_head"></view>
+				<view class="photo_main_face_1">
+					<image src="/static/img/photo/face_5.png" v-if="uploadFiles.length >=5"/>
+					<image src="/static/img/photo/face_1.png" v-if="uploadFiles.length < 5"/>
+				</view>
+				<view class="photo_main_face_2">
+					<view class="photo_main_face_2_1">上传5-10张，有效照片越多，生成效果越好</view>
+					<view class="photo_main_face_2_2">
+						<image src="/static/img/common/common_21.png" />
+					</view>
+				</view>
+
+				<view class="photo_main_face_3">
+					<view class="photo_main_face_3_one" v-for="(item,key) in successFiles" :key="key" :class="{
+						 this_class_0:key==0,
+						 this_class_4:key==4,
+						 this_class_5:key==5,
+						 this_class_9:key==9
+						 }">
+						<image :src="item" v-if="item" />
+						<view class="photo_main_face_3_one_icon" v-if="item" @tap="delPhoto(item)">
+							<image src="/static/img/common/common_22.png" />
+						</view>
+					</view>
+				</view>
+
+
+				<u-upload :fileList="photoList" @afterRead="afterRead" @delete="deletePic" name="up1" :maxCount="1"
+					v-if="uploadFiles.length < 10 && uploadFiles.length >= 1">
+					<view class="photo_main_face_4 " style="height: 88rpx;margin-left: 24rpx;margin-bottom: 0;">
+						<image src="/static/img/photo/face_7.png" />
+					</view>
+				</u-upload>
+
+				<!-- :fileList="photoList" @afterRead="afterRead" @delete="deletePic" name="1" :maxCount="5" -->
+				<u-upload :fileList="photoList" @afterRead="afterRead" @delete="deletePic" name="up2" :maxCount="1"
+					v-if="uploadFiles.length < 1">
+					<view class="photo_main_face_4 photo_full_blue_btn" style="margin-left: 24rpx;">
+						上传照片
+					</view>
+				</u-upload>
+
+
+				<view class="photo_main_face_4 photo_full_blue_btn" v-if="uploadFiles.length >=5" @tap="subFace()">
+					提交制作 0/30
+				</view>
+
+				<view class="photo_main_face_5" v-if="errorFiles.length > 0">以下照片不合格，请重新上传</view>
+				<view class="photo_main_face_3" v-if="errorFiles.length > 0">
+					<view class="photo_main_face_3_one" v-for="n in 3" :key="n">
+						<image src="/static/img/index/banner.png" />
+					</view>
+				</view>
+
+				<view class="photo_main_face_6">
+					<image src="/static/img/photo/face_6.png" />
+				</view>
+
+			</view>
+
+		</view>
+
+
+		<u-popup :show="show_1" mode="center" bgColor="transparent" :round="12">
+			<view class="show_readme_div">
+				<view class="show_readme_div_1">
+					服务说明
+				</view>
+				<view class="show_readme_div_2">
+					<view>1.AI生成写真实际效果与您上传的照片有关，请认真上传。</view>
+					<view>2.生成高峰期，可能会有排队情况，请耐心等候。</view>
+					<view>3.如需更换写真人物, 请前往【我的】增加人物的面部档案。</view>
+				</view>
+				<view class="show_readme_div_3" @tap="subPhoto">
+					确认
+				</view>
+			</view>
+		</u-popup>
+
+		
 	</view>
 </template>
 
 <script>
+	import custom_navbar from "../photo/components/photo_header.vue";
+	import unit from "@/config/unit.js";
 	export default {
+		components: {
+			custom_navbar
+
+		},
 		data() {
 			return {
-				
+				navbar_title: '上传图片',
+				theme: "blue",
+				margin_top: 0,
+				show_1: false,
+				show_2: false,
+				show_3: false,
+				photoList: [],
+				uploadFiles: [],
+				successFiles: [],
+				errorFiles: []
+
 			}
 		},
+
+		mounted() {
+
+		},
+		onPageScroll(e) {
+			if (e.scrollTop > 50) {
+				this.theme = 'white';
+
+			} else {
+
+				this.theme = 'blue';
+			}
+		},
+
+		onShow() {
+			var _this = this;
+			_this.checkAuth();
+			this.setSuccessFiles();
+			console.log('~~~~~~~~~~~~~~~~~~')
+		},
+
 		methods: {
+			setSuccessFiles() {
+				this.uploadFiles = uni.getStorageSync('ai_face_success');
+				
+				console.log('&&&&&&&&&&&&&&&&&&&&&&&&&&', this.uploadFiles);
+				if (!this.uploadFiles) {
+					this.uploadFiles = [];
+				}
+				this.successFiles = [];
+				this.uploadFiles.forEach((item, index) => {
+					this.successFiles.push(item);
+				})
+				console.log('&&&&&&&&&&&&&&&&&&&&&&&&&&', this.successFiles);
+				let slen = this.successFiles.length;
+
+				for (let n = slen; n < 10; n++) {
+					this.successFiles.push('');
+				}
+
+			},
+
+			delPhoto(url) {
+				let tmp = uni.getStorageSync('ai_face_success');
+				if (tmp) {
+					const index = tmp.indexOf(url);
+					if (index !== -1) {
+						tmp.splice(index, 1);
+					}
+					
+					uni.setStorageSync('ai_face_success', tmp);
+					this.setSuccessFiles();
+				}
+
+
+			},
+
+			getNavHeight(e) {
+				this.margin_top += e;
+			},
+			
+			subPhoto(){
+				let data = {};
+				data.tmp_id = '';
+				let imgs =  uni.getStorageSync('ai_face_success');
+				if(imgs.length < 5){
+					this.$com.showError('请上传至少5张照片!')
+					return false;
+				}
+				
+				data.imgs = imgs;
+				
+				//提交申请
+				uni.redirectTo({
+					url:'/pagesA/photo/cartoon_4?from=photo'
+				})
+				
+				
+			},
+			subFace(){
+				let data = {};
+				data.tmp_id = '';
+				let imgs =  uni.getStorageSync('ai_face_success');
+				if(imgs.length < 5){
+					this.$com.showError('请上传至少5张照片!')
+					return false;
+				}
+				
+				data.imgs = imgs;
+				
+				this.show_1 = true;
+				
+			},		
 			
+			//判断
+			checkAuth() {
+				var _this = this;
+				console.log('已授权---');
+				uni.authorize({
+					scope: 'scope.camera',
+					success(res) {
+						console.log('已授权', res);
+
+					},
+					fail(err) {
+
+						uni.showModal({
+							title: '授权失败',
+							content: '请在设置界面打开相摄像头关权限',
+							success: (res) => {
+								if (res.confirm) {
+									uni.openSetting()
+								}
+							}
+						})
+					},
+				})
+			},
+
+			async afterRead(event) {
+				var _this = this;
+				let lists = [].concat(event.file);
+
+
+				uni.showLoading({
+					title: '图片上传中',
+				});
+
+				for (let i = 0; i < lists.length; i++) {
+					var edetail = lists[i].url;
+					let filePath = edetail;
+					let _date = new Date();
+					let ext_name = filePath.substr(filePath.lastIndexOf('.'));
+					let address = _date.getFullYear() + '' + (_date.getMonth() + 1) + '' + _date.getDate();
+					let fileName = address + _date.getTime() + ext_name;
+					const img_info = await unit.getImgInfo(filePath);
+
+					let {
+						width,
+						height
+					} = img_info;
+					let maxWidth = 2480;
+					if (width > maxWidth) {
+						let scale = Math.ceil(width / maxWidth);
+						height = Math.ceil(height / scale);
+						width = Math.ceil(maxWidth);
+					}
+					let compress_path = '';
+					compress_path = await unit.compressImg(filePath, {
+						compressedWidth: width
+					}).catch((res) => {
+						console.log('上传压缩失败', err);
+						return false;
+					});
+					compress_path = compress_path ? compress_path : filePath;
+
+					//_this.upload_img(compress_path, fileName);
+					//上传
+					var upData = {
+						filePath: compress_path,
+						fileType: 'image',
+						scene: 'user_max'
+					};
+					_this.$api.ossUpload(upData, function(res) {
+
+						if (res.code == 200) {
+							let url = res.data.file_url;
+							url = _this.$api.ossurl(url);
+							//开始验证图片
+							let checkData = {
+								'url': url
+							}
+
+						
+
+							// _this.$api.post('',checkData,function(rs){
+
+							// },function(err){
+							// 	console.log(err);
+							// });
+
+							//验证成功
+							_this.uploadFiles = uni.getStorageSync('ai_face_success');
+							if (!_this.uploadFiles) {
+								_this.uploadFiles = [];
+							}
+							if (_this.uploadFiles.length < 10) {
+
+								_this.uploadFiles.push(url);
+
+								uni.setStorageSync('ai_face_success', _this.uploadFiles);
+								_this.setSuccessFiles();
+							}
+
+							// _this.uploadFiles.push(url);
+
+
+							//验证失败
+							//_this.errorFiles.push(url);
+
+
+						}
+
+					}, function(err) {
+						console.log('ossUpload fail', err);
+						_this.$com.showError('上传图片错误!!')
+
+					});
+
+
+
+				}
+				uni.hideLoading();
+
+			}
+
 		}
 	}
 </script>
 
-<style>
+<style lang="scss" scoped>
+	@import './this.scss';
+
+	.this_class_0 {
+		border-top-left-radius: 20rpx;
+
+		image {
+			border-top-left-radius: 20rpx;
+		}
+	}
+
+	.this_class_4 {
+		border-top-right-radius: 20rpx;
 
-</style>
+		image {
+			border-top-right-radius: 20rpx;
+		}
+	}
+
+	.this_class_5 {
+		border-bottom-left-radius: 20rpx;
+
+		image {
+			border-bottom-left-radius: 20rpx;
+		}
+	}
+
+	.this_class_9 {
+		border-bottom-right-radius: 20rpx;
+
+		image {
+			border-bottom-right-radius: 20rpx;
+		}
+	}
+</style>
\ No newline at end of file
diff --git a/pagesA/merge/this.scss b/pagesA/merge/this.scss
new file mode 100644
index 0000000..75cc17b
--- /dev/null
+++ b/pagesA/merge/this.scss
@@ -0,0 +1,233 @@
+.photo_main{
+	//background-color: #E3E8FE;
+	
+	width: 702rpx;
+	margin-left: 24rpx;
+	top: 0;
+	left: 0;
+	color: #000;
+	overflow: hidden;
+}
+
+.photo_full_blue_btn{
+	background: linear-gradient(to right, #4F93FF, #9976FF);
+	border-radius: 80rpx;
+	color: #fff;
+	font-size: 30rpx;
+	font-weight: 500;
+	display: flex;
+	align-items: center;
+	justify-content: center;
+	overflow: hidden;
+}
+
+
+
+.photo_back {
+		background-color: #E3E8FE;
+		min-height: 100vh;
+		width: 100%;
+		top: 0;
+		left: 0;
+		height: 100%;
+		overflow: hidden;
+	}
+
+image{
+	width: 100%;
+	height: 100%;
+}
+
+
+
+// ----------------face
+.photo_main_face{
+	margin-top: -40px;
+	background-color: #fff;
+	min-height: 100vh;
+	width: 100%;
+	top: 0;
+	left: 0;
+	height: 100%;
+	overflow: hidden;
+	
+	.photo_main_face_head{
+		height: 400rpx;
+		width: 100%;
+		background: linear-gradient( 180deg, #D1DAFF 0%, rgba(209,218,255,0.6) 46%, rgba(254,254,255,0) 100%);
+	}
+	
+	.photo_main_face_1{
+		width: 554rpx;
+		height: 82rpx;
+		margin: 40rpx auto;
+		margin-top: -180rpx;
+	}
+	
+	.photo_main_face_2{
+		width: 510rpx;
+		margin: 20rpx auto;
+		display: flex;
+		justify-content: space-around;
+		align-items: center;
+		.photo_main_face_2_1{
+			color: #999999;
+			font-size: 24rpx;
+		}
+		
+		.photo_main_face_2_2{
+			width: 26rpx;
+			height: 26rpx;
+			margin-top: -13rpx;
+		}
+	}
+	
+	.photo_main_face_3{
+		width: 702rpx;		
+		margin: 30rpx auto;
+		display: flex;
+		flex-wrap: wrap;
+		// justify-content: space-around;
+		
+		
+		.photo_main_face_3_one{
+			width: 136rpx;
+			height: 136rpx;
+			// border-radius: 18rpx;
+			border: solid 2rpx #EAE7F9;
+			background-color: #F5F6FB;
+			.photo_main_face_3_one_icon{
+				width: 26rpx;
+				height: 26rpx;
+				margin-top: -140rpx;
+				margin-left: 100rpx;
+				image{
+					border-radius: 0;
+				}
+			}
+		}
+		
+		
+	}
+	
+	.photo_main_face_4{
+		width:702rpx;
+		height: 80rpx;
+		margin: 40rpx auto;
+		
+	}
+	
+	.photo_main_face_5{
+		width: 702rpx;
+		font-size: 28rpx;
+		color: #333333;
+		margin: 0rpx auto;
+		font-weight: 400;
+	}
+	
+	.photo_main_face_6{
+		width: 702rpx;
+		height: 514rpx;
+		margin: 80rpx auto;
+	}
+	
+	
+
+	
+}
+
+.show_readme_div{
+	width: 600rpx;
+	height: 560rpx; 
+	border-radius: 24rpx; 
+	background: linear-gradient(to bottom, #D2DCFF 0%, #fff 20%);   
+	overflow: hidden;
+	.show_readme_div_1{
+		color: #333333;
+		font-size: 30rpx;
+		font-weight: bold;
+		width: 100%;
+		display: flex;
+		justify-content: center; 
+		margin-top: 48rpx;
+	}
+	.show_readme_div_2{
+		margin-top: 30rpx;
+		color: #555555;
+		font-size: 24rpx;
+		width: 480rpx;
+		overflow: hidden;
+		margin-left:60rpx;
+		line-height: 50rpx;
+	}
+	
+	.show_readme_div_2_1{
+		display: flex;
+		justify-content: space-between;
+		width: 100%;
+		
+	}
+	
+	.show_readme_div_2_1_one{
+		width: 170rpx;
+		display: flex; 
+		align-items: flex-end; 
+		.show_readme_div_2_1_one_1{
+			width: 150rpx;
+			height: 150rpx;
+			border-radius: 24rpx;
+			flex-shrink: 0;
+			image{
+				border-radius: 24rpx;
+			}
+		}
+		
+		.show_readme_div_2_1_one_2{
+			width: 40rpx;
+			height: 34rpx;	
+			flex-shrink: 0;
+			position: relative;
+			right: 32rpx ;			 
+		}
+	}
+	
+	.show_readme_div_line{
+		width: 480rpx;
+		
+		margin-left:60rpx;  
+		
+		display: flex;
+		justify-content: space-between;
+		align-items: center;
+		
+	}
+	
+	.show_readme_div_3{
+		width: 478rpx;
+		height: 80rpx;
+		margin-top: 44rpx;
+		margin-left: 60rpx;
+		border-radius: 48rpx;
+		display: flex;
+		justify-content: center;
+		align-items: center;
+		color:#fff;
+		background: linear-gradient(to right, #4F93FF 0%, #9877FF 80%); 
+	}
+	
+	.show_readme_div_4{
+		width: 478rpx;
+		height: 80rpx;
+		margin-top: 44rpx;
+		border: 2rpx solid #5093FF;
+		color: #5093FF; 
+		border-radius: 48rpx;
+		display: flex;
+		justify-content: center;
+		align-items: center;		
+		background-color: #fff; 
+	}
+	
+	
+	
+}
\ No newline at end of file
diff --git a/pagesA/photo/photo_1.vue b/pagesA/photo/photo_1.vue
index 4fea045..289fca7 100644
--- a/pagesA/photo/photo_1.vue
+++ b/pagesA/photo/photo_1.vue
@@ -91,8 +91,13 @@
 
 		mounted() {
 			//this.getScreenSize();
-			//initListHeight();
+			//initListHeight(), ;
 		},
+		
+		onLoad(){
+			this.getList();
+		},
+		
 		methods: {
 			lower(){
 				console.log('this is lower')
@@ -128,9 +133,7 @@
 				},1000)
 			},
 			
-			onLoad(){
-				this.getList();
-			},
+			
 			
 			getListData(){
 				let list = [];