更改上传页面

src/views/Workshop/uploadFace1.vue

@@ -0,0 +1,96 @@
+<script setup lang="ts">
+	import HeaderTitle from '@/components/HeaderTitle.vue'
+	import FooterNavigation from '@/components/FooterNavigation.vue'
+	import { ref, onMounted } from 'vue'
+	import { useRouter } from 'vue-router'
+	const emit = defineEmits(['view-type'])
+	onMounted(() => {
+		emit('view-type', 1)
+	})
+	const router = useRouter()
+	const faceUrl = ref('')
+	// 上传照片
+	const handleUploadFace = () => {
+		router.push({ name: 'uploadFace2' })
+	}
+	// 完成上传
+	const handleFinish = () => {
+		router.push({ name: 'customize' })
+	}
+</script>
+
+<template>
+	<header-title />
+	<!-- 上传照片 -->
+	<div class="upload-face-1">
+		<img src="@/assets/images/workshop/bg/upload_bg.png" class="bg" />
+		<div class="texts">
+			<p class="title">Keep Styling with AI?</p>
+			<p class="desc">
+				Would you like to keep playing with<br />
+				our personalized AI tools?
+			</p>
+		</div>
+		<div class="btns">
+			<button class="sandblasted-blurred" @click="handleUploadFace"><span>Upload Face</span></button>
+			<button class="sandblasted-blurred" @click="handleFinish"><span>Finish</span></button>
+		</div>
+	</div>
+	<footer-navigation is-placeholder />
+</template>
+
+<style scoped lang="less">
+	.upload-face-1 {
+		width: 100%;
+		flex: 1;
+		overflow: hidden;
+		position: relative;
+		color: #fff;
+		> * {
+			position: absolute;
+		}
+		> .bg {
+			position: relative;
+			width: 100%;
+			height: auto;
+		}
+		.btns {
+			width: 100%;
+			display: flex;
+			justify-content: center;
+
+			> button {
+				width: 40rem;
+				height: 8.3rem;
+				border-radius: 0.7rem;
+				border: 0.4rem solid #fff;
+				font-family: satoshiMedium;
+				font-weight: 500;
+				font-size: 5.5rem;
+				margin: 0 1.8rem;
+				color: #fff;
+			}
+		}
+	}
+	.upload-face-1 {
+		> .texts {
+			top: 0;
+			left: 0;
+			padding: 9.9rem 0 0 7.2rem;
+			> .title {
+				font-family: 'satoshiBold';
+				font-size: 8.63rem;
+			}
+			> .desc {
+				font-family: 'satoshiMedium';
+				font-size: 4rem;
+				margin-top: 2rem;
+				line-height: 132%;
+			}
+		}
+		> .btns {
+			bottom: 19.7rem;
+		}
+	}
+
+</style>