Compare commits
No commits in common. "b7e7cd5090b185c2badd1efdaedb67a2049a1086" and "bce6823c184380171cae9254ad8964563e74f1d2" have entirely different histories.
b7e7cd5090
...
bce6823c18
|
Before Width: | Height: | Size: 158 KiB |
|
Before Width: | Height: | Size: 31 KiB |
|
Before Width: | Height: | Size: 57 KiB |
|
Before Width: | Height: | Size: 6.0 KiB |
|
Before Width: | Height: | Size: 29 KiB |
|
Before Width: | Height: | Size: 105 KiB |
|
Before Width: | Height: | Size: 6.8 KiB |
|
Before Width: | Height: | Size: 59 KiB |
|
Before Width: | Height: | Size: 26 KiB |
|
Before Width: | Height: | Size: 3.3 KiB |
|
Before Width: | Height: | Size: 3.3 KiB |
|
Before Width: | Height: | Size: 2.3 KiB |
|
Before Width: | Height: | Size: 3.7 KiB |
|
Before Width: | Height: | Size: 3.9 KiB |
|
Before Width: | Height: | Size: 318 KiB |
|
Before Width: | Height: | Size: 194 KiB |
|
Before Width: | Height: | Size: 312 KiB |
|
Before Width: | Height: | Size: 480 KiB |
|
Before Width: | Height: | Size: 420 KiB |
|
Before Width: | Height: | Size: 572 B |
|
Before Width: | Height: | Size: 433 KiB After Width: | Height: | Size: 433 KiB |
BIN
src/assets/image/businessintroduction/bg-10.png
Normal file
|
After Width: | Height: | Size: 56 KiB |
BIN
src/assets/image/businessintroduction/bg-11.png
Normal file
|
After Width: | Height: | Size: 53 KiB |
|
Before Width: | Height: | Size: 66 KiB After Width: | Height: | Size: 66 KiB |
|
Before Width: | Height: | Size: 17 KiB After Width: | Height: | Size: 17 KiB |
|
Before Width: | Height: | Size: 78 KiB After Width: | Height: | Size: 78 KiB |
|
Before Width: | Height: | Size: 131 KiB After Width: | Height: | Size: 131 KiB |
|
Before Width: | Height: | Size: 18 KiB After Width: | Height: | Size: 18 KiB |
|
Before Width: | Height: | Size: 108 KiB After Width: | Height: | Size: 108 KiB |
|
Before Width: | Height: | Size: 50 KiB After Width: | Height: | Size: 50 KiB |
|
Before Width: | Height: | Size: 4.1 KiB After Width: | Height: | Size: 4.1 KiB |
|
Before Width: | Height: | Size: 3.7 KiB After Width: | Height: | Size: 3.7 KiB |
|
Before Width: | Height: | Size: 3.0 KiB After Width: | Height: | Size: 3.0 KiB |
|
Before Width: | Height: | Size: 4.2 KiB After Width: | Height: | Size: 4.2 KiB |
|
Before Width: | Height: | Size: 5.0 KiB After Width: | Height: | Size: 5.0 KiB |
|
Before Width: | Height: | Size: 572 B After Width: | Height: | Size: 572 B |
|
Before Width: | Height: | Size: 395 KiB After Width: | Height: | Size: 395 KiB |
|
Before Width: | Height: | Size: 566 KiB After Width: | Height: | Size: 566 KiB |
|
Before Width: | Height: | Size: 200 KiB After Width: | Height: | Size: 200 KiB |
|
Before Width: | Height: | Size: 334 KiB After Width: | Height: | Size: 334 KiB |
|
Before Width: | Height: | Size: 291 KiB After Width: | Height: | Size: 291 KiB |
BIN
src/assets/image/businessintroduction/减去 15@2x.png
Normal file
|
After Width: | Height: | Size: 91 KiB |
BIN
src/assets/image/businessintroduction/减去 16@2x.png
Normal file
|
After Width: | Height: | Size: 52 KiB |
BIN
src/assets/image/businessintroduction/减去 26@2x.png
Normal file
|
After Width: | Height: | Size: 90 KiB |
BIN
src/assets/image/businessintroduction/滚动组 102@2x.png
Normal file
|
After Width: | Height: | Size: 49 KiB |
BIN
src/assets/image/businessintroduction/组 1640@2x.png
Normal file
|
After Width: | Height: | Size: 8.9 KiB |
BIN
src/assets/image/businessintroduction/组 1692@2x.png
Normal file
|
After Width: | Height: | Size: 62 KiB |
|
Before Width: | Height: | Size: 28 KiB |
|
Before Width: | Height: | Size: 424 KiB |
|
Before Width: | Height: | Size: 132 KiB |
|
Before Width: | Height: | Size: 67 KiB |
|
Before Width: | Height: | Size: 5.4 KiB |
|
Before Width: | Height: | Size: 3.4 KiB |
|
Before Width: | Height: | Size: 3.2 KiB |
|
Before Width: | Height: | Size: 2.6 KiB |
|
Before Width: | Height: | Size: 17 KiB |
|
Before Width: | Height: | Size: 49 KiB |
|
Before Width: | Height: | Size: 563 KiB |
|
Before Width: | Height: | Size: 540 KiB |
|
Before Width: | Height: | Size: 402 KiB |
|
Before Width: | Height: | Size: 734 KiB |
|
Before Width: | Height: | Size: 1.0 MiB |
|
Before Width: | Height: | Size: 2.0 MiB |
|
Before Width: | Height: | Size: 1.2 MiB |
|
Before Width: | Height: | Size: 2.1 KiB |
|
Before Width: | Height: | Size: 2.0 KiB |
|
Before Width: | Height: | Size: 68 KiB After Width: | Height: | Size: 68 KiB |
|
Before Width: | Height: | Size: 100 KiB After Width: | Height: | Size: 100 KiB |
|
Before Width: | Height: | Size: 121 KiB After Width: | Height: | Size: 121 KiB |
|
Before Width: | Height: | Size: 1.2 MiB After Width: | Height: | Size: 1.2 MiB |
|
Before Width: | Height: | Size: 1.0 MiB After Width: | Height: | Size: 1.0 MiB |
|
Before Width: | Height: | Size: 2.0 MiB After Width: | Height: | Size: 2.0 MiB |
|
Before Width: | Height: | Size: 447 KiB After Width: | Height: | Size: 447 KiB |
|
Before Width: | Height: | Size: 1.2 MiB After Width: | Height: | Size: 1.2 MiB |
|
Before Width: | Height: | Size: 221 KiB After Width: | Height: | Size: 221 KiB |
|
Before Width: | Height: | Size: 7.6 KiB After Width: | Height: | Size: 7.6 KiB |
|
Before Width: | Height: | Size: 2.1 KiB After Width: | Height: | Size: 2.1 KiB |
|
Before Width: | Height: | Size: 4.4 KiB After Width: | Height: | Size: 4.4 KiB |
|
Before Width: | Height: | Size: 4.3 KiB After Width: | Height: | Size: 4.3 KiB |
|
Before Width: | Height: | Size: 3.4 KiB After Width: | Height: | Size: 3.4 KiB |
|
Before Width: | Height: | Size: 2.0 KiB After Width: | Height: | Size: 2.0 KiB |
|
Before Width: | Height: | Size: 24 KiB After Width: | Height: | Size: 24 KiB |
|
Before Width: | Height: | Size: 80 KiB After Width: | Height: | Size: 80 KiB |
|
Before Width: | Height: | Size: 1.7 MiB After Width: | Height: | Size: 1.7 MiB |
|
Before Width: | Height: | Size: 1.8 MiB After Width: | Height: | Size: 1.8 MiB |
|
Before Width: | Height: | Size: 1.1 MiB After Width: | Height: | Size: 1.1 MiB |
|
Before Width: | Height: | Size: 2.1 MiB After Width: | Height: | Size: 2.1 MiB |
BIN
src/assets/image/companyprofil/矩形 786@2x.png
Normal file
|
After Width: | Height: | Size: 20 KiB |
@ -29,17 +29,17 @@
|
||||
</div>
|
||||
</header>
|
||||
<main>
|
||||
<section className="relative pb-[1020px]">
|
||||
<section className="relative pb-[900px]">
|
||||
<div class="absolute top-[0px] right-[0px]">
|
||||
<img
|
||||
src="@/assets/image/businessintroduction/375/bg-6.png"
|
||||
class="w-[1920px]"
|
||||
src="@/assets/image/businessintroduction/bg-6.png"
|
||||
class="w-[1652px] h-[1865px]"
|
||||
/>
|
||||
</div>
|
||||
|
||||
<div class="pt-[2345px]">
|
||||
<div class="pt-[718px]">
|
||||
<div
|
||||
class="w-full title ml-[188px]"
|
||||
class="w-[640px] title ml-[188px]"
|
||||
:ref="
|
||||
(el) => {
|
||||
moveRefs[0].value = el;
|
||||
@ -55,51 +55,51 @@
|
||||
moveRefs[1].value = el;
|
||||
}
|
||||
"
|
||||
class="text-[51px] text-[#8B59F7] w-[1413px] ml-[188px] mt-[55px]"
|
||||
class="w-full text-[35px] text-[#8B59F7] w-[958px] ml-[188px] mt-[55px]"
|
||||
>
|
||||
深度融合前沿 AI
|
||||
技术与短视频平台的独特优势，率先开启探索之旅，勇立潮头，领航文创领域踏入前所未有的崭新视界
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div class="absolute bottom-[-260px] left-[0px]">
|
||||
<img
|
||||
src="@/assets/image/businessintroduction/375/bg-7.png"
|
||||
class="w-[1405px] h-[1428px]"
|
||||
/>
|
||||
</div>
|
||||
<div
|
||||
:ref="
|
||||
(el) => {
|
||||
moveRefs[3].value = el;
|
||||
}
|
||||
"
|
||||
class="absolute bottom-[-424px] right-[0px]"
|
||||
class="absolute bottom-[-290px] right-[0px]"
|
||||
>
|
||||
<img
|
||||
src="@/assets/image/businessintroduction/375/bg-2.png"
|
||||
class="w-[1039px]"
|
||||
src="@/assets/image/businessintroduction/bg-2.png"
|
||||
class="w-[960px] h-[955px]"
|
||||
/>
|
||||
</div>
|
||||
<div class="absolute bottom-[-660px] left-[0px]">
|
||||
<img
|
||||
src="@/assets/image/businessintroduction/bg-7.png"
|
||||
class="w-[842px] h-[1798px]"
|
||||
/>
|
||||
</div>
|
||||
</section>
|
||||
|
||||
<section class="section-sec relative">
|
||||
<div class="flex flex-wrap justify-center pt-[480px]">
|
||||
<div class="w-full px-[184px]">
|
||||
<div class="text-[#8B59F7] text-[72px] font-semibold">行业现状</div>
|
||||
<div class="flex flex-wrap justify-center pt-[400px] pb-[270px]">
|
||||
<div class="w-full px-[188px]">
|
||||
<div class="text-[#8B59F7] text-[40px] font-medium">行业现状</div>
|
||||
</div>
|
||||
<div class="w-full title mt-[87px] px-[184px]">
|
||||
<div class="w-full title mt-[58px] px-[188px]">
|
||||
<div>文创遇阻</div>
|
||||
<div>短视频解锁行业增长新密码</div>
|
||||
</div>
|
||||
<div class="w-full px-[184px] mt-[159px]">
|
||||
<div class="w-full px-[188px] mt-[140px]">
|
||||
<div
|
||||
:ref="
|
||||
(el) => {
|
||||
moveRefs[4].value = el;
|
||||
}
|
||||
"
|
||||
class="text-[#455363] text-[72px] pr-[139px]"
|
||||
class="text-[#455363] text-[40px] w-[1345px]"
|
||||
>
|
||||
在文创领域深陷内容趋同、灵感枯竭的困局时，短视频凭借其独特的沉浸式体验、强大的社交裂变属性，打破桎梏，如春风化雨般为行业注入新的生命力，成为驱动增长的强劲引擎。
|
||||
"全周期" 价值赋能体系。
|
||||
@ -107,31 +107,28 @@
|
||||
</div>
|
||||
|
||||
<div
|
||||
class="w-full mt-[287px] px-[184px] font-semibold text-[92px] text-[#8B59F7]"
|
||||
class="w-full mt-[160px] px-[188px] font-medium text-[55px] text-[#8B59F7]"
|
||||
>
|
||||
<div>文艺市场困局</div>
|
||||
</div>
|
||||
|
||||
<div class="w-full px-[184px] flex flex-wrap">
|
||||
<div class="w-full px-[188px] flex flex-wrap">
|
||||
<div
|
||||
:ref="
|
||||
(el) => {
|
||||
moveRefs[5].value = el;
|
||||
}
|
||||
"
|
||||
class="w-full mt-[154px] flex flex-wrap text-[72px]"
|
||||
class="w-[50%] mt-[58px] flex flex-wrap text-[40px]"
|
||||
>
|
||||
<div
|
||||
class="w-full font-semibold text-[82px] text-[#455363] flex flex-wrap items-center"
|
||||
>
|
||||
<div class="font-medium">
|
||||
<img
|
||||
class="w-[82px] h-[82px] mr-[51px]"
|
||||
src="@/assets/image/businessintroduction/375/icon-y.png"
|
||||
class="w-[40px] h-[40px] mr-[25px]"
|
||||
src="@/assets/image/businessintroduction/icon-y.png"
|
||||
/>
|
||||
|
||||
文艺价值蒙尘
|
||||
</div>
|
||||
<div class="w-full mt-[15px] pl-[133px] text-[#455363]">
|
||||
<div class="mt-[8px] w-[680px]">
|
||||
品牌塑造与市场运营匮乏，致使文艺价值隐于暗处，难以被大众洞悉与认可。
|
||||
</div>
|
||||
</div>
|
||||
@ -141,19 +138,17 @@
|
||||
moveRefs[6].value = el;
|
||||
}
|
||||
"
|
||||
class="w-full mt-[154px] flex flex-wrap text-[72px]"
|
||||
class="w-[50%] mt-[58px] flex flex-wrap text-[40px]"
|
||||
>
|
||||
<div
|
||||
class="w-full font-semibold text-[82px] text-[#455363] flex flex-wrap items-center"
|
||||
>
|
||||
<div class="font-medium">
|
||||
<img
|
||||
class="w-[82px] h-[82px] mr-[51px]"
|
||||
src="@/assets/image/businessintroduction/375/icon-y.png"
|
||||
class="w-[40px] h-[40px] mr-[25px]"
|
||||
src="@/assets/image/businessintroduction/icon-y.png"
|
||||
/>
|
||||
|
||||
推广途径困局
|
||||
</div>
|
||||
<div class="w-full mt-[15px] pl-[133px] text-[#455363]">
|
||||
<div class="mt-[8px] w-[680px]">
|
||||
个人社交平台和传统展览形式陈旧，无法达成广泛且优质的曝光，严重束缚传播。
|
||||
</div>
|
||||
</div>
|
||||
@ -163,19 +158,17 @@
|
||||
moveRefs[7].value = el;
|
||||
}
|
||||
"
|
||||
class="w-full mt-[154px] flex flex-wrap text-[72px]"
|
||||
class="w-[50%] mt-[58px] flex flex-wrap text-[40px]"
|
||||
>
|
||||
<div
|
||||
class="w-full font-semibold text-[82px] text-[#455363] flex flex-wrap items-center"
|
||||
>
|
||||
<div class="font-medium">
|
||||
<img
|
||||
class="w-[82px] h-[82px] mr-[51px]"
|
||||
src="@/assets/image/businessintroduction/375/icon-y.png"
|
||||
class="w-[40px] h-[40px] mr-[25px]"
|
||||
src="@/assets/image/businessintroduction/icon-y.png"
|
||||
/>
|
||||
|
||||
宣传单一致贫
|
||||
</div>
|
||||
<div class="w-full mt-[15px] pl-[133px] text-[#455363]">
|
||||
<div class="mt-[8px] w-[680px]">
|
||||
过度倚重线下展厅与个别展会，宣传面狭隘，致使收入结构单一且不稳定。
|
||||
</div>
|
||||
</div>
|
||||
@ -185,19 +178,17 @@
|
||||
moveRefs[8].value = el;
|
||||
}
|
||||
"
|
||||
class="w-full mt-[154px] flex flex-wrap text-[72px]"
|
||||
class="w-[50%] mt-[58px] flex flex-wrap text-[40px]"
|
||||
>
|
||||
<div
|
||||
class="w-full font-semibold text-[82px] text-[#455363] flex flex-wrap items-center"
|
||||
>
|
||||
<div class="font-medium">
|
||||
<img
|
||||
class="w-[82px] h-[82px] mr-[51px]"
|
||||
src="@/assets/image/businessintroduction/375/icon-y.png"
|
||||
class="w-[40px] h-[40px] mr-[25px]"
|
||||
src="@/assets/image/businessintroduction/icon-y.png"
|
||||
/>
|
||||
|
||||
传统营销掣肘
|
||||
</div>
|
||||
<div class="w-full mt-[15px] pl-[133px] text-[#455363]">
|
||||
<div class="mt-[8px] w-[680px]">
|
||||
传统广告渠道收费高昂，文艺创作者财力难支，极大限制了推广宣传的范围。
|
||||
</div>
|
||||
</div>
|
||||
@ -208,10 +199,9 @@
|
||||
moveRefs[9].value = el;
|
||||
}
|
||||
"
|
||||
class="w-full mt-[160px] px-[184px] font-semibold text-[92px] text-[#8B59F7]"
|
||||
class="w-full mt-[160px] px-[188px] font-medium text-[55px] text-[#8B59F7]"
|
||||
>
|
||||
<div>短视频自媒体：</div>
|
||||
<div>澎湃新势，蕴蓄无垠商机</div>
|
||||
<div>短视频自媒体：澎湃新势，蕴蓄无垠商机</div>
|
||||
</div>
|
||||
<div
|
||||
:ref="
|
||||
@ -219,7 +209,7 @@
|
||||
moveRefs[10].value = el;
|
||||
}
|
||||
"
|
||||
class="w-full mt-[154px] px-[184px] text-[72px] text-[#455363] leading-[102px] mb-[379px]"
|
||||
class="w-full mt-[75px] px-[188px] text-[40px] text-[#455363]"
|
||||
>
|
||||
<div>
|
||||
当下，短视频市场呈爆发式增长，广告规模迅猛扩张
|
||||
@ -231,34 +221,33 @@
|
||||
|
||||
<section class="relative" style="background: #fff">
|
||||
<div class="flex flex-wrap justify-center">
|
||||
<div class="w-full px-[184px] mt-[369px]">
|
||||
<div class="text-[#8B59F7] text-[72px] font-semibold">业务模式</div>
|
||||
<div class="w-full px-[188px] mt-[113px]">
|
||||
<div class="text-[#8B59F7] text-[40px] font-medium">业务模式</div>
|
||||
</div>
|
||||
<div class="w-full title mt-[87px] px-[184px]">
|
||||
<div class="w-full title mt-[58px] px-[188px]">
|
||||
<div>科技赋能</div>
|
||||
<div>文艺创作者</div>
|
||||
<div>全链路价值服务体系</div>
|
||||
<div>文艺创作者全链路价值服务体系</div>
|
||||
</div>
|
||||
|
||||
<div class="mt-[230px] mb-[399px] overflow-hidden">
|
||||
<div class="mt-[140px] mb-[188px] overflow-hidden">
|
||||
<img
|
||||
:ref="
|
||||
(el) => {
|
||||
moveRefs[11].value = el;
|
||||
}
|
||||
"
|
||||
class="w-[1715px]"
|
||||
src="@/assets/image/businessintroduction/375/imageshow-2.png"
|
||||
class="w-[1625px] h-[1038px]"
|
||||
src="@/assets/image/businessintroduction/imageshow-2.png"
|
||||
/>
|
||||
</div>
|
||||
<div class="w-full px-[184px]">
|
||||
<div class="w-full px-[188px]">
|
||||
<img
|
||||
class="w-[306px] h-[229px]"
|
||||
src="@/assets/image/businessintroduction/375/icon-l.png"
|
||||
class="w-[161px] h-[120px]"
|
||||
src="@/assets/image/businessintroduction/icon-l.png"
|
||||
/>
|
||||
|
||||
<div
|
||||
class="w-full mt-[102px] text-[#10253E] text-[82px] font-semibold"
|
||||
class="w-full mt-[50px] text-[#10253E] text-[45px] font-medium"
|
||||
>
|
||||
精准分发 开启粉丝增长引擎
|
||||
</div>
|
||||
@ -268,20 +257,20 @@
|
||||
moveRefs[12].value = el;
|
||||
}
|
||||
"
|
||||
class="mt-[87px] text-[#455363] text-[72px] pr-[112px]"
|
||||
class="mt-[38px] text-[#455363] text-[40px] w-[1345px]"
|
||||
>
|
||||
运用大数据分析与 AI
|
||||
算法，深度剖析用户浏览习惯、搜索偏好等行为数据，构建精准用户画像，把文艺创作者的作品精准推送给潜在受众，将无目的需求方转化为忠实粉丝，为创作者影响力传播奠定基础。
|
||||
</div>
|
||||
</div>
|
||||
<div class="w-full px-[184px] mt-[410px]">
|
||||
<div class="w-full px-[188px] mt-[170px]">
|
||||
<img
|
||||
class="w-[222px] h-[198px]"
|
||||
src="@/assets/image/businessintroduction/375/icon-k.png"
|
||||
class="w-[145px] h-[129px]"
|
||||
src="@/assets/image/businessintroduction/icon-k.png"
|
||||
/>
|
||||
|
||||
<div
|
||||
class="w-full mt-[128px] text-[#10253E] text-[82px] font-semibold"
|
||||
class="w-full mt-[50px] text-[#10253E] text-[45px] font-medium"
|
||||
>
|
||||
多元变现 激活商业价值链条
|
||||
</div>
|
||||
@ -291,19 +280,19 @@
|
||||
moveRefs[13].value = el;
|
||||
}
|
||||
"
|
||||
class="mt-[87px] text-[#455363] text-[72px] pr-[112px]"
|
||||
class="mt-[38px] text-[#455363] text-[40px] w-[1345px]"
|
||||
>
|
||||
为挖掘文艺创作商业价值，搭建粉丝经济运营体系。通过便捷打赏机制，让粉丝即时表达对创作者的喜爱；提供实体和数字作品售卖渠道，满足粉丝收藏需求；推出订阅服务，提供独家内容与活动优先参与权益，增强粉丝粘性。这些途径推动粉丝转变为消费者，实现创作者和平台的收入增长。
|
||||
</div>
|
||||
</div>
|
||||
<div class="w-full px-[184px] mt-[410px] mb-[379px]">
|
||||
<div class="w-full px-[188px] mt-[160px] mb-[250px]">
|
||||
<img
|
||||
class="w-[227px] h-[222px]"
|
||||
src="@/assets/image/businessintroduction/375/icon-h.png"
|
||||
class="w-[138px] h-[135px]"
|
||||
src="@/assets/image/businessintroduction/icon-h.png"
|
||||
/>
|
||||
|
||||
<div
|
||||
class="w-full mt-[123px] text-[#10253E] text-[82px] font-semibold"
|
||||
class="w-full mt-[50px] text-[#10253E] text-[45px] font-medium"
|
||||
>
|
||||
互动共享 构建艺术生态闭环
|
||||
</div>
|
||||
@ -313,7 +302,7 @@
|
||||
moveRefs[14].value = el;
|
||||
}
|
||||
"
|
||||
class="mt-[87px] text-[#455363] text-[72px] pr-[112px]"
|
||||
class="mt-[38px] text-[#455363] text-[40px] w-[1345px]"
|
||||
>
|
||||
借助智能社交推荐技术，推动粉丝间深度互动交流，分享见解与创作灵感，挖掘彼此潜在需求，实现粉丝群体自然裂变。同时，通过数据分析洞察消费群体特征和需求，精准拓展消费圈层，挖掘新商机。这一互动共享机制构建起可持续发展的文艺创作生态，创作者影响力持续提升，公司也实现稳健发展与收益增长，达成双赢。
|
||||
</div>
|
||||
@ -323,27 +312,27 @@
|
||||
|
||||
<section class="relative" style="background: #f8f9ff">
|
||||
<div class="flex flex-wrap justify-center relative pb-[875px]">
|
||||
<div class="w-full px-[184px] mt-[379px]">
|
||||
<div class="text-[#8B59F7] text-[72px]">市场愿景</div>
|
||||
<div class="w-full px-[188px] mt-[113px]">
|
||||
<div class="text-[#8B59F7] text-[40px]">市场愿景</div>
|
||||
</div>
|
||||
<div class="w-full title mt-[87px] px-[184px]">
|
||||
<div class="w-full title mt-[58px] px-[188px]">
|
||||
<div>擘画文艺市场新蓝图</div>
|
||||
</div>
|
||||
<div class="w-full px-[184px] mt-[159px]">
|
||||
<div class="w-full px-[188px] mt-[140px]">
|
||||
<div
|
||||
:ref="
|
||||
(el) => {
|
||||
moveRefs[15].value = el;
|
||||
}
|
||||
"
|
||||
class="text-[#455363] text-[72px] pr-[112px]"
|
||||
class="text-[#455363] text-[40px] w-[1345px]"
|
||||
>
|
||||
在变幻莫测的艺术浪潮中，FiEE以创新为笔，精准洞察为墨，以创新思维与全球化视野重新定义文艺产业的未来。深度挖掘文艺潜力，融合多元文化元素，打破传统壁垒，搭建线上流量社群，重塑文艺生态，激发市场活力，引领文艺价值的新流向，开启文艺市场的全新时代。
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div
|
||||
class="w-full mt-[287px] px-[184px] font-semibold text-[92px] text-[#8B59F7]"
|
||||
class="w-full mt-[160px] px-[188px] font-medium text-[55px] text-[#8B59F7]"
|
||||
>
|
||||
<div>构建十亿流量社群，搭建全球文艺交流高地</div>
|
||||
</div>
|
||||
@ -353,7 +342,7 @@
|
||||
moveRefs[16].value = el;
|
||||
}
|
||||
"
|
||||
class="w-full mt-[154px] px-[184px] text-[72px] text-[#455363]"
|
||||
class="w-full mt-[75px] px-[188px] text-[40px] text-[#455363]"
|
||||
>
|
||||
<div>
|
||||
运用前沿大数据与 AI
|
||||
@ -361,25 +350,24 @@
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div class="absolute bottom-[-180px]">
|
||||
<div class="absolute bottom-[-160px]">
|
||||
<img
|
||||
:ref="
|
||||
(el) => {
|
||||
moveRefs[17].value = el;
|
||||
}
|
||||
"
|
||||
class="w-[1715px]"
|
||||
src="@/assets/image/businessintroduction/375/imageshow-1.png"
|
||||
class="w-[1625px] h-[1038px]"
|
||||
src="@/assets/image/businessintroduction/imageshow-1.png"
|
||||
/>
|
||||
</div>
|
||||
</div>
|
||||
</section>
|
||||
|
||||
<section class="section-five h-[4562px] pt-[379px] relative">
|
||||
<div class="w-full px-[184px]">
|
||||
<div class="text-[#fff] text-[92px] font-semibold">
|
||||
<div>全球合作拓展</div>
|
||||
<div>绘制多元融合版图</div>
|
||||
<section class="section-five h-[3195px] pt-[215px] relative">
|
||||
<div class="w-full px-[188px]">
|
||||
<div class="text-[#fff] text-[55px] font-medium">
|
||||
全球合作拓展，绘制多元融合版图
|
||||
</div>
|
||||
</div>
|
||||
<div
|
||||
@ -388,10 +376,10 @@
|
||||
moveRefs[18].value = el;
|
||||
}
|
||||
"
|
||||
class="w-full px-[184px]"
|
||||
class="w-full px-[188px] mt-[100px]"
|
||||
>
|
||||
<div class="w-full mt-[288px] text-[#fff] text-[82px]">2025年</div>
|
||||
<div class="mt-[87px] text-[#D1D1D1] text-[72px] w-[1431px]">
|
||||
<div class="w-full mt-[50px] text-[#fff] text-[45px]">2025年</div>
|
||||
<div class="mt-[38px] text-[#D1D1D1] text-[40px] w-[1431px]">
|
||||
与1500+文艺机构、科技企业达成深度合作，整合资源，共同探索文艺科技融合项目，推动艺术创作与传播模式创新
|
||||
</div>
|
||||
</div>
|
||||
@ -401,10 +389,10 @@
|
||||
moveRefs[19].value = el;
|
||||
}
|
||||
"
|
||||
class="w-full px-[184px] mt-[80px]"
|
||||
class="w-full px-[188px] mt-[80px]"
|
||||
>
|
||||
<div class="w-full mt-[159px] text-[#fff] text-[82px]">2026年</div>
|
||||
<div class="mt-[87px] text-[#D1D1D1] text-[72px] w-[1431px]">
|
||||
<div class="w-full mt-[50px] text-[#fff] text-[45px]">2026年</div>
|
||||
<div class="mt-[38px] text-[#D1D1D1] text-[40px] w-[1431px]">
|
||||
全球合作伙伴突破
|
||||
5000+，建立广泛合作网络，拓展业务覆盖区域，在全球主要艺术市场落地项目，提升品牌国际知名度。
|
||||
</div>
|
||||
@ -415,41 +403,41 @@
|
||||
moveRefs[20].value = el;
|
||||
}
|
||||
"
|
||||
class="w-full px-[184px] mt-[80px]"
|
||||
class="w-full px-[188px] mt-[80px]"
|
||||
>
|
||||
<div class="w-full mt-[154px] text-[#fff] text-[82px]">2027年</div>
|
||||
<div class="mt-[87px] text-[#D1D1D1] text-[72px] w-[1431px]">
|
||||
<div class="w-full mt-[50px] text-[#fff] text-[45px]">2027年</div>
|
||||
<div class="mt-[38px] text-[#D1D1D1] text-[40px] w-[1431px]">
|
||||
战略合作伙伴超
|
||||
10000+，形成稳固全球战略联盟，全面打通文艺产业链，实现资源共享、互利共赢。
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div class="absolute bottom-[-10px] right-[0px]">
|
||||
<div class="absolute bottom-[262px] right-[0px]">
|
||||
<img
|
||||
src="@/assets/image/businessintroduction/375/bg-5.png"
|
||||
src="@/assets/image/businessintroduction/bg-5.png"
|
||||
class="h-[361px]"
|
||||
/>
|
||||
</div>
|
||||
</section>
|
||||
<section>
|
||||
<section class="">
|
||||
<div class="flex flex-wrap justify-center">
|
||||
<div class="w-full px-[184px] mt-[300px]">
|
||||
<div class="text-[#8B59F7] text-[92px] font-semibold">
|
||||
<div class="w-full px-[188px] mt-[10px]">
|
||||
<div class="text-[#8B59F7] text-[55px] font-medium">
|
||||
18个月孵化0基础艺术KOL
|
||||
</div>
|
||||
<div class="text-[#8B59F7] text-[92px] font-semibold">
|
||||
<div class="text-[#8B59F7] text-[55px] font-medium">
|
||||
释放文艺商业潜能
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div class="w-full px-[184px] mt-[130px]">
|
||||
<div class="w-full px-[188px] mt-[40px]">
|
||||
<div
|
||||
:ref="
|
||||
(el) => {
|
||||
moveRefs[21].value = el;
|
||||
}
|
||||
"
|
||||
class="text-[#455363] text-[72px] pr-[57px] leading-[102px]"
|
||||
class="text-[#455363] text-[40px] w-[1430px]"
|
||||
>
|
||||
18个月，是一场艺术潜能的深度挖掘，更是一次文艺商业的破茧之旅。从绘画技巧到审美构建，从内容创作到流量运营，全方位赋能。FiEE为
|
||||
0
|
||||
@ -459,7 +447,7 @@
|
||||
</div>
|
||||
|
||||
<div
|
||||
class="w-full px-[184px] flex flex-wrap justify-between mt-[440px] mb-[384px]"
|
||||
class="w-full px-[188px] flex flex-wrap justify-between mt-[160px] mb-[230px]"
|
||||
>
|
||||
<div
|
||||
:ref="
|
||||
@ -467,20 +455,20 @@
|
||||
moveRefs[22].value = el;
|
||||
}
|
||||
"
|
||||
class="w-full flex flex-wrap text-[72px]"
|
||||
class="w-[50%] flex flex-wrap text-[40px]"
|
||||
>
|
||||
<div class="w-full">
|
||||
<img
|
||||
class="w-[229px] h-[222px]"
|
||||
src="@/assets/image/businessintroduction/375/icon-s.png"
|
||||
class="w-[139px] h-[135px]"
|
||||
src="@/assets/image/businessintroduction/icon-s.png"
|
||||
/>
|
||||
</div>
|
||||
<div
|
||||
class="w-full font-semibold mt-[123px] text-[#10253E] text-[82px]"
|
||||
class="w-full font-medium mt-[50px] text-[#10253E] text-[45px]"
|
||||
>
|
||||
粉丝增长
|
||||
</div>
|
||||
<div class="mt-[87px]">
|
||||
<div class="mt-[38px] w-[506px]">
|
||||
至 2027 年，凭借精准营销策略，助力每位艺术家粉丝数超 10
|
||||
万，粉丝社区人数达 10
|
||||
亿，壮大文艺创作者粉丝群体，增强作品影响力。
|
||||
@ -492,21 +480,21 @@
|
||||
moveRefs[23].value = el;
|
||||
}
|
||||
"
|
||||
class="w-full flex flex-wrap text-[72px]"
|
||||
class="w-[50%] flex flex-wrap text-[40px]"
|
||||
>
|
||||
<div class="w-full mt-[410px]">
|
||||
<div class="w-full">
|
||||
<img
|
||||
class="w-[218px] h-[222px]"
|
||||
src="@/assets/image/businessintroduction/375/icon-c.png"
|
||||
class="w-[132px] h-[135px] mr-[25px]"
|
||||
src="@/assets/image/businessintroduction/icon-c.png"
|
||||
/>
|
||||
</div>
|
||||
|
||||
<div
|
||||
class="w-full font-semibold mt-[123px] text-[#10253E] text-[82px]"
|
||||
class="w-full font-medium mt-[50px] text-[#10253E] text-[45px]"
|
||||
>
|
||||
KOL孵化
|
||||
</div>
|
||||
<div class="mt-[87px]">
|
||||
<div class="mt-[38px] w-[506px]">
|
||||
依托十亿流量社群，运用精准数据分析，18
|
||||
个月内将普通文艺创作者或商业品牌打造成国际知名
|
||||
KOL，实现艺术价值与商业价值的高效转化。
|
||||
@ -523,11 +511,10 @@
|
||||
moveRefs[24].value = el;
|
||||
}
|
||||
"
|
||||
class="w-full px-[184px] mt-[364px]"
|
||||
class="w-full px-[188px] mt-[218px]"
|
||||
>
|
||||
<div class="text-[#8B59F7] text-[92px] font-semibold">
|
||||
<div>曝光量突破</div>
|
||||
<div>塑造全球品牌影响力</div>
|
||||
<div class="text-[#8B59F7] text-[55px] font-medium">
|
||||
曝光量突破，塑造全球品牌影响力
|
||||
</div>
|
||||
</div>
|
||||
|
||||
@ -537,24 +524,28 @@
|
||||
moveRefs[25].value = el;
|
||||
}
|
||||
"
|
||||
class="w-full px-[184px] mt-[154px]"
|
||||
class="w-full px-[188px] mt-[75px]"
|
||||
>
|
||||
<div class="text-[#455363] text-[72px] pr-[57px]">
|
||||
<div class="text-[#455363] text-[40px] w-[1431px]">
|
||||
凭借前沿的传播策略，精准狙击全球受众心智。深度整合顶级媒体资源，让曝光量呈指数级突破，全方位塑造全球品牌影响力，引领文艺潮流走向世界舞台中央
|
||||
</div>
|
||||
</div>
|
||||
<div class="mt-[46px] mb-[246px] px-[108px]">
|
||||
<div
|
||||
v-for="(item, idx) in state.marqueeArr"
|
||||
:key="idx"
|
||||
class="w-full flex flex-wrap justify-center carousel-item"
|
||||
>
|
||||
<img class="carousel-image" :src="item.imgUrl" />
|
||||
<div class="carousel-title w-full">
|
||||
<div>{{ item.title }}</div>
|
||||
</div>
|
||||
<div class="carousel-subtitle">
|
||||
<div>{{ item.subTitle }}</div>
|
||||
<div
|
||||
class="mt-[140px] mb-[175px] carousel-container px-[80px] py-[40px]"
|
||||
>
|
||||
<div ref="carouselTrack" class="carousel-track">
|
||||
<div
|
||||
v-for="(item, idx) in getVisibleItems()"
|
||||
:key="idx"
|
||||
class="carousel-item"
|
||||
>
|
||||
<img class="carousel-image" :src="item.imgUrl" />
|
||||
<div class="carousel-title">
|
||||
<div>{{ item.title }}</div>
|
||||
</div>
|
||||
<div class="carousel-subtitle">
|
||||
<div>{{ item.subTitle }}</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
@ -566,7 +557,7 @@
|
||||
className="flex flex-wrap justify-center"
|
||||
>
|
||||
<img
|
||||
class="w-[891px] h-[87px] mt-[61px] mb-[56px]"
|
||||
class="w-[580px] h-[55px] my-[85px]"
|
||||
src="@/assets/image/image-footer.png"
|
||||
alt="logo"
|
||||
/>
|
||||
@ -599,9 +590,9 @@ const { currentTab } = useHome();
|
||||
let ctx;
|
||||
|
||||
// 导入图片
|
||||
import imageshow3 from "@/assets/image/businessintroduction/375/imageshow-3.png";
|
||||
import imageshow4 from "@/assets/image/businessintroduction/375/imageshow-4.png";
|
||||
import imageshow5 from "@/assets/image/businessintroduction/375/imageshow-5.png";
|
||||
import imageshow3 from "@/assets/image/businessintroduction/imageshow-3.png";
|
||||
import imageshow4 from "@/assets/image/businessintroduction/imageshow-4.png";
|
||||
import imageshow5 from "@/assets/image/businessintroduction/imageshow-5.png";
|
||||
|
||||
const state = reactive({
|
||||
marqueeArr: [
|
||||
@ -625,8 +616,15 @@ const state = reactive({
|
||||
],
|
||||
});
|
||||
|
||||
const carouselTrack = ref(null);
|
||||
let carouselAnimation = null; // 存储 GSAP 动画实例
|
||||
|
||||
const getVisibleItems = () => {
|
||||
const items = state.marqueeArr;
|
||||
// 复制两组用于无缝滚动
|
||||
return [...items, ...items];
|
||||
};
|
||||
|
||||
// 监听窗口大小变化
|
||||
onMounted(() => {
|
||||
ctx = gsap.context(() => {
|
||||
@ -657,6 +655,32 @@ onMounted(() => {
|
||||
});
|
||||
}
|
||||
});
|
||||
console.log(moveRefs.value);
|
||||
// 初始化轮播动画
|
||||
nextTick(() => {
|
||||
if (carouselTrack.value) {
|
||||
const firstItem = carouselTrack.value.querySelector(".carousel-item");
|
||||
if (!firstItem) return;
|
||||
|
||||
const itemWidth = firstItem.offsetWidth;
|
||||
const itemMargin = parseInt(
|
||||
window.getComputedStyle(firstItem).marginRight
|
||||
);
|
||||
const slideWidth = itemWidth + itemMargin;
|
||||
const totalWidth = slideWidth * state.marqueeArr.length;
|
||||
|
||||
// 创建无限滚动动画
|
||||
carouselAnimation = gsap.to(carouselTrack.value, {
|
||||
x: -totalWidth,
|
||||
duration: 20,
|
||||
ease: "none",
|
||||
repeat: -1,
|
||||
onRepeat: () => {
|
||||
gsap.set(carouselTrack.value, { x: 0 });
|
||||
},
|
||||
});
|
||||
}
|
||||
});
|
||||
});
|
||||
});
|
||||
|
||||
@ -698,32 +722,33 @@ const goToSection = (i) => {
|
||||
overflow-x: hidden;
|
||||
position: relative;
|
||||
}
|
||||
|
||||
.header {
|
||||
width: 100%;
|
||||
height: 260px;
|
||||
height: 155px;
|
||||
position: fixed;
|
||||
z-index: 10;
|
||||
top: 0;
|
||||
left: 0;
|
||||
right: 0;
|
||||
padding: 0 138px;
|
||||
padding: 0 10rem;
|
||||
background-color: transparent;
|
||||
}
|
||||
.logo {
|
||||
img {
|
||||
width: 399px;
|
||||
height: 128px;
|
||||
width: 270px;
|
||||
height: 83px;
|
||||
}
|
||||
}
|
||||
|
||||
.tabs {
|
||||
display: flex;
|
||||
gap: 128px;
|
||||
gap: 32px;
|
||||
margin-right: 32px;
|
||||
}
|
||||
|
||||
.tab-item {
|
||||
font-size: 61px;
|
||||
font-size: 30px;
|
||||
color: #000000;
|
||||
cursor: pointer;
|
||||
transition: color 0.3s ease;
|
||||
@ -739,31 +764,27 @@ const goToSection = (i) => {
|
||||
}
|
||||
|
||||
.title {
|
||||
font-size: 113px;
|
||||
font-size: 85px;
|
||||
font-weight: 600;
|
||||
color: #10253e;
|
||||
line-height: 143px;
|
||||
}
|
||||
.subTitle {
|
||||
line-height: 102px;
|
||||
}
|
||||
|
||||
.section-first {
|
||||
width: 100%;
|
||||
background: url("@/assets/image/businessintroduction/375/bg-6.png");
|
||||
background: url("@/assets/image/businessintroduction/bg-6.png");
|
||||
background-size: cover;
|
||||
background-position: center;
|
||||
background-repeat: no-repeat;
|
||||
}
|
||||
.section-sec {
|
||||
z-index: 2;
|
||||
background: url("@/assets/image/businessintroduction/375/bg-12.png");
|
||||
background: url("@/assets/image/businessintroduction/bg-12.png");
|
||||
background-size: cover;
|
||||
background-position: right;
|
||||
background-position: top-center;
|
||||
background-repeat: no-repeat;
|
||||
}
|
||||
|
||||
.section-five {
|
||||
background: url("@/assets/image/businessintroduction/375/bg-1.png");
|
||||
background: url("@/assets/image/businessintroduction/bg-1.png");
|
||||
background-size: cover;
|
||||
background-position: center;
|
||||
background-repeat: no-repeat;
|
||||
@ -773,6 +794,11 @@ const goToSection = (i) => {
|
||||
bottom: -80px;
|
||||
right: 0;
|
||||
}
|
||||
.carousel-container {
|
||||
width: 96%;
|
||||
overflow: hidden;
|
||||
position: relative;
|
||||
}
|
||||
|
||||
.arrow-btn {
|
||||
cursor: pointer;
|
||||
@ -790,14 +816,18 @@ const goToSection = (i) => {
|
||||
}
|
||||
|
||||
.carousel-item {
|
||||
margin-top: 154px;
|
||||
padding: 46px 36px 118px 51px;
|
||||
border-radius: 61px;
|
||||
box-shadow: 0 15px 75px 5px rgba(0, 0, 0, 0.16);
|
||||
width: 785px;
|
||||
margin-right: 73px;
|
||||
flex: 0 0 auto;
|
||||
display: block; // 改为 block 布局
|
||||
padding: 23px 20px 40px;
|
||||
border-radius: 30px;
|
||||
box-shadow: 0 8px 35px 3px rgba(0, 0, 0, 0.16);
|
||||
}
|
||||
|
||||
.carousel-image {
|
||||
width: 1623px;
|
||||
width: 748px;
|
||||
height: 563px;
|
||||
object-fit: cover;
|
||||
display: block;
|
||||
}
|
||||
@ -808,16 +838,15 @@ const goToSection = (i) => {
|
||||
}
|
||||
|
||||
.carousel-title {
|
||||
text-align: left;
|
||||
font-size: 92px;
|
||||
font-size: 50px;
|
||||
font-weight: 500;
|
||||
margin-top: 87px;
|
||||
margin-top: 48px;
|
||||
}
|
||||
|
||||
.carousel-subtitle {
|
||||
margin-top: 51px;
|
||||
margin-top: 23px;
|
||||
color: #455363;
|
||||
font-size: 72px;
|
||||
font-size: 40px;
|
||||
}
|
||||
|
||||
// 添加一个通用的溢出控制类
|
||||
|
||||
@ -32,14 +32,14 @@
|
||||
<section className="relative pb-[900px]">
|
||||
<div class="absolute top-[0px] right-[0px]">
|
||||
<img
|
||||
src="@/assets/image/businessintroduction/768/bg-6.png"
|
||||
src="@/assets/image/businessintroduction/bg-6.png"
|
||||
class="w-[1652px] h-[1865px]"
|
||||
/>
|
||||
</div>
|
||||
|
||||
<div class="pt-[718px]">
|
||||
<div
|
||||
class="w-full title ml-[188px]"
|
||||
class="w-[640px] title ml-[188px]"
|
||||
:ref="
|
||||
(el) => {
|
||||
moveRefs[0].value = el;
|
||||
@ -55,7 +55,7 @@
|
||||
moveRefs[1].value = el;
|
||||
}
|
||||
"
|
||||
class="text-[35px] text-[#8B59F7] w-[958px] ml-[188px] mt-[55px]"
|
||||
class="w-full text-[35px] text-[#8B59F7] w-[958px] ml-[188px] mt-[55px]"
|
||||
>
|
||||
深度融合前沿 AI
|
||||
技术与短视频平台的独特优势，率先开启探索之旅，勇立潮头，领航文创领域踏入前所未有的崭新视界
|
||||
@ -71,13 +71,13 @@
|
||||
class="absolute bottom-[-290px] right-[0px]"
|
||||
>
|
||||
<img
|
||||
src="@/assets/image/businessintroduction/768/bg-2.png"
|
||||
src="@/assets/image/businessintroduction/bg-2.png"
|
||||
class="w-[960px] h-[955px]"
|
||||
/>
|
||||
</div>
|
||||
<div class="absolute bottom-[-660px] left-[0px]">
|
||||
<img
|
||||
src="@/assets/image/businessintroduction/768/bg-7.png"
|
||||
src="@/assets/image/businessintroduction/bg-7.png"
|
||||
class="w-[842px] h-[1798px]"
|
||||
/>
|
||||
</div>
|
||||
@ -123,7 +123,7 @@
|
||||
<div class="font-medium">
|
||||
<img
|
||||
class="w-[40px] h-[40px] mr-[25px]"
|
||||
src="@/assets/image/businessintroduction/768/icon-y.png"
|
||||
src="@/assets/image/businessintroduction/icon-y.png"
|
||||
/>
|
||||
|
||||
文艺价值蒙尘
|
||||
@ -143,7 +143,7 @@
|
||||
<div class="font-medium">
|
||||
<img
|
||||
class="w-[40px] h-[40px] mr-[25px]"
|
||||
src="@/assets/image/businessintroduction/768/icon-y.png"
|
||||
src="@/assets/image/businessintroduction/icon-y.png"
|
||||
/>
|
||||
|
||||
推广途径困局
|
||||
@ -163,7 +163,7 @@
|
||||
<div class="font-medium">
|
||||
<img
|
||||
class="w-[40px] h-[40px] mr-[25px]"
|
||||
src="@/assets/image/businessintroduction/768/icon-y.png"
|
||||
src="@/assets/image/businessintroduction/icon-y.png"
|
||||
/>
|
||||
|
||||
宣传单一致贫
|
||||
@ -183,7 +183,7 @@
|
||||
<div class="font-medium">
|
||||
<img
|
||||
class="w-[40px] h-[40px] mr-[25px]"
|
||||
src="@/assets/image/businessintroduction/768/icon-y.png"
|
||||
src="@/assets/image/businessintroduction/icon-y.png"
|
||||
/>
|
||||
|
||||
传统营销掣肘
|
||||
@ -237,13 +237,13 @@
|
||||
}
|
||||
"
|
||||
class="w-[1625px] h-[1038px]"
|
||||
src="@/assets/image/businessintroduction/768/imageshow-2.png"
|
||||
src="@/assets/image/businessintroduction/imageshow-2.png"
|
||||
/>
|
||||
</div>
|
||||
<div class="w-full px-[188px]">
|
||||
<img
|
||||
class="w-[161px] h-[120px]"
|
||||
src="@/assets/image/businessintroduction/768/icon-l.png"
|
||||
src="@/assets/image/businessintroduction/icon-l.png"
|
||||
/>
|
||||
|
||||
<div
|
||||
@ -266,7 +266,7 @@
|
||||
<div class="w-full px-[188px] mt-[170px]">
|
||||
<img
|
||||
class="w-[145px] h-[129px]"
|
||||
src="@/assets/image/businessintroduction/768/icon-k.png"
|
||||
src="@/assets/image/businessintroduction/icon-k.png"
|
||||
/>
|
||||
|
||||
<div
|
||||
@ -288,7 +288,7 @@
|
||||
<div class="w-full px-[188px] mt-[160px] mb-[250px]">
|
||||
<img
|
||||
class="w-[138px] h-[135px]"
|
||||
src="@/assets/image/businessintroduction/768/icon-h.png"
|
||||
src="@/assets/image/businessintroduction/icon-h.png"
|
||||
/>
|
||||
|
||||
<div
|
||||
@ -358,7 +358,7 @@
|
||||
}
|
||||
"
|
||||
class="w-[1625px] h-[1038px]"
|
||||
src="@/assets/image/businessintroduction/768/imageshow-1.png"
|
||||
src="@/assets/image/businessintroduction/imageshow-1.png"
|
||||
/>
|
||||
</div>
|
||||
</div>
|
||||
@ -414,12 +414,12 @@
|
||||
|
||||
<div class="absolute bottom-[262px] right-[0px]">
|
||||
<img
|
||||
src="@/assets/image/businessintroduction/768/bg-5.png"
|
||||
src="@/assets/image/businessintroduction/bg-5.png"
|
||||
class="h-[361px]"
|
||||
/>
|
||||
</div>
|
||||
</section>
|
||||
<section>
|
||||
<section class="">
|
||||
<div class="flex flex-wrap justify-center">
|
||||
<div class="w-full px-[188px] mt-[10px]">
|
||||
<div class="text-[#8B59F7] text-[55px] font-medium">
|
||||
@ -460,7 +460,7 @@
|
||||
<div class="w-full">
|
||||
<img
|
||||
class="w-[139px] h-[135px]"
|
||||
src="@/assets/image/businessintroduction/768/icon-s.png"
|
||||
src="@/assets/image/businessintroduction/icon-s.png"
|
||||
/>
|
||||
</div>
|
||||
<div
|
||||
@ -485,7 +485,7 @@
|
||||
<div class="w-full">
|
||||
<img
|
||||
class="w-[132px] h-[135px] mr-[25px]"
|
||||
src="@/assets/image/businessintroduction/768/icon-c.png"
|
||||
src="@/assets/image/businessintroduction/icon-c.png"
|
||||
/>
|
||||
</div>
|
||||
|
||||
@ -590,9 +590,9 @@ const { currentTab } = useHome();
|
||||
let ctx;
|
||||
|
||||
// 导入图片
|
||||
import imageshow3 from "@/assets/image/businessintroduction/768/imageshow-3.png";
|
||||
import imageshow4 from "@/assets/image/businessintroduction/768/imageshow-4.png";
|
||||
import imageshow5 from "@/assets/image/businessintroduction/768/imageshow-5.png";
|
||||
import imageshow3 from "@/assets/image/businessintroduction/imageshow-3.png";
|
||||
import imageshow4 from "@/assets/image/businessintroduction/imageshow-4.png";
|
||||
import imageshow5 from "@/assets/image/businessintroduction/imageshow-5.png";
|
||||
|
||||
const state = reactive({
|
||||
marqueeArr: [
|
||||
@ -770,21 +770,21 @@ const goToSection = (i) => {
|
||||
|
||||
.section-first {
|
||||
width: 100%;
|
||||
background: url("@/assets/image/businessintroduction/768/bg-6.png");
|
||||
background: url("@/assets/image/businessintroduction/bg-6.png");
|
||||
background-size: cover;
|
||||
background-position: center;
|
||||
background-repeat: no-repeat;
|
||||
}
|
||||
.section-sec {
|
||||
z-index: 2;
|
||||
background: url("@/assets/image/businessintroduction/768/bg-12.png");
|
||||
background: url("@/assets/image/businessintroduction/bg-12.png");
|
||||
background-size: cover;
|
||||
background-position: top-center;
|
||||
background-repeat: no-repeat;
|
||||
}
|
||||
|
||||
.section-five {
|
||||
background: url("@/assets/image/businessintroduction/768/bg-1.png");
|
||||
background: url("@/assets/image/businessintroduction/bg-1.png");
|
||||
background-size: cover;
|
||||
background-position: center;
|
||||
background-repeat: no-repeat;
|
||||
|
||||
@ -30,9 +30,11 @@
|
||||
</header>
|
||||
<main>
|
||||
<section style="background: #ffffff" className="relative">
|
||||
<div class="relative section-first h-[3990px] box-contain pt-[2300px]">
|
||||
<div
|
||||
class="relative section-first h-[1524px] box-contain pt-[718px] mb-[400px]"
|
||||
>
|
||||
<div
|
||||
class="w-full title ml-[184px]"
|
||||
class="w-[640px] title ml-[188px]"
|
||||
:ref="
|
||||
(el) => {
|
||||
moveRefs[0].value = el;
|
||||
@ -48,43 +50,40 @@
|
||||
moveRefs[1].value = el;
|
||||
}
|
||||
"
|
||||
class="text-[51px] text-[#8B59F7] w-[1413px] ml-[184px] mt-[61px]"
|
||||
class="w-full text-[35px] text-[#8B59F7] w-[958px] ml-[188px] mt-[55px]"
|
||||
>
|
||||
FiEE立志成为文艺创作全周期的掌舵人，深度参与从灵感初绽、作品打磨完成，到市场推广宣传、文化广泛传播的每一处关键节点
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div ref="moveRef3" class="absolute top-[686px] left-[266px]">
|
||||
<img
|
||||
class="w-[1140px]"
|
||||
src="@/assets/image/companyprofil/375/image-q.png"
|
||||
/>
|
||||
<div ref="moveRef3" class="absolute top-[603px] right-[63px]">
|
||||
<img
|
||||
class="w-[949px] h-[574px]"
|
||||
src="@/assets/image/companyprofil/image-q.png"
|
||||
/>
|
||||
</div>
|
||||
</div>
|
||||
<div class="w-[1920px] absolute bottom-[-160px]">
|
||||
<img
|
||||
src="@/assets/image/companyprofil/375/icon-lang.png"
|
||||
alt="logo"
|
||||
/>
|
||||
<div class="w-[1920px] absolute bottom-[-660px]">
|
||||
<img src="@/assets/image/companyprofil/icon-lang.png" alt="logo" />
|
||||
</div>
|
||||
</section>
|
||||
|
||||
<section style="background: #f8f9ff">
|
||||
<div class="flex flex-wrap justify-center">
|
||||
<div class="w-full px-[184px] mt-[400px]">
|
||||
<div class="text-[#8B59F7] text-[72px]">公司介绍</div>
|
||||
<div class="content w-full px-[188px] mt-[400px]">
|
||||
<div class="text-[#8B59F7] text-[40px]">公司介绍</div>
|
||||
</div>
|
||||
<div class="w-full title px-[179px] mt-[87px]">
|
||||
<div class="w-full title mt-[58px] px-[188px]">
|
||||
<div>独树一帜</div>
|
||||
<div>全周期价值赋能领航者</div>
|
||||
</div>
|
||||
<div class="w-full px-[184px] mt-[140px]">
|
||||
<div class="w-full px-[188px] mt-[140px]">
|
||||
<div
|
||||
:ref="
|
||||
(el) => {
|
||||
moveRefs[2].value = el;
|
||||
}
|
||||
"
|
||||
class="text-[#455363] text-[72px] w-[1413px]"
|
||||
class="text-[#455363] text-[40px] w-[1345px]"
|
||||
>
|
||||
FiEE彻底打破传统单一服务机构的局限，以行业变革者的姿态，深度融合前沿技术与丰富多元的资源，精心构建起一套贯穿文艺创作从萌芽构思到辉煌绽放全流程的
|
||||
"全周期" 价值赋能体系。
|
||||
@ -95,7 +94,7 @@
|
||||
moveRefs[3].value = el;
|
||||
}
|
||||
"
|
||||
class="mt-[60px] text-[#455363] text-[72px] w-[1413px]"
|
||||
class="mt-[60px] text-[#455363] text-[40px] w-[1345px]"
|
||||
>
|
||||
无论你是刚刚踏入文艺殿堂、怀揣梦想的创作新人，还是在文艺道路上摸爬滚打、渴望突破创作瓶颈、攀登更高文艺巅峰的成熟文艺工作者，FiEE都将成为你最坚实的伙伴，一路贴心陪伴，为你的文艺征途遮风挡雨，指引前行的方向。
|
||||
</div>
|
||||
@ -106,7 +105,7 @@
|
||||
moveRefs[4].value = el;
|
||||
}
|
||||
"
|
||||
class="mt-[287px] mb-[512px] overflow-hidden"
|
||||
class="mt-[140px] mb-[235px] overflow-hidden"
|
||||
>
|
||||
<img
|
||||
:ref="
|
||||
@ -115,7 +114,7 @@
|
||||
}
|
||||
"
|
||||
class="w-[1625px] h-[1038px]"
|
||||
src="@/assets/image/companyprofil/375/imageshow-2.png"
|
||||
src="@/assets/image/companyprofil/imageshow-2.png"
|
||||
/>
|
||||
</div>
|
||||
</div>
|
||||
@ -123,99 +122,89 @@
|
||||
|
||||
<section class="relative" style="background: #fff">
|
||||
<div class="flex flex-wrap justify-center">
|
||||
<div class="w-full px-[184px] mt-[451px]">
|
||||
<div class="text-[#8B59F7] text-[72px]">团队介绍</div>
|
||||
<div class="content w-full px-[188px] mt-[113px]">
|
||||
<div class="text-[#8B59F7] text-[40px]">团队介绍</div>
|
||||
</div>
|
||||
<div class="w-full title px-[179px] mt-[87px]">
|
||||
<div class="w-full title mt-[58px] px-[188px]">
|
||||
<div>汇聚精英</div>
|
||||
<div>点燃文艺创变引擎</div>
|
||||
</div>
|
||||
<div class="w-full px-[184px] mt-[140px]">
|
||||
<div class="w-full px-[188px] mt-[140px]">
|
||||
<div
|
||||
:ref="
|
||||
(el) => {
|
||||
moveRefs[6].value = el;
|
||||
}
|
||||
"
|
||||
class="text-[#455363] text-[72px] w-[1413px] subTitle"
|
||||
class="text-[#455363] text-[40px] w-[1345px] leading-[60px]"
|
||||
>
|
||||
FiEE团队由运营专家、技术精英及国际顾问组成，提供从内容策划到全球推广的全方位支持。通过跨界合作与资源整合，FiEE突破传统边界，探索文艺新表达。依托前沿技术与精准营销，助力作品实现商业价值与社会影响力的双重提升，为文艺繁荣注入持久动力。
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div class="mt-[287px] mb-[399px]">
|
||||
<div class="mt-[143px] mb-[188px] overflow-hidden">
|
||||
<img
|
||||
:ref="
|
||||
(el) => {
|
||||
moveRefs[7].value = el;
|
||||
}
|
||||
"
|
||||
class="w-[1715px]"
|
||||
src="@/assets/image/companyprofil/375/imageshow-3.png"
|
||||
class="w-[1625px] h-[1038px]"
|
||||
src="@/assets/image/companyprofil/imageshow-3.png"
|
||||
/>
|
||||
</div>
|
||||
|
||||
<div class="w-full px-[184px]">
|
||||
<div class="w-full px-[188px]">
|
||||
<img
|
||||
class="w-[229px] h-[229px]"
|
||||
src="@/assets/image/companyprofil/375/icon-lun.png"
|
||||
class="w-[145px] h-[145px]"
|
||||
src="@/assets/image/companyprofil/icon-lun.png"
|
||||
/>
|
||||
|
||||
<div
|
||||
class="w-full mt-[102px] text-[#10253E] text-[82px] font-semibold"
|
||||
>
|
||||
<div class="w-full mt-[50px] text-[#10253E] text-[45px]">
|
||||
纵横全球 多元领航
|
||||
</div>
|
||||
<div class="mt-[87px] text-[#455363] text-[72px] w-[1498px]">
|
||||
<div class="mt-[38px] text-[#455363] text-[40px] w-[1345px]">
|
||||
海外精准营销，铺设多元渠道，塑造国际品牌。智能管理
|
||||
多语言平台，提供本地化服务。
|
||||
</div>
|
||||
</div>
|
||||
<div class="w-full px-[184px] mt-[410px]">
|
||||
<div class="w-full px-[188px] mt-[170px]">
|
||||
<img
|
||||
class="w-[229px] h-[196px]"
|
||||
src="@/assets/image/companyprofil/375/icon-love.png"
|
||||
class="w-[145px] h-[145px]"
|
||||
src="@/assets/image/companyprofil/icon-love.png"
|
||||
/>
|
||||
|
||||
<div
|
||||
class="w-full mt-[133px] text-[#10253E] text-[82px] font-semibold"
|
||||
>
|
||||
<div class="w-full mt-[50px] text-[#10253E] text-[45px]">
|
||||
深耕粉丝 构筑生态
|
||||
</div>
|
||||
<div class="mt-[87px] text-[#455363] text-[72px] w-[1498px]">
|
||||
<div class="mt-[38px] text-[#455363] text-[40px] w-[1345px]">
|
||||
社区精细运营，提供多元增值服务。升级社群管理工具，精准触达用户。创新激励机制，开发特色衍生周边。
|
||||
</div>
|
||||
</div>
|
||||
<div class="w-full px-[184px] mt-[389px] mb-[250px]">
|
||||
<div class="w-full px-[188px] mt-[160px] mb-[250px]">
|
||||
<img
|
||||
class="w-[229px] h-[222px]"
|
||||
src="@/assets/image/companyprofil/375/icon-p.png"
|
||||
class="w-[145px] h-[145px]"
|
||||
src="@/assets/image/companyprofil/icon-p.png"
|
||||
/>
|
||||
|
||||
<div
|
||||
class="w-full mt-[123px] text-[#10253E] text-[82px] font-semibold"
|
||||
>
|
||||
<div class="w-full mt-[50px] text-[#10253E] text-[45px]">
|
||||
广纳贤才 团队进阶
|
||||
</div>
|
||||
<div
|
||||
class="mt-[87px] mb-[100px] text-[#455363] text-[72px] w-[1498px]"
|
||||
>
|
||||
<div class="mt-[38px] text-[#455363] text-[40px] w-[1345px]">
|
||||
广纳技术、营销精英，注入创新活力。强化内部培训，优化组织架构。引入先进理念，提升管理与服务效能。
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div class="icon-langmul">
|
||||
<img
|
||||
class="w-[1205px]"
|
||||
src="@/assets/image/companyprofil/375/icon-langmul.png"
|
||||
class="w-[846px] h-[216px]"
|
||||
src="@/assets/image/companyprofil/icon-langmul.png"
|
||||
/>
|
||||
</div>
|
||||
</div>
|
||||
</section>
|
||||
<section class="section-four">
|
||||
<div class="flex flex-wrap justify-center">
|
||||
<div class="w-full px-[184px] mt-[445px]">
|
||||
<div class="text-[#8B59F7] text-[72px]">卓越建树</div>
|
||||
<div class="content w-full px-[188px] mt-[458px]">
|
||||
<div class="text-[#8B59F7] text-[40px]">卓越建树</div>
|
||||
</div>
|
||||
<div
|
||||
:ref="
|
||||
@ -223,19 +212,19 @@
|
||||
moveRefs[8].value = el;
|
||||
}
|
||||
"
|
||||
class="w-full title px-[179px] mt-[87px]"
|
||||
class="w-full title mt-[58px] px-[188px]"
|
||||
>
|
||||
<div>以开拓之姿</div>
|
||||
<div>登文艺之巅</div>
|
||||
</div>
|
||||
<div class="w-full px-[184px] mt-[159px]">
|
||||
<div class="w-full px-[188px] mt-[140px]">
|
||||
<div
|
||||
:ref="
|
||||
(el) => {
|
||||
moveRefs[9].value = el;
|
||||
}
|
||||
"
|
||||
class="text-[#455363] text-[72px] w-[1413px]"
|
||||
class="text-[#455363] text-[40px] w-[1345px]"
|
||||
>
|
||||
长期深耕文艺领域，FiEE持续拓展业务版图，积累了深厚的行业资源，搭建起广泛的合作网络。目前已与多个全球热门自媒体平台深度携手，从多维度助力文艺创作者闪耀国际舞台，绽放独有的艺术光芒。
|
||||
</div>
|
||||
@ -246,7 +235,7 @@
|
||||
moveRefs[10].value = el;
|
||||
}
|
||||
"
|
||||
class="w-full mt-[532px] px-[184px] text-[92px] font-semibold"
|
||||
class="w-full mt-[260px] px-[188px] text-[55px] font-semibold"
|
||||
>
|
||||
<div>权威资质认证</div>
|
||||
<div>铸就文艺事业坚实根基</div>
|
||||
@ -257,9 +246,9 @@
|
||||
moveRefs[11].value = el;
|
||||
}
|
||||
"
|
||||
class="w-full px-[184px] mt-[60px]"
|
||||
class="w-full px-[188px] mt-[60px]"
|
||||
>
|
||||
<div class="text-[#455363] text-[72px] w-[1413px]">
|
||||
<div class="text-[#455363] text-[40px] w-[1345px]">
|
||||
FiEE提供专业且权威的资质认证服务，助力文艺创作者获取行业广泛认可的资质。这不仅能让文艺创作者的作品价值得到显著提升，更能使文艺创作者在竞争白热化的艺术市场中崭露头角，大幅增强文艺工作者的市场竞争力，为文艺创作者的事业铺就稳固基石。
|
||||
</div>
|
||||
</div>
|
||||
@ -269,11 +258,11 @@
|
||||
moveRefs[12].value = el;
|
||||
}
|
||||
"
|
||||
class="mt-[287px] overflow-hidden"
|
||||
class="mt-[120px] mb-[260px] overflow-hidden"
|
||||
>
|
||||
<img
|
||||
class="w-[1625px] h-[1038px]"
|
||||
src="@/assets/image/companyprofil/375/imageshow-4.png"
|
||||
src="@/assets/image/companyprofil/imageshow-4.png"
|
||||
/>
|
||||
</div>
|
||||
<div
|
||||
@ -282,19 +271,19 @@
|
||||
moveRefs[13].value = el;
|
||||
}
|
||||
"
|
||||
class="w-full mt-[532px] px-[184px] text-[92px] font-semibold"
|
||||
class="w-full px-[188px] text-[55px] font-semibold"
|
||||
>
|
||||
<div>全球平台矩阵</div>
|
||||
<div>拓展文艺传播边界</div>
|
||||
</div>
|
||||
<div class="w-full px-[184px] mt-[128px]">
|
||||
<div class="w-full px-[188px] mt-[60px]">
|
||||
<div
|
||||
:ref="
|
||||
(el) => {
|
||||
moveRefs[14].value = el;
|
||||
}
|
||||
"
|
||||
class="text-[#455363] text-[72px] w-[1413px]"
|
||||
class="text-[#455363] text-[40px] w-[1345px]"
|
||||
>
|
||||
<div>
|
||||
FiEE凭借深厚的行业资源和广泛的合作网络，与超过 30
|
||||
@ -305,7 +294,7 @@
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<div class="mt-[287px] mb-[364px] overflow-hidden">
|
||||
<div class="mt-[120px] mb-[220px] overflow-hidden">
|
||||
<img
|
||||
:ref="
|
||||
(el) => {
|
||||
@ -313,15 +302,15 @@
|
||||
}
|
||||
"
|
||||
class="w-[1625px] h-[1038px]"
|
||||
src="@/assets/image/companyprofil/375/imageshow-5.png"
|
||||
src="@/assets/image/companyprofil/imageshow-5.png"
|
||||
/>
|
||||
</div>
|
||||
</div>
|
||||
</section>
|
||||
<section style="background: #fff">
|
||||
<div class="flex flex-wrap justify-center">
|
||||
<div class="w-full px-[184px] mt-[364px]">
|
||||
<div class="text-[#8B59F7] text-[72px]">聚焦FiEE前沿动态</div>
|
||||
<div class="content w-full px-[188px] mt-[245px]">
|
||||
<div class="text-[#8B59F7] text-[40px]">聚焦FiEE前沿动态</div>
|
||||
</div>
|
||||
<div
|
||||
:ref="
|
||||
@ -329,41 +318,41 @@
|
||||
moveRefs[16].value = el;
|
||||
}
|
||||
"
|
||||
class="w-full title px-[179px] mt-[87px]"
|
||||
class="w-full title mt-[58px] px-[188px]"
|
||||
>
|
||||
<div>洞察趋势</div>
|
||||
<div>点亮文艺前行灯塔</div>
|
||||
</div>
|
||||
<div class="w-full px-[184px] mt-[159px]">
|
||||
<div class="w-full px-[188px] mt-[140px]">
|
||||
<div
|
||||
:ref="
|
||||
(el) => {
|
||||
moveRefs[17].value = el;
|
||||
}
|
||||
"
|
||||
class="text-[#455363] text-[72px] w-[1413px]"
|
||||
class="text-[#455363] text-[40px] w-[1345px]"
|
||||
>
|
||||
FIEE始终扎根文艺领域，时刻紧跟全球艺术发展趋势。通过深度剖析案例、开展跨界研讨，探索文艺与科技、商业的深度融合，为文艺事业未来发展提供前瞻性洞察与灵感启迪。
|
||||
</div>
|
||||
</div>
|
||||
<div class="w-full mt-[200px] flex flex-wrap justify-end">
|
||||
<div class="w-full mt-[143px] flex flex-wrap justify-end">
|
||||
<div class="flex flex-wrap">
|
||||
<div class="arrow-btn" @click="handlePrev">
|
||||
<img
|
||||
class="w-[195px] h-[195px]"
|
||||
src="@/assets/image/companyprofil/375/icon-left.png"
|
||||
class="w-[95px] h-[95px]"
|
||||
src="@/assets/image/companyprofil/icon-left.png"
|
||||
/>
|
||||
</div>
|
||||
<div class="arrow-btn ml-[128px] mr-[133px]" @click="handleNext">
|
||||
<div class="arrow-btn ml-[63px] mr-[230px]" @click="handleNext">
|
||||
<img
|
||||
class="w-[195px] h-[195px]"
|
||||
src="@/assets/image/companyprofil/375/icon-right.png"
|
||||
class="w-[95px] h-[95px]"
|
||||
src="@/assets/image/companyprofil/icon-right.png"
|
||||
/>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<div
|
||||
class="mt-[148px] mb-[246px] carousel-container px-[80px] py-[40px]"
|
||||
class="mt-[73px] mb-[253px] carousel-container px-[80px] py-[40px]"
|
||||
>
|
||||
<div
|
||||
ref="carouselTrack"
|
||||
@ -382,7 +371,7 @@
|
||||
<div
|
||||
v-for="(item, idx) in getVisibleItems()"
|
||||
:key="idx"
|
||||
class="carousel-item mr-[120px]"
|
||||
class="carousel-item"
|
||||
@click="handleCarouselClick(item, $event)"
|
||||
>
|
||||
<img class="carousel-image" :src="item.imgUrl" />
|
||||
@ -391,7 +380,7 @@
|
||||
<div>{{ item.title }}</div>
|
||||
</div>
|
||||
<div class="carousel-subtitle">
|
||||
{{ item.subTitle }}
|
||||
<div>{{ item.subTitle }}</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
@ -405,7 +394,7 @@
|
||||
className="flex flex-wrap justify-center"
|
||||
>
|
||||
<img
|
||||
class="w-[891px] h-[87px] mt-[61px] mb-[56px]"
|
||||
class="w-[580px] h-[55px] my-[85px]"
|
||||
src="@/assets/image/image-footer.png"
|
||||
alt="logo"
|
||||
/>
|
||||
@ -438,11 +427,11 @@ const { currentTab } = useHome();
|
||||
let ctx;
|
||||
|
||||
// 导入图片
|
||||
import carouselShow1 from "@/assets/image/companyprofil/375/carouselShow-1.png";
|
||||
import carouselShow2 from "@/assets/image/companyprofil/375/carouselShow-2.png";
|
||||
import carouselShow3 from "@/assets/image/companyprofil/375/carouselShow-3.png";
|
||||
import carouselShow4 from "@/assets/image/companyprofil/375/carouselShow-4.png";
|
||||
import carouselShow5 from "@/assets/image/companyprofil/375/carouselShow-5.png";
|
||||
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: [
|
||||
@ -485,7 +474,6 @@ const state = reactive({
|
||||
|
||||
const carouselTrack = ref(null);
|
||||
const currentIndex = ref(0);
|
||||
const isTransitioning = ref(false);
|
||||
|
||||
const getVisibleItems = () => {
|
||||
const items = state.marqueeArr;
|
||||
@ -504,15 +492,8 @@ const getSlideOffset = () => {
|
||||
const itemMargin = parseInt(window.getComputedStyle(firstItem).marginRight);
|
||||
const totalWidth = itemWidth + itemMargin;
|
||||
|
||||
const len = state.marqueeArr.length;
|
||||
if (currentIndex.value <= -len) {
|
||||
currentIndex.value = -currentIndex.value % len;
|
||||
} else if (currentIndex.value >= len) {
|
||||
currentIndex.value = currentIndex.value % len;
|
||||
}
|
||||
|
||||
// 初始偏移一组数据的长度
|
||||
const initialOffset = len * totalWidth + 8;
|
||||
// 初始偏移一组数据的长度，从而从中间组开始显示，并增加40px的额外偏移
|
||||
const initialOffset = state.marqueeArr.length * totalWidth + 32;
|
||||
return initialOffset + currentIndex.value * totalWidth;
|
||||
};
|
||||
|
||||
@ -525,6 +506,7 @@ const handleResize = () => {
|
||||
|
||||
// 监听窗口大小变化
|
||||
onMounted(() => {
|
||||
console.log(moveRefs.value);
|
||||
ctx = gsap.context(() => {
|
||||
moveRefs.value.forEach((moveRef, index) => {
|
||||
if (moveRef.value) {
|
||||
@ -606,48 +588,38 @@ const goToSection = (i) => {
|
||||
|
||||
// 向前滑动
|
||||
const handlePrev = () => {
|
||||
if (isTransitioning.value) return;
|
||||
isTransitioning.value = true;
|
||||
|
||||
if (!carouselTrack.value) return;
|
||||
|
||||
carouselTrack.value.style.transition = "transform 0.5s ease-in-out";
|
||||
currentIndex.value--;
|
||||
|
||||
// 如果滑到第一组的开头，跳转到第二组的末尾
|
||||
if (currentIndex.value < -state.marqueeArr.length) {
|
||||
setTimeout(() => {
|
||||
carouselTrack.value.style.transition = "none";
|
||||
currentIndex.value = -1;
|
||||
carouselTrack.value.offsetHeight;
|
||||
carouselTrack.value.style.transition = "transform 0.5s ease-in-out";
|
||||
isTransitioning.value = false;
|
||||
}, 500);
|
||||
} else {
|
||||
setTimeout(() => {
|
||||
isTransitioning.value = false;
|
||||
nextTick(() => {
|
||||
carouselTrack.value.style.transition = "transform 0.5s ease-in-out";
|
||||
});
|
||||
}, 500);
|
||||
}
|
||||
};
|
||||
|
||||
// 向后滑动
|
||||
const handleNext = () => {
|
||||
if (isTransitioning.value) return;
|
||||
isTransitioning.value = true;
|
||||
|
||||
if (!carouselTrack.value) return;
|
||||
|
||||
carouselTrack.value.style.transition = "transform 0.5s ease-in-out";
|
||||
currentIndex.value++;
|
||||
|
||||
// 如果滑到第三组的末尾，跳转到第二组的开头
|
||||
if (currentIndex.value >= state.marqueeArr.length) {
|
||||
setTimeout(() => {
|
||||
carouselTrack.value.style.transition = "none";
|
||||
currentIndex.value = 0;
|
||||
carouselTrack.value.offsetHeight;
|
||||
carouselTrack.value.style.transition = "transform 0.5s ease-in-out";
|
||||
isTransitioning.value = false;
|
||||
}, 500);
|
||||
} else {
|
||||
setTimeout(() => {
|
||||
isTransitioning.value = false;
|
||||
nextTick(() => {
|
||||
carouselTrack.value.style.transition = "transform 0.5s ease-in-out";
|
||||
});
|
||||
}, 500);
|
||||
}
|
||||
};
|
||||
@ -724,6 +696,7 @@ const handleCarouselClick = (item, event) => {
|
||||
if (event.type === "click") {
|
||||
event.stopPropagation(); // 阻止事件传播
|
||||
event.preventDefault(); // 阻止默认行为
|
||||
console.log(item);
|
||||
router.push({
|
||||
path: "/companyprofildetail",
|
||||
query: {
|
||||
@ -743,7 +716,7 @@ const handleCarouselClick = (item, event) => {
|
||||
|
||||
.header {
|
||||
width: 100%;
|
||||
height: 260px;
|
||||
height: 220px;
|
||||
position: fixed;
|
||||
z-index: 10;
|
||||
top: 0;
|
||||
@ -761,7 +734,7 @@ const handleCarouselClick = (item, event) => {
|
||||
|
||||
.tabs {
|
||||
display: flex;
|
||||
gap: 128px;
|
||||
gap: 32px;
|
||||
margin-right: 32px;
|
||||
}
|
||||
|
||||
@ -782,33 +755,29 @@ const handleCarouselClick = (item, event) => {
|
||||
}
|
||||
|
||||
.title {
|
||||
font-size: 113px;
|
||||
font-size: 85px;
|
||||
font-weight: 600;
|
||||
color: #10253e;
|
||||
line-height: 143px;
|
||||
}
|
||||
.subTitle {
|
||||
line-height: 102px;
|
||||
}
|
||||
.section-first {
|
||||
background: url("@/assets/image/companyprofil/375/image-x.png");
|
||||
background: url("@/assets/image/companyprofil/image-x.png");
|
||||
background-size: cover;
|
||||
background-position: center;
|
||||
background-repeat: no-repeat;
|
||||
}
|
||||
.section-four {
|
||||
background: url("@/assets/image/companyprofil/375/bg-3.png");
|
||||
background: url("@/assets/image/companyprofil/bg-3.png");
|
||||
background-size: cover;
|
||||
background-position: center;
|
||||
background-repeat: no-repeat;
|
||||
}
|
||||
.icon-langmul {
|
||||
position: absolute;
|
||||
bottom: -200px;
|
||||
bottom: -80px;
|
||||
right: 0;
|
||||
}
|
||||
.carousel-container {
|
||||
width: 96%;
|
||||
overflow: hidden;
|
||||
position: relative;
|
||||
}
|
||||
|
||||
@ -828,28 +797,29 @@ const handleCarouselClick = (item, event) => {
|
||||
}
|
||||
|
||||
.carousel-item {
|
||||
width: 1710px;
|
||||
width: 785px;
|
||||
margin-right: 28px;
|
||||
flex: 0 0 auto;
|
||||
display: block;
|
||||
padding: 46px 36px 118px 51px;
|
||||
border-radius: 61px;
|
||||
box-shadow: 0 15px 72px 5px rgba(0, 0, 0, 0.16);
|
||||
padding: 23px 20px 40px;
|
||||
border-radius: 30px;
|
||||
box-shadow: 0 8px 35px 3px rgba(0, 0, 0, 0.16);
|
||||
}
|
||||
|
||||
.carousel-image {
|
||||
width: 1623px;
|
||||
height: 1152px;
|
||||
width: 748px;
|
||||
height: 563px;
|
||||
object-fit: cover;
|
||||
display: block;
|
||||
}
|
||||
|
||||
.carousel-content {
|
||||
padding: 0 20px 0 60px;
|
||||
margin-top: 87px;
|
||||
margin-top: 38px;
|
||||
}
|
||||
|
||||
.carousel-title {
|
||||
font-size: 92px;
|
||||
font-size: 50px;
|
||||
font-weight: 500;
|
||||
display: -webkit-box;
|
||||
-webkit-line-clamp: 1;
|
||||
@ -861,19 +831,30 @@ const handleCarouselClick = (item, event) => {
|
||||
}
|
||||
|
||||
.carousel-subtitle {
|
||||
margin-top: 51px;
|
||||
margin-top: 23px;
|
||||
color: #455363;
|
||||
font-size: 40px;
|
||||
display: -webkit-box;
|
||||
-webkit-line-clamp: 4;
|
||||
-webkit-line-clamp: 5;
|
||||
-webkit-box-orient: vertical;
|
||||
overflow: hidden;
|
||||
text-overflow: ellipsis;
|
||||
line-height: 102px;
|
||||
max-height: calc(1.5em * 4);
|
||||
line-height: 1.5;
|
||||
max-height: calc(1.5em * 5);
|
||||
}
|
||||
|
||||
// 添加一个通用的溢出控制类
|
||||
.overflow-hidden {
|
||||
overflow: hidden;
|
||||
}
|
||||
|
||||
// 为所有可能需要动画的容器添加溢出隐藏
|
||||
[ref*="moveRef"] {
|
||||
position: relative;
|
||||
}
|
||||
|
||||
// 标题容器也需要控制溢出
|
||||
.title {
|
||||
position: relative;
|
||||
}
|
||||
</style>
|
||||
|
||||
@ -50,7 +50,7 @@
|
||||
moveRefs[1].value = el;
|
||||
}
|
||||
"
|
||||
class="text-[35px] text-[#8B59F7] w-[958px] ml-[188px] mt-[55px]"
|
||||
class="w-full text-[35px] text-[#8B59F7] w-[958px] ml-[188px] mt-[55px]"
|
||||
>
|
||||
FiEE立志成为文艺创作全周期的掌舵人，深度参与从灵感初绽、作品打磨完成，到市场推广宣传、文化广泛传播的每一处关键节点
|
||||
</div>
|
||||
@ -58,21 +58,18 @@
|
||||
<div ref="moveRef3" class="absolute top-[603px] right-[63px]">
|
||||
<img
|
||||
class="w-[949px] h-[574px]"
|
||||
src="@/assets/image/companyprofil/768/image-q.png"
|
||||
src="@/assets/image/companyprofil/image-q.png"
|
||||
/>
|
||||
</div>
|
||||
</div>
|
||||
<div class="w-[1920px] absolute bottom-[-660px]">
|
||||
<img
|
||||
src="@/assets/image/companyprofil/768/icon-lang.png"
|
||||
alt="logo"
|
||||
/>
|
||||
<img src="@/assets/image/companyprofil/icon-lang.png" alt="logo" />
|
||||
</div>
|
||||
</section>
|
||||
|
||||
<section style="background: #f8f9ff">
|
||||
<div class="flex flex-wrap justify-center">
|
||||
<div class="w-full px-[188px] mt-[400px]">
|
||||
<div class="content w-full px-[188px] mt-[400px]">
|
||||
<div class="text-[#8B59F7] text-[40px]">公司介绍</div>
|
||||
</div>
|
||||
<div class="w-full title mt-[58px] px-[188px]">
|
||||
@ -117,7 +114,7 @@
|
||||
}
|
||||
"
|
||||
class="w-[1625px] h-[1038px]"
|
||||
src="@/assets/image/companyprofil/768/imageshow-2.png"
|
||||
src="@/assets/image/companyprofil/imageshow-2.png"
|
||||
/>
|
||||
</div>
|
||||
</div>
|
||||
@ -125,7 +122,7 @@
|
||||
|
||||
<section class="relative" style="background: #fff">
|
||||
<div class="flex flex-wrap justify-center">
|
||||
<div class="w-full px-[188px] mt-[113px]">
|
||||
<div class="content w-full px-[188px] mt-[113px]">
|
||||
<div class="text-[#8B59F7] text-[40px]">团队介绍</div>
|
||||
</div>
|
||||
<div class="w-full title mt-[58px] px-[188px]">
|
||||
@ -152,13 +149,13 @@
|
||||
}
|
||||
"
|
||||
class="w-[1625px] h-[1038px]"
|
||||
src="@/assets/image/companyprofil/768/imageshow-3.png"
|
||||
src="@/assets/image/companyprofil/imageshow-3.png"
|
||||
/>
|
||||
</div>
|
||||
<div class="w-full px-[188px]">
|
||||
<img
|
||||
class="w-[145px] h-[145px]"
|
||||
src="@/assets/image/companyprofil/768/icon-lun.png"
|
||||
src="@/assets/image/companyprofil/icon-lun.png"
|
||||
/>
|
||||
|
||||
<div class="w-full mt-[50px] text-[#10253E] text-[45px]">
|
||||
@ -172,7 +169,7 @@
|
||||
<div class="w-full px-[188px] mt-[170px]">
|
||||
<img
|
||||
class="w-[145px] h-[145px]"
|
||||
src="@/assets/image/companyprofil/768/icon-love.png"
|
||||
src="@/assets/image/companyprofil/icon-love.png"
|
||||
/>
|
||||
|
||||
<div class="w-full mt-[50px] text-[#10253E] text-[45px]">
|
||||
@ -185,7 +182,7 @@
|
||||
<div class="w-full px-[188px] mt-[160px] mb-[250px]">
|
||||
<img
|
||||
class="w-[145px] h-[145px]"
|
||||
src="@/assets/image/companyprofil/768/icon-p.png"
|
||||
src="@/assets/image/companyprofil/icon-p.png"
|
||||
/>
|
||||
|
||||
<div class="w-full mt-[50px] text-[#10253E] text-[45px]">
|
||||
@ -199,14 +196,14 @@
|
||||
<div class="icon-langmul">
|
||||
<img
|
||||
class="w-[846px] h-[216px]"
|
||||
src="@/assets/image/companyprofil/768/icon-langmul.png"
|
||||
src="@/assets/image/companyprofil/icon-langmul.png"
|
||||
/>
|
||||
</div>
|
||||
</div>
|
||||
</section>
|
||||
<section class="section-four">
|
||||
<div class="flex flex-wrap justify-center">
|
||||
<div class="w-full px-[188px] mt-[458px]">
|
||||
<div class="content w-full px-[188px] mt-[458px]">
|
||||
<div class="text-[#8B59F7] text-[40px]">卓越建树</div>
|
||||
</div>
|
||||
<div
|
||||
@ -265,7 +262,7 @@
|
||||
>
|
||||
<img
|
||||
class="w-[1625px] h-[1038px]"
|
||||
src="@/assets/image/companyprofil/768/imageshow-4.png"
|
||||
src="@/assets/image/companyprofil/imageshow-4.png"
|
||||
/>
|
||||
</div>
|
||||
<div
|
||||
@ -305,14 +302,14 @@
|
||||
}
|
||||
"
|
||||
class="w-[1625px] h-[1038px]"
|
||||
src="@/assets/image/companyprofil/768/imageshow-5.png"
|
||||
src="@/assets/image/companyprofil/imageshow-5.png"
|
||||
/>
|
||||
</div>
|
||||
</div>
|
||||
</section>
|
||||
<section style="background: #fff">
|
||||
<div class="flex flex-wrap justify-center">
|
||||
<div class="w-full px-[188px] mt-[245px]">
|
||||
<div class="content w-full px-[188px] mt-[245px]">
|
||||
<div class="text-[#8B59F7] text-[40px]">聚焦FiEE前沿动态</div>
|
||||
</div>
|
||||
<div
|
||||
@ -343,13 +340,13 @@
|
||||
<div class="arrow-btn" @click="handlePrev">
|
||||
<img
|
||||
class="w-[95px] h-[95px]"
|
||||
src="@/assets/image/companyprofil/768/icon-left.png"
|
||||
src="@/assets/image/companyprofil/icon-left.png"
|
||||
/>
|
||||
</div>
|
||||
<div class="arrow-btn ml-[63px] mr-[230px]" @click="handleNext">
|
||||
<img
|
||||
class="w-[95px] h-[95px]"
|
||||
src="@/assets/image/companyprofil/768/icon-right.png"
|
||||
src="@/assets/image/companyprofil/icon-right.png"
|
||||
/>
|
||||
</div>
|
||||
</div>
|
||||
@ -430,11 +427,11 @@ const { currentTab } = useHome();
|
||||
let ctx;
|
||||
|
||||
// 导入图片
|
||||
import carouselShow1 from "@/assets/image/companyprofil/768/carouselShow-1.png";
|
||||
import carouselShow2 from "@/assets/image/companyprofil/768/carouselShow-2.png";
|
||||
import carouselShow3 from "@/assets/image/companyprofil/768/carouselShow-3.png";
|
||||
import carouselShow4 from "@/assets/image/companyprofil/768/carouselShow-4.png";
|
||||
import carouselShow5 from "@/assets/image/companyprofil/768/carouselShow-5.png";
|
||||
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: [
|
||||
@ -477,7 +474,6 @@ const state = reactive({
|
||||
|
||||
const carouselTrack = ref(null);
|
||||
const currentIndex = ref(0);
|
||||
const isTransitioning = ref(false);
|
||||
|
||||
const getVisibleItems = () => {
|
||||
const items = state.marqueeArr;
|
||||
@ -496,15 +492,8 @@ const getSlideOffset = () => {
|
||||
const itemMargin = parseInt(window.getComputedStyle(firstItem).marginRight);
|
||||
const totalWidth = itemWidth + itemMargin;
|
||||
|
||||
const len = state.marqueeArr.length;
|
||||
if (currentIndex.value <= -len) {
|
||||
currentIndex.value = -currentIndex.value % len;
|
||||
} else if (currentIndex.value >= len) {
|
||||
currentIndex.value = currentIndex.value % len;
|
||||
}
|
||||
|
||||
// 初始偏移一组数据的长度
|
||||
const initialOffset = len * totalWidth + 32;
|
||||
// 初始偏移一组数据的长度，从而从中间组开始显示，并增加40px的额外偏移
|
||||
const initialOffset = state.marqueeArr.length * totalWidth + 32;
|
||||
return initialOffset + currentIndex.value * totalWidth;
|
||||
};
|
||||
|
||||
@ -517,6 +506,7 @@ const handleResize = () => {
|
||||
|
||||
// 监听窗口大小变化
|
||||
onMounted(() => {
|
||||
console.log(moveRefs.value);
|
||||
ctx = gsap.context(() => {
|
||||
moveRefs.value.forEach((moveRef, index) => {
|
||||
if (moveRef.value) {
|
||||
@ -598,48 +588,38 @@ const goToSection = (i) => {
|
||||
|
||||
// 向前滑动
|
||||
const handlePrev = () => {
|
||||
if (isTransitioning.value) return;
|
||||
isTransitioning.value = true;
|
||||
|
||||
if (!carouselTrack.value) return;
|
||||
|
||||
carouselTrack.value.style.transition = "transform 0.5s ease-in-out";
|
||||
currentIndex.value--;
|
||||
|
||||
// 如果滑到第一组的开头，跳转到第二组的末尾
|
||||
if (currentIndex.value < -state.marqueeArr.length) {
|
||||
setTimeout(() => {
|
||||
carouselTrack.value.style.transition = "none";
|
||||
currentIndex.value = -1;
|
||||
carouselTrack.value.offsetHeight; // 强制重排
|
||||
carouselTrack.value.style.transition = "transform 0.5s ease-in-out";
|
||||
isTransitioning.value = false;
|
||||
}, 500);
|
||||
} else {
|
||||
setTimeout(() => {
|
||||
isTransitioning.value = false;
|
||||
nextTick(() => {
|
||||
carouselTrack.value.style.transition = "transform 0.5s ease-in-out";
|
||||
});
|
||||
}, 500);
|
||||
}
|
||||
};
|
||||
|
||||
// 向后滑动
|
||||
const handleNext = () => {
|
||||
if (isTransitioning.value) return;
|
||||
isTransitioning.value = true;
|
||||
|
||||
if (!carouselTrack.value) return;
|
||||
|
||||
carouselTrack.value.style.transition = "transform 0.5s ease-in-out";
|
||||
currentIndex.value++;
|
||||
|
||||
// 如果滑到第三组的末尾，跳转到第二组的开头
|
||||
if (currentIndex.value >= state.marqueeArr.length) {
|
||||
setTimeout(() => {
|
||||
carouselTrack.value.style.transition = "none";
|
||||
currentIndex.value = 0;
|
||||
carouselTrack.value.offsetHeight; // 强制重排
|
||||
carouselTrack.value.style.transition = "transform 0.5s ease-in-out";
|
||||
isTransitioning.value = false;
|
||||
}, 500);
|
||||
} else {
|
||||
setTimeout(() => {
|
||||
isTransitioning.value = false;
|
||||
nextTick(() => {
|
||||
carouselTrack.value.style.transition = "transform 0.5s ease-in-out";
|
||||
});
|
||||
}, 500);
|
||||
}
|
||||
};
|
||||
@ -716,6 +696,7 @@ const handleCarouselClick = (item, event) => {
|
||||
if (event.type === "click") {
|
||||
event.stopPropagation(); // 阻止事件传播
|
||||
event.preventDefault(); // 阻止默认行为
|
||||
console.log(item);
|
||||
router.push({
|
||||
path: "/companyprofildetail",
|
||||
query: {
|
||||
@ -778,13 +759,13 @@ const handleCarouselClick = (item, event) => {
|
||||
font-weight: 600;
|
||||
}
|
||||
.section-first {
|
||||
background: url("@/assets/image/companyprofil/768/image-x.png");
|
||||
background: url("@/assets/image/companyprofil/image-x.png");
|
||||
background-size: cover;
|
||||
background-position: center;
|
||||
background-repeat: no-repeat;
|
||||
}
|
||||
.section-four {
|
||||
background: url("@/assets/image/companyprofil/768/bg-3.png");
|
||||
background: url("@/assets/image/companyprofil/bg-3.png");
|
||||
background-size: cover;
|
||||
background-position: center;
|
||||
background-repeat: no-repeat;
|
||||
@ -866,4 +847,14 @@ const handleCarouselClick = (item, event) => {
|
||||
.overflow-hidden {
|
||||
overflow: hidden;
|
||||
}
|
||||
|
||||
// 为所有可能需要动画的容器添加溢出隐藏
|
||||
[ref*="moveRef"] {
|
||||
position: relative;
|
||||
}
|
||||
|
||||
// 标题容器也需要控制溢出
|
||||
.title {
|
||||
position: relative;
|
||||
}
|
||||
</style>
|
||||
|
||||
@ -35,20 +35,24 @@
|
||||
style="background: #fff"
|
||||
>
|
||||
<div class="flex flex-wrap justify-center">
|
||||
<div class="w-full title mt-[543px] px-[205px] text-center">
|
||||
<div
|
||||
class="w-full title mt-[298px] px-[180px] text-center div-indent"
|
||||
>
|
||||
实现技术突破，引领文艺创作技术革新
|
||||
</div>
|
||||
<div class="w-full text-center mt-[31px] text-[#455363] text-[72px]">
|
||||
<div
|
||||
class="w-full text-center mt-[28px] text-[#455363] text-[40px] div-indent"
|
||||
>
|
||||
2025年02月07日 12时00分
|
||||
</div>
|
||||
<div class="mt-[164px] overflow-hidden">
|
||||
<div class="mt-[63px] overflow-hidden div-indent">
|
||||
<img
|
||||
class="w-[1625px] h-[1003px]"
|
||||
src="@/assets/image/companyprofil/768/carouselShow-1.png"
|
||||
src="@/assets/image/companyprofil/carouselShow-1.png"
|
||||
/>
|
||||
</div>
|
||||
<div
|
||||
class="w-full px-[188px] text-[#455363] text-[72px] div-indent mt-[241px] mb-[445px]"
|
||||
class="w-full px-[188px] text-[#455363] text-[40px] div-indent mt-[118px] mb-[275px]"
|
||||
>
|
||||
<div>
|
||||
在数字化浪潮以前所未有的态势席卷文艺领域的当下，文艺创作正经历着深刻变革。FiEE凭借着团队持之以恒的努力与创新精神，在文艺创作技术领域取得了具有里程碑意义的重大突破。
|
||||
@ -92,20 +96,24 @@
|
||||
style="background: #fff"
|
||||
>
|
||||
<div class="flex flex-wrap justify-center">
|
||||
<div class="w-full title mt-[298px] px-[205px] text-center">
|
||||
<div
|
||||
class="w-full title mt-[298px] px-[180px] text-center div-indent"
|
||||
>
|
||||
全球化战略升级，FiEE与30+国际平台达成战略合作，构建文艺传播新矩阵
|
||||
</div>
|
||||
<div class="w-full text-center mt-[31px] text-[#455363] text-[72px]">
|
||||
<div
|
||||
class="w-full text-center mt-[28px] text-[#455363] text-[40px] div-indent"
|
||||
>
|
||||
2025年02月10日 10时30分
|
||||
</div>
|
||||
<div class="mt-[164px] overflow-hidden">
|
||||
<div class="mt-[63px] overflow-hidden div-indent">
|
||||
<img
|
||||
class="w-[1625px] h-[1003px]"
|
||||
src="@/assets/image/companyprofil/768/carouselShow-2.png"
|
||||
src="@/assets/image/companyprofil/carouselShow-2.png"
|
||||
/>
|
||||
</div>
|
||||
<div
|
||||
class="w-full px-[188px] text-[#455363] text-[72px] div-indent mt-[241px] mb-[445px]"
|
||||
class="w-full px-[188px] text-[#455363] text-[40px] div-indent mt-[118px] mb-[275px]"
|
||||
>
|
||||
<div>
|
||||
在全球文化交融以前所未有的迅猛之势加速推进的时代大背景下，文艺领域已然成为文化交流与创新的前沿阵地。作为文艺行业的领航者，FiEE
|
||||
@ -156,20 +164,24 @@
|
||||
style="background: #fff"
|
||||
>
|
||||
<div class="flex flex-wrap justify-center">
|
||||
<div class="w-full title mt-[298px] px-[205px] text-center">
|
||||
<div
|
||||
class="w-full title mt-[298px] px-[180px] text-center div-indent"
|
||||
>
|
||||
助力文艺创作者，FiEE 发布 “AI × 短视频” 全链路解决方案
|
||||
</div>
|
||||
<div class="w-full text-center mt-[31px] text-[#455363] text-[72px]">
|
||||
<div
|
||||
class="w-full text-center mt-[28px] text-[#455363] text-[40px] div-indent"
|
||||
>
|
||||
2025年02月14日 12时30分
|
||||
</div>
|
||||
<div class="mt-[164px] overflow-hidden">
|
||||
<div class="mt-[63px] overflow-hidden div-indent">
|
||||
<img
|
||||
class="w-[1625px] h-[1003px]"
|
||||
src="@/assets/image/companyprofil/768/carouselShow-3.png"
|
||||
src="@/assets/image/companyprofil/carouselShow-3.png"
|
||||
/>
|
||||
</div>
|
||||
<div
|
||||
class="w-full px-[188px] text-[#455363] text-[72px] div-indent mt-[241px] mb-[445px]"
|
||||
class="w-full px-[188px] text-[#455363] text-[40px] div-indent mt-[118px] mb-[275px]"
|
||||
>
|
||||
<div>
|
||||
对于文艺创作者而言，创作瓶颈与效率低下是横亘在前行道路上的两座大山。构思一个吸引人的短视频脚本，常常需要耗费大量时间和精力，创作者们不仅要绞尽脑汁思考独特的创意，还要兼顾受众喜好和市场趋势。
|
||||
@ -223,20 +235,24 @@
|
||||
style="background: #fff"
|
||||
>
|
||||
<div class="flex flex-wrap justify-center">
|
||||
<div class="w-full title mt-[298px] px-[205px] text-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-[31px] text-[#455363] text-[72px]">
|
||||
<div
|
||||
class="w-full text-center mt-[28px] text-[#455363] text-[40px] div-indent"
|
||||
>
|
||||
2025年02月19日 12时00分
|
||||
</div>
|
||||
<div class="mt-[164px] overflow-hidden">
|
||||
<div class="mt-[63px] overflow-hidden div-indent">
|
||||
<img
|
||||
class="w-[1625px] h-[1003px]"
|
||||
src="@/assets/image/companyprofil/768/carouselShow-4.png"
|
||||
src="@/assets/image/companyprofil/carouselShow-4.png"
|
||||
/>
|
||||
</div>
|
||||
<div
|
||||
class="w-full px-[188px] text-[#455363] text-[72px] div-indent mt-[241px] mb-[445px]"
|
||||
class="w-full px-[188px] text-[#455363] text-[40px] div-indent mt-[118px] mb-[275px]"
|
||||
>
|
||||
<div>
|
||||
在文艺产业蓬勃发展的当下，优质内容创作者的重要性愈发凸显。作为行业内的先锋企业，FiEE始终关注着文艺领域的人才培养与发展动态。
|
||||
@ -286,20 +302,24 @@
|
||||
style="background: #fff"
|
||||
>
|
||||
<div class="flex flex-wrap justify-center">
|
||||
<div class="w-full title mt-[298px] px-[205px] text-center">
|
||||
<div
|
||||
class="w-full title mt-[298px] px-[180px] text-center div-indent"
|
||||
>
|
||||
多元人才汇聚，FiEE 构筑文艺创新发展基石
|
||||
</div>
|
||||
<div class="w-full text-center mt-[31px] text-[#455363] text-[72px]">
|
||||
<div
|
||||
class="w-full text-center mt-[28px] text-[#455363] text-[40px] div-indent"
|
||||
>
|
||||
2025年02月20日 12时00分
|
||||
</div>
|
||||
<div class="mt-[164px] overflow-hidden">
|
||||
<div class="mt-[63px] overflow-hidden div-indent">
|
||||
<img
|
||||
class="w-[1625px] h-[1003px]"
|
||||
src="@/assets/image/companyprofil/768/carouselShow-5.png"
|
||||
src="@/assets/image/companyprofil/carouselShow-5.png"
|
||||
/>
|
||||
</div>
|
||||
<div
|
||||
class="w-full px-[188px] text-[#455363] text-[72px] div-indent mt-[241px] mb-[445px]"
|
||||
class="w-full px-[188px] text-[#455363] text-[40px] div-indent mt-[118px] mb-[275px]"
|
||||
>
|
||||
<div>
|
||||
在当下文艺行业蓬勃发展、百花齐放的黄金时代，创新俨然成为引领行业持续进步、突破传统格局的关键要素。而追根溯源，人才作为创新的核心驱动力，其重要性不言而喻。
|
||||
@ -344,7 +364,7 @@
|
||||
className="flex flex-wrap justify-center"
|
||||
>
|
||||
<img
|
||||
class="w-[891px] h-[87px] mt-[61px] mb-[56px]"
|
||||
class="w-[580px] h-[55px] my-[85px]"
|
||||
src="@/assets/image/image-footer.png"
|
||||
alt="logo"
|
||||
/>
|
||||
@ -386,30 +406,29 @@ onUnmounted(() => {});
|
||||
|
||||
.header {
|
||||
width: 100%;
|
||||
height: 260px;
|
||||
height: 155px;
|
||||
position: fixed;
|
||||
z-index: 10;
|
||||
top: 0;
|
||||
left: 0;
|
||||
right: 0;
|
||||
padding: 0 138px;
|
||||
padding: 0 10rem;
|
||||
background-color: transparent;
|
||||
}
|
||||
.logo {
|
||||
img {
|
||||
width: 399px;
|
||||
height: 128px;
|
||||
width: 270px;
|
||||
height: 83px;
|
||||
}
|
||||
}
|
||||
|
||||
.tabs {
|
||||
display: flex;
|
||||
gap: 128px;
|
||||
gap: 32px;
|
||||
margin-right: 32px;
|
||||
}
|
||||
|
||||
.tab-item {
|
||||
font-size: 61px;
|
||||
font-size: 30px;
|
||||
color: #000000;
|
||||
cursor: pointer;
|
||||
transition: color 0.3s ease;
|
||||
@ -423,17 +442,18 @@ onUnmounted(() => {});
|
||||
color: #8b59fa;
|
||||
}
|
||||
}
|
||||
|
||||
.title {
|
||||
font-size: 113px;
|
||||
font-size: 85px;
|
||||
font-weight: 600;
|
||||
color: #10253e;
|
||||
line-height: 143px;
|
||||
}
|
||||
.subTitle {
|
||||
line-height: 102px;
|
||||
}
|
||||
|
||||
.div-indent {
|
||||
text-indent: 2em; // Adjust the value as needed for the desired indent
|
||||
line-height: 143px;
|
||||
line-height: 75px;
|
||||
}
|
||||
.title {
|
||||
line-height: 110px;
|
||||
color: #10253e;
|
||||
}
|
||||
</style>
|
||||
|
||||
@ -35,16 +35,20 @@
|
||||
style="background: #fff"
|
||||
>
|
||||
<div class="flex flex-wrap justify-center">
|
||||
<div class="w-full title mt-[298px] px-[180px] text-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
|
||||
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 class="mt-[63px] overflow-hidden div-indent">
|
||||
<img
|
||||
class="w-[1625px] h-[1003px]"
|
||||
src="@/assets/image/companyprofil/768/carouselShow-1.png"
|
||||
src="@/assets/image/companyprofil/carouselShow-1.png"
|
||||
/>
|
||||
</div>
|
||||
<div
|
||||
@ -92,16 +96,20 @@
|
||||
style="background: #fff"
|
||||
>
|
||||
<div class="flex flex-wrap justify-center">
|
||||
<div class="w-full title mt-[298px] px-[180px] text-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
|
||||
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 class="mt-[63px] overflow-hidden div-indent">
|
||||
<img
|
||||
class="w-[1625px] h-[1003px]"
|
||||
src="@/assets/image/companyprofil/768/carouselShow-2.png"
|
||||
src="@/assets/image/companyprofil/carouselShow-2.png"
|
||||
/>
|
||||
</div>
|
||||
<div
|
||||
@ -156,16 +164,20 @@
|
||||
style="background: #fff"
|
||||
>
|
||||
<div class="flex flex-wrap justify-center">
|
||||
<div class="w-full title mt-[298px] px-[180px] text-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
|
||||
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 class="mt-[63px] overflow-hidden div-indent">
|
||||
<img
|
||||
class="w-[1625px] h-[1003px]"
|
||||
src="@/assets/image/companyprofil/768/carouselShow-3.png"
|
||||
src="@/assets/image/companyprofil/carouselShow-3.png"
|
||||
/>
|
||||
</div>
|
||||
<div
|
||||
@ -223,16 +235,20 @@
|
||||
style="background: #fff"
|
||||
>
|
||||
<div class="flex flex-wrap justify-center">
|
||||
<div class="w-full title mt-[298px] px-[180px] text-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
|
||||
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 class="mt-[63px] overflow-hidden div-indent">
|
||||
<img
|
||||
class="w-[1625px] h-[1003px]"
|
||||
src="@/assets/image/companyprofil/768/carouselShow-4.png"
|
||||
src="@/assets/image/companyprofil/carouselShow-4.png"
|
||||
/>
|
||||
</div>
|
||||
<div
|
||||
@ -286,16 +302,20 @@
|
||||
style="background: #fff"
|
||||
>
|
||||
<div class="flex flex-wrap justify-center">
|
||||
<div class="w-full title mt-[298px] px-[180px] text-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
|
||||
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 class="mt-[63px] overflow-hidden div-indent">
|
||||
<img
|
||||
class="w-[1625px] h-[1003px]"
|
||||
src="@/assets/image/companyprofil/768/carouselShow-5.png"
|
||||
src="@/assets/image/companyprofil/carouselShow-5.png"
|
||||
/>
|
||||
</div>
|
||||
<div
|
||||
|
||||