scout666/officialWebsite
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity
017887c9a4
officialWebsite/src/views/investor/size1920/index.vue

1174 lines
46 KiB
Vue
Raw Normal View History

投资者
2025-03-14 05:13:30 +00:00
<script setup>
import {
onUnmounted,
ref,
watch,
reactive,
onMounted
} 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";
添加投资者
2025-03-14 07:24:47 +00:00
import { NDivider, NPopselect, NGrid, NGi, NButton } from "naive-ui";
投资者
2025-03-14 05:13:30 +00:00
import { useLanguage } from "@/utils/changeLanguage.js";
// 注册 ScrollTrigger 插件
gsap.registerPlugin(ScrollTrigger);
const { currentTab } = useHome();
const router = useRouter();
const { transitionState } =
useTransitionComposable();
const main = ref();
let ctx;
const {
languageOptions,
currentLanguage,
currentLanguageLabel,
changeLanguage,
initLanguage,
currentLang,
currentBannerImages,
t
} = useLanguage();
const handleTabClick = (tab) => {
currentTab.value = tab;
router.push("/" + tab);
};
onMounted(() => {
window.scrollTo(0, 0);
添加国际化
2025-03-15 08:10:26 +00:00
投资者
2025-03-15 07:10:58 +00:00
// 添加延迟，确保DOM完全渲染并且滚动位置重置
setTimeout(() => {
ctx = gsap.context((self) => {
// 文本从左侧滑入动画
gsap.utils.toArray(".text-animate").forEach((text) => {
gsap.from(text, {
x: -100,
opacity: 0,
duration: 0.8,
ease: "back.out(1.2)",
scrollTrigger: {
trigger: text,
start: "top 85%",
toggleActions: "play none none reverse",
immediateRender: false,
once: false,
},
});
});
// 图片从右侧滑入动画
gsap.utils.toArray(".image-animate").forEach((image) => {
gsap.from(image, {
x: 100,
opacity: 0,
duration: 0.8,
ease: "back.out(1.2)",
scrollTrigger: {
trigger: image,
start: "top 85%",
toggleActions: "play none none reverse",
immediateRender: false,
once: false,
},
});
});
// 内容上浮动画
gsap.utils.toArray('.float-up').forEach((element) => {
gsap.from(element, {
y: 100,
opacity: 0,
duration: 0.8,
ease: "back.out(1.2)",
scrollTrigger: {
trigger: element,
start: 'top 100%',
toggleActions: "play none none reverse",
immediateRender: false,
once: false,
}
});
});
// 卡片上升动画
const cards = gsap.utils.toArray('.carousel-item');
cards.forEach((card, index) => {
gsap.from(card, {
y: 100,
opacity: 0,
duration: 0.8,
delay: index * 0.2,
ease: "back.out(1.2)",
scrollTrigger: {
trigger: card,
start: 'top 85%',
toggleActions: "play none none reverse",
immediateRender: false,
once: false,
}
});
});
// 表格行依次淡入动画
gsap.utils.toArray('.content2 .n-grid .n-gi').forEach((row, index) => {
gsap.from(row, {
opacity: 0,
y: 30,
duration: 0.5,
delay: index * 0.1,
ease: "power2.out",
scrollTrigger: {
trigger: row,
start: "top 85%",
toggleActions: "play none none reverse",
immediateRender: false,
once: false,
}
});
});
// 治理章程列表动画
gsap.from('.content5 .n-grid .n-gi', {
opacity: 0,
y: 50,
duration: 0.8,
stagger: {
amount: 1,
from: "start",
},
ease: "back.out(1.2)",
scrollTrigger: {
trigger: '.content5',
start: "top 85%",
toggleActions: "play none none none",
immediateRender: false,
once: true
}
});
添加国际化
2025-03-15 08:10:26 +00:00
投资者
2025-03-15 07:10:58 +00:00
// 强制刷新ScrollTrigger以正确计算位置
ScrollTrigger.refresh();
}, main.value);
}, 100); // 短暂延迟确保DOM已渲染
投资者
2025-03-14 05:13:30 +00:00
});
onUnmounted(() => {
ctx?.revert(); // <- Easy Cleanup!
});
添加国际化
2025-03-15 08:10:26 +00:00
const handleClick = (linkUrl) => {
window.open(linkUrl, '_blank');
};
const handleQClick = (type, year, subType) => {
console.log(type, year, subType, state.qLink?.[type]?.[year]?.[subType])
if (state.qLink?.[type]?.[year]?.[subType]) {
window.open(state.qLink[type][year][subType]);
}
};
const handleYClick = (type, year) => {
console.log(type, year, state.yLink?.[type]?.[year])
if (state.yLink?.[type]?.[year]) {
window.open(state.yLink[type][year]);
}
};
const state = reactive({
marqueeArr: [
{
linkUrl: "https://spaces.hightail.com/receive/RpIYgWf2p0",
},
{
linkUrl:
"https://hello.minim.co/hubfs/Merger%20Agreement%20-%20Press%20Release%20Final%203-12-2024.pdf?hsLang=en",
},
{
linkUrl:
"https://www.tradingview.com/symbols/NASDAQ-MINM/?utm_campaign=single-quote&utm_medium=widget_new&utm_source=ir.minim.com",
},
],
qLink: {
"Earnings Release": {
2021: {
Q1: "https://hello.minim.com/hubfs/docs/MINM-Q1-2021-Earnings-Release.pdf?hsLang=en",
Q2: "https://finance.yahoo.com/news/minim-reports-accelerating-revenue-growth-113000630.html",
Q3: "https://www.globenewswire.com/en/news-release/2021/11/02/2325230/0/en/Minim-Reports-Revenue-Growth-of-25.html",
Q4: "https://hello.minim.com/hubfs/docs/MINM-Q4-2021-Earnings-Release.pdf?hsLang=en",
},
2022: {
Q1: "https://hello.minim.com/hubfs/docs/MINM-Q1-2022-Earnings-Results.pdf?hsLang=en",
Q2: "https://hello.minim.com/hubfs/docs/MINM-Q2-2022-Earnings-Results.pdf?hsLang=en",
Q3: "https://finance.yahoo.com/news/minim-reports-third-quarter-2022-123000213.html",
Q4: "https://hello.minim.co/hubfs/docs/MINM-Q4-FY22-Earnings-Results.pdf?hsLang=en",
},
},
"Earnings Presentation": {
2021: {
Q1: "https://hello.minim.com/hubfs/docs/Minim-Q12021-Earnings-Presentation.pdf?hsLang=en",
Q2: "https://hello.minim.com/hubfs/docs/Minim-Q22021-Earnings-Presentation-v1.pdf?hsLang=en",
Q3: "https://hello.minim.com/hubfs/docs/Minim-Q3-2021-Earnings-Presentation.pdf?hsLang=en",
Q4: "https://hello.minim.com/hubfs/docs/MINM-Q4-2021-Earnings-Presentation.pdf?hsLang=en",
},
2022: {
Q1: "https://hello.minim.com/hubfs/docs/MINM-Q1-2022-Earnings-Presentation.pdf?hsLang=en",
Q2: "https://hello.minim.com/hubfs/docs/MINM-Q2-2022-Earnings-Presentation.pdf?hsLang=en",
Q3: "https://hello.minim.com/hubfs/docs/MINM-Q3-2022-Earnings-Presentation.pdf?hsLang=en",
},
},
"Earnings Call": {
2021: {
Q1: "https://hello.minim.com/hubfs/docs/Minim-Q1-2021-EarningsCall.mp3?hsLang=en",
Q2: "https://hello.minim.com/hubfs/docs/MINM-Q2-2021-EarningsCall.mp3?hsLang=en",
Q3: "https://hello.minim.com/hubfs/docs/MINM-Q3-2021-EarningsCall.mp3?hsLang=en",
Q4: "https://hello.minim.com/hubfs/docs/MINM-Q4-2021-EarningsCall.mp3?hsLang=en",
},
2022: {
Q1: "https://hello.minim.com/hubfs/docs/MINM-Q1-2022-EarningsCall.mp3?hsLang=en",
Q2: "https://hello.minim.com/hubfs/docs/MINM-Q2-2022-EarningsCall.mp3?hsLang=en",
Q3: "https://hello.minim.com/hubfs/docs/MINM-Q3-2022-EarningsCall.mp3?hsLang=en",
},
},
"10-Q/10-K": {
2021: {
Q1: "https://hello.minim.com/hubfs/docs/MINM-Q1-2021-10Q-Filing.pdf?hsLang=en",
Q2: "https://hello.minim.com/hubfs/docs/MINM-Q2-2021-10Q-Filing.pdf?hsLang=en",
Q3: "https://hello.minim.com/hubfs/docs/MINM-Q3-2021-10Q-Filing.pdf?hsLang=en",
Q4: "https://hello.minim.com/hubfs/docs/MINM-2021-10KA-Filing.pdf?hsLang=en",
},
2022: {
Q1: "https://hello.minim.com/hubfs/docs/MINM-Q1-2022-10QA-Filing.pdf?hsLang=en",
Q2: "https://hello.minim.co/hubfs/docs/MINM-Q2-2022-10Q-Filing.pdf?hsLang=en",
Q3: "https://hello.minim.co/hubfs/docs/MINM-Q3-2022-10Q-Filing.pdf?hsLang=en",
Q4: "https://hello.minim.co/hubfs/docs/MINM-2022-10K-Filing.pdf?hsLang=en",
},
},
},
yLink: {
"Annual Report": {
2021: "https://hello.minim.com/hubfs/docs/MINM-2021-Annual-Report-Restated.pdf?hsLang=en",
2022: "https://hello.minim.co/hubfs/docs/MINM-2022-Annual-Report.pdf?hsLang=en",
},
"Annual Meeting": {
2021: "https://hello.minim.com/hubfs/investor/Minim-2021-Annual-Meeting.mp4?hsLang=en",
2022: "https://east.virtualshareholdermeeting.com/vsm/web?pvskey=MINM2022",
},
"Special Shareholder Meeting": {
2023: "https://central.virtualshareholdermeeting.com/vsm/web?pvskey=MINM2023SM",
},
"Proxy Statement": {
2021: "https://hello.minim.com/hubfs/docs/MINM-2021-Proxy-Statement.pdf?hsLang=en",
2022: "https://hello.minim.com/hubfs/docs/MINM-2022-Proxy-Statement.pdf?hsLang=en",
},
},
linkArr: [
{
title: "高级财务人员道德守则",
link: "https://hello.minim.com/hubfs/docs/MINM-Code-of-Ethics-for-Senior-Financial-Officers_Jan-2022.pdf?hsLang=en",
},
{
title: "冲突矿产声明",
link: "https://hello.minim.co/hubfs/docs/MINM-Conflict-Mineral-Report-FY22.pdf?hsLang=en",
},
{
title: "道德和商业行为准则",
link: "https://hello.minim.com/hubfs/docs/MINM-Code-of-Ethics-and-Business-Conduct_Jan-2022.pdf?hsLang=en",
},
{
title: "审计委员会章程",
link: "https://hello.minim.com/hubfs/docs/MINM-Audit-Committe-Charter_Jan-2021.pdf?hsLang=en",
},
{
title: "举报人政策",
link: "https://hello.minim.com/hubfs/docs/MINM-Whistleblower-Policy_Jan-2022.pdf?hsLang=en",
},
{
title: "薪酬委员会章程",
link: "https://hello.minim.com/hubfs/docs/MINM-Compensation-Committee-Charter_Oct-2022.pdf?hsLang=en",
},
{
title: "关联方交易政策",
link: "https://hello.minim.com/hubfs/docs/MINM-Related-Party-Transactions-Policy_Jan-2022.pdf?hsLang=en",
},
{
title: "提名和治理委员会章程",
link: "https://hello.minim.com/hubfs/docs/MINM-Nominating-and-Governance-Committee-Charter_%20Jan-2021.pdf?hsLang=en",
},
{
title: "2022年多样性矩阵",
link: "https://hello.minim.co/hubfs/2022%20Diversity%20Matrix.pdf?hsLang=en",
},
{
title: "2023年多样性矩阵",
link: "https://hello.minim.co/hubfs/2023%20Diversity%20Matrxi.pdf?hsLang=en",
},
],
activeYear: 2023,
});
投资者
2025-03-14 05:13:30 +00:00
</script>
<template>
<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 === 'businessintroduction',
}" @click="
handleTabClick('businessintroduction')
">
{{ t("home.nav.businessintroduction") }}
</div>
<div class="tab-item" :class="{
active:
currentTab === 'investor',
}" @click="
handleTabClick('investor')
">
{{ t("home.nav.investor") }}
</div>
<div class="tab-item">
<n-popselect v-model:value="currentLanguage" :options="languageOptions" @update:value="changeLanguage">
<div class="language-display">
{{ currentLanguageLabel }}
<span class="language-arrow">▼</span>
</div>
</n-popselect>
</div>
</div>
</header>
<main ref="main" class="height-full">
<div class="head relative">
<img src="@/assets/image/tzgbg.png" alt="head" />
投资者
2025-03-15 07:10:58 +00:00
<div class="absolute top-240px left-510px text-[#10253E] text-[54px] font-bold text-animate">
fixbug
2025-03-15 08:25:09 +00:00
{{ t("investor.title") }}
投资者
2025-03-14 05:13:30 +00:00
</div>
投资者
2025-03-15 07:10:58 +00:00
<div class="absolute top-340px left-510px text-[#8B59F7] text-[20px] w-[535px] text-animate">
fixbug
2025-03-15 08:25:09 +00:00
{{ t("investor.subtitle") }}
投资者
2025-03-14 05:13:30 +00:00
</div>
</div>
<div class="bg-[#F8F9FF]">
<div class="content1 bg-#FFFFFF relative flex justify-center z-3 pb-[100px] flex-col pr-[10px] float-up">
<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 />
添加投资者
2025-03-14 07:24:47 +00:00
<div class="pl-[505px] pr-[490px]">
<div class="w-52px h-7px bg-[#8B59F7]">
</div>
投资者
2025-03-15 07:10:58 +00:00
<div class="text-[#10253E] text-[40px] mt-[17px] font-bold text-animate">
fixbug
2025-03-15 08:25:09 +00:00
{{ t("investor.latest_news.title") }}
添加投资者
2025-03-14 07:24:47 +00:00
</div>
<div class="flex mt-[46px]">
<div class="carousel-item">
<img class="carousel-image relative z-10" src="@/assets/image/dt1.png" />
<div class="carousel-content">
<div class="carousel-title font-bold flex justify-between">
fixbug
2025-03-15 08:25:09 +00:00
<div>{{ t("investor.latest_news.financial.title") }}</div>
<div class="text-[#9F9F9F] text-[14px]">{{ t("investor.latest_news.financial.date") }}</div>
添加投资者
2025-03-14 07:24:47 +00:00
</div>
<div class="carousel-subtitle">
fixbug
2025-03-15 08:25:09 +00:00
<div>{{ t("investor.latest_news.financial.content") }}</div>
添加投资者
2025-03-14 07:24:47 +00:00
</div>
<div class="flex items-center mt-[10px] cursor-pointer">
<img class="w-[12px] h-[12px]" src="@/assets/image/downlink.png" alt="cl" />
fixbug
2025-03-15 08:25:09 +00:00
<div @click="handleClick(state.marqueeArr[0].linkUrl)" class="text-[#8B59F7] text-[14px] relative z-10">{{ t("investor.latest_news.financial.link") }}</div>
投资者
2025-03-14 05:13:30 +00:00
</div>
</div>
</div>
添加投资者
2025-03-14 07:24:47 +00:00
<div class="carousel-item">
<img class="carousel-image relative z-10" src="@/assets/image/dt2.png" />
<div class="carousel-content">
<div class="carousel-title font-bold flex justify-between">
fixbug
2025-03-15 08:25:09 +00:00
<div>{{ t("investor.latest_news.events.title") }}</div>
<div class="text-[#9F9F9F] text-[14px]">{{ t("investor.latest_news.events.date") }}</div>
添加投资者
2025-03-14 07:24:47 +00:00
</div>
<div class="carousel-subtitle">
fixbug
2025-03-15 08:25:09 +00:00
<div>{{ t("investor.latest_news.events.content") }}</div>
投资者
2025-03-14 05:13:30 +00:00
</div>
添加投资者
2025-03-14 07:24:47 +00:00
<div class="flex items-center mt-[10px] cursor-pointer">
<img class="w-[12px] h-[12px]" src="@/assets/image/downlink.png" alt="cl" />
添加国际化
2025-03-15 08:10:26 +00:00
<div @click="handleClick(state.marqueeArr[1].linkUrl)" class="text-[#8B59F7] text-[14px] relative z-10">
fixbug
2025-03-15 08:25:09 +00:00
{{ t("investor.latest_news.events.link") }}</div>
投资者
2025-03-14 05:13:30 +00:00
</div>
</div>
添加投资者
2025-03-14 07:24:47 +00:00
</div>
<div class="carousel-item">
<img class="carousel-image relative z-10" src="@/assets/image/dt3.png" />
<div class="carousel-content">
<div class="carousel-title font-bold flex justify-between">
fixbug
2025-03-15 08:25:09 +00:00
<div>{{ t("investor.latest_news.stock.title") }}</div>
投资者
2025-03-14 05:13:30 +00:00
</div>
添加投资者
2025-03-14 07:24:47 +00:00
<div class="carousel-subtitle">
fixbug
2025-03-15 08:25:09 +00:00
<div>{{ t("investor.latest_news.stock.content") }}</div>
添加投资者
2025-03-14 07:24:47 +00:00
</div>
<div class="flex items-center mt-[10px] cursor-pointer">
<img class="w-[12px] h-[12px]" src="@/assets/image/downlink.png" alt="cl" />
fixbug
2025-03-15 08:25:09 +00:00
<div @click="handleClick(state.marqueeArr[2].linkUrl)" class="text-[#8B59F7] text-[14px] relative z-10">{{ t("investor.latest_news.stock.link") }}
添加投资者
2025-03-14 07:24:47 +00:00
</div>
投资者
2025-03-14 05:13:30 +00:00
</div>
</div>
</div>
</div>
</div>
添加投资者
2025-03-14 07:24:47 +00:00
</div>
投资者
2025-03-15 07:10:58 +00:00
<div class="content2 relative flex items-center pb-[120px] pt-[148px] bg-[#F8F9FF] float-up">
投资者
2025-03-14 05:13:30 +00:00
<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 />
添加投资者
2025-03-14 07:24:47 +00:00
<div class="flex flex-col">
<div class="pl-[505px] pr-[490px] z-3">
<div class="w-52px h-7px bg-[#8B59F7]">
投资者
2025-03-14 05:13:30 +00:00
</div>
投资者
2025-03-15 07:10:58 +00:00
<div class="text-[#10253E] text-[40px] mt-[17px] font-bold text-animate">
fixbug
2025-03-15 08:25:09 +00:00
{{ t("investor.financial_data.title") }}
投资者
2025-03-14 05:13:30 +00:00
</div>
</div>
投资者
2025-03-15 07:10:58 +00:00
<div class="ml-[494px] w-920px min-h-473px bg-[#fff] mt-[55px] float-up"
添加投资者
2025-03-14 07:24:47 +00:00
style="box-shadow: 0px 3px 20px 1px rgba(0, 0, 0, 0.16);border-radius: 8px;padding: 5px;">
<n-grid x-gap="4" y-gap="5" :cols="4">
<n-gi>
<div class="font-bold bg-[#fff] h-[47px] rounded-[4px]">
</div>
</n-gi>
<n-gi>
<div
class="font-bold bg-[#C6ACFF] h-[47px] rounded-[4px] flex items-center p-l-10px text-[#fff] text-[18px]">
fixbug
2025-03-15 08:25:09 +00:00
{{ t("investor.financial_data.years.year2023") }}
添加投资者
2025-03-14 07:24:47 +00:00
</div>
</n-gi>
<n-gi>
<div
class="font-bold bg-[#8B59F7] h-[47px] rounded-[4px] flex items-center p-l-10px text-[#fff] text-[18px]">
fixbug
2025-03-15 08:25:09 +00:00
{{ t("investor.financial_data.years.year2022") }}
添加投资者
2025-03-14 07:24:47 +00:00
</div>
</n-gi>
<n-gi>
<div
class="font-bold bg-[#6520FA] h-[47px] rounded-[4px] flex items-center p-l-10px text-[#fff] text-[18px]">
fixbug
2025-03-15 08:25:09 +00:00
{{ t("investor.financial_data.years.year2021") }}
添加投资者
2025-03-14 07:24:47 +00:00
</div>
</n-gi>
<n-gi>
<div
class="font-bold bg-[#F8F9FF] h-[47px] rounded-[4px] flex items-center p-l-10px text-[#10263E] text-[18px]">
fixbug
2025-03-15 08:25:09 +00:00
{{ t("investor.financial_data.reports.profit_report") }}
添加投资者
2025-03-14 07:24:47 +00:00
</div>
</n-gi>
<n-gi>
<div
class="bg-[#F8F9FF] h-[47px] rounded-[4px] flex items-center justify-between p-10px text-[#9F9F9F] text-[18px]">
<span>Q1</span>
<span>Q2</span>
<span>Q3</span>
<span>Q4</span>
</div>
</n-gi>
<n-gi>
<div
class="bg-[#F8F9FF] h-[47px] rounded-[4px] flex items-center justify-between p-10px text-[#8B59FA] text-[18px]">
添加国际化
2025-03-15 08:10:26 +00:00
<span class="cursor-pointer" @click="handleQClick('Earnings Release', '2022', 'Q1')">Q1</span>
<span class="cursor-pointer" @click="handleQClick('Earnings Release', '2022', 'Q2')">Q2</span>
<span class="cursor-pointer" @click="handleQClick('Earnings Release', '2022', 'Q3')">Q3</span>
<span class="cursor-pointer" @click="handleQClick('Earnings Release', '2022', 'Q4')">Q4</span>
添加投资者
2025-03-14 07:24:47 +00:00
</div>
</n-gi>
<n-gi>
<div
class="bg-[#F8F9FF] h-[47px] rounded-[4px] flex items-center justify-between p-10px text-[#8B59FA] text-[18px]">
添加国际化
2025-03-15 08:10:26 +00:00
<span class="cursor-pointer" @click="handleQClick('Earnings Release', '2021', 'Q1')">Q1</span>
<span class="cursor-pointer" @click="handleQClick('Earnings Release', '2021', 'Q2')">Q2</span>
<span class="cursor-pointer" @click="handleQClick('Earnings Release', '2021', 'Q3')">Q3</span>
<span class="cursor-pointer" @click="handleQClick('Earnings Release', '2021', 'Q4')">Q4</span>
添加投资者
2025-03-14 07:24:47 +00:00
</div>
</n-gi>
<n-gi>
<div
class="font-bold bg-[#F8F9FF] h-[47px] rounded-[4px] flex items-center p-l-10px text-[#10263E] text-[18px]">
fixbug
2025-03-15 08:25:09 +00:00
{{ t("investor.financial_data.reports.earnings_report") }}
添加投资者
2025-03-14 07:24:47 +00:00
</div>
</n-gi>
<n-gi>
<div
class="bg-[#F8F9FF] h-[47px] rounded-[4px] flex items-center justify-between p-10px text-[#9F9F9F] text-[18px]">
<span>Q1</span>
<span>Q2</span>
<span>Q3</span>
<span>Q4</span>
</div>
</n-gi>
<n-gi>
<div
class="bg-[#F8F9FF] h-[47px] rounded-[4px] flex items-center justify-between p-10px text-[#8B59FA] text-[18px]">
添加国际化
2025-03-15 08:10:26 +00:00
<span class="cursor-pointer" @click="handleQClick('Earnings Presentation', '2022', 'Q1')">Q1</span>
<span class="cursor-pointer" @click="handleQClick('Earnings Presentation', '2022', 'Q2')">Q2</span>
<span class="cursor-pointer" @click="handleQClick('Earnings Presentation', '2022', 'Q3')">Q3</span>
添加投资者
2025-03-14 07:24:47 +00:00
<span class="text-[#9F9F9F]">Q4</span>
</div>
</n-gi>
<n-gi>
<div
class="bg-[#F8F9FF] h-[47px] rounded-[4px] flex items-center justify-between p-10px text-[#8B59FA] text-[18px]">
添加国际化
2025-03-15 08:10:26 +00:00
<span class="cursor-pointer" @click="handleQClick('Earnings Presentation', '2021', 'Q1')">Q1</span>
<span class="cursor-pointer" @click="handleQClick('Earnings Presentation', '2021', 'Q2')">Q2</span>
<span class="cursor-pointer" @click="handleQClick('Earnings Presentation', '2021', 'Q3')">Q3</span>
<span class="cursor-pointer" @click="handleQClick('Earnings Presentation', '2021', 'Q4')">Q4</span>
添加投资者
2025-03-14 07:24:47 +00:00
</div>
</n-gi>
<n-gi>
<div
class="font-bold bg-[#F8F9FF] h-[47px] rounded-[4px] flex items-center p-l-10px text-[#10263E] text-[18px]">
fixbug
2025-03-15 08:25:09 +00:00
{{ t("investor.financial_data.reports.earnings_call") }}
添加投资者
2025-03-14 07:24:47 +00:00
</div>
</n-gi>
<n-gi>
<div
class="bg-[#F8F9FF] h-[47px] rounded-[4px] flex items-center justify-between p-10px text-[#9F9F9F] text-[18px]">
<span>Q1</span>
<span>Q2</span>
<span>Q3</span>
<span>Q4</span>
</div>
</n-gi>
<n-gi>
<div
class="bg-[#F8F9FF] h-[47px] rounded-[4px] flex items-center justify-between p-10px text-[#8B59FA] text-[18px]">
添加国际化
2025-03-15 08:10:26 +00:00
<span class="cursor-pointer" @click="handleQClick('Earnings Call', '2022', 'Q1')">Q1</span>
<span class="cursor-pointer" @click="handleQClick('Earnings Call', '2022', 'Q2')">Q2</span>
<span class="cursor-pointer" @click="handleQClick('Earnings Call', '2022', 'Q3')">Q3</span>
添加投资者
2025-03-14 07:24:47 +00:00
<span class="text-[#9F9F9F]">Q4</span>
</div>
</n-gi>
<n-gi>
<div
class="bg-[#F8F9FF] h-[47px] rounded-[4px] flex items-center justify-between p-10px text-[#8B59FA] text-[18px]">
添加国际化
2025-03-15 08:10:26 +00:00
<span class="cursor-pointer" @click="handleQClick('Earnings Call', '2021', 'Q1')">Q1</span>
<span class="cursor-pointer" @click="handleQClick('Earnings Call', '2021', 'Q2')">Q2</span>
<span class="cursor-pointer" @click="handleQClick('Earnings Call', '2021', 'Q3')">Q3</span>
<span class="cursor-pointer" @click="handleQClick('Earnings Call', '2021', 'Q4')">Q4</span>
添加投资者
2025-03-14 07:24:47 +00:00
</div>
</n-gi>
<n-gi>
<div
class="font-bold bg-[#F8F9FF] h-[47px] rounded-[4px] flex items-center p-l-10px text-[#10263E] text-[18px]">
fixbug
2025-03-15 08:25:09 +00:00
{{ t("investor.financial_data.reports.sec_filings") }}
添加投资者
2025-03-14 07:24:47 +00:00
</div>
</n-gi>
<n-gi>
<div
class="bg-[#F8F9FF] h-[47px] rounded-[4px] flex items-center justify-between p-10px text-[#9F9F9F] text-[18px]">
<span>Q1</span>
<span>Q2</span>
<span>Q3</span>
<span>Q4</span>
</div>
</n-gi>
<n-gi>
<div
class="bg-[#F8F9FF] h-[47px] rounded-[4px] flex items-center justify-between p-10px text-[#8B59FA] text-[18px]">
添加国际化
2025-03-15 08:10:26 +00:00
<span class="cursor-pointer" @click="handleQClick('10-Q/10-K', '2022', 'Q1')">Q1</span>
<span class="cursor-pointer" @click="handleQClick('10-Q/10-K', '2022', 'Q2')">Q2</span>
<span class="cursor-pointer" @click="handleQClick('10-Q/10-K', '2022', 'Q3')">Q3</span>
<span class="cursor-pointer" @click="handleQClick('10-Q/10-K', '2022', 'Q4')">Q4</span>
添加投资者
2025-03-14 07:24:47 +00:00
</div>
</n-gi>
<n-gi>
<div
class="bg-[#F8F9FF] h-[47px] rounded-[4px] flex items-center justify-between p-10px text-[#8B59FA] text-[18px]">
添加国际化
2025-03-15 08:10:26 +00:00
<span class="cursor-pointer" @click="handleQClick('10-Q/10-K', '2021', 'Q1')">Q1</span>
<span class="cursor-pointer" @click="handleQClick('10-Q/10-K', '2021', 'Q2')">Q2</span>
<span class="cursor-pointer" @click="handleQClick('10-Q/10-K', '2021', 'Q3')">Q3</span>
<span class="cursor-pointer" @click="handleQClick('10-Q/10-K', '2021', 'Q4')">Q4</span>
添加投资者
2025-03-14 07:24:47 +00:00
</div>
</n-gi>
<n-gi>
<div
class="font-bold bg-[#F8F9FF] h-[47px] rounded-[4px] flex items-center p-l-10px text-[#10263E] text-[18px]">
fixbug
2025-03-15 08:25:09 +00:00
{{ t("investor.financial_data.reports.annual_report") }}
添加投资者
2025-03-14 07:24:47 +00:00
</div>
</n-gi>
<n-gi>
<div
class="bg-[#F8F9FF] h-[47px] rounded-[4px] flex items-center justify-between p-10px text-[#9F9F9F] text-[18px]">
fixbug
2025-03-15 08:25:09 +00:00
{{ t("investor.financial_data.years.year2023") }}
添加投资者
2025-03-14 07:24:47 +00:00
</div>
</n-gi>
<n-gi>
<div
添加国际化
2025-03-15 08:10:26 +00:00
@click="handleYClick('Annual Report', '2022')"
class="cursor-pointer bg-[#F8F9FF] h-[47px] rounded-[4px] flex items-center justify-between p-10px text-[#8B59FA] text-[18px]">
fixbug
2025-03-15 08:25:09 +00:00
{{ t("investor.financial_data.years.year2022") }}
添加投资者
2025-03-14 07:24:47 +00:00
</div>
</n-gi>
<n-gi>
<div
添加国际化
2025-03-15 08:10:26 +00:00
@click="handleYClick('Annual Report', '2021')"
class="cursor-pointer bg-[#F8F9FF] h-[47px] rounded-[4px] flex items-center justify-between p-10px text-[#8B59FA] text-[18px]">
fixbug
2025-03-15 08:25:09 +00:00
{{ t("investor.financial_data.years.year2021") }}
添加投资者
2025-03-14 07:24:47 +00:00
</div>
</n-gi>
<n-gi>
<div
class="font-bold bg-[#F8F9FF] h-[47px] rounded-[4px] flex items-center p-l-10px text-[#10263E] text-[18px]">
fixbug
2025-03-15 08:25:09 +00:00
{{ t("investor.financial_data.reports.annual_meeting") }}
添加投资者
2025-03-14 07:24:47 +00:00
</div>
</n-gi>
<n-gi>
<div
class="bg-[#F8F9FF] h-[47px] rounded-[4px] flex items-center justify-between p-10px text-[#9F9F9F] text-[18px]">
fixbug
2025-03-15 08:25:09 +00:00
{{ t("investor.financial_data.years.year2023") }}
添加投资者
2025-03-14 07:24:47 +00:00
</div>
</n-gi>
<n-gi>
<div
添加国际化
2025-03-15 08:10:26 +00:00
@click="handleYClick('Annual Meeting', '2022')"
class="cursor-pointer bg-[#F8F9FF] h-[47px] rounded-[4px] flex items-center justify-between p-10px text-[#8B59FA] text-[18px]">
fixbug
2025-03-15 08:25:09 +00:00
{{ t("investor.financial_data.years.year2022") }}
添加投资者
2025-03-14 07:24:47 +00:00
</div>
</n-gi>
<n-gi>
<div
添加国际化
2025-03-15 08:10:26 +00:00
@click="handleYClick('Annual Meeting', '2021')"
class="cursor-pointer bg-[#F8F9FF] h-[47px] rounded-[4px] flex items-center justify-between p-10px text-[#8B59FA] text-[18px]">
fixbug
2025-03-15 08:25:09 +00:00
{{ t("investor.financial_data.years.year2021") }}
添加投资者
2025-03-14 07:24:47 +00:00
</div>
</n-gi>
<n-gi>
<div
class="font-bold bg-[#F8F9FF] h-[47px] rounded-[4px] flex items-center p-l-10px text-[#10263E] text-[18px]">
fixbug
2025-03-15 08:25:09 +00:00
{{ t("investor.financial_data.reports.special_meeting") }}
添加投资者
2025-03-14 07:24:47 +00:00
</div>
</n-gi>
<n-gi>
<div
添加国际化
2025-03-15 08:10:26 +00:00
@click="handleYClick('Special Meeting', '2023')"
class="cursor-pointer bg-[#F8F9FF] h-[47px] rounded-[4px] flex items-center justify-between p-10px text-[#8B59FA] text-[18px]">
fixbug
2025-03-15 08:25:09 +00:00
{{ t("investor.financial_data.years.year2023") }}
添加投资者
2025-03-14 07:24:47 +00:00
</div>
</n-gi>
<n-gi>
<div
class="bg-[#F8F9FF] h-[47px] rounded-[4px] flex items-center justify-between p-10px text-[#9F9F9F] text-[18px]">
fixbug
2025-03-15 08:25:09 +00:00
{{ t("investor.financial_data.years.year2022") }}
添加投资者
2025-03-14 07:24:47 +00:00
</div>
</n-gi>
<n-gi>
<div
class="bg-[#F8F9FF] h-[47px] rounded-[4px] flex items-center justify-between p-10px text-[#9F9F9F] text-[18px]">
fixbug
2025-03-15 08:25:09 +00:00
{{ t("investor.financial_data.years.year2021") }}
添加投资者
2025-03-14 07:24:47 +00:00
</div>
</n-gi>
<n-gi>
<div
class="font-bold bg-[#F8F9FF] h-[47px] rounded-[4px] flex items-center p-l-10px text-[#10263E] text-[18px]">
fixbug
2025-03-15 08:25:09 +00:00
{{ t("investor.financial_data.reports.proxy_statement") }}
添加投资者
2025-03-14 07:24:47 +00:00
</div>
</n-gi>
<n-gi>
<div
class="bg-[#F8F9FF] h-[47px] rounded-[4px] flex items-center justify-between p-10px text-[#9F9F9F] text-[18px]">
fixbug
2025-03-15 08:25:09 +00:00
{{ t("investor.financial_data.years.year2023") }}
添加投资者
2025-03-14 07:24:47 +00:00
</div>
</n-gi>
<n-gi>
<div
添加国际化
2025-03-15 08:10:26 +00:00
@click="handleYClick('Proxy Statement', '2022')"
class="cursor-pointer bg-[#F8F9FF] h-[47px] rounded-[4px] flex items-center justify-between p-10px text-[#8B59FA] text-[18px]">
fixbug
2025-03-15 08:25:09 +00:00
{{ t("investor.financial_data.years.year2022") }}
添加投资者
2025-03-14 07:24:47 +00:00
</div>
</n-gi>
<n-gi>
<div
添加国际化
2025-03-15 08:10:26 +00:00
@click="handleYClick('Proxy Statement', '2021')"
class="cursor-pointer bg-[#F8F9FF] h-[47px] rounded-[4px] flex items-center justify-between p-10px text-[#8B59FA] text-[18px]">
fixbug
2025-03-15 08:25:09 +00:00
{{ t("investor.financial_data.years.year2021") }}
添加投资者
2025-03-14 07:24:47 +00:00
</div>
</n-gi>
</n-grid>
</div>
添加国际化
2025-03-15 08:10:26 +00:00
<div
@click="handleClick('https://ir.minim.com/contact')"
class="rounded-[24px] cursor-pointer justify-center w-[240px] pt-[3px] h-[47px] bg-[#8B59F7] text-[#fff] text-[18px] mt-[28px] ml-60% flex items-center float-up">
投资者
2025-03-15 07:10:58 +00:00
<div class="flex items-center">
fixbug
2025-03-15 08:25:09 +00:00
{{ t("investor.financial_data.investor_guide") }} <span class="ml-[20px]">></span>
添加投资者
2025-03-14 07:24:47 +00:00
</div>
投资者
2025-03-14 05:13:30 +00:00
</div>
</div>
</div>
<div class="content4 relative bg-[#fff] pb-[146px] overflow-hidden float-up">
<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 />
添加投资者
2025-03-14 07:24:47 +00:00
<img src="@/assets/image/tzls.png" alt="cl" />
投资者
2025-03-15 07:10:58 +00:00
<div class="absolute top-[86px] pl-[505px] pr-[490px] z-4 flex justify-between items-center">
添加投资者
2025-03-14 07:24:47 +00:00
<div class="w-[407px]">
<div class="w-52px h-7px bg-[#8B59F7]">
投资者
2025-03-14 05:13:30 +00:00
</div>
投资者
2025-03-15 07:10:58 +00:00
<div class="text-[#FFFFFF] text-[40px] mt-[17px] font-bold text-animate">
fixbug
2025-03-15 08:25:09 +00:00
{{ t("investor.market_trends.title") }}
投资者
2025-03-14 05:13:30 +00:00
</div>
添加投资者
2025-03-14 07:24:47 +00:00
投资者
2025-03-15 07:10:58 +00:00
<div class="text-[#D1D1D1] text-[14px] mt-[56px] max-w-[407px] text-animate">
fixbug
2025-03-15 08:25:09 +00:00
{{ t("investor.market_trends.sec_description1") }}
投资者
2025-03-14 05:13:30 +00:00
</div>
添加投资者
2025-03-14 07:24:47 +00:00
投资者
2025-03-15 07:10:58 +00:00
<div class="text-[#D1D1D1] text-[14px] mt-[20px] max-w-[407px] text-animate">
fixbug
2025-03-15 08:25:09 +00:00
{{ t("investor.market_trends.sec_description2") }}
投资者
2025-03-14 05:13:30 +00:00
</div>
添加国际化
2025-03-15 08:10:26 +00:00
<div
@click="handleClick('https://www.sec.gov/cgi-bin/browse-edgar?action=getcompany&CIK=0001467761&owner=include&count=40&hidefilings=0')"
class="rounded-[24px] cursor-pointer justify-center w-[240px] pt-[3px] h-[47px] bg-[#8B59F7] text-[#fff] text-[18px] mt-[28px] flex items-center float-up">
投资者
2025-03-15 07:10:58 +00:00
<div class="flex items-center">
fixbug
2025-03-15 08:25:09 +00:00
{{ t("investor.market_trends.view_all_sec") }} <span class="ml-[20px]">></span>
添加投资者
2025-03-14 07:24:47 +00:00
</div>
投资者
2025-03-14 05:13:30 +00:00
</div>
</div>
投资者
2025-03-15 07:10:58 +00:00
<div class="ml-[42px] image-animate">
添加投资者
2025-03-14 07:24:47 +00:00
<img class="w-[465px] h-[473px]" src="@/assets/image/dbs.png" alt="cl" />
</div>
</div>
<div class="pl-[505px] pr-[490px] z-4">
<div class="w-52px h-7px bg-[#8B59F7]">
</div>
投资者
2025-03-15 07:10:58 +00:00
<div class="text-[#10253E] text-[40px] mt-[17px] font-bold text-animate">
fixbug
2025-03-15 08:25:09 +00:00
{{ t("investor.board_of_directors.title") }}
投资者
2025-03-14 05:13:30 +00:00
</div>
投资者
2025-03-15 07:10:58 +00:00
<div class="flex items-center mt-[55px]">
<div class="w-[438px] h-[157px] relative float-up">
<img src="@/assets/image/pxr.png" alt="cl" />
fixbug
2025-03-15 08:25:09 +00:00
<div class="text-[#fff] text-[20px] font-bold absolute bottom-[50px] left-[18px]">{{ t("investor.board_of_directors.directors.patrick.name") }}</div>
<div class="text-[#EBEBEB] text-[16px] absolute bottom-[20px] left-[18px]">{{ t("investor.board_of_directors.directors.patrick.position") }}</div>
投资者
2025-03-15 07:10:58 +00:00
</div>
<div class="w-[438px] h-[157px] relative ml-[28px] float-up">
<img src="@/assets/image/bxr.png" alt="cl" />
fixbug
2025-03-15 08:25:09 +00:00
<div class="text-[#10253E] text-[20px] font-bold absolute bottom-[50px] left-[18px]">{{ t("investor.board_of_directors.directors.andrew.name") }}</div>
<div class="text-[#455363] text-[16px] absolute bottom-[20px] left-[18px]">{{ t("investor.board_of_directors.directors.andrew.position") }}</div>
投资者
2025-03-15 07:10:58 +00:00
</div>
</div>
投资者
2025-03-14 05:13:30 +00:00
</div>
</div>
<div class="content5 relative bg-[#F8F9FF] overflow-hidden float-up">
<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 />
投资者
2025-03-15 07:10:58 +00:00
<div class="mt-[93px] pb-[103px] carousel-container pl-[505px] pr-[490px] z-4">
<div class="w-52px h-7px bg-[#8B59F7]">
投资者
2025-03-14 05:13:30 +00:00
</div>
投资者
2025-03-15 07:10:58 +00:00
<div class="text-[#10253E] text-[40px] mt-[17px] font-bold text-animate">
fixbug
2025-03-15 08:25:09 +00:00
{{ t("investor.governance.title") }}
投资者
2025-03-14 05:13:30 +00:00
</div>
投资者
2025-03-15 07:10:58 +00:00
<div class="mt-[50px]">
<n-grid x-gap="15" y-gap="16" :cols="2">
<n-gi>
添加国际化
2025-03-15 08:10:26 +00:00
<div
@click="handleClick(state.linkArr[0].link)"
class="cursor-pointer w-438px h-37px bg-[#fff] rounded-[8px] flex items-center justify-between float-up">
投资者
2025-03-15 07:10:58 +00:00
<div class="flex items-center">
<div class="w-5px h-37px bg-[#C6ACFF]" style="border-radius: 8px 0 0 8px;"></div>
<div class="text-[#10253E] text-[18px] font-bold ml-[10px]">
fixbug
2025-03-15 08:25:09 +00:00
{{ t("investor.governance.documents.ethics_code") }}
投资者
2025-03-15 07:10:58 +00:00
</div>
</div>
<img class="w-[9px] h-[17px] mr-[15px]" src="@/assets/image/nstep.png" alt="cl" />
</div>
</n-gi>
<n-gi>
添加国际化
2025-03-15 08:10:26 +00:00
<div
@click="handleClick(state.linkArr[1].link)"
class="cursor-pointer w-438px h-37px bg-[#fff] rounded-[8px] flex items-center justify-between float-up">
投资者
2025-03-15 07:10:58 +00:00
<div class="flex items-center">
<div class="w-5px h-37px bg-[#C6ACFF]" style="border-radius: 8px 0 0 8px;"></div>
<div class="text-[#10253E] text-[18px] font-bold ml-[10px]">
fixbug
2025-03-15 08:25:09 +00:00
{{ t("investor.governance.documents.conflict_minerals") }}
投资者
2025-03-15 07:10:58 +00:00
</div>
</div>
<img class="w-[9px] h-[17px] mr-[15px]" src="@/assets/image/nstep.png" alt="cl" />
</div>
</n-gi>
投资者
2025-03-14 05:13:30 +00:00
投资者
2025-03-15 07:10:58 +00:00
<n-gi>
添加国际化
2025-03-15 08:10:26 +00:00
<div
@click="handleClick(state.linkArr[2].link)"
class="cursor-pointer w-438px h-37px bg-[#fff] rounded-[8px] flex items-center justify-between float-up">
投资者
2025-03-15 07:10:58 +00:00
<div class="flex items-center">
<div class="w-5px h-37px bg-[#C6ACFF]" style="border-radius: 8px 0 0 8px;"></div>
<div class="text-[#10253E] text-[18px] font-bold ml-[10px]">
fixbug
2025-03-15 08:25:09 +00:00
{{ t("investor.governance.documents.business_conduct") }}
投资者
2025-03-15 07:10:58 +00:00
</div>
</div>
<img class="w-[9px] h-[17px] mr-[15px]" src="@/assets/image/nstep.png" alt="cl" />
投资者
2025-03-14 05:13:30 +00:00
</div>
投资者
2025-03-15 07:10:58 +00:00
</n-gi>
<n-gi>
添加国际化
2025-03-15 08:10:26 +00:00
<div
@click="handleClick(state.linkArr[3].link)"
class="cursor-pointer w-438px h-37px bg-[#fff] rounded-[8px] flex items-center justify-between float-up">
投资者
2025-03-15 07:10:58 +00:00
<div class="flex items-center">
<div class="w-5px h-37px bg-[#C6ACFF]" style="border-radius: 8px 0 0 8px;"></div>
<div class="text-[#10253E] text-[18px] font-bold ml-[10px]">
fixbug
2025-03-15 08:25:09 +00:00
{{ t("investor.governance.documents.audit_committee") }}
投资者
2025-03-15 07:10:58 +00:00
</div>
</div>
<img class="w-[9px] h-[17px] mr-[15px]" src="@/assets/image/nstep.png" alt="cl" />
投资者
2025-03-14 05:13:30 +00:00
</div>
投资者
2025-03-15 07:10:58 +00:00
</n-gi>
<n-gi>
添加国际化
2025-03-15 08:10:26 +00:00
<div
@click="handleClick(state.linkArr[4].link)"
class="cursor-pointer w-438px h-37px bg-[#fff] rounded-[8px] flex items-center justify-between float-up">
投资者
2025-03-15 07:10:58 +00:00
<div class="flex items-center">
<div class="w-5px h-37px bg-[#C6ACFF]" style="border-radius: 8px 0 0 8px;"></div>
<div class="text-[#10253E] text-[18px] font-bold ml-[10px]">
fixbug
2025-03-15 08:25:09 +00:00
{{ t("investor.governance.documents.whistleblower") }}
投资者
2025-03-15 07:10:58 +00:00
</div>
</div>
<img class="w-[9px] h-[17px] mr-[15px]" src="@/assets/image/nstep.png" alt="cl" />
投资者
2025-03-14 05:13:30 +00:00
</div>
投资者
2025-03-15 07:10:58 +00:00
</n-gi>
<n-gi>
添加国际化
2025-03-15 08:10:26 +00:00
<div
@click="handleClick(state.linkArr[5].link)"
class="cursor-pointer w-438px h-37px bg-[#fff] rounded-[8px] flex items-center justify-between float-up">
投资者
2025-03-15 07:10:58 +00:00
<div class="flex items-center">
<div class="w-5px h-37px bg-[#C6ACFF]" style="border-radius: 8px 0 0 8px;"></div>
<div class="text-[#10253E] text-[18px] font-bold ml-[10px]">
fixbug
2025-03-15 08:25:09 +00:00
{{ t("investor.governance.documents.compensation_committee") }}
投资者
2025-03-15 07:10:58 +00:00
</div>
</div>
<img class="w-[9px] h-[17px] mr-[15px]" src="@/assets/image/nstep.png" alt="cl" />
投资者
2025-03-14 05:13:30 +00:00
</div>
投资者
2025-03-15 07:10:58 +00:00
</n-gi>
<n-gi>
添加国际化
2025-03-15 08:10:26 +00:00
<div
@click="handleClick(state.linkArr[6].link)"
class="cursor-pointer w-438px h-37px bg-[#fff] rounded-[8px] flex items-center justify-between float-up">
投资者
2025-03-15 07:10:58 +00:00
<div class="flex items-center">
<div class="w-5px h-37px bg-[#C6ACFF]" style="border-radius: 8px 0 0 8px;"></div>
<div class="text-[#10253E] text-[18px] font-bold ml-[10px]">
fixbug
2025-03-15 08:25:09 +00:00
{{ t("investor.governance.documents.related_party") }}
投资者
2025-03-15 07:10:58 +00:00
</div>
</div>
<img class="w-[9px] h-[17px] mr-[15px]" src="@/assets/image/nstep.png" alt="cl" />
投资者
2025-03-14 05:13:30 +00:00
</div>
投资者
2025-03-15 07:10:58 +00:00
</n-gi>
<n-gi>
添加国际化
2025-03-15 08:10:26 +00:00
<div
@click="handleClick(state.linkArr[7].link)"
class="cursor-pointer w-438px h-37px bg-[#fff] rounded-[8px] flex items-center justify-between float-up">
投资者
2025-03-15 07:10:58 +00:00
<div class="flex items-center">
<div class="w-5px h-37px bg-[#C6ACFF]" style="border-radius: 8px 0 0 8px;"></div>
<div class="text-[#10253E] text-[18px] font-bold ml-[10px]">
fixbug
2025-03-15 08:25:09 +00:00
{{ t("investor.governance.documents.nomination_committee") }}
投资者
2025-03-15 07:10:58 +00:00
</div>
</div>
<img class="w-[9px] h-[17px] mr-[15px]" src="@/assets/image/nstep.png" alt="cl" />
投资者
2025-03-14 05:13:30 +00:00
</div>
投资者
2025-03-15 07:10:58 +00:00
</n-gi>
投资者
2025-03-14 05:13:30 +00:00
投资者
2025-03-15 07:10:58 +00:00
<n-gi>
添加国际化
2025-03-15 08:10:26 +00:00
<div
@click="handleClick(state.linkArr[8].link)"
class="cursor-pointer w-438px h-37px bg-[#fff] rounded-[8px] flex items-center justify-between float-up">
投资者
2025-03-15 07:10:58 +00:00
<div class="flex items-center">
<div class="w-5px h-37px bg-[#C6ACFF]" style="border-radius: 8px 0 0 8px;"></div>
<div class="text-[#10253E] text-[18px] font-bold ml-[10px]">
fixbug
2025-03-15 08:25:09 +00:00
{{ t("investor.governance.documents.diversity_matrix_2022") }}
投资者
2025-03-15 07:10:58 +00:00
</div>
</div>
<img class="w-[9px] h-[17px] mr-[15px]" src="@/assets/image/nstep.png" alt="cl" />
</div>
</n-gi>
<n-gi>
添加国际化
2025-03-15 08:10:26 +00:00
<div
@click="handleClick(state.linkArr[9].link)"
class="cursor-pointer w-438px h-37px bg-[#fff] rounded-[8px] flex items-center justify-between float-up">
投资者
2025-03-15 07:10:58 +00:00
<div class="flex items-center">
<div class="w-5px h-37px bg-[#C6ACFF]" style="border-radius: 8px 0 0 8px;"></div>
<div class="text-[#10253E] text-[18px] font-bold ml-[10px]">
fixbug
2025-03-15 08:25:09 +00:00
{{ t("investor.governance.documents.diversity_matrix_2023") }}
投资者
2025-03-15 07:10:58 +00:00
</div>
</div>
<img class="w-[9px] h-[17px] mr-[15px]" src="@/assets/image/nstep.png" alt="cl" />
</div>
</n-gi>
</n-grid>
</div>
投资者
2025-03-14 05:13:30 +00:00
</div>
</div>
</div>
</main>
<footer>
<div class="footer-content">
<img class="copyright" src="@/assets/image/cp.png" alt="logo" />
</div>
</footer>
</template>
添加国际化
2025-03-15 08:10:26 +00:00
投资者
2025-03-14 05:13:30 +00:00
<style lang="scss" scoped>
.header {
width: 100%;
height: 65px;
display: flex;
justify-content: space-between;
align-items: flex-end;
position: fixed;
z-index: 10;
top: 0;
left: 0;
right: 0;
padding: 0 10rem;
padding-bottom: 10px;
}
.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;
}
}
.head {
width: 100%;
background-color: #f8f9ff;
img {
width: 100%;
height: 100%;
object-fit: cover;
image-rendering: -webkit-optimize-contrast;
image-rendering: crisp-edges;
-webkit-backface-visibility: hidden;
backface-visibility: hidden;
transform: translateZ(0);
-webkit-font-smoothing: antialiased;
-moz-osx-font-smoothing: grayscale;
}
}
.divider1 {
position: absolute;
z-index: 3;
left: 482px;
width: 1px;
height: 100vw;
background-color: rgba(230, 234, 238, 0.5) !important;
}
.divider2 {
position: absolute;
z-index: 3;
left: 720px;
width: 1px;
height: 100vw;
background-image: linear-gradient(to bottom,
rgba(230, 234, 238, 0.5),
transparent 50%);
background-size: 1px 12px; // 第一个值是宽度，第二个值是虚线的总长度（实线+空白）
background-repeat: repeat-y;
}
.divider3 {
position: absolute;
z-index: 3;
left: 952px;
width: 1px;
height: 100vw;
background-image: linear-gradient(to bottom,
rgba(230, 234, 238, 0.5),
transparent 50%);
background-size: 1px 12px; // 第一个值是宽度，第二个值是虚线的总长度（实线+空白）
background-repeat: repeat-y;
}
.divider4 {
position: absolute;
z-index: 3;
left: 1182px;
width: 1px;
height: 100vw;
background-image: linear-gradient(to bottom,
rgba(230, 234, 238, 0.5),
transparent 50%);
background-size: 1px 15px; // 第一个值是宽度，第二个值是虚线的总长度（实线+空白）
background-repeat: repeat-y;
}
.divider5 {
position: absolute;
z-index: 3;
left: 1406px;
width: 1px;
height: 100vw;
background-color: rgba(230, 234, 238, 0.5) !important;
}
.footer-content {
height: 90px;
display: flex;
justify-content: center;
align-items: center;
.copyright {
width: 232px;
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: 287px;
background-color: #fff;
margin-right: 18px;
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;
border-radius: 6px;
object-fit: cover;
display: block;
}
.carousel-content {
padding: 0;
margin-top: 10px;
}
.carousel-title {
font-size: 20px;
添加投资者
2025-03-14 07:24:47 +00:00
width: 100%;
align-items: end;
投资者
2025-03-14 05:13:30 +00:00
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;
}
// 添加一个通用的溢出控制类
.overflow-hidden {
overflow: hidden;
}
// 为所有可能需要动画的容器添加溢出隐藏
[ref*="moveRef"] {
position: relative;
}
.language-arrow {
font-size: 12px;
margin-left: 4px;
color: #10263E;
transition: transform 0.3s ease;
}
.tab-item:hover .language-arrow {
color: #8B59F7;
}
</style>
Reference in New Issue Copy Permalink