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

bugfix: 名称错误

Browse Source
This commit is contained in:
zhangyahui
2026-03-10 13:38:56 +08:00
parent 4daad8cb2f
commit 32001dffc3
3 changed files with 504 additions and 511 deletions
Download Patch File Download Diff File Expand all files Collapse all files

12
src/lang/en.ts
View File

@@ -17,9 +17,9 @@ export default {
step2Desc: 'Applicants must create their\ndesigns exclusively using the\nAiDA platform.​ ',
step2ListTitle: 'Your work should clearly demonstrate:',
step2List: [
'· How AiDA is used as a creative tool',
'· Your design concept and creative direction',
'· The intergration of AI and human creativity'
'How AiDA is used as a creative tool',
'Your design concept and creative direction',
'The intergration of AI and human creativity'
],
step3Title: 'Step 3. Prepare Your Submission',
processVideo: 'Process Video',
@@ -48,7 +48,7 @@ export default {
'The 20 finalists will be required to\nsubmit physical garments for final\nevaluation',
finalistPieces: 'Number of pieces: 1 full outfit',
finalistBasedOn: 'Garments must be produced\nbased on the submitted\nAiDA-generated designs',
finalistShipping: 'Shipping instructions will be provided by\nCode-create',
finalistShipping: 'Shipping instructions will be provided by\nCode-Create',
bloomYourCreativity: 'Bloom Your Creativity',
themeOf2026: 'Theme of 2026',
bloomText: {
@@ -58,7 +58,7 @@ export default {
regular2: 'is an ',
bold2: 'international design competition ',
regular3: 'hosted by ',
bold3: 'Code-create ',
bold3: 'Code-Create ',
regular4: ', a globally leading\n',
bold4: 'AI fashion solutions provider,',
regular5:
@@ -78,7 +78,7 @@ export default {
panelOfJudges: 'Panel of Judges',
expertise: 'Expertise',
judgesHat: {
jae: 'Code-create\nKorea Branch Director\nBesfxxk creative director',
jae: 'Code-Create\nKorea Branch Director\nBesfxxk creative director',
diego: 'Co-founder & Chief Father\nOfficer of OnTheList\n(Hong Kong)',
gregory: 'Senior Designer at\nGabriela Heasrst (Italy)',
vincenzo: 'Cheif Editor of SCMP Style\n(Hong Kong)',

4
src/lang/zh-cn.ts
View File

@@ -43,7 +43,7 @@ export default {
step4Desc: '入围的20名决赛选手需提交实体服装以供最终评审。',
finalistPieces: '件数：1件套装',
finalistBasedOn: '服装要求：必须根据提交的AiDA生成设计制作',
finalistShipping: '运输说明：\n将由Code-create提供',
finalistShipping: '运输说明：\n将由Code-Create提供',
bloomYourCreativity: '绽放你的创造力',
themeOf2026: '赛事主题',
bloomText: {
@@ -51,7 +51,7 @@ export default {
regular1: '',
bold1: 'AiDA全球设计奖2026',
regular2: '是由全球领先的AI时尚解决方案提供商',
bold2: ' Code-create ',
bold2: ' Code-Create ',
regular3: '主办的',
bold3: '国际设计竞赛，\n',
regular4:

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

@@ -1,53 +1,35 @@
<template>
<div
class="apply-container flex flex-col"
id="apply"
ref="applyRef"
>
<div
class="title animation-element"
ref="applyTitleRef"
>
<div class="apply-container flex flex-col" id="apply" ref="applyRef">
<div class="title animation-element" ref="applyTitleRef">
{{ $t('AwardsPage.howToApply') }}
</div>
<div
class="sub-title animation-element"
ref="applySubTitleRef"
>
<div class="sub-title animation-element" ref="applySubTitleRef">
{{ $t('AwardsPage.stepByStep') }}
</div>
<div
class="requirments-list flex flex-col"
ref="reqListRef"
>
<div class="requirments-list flex flex-col" ref="reqListRef">
<div class="top flex">
<div
class="item-box animation-element"
v-for="(item, index) in leftRequirment"
:key="item.type"
:ref="el => { if(el) itemRefs[index] = el }"
:ref="
(el) => {
if (el) itemRefs[index] = el
}
"
:style="{ background: item.background || '#fff' }"
>
<div class="item-header flex flex-center">
<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"
>
<div class="context" v-for="el in item.desc">
{{ $t(el) }}
</div>
<div
class="list"
v-if="item.listTitle"
>
<div class="list" v-if="item.listTitle">
<div class="list-title">{{ $t(item.listTitle) }}</div>
<ul class="list-items">
<li
class="list-item"
v-for="el in item.list"
>
<li class="list-item" v-for="el in item.list">
{{ $t(el) }}
</li>
</ul>
@@ -96,9 +78,7 @@
<div class="point"></div>
<div>{{ $t('AwardsPage.designPortfolio') }}</div>
</div>
<div
class="desc-wrapper flex-1 flex flex-col space-between"
>
<div class="desc-wrapper flex-1 flex flex-col space-between">
<ul class="desc-lists">
<div class="desc-lists-title">
<p>
@@ -156,13 +136,13 @@
</template>
<script setup lang="ts">
import { nextTick, onBeforeUnmount, onMounted, ref } from 'vue'
import { useI18n } from 'vue-i18n'
import { gsap } from 'gsap'
import { nextTick, onBeforeUnmount, onMounted, ref } from 'vue'
import { useI18n } from 'vue-i18n'
import { gsap } from 'gsap'
const { t } = useI18n()
const { t } = useI18n()
const leftRequirment = ref([
const leftRequirment = ref([
{
type: 'AwardsPage.step1Title',
desc: ['AwardsPage.step1Desc']
@@ -171,33 +151,27 @@
type: 'AwardsPage.step2Title',
desc: ['AwardsPage.step2Desc'],
listTitle: 'AwardsPage.step2ListTitle',
list: [
'AwardsPage.step2List[0]',
'AwardsPage.step2List[1]',
'AwardsPage.step2List[2]'
],
list: ['AwardsPage.step2List[0]', 'AwardsPage.step2List[1]', 'AwardsPage.step2List[2]'],
background: '#F9F9F9'
}
])
])
const applyRef = ref()
const applyTitleRef = ref()
const applySubTitleRef = ref()
const reqListRef = ref()
const itemRefs = ref<HTMLElement[]>([])
const step3Ref = ref()
const step4Ref = ref()
const applyRef = ref()
const applyTitleRef = ref()
const applySubTitleRef = ref()
const reqListRef = ref()
const itemRefs = ref<HTMLElement[]>([])
const step3Ref = ref()
const step4Ref = ref()
const hasPlayedAnim = ref(false)
let timeline: gsap.core.Timeline | null = null
const hasPlayedAnim = ref(false)
let timeline: gsap.core.Timeline | null = null
let observer: IntersectionObserver | null = null
let observer: IntersectionObserver | null = null
const setupApplyInitialState = () => {
const setupApplyInitialState = () => {
// 设置标题和副标题的初始状态
const titleEls = [applyTitleRef.value, applySubTitleRef.value].filter(
Boolean
) as HTMLElement[]
const titleEls = [applyTitleRef.value, applySubTitleRef.value].filter(Boolean) as HTMLElement[]
if (titleEls.length) {
gsap.set(titleEls, {
opacity: 0,
@@ -224,9 +198,9 @@
y: 50
})
}
}
}
const initAnimations = () => {
const initAnimations = () => {
if (hasPlayedAnim.value) return
timeline = gsap.timeline({
@@ -254,18 +228,22 @@
}
if (allStepElements.length > 0) {
timeline.to(allStepElements, {
timeline.to(
allStepElements,
{
opacity: 1,
y: 0,
duration: 0.6,
stagger: 0.2
}, '>')
},
'>'
)
}
hasPlayedAnim.value = true
}
}
onMounted(() => {
onMounted(() => {
nextTick(() => {
setupApplyInitialState()
observer = new IntersectionObserver(
@@ -288,9 +266,9 @@
observer.observe(applyRef.value)
}
})
})
})
onBeforeUnmount(() => {
onBeforeUnmount(() => {
// Cleanup animation timeline
if (timeline) {
timeline.kill()
@@ -299,22 +277,22 @@
if (observer) {
observer.disconnect()
}
})
})
</script>
<style scoped lang="less">
p {
p {
margin: 0;
padding: 0;
}
ul {
}
ul {
margin: 0;
padding: 0;
}
.animation-element{
}
.animation-element {
will-change: opacity transform;
}
.apply-container {
}
.apply-container {
flex: 1;
height: 143.3rem;
background: url('@/assets/images/award/apply_bg.png') no-repeat;
@@ -377,6 +355,28 @@
font-weight: 400;
font-size: 2.4rem;
line-height: 3rem;
.list-items {
list-style: none;
li {
list-style: none;
display: flex;
align-items: flex-start;
gap: 1rem;
padding: 0;
margin: 0.4rem 0;
&::before {
content: '';
/* 固定为 1rem 方块 */
width: 0.5rem;
height: 0.5rem;
background-color: #585858;
flex: 0 0 0.5rem;
border-radius: 0;
/* 让方块垂直居中于第一行文字：(line-height - square)/2 */
margin-top: calc((var(--desc-line-height, 3rem) - 1rem) / 2);
}
}
}
}
}
.context {
@@ -415,12 +415,7 @@
padding: 4rem;
border-radius: 0.8rem;
column-gap: 6.4rem;
background: linear-gradient(
180deg,
#ffe8e8 0%,
#feefef 25%,
#f9f9f9 100%
);
background: linear-gradient(180deg, #ffe8e8 0%, #feefef 25%, #f9f9f9 100%);
flex: 1;
.content-left {
flex: 1;
@@ -483,9 +478,7 @@
flex: 0 0 0.5rem;
border-radius: 0;
/* 让方块垂直居中于第一行文字：(line-height - square)/2 */
margin-top: calc(
(var(--desc-line-height, 3rem) - 1rem) / 2
);
margin-top: calc((var(--desc-line-height, 3rem) - 1rem) / 2);
}
}
}
@@ -525,5 +518,5 @@
}
}
}
}
}
</style>