公司概况1920
This commit is contained in:
scout
parent
3a0d06de01
commit
bce6823c18
1
locales/en.json
Normal file
1
locales/en.json
Normal file
@ -0,0 +1 @@
|
||||
|
||||
1
locales/zh.json
Normal file
1
locales/zh.json
Normal file
@ -0,0 +1 @@
|
||||
|
||||
BIN
src/assets/image/banner/cn/b0.png
Normal file
BIN
src/assets/image/banner/cn/b0.png
Normal file
Binary file not shown.
|
After Width: | Height: | Size: 396 KiB |
BIN
src/assets/image/btable.png
Normal file
BIN
src/assets/image/btable.png
Normal file
Binary file not shown.
|
After Width: | Height: | Size: 1.2 MiB |
BIN
src/assets/image/huang.png
Normal file
BIN
src/assets/image/huang.png
Normal file
Binary file not shown.
|
After Width: | Height: | Size: 1.6 MiB |
@ -23,7 +23,7 @@ function getBrowserLanguage() {
|
||||
}
|
||||
|
||||
// 获取存储的语言或浏览器语言
|
||||
const savedLanguage = localStorage.getItem('language') || getBrowserLanguage()
|
||||
const savedLanguage = 'en'
|
||||
|
||||
const i18n = createI18n({
|
||||
legacy: false, // 使用 Composition API
|
||||
|
||||
@ -49,8 +49,8 @@ export default {
|
||||
title: 'Multi-business Synergy, Driving Artistic Influence to Soar',
|
||||
desc: 'FiEE focuses on providing global promotion and professional operation services for art creators. Through precise positioning and multi-platform linkage, we break geographical restrictions to bring works to the international stage. Relying on a strong resource network to connect business opportunities, using AI and big data for precise marketing, efficiently reaching audiences, helping creators achieve breakthroughs in both artistic and commercial value.',
|
||||
cards1: {
|
||||
title: 'Global Floral Industry, Suitable for International Art Exchange Center',
|
||||
desc: 'FiEE upholds the concept of "Art Without Borders", relying on multi-platform linkage to break geographical restrictions, pushing works to the global market, attracting potential consumers, and letting art creators shine on the international stage.'
|
||||
title: 'Global Floral Industry, Suitable for International Art Exchange Center',
|
||||
desc: 'FiEE upholds the concept of "Art Without Borders", relying on multi-platform linkage to break geographical restrictions, pushing works to the global market, attracting potential consumers, and letting art creators shine on the international stage.'
|
||||
},
|
||||
cards2: {
|
||||
title: 'Professional Operation Team, Precise Audience Targeting',
|
||||
@ -77,5 +77,80 @@ export default {
|
||||
phone: 'Phone Number',
|
||||
submit: 'Submit Registration'
|
||||
}
|
||||
},
|
||||
companyprofil: {
|
||||
slogan: {
|
||||
title1: 'Leading the Full Cycle of Art',
|
||||
title2: 'Transforming Value to New Heights',
|
||||
desc: 'FiEE aspires to become the helmsman of the full art creation cycle, deeply participating in every key node from inspiration inception, work refinement completion, to market promotion and cultural dissemination.'
|
||||
},
|
||||
intro: {
|
||||
label: 'Company Introduction',
|
||||
title1: 'Uniquely Positioned',
|
||||
title2: 'Full-Cycle Value Empowerment Pioneer',
|
||||
desc: 'FiEE completely breaks through the limitations of traditional single-service institutions. As an industry transformer, we deeply integrate cutting-edge technology with diverse resources, carefully building a "full-cycle" value empowerment system that spans the entire process of artistic creation from conceptual germination to brilliant blooming. Whether you are a newcomer just entering the art world with dreams, or a mature art worker who has struggled on the artistic path and yearns to break through creative bottlenecks and climb higher artistic peaks, FiEE will be your most solid partner, accompanying you all the way, sheltering you from wind and rain, and pointing the way forward.'
|
||||
},
|
||||
team: {
|
||||
label: 'Team Introduction',
|
||||
title1: 'Gathering Elite Talents',
|
||||
title2: 'Igniting Art Innovation Engine',
|
||||
desc: 'The FiEE team consists of operation experts, technical elites, and international consultants, providing comprehensive support from content planning to global promotion. Through cross-border cooperation and resource integration, FiEE breaks through traditional boundaries and explores new artistic expressions. Relying on cutting-edge technology and precise marketing, we help works achieve both commercial value and social impact breakthroughs, injecting lasting momentum into artistic prosperity.',
|
||||
features: {
|
||||
global: {
|
||||
title: 'Global Reach, Diverse Navigation',
|
||||
desc: 'Overseas precision marketing, laying multiple channels, shaping international brands. Intelligent management of multilingual platforms, providing localized services.'
|
||||
},
|
||||
fans: {
|
||||
title: 'Deep Fan Cultivation, Building Ecosystem',
|
||||
desc: 'Fine community operations, providing diverse value-added services. Upgrading community management tools, precisely reaching users. Innovative incentive mechanisms, developing featured derivatives.'
|
||||
},
|
||||
talent: {
|
||||
title: 'Broad Talent Recruitment, Team Advancement',
|
||||
desc: 'Recruiting technical and marketing elites, injecting innovative vitality. Strengthening internal training, optimizing organizational structure. Introducing advanced concepts, improving management and service efficiency.'
|
||||
}
|
||||
}
|
||||
},
|
||||
achievement: {
|
||||
label: 'Outstanding Achievements',
|
||||
title: 'Pioneering to Art\'s Summit',
|
||||
desc: 'Long-term deep cultivation in the art field, FiEE continues to expand its business map, accumulating deep industry resources and building an extensive cooperation network. Currently, we have deeply partnered with multiple global popular self-media platforms, helping art creators shine on the international stage from multiple dimensions and bloom their unique artistic brilliance.',
|
||||
certification: {
|
||||
title1: 'Authoritative Qualification Certification',
|
||||
title2: 'Building Solid Foundation for Art Career',
|
||||
desc: 'FiEE provides professional and authoritative qualification certification services, helping art creators obtain widely recognized industry qualifications. This not only significantly enhances the value of art creators\' works but also helps art creators stand out in the fiercely competitive art market, greatly enhancing art workers\' market competitiveness, laying a solid foundation for art creators\' careers.'
|
||||
},
|
||||
platform: {
|
||||
title1: 'Global Platform Matrix',
|
||||
title2: 'Expanding Art Communication Boundaries',
|
||||
desc: 'With deep industry resources and extensive cooperation network, FiEE has reached deep strategic partnerships with over 30 global popular self-media platforms. From internationally renowned social platforms to professional media focused on art fields, we carefully create exclusive accounts for art creators and use advanced optimization strategies to make art creators\' accounts stand out among numerous creators.'
|
||||
}
|
||||
},
|
||||
news: {
|
||||
label: 'Focus on FIEE Frontier Dynamics',
|
||||
title: 'Insight Trends, Lighting the Beacon for Art\'s Future',
|
||||
desc: 'FiEE remains rooted in the art field, always following global art development trends. Through in-depth case analysis and cross-border discussions, we explore the deep integration of art with technology and business, providing forward-looking insights and inspiration for the future development of art.',
|
||||
carousel: {
|
||||
item1: {
|
||||
title: 'Achieving Technical Breakthrough, Leading Art Creation Technology Innovation',
|
||||
desc: 'As the digital wave sweeps through the art field with unprecedented momentum, art creation is undergoing profound changes. With the team\'s persistent efforts and innovative spirit, FiEE has achieved milestone breakthroughs in art creation technology. After countless days and nights of hard work, FiEE\'s self-developed new generation intelligent creation assistance system has officially launched, like a rising brilliant star, opening a new development path for art creation and bringing unprecedented changes and opportunities to the entire industry.'
|
||||
},
|
||||
item2: {
|
||||
title: 'Global Strategy Upgrade, FiEE Reaches Strategic Cooperation with 30+ International Platforms, Building New Art Communication Matrix',
|
||||
desc: 'Against the backdrop of accelerating global cultural integration with unprecedented momentum, the art field has become the frontier of cultural exchange and innovation. As a leader in the art industry, FiEE actively participates in this wave of global cultural exchange with keen strategic vision and decisive action. Recently, FiEE excitingly announced deep strategic cooperation with over 30 international leading self-media platforms including TikTok and Instagram, while officially launching the far-reaching "Art Without Borders Plan", determined to break down cultural barriers between regions.'
|
||||
},
|
||||
item3: {
|
||||
title: 'Empowering Art Creators, FiEE Releases "AI × Short Video" Full-Chain Solution',
|
||||
desc: 'For art creators, creative bottlenecks and low efficiency are two mountains standing in the way forward. Conceiving an attractive short video script often requires a lot of time and energy, creators not only have to rack their brains to think of unique ideas but also need to consider audience preferences and market trends. The dissemination and promotion after work completion is also a difficult gap to cross.'
|
||||
},
|
||||
item4: {
|
||||
title: 'FiEE Launches 18-Month Art KOL Incubation, Cultivating Tomorrow\'s Stars in Art Field',
|
||||
desc: 'In the current flourishing development of the art industry, the importance of quality content creators is increasingly prominent. As a pioneer in the industry, FiEE has always focused on talent cultivation and development dynamics in the art field. Today, FiEE officially announces the launch of an 18-month art KOL incubation plan that has been carefully prepared, aiming to cultivate a batch of future stars with strong influence in the art field and promote the innovative development of the entire industry.'
|
||||
},
|
||||
item5: {
|
||||
title: 'Diverse Talents Gathering, FiEE Builds Foundation for Art Innovation Development',
|
||||
desc: 'In the current golden age of flourishing art industry development, innovation has become the key element leading continuous industry progress and breaking through traditional patterns. Tracing back to the source, talent as the core driving force of innovation is of self-evident importance. FiEE deeply understands this truth and actively recruits talents with an open-minded attitude and far-sighted strategic vision, carefully gathering operation experts, technical elites, and international consultants.'
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
@ -49,11 +49,8 @@ export default {
|
||||
title: '多元业务协同，推动文艺影响力腾飞',
|
||||
desc: 'FiEE 专注为文艺创作者提供全球化推广与专业运营服务。通过精准定位、多平台联动，打破地域限制，让作品登上国际舞台。依托强大资源网络对接商业机遇，运用 AI与大数据精准营销，高效触达受众，助力创作者实现艺术与商业价值双突破。',
|
||||
cards1: {
|
||||
|
||||
title: '全球花卉产业，适合国际艺术交流中心',
|
||||
desc: 'FiEE秉持 "文艺无国界"理念，依托多平台联动，打破地域限制，将作品推向全球市场，吸引潜在消费者，让文艺创作者在国际舞台绽放光彩。'
|
||||
|
||||
// 其他卡片内容相同，可以复用global的内容
|
||||
title: '全球花卉产业，适合国际艺术交流中心',
|
||||
desc: 'FiEE秉持 "文艺无国界"理念，依托多平台联动，打破地域限制，将作品推向全球市场，吸引潜在消费者，让文艺创作者在国际舞台绽放光彩。'
|
||||
},
|
||||
cards2: {
|
||||
title: '专业运营团队，精准定位受众',
|
||||
@ -69,16 +66,79 @@ export default {
|
||||
}
|
||||
}
|
||||
},
|
||||
vote: {
|
||||
title: '儿童美术征集活动',
|
||||
voteBtn: '立即投票'
|
||||
},
|
||||
entry: {
|
||||
title: '报名',
|
||||
form: {
|
||||
name: '姓名',
|
||||
phone: '手机号',
|
||||
submit: '提交报名'
|
||||
companyprofil: {
|
||||
slogan: {
|
||||
title1: '领航文艺全周期',
|
||||
title2: '创变价值新巅峰',
|
||||
desc: 'FiEE立志成为文艺创作全周期的掌舵人，深度参与从灵感初绽、作品打磨完成，到市场推广宣传、文化广泛传播的每一处关键节点'
|
||||
},
|
||||
intro: {
|
||||
label: '公司介绍',
|
||||
title1: '独树一帜',
|
||||
title2: '全周期价值赋能领航者',
|
||||
desc: 'FiEE彻底打破传统单一服务机构的局限，以行业变革者的姿态，深度融合前沿技术与丰富多元的资源，精心构建起一套贯穿文艺创作从萌芽构思到辉煌绽放全流程的"全周期"价值赋能体系。无论你是刚刚踏入文艺殿堂、怀揣梦想的创作新人，还是在文艺道路上摸爬滚打、渴望突破创作瓶颈、攀登更高文艺巅峰的成熟文艺工作者，FiEE都将成为你最坚实的伙伴，一路贴心陪伴，为你的文艺征途遮风挡雨，指引前行的方向。'
|
||||
},
|
||||
team: {
|
||||
label: '团队介绍',
|
||||
title1: '汇聚精英',
|
||||
title2: '燃文艺创变引擎',
|
||||
desc: 'FiEE团队由运营专家、技术精英及国际顾问组成，提供从内容策划到全球推广的全方位支持。通过跨界合作与资源整合，FiEE突破传统边界，探索文艺新表达。依托前沿技术与精准营销，助力作品实现商业价值与社会影响力的双重提升，为文艺繁荣注入持久动力。',
|
||||
features: {
|
||||
global: {
|
||||
title: '纵横全球 多元领航',
|
||||
desc: '海外精准营销，铺设多元渠道，塑造国际品牌。智能管理多语言平台，提供本地化服务。'
|
||||
},
|
||||
fans: {
|
||||
title: '深耕粉丝 构筑生态',
|
||||
desc: '社区精细运营，提供多元增值服务。升级社群管理工具，精准触达用户。创新激励机制，开发特色衍生周边。'
|
||||
},
|
||||
talent: {
|
||||
title: '广纳贤才 团队进阶',
|
||||
desc: '广纳技术、营销精英，注入创新活力。强化内部培训，优化组织架构。引入先进理念，提升管理与服务效能。'
|
||||
}
|
||||
}
|
||||
},
|
||||
achievement: {
|
||||
label: '卓越建树',
|
||||
title: '以开拓之姿，登文艺之巅',
|
||||
desc: '长期深耕文艺领域，FiEE持续拓展业务版图，积累了深厚的行业资源，搭建起广泛的合作网络。目前已与多个全球热门自媒体平台深度携手，从多维度助力文艺创作者闪耀国际舞台，绽放独有的艺术光芒。',
|
||||
certification: {
|
||||
title1: '权威资质认证',
|
||||
title2: '铸就文艺事业坚实根基',
|
||||
desc: 'FiEE提供专业且权威的资质认证服务，助力文艺创作者获取行业广泛认可的资质。这不仅能让文艺创作者的作品价值得到显著提升，更能使文艺创作者在竞争白热化的艺术市场中崭露头角，大幅增强文艺工作者的市场竞争力，为文艺创作者的事业铺就稳固基石。'
|
||||
},
|
||||
platform: {
|
||||
title1: '全球平台矩阵',
|
||||
title2: '拓展文艺传播边界',
|
||||
desc: 'FiEE凭借深厚的行业资源和广泛的合作网络，与超过 30 个全球热门自媒体平台达成深度战略合作伙伴关系。从国际知名的社交平台，到专注文艺领域的专业媒体，我们为文艺创作者精心打造专属账号，并运用先进的优化策略，让文艺创作者的账号在众多创作者中脱颖而出。'
|
||||
}
|
||||
},
|
||||
news: {
|
||||
label: '聚焦FIEE前沿动态',
|
||||
title: '洞察趋势，点亮文艺前行灯塔',
|
||||
desc: 'FiEE始终扎根文艺领域，时刻紧跟全球艺术发展趋势。通过深度剖析案例、开展跨界研讨，探索文艺与科技、商业的深度融合，为文艺事业未来发展提供前瞻性洞察与灵感启迪。',
|
||||
carousel: {
|
||||
item1: {
|
||||
title: '实现技术突破，引领文艺创作技术革新',
|
||||
desc: '在数字化浪潮以前所未有的态势席卷文艺领域的当下，文艺创作正经历着深刻变革。FiEE凭借着团队持之以恒的努力与创新精神，在文艺创作技术领域取得了具有里程碑意义的重大突破。 历经无数个日夜的艰苦攻坚，FiEE自主研发的新一代智能创作辅助系统正式上线，宛如一颗冉冉升起的璀璨新星，为文艺创作开辟了全新的发展路径，给整个行业带来了前所未有的变革与机遇。'
|
||||
},
|
||||
item2: {
|
||||
title: '全球化战略升级，FiEE与30+国际平台达成战略合作，构建文艺传播新矩阵',
|
||||
desc: '在全球文化交融以前所未有的迅猛之势加速推进的时代大背景下，文艺领域已然成为文化交流与创新的前沿阵地。作为文艺行业的领航者，FiEE 以敏锐的战略眼光和果敢的行动力，积极投身于这场全球文化交流的浪潮之中。 近日，FiEE 振奋人心地宣布与 TikTok、Instagram等 30 余家国际头部自媒体平台达成深度战略合作，同时正式启动具有深远意义的"文艺无界计划"，矢志破除地域之间的文化藩篱。'
|
||||
},
|
||||
item3: {
|
||||
title: '助力文艺创作者，FiEE 发布"AI × 短视频"全链路解决方案',
|
||||
desc: '对于文艺创作者而言，创作瓶颈与效率低下是横亘在前行道路上的两座大山。构思一个吸引人的短视频脚本，常常需要耗费大量时间和精力，创作者们不仅要绞尽脑汁思考独特的创意，还要兼顾受众喜好和市场趋势。 作品完成后的传播与推广，同样是一道难以跨越的鸿沟。'
|
||||
},
|
||||
item4: {
|
||||
title: 'FiEE启动 18 个月艺术 KOL 孵化，培育文艺领域明日之星',
|
||||
desc: '在文艺产业蓬勃发展的当下，优质内容创作者的重要性愈发凸显。作为行业内的先锋企业，FiEE始终关注着文艺领域的人才培养与发展动态。 今日，FiEE正式宣布启动一项精心筹备长达 18 个月的艺术 KOL 孵化计划，旨在为文艺领域培育一批具有强大影响力的明日之星，推动整个行业的创新发展。'
|
||||
},
|
||||
item5: {
|
||||
title: '多元人才汇聚，FiEE 构筑文艺创新发展基石',
|
||||
desc: '在当下文艺行业蓬勃发展、百花齐放的黄金时代，创新俨然成为引领行业持续进步、突破传统格局的关键要素。而追根溯源，人才作为创新的核心驱动力，其重要性不言而喻。 FiEE 深明此理，以海纳百川的胸怀和高瞻远瞩的战略眼光，积极广纳贤才，精心汇聚运营专家、技术精英以及国际顾问。'
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
@ -1,59 +1,91 @@
|
||||
<script setup>
|
||||
import { onUnmounted, ref, watch } from 'vue';
|
||||
import gsap from 'gsap';
|
||||
import ScrollTrigger from 'gsap/ScrollTrigger';
|
||||
import { useHome } from '@/store/home/index.js';
|
||||
import { useI18n } from 'vue-i18n';
|
||||
import { useTransitionComposable } from '@/composables/transition-composable';
|
||||
import {
|
||||
onUnmounted,
|
||||
ref,
|
||||
watch,
|
||||
reactive
|
||||
} from "vue";
|
||||
import gsap from "gsap";
|
||||
import ScrollTrigger from "gsap/ScrollTrigger";
|
||||
import { useHome } from "@/store/home/index.js";
|
||||
import { useI18n } from "vue-i18n";
|
||||
import { useTransitionComposable } from "@/composables/transition-composable";
|
||||
import { useRouter } from "vue-router";
|
||||
import { NDivider } from 'naive-ui'
|
||||
import { NDivider } from "naive-ui";
|
||||
|
||||
// 注册 ScrollTrigger 插件
|
||||
gsap.registerPlugin(ScrollTrigger);
|
||||
const { currentTab } = useHome();
|
||||
const router = useRouter();
|
||||
const { transitionState } = useTransitionComposable();
|
||||
const { transitionState } =
|
||||
useTransitionComposable();
|
||||
const main = ref();
|
||||
let ctx;
|
||||
const { t } = useI18n();
|
||||
const handleTabClick = (tab) => {
|
||||
currentTab.value = tab;
|
||||
router.push('/' + tab);
|
||||
}
|
||||
router.push("/" + tab);
|
||||
};
|
||||
watch(
|
||||
[() => transitionState.transitionComplete, main],
|
||||
[
|
||||
() =>
|
||||
transitionState.transitionComplete,
|
||||
main,
|
||||
],
|
||||
(newValue) => {
|
||||
if (newValue && main.value) {
|
||||
ctx = gsap.context((self) => {
|
||||
// Text animations from left
|
||||
gsap.utils.toArray('.text-animate').forEach(text => {
|
||||
gsap.from(text, {
|
||||
x: -100,
|
||||
opacity: 0,
|
||||
duration: 1,
|
||||
scrollTrigger: {
|
||||
trigger: text,
|
||||
start: 'top 80%',
|
||||
end: 'top 50%',
|
||||
toggleActions: 'play none none reverse',
|
||||
}
|
||||
gsap.utils
|
||||
.toArray(".text-animate")
|
||||
.forEach((text) => {
|
||||
gsap.from(text, {
|
||||
x: -100,
|
||||
opacity: 0,
|
||||
duration: 1,
|
||||
scrollTrigger: {
|
||||
trigger: text,
|
||||
start: "top 80%",
|
||||
end: "top 50%",
|
||||
toggleActions:
|
||||
"play none none reverse",
|
||||
},
|
||||
});
|
||||
});
|
||||
});
|
||||
|
||||
// Image animations from right
|
||||
gsap.utils.toArray('.image-animate').forEach(image => {
|
||||
gsap.from(image, {
|
||||
x: 100,
|
||||
opacity: 0,
|
||||
duration: 1,
|
||||
scrollTrigger: {
|
||||
trigger: image,
|
||||
start: 'top 80%',
|
||||
end: 'top 50%',
|
||||
toggleActions: 'play none none reverse',
|
||||
}
|
||||
gsap.utils
|
||||
.toArray(".image-animate")
|
||||
.forEach((image) => {
|
||||
gsap.from(image, {
|
||||
x: 100,
|
||||
opacity: 0,
|
||||
duration: 1,
|
||||
scrollTrigger: {
|
||||
trigger: image,
|
||||
start: "top 80%",
|
||||
end: "top 50%",
|
||||
toggleActions:
|
||||
"play none none reverse",
|
||||
},
|
||||
});
|
||||
});
|
||||
|
||||
// 轮播卡片上升动画
|
||||
gsap.from('.carousel-item', {
|
||||
y: 100,
|
||||
opacity: 0,
|
||||
duration: 1.5,
|
||||
stagger: 0.4,
|
||||
scrollTrigger: {
|
||||
trigger: '.carousel-container',
|
||||
start: 'top 70%',
|
||||
end: 'top 30%',
|
||||
scrub: 2,
|
||||
toggleActions: 'restart pause reverse pause',
|
||||
}
|
||||
});
|
||||
|
||||
}, main.value);
|
||||
}
|
||||
},
|
||||
@ -61,136 +93,410 @@ watch(
|
||||
immediate: true,
|
||||
}
|
||||
);
|
||||
// 向前滑动
|
||||
const handlePrev = () => {
|
||||
if (!carouselTrack.value) return;
|
||||
|
||||
carouselTrack.value.style.transition = "transform 0.5s ease-in-out";
|
||||
currentIndex.value--;
|
||||
|
||||
// 如果滑到第一组的开头，立即跳转到第二组对应位置
|
||||
if (currentIndex.value < 0) {
|
||||
currentIndex.value = state.marqueeArr.length - 1;
|
||||
}
|
||||
};
|
||||
|
||||
// 向后滑动
|
||||
const handleNext = () => {
|
||||
if (!carouselTrack.value) return;
|
||||
|
||||
carouselTrack.value.style.transition = "transform 0.5s ease-in-out";
|
||||
currentIndex.value++;
|
||||
|
||||
// 如果滑到最后，立即跳转到第一个位置
|
||||
if (currentIndex.value >= state.marqueeArr.length) {
|
||||
currentIndex.value = 0;
|
||||
}
|
||||
};
|
||||
|
||||
// 添加滑动相关的状态
|
||||
const isDragging = ref(false);
|
||||
const startX = ref(0);
|
||||
const scrollLeft = ref(0);
|
||||
|
||||
// 处理鼠标/触摸按下事件
|
||||
const handleDragStart = (e) => {
|
||||
isDragging.value = true;
|
||||
startX.value = e.type === "mousedown" ? e.pageX : e.touches[0].pageX;
|
||||
scrollLeft.value = getSlideOffset();
|
||||
|
||||
// 禁用过渡效果，实现平滑拖动
|
||||
if (carouselTrack.value) {
|
||||
carouselTrack.value.style.transition = "none";
|
||||
}
|
||||
};
|
||||
|
||||
// 处理鼠标/触摸移动事件
|
||||
const handleDragMove = (e) => {
|
||||
if (!isDragging.value) return;
|
||||
e.preventDefault();
|
||||
|
||||
const x = e.type === "mousemove" ? e.pageX : e.touches[0].pageX;
|
||||
const walk = startX.value - x;
|
||||
|
||||
if (carouselTrack.value) {
|
||||
carouselTrack.value.style.transform = `translateX(-${scrollLeft.value + walk
|
||||
}px)`;
|
||||
}
|
||||
};
|
||||
|
||||
// 处理鼠标/触摸释放事件
|
||||
const handleDragEnd = (e) => {
|
||||
if (!isDragging.value) return;
|
||||
isDragging.value = false;
|
||||
|
||||
if (carouselTrack.value) {
|
||||
// 恢复过渡效果
|
||||
carouselTrack.value.style.transition = "transform 0.5s ease-in-out";
|
||||
|
||||
const x = e.type === "mouseup" ? e.pageX : e.changedTouches[0].pageX;
|
||||
const walk = startX.value - x;
|
||||
|
||||
// 获取单个项目的宽度
|
||||
const firstItem = carouselTrack.value.querySelector(".carousel-item");
|
||||
if (!firstItem) return;
|
||||
|
||||
const itemWidth = firstItem.offsetWidth;
|
||||
const itemMargin = parseInt(window.getComputedStyle(firstItem).marginRight);
|
||||
const totalWidth = itemWidth + itemMargin;
|
||||
|
||||
// 根据滑动距离决定是否切换到下一个/上一个
|
||||
if (Math.abs(walk) > totalWidth / 3) {
|
||||
if (walk > 0) {
|
||||
handleNext();
|
||||
} else {
|
||||
handlePrev();
|
||||
}
|
||||
} else {
|
||||
// 如果滑动距离不够，回到当前位置
|
||||
carouselTrack.value.style.transform = `translateX(-${getSlideOffset()}px)`;
|
||||
}
|
||||
}
|
||||
};
|
||||
|
||||
// 导入图片
|
||||
import carouselShow1 from "@/assets/image/companyprofil/carouselShow-1.png";
|
||||
import carouselShow2 from "@/assets/image/companyprofil/carouselShow-2.png";
|
||||
import carouselShow3 from "@/assets/image/companyprofil/carouselShow-3.png";
|
||||
import carouselShow4 from "@/assets/image/companyprofil/carouselShow-4.png";
|
||||
import carouselShow5 from "@/assets/image/companyprofil/carouselShow-5.png";
|
||||
|
||||
const state = reactive({
|
||||
marqueeArr: [
|
||||
{
|
||||
title: t('companyprofil.news.carousel.item1.title'),
|
||||
subTitle: t('companyprofil.news.carousel.item1.desc'),
|
||||
imgUrl: carouselShow1,
|
||||
},
|
||||
{
|
||||
title: t('companyprofil.news.carousel.item2.title'),
|
||||
subTitle: t('companyprofil.news.carousel.item2.desc'),
|
||||
imgUrl: carouselShow2,
|
||||
},
|
||||
{
|
||||
title: t('companyprofil.news.carousel.item3.title'),
|
||||
subTitle: t('companyprofil.news.carousel.item3.desc'),
|
||||
imgUrl: carouselShow3,
|
||||
},
|
||||
{
|
||||
title: t('companyprofil.news.carousel.item4.title'),
|
||||
subTitle: t('companyprofil.news.carousel.item4.desc'),
|
||||
imgUrl: carouselShow4,
|
||||
},
|
||||
{
|
||||
title: t('companyprofil.news.carousel.item5.title'),
|
||||
subTitle: t('companyprofil.news.carousel.item5.desc'),
|
||||
imgUrl: carouselShow5,
|
||||
},
|
||||
],
|
||||
});
|
||||
|
||||
const carouselTrack = ref(null);
|
||||
const currentIndex = ref(0);
|
||||
|
||||
const getVisibleItems = () => {
|
||||
const items = state.marqueeArr;
|
||||
// 前后各复制一组，实现无缝循环
|
||||
return [...items, ...items];
|
||||
};
|
||||
|
||||
// 计算实际滑动距离
|
||||
const getSlideOffset = () => {
|
||||
if (!carouselTrack.value) return 0;
|
||||
|
||||
const firstItem = carouselTrack.value.querySelector(".carousel-item");
|
||||
if (!firstItem) return 0;
|
||||
|
||||
const itemWidth = firstItem.offsetWidth;
|
||||
const itemMargin = parseInt(window.getComputedStyle(firstItem).marginRight);
|
||||
const totalWidth = itemWidth + itemMargin;
|
||||
|
||||
return currentIndex.value * totalWidth;
|
||||
};
|
||||
|
||||
// 定义 resize 处理函数
|
||||
const handleResize = () => {
|
||||
if (carouselTrack.value) {
|
||||
carouselTrack.value.style.transform = `translateX(-${getSlideOffset()}px)`;
|
||||
}
|
||||
};
|
||||
const handleCarouselClick = (item, event) => {
|
||||
// 检查事件类型是否为点击
|
||||
if (event.type === "click") {
|
||||
event.stopPropagation(); // 阻止事件传播
|
||||
event.preventDefault(); // 阻止默认行为
|
||||
console.log(item);
|
||||
router.push({
|
||||
path: "/companyprofildetail",
|
||||
query: {
|
||||
title: item.title,
|
||||
},
|
||||
});
|
||||
}
|
||||
};
|
||||
onUnmounted(() => {
|
||||
ctx?.revert(); // <- Easy Cleanup!
|
||||
});
|
||||
</script>
|
||||
|
||||
<template>
|
||||
<header className="header">
|
||||
<div class="logo">
|
||||
<img src="@/assets/image/logo.png" alt="logo" />
|
||||
<header className="header">
|
||||
<div class="logo">
|
||||
<img src="@/assets/image/logo.png" alt="logo" />
|
||||
</div>
|
||||
<div class="tabs">
|
||||
<div class="tab-item" :class="{
|
||||
active: currentTab === 'home',
|
||||
}" @click="handleTabClick('home')">
|
||||
{{ t("home.nav.home") }}
|
||||
</div>
|
||||
<div class="tabs">
|
||||
<div class="tab-item" :class="{ active: currentTab === 'home' }" @click="handleTabClick('home')">
|
||||
{{ t('home.nav.home') }}
|
||||
</div>
|
||||
<div class="tab-item" :class="{ active: currentTab === 'companyprofil' }" @click="handleTabClick('companyprofil')">
|
||||
{{ t('home.nav.company') }}
|
||||
</div>
|
||||
<div class="tab-item" :class="{ active: currentTab === 'business' }" @click="handleTabClick('business')">
|
||||
{{ t('home.nav.business') }}
|
||||
</div>
|
||||
<div class="tab-item" :class="{
|
||||
active:
|
||||
currentTab ===
|
||||
'companyprofil',
|
||||
}" @click="
|
||||
handleTabClick(
|
||||
'companyprofil'
|
||||
)
|
||||
">
|
||||
{{ t("home.nav.company") }}
|
||||
</div>
|
||||
</header>
|
||||
<main ref="main">
|
||||
|
||||
<div class="tab-item" :class="{
|
||||
active:
|
||||
currentTab === 'business',
|
||||
}" @click="
|
||||
handleTabClick('business')
|
||||
">
|
||||
{{ t("home.nav.business") }}
|
||||
</div>
|
||||
</div>
|
||||
</header>
|
||||
<main ref="main" class="height-full">
|
||||
<div class="head relative">
|
||||
|
||||
<img src="@/assets/image/gk.png" alt="head">
|
||||
<img src="@/assets/image/gk.png" alt="head" />
|
||||
|
||||
<div class="absolute top-240px left-510px text-[#10253E] text-[54px] font-bold text-animate">
|
||||
领航文艺全周期
|
||||
{{ t('companyprofil.slogan.title1') }}
|
||||
</div>
|
||||
<div class="absolute top-320px left-510px text-[#10253E] text-[54px] font-bold text-animate">
|
||||
创变价值新巅峰
|
||||
{{ t('companyprofil.slogan.title2') }}
|
||||
</div>
|
||||
<div class="absolute top-420px left-510px text-[#8B59F7] text-[20px] w-[535px] text-animate">
|
||||
FiEE立志成为文艺创作全周期的掌舵人，深度参与从灵感初绽、作品打磨完成，到市场推广宣传、文化广泛传播的每一处关键节点
|
||||
{{ t('companyprofil.slogan.desc') }}
|
||||
</div>
|
||||
|
||||
</div>
|
||||
<n-divider class="divider1" vertical />
|
||||
<div class="divider2" style=""></div>
|
||||
<div class="divider3" style=""></div>
|
||||
<div class="divider4" style=""></div>
|
||||
<n-divider class="divider5" vertical />
|
||||
<div class="bg-[#F8F9FF] ">
|
||||
|
||||
<div class="bg-[#F8F9FF]">
|
||||
<div class="content1 relative flex items-center justify-center z-3 pb-[100px] flex-col">
|
||||
<div class="text-[#8B59F7] text-[16px] absolute top-[-30px] left-[505px] text-animate">公司介绍</div>
|
||||
<div class="text-[#8B59F7] text-[16px] absolute top-[-30px] left-[505px] text-animate">
|
||||
{{ t('companyprofil.intro.label') }}
|
||||
</div>
|
||||
<div class="pl-[505px] pr-[480px] flex">
|
||||
|
||||
<div class="w-[411px] mr-[38px] text-animate">
|
||||
<div class="text-[#10253E] text-[40px]">独树一帜
|
||||
|
||||
<div class="text-[#10253E] text-[40px]">
|
||||
{{ t('companyprofil.intro.title1') }}
|
||||
</div>
|
||||
<div class="text-[#10253E] text-[40px]">
|
||||
{{ t('companyprofil.intro.title2') }}
|
||||
</div>
|
||||
<div class="text-[#10253E] text-[40px]">全周期价值赋能领航者</div>
|
||||
<div class="text-[#455363] text-[16px] mt-[56px]">
|
||||
FiEE彻底打破传统单一服务机构的局限，以行业变革者的姿态，深度融合前沿技术与丰富多元的资源，精心构建起一套贯穿文艺创作从萌芽构思到辉煌绽放全流程的 "全周期" 价值赋能体系。
|
||||
无论你是刚刚踏入文艺殿堂、怀揣梦想的创作新人，还是在文艺道路上摸爬滚打、渴望突破创作瓶颈、攀登更高文艺巅峰的成熟文艺工作者，FiEE都将成为你最坚实的伙伴，一路贴心陪伴，为你的文艺征途遮风挡雨，指引前行的方向。
|
||||
{{ t('companyprofil.intro.desc') }}
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div class="text-[#10253E] text-[20px] image-animate">
|
||||
<img class="w-[465px] h-[415px]" src="@/assets/image/ship.png" alt="company">
|
||||
<img class="w-[465px] h-[415px]" src="@/assets/image/ship.png" alt="company" />
|
||||
</div>
|
||||
|
||||
</div>
|
||||
</div>
|
||||
<div class="content2 relative flex items-center justify-center pt-[168px] bg-[#fff]">
|
||||
<div class="text-[#8B59F7] text-[16px] absolute top-[129px] left-[505px] text-animate">团队介绍</div>
|
||||
<div class="content2 relative flex items-center justify-center pt-[168px] bg-[#fff]">
|
||||
<div class="text-[#8B59F7] text-[16px] absolute top-[129px] left-[505px] text-animate">
|
||||
{{ t('companyprofil.team.label') }}
|
||||
</div>
|
||||
<div class="pl-[505px] pr-[490px] flex z-3">
|
||||
<div class="w-[412px] mr-[40px] text-animate">
|
||||
<div class="text-[#10253E] text-[40px]">汇聚精英</div>
|
||||
<div class="text-[#10253E] text-[40px]">燃文艺创变引擎</div>
|
||||
<div class="text-[#10253E] text-[40px]">
|
||||
{{ t('companyprofil.team.title1') }}
|
||||
</div>
|
||||
<div class="text-[#10253E] text-[40px]">
|
||||
{{ t('companyprofil.team.title2') }}
|
||||
</div>
|
||||
<div class="mt-[93px]">
|
||||
<img class="w-[58px] h-[58px]" src="@/assets/image/cl.png" alt="cl">
|
||||
<div class="text-[#10253E] text-[18px] mt-[20px] font-bold relative"> <n-divider
|
||||
class="absolute left-[-23px] top-[6px]" style="background-color: #8B59F7;" vertical />纵横全球 多元领航</div>
|
||||
<div class="text-[#455363] text-[16px]">海外精准营销，铺设多元渠道，塑造国际品牌。智能管理 多语言平台，提供本地化服务。</div>
|
||||
<img class="w-[58px] h-[58px]" src="@/assets/image/cl.png" alt="cl" />
|
||||
<div class="text-[#10253E] text-[18px] mt-[20px] font-bold relative">
|
||||
<n-divider class="absolute left-[-23px] top-[6px]" style="
|
||||
background-color: #8b59f7;
|
||||
" vertical />{{ t('companyprofil.team.features.global.title') }}
|
||||
</div>
|
||||
<div class="text-[#455363] text-[16px]">
|
||||
{{ t('companyprofil.team.features.global.desc') }}
|
||||
</div>
|
||||
</div>
|
||||
<div class="mt-[68px]">
|
||||
<img class="w-[58px] h-[50px]" src="@/assets/image/heart.png" alt="cl">
|
||||
<div class="text-[#10253E] text-[18px] mt-[20px] font-bold relative"> <n-divider
|
||||
class="absolute left-[-23px] top-[6px]" style="background-color: #8B59F7;" vertical />深耕粉丝 构筑生态
|
||||
|
||||
<img class="w-[58px] h-[50px]" src="@/assets/image/heart.png" alt="cl" />
|
||||
<div class="text-[#10253E] text-[18px] mt-[20px] font-bold relative">
|
||||
<n-divider class="absolute left-[-23px] top-[6px]" style="
|
||||
background-color: #8b59f7;
|
||||
" vertical />{{ t('companyprofil.team.features.fans.title') }}
|
||||
</div>
|
||||
<div class="text-[#455363] text-[16px]">
|
||||
{{ t('companyprofil.team.features.fans.desc') }}
|
||||
</div>
|
||||
<div class="text-[#455363] text-[16px]">社区精细运营，提供多元增值服务。升级社群管理工具，精准触达用户。创新激励机制，开发特色衍生周边。</div>
|
||||
</div>
|
||||
<div class="mt-[65px]">
|
||||
<img class="w-[54px] h-[52px]" src="@/assets/image/3p.png" alt="cl">
|
||||
<div class="text-[#10253E] text-[18px] mt-[20px] font-bold relative"> <n-divider
|
||||
class="absolute left-[-23px] top-[6px]" style="background-color: #8B59F7;" vertical />广纳贤才 团队进阶
|
||||
|
||||
<img class="w-[54px] h-[52px]" src="@/assets/image/3p.png" alt="cl" />
|
||||
<div class="text-[#10253E] text-[18px] mt-[20px] font-bold relative">
|
||||
<n-divider class="absolute left-[-23px] top-[6px]" style="
|
||||
background-color: #8b59f7;
|
||||
" vertical />{{ t('companyprofil.team.features.talent.title') }}
|
||||
</div>
|
||||
<div class="text-[#455363] text-[16px]">
|
||||
{{ t('companyprofil.team.features.talent.desc') }}
|
||||
</div>
|
||||
<div class="text-[#455363] text-[16px]">广纳技术、营销精英，注入创新活力。强化内部培训，优化组织架构。引入先进理念，提升管理与服务效能。</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div class="text-[#455363] text-[16px] flex-1 image-animate">
|
||||
<div>
|
||||
FiEE团队由运营专家、技术精英及国际顾问组成，提供从内容策划到全球推广的全方位支持。通过跨界合作与资源整合，FiEE突破传统边界，探索文艺新表达。依托前沿技术与精准营销，助力作品实现商业价值与社会影响力的双重提升，为文艺繁荣注入持久动力。
|
||||
{{ t('companyprofil.team.desc') }}
|
||||
</div>
|
||||
<img class="w-[465px] h-[625px] mt-[80px]" src="@/assets/image/randg.png" alt="cl">
|
||||
<img class="w-[465px] h-[625px] mt-[80px]" src="@/assets/image/randg.png" alt="cl" />
|
||||
</div>
|
||||
|
||||
</div>
|
||||
</div>
|
||||
<div class="content3 relative bg-[#fff] pt-[185px]">
|
||||
<div class="content3 relative bg-[#fff] pt-[185px] pb-[158px] overflow-hidden">
|
||||
<n-divider class="divider1" vertical />
|
||||
<div class="divider2" style=""></div>
|
||||
<div class="divider3" style=""></div>
|
||||
<div class="divider4" style=""></div>
|
||||
<n-divider class="divider5" vertical />
|
||||
<img class="absolute top-[95px] z-3 w-[800px] h-[163px] right-[0px]" src="@/assets/image/xlv.png" alt="cl">
|
||||
<img class="absolute" src="@/assets/image/xbg.png" alt="cl">
|
||||
<img class="absolute top-[95px] z-3 w-[800px] h-[163px] right-[0px] image-animate " src="@/assets/image/xlv.png"
|
||||
alt="cl" />
|
||||
<img class="absolute" src="@/assets/image/xbg.png" alt="cl" />
|
||||
<div class="relative pl-[505px] pr-[490px] flex z-3 mt-[300px] z-4 flex-col text-animate">
|
||||
<div class="text-[#8B59F7] text-[16px]">卓越建树</div>
|
||||
<div class="text-[#10253E] text-[40px]">以开拓之姿，登文艺之巅</div>
|
||||
<div class="text-[#8B59F7] text-[16px]">
|
||||
{{ t('companyprofil.achievement.label') }}
|
||||
</div>
|
||||
<div class="text-[#10253E] text-[40px]">
|
||||
{{ t('companyprofil.achievement.title') }}
|
||||
</div>
|
||||
<div class="text-[#455363] w-[748px] text-[16px] mt-[30px]">
|
||||
长期深耕文艺领域，FiEE持续拓展业务版图，积累了深厚的行业资源，搭建起广泛的合作网络。目前已与多个全球热门自媒体平台深度携手，从多维度助力文艺创作者闪耀国际舞台，绽放独有的艺术光芒。</div>
|
||||
{{ t('companyprofil.achievement.desc') }}
|
||||
</div>
|
||||
</div>
|
||||
<div class="relative pl-[505px] pr-[490px] flex z-4 mt-[100px]">
|
||||
<div class="w-[419px] mr-[30px] flex flex-col justify-center text-animate">
|
||||
<div class="text-[#10253E] text-[22px]">{{ t('companyprofil.achievement.certification.title1') }}</div>
|
||||
<div class="text-[#10253E] text-[22px]">{{ t('companyprofil.achievement.certification.title2') }}</div>
|
||||
<div class="text-[#455363] text-[16px] mt-[30px]">
|
||||
{{ t('companyprofil.achievement.certification.desc') }}
|
||||
</div>
|
||||
</div>
|
||||
<div class="flex image-animate">
|
||||
<img class="w-[465px] h-[493px]" src="@/assets/image/btable.png" alt="cl" />
|
||||
</div>
|
||||
</div>
|
||||
<div class="relative pl-[505px] pr-[490px] flex z-4 mt-[85px]">
|
||||
<div class="w-[419px] mr-[30px] flex flex-col justify-center text-animate">
|
||||
<div class="text-[#10253E] text-[22px]">{{ t('companyprofil.achievement.platform.title1') }}</div>
|
||||
<div class="text-[#10253E] text-[22px]">{{ t('companyprofil.achievement.platform.title2') }}</div>
|
||||
<div class="text-[#455363] text-[16px] mt-[30px]">
|
||||
{{ t('companyprofil.achievement.platform.desc') }}
|
||||
</div>
|
||||
</div>
|
||||
<div class="flex image-animate">
|
||||
<img class="w-[465px] h-[369px]" src="@/assets/image/huang.png" alt="cl" />
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<div class="content4 relative bg-[#fff] overflow-hidden">
|
||||
<n-divider class="divider1" vertical />
|
||||
<div class="divider2" style=""></div>
|
||||
<div class="divider3" style=""></div>
|
||||
<div class="divider4" style=""></div>
|
||||
<n-divider class="divider5" vertical />
|
||||
<div class="relative pl-[505px] pr-[490px] flex z-3 mt-[130px] z-4 flex-col text-animate">
|
||||
<div class="text-[#8B59F7] text-[16px]">
|
||||
{{ t('companyprofil.news.label') }}
|
||||
</div>
|
||||
<div class="text-[#10253E] text-[40px]">
|
||||
{{ t('companyprofil.news.title') }}
|
||||
</div>
|
||||
<div class="text-[#455363] w-[748px] text-[16px] mt-[30px]">
|
||||
{{ t('companyprofil.news.desc') }}
|
||||
</div>
|
||||
<div class="w-full mt-[56px] flex flex-wrap justify-end">
|
||||
<div class="flex flex-wrap mr-[20px]">
|
||||
<div class="arrow-btn" @click="handlePrev">
|
||||
<img class="w-[38px] h-[38px]" src="@/assets/image/companyprofil/icon-left.png" />
|
||||
</div>
|
||||
<div class="arrow-btn ml-[25px]" @click="handleNext">
|
||||
<img class="w-[38px] h-[38px]" src="@/assets/image/companyprofil/icon-right.png" />
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div class="pt-[73px] pb-[103px] carousel-container px-[495px] z-14">
|
||||
<div ref="carouselTrack" class="carousel-track " :style="{
|
||||
transform: `translateX(-${getSlideOffset()}px)`,
|
||||
}" @mousedown="handleDragStart" @mousemove="handleDragMove" @mouseup="handleDragEnd"
|
||||
@mouseleave="handleDragEnd" @touchstart="handleDragStart" @touchmove="handleDragMove"
|
||||
@touchend="handleDragEnd">
|
||||
<div v-for="(item, idx) in getVisibleItems()" :key="idx" class="carousel-item cursor-pointer"
|
||||
@click="handleCarouselClick(item, $event)">
|
||||
<img class="carousel-image" :src="item.imgUrl" />
|
||||
<div class="carousel-content">
|
||||
<div class="carousel-title">
|
||||
<div>{{ item.title }}</div>
|
||||
</div>
|
||||
<div class="carousel-subtitle">
|
||||
<div>{{ item.subTitle }}</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
</main>
|
||||
<footer>
|
||||
<div class="footer-content">
|
||||
<img class="copyright" src="@/assets/image/cp.png" alt="logo" />
|
||||
|
||||
|
||||
</div>
|
||||
</footer>
|
||||
</template>
|
||||
@ -206,7 +512,7 @@ onUnmounted(() => {
|
||||
top: 0;
|
||||
left: 0;
|
||||
right: 0;
|
||||
padding: 0 14rem;
|
||||
padding: 0 10rem;
|
||||
background-color: transparent;
|
||||
}
|
||||
|
||||
@ -231,16 +537,17 @@ onUnmounted(() => {
|
||||
padding: 4px 8px;
|
||||
|
||||
&.active {
|
||||
color: #8B59FA;
|
||||
color: #8b59fa;
|
||||
}
|
||||
|
||||
&:hover {
|
||||
color: #8B59FA;
|
||||
color: #8b59fa;
|
||||
}
|
||||
}
|
||||
|
||||
.head {
|
||||
width: 100%;
|
||||
background-color: #F8F9FF;
|
||||
background-color: #f8f9ff;
|
||||
|
||||
img {
|
||||
width: 100%;
|
||||
@ -262,7 +569,6 @@ onUnmounted(() => {
|
||||
left: 482px;
|
||||
width: 1px;
|
||||
height: 100vw;
|
||||
|
||||
}
|
||||
|
||||
.divider2 {
|
||||
@ -271,7 +577,9 @@ onUnmounted(() => {
|
||||
left: 720px;
|
||||
width: 1px;
|
||||
height: 100vw;
|
||||
background-image: linear-gradient(to bottom, #E6EAEE 50%, transparent 50%);
|
||||
background-image: linear-gradient(to bottom,
|
||||
#e6eaee 50%,
|
||||
transparent 50%);
|
||||
background-size: 1px 12px; // 第一个值是宽度，第二个值是虚线的总长度（实线+空白）
|
||||
background-repeat: repeat-y;
|
||||
}
|
||||
@ -282,7 +590,9 @@ onUnmounted(() => {
|
||||
left: 952px;
|
||||
width: 1px;
|
||||
height: 100vw;
|
||||
background-image: linear-gradient(to bottom, #E6EAEE 50%, transparent 50%);
|
||||
background-image: linear-gradient(to bottom,
|
||||
#e6eaee 50%,
|
||||
transparent 50%);
|
||||
background-size: 1px 12px; // 第一个值是宽度，第二个值是虚线的总长度（实线+空白）
|
||||
background-repeat: repeat-y;
|
||||
}
|
||||
@ -293,7 +603,9 @@ onUnmounted(() => {
|
||||
left: 1182px;
|
||||
width: 1px;
|
||||
height: 100vw;
|
||||
background-image: linear-gradient(to bottom, #E6EAEE 50%, transparent 50%);
|
||||
background-image: linear-gradient(to bottom,
|
||||
#e6eaee 50%,
|
||||
transparent 50%);
|
||||
background-size: 1px 15px; // 第一个值是宽度，第二个值是虚线的总长度（实线+空白）
|
||||
background-repeat: repeat-y;
|
||||
}
|
||||
@ -305,6 +617,7 @@ onUnmounted(() => {
|
||||
width: 1px;
|
||||
height: 100vw;
|
||||
}
|
||||
|
||||
.footer-content {
|
||||
height: 90px;
|
||||
display: flex;
|
||||
@ -316,4 +629,80 @@ onUnmounted(() => {
|
||||
height: 22pxpx;
|
||||
}
|
||||
}
|
||||
|
||||
.carousel-container {
|
||||
width: 100%;
|
||||
overflow: hidden;
|
||||
position: relative;
|
||||
}
|
||||
|
||||
.arrow-btn {
|
||||
cursor: pointer;
|
||||
}
|
||||
|
||||
.carousel-track {
|
||||
display: flex;
|
||||
transition: transform 0.5s ease-in-out;
|
||||
will-change: transform;
|
||||
}
|
||||
|
||||
.carousel-item {
|
||||
width: 445px;
|
||||
height: 444px;
|
||||
background-color: #fff;
|
||||
margin-right: 28px;
|
||||
flex: 0 0 auto;
|
||||
display: block;
|
||||
padding: 8px 8px 18px 8px;
|
||||
border-radius: 12px;
|
||||
box-shadow: 0 3px 14px 1px rgba(0, 0, 0, 0.16);
|
||||
will-change: transform, opacity; // 优化动画性能
|
||||
}
|
||||
|
||||
.carousel-image {
|
||||
width: 428px;
|
||||
height: 259px;
|
||||
object-fit: cover;
|
||||
display: block;
|
||||
}
|
||||
|
||||
.carousel-content {
|
||||
padding: 0 23px 0 23px;
|
||||
margin-top: 10px;
|
||||
}
|
||||
|
||||
.carousel-title {
|
||||
font-size: 20px;
|
||||
font-weight: 500;
|
||||
display: -webkit-box;
|
||||
-webkit-line-clamp: 1;
|
||||
-webkit-box-orient: vertical;
|
||||
overflow: hidden;
|
||||
text-overflow: ellipsis;
|
||||
line-height: 1.5;
|
||||
max-height: calc(1.5em * 5);
|
||||
}
|
||||
|
||||
.carousel-subtitle {
|
||||
color: #455363;
|
||||
margin-top: 5px;
|
||||
font-size: 16px;
|
||||
display: -webkit-box;
|
||||
-webkit-line-clamp: 5;
|
||||
-webkit-box-orient: vertical;
|
||||
overflow: hidden;
|
||||
text-overflow: ellipsis;
|
||||
line-height: 1.5;
|
||||
max-height: calc(1.5em * 5);
|
||||
}
|
||||
|
||||
// 添加一个通用的溢出控制类
|
||||
.overflow-hidden {
|
||||
overflow: hidden;
|
||||
}
|
||||
|
||||
// 为所有可能需要动画的容器添加溢出隐藏
|
||||
[ref*="moveRef"] {
|
||||
position: relative;
|
||||
}
|
||||
</style>
|
||||
|
||||
@ -1,9 +1,470 @@
|
||||
<script setup>
|
||||
import { useAuth } from "@/store/auth/index.js";
|
||||
const { clickSendCode, telNum, code, showTextCode, clickLogin } = useAuth();
|
||||
</script>
|
||||
<template>
|
||||
<div class="box-border relative w-screen min-h-screen" style=""></div>
|
||||
<div class="page-container">
|
||||
<header className="header">
|
||||
<div class="logo">
|
||||
<img src="@/assets/image/logo.png" alt="logo" />
|
||||
</div>
|
||||
<div class="tabs">
|
||||
<div class="tab-item" :class="{
|
||||
active: currentTab === 'home',
|
||||
}" @click="handleTabClick('home')">
|
||||
{{ t("home.nav.home") }}
|
||||
</div>
|
||||
<div class="tab-item" :class="{
|
||||
active:
|
||||
currentTab ===
|
||||
'companyprofil',
|
||||
}" @click="
|
||||
handleTabClick(
|
||||
'companyprofil'
|
||||
)
|
||||
">
|
||||
{{ t("home.nav.company") }}
|
||||
</div>
|
||||
<div class="tab-item" :class="{
|
||||
active:
|
||||
currentTab === 'business',
|
||||
}" @click="
|
||||
handleTabClick('business')
|
||||
">
|
||||
{{ t("home.nav.business") }}
|
||||
</div>
|
||||
</div>
|
||||
</header>
|
||||
<main>
|
||||
<section
|
||||
className="section-first"
|
||||
v-if="state.pageTitle === '实现技术突破，引领文艺创作技术革新'"
|
||||
style="background: #fff"
|
||||
>
|
||||
<div class="flex flex-wrap justify-center">
|
||||
<div
|
||||
class="w-full title mt-[298px] px-[180px] text-center div-indent"
|
||||
>
|
||||
实现技术突破，引领文艺创作技术革新
|
||||
</div>
|
||||
<div
|
||||
class="w-full text-center mt-[28px] text-[#455363] text-[40px] div-indent"
|
||||
>
|
||||
2025年02月07日 12时00分
|
||||
</div>
|
||||
<div class="mt-[63px] overflow-hidden div-indent">
|
||||
<img
|
||||
class="w-[1625px] h-[1003px]"
|
||||
src="@/assets/image/companyprofil/carouselShow-1.png"
|
||||
/>
|
||||
</div>
|
||||
<div
|
||||
class="w-full px-[188px] text-[#455363] text-[40px] div-indent mt-[118px] mb-[275px]"
|
||||
>
|
||||
<div>
|
||||
在数字化浪潮以前所未有的态势席卷文艺领域的当下，文艺创作正经历着深刻变革。FiEE凭借着团队持之以恒的努力与创新精神，在文艺创作技术领域取得了具有里程碑意义的重大突破。
|
||||
</div>
|
||||
<div>
|
||||
历经无数个日夜的艰苦攻坚，FiEE自主研发的新一代智能创作辅助系统正式上线，宛如一颗冉冉升起的璀璨新星，为文艺创作开辟了全新的发展路径，给整个行业带来了前所未有的变革与机遇。
|
||||
</div>
|
||||
<div>
|
||||
研发过程中，技术团队遭遇了诸多棘手难题。在海量文艺作品数据的收集环节，需从不同年代、不同风格、不同类型的文艺作品中获取数据，涵盖古今中外的文学名著、影视佳作、音乐经典等，这些数据来源广泛且格式多样，收集难度极大。
|
||||
整理与分析时，既要确保数据的准确性和完整性，又要对不同类型的数据进行分类整合，以便后续的深度挖掘。
|
||||
</div>
|
||||
<div>
|
||||
人工智能算法的优化也绝非易事，团队需要不断调整算法参数，使其能够精准地从海量数据中提取有价值的信息。大数据模型的搭建更是复杂，要考虑到模型的稳定性、可扩展性以及与其他技术的兼容性。
|
||||
</div>
|
||||
<div>
|
||||
团队成员们查阅了海量的国内外资料，从前沿学术论文到行业实践案例，不放过任何一个可能的灵感来源。进行了无数次的实验和模拟，每一次实验都可能面临失败，但他们从未放弃，不断优化方案。
|
||||
</div>
|
||||
<div>
|
||||
比如在处理不同类型文艺作品数据的兼容性时，团队创新性地采用了多维度数据分类算法。这种算法通过对数据的时间维度、风格维度、题材维度等多个角度进行分析，将看似杂乱无章的数据进行有效分类，确保了数据的精准分析和利用，为后续的智能创作支持奠定了坚实基础。
|
||||
该智能创作辅助系统整合了人工智能、大数据等前沿技术，为创作者提供了全方位、智能化的创作支持。通过对海量文艺作品数据的深度挖掘与分析，系统能够精准洞察当下文艺创作的趋势与热点。
|
||||
</div>
|
||||
<div>
|
||||
在提高创作效率方面，系统的人工智能技术展现出强大实力。传统创作方式可能需要花费数月时间构思框架，而使用该系统，仅需几天时间就能生成初步框架，创作者只需在此基础上进行细节完善，大大缩短了创作周期。
|
||||
</div>
|
||||
<div>
|
||||
公司技术研发团队负责人在发布会上难掩激动之情："这次技术突破是我们团队长期以来辛勤付出的结晶，也是FiEE对文艺创作技术革新的一次大胆尝试。我们深知，在科技飞速发展的今天，只有不断创新，才能为文艺创作者提供更强大的创作工具，推动文艺创作朝着高质量、高效率的方向发展。"
|
||||
</div>
|
||||
<div>
|
||||
业内专家评价道："FiEE的这一技术突破，无疑为文艺创作领域注入了新的活力。它不仅提升了创作效率，更为创作者带来了全新的创作思路，为整个行业的数字化转型提供了宝贵的经验和借鉴。"
|
||||
</div>
|
||||
<div>
|
||||
此次技术突破，使FiEE在文艺科技领域的竞争力大幅提升，成为行业内的技术引领者。未来，FiEE将继续加大技术研发投入，广纳人才，不断探索创新，致力于为文艺产业的数字化转型提供更多、更优质的技术支持，推动文艺创作迈向新的高峰。
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</section>
|
||||
|
||||
<section
|
||||
className="section-sec"
|
||||
v-if="state.pageTitle.includes('全球化战略升级')"
|
||||
style="background: #fff"
|
||||
>
|
||||
<div class="flex flex-wrap justify-center">
|
||||
<div
|
||||
class="w-full title mt-[298px] px-[180px] text-center div-indent"
|
||||
>
|
||||
全球化战略升级，FiEE与30+国际平台达成战略合作，构建文艺传播新矩阵
|
||||
</div>
|
||||
<div
|
||||
class="w-full text-center mt-[28px] text-[#455363] text-[40px] div-indent"
|
||||
>
|
||||
2025年02月10日 10时30分
|
||||
</div>
|
||||
<div class="mt-[63px] overflow-hidden div-indent">
|
||||
<img
|
||||
class="w-[1625px] h-[1003px]"
|
||||
src="@/assets/image/companyprofil/carouselShow-2.png"
|
||||
/>
|
||||
</div>
|
||||
<div
|
||||
class="w-full px-[188px] text-[#455363] text-[40px] div-indent mt-[118px] mb-[275px]"
|
||||
>
|
||||
<div>
|
||||
在全球文化交融以前所未有的迅猛之势加速推进的时代大背景下，文艺领域已然成为文化交流与创新的前沿阵地。作为文艺行业的领航者，FiEE
|
||||
以敏锐的战略眼光和果敢的行动力，积极投身于这场全球文化交流的浪潮之中。
|
||||
</div>
|
||||
<div>
|
||||
近日，FiEE 振奋人心地宣布与 TikTok、Instagram等 30
|
||||
余家国际头部自媒体平台达成深度战略合作，同时正式启动具有深远意义的
|
||||
“文艺无界计划”，矢志破除地域之间的文化藩篱，全力以赴助力文艺创作者登上广阔无垠的世界舞台。此次
|
||||
FiEE 与全球 30
|
||||
余家顶尖平台的深度携手，堪称一场全方位、深层次的资源整合与协同创新的盛会。
|
||||
</div>
|
||||
<div>
|
||||
在社交媒体领域，与 TikTok 的合作堪称一大亮点。TikTok
|
||||
以其独特的短视频生态和强大的算法推荐系统，在全球范围内吸引了数十亿用户。借助这一平台，FiEE
|
||||
能够将文艺创作者的精彩作品以极具感染力的短视频形式，迅速精准地推送给全球各地对文艺感兴趣的用户，轻松打破地域限制，引发全球范围内的热烈互动与关注。
|
||||
</div>
|
||||
<div>
|
||||
Instagram
|
||||
则凭借其精美的视觉呈现和活跃的社交氛围，为各类文艺作品搭建了一个绝佳的展示橱窗。在这里，创作者们的作品能够得到高水准的展示，收获海量粉丝的关注与点赞，极大地提升作品的曝光量与影响力，让艺术之美在全球范围内广泛传播。在垂直社区方面，与
|
||||
ArtStation
|
||||
等专业平台的合作，为不同文艺领域的创作者们营造了一个专业、纯粹的交流与展示空间。
|
||||
</div>
|
||||
<div>
|
||||
为确保 “文艺无界计划” 能够高效、有序地实施，FiEE
|
||||
制定了一系列详尽且切实可行的策略与措施。在内容创作环节，FiEE
|
||||
将邀请国际知名的文艺专家、创作者开展线上线下相结合的专业培训与指导课程，帮助创作者深入了解国际市场的审美偏好、文化需求以及流行趋势，从而提升作品的国际传播力。
|
||||
</div>
|
||||
<div>
|
||||
在推广运营方面，FiEE
|
||||
将整合各方优势资源，为创作者量身定制全方位、立体化的推广方案。一方面，积极举办线上创作比赛等活动，吸引全球用户的目光，迅速提升创作者的知名度与影响力；另一方面，充分利用社交媒体平台的广告投放、话题营销、达人合作等手段，精准推送创作者的作品，进一步扩大作品的传播范围，让更多人能够欣赏到优秀的文艺创作。
|
||||
</div>
|
||||
<div>
|
||||
可以预见，对于广大文艺创作者而言，此次合作无疑是一次千载难逢的发展机遇。他们将有机会与国际顶尖的艺术家、创作者进行深度交流与合作，接触到全球最前沿的创作理念与技术，从而拓宽自己的创作视野，提升创作水平。同时，通过多元化的平台矩阵，他们的作品能够获得前所未有的曝光量与认可度，实现商业价值的最大化，为自己的艺术生涯开辟更为广阔的发展空间。
|
||||
</div>
|
||||
<div>
|
||||
展望未来，FiEE
|
||||
将坚定不移地继续深化与国际平台的合作，不断优化和完善
|
||||
“文艺无界计划”，持续为文艺创作者提供更加优质、全面、高效的服务，助力他们在国际舞台上绽放出更加耀眼夺目的光芒，为推动全球文化的交流、融合与繁荣贡献更多的智慧与力量。
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</section>
|
||||
|
||||
<section
|
||||
className="section-third"
|
||||
v-if="state.pageTitle.includes('助力文艺创作者')"
|
||||
style="background: #fff"
|
||||
>
|
||||
<div class="flex flex-wrap justify-center">
|
||||
<div
|
||||
class="w-full title mt-[298px] px-[180px] text-center div-indent"
|
||||
>
|
||||
助力文艺创作者，FiEE 发布 “AI × 短视频” 全链路解决方案
|
||||
</div>
|
||||
<div
|
||||
class="w-full text-center mt-[28px] text-[#455363] text-[40px] div-indent"
|
||||
>
|
||||
2025年02月14日 12时30分
|
||||
</div>
|
||||
<div class="mt-[63px] overflow-hidden div-indent">
|
||||
<img
|
||||
class="w-[1625px] h-[1003px]"
|
||||
src="@/assets/image/companyprofil/carouselShow-3.png"
|
||||
/>
|
||||
</div>
|
||||
<div
|
||||
class="w-full px-[188px] text-[#455363] text-[40px] div-indent mt-[118px] mb-[275px]"
|
||||
>
|
||||
<div>
|
||||
对于文艺创作者而言，创作瓶颈与效率低下是横亘在前行道路上的两座大山。构思一个吸引人的短视频脚本，常常需要耗费大量时间和精力，创作者们不仅要绞尽脑汁思考独特的创意，还要兼顾受众喜好和市场趋势。
|
||||
</div>
|
||||
<div>
|
||||
作品完成后的传播与推广，同样是一道难以跨越的鸿沟。在信息爆炸的时代，如何让自己的作品在海量内容中脱颖而出，精准触达目标受众，成为创作者们日思夜想的难题。
|
||||
</div>
|
||||
<div>
|
||||
传统的传播方式犹如撒网捕鱼，精准度严重不足，大量优质的文艺内容在传播过程中石沉大海，难以被真正感兴趣的受众发现。而且，用户互动性的欠缺也使得创作者无法深入挖掘用户需求，难以与受众建立起紧密的情感连接，作品难以真正
|
||||
“活” 起来，在传播的浪潮中显得孤立无援。
|
||||
</div>
|
||||
<div>
|
||||
在科技飞速发展的当下，人工智能与短视频行业正以前所未有的速度改变着文艺创作与传播的格局。
|
||||
</div>
|
||||
<div>
|
||||
作为文艺领域的创新先锋，FiEE
|
||||
紧跟时代步伐，积极探索技术与文艺的深度融合，今日正式发布 “AI ×
|
||||
短视频” 全链路解决方案，为文艺行业带来了一场革命性的变革。
|
||||
</div>
|
||||
<div>
|
||||
该解决方案集成了多项前沿 AI
|
||||
技术，具有多方面的显著优势。在内容创作环节，AI
|
||||
智能脚本生成工具能够根据创作者输入的主题、风格、受众等关键信息，快速生成创意十足的脚本。通过对海量优秀短视频脚本和文艺作品的学习，AI
|
||||
不仅能提供新颖的故事框架，还能精准匹配符合主题的情节与台词，大大缩短了创作周期。
|
||||
</div>
|
||||
<div>
|
||||
在内容传播与运营方面，AI
|
||||
大数据分析技术让短视频的推广更加精准有效。通过对用户的浏览历史、点赞评论行为、关注列表等多维度数据进行深度分析，系统能够精准洞察用户的兴趣偏好和需求，将文艺创作者的作品推送给真正感兴趣的受众群体。该解决方案的应用场景广泛，无论是专业的文艺创作者，还是怀揣文艺梦想的业余爱好者，都能从中受益。
|
||||
</div>
|
||||
<div>
|
||||
专业创作者可以借助 AI
|
||||
技术突破创作瓶颈，提升创作效率，创作出更具创新性和影响力的作品；业余爱好者则可以通过该方案降低创作门槛，轻松实现自己的创作想法，享受创作的乐趣。FiEE
|
||||
相关负责人表示：“我们一直关注着文艺创作者的需求和痛点，希望通过‘AI
|
||||
×
|
||||
短视频’全链路解决方案，为他们提供全方位的支持和帮助。这不仅是一次技术的创新应用，更是我们助力文艺行业发展的一次重要实践。我们相信，在
|
||||
AI
|
||||
技术的加持下，文艺创作者们能够创作出更多优秀的作品，让文艺之光照亮更广阔的天地。”
|
||||
</div>
|
||||
<div>
|
||||
展望未来，FiEE 将持续投入研发力量，不断优化和完善 “AI × 短视频”
|
||||
全链路解决方案，探索更多 AI
|
||||
技术在文艺领域的应用场景，加强与行业伙伴的合作，共同推动文艺创作与传播的创新发展，为文艺创作者打造更加优质、高效的创作环境，助力文艺行业迈向新的高峰。
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</section>
|
||||
|
||||
<section
|
||||
className="section-four"
|
||||
v-if="state.pageTitle.includes('培育文艺领域明日之星')"
|
||||
style="background: #fff"
|
||||
>
|
||||
<div class="flex flex-wrap justify-center">
|
||||
<div
|
||||
class="w-full title mt-[298px] px-[180px] text-center div-indent"
|
||||
>
|
||||
FiEE启动 18 个月艺术 KOL 孵化，培育文艺领域明日之星
|
||||
</div>
|
||||
<div
|
||||
class="w-full text-center mt-[28px] text-[#455363] text-[40px] div-indent"
|
||||
>
|
||||
2025年02月19日 12时00分
|
||||
</div>
|
||||
<div class="mt-[63px] overflow-hidden div-indent">
|
||||
<img
|
||||
class="w-[1625px] h-[1003px]"
|
||||
src="@/assets/image/companyprofil/carouselShow-4.png"
|
||||
/>
|
||||
</div>
|
||||
<div
|
||||
class="w-full px-[188px] text-[#455363] text-[40px] div-indent mt-[118px] mb-[275px]"
|
||||
>
|
||||
<div>
|
||||
在文艺产业蓬勃发展的当下，优质内容创作者的重要性愈发凸显。作为行业内的先锋企业，FiEE始终关注着文艺领域的人才培养与发展动态。
|
||||
</div>
|
||||
<div>
|
||||
今日，FiEE正式宣布启动一项精心筹备长达 18 个月的艺术 KOL
|
||||
孵化计划，旨在为文艺领域培育一批具有强大影响力的明日之星，推动整个行业的创新发展。随着社交媒体的兴起和内容传播方式的变革，KOL
|
||||
在文艺领域的传播与推广中扮演着关键角色。他们不仅是优质内容的创作者，更是连接文艺作品与广大受众的桥梁。
|
||||
</div>
|
||||
<div>
|
||||
然而，培养一位成熟且具有广泛影响力的艺术 KOL
|
||||
并非一蹴而就，需要系统的规划、专业的指导以及充足的实践机会。FiEE敏锐地洞察到这一市场需求，投入大量资源，精心策划了此次为期
|
||||
18
|
||||
个月的孵化计划。此次孵化计划目标明确，旨在挖掘并培养一批在文艺领域具有潜力的创作者，帮助他们成长为在国内外具有较高知名度和影响力的艺术
|
||||
KOL。
|
||||
</div>
|
||||
<div>
|
||||
通过这一计划，不仅能够为这些创作者提供广阔的发展空间，还能为文艺市场注入新鲜血液，推动文艺作品的多元化传播。在实施内容上，计划涵盖多个维度，全方位助力创作者成长。在专业培训环节，公司邀请了来自不同艺术领域的知名专家和学者，为创作者们提供系统且深入的课程培训。
|
||||
</div>
|
||||
<div>
|
||||
这些课程内容丰富，既包括艺术创作技巧的提升，如绘画中的色彩运用、音乐创作中的旋律编排等，也涵盖新媒体运营知识，如社交媒体营销策略、粉丝互动技巧等，以及商业管理方面的课程，帮助创作者了解文艺市场的运作规律，实现作品的商业价值转化。同时，为确保每位创作者都能得到个性化的指导，公司还为他们配备了一对一的导师，导师将根据创作者的特点和需求，提供针对性的建议和帮助。
|
||||
</div>
|
||||
<div>
|
||||
资源对接也是孵化计划的重要组成部分。FiEE凭借多年在行业内积累的深厚资源和广泛的合作伙伴关系，为创作者搭建了与品牌、媒体、平台等对接的桥梁。创作者们有机会与知名品牌合作，为其创作具有艺术价值的宣传内容；与媒体合作，参与文艺专题报道和节目制作；与各大文艺平台合作，发布自己的作品，扩大作品的传播范围。
|
||||
</div>
|
||||
<div>
|
||||
FiEE艺术 KOL
|
||||
孵化项目负责人在启动仪式上表示：“我们坚信，每一位参与孵化计划的创作者都具有无限的潜力。这
|
||||
18
|
||||
个月的时间，将是他们成长的关键时期。FiEE将全力为他们提供支持和帮助，让他们在艺术创作的道路上越走越远，成为文艺领域的中流砥柱。”
|
||||
</div>
|
||||
<div>
|
||||
展望未来，此次 18 个月艺术 KOL
|
||||
孵化计划的实施，有望为文艺领域培养出一批具有独特风格和广泛影响力的
|
||||
KOL。
|
||||
</div>
|
||||
<div>
|
||||
他们将通过自己的作品和影响力，吸引更多人关注文艺，推动文艺作品的传播与创新，为文艺产业的繁荣发展贡献重要力量。FiEE也将持续关注创作者的成长，不断优化孵化计划，为文艺领域的人才培养探索更多有效的模式。
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</section>
|
||||
|
||||
<section
|
||||
className="section-five"
|
||||
v-if="state.pageTitle.includes('多元人才汇聚')"
|
||||
style="background: #fff"
|
||||
>
|
||||
<div class="flex flex-wrap justify-center">
|
||||
<div
|
||||
class="w-full title mt-[298px] px-[180px] text-center div-indent"
|
||||
>
|
||||
多元人才汇聚，FiEE 构筑文艺创新发展基石
|
||||
</div>
|
||||
<div
|
||||
class="w-full text-center mt-[28px] text-[#455363] text-[40px] div-indent"
|
||||
>
|
||||
2025年02月20日 12时00分
|
||||
</div>
|
||||
<div class="mt-[63px] overflow-hidden div-indent">
|
||||
<img
|
||||
class="w-[1625px] h-[1003px]"
|
||||
src="@/assets/image/companyprofil/carouselShow-5.png"
|
||||
/>
|
||||
</div>
|
||||
<div
|
||||
class="w-full px-[188px] text-[#455363] text-[40px] div-indent mt-[118px] mb-[275px]"
|
||||
>
|
||||
<div>
|
||||
在当下文艺行业蓬勃发展、百花齐放的黄金时代，创新俨然成为引领行业持续进步、突破传统格局的关键要素。而追根溯源，人才作为创新的核心驱动力，其重要性不言而喻。
|
||||
</div>
|
||||
<div>
|
||||
FiEE
|
||||
深明此理，以海纳百川的胸怀和高瞻远瞩的战略眼光，积极广纳贤才，精心汇聚运营专家、技术精英以及国际顾问，成功打造出一支专业素养过硬、知识结构多元的卓越团队，为公司在文艺领域的创新征程筑牢了坚不可摧的发展根基。
|
||||
</div>
|
||||
<div>
|
||||
运营专家团队堪称 FiEE
|
||||
在文艺领域稳健前行的领航灯塔。他们在文艺行业这片广阔天地中深耕多年，凭借丰富的实战经验和对市场的深度理解，练就了敏锐捕捉市场动态的能力，对受众喜好的把握更是精准入微。
|
||||
</div>
|
||||
<div>
|
||||
他们借助大数据分析和实地市场调研，深入研究不同年龄段、不同地域受众的文化背景和兴趣偏好，精准定位目标受众，为文艺创作者提供极具针对性的创作方向。他们会深入剖析当下的社会热点和观众的精神需求，巧妙融入时代元素，让作品既有深度又具吸引力。通过独特的创意策划，从项目起步阶段就成功吸引观众的目光，为后续的成功奠定坚实基础。
|
||||
</div>
|
||||
<div>
|
||||
随着科技与文艺的融合趋势愈发显著，技术精英成为 FiEE
|
||||
创新发展的强劲引擎。
|
||||
</div>
|
||||
<div>
|
||||
公司积极招徕掌握人工智能、大数据、虚拟现实等前沿技术的专业人才，为文艺创作注入科技活力。在内容创作过程中，这些技术精英充分发挥人工智能辅助创作工具的优势，为文艺创作者提供源源不断的灵感启发。利用虚拟现实（VR）和增强现实（AR）技术，让作品与观众进行深度互动，极大地拓展了文艺作品的表现形式和传播范围。
|
||||
</div>
|
||||
<div>
|
||||
在全球化的时代浪潮下，国际顾问团队为 FiEE
|
||||
带来了广阔的全球视野和多元的文化视角。他们来自世界各地，对不同国家和地区的文艺市场规则、审美偏好以及文化差异有着深入的了解。在FiEE将本土优秀文艺作品推向世界的过程中，国际顾问团队发挥着关键作用。这不仅为本土文艺创作者带来了新的创作思路和启发，也提升了FiEE在国际文艺领域的影响力。
|
||||
</div>
|
||||
<div>
|
||||
正是因为有了运营专家、技术精英和国际顾问等多元人才的汇聚，FiEE得以通过跨界合作与资源整合，突破传统文艺的边界，探索文艺新表达。FiEE与科技企业、时尚品牌、教育机构等展开广泛合作，将文艺与科技、时尚、教育等领域深度融合，创造出一系列新颖的文艺产品和服务。依托前沿技术与精准营销，FiEE
|
||||
助力众多文艺作品实现了商业价值与社会影响力的双重提升，为文艺的繁荣发展注入了持久动力。
|
||||
</div>
|
||||
<div>
|
||||
展望未来，FiEE
|
||||
将继续秉持开放、包容的人才理念，不断完善人才战略，吸引更多优秀人才加入。我们坚信，在多元人才的共同努力下，FiEE
|
||||
将在文艺创新发展的道路上不断前行，为推动全球文艺事业的繁荣做出更大的贡献。
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</section>
|
||||
|
||||
<section
|
||||
style="background: #fff"
|
||||
className="flex flex-wrap justify-center"
|
||||
>
|
||||
<img
|
||||
class="w-[580px] h-[55px] my-[85px]"
|
||||
src="@/assets/image/image-footer.png"
|
||||
alt="logo"
|
||||
/>
|
||||
</section>
|
||||
</main>
|
||||
</div>
|
||||
</template>
|
||||
|
||||
<style scoped lang="scss"></style>
|
||||
<script setup>
|
||||
import {
|
||||
onUnmounted,
|
||||
ref,
|
||||
onMounted,
|
||||
reactive,
|
||||
nextTick,
|
||||
onBeforeMount,
|
||||
} from "vue";
|
||||
import { useHome } from "@/store/home/index.js";
|
||||
import { useRoute } from "vue-router";
|
||||
import { useI18n } from "vue-i18n";
|
||||
|
||||
const { t } = useI18n();
|
||||
const state = reactive({
|
||||
pageTitle: "",
|
||||
});
|
||||
|
||||
const { currentTab } = useHome();
|
||||
const route = useRoute();
|
||||
onBeforeMount(() => {
|
||||
state.pageTitle = route.query.title;
|
||||
});
|
||||
onMounted(() => {});
|
||||
onUnmounted(() => {});
|
||||
</script>
|
||||
|
||||
<style scoped lang="scss">
|
||||
.page-container {
|
||||
width: 100%;
|
||||
overflow-x: hidden;
|
||||
position: relative;
|
||||
}
|
||||
|
||||
.header {
|
||||
width: 100%;
|
||||
height: 55px;
|
||||
display: flex;
|
||||
justify-content: space-between;
|
||||
align-items: flex-end;
|
||||
position: fixed;
|
||||
z-index: 10;
|
||||
top: 0;
|
||||
left: 0;
|
||||
right: 0;
|
||||
padding: 0 10rem;
|
||||
background-color: transparent;
|
||||
}
|
||||
|
||||
.logo {
|
||||
img {
|
||||
width: 108px;
|
||||
height: 33px;
|
||||
}
|
||||
}
|
||||
|
||||
.tabs {
|
||||
display: flex;
|
||||
gap: 32px;
|
||||
margin-right: 32px;
|
||||
}
|
||||
|
||||
.tab-item {
|
||||
font-size: 16px;
|
||||
color: #000000;
|
||||
cursor: pointer;
|
||||
transition: color 0.3s ease;
|
||||
padding: 4px 8px;
|
||||
|
||||
&.active {
|
||||
color: #8b59fa;
|
||||
}
|
||||
|
||||
&:hover {
|
||||
color: #8b59fa;
|
||||
}
|
||||
}
|
||||
|
||||
.title {
|
||||
font-size: 85px;
|
||||
font-weight: 600;
|
||||
}
|
||||
|
||||
.div-indent {
|
||||
text-indent: 2em; // Adjust the value as needed for the desired indent
|
||||
line-height: 75px;
|
||||
}
|
||||
.title {
|
||||
line-height: 110px;
|
||||
color: #10253e;
|
||||
}
|
||||
</style>
|
||||
|
||||
@ -726,7 +726,7 @@ watch(
|
||||
top: 0;
|
||||
left: 0;
|
||||
right: 0;
|
||||
padding: 0 14rem;
|
||||
padding: 0 10rem;
|
||||
background-color: transparent;
|
||||
}
|
||||
|
||||
|
||||
@ -552,6 +552,7 @@ watch(
|
||||
<section className="panel first-panel">
|
||||
|
||||
<n-carousel autoplay :interval="5000" class="no-hover">
|
||||
<img class="carousel-item" src="@/assets/image/banner/cn/b0.png">
|
||||
<img class="carousel-img" src="@/assets/image/banner/cn/b1.jpg">
|
||||
<img class="carousel-img" src="@/assets/image/banner/cn/b2.jpg">
|
||||
<img class="carousel-img" src="@/assets/image/banner/cn/b3.jpg">
|
||||
@ -729,7 +730,7 @@ watch(
|
||||
top: 0;
|
||||
left: 0;
|
||||
right: 0;
|
||||
padding: 0 14rem;
|
||||
padding: 0 10rem;
|
||||
background-color: transparent;
|
||||
}
|
||||
|
||||
|
||||
Loading…
Reference in New Issue
Block a user