feat: award页面迁移

src/views/AwardPage/components/Success.vue

@@ -0,0 +1,81 @@
+<template>
+	<div class="success-container flex flex-col align-center">
+		<img
+			:src="info.icon"
+			alt=""
+			class="icon-img"
+		/>
+		<div class="title">{{ $t(info.title) }}</div>
+		<div class="desc">
+			{{ $t(info.desc) }}
+			<!-- <div>
+				Please review your submitted information in the AiDA in-platform message.
+			</div>
+			<div>
+				You may edit it if needed. Competition updates and results will be sent
+				via email.
+			</div> -->
+		</div>
+	</div>
+</template>
+
+<script setup lang="ts">
+	import { computed } from 'vue'
+	import { useI18n } from 'vue-i18n'
+	import successIcon from '@/assets/images/award/successful.png'
+	import expiredIcon from '@/assets/images/award/expired.png'
+
+	const { t } = useI18n()
+	const props = defineProps({
+		isExpired: {
+			type: Boolean,
+			default: false
+		}
+	})
+
+	const info = computed(() => {
+		if (props.isExpired) {
+			return {
+				icon: expiredIcon,
+				title: 'AwardsPage.deadlinePassed',
+				desc: 'AwardsPage.deadlinePassedDesc'
+			}
+		} else {
+			return {
+				icon: successIcon,
+				title: 'AwardsPage.submissionSuccessful',
+				desc: 'AwardsPage.submissionSuccessfulDesc'
+			}
+		}
+	})
+</script>
+<style lang="less" scoped>
+	.success-container {
+		margin: 0 21.5rem;
+		padding: 10.6rem 27.3rem 0;
+		height: 50rem;
+		position: relative;
+		top: -16.8rem;
+		background-color: #fff;
+		border-radius: 0.8rem;
+		.icon-img {
+			width: 12rem;
+			height: 12rem;
+		}
+		.title {
+			font-family: 'PoppinsBold';
+			font-weight: 600;
+			font-size: 3rem;
+			color: #232323;
+			text-align: center;
+			margin: 2rem 0 4rem;
+		}
+		.desc {
+			color: #585858;
+			font-family: Arial;
+			font-weight: 400;
+			font-size: 2.4rem;
+			text-align: center;
+		}
+	}
+</style>