aidlab/aida_front
7
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

feat: 竞赛主页中文

Browse Source
This commit is contained in:
zhangyahui
2026-02-04 10:57:25 +08:00
parent 287825b4bf
commit ca782d0aff
13 changed files with 4016 additions and 3682 deletions
Download Patch File Download Diff File Expand all files Collapse all files

107
src/views/AwardPage/components/ApplySection.vue
View File

@@ -8,13 +8,13 @@
class="title animation-element"
ref="applyTitleRef"
>
How to Apply
{{ $t('AwardsPage.howToApply') }}
</div>
<div
class="sub-title animation-element"
ref="applySubTitleRef"
>
Step by step
{{ $t('AwardsPage.stepByStep') }}
</div>
<div
class="requirments-list flex flex-col"
@@ -29,26 +29,26 @@
:style="{ background: item.background || '#fff' }"
>
<div class="item-header flex flex-center">
<div class="item-title">{{ item.type }}</div>
<div class="item-title">{{ $t(item.type) }}</div>
</div>
<div class="context-container flex flex-center">
<div
class="context"
v-for="el in item.desc"
>
{{ el }}
{{ $t(el) }}
</div>
<div
class="list"
v-if="item.listTitle"
>
<div class="list-title">{{ item.listTitle }}</div>
<div class="list-title">{{ $t(item.listTitle) }}</div>
<ul class="list-items">
<li
class="list-item"
v-for="el in item.list"
>
{{ el }}
{{ $t(el) }}
</li>
</ul>
</div>
@@ -57,43 +57,36 @@
</div>
<div class="bottom flex">
<div class="step-3 flex flex-col animation-element" ref="step3Ref">
<div class="header">Step 3. Prepare Your Submission</div>
<div class="header">{{ $t('AwardsPage.step3Title') }}</div>
<div class="content flex">
<div class="content-left flex flex-col space-between">
<div class="content-item">
<div class="item-header flex align-center">
<div class="point"></div>
<div>Process Video</div>
<div>{{ $t('AwardsPage.processVideo') }}</div>
</div>
<div class="desc-wrapper flex flex-col space-between">
<div class="item-desc">
Include a screen‑recorded video
<br />
your creative process
<br />
using AiDA.​
<br />
{{ $t('AwardsPage.processVideoDesc') }}
</div>
<ul class="desc-lists">
<div class="desc-lists-title">
Video requirements:
{{ $t('AwardsPage.videoRequirements') }}
</div>
<li>Format: MP4</li>
<li>Resolution: 1080×1920 px</li>
<li>Duration: Maximum 1 minute</li>
<li>File size: Maximum 20MB</li>
<li>{{ $t('AwardsPage.videoFormat') }}</li>
<li>{{ $t('AwardsPage.videoResolution') }}</li>
<li>{{ $t('AwardsPage.videoDuration') }}</li>
<li>{{ $t('AwardsPage.videoSize') }}</li>
</ul>
</div>
</div>
<div class="content-item">
<div class="item-header flex align-center">
<div class="point"></div>
<div>File Name</div>
<div>{{ $t('AwardsPage.fileName') }}</div>
</div>
<div class="item-desc indent">
AiDAGlobalDesignAward
<br />
2026_[Your Full Name]​
{{ $t('AwardsPage.fileNameDesc') }}
</div>
</div>
</div>
@@ -101,7 +94,7 @@
<div class="content-item flex flex-col">
<div class="item-header flex align-center">
<div class="point"></div>
<div>Design Portfolio(PDF)</div>
<div>{{ $t('AwardsPage.designPortfolio') }}</div>
</div>
<div
class="desc-wrapper flex-1 flex flex-col space-between"
@@ -109,25 +102,23 @@
<ul class="desc-lists">
<div class="desc-lists-title">
<p>
Submit one single PDF file that includes:
{{ $t('AwardsPage.submitPdf') }}
</p>
<p>Required structure:</p>
<p>{{ $t('AwardsPage.requiredStructure') }}</p>
</div>
<li>Design title</li>
<li>Moodboard</li>
<li>Concept explanation</li>
<div>(How to used AiDA to develop design)</div>
<li>{{ $t('AwardsPage.pdfDesignTitle') }}</li>
<li>{{ $t('AwardsPage.pdfMoodboard') }}</li>
<li>{{ $t('AwardsPage.pdfConcept') }}</li>
<div>{{ $t('AwardsPage.pdfConceptDesc') }}</div>
</ul>
<ul class="desc-lists">
<div class="desc-lists-title">
<p>PDF requirements:</p>
<p>{{ $t('AwardsPage.pdfRequirements') }}</p>
</div>
<li>Maximum 15 pages</li>
<li>Maximum file size: 20MB</li>
<li>{{ $t('AwardsPage.pdfMaxPages') }}</li>
<li>{{ $t('AwardsPage.pdfMaxSize') }}</li>
<li>
Language: English or native language
<br />
with English translation
{{ $t('AwardsPage.pdfLanguage') }}
</li>
</ul>
</div>
@@ -137,31 +128,22 @@
</div>
<div class="step-4 animation-element" ref="step4Ref">
<div class="header flex flex-col flex-center">
<p>Step 4. Finalist Requirement</p>
<p class="sub-title">(for top 20 Designers)</p>
<p>{{ $t('AwardsPage.step4Title') }}</p>
<p class="sub-title">{{ $t('AwardsPage.step4Subtitle') }}</p>
</div>
<div class="content">
<div class="content-item">
<div class="desc-wrapper flex-1 flex flex-col space-between">
<ul class="desc-lists">
<div class="desc-lists-title">
The 20 finalists will be required to
<br />
submit physical garments for final
<br />
evaluation
{{ $t('AwardsPage.step4Desc') }}
</div>
<li>Number of pieces: 1</li>
<li>{{ $t('AwardsPage.finalistPieces') }}</li>
<li>
Garments must be produced
<br />
based on the submitted
<br />
AiDA-generated designs
{{ $t('AwardsPage.finalistBasedOn') }}
</li>
<li>
Shipping instructions will be provided by
Code-create
{{ $t('AwardsPage.finalistShipping') }}
</li>
</ul>
</div>
@@ -175,25 +157,24 @@
<script setup lang="ts">
import { nextTick, onBeforeUnmount, onMounted, ref } from 'vue'
import { useI18n } from 'vue-i18n'
import { gsap } from 'gsap'
const { t } = useI18n()
const leftRequirment = ref([
{
type: 'Step 1. Become an\nAiDA Subscriber​',
desc: [
'All applicants must be active\nAiDA subscribers at the time of\nsubmission.​ You may subscribe\nunder either a monthly or yearly plan.​'
]
type: 'AwardsPage.step1Title',
desc: ['AwardsPage.step1Desc']
},
{
type: 'Step 2. Create Your Design Using AiDA',
desc: [
'Applicants must create their\ndesigns exclusively using the\nAiDA platform.​ '
],
listTitle: 'Your work shold clearly demonstrate:',
type: 'AwardsPage.step2Title',
desc: ['AwardsPage.step2Desc'],
listTitle: 'AwardsPage.step2ListTitle',
list: [
'· How AiDA is used as a creative tool',
'· Your design concept and creative direction',
'· The intergration of AI and human creativity'
'AwardsPage.step2List[0]',
'AwardsPage.step2List[1]',
'AwardsPage.step2List[2]'
],
background: '#F9F9F9'
}

52
src/views/AwardPage/components/Bloom.vue
View File

@@ -4,46 +4,44 @@
class="title"
ref="titleRef"
>
Bloom Your Creativity
{{ $t('AwardsPage.bloomYourCreativity') }}
</div>
<div
class="season"
ref="subtitleRef"
>
Theme of 2026
{{ $t('AwardsPage.themeOf2026') }}
</div>
<div
class="desc"
ref="textRef"
>
<p class="section-1">
The
<span class="arial-bold">AiDA Global Design Award 2026</span>
is an
<span class="arial-bold">international design competition</span>
hosted by
<span class="arial-bold">Code‑Create</span>
, a globally leading
<br />
<span class="arial-bold">AI fashion solutions provider,</span>
celebrating the future of creativity powered by artificial intelligence.
<br />
Bringing together designers from around the world, AiDA empowers AI as a
creative partner—pushing fashion beyond
<br />
traditional boundaries and unlocking new possibilities where technology
amplifies human imagination.​
{{ $t('AwardsPage.bloomText.desc1.regular1') }}
<span class="arial-bold">
{{ $t('AwardsPage.bloomText.desc1.bold1') }}
</span>
{{ $t('AwardsPage.bloomText.desc1.regular2') }}
<span class="arial-bold">
{{ $t('AwardsPage.bloomText.desc1.bold2') }}
</span>
{{ $t('AwardsPage.bloomText.desc1.regular3') }}
<span class="arial-bold">
{{ $t('AwardsPage.bloomText.desc1.bold3') }}
</span>
{{ $t('AwardsPage.bloomText.desc1.regular4') }}
<span class="arial-bold">
{{ $t('AwardsPage.bloomText.desc1.bold4') }}
</span>
{{ $t('AwardsPage.bloomText.desc1.regular5') }}
</p>
<p class="section-2">
Under the theme “
{{ $t('AwardsPage.bloomText.desc2.regular1') }}
<span class="arial-bold">
Where Imagination Meets Innovation, Creativity Blooms,
{{ $t('AwardsPage.bloomText.desc2.bold1') }}
</span>
” participants are invited to transform bold ideas
<br />
into extraordinary designs, seamlessly merging human artistry with
artificial intelligence to shape the next era of fashion.
{{ $t('AwardsPage.bloomText.desc2.regular2') }}
</p>
</div>
</div>
@@ -51,8 +49,11 @@
<script setup lang="ts">
import { ref, onMounted, onBeforeUnmount, nextTick } from 'vue'
import { useI18n } from 'vue-i18n'
import { gsap } from 'gsap'
const { t } = useI18n()
const titleRef = ref<HTMLElement | null>(null)
const subtitleRef = ref<HTMLElement | null>(null)
const textRef = ref<HTMLElement | null>(null)
@@ -192,7 +193,8 @@
padding: 0 21.5rem;
line-height: 4.5rem;
margin-bottom: 12.3rem;
.section-2{
white-space: pre-line;
.section-2 {
margin-top: 4rem;
}
}

23
src/views/AwardPage/components/JudgesSection.vue
View File

@@ -1,8 +1,8 @@
<template>
<div class="judges-container flex flex-col align-center">
<div class="title" ref="judgesTitleRef">Panel of Judges</div>
<div class="title" ref="judgesTitleRef">{{ $t('AwardsPage.panelOfJudges') }}</div>
<!-- <img src="@/assets/images/award/bloom_logo.png" class="logo" /> -->
<div class="sub-title" ref="judgesSubTitleRef">Expertise</div>
<div class="sub-title" ref="judgesSubTitleRef">{{ $t('AwardsPage.expertise') }}</div>
<div class="judgement-list" ref="judgementListRef">
<div
class="judgement-item flex flex-col align-center"
@@ -10,8 +10,8 @@
:key="item.name"
>
<img :src="item.picture" class="picture" />
<div class="name">{{ item.name }}</div>
<div class="desc">{{ item.desc }}</div>
<div class="name">{{ $t(item.name) }}</div>
<div class="desc">{{ $t(item.desc) }}</div>
</div>
</div>
</div>
@@ -19,6 +19,7 @@
<script setup lang="ts">
import { onBeforeUnmount, onMounted, nextTick, ref } from 'vue'
import { useI18n } from 'vue-i18n'
import { gsap } from 'gsap'
import jae from '@/assets/images/award/jae.png'
import diego from '@/assets/images/award/diego.png'
@@ -27,36 +28,38 @@ import vincenzo from '@/assets/images/award/vincenzo.png'
import tim from '@/assets/images/award/tim.png'
import desmond from '@/assets/images/award/desmond.png'
const { t } = useI18n()
const judgements = [
{
picture: jae,
name: 'Jae Hyuk Lim',
desc: 'Code-create\nKorea Branch Director\nBesfxxk creative director'
desc: 'AwardsPage.judgesHat.jae'
},
{
picture: diego,
name: 'Diego Dultzin Lacoste',
desc: 'Co-founder & Chief Father\nOfficer of OnTheList\n(Hong Kong)'
desc: 'AwardsPage.judgesHat.diego'
},
{
picture: gregory,
name: 'Gregory de la Hogue Moran',
desc: 'Senior Designer at\nGabriela Heasrst (Italy)'
desc: 'AwardsPage.judgesHat.gregory'
},
{
picture: vincenzo,
name: 'Vincenzo La Torre',
desc: 'Cheif Editor of SCMP Style\n(Hong Kong)'
desc: 'AwardsPage.judgesHat.vincenzo'
},
{
picture: tim,
name: 'Tim Lim',
desc: 'Group Fashion Direction of\n Modern Media Group\n(Shanghai)'
desc: 'AwardsPage.judgesHat.tim'
},
{
picture: desmond,
name: 'Desmond Lim',
desc: 'Cheif Editor of Vogue\n(Singapore)'
desc: 'AwardsPage.judgesHat.desmond'
}
]

52
src/views/AwardPage/components/PrizesSection.vue
View File

@@ -8,14 +8,14 @@
class="title"
ref="prizesTitleRef"
>
Award & Prizes
{{ $t('AwardsPage.awardPrizes') }}
</div>
<!-- <img src="@/assets/images/award/bloom_logo.png" class="logo" /> -->
<div
class="desc"
ref="prizesSubTitleRef"
>
Recongnition
{{ $t('AwardsPage.recognition') }}
</div>
</div>
<div
@@ -29,15 +29,15 @@
:key="item.name"
>
<div class="prize-money">
{{ item.money }}
{{ $t(item.money) }}
</div>
<div class="prize-name">{{ item.name }}</div>
<div class="prize-name">{{ $t(item.name) }}</div>
<div class="prize-desc flex flex-col flex-center">
<div
class="desc-item"
v-for="el in item.desc"
>
{{ el }}
{{ $t(el) }}
</div>
</div>
</div>
@@ -47,28 +47,46 @@
<script setup lang="ts">
import { nextTick, onBeforeUnmount, onMounted, ref } from 'vue'
import { useI18n } from 'vue-i18n'
import { gsap } from 'gsap'
const { t } = useI18n()
const prizes = [
{
money: 'US$5000',
name: 'Grand Awards',
desc: ['Cash Award', 'Award Ceritificate', 'Global Media Exposure']
money: 'AwardsPage.grandMoney',
name: 'AwardsPage.grandAwards',
desc: [
'AwardsPage.cashAward',
'AwardsPage.awardCertificate',
'AwardsPage.globalMediaExposure'
]
},
{
money: 'US$3000',
name: 'Gold Awards',
desc: ['Cash Award', 'Award Ceritificate', 'Global Media Exposure']
money: 'AwardsPage.goldMoney',
name: 'AwardsPage.goldAwards',
desc: [
'AwardsPage.cashAward',
'AwardsPage.awardCertificate',
'AwardsPage.globalMediaExposure'
]
},
{
money: 'US$2000',
name: 'Silver Awards',
desc: ['Cash Award', 'Award Ceritificate', 'Global Media Exposure']
money: 'AwardsPage.silverMoney',
name: 'AwardsPage.silverAwards',
desc: [
'AwardsPage.cashAward',
'AwardsPage.awardCertificate',
'AwardsPage.globalMediaExposure'
]
},
{
money: 'Award\nCertification',
name: 'Finalists',
desc: ['Award Ceritificate', 'Global Media Exposure'],
money: 'AwardsPage.awardCertification',
name: 'AwardsPage.finalists',
desc: [
'AwardsPage.TravelAllowance',
'AwardsPage.globalMediaExposure'
],
smaller: true
}
]

27
src/views/AwardPage/components/SelectionSection.vue
View File

@@ -3,9 +3,9 @@
class="selection-container container flex flex-col align-center"
ref="selectionRef"
>
<div class="title">Selection Criteria</div>
<div class="title">{{ $t('AwardsPage.selectionCriteria') }}</div>
<!-- <img src="@/assets/images/award/bloom_logo.png" class="logo" /> -->
<div class="sub-title">Evaluation</div>
<div class="sub-title">{{ $t('AwardsPage.evaluation') }}</div>
<div class="criteria-list flex" ref="criteriaListRef">
<div
class="item flex flex-col align-center"
@@ -13,8 +13,8 @@
:key="item.name"
>
<img :src="item.icon" class="icon" :style="item.style" />
<div class="name">{{ item.name }}</div>
<div class="desc">{{ item.desc }}</div>
<div class="name">{{ $t(item.name) }}</div>
<div class="desc">{{ $t(item.desc) }}</div>
</div>
</div>
</div>
@@ -22,35 +22,38 @@
<script setup lang="ts">
import { nextTick, onBeforeUnmount, onMounted, ref } from 'vue'
import { useI18n } from 'vue-i18n'
import { gsap } from 'gsap'
import criteria1 from '@/assets/images/award/criteria_1.png'
import criteria2 from '@/assets/images/award/criteria_2.png'
import criteria3 from '@/assets/images/award/criteria_3.png'
import criteria4 from '@/assets/images/award/criteria_4.png'
const { t } = useI18n()
const criteriaList = ref([
{
icon: criteria1,
name: 'Originality',
desc: 'Unique perspective and\ninnovative approach to\nfashion design',
name: 'AwardsPage.originality',
desc: 'AwardsPage.originalityDesc',
style: { width: '13rem', height: '17rem' }
},
{
icon: criteria2,
name: 'Creativity',
desc: 'Artistic vision and exceptional\ndesign excellence',
name: 'AwardsPage.creativity',
desc: 'AwardsPage.creativityDesc',
style: { width: '16rem', height: '18rem' }
},
{
icon: criteria3,
name: 'AiDA Integration',
desc: 'Effective application of\nAiDA functions',
name: 'AwardsPage.aidaIntegration',
desc: 'AwardsPage.aidaIntegrationDesc',
style: { width: '16rem', height: '18rem' }
},
{
icon: criteria4,
name: 'Execution',
desc: 'Quality of presentation and\ntechnical craftsmanship',
name: 'AwardsPage.execution',
desc: 'AwardsPage.executionDesc',
style: { width: '18.8rem', height: '18rem' }
}
])

25
src/views/AwardPage/components/Slogan.vue
View File

@@ -10,32 +10,35 @@
:key="item.number"
:style="{ '--delay': `${idx * 0.18}s` }"
>
<div class="number">{{ item.number }}</div>
<div class="label">{{ item.label }}</div>
<div class="number">{{ $t(item.number) }}</div>
<div class="label">{{ $t(item.label) }}</div>
<div class="line"></div>
</div>
</div>
</template>
<script setup lang="ts">
import { ref, onMounted, onUnmounted } from 'vue'
import { computed, ref, onMounted, onUnmounted } from 'vue'
import { useI18n } from 'vue-i18n'
const { t } = useI18n()
const blocksList = ref([
{
number: 'UP TO\nUS$9000',
label: 'In total cash prizes'
number: 'AwardsPage.totalCashPrizes',
label: 'AwardsPage.totalCashPrizesLabel'
},
{
number: 'GLOBAL MEDIA EXPOSE',
label: 'Showcased by top\ninternational media platforms​'
number: 'AwardsPage.globalMediaExpose',
label: 'AwardsPage.globalMediaExposeLabel'
},
{
number: 'NETWORKING\n OPPORTUNITIES',
label: 'Build connections with\ndesigners and industry leaders​'
number: 'AwardsPage.networkingOpportunities',
label: 'AwardsPage.networkingOpportunitiesLabel'
},
{
number: 'AWARD CEREMONY\nIN HONG KONG​',
label: 'Travel allowance\nprovided for finalists​'
number: 'AwardsPage.awardCeremonyHongKong',
label: 'AwardsPage.awardCeremonyLabel'
}
])
const root = ref<HTMLElement | null>(null)

11
src/views/AwardPage/components/Success.vue
View File

@@ -21,8 +21,11 @@
<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,
@@ -34,14 +37,14 @@
if (props.isExpired) {
return {
icon: expiredIcon,
title: 'Application Deadline Passed',
desc: 'The submission deadline for AiDA Global Fashion Award 2026 has ended.\nWe are no longer accepting new applications. '
title: t('AwardsPage.deadlinePassed'),
desc: t('AwardsPage.deadlinePassedDesc')
}
} else {
return {
icon: successIcon,
title: 'Submission Successful',
desc: 'Please review your submitted information in the AiDA in-platform message.\nYou may edit it if needed. Competition updates and results will be sent via email.'
title: t('AwardsPage.submissionSuccessful'),
desc: t('AwardsPage.submissionSuccessfulDesc')
}
}
})

57
src/views/AwardPage/components/TimeLine.vue
View File

@@ -3,8 +3,8 @@
ref="containerRef"
class="timeline-container container flex flex-col align-center"
>
<div class="timeline-title">Competition Timeline</div>
<div class="desc">Shaping the Future</div>
<div class="timeline-title">{{ $t('AwardsPage.competitionTimeline') }}</div>
<div class="desc">{{ $t('AwardsPage.shapingTheFuture') }}</div>
<div
class="timeline-point"
ref="timelineRef"
@@ -16,12 +16,12 @@
v-for="item in points"
:key="'label-' + item.time"
>
<div class="main-label">{{ item.label }}</div>
<div class="main-label">{{ $t(item.label) }}</div>
<div
class="sub-label"
v-if="item.subLabel"
>
{{ item.subLabel }}
{{ $t(item.subLabel) }}
</div>
</div>
</div>
@@ -46,7 +46,7 @@
v-for="item in points"
:key="'time-' + item.time"
>
{{ item.time }}
{{ $t(item.time) }}
</div>
</div>
@@ -58,7 +58,7 @@
:key="'desc-' + item.time"
>
<div class="txt">
{{ item.desc }}
{{ $t(item.desc) }}
</div>
</div>
</div>
@@ -67,43 +67,46 @@
</template>
<script setup lang="ts">
import { nextTick, onBeforeUnmount, onMounted, ref } from 'vue'
import { nextTick, onBeforeUnmount, onMounted, ref, computed } from 'vue'
import { useI18n } from 'vue-i18n'
import { gsap } from 'gsap'
const { t } = useI18n()
const containerRef = ref<HTMLElement | null>(null)
const timelineRef = ref<HTMLElement | null>(null)
const hasAnimated = ref(false)
const points = ref([
{
label: 'Application',
subLabel: 'Deadline',
time: 'Jul 15',
desc: 'Application deadline and\nentry review process\nbegins.'
label: 'AwardsPage.timelineApplicationLabel',
subLabel: 'AwardsPage.timelineDeadlineLabel',
time: 'AwardsPage.timeJul15',
desc: 'AwardsPage.applicationDeadlineDesc'
},
{
label: `20 Finallists`,
subLabel: 'Announced',
time: 'Aug 30',
desc: 'Announcement of 20\nfinalists entering final\nevaluation stage.'
label: 'AwardsPage.twentyFinalistsAnnounced',
subLabel: 'AwardsPage.announcedLabel',
time: 'AwardsPage.timeAug30',
desc: 'AwardsPage.twentyFinalistsDesc'
},
{
label: `Finallist\nSubmission`,
subLabel: 'Deadline',
time: 'Sept 30',
desc: 'Finalists submit\ncompleted outfits for\nfinal assessment.'
label: 'AwardsPage.finalistSubmission',
subLabel: 'AwardsPage.submissionLabel',
time: 'AwardsPage.timeSept30',
desc: 'AwardsPage.finalistSubmissionDesc'
},
{
label: 'Receiving Outfits',
subLabel: 'from Finallists',
time: 'October',
desc: 'AiDA receives physical\noutfits from all 20\nfinalists.'
label: 'AwardsPage.receivingOutfits',
subLabel: 'AwardsPage.fromFinalistsLabel',
time: 'AwardsPage.timeOctober',
desc: 'AwardsPage.receivingOutfitsDesc'
},
{
label: 'Award',
subLabel: 'Ceremony',
time: 'Nov 12',
desc: 'Award Ceremony &\nCommunity Gathering\n– Soho House.'
label: 'AwardsPage.awardCeremony',
subLabel: 'AwardsPage.ceremonyLabel',
time: 'AwardsPage.timeNov12',
desc: 'AwardsPage.awardCeremonyDesc'
}
])

13
src/views/AwardPage/components/UploadStatus.vue
View File

@@ -22,6 +22,9 @@
</template>
<script setup lang="ts">
import { computed, watch } from 'vue'
import { useI18n } from 'vue-i18n'
const { t } = useI18n()
const props = defineProps<{
status: string
type: 'pdf' | 'video'
@@ -29,16 +32,16 @@
const textMap: Record<string, string> = {
idle: '',
uploading: 'Upload in progress…',
success: 'Uploaded Successfully',
error: 'Upload failed'
uploading: computed(() => t('AwardsPage.uploadInProgress')).value,
success: computed(() => t('AwardsPage.uploadSuccess')).value,
error: computed(() => t('AwardsPage.uploadFailed')).value
}
const tips = computed(() => {
if (props.type === 'pdf') {
return 'PDF file, max 20MB'
return t('AwardsPage.pdfFileTip')
} else if (props.type === 'video') {
return 'Video file (MP4, MOV), 1080p, max 100MB'
return t('AwardsPage.videoFileTip')
}
return ''
})

22
src/views/AwardPage/container.vue
View File

@@ -95,11 +95,27 @@
</template>
<script setup lang="ts">
import { ref, computed, watch } from 'vue'
import { ref, computed, watch, onMounted } from 'vue'
import { useRoute, useRouter } from 'vue-router'
import { useI18n } from 'vue-i18n'
import { getCookie } from '@/tool/cookie'
const route = useRoute()
const router = useRouter()
const { locale } = useI18n()
onMounted(() => {
// 初始化语言设置
const loginLanguage = localStorage.getItem('loginLanguage')
if (loginLanguage) {
locale.value = loginLanguage
} else {
const userLanguage = getCookie('language')
if (userLanguage) {
locale.value = userLanguage
}
}
})
const showQRcode = ref(false)
const handleCloseQRcode = () => {
@@ -110,10 +126,10 @@
const btnType = ref<BtnType>('index')
const btnText = computed(() => {
if (btnType.value === 'index') {
return 'Submit your Application'
return locale.value === 'CHINESE_SIMPLIFIED' ? '提交申请' : 'Submit your Application'
}
if (btnType.value === 'form') {
return 'Back to Introduction'
return locale.value === 'CHINESE_SIMPLIFIED' ? '赛事介绍' : 'Back to Introduction'
}
})

28
src/views/AwardPage/index.vue
View File

@@ -11,18 +11,18 @@
webkit-playsinline
x5-playsinline
></video>
<div
class="submit-btn flex flex-center"
@click="handleSubmitApplication"
>
<div>Submit your Application</div>
<img
src="@/assets/images/award/arrow_right.png"
alt=""
class="arrow"
/>
<div class="ddl">Application Deadline:15th March 2026</div>
</div>
<div
class="submit-btn flex flex-center"
@click="handleSubmitApplication"
>
<div>{{ $t('AwardsPage.submitApplication') }}</div>
<img
src="@/assets/images/award/arrow_right.png"
alt=""
class="arrow"
/>
<div class="ddl">{{ $t('AwardsPage.applicationDeadline') }}</div>
</div>
</div>
<Slogan />
@@ -102,8 +102,8 @@
left: 0;
text-align: center;
width: 41rem;
font-family: 'Arial';
font-weight: 400;
font-family: 'ArialBold';
font-weight: 700;
font-size: 2rem;
line-height: 2.2rem;
color: #232323e5;