Compare commits

...

5 Commits

15 changed files with 1693 additions and 295 deletions

Binary file not shown.

After

Width:  |  Height:  |  Size: 1.1 KiB

View File

@ -1,8 +1,224 @@
export const fileList = [
{
filingDate:'Dec 05, 2019',
form:'10-K',
description:'Report of foreign issuer rules 13a-16 and 15d-16 of the Securities Exchange Act',
link:'https://www.sec.gov/Archives/edgar/data/1000000/0001000000-19-000001.txt'
}
]
filingDate:'2014-11-14',
form:'10-Q',
description:'QUARTERLY REPORT',
formDescription:'Quarterly report [Sections 13 or 15(d)]',
fileLink:'https://www.sec.gov/Archives/edgar/data/1467761/000135448814005722/zmtp_10q.htm',
dataFiles:[
{
description:'zmtp-20140930',
fileUrl:'https://www.sec.gov/Archives/edgar/data/1467761/000135448814005722/zmtp-20140930.xml'
},
{
description:'zmtp-20140930',
fileUrl:'https://www.sec.gov/Archives/edgar/data/1467761/000135448814005722/zmtp-20140930.xsd'
},
{
description:'zmtp-20140930_cal',
fileUrl:'https://www.sec.gov/Archives/edgar/data/1467761/000135448814005722/zmtp-20140930_cal.xml'
},
{
description:'zmtp-20140930_def',
fileUrl:'https://www.sec.gov/Archives/edgar/data/1467761/000135448814005722/zmtp-20140930_def.xml'
},
{
description:'zmtp-20140930_lab',
fileUrl:'https://www.sec.gov/Archives/edgar/data/1467761/000135448814005722/zmtp-20140930_lab.xml'
},
{
description:'zmtp-20140930_pre',
fileUrl:'https://www.sec.gov/Archives/edgar/data/1467761/000135448814005722/zmtp-20140930_pre.xml'
},
]
},
{
filingDate:'2014-11-14',
form:'10-Q',
description:'CERTIFICATION',
formDescription:'Quarterly report [Sections 13 or 15(d)]',
fileLink:'https://www.sec.gov/Archives/edgar/data/1467761/000135448814005722/zmtp_ex311.htm',
dataFiles:[
{
description:'zmtp-20140930',
fileUrl:'https://www.sec.gov/Archives/edgar/data/1467761/000135448814005722/zmtp-20140930.xml'
},
{
description:'zmtp-20140930',
fileUrl:'https://www.sec.gov/Archives/edgar/data/1467761/000135448814005722/zmtp-20140930.xsd'
},
{
description:'zmtp-20140930_cal',
fileUrl:'https://www.sec.gov/Archives/edgar/data/1467761/000135448814005722/zmtp-20140930_cal.xml'
},
{
description:'zmtp-20140930_def',
fileUrl:'https://www.sec.gov/Archives/edgar/data/1467761/000135448814005722/zmtp-20140930_def.xml'
},
{
description:'zmtp-20140930_lab',
fileUrl:'https://www.sec.gov/Archives/edgar/data/1467761/000135448814005722/zmtp-20140930_lab.xml'
},
{
description:'zmtp-20140930_pre',
fileUrl:'https://www.sec.gov/Archives/edgar/data/1467761/000135448814005722/zmtp-20140930_pre.xml'
},
]
},
{
filingDate:'2014-11-14',
form:'10-Q',
description:'CERTIFICATION',
formDescription:'Quarterly report [Sections 13 or 15(d)]',
fileLink:'https://www.sec.gov/Archives/edgar/data/1467761/000135448814005722/zmtp_ex321.htm',
dataFiles:[
{
description:'zmtp-20140930',
fileUrl:'https://www.sec.gov/Archives/edgar/data/1467761/000135448814005722/zmtp-20140930.xml'
},
{
description:'zmtp-20140930',
fileUrl:'https://www.sec.gov/Archives/edgar/data/1467761/000135448814005722/zmtp-20140930.xsd'
},
{
description:'zmtp-20140930_cal',
fileUrl:'https://www.sec.gov/Archives/edgar/data/1467761/000135448814005722/zmtp-20140930_cal.xml'
},
{
description:'zmtp-20140930_def',
fileUrl:'https://www.sec.gov/Archives/edgar/data/1467761/000135448814005722/zmtp-20140930_def.xml'
},
{
description:'zmtp-20140930_lab',
fileUrl:'https://www.sec.gov/Archives/edgar/data/1467761/000135448814005722/zmtp-20140930_lab.xml'
},
{
description:'zmtp-20140930_pre',
fileUrl:'https://www.sec.gov/Archives/edgar/data/1467761/000135448814005722/zmtp-20140930_pre.xml'
},
]
},
{
filingDate:'2014-10-31',
form:'8-K',
description:'CURRENT REPORT',
formDescription:'Current report, items 2.02 and 9.01',
fileLink:'https://www.sec.gov/Archives/edgar/data/1467761/000135448814005326/zmtp_8k.htm',
dataFiles:[]
},
{
filingDate:'2014-10-31',
form:'8-K',
description:'PRESS RELEASE',
formDescription:'Current report, items 2.02 and 9.01',
fileLink:'https://www.sec.gov/Archives/edgar/data/1467761/000135448814005326/zmtp_ex991.htm',
dataFiles:[]
},
{
filingDate:'2014-10-31',
form:'8-K',
description:'Current report, items 2.02 and 9.01',
formDescription:'Current report, items 2.02 and 9.01',
fileLink:'https://www.sec.gov/Archives/edgar/data/1467761/000135448814005326/logo.jpg',
dataFiles:[]
},
{
filingDate:'2014-08-14',
form:'10-Q',
description:'QUARTERLY REPORT',
formDescription:'Quarterly report [Sections 13 or 15(d)]',
fileLink:'https://www.sec.gov/Archives/edgar/data/1467761/000135448814005722/zmtp_10q.htm',
dataFiles:[
{
description:'zmtp-20140930',
fileUrl:'https://www.sec.gov/Archives/edgar/data/1467761/000135448814004188/zmtp-20140630.xml'
},
{
description:'zmtp-20140930',
fileUrl:'https://www.sec.gov/Archives/edgar/data/1467761/000135448814004188/zmtp-20140630.xsd'
},
{
description:'zmtp-20140930_cal',
fileUrl:'https://www.sec.gov/Archives/edgar/data/1467761/000135448814004188/zmtp-20140630_cal.xml'
},
{
description:'zmtp-20140930_def',
fileUrl:'https://www.sec.gov/Archives/edgar/data/1467761/000135448814004188/zmtp-20140630_def.xml'
},
{
description:'zmtp-20140930_lab',
fileUrl:'https://www.sec.gov/Archives/edgar/data/1467761/000135448814004188/zmtp-20140630_lab.xml'
},
{
description:'zmtp-20140930_pre',
fileUrl:'https://www.sec.gov/Archives/edgar/data/1467761/000135448814004188/zmtp-20140630_pre.xml'
},
]
},
{
filingDate:'2014-11-14',
form:'10-Q',
description:'CERTIFICATION',
formDescription:'Quarterly report [Sections 13 or 15(d)]',
fileLink:'https://www.sec.gov/Archives/edgar/data/1467761/000135448814005722/zmtp_ex311.htm',
dataFiles:[
{
description:'zmtp-20140930',
fileUrl:'https://www.sec.gov/Archives/edgar/data/1467761/000135448814004188/zmtp-20140630.xml'
},
{
description:'zmtp-20140930',
fileUrl:'https://www.sec.gov/Archives/edgar/data/1467761/000135448814004188/zmtp-20140630.xsd'
},
{
description:'zmtp-20140930_cal',
fileUrl:'https://www.sec.gov/Archives/edgar/data/1467761/000135448814004188/zmtp-20140630_cal.xml'
},
{
description:'zmtp-20140930_def',
fileUrl:'https://www.sec.gov/Archives/edgar/data/1467761/000135448814004188/zmtp-20140630_def.xml'
},
{
description:'zmtp-20140930_lab',
fileUrl:'https://www.sec.gov/Archives/edgar/data/1467761/000135448814004188/zmtp-20140630_lab.xml'
},
{
description:'zmtp-20140930_pre',
fileUrl:'https://www.sec.gov/Archives/edgar/data/1467761/000135448814004188/zmtp-20140630_pre.xml'
},
]
},
{
filingDate:'2014-11-14',
form:'10-Q',
description:'CERTIFICATION',
formDescription:'Quarterly report [Sections 13 or 15(d)]',
fileLink:'https://www.sec.gov/Archives/edgar/data/1467761/000135448814005722/zmtp_ex321.htm',
dataFiles:[
{
description:'zmtp-20140930',
fileUrl:'https://www.sec.gov/Archives/edgar/data/1467761/000135448814004188/zmtp-20140630.xml'
},
{
description:'zmtp-20140930',
fileUrl:'https://www.sec.gov/Archives/edgar/data/1467761/000135448814004188/zmtp-20140630.xsd'
},
{
description:'zmtp-20140930_cal',
fileUrl:'https://www.sec.gov/Archives/edgar/data/1467761/000135448814004188/zmtp-20140630_cal.xml'
},
{
description:'zmtp-20140930_def',
fileUrl:'https://www.sec.gov/Archives/edgar/data/1467761/000135448814004188/zmtp-20140630_def.xml'
},
{
description:'zmtp-20140930_lab',
fileUrl:'https://www.sec.gov/Archives/edgar/data/1467761/000135448814004188/zmtp-20140630_lab.xml'
},
{
description:'zmtp-20140930_pre',
fileUrl:'https://www.sec.gov/Archives/edgar/data/1467761/000135448814004188/zmtp-20140630_pre.xml'
},
]
},
]

15
src/dict/secTestData.js Normal file
View File

@ -0,0 +1,15 @@
export const fileList = [
{
filingDate: '2016-05-29',
form: '10-K',
description: 'Report of foreign issuer rules 13a-16 and 15d-16 of the Securities Exchange Act',
link: 'https://www.sec.gov/Archives/edgar/data/1000000/0001000000-19-000001.txt',
dataFiles:[
{
description: 'Report of foreign',
link: 'https://www.sec.gov/Archives/edgar/data/1000000/0001000000-19-000001.txt',
}
]
},
]

View File

@ -498,8 +498,8 @@ export default {
},
sec: {
title: "SEC Filings",
desc: "To Access All Of Our Fillings With Sec Sites, Please",
click_here: "Click Here",
desc: "To access all of our filings with the SEC, please",
click_here: "click here",
},
},
quarterlyresults: {

View File

@ -59,6 +59,12 @@ const routes = [
component: () =>
import("@/views/financialinformation/secfilings/index.vue"),
},
{
path: "/secfilingsDefail",
name: "SecFilingsDetail",
component: () =>
import("@/views/financialinformation/secfilingsdetail/index.vue"),
},
{
path: "/annualreports",
name: "AnnualReports",

View File

@ -2,10 +2,10 @@
import { computed } from "vue";
import { useWindowSize } from "@vueuse/core";
import size375 from "@/views/financialinformation/secfilings/size375/index.vue";
import size768 from "@/views/financialinformation/secfilings/size768/index.vue";
import size1440 from "@/views/financialinformation/secfilings/size1440/index.vue";
import size1920 from "@/views/financialinformation/secfilings/size1920/index.vue";
import size375 from "@/views/financialinformation/annualreports/size375/index.vue";
import size768 from "@/views/financialinformation/annualreports/size768/index.vue";
import size1440 from "@/views/financialinformation/annualreports/size1440/index.vue";
import size1920 from "@/views/financialinformation/annualreports/size1920/index.vue";
import { useRouter } from "vue-router";
import { useI18n } from "vue-i18n";

View File

@ -55,21 +55,6 @@
</div>
</div>
</section>
<!-- SEC文件 -->
<section class="section">
<div class="section-title">
{{ t("financialinformation.secfilings.sec.title") }}
</div>
<p class="sec-text">
{{ t("financialinformation.secfilings.sec.desc") }}
<a
href="https://www.sec.gov/cgi-bin/browse-edgar?company=FiEE&match=starts-with&filenum=&State=&Country=&SIC=&myowner=exclude&action=getcompany"
class="link"
>{{ t("financialinformation.secfilings.sec.click_here") }}</a
>.
</p>
</section>
</div>
</div>
</template>

View File

@ -1,183 +1,306 @@
<template>
<div class="page-container">
<div class="financials-container">
<div class="sec-filings-container">
<!-- 标题 -->
<div class="financials-title">
{{ t("financialinformation.secfilings.title") }}
<div class="page-title">SEC Filings</div>
<!-- 筛选器 -->
<div class="filters">
<div class="filter-group">
<label class="filter-label">Filing year</label>
<n-select
v-model:value="state.selectedYear"
:options="state.yearOptions"
placeholder="- Any -"
style="width: 150px"
clearable
@update:value="handleYearChange"
/>
</div>
<div class="filter-group">
<label class="filter-label">Items per page:</label>
<n-select
v-model:value="state.pageSize"
:options="state.pageSizeOptions"
style="width: 150px"
@update:value="handlePageSizeChange"
/>
</div>
</div>
<!-- 公司财务概览 -->
<section class="section">
<div class="section-title">
{{ t("financialinformation.secfilings.overview.title") }}
</div>
<p
class="overview-text"
v-html="t('financialinformation.secfilings.overview.desc')"
></p>
</section>
<!-- 表格 -->
<div class="table-container">
<n-data-table
:columns="columns"
:data="paginatedData"
:pagination="false"
:bordered="false"
:size="'medium'"
:row-key="(row) => row.filingDate"
/>
<!-- 年度报告 -->
<section class="section">
<div class="section-title">
{{ t("financialinformation.secfilings.annual_reports.title") }}
</div>
<!-- 分页器 -->
<div class="pagination-container">
<n-pagination
v-model:page="state.currentPage"
v-model:page-size="state.pageSize"
show-size-picker
show-quick-jumper
:item-count="filteredData.length"
:page-sizes="[10, 25, 50]"
@update:page="handlePageChange"
@update:page-size="handlePageSizeChange"
>
<template #prev>
<span> Previous</span>
</template>
<template #next>
<span>Next </span>
</template>
</n-pagination>
<!-- 报告表格 -->
<div class="reports-table">
<div class="table-header">
<div class="column file-name">
{{
t("financialinformation.secfilings.annual_reports.file_name")
}}
</div>
<div class="column date">
{{ t("financialinformation.secfilings.annual_reports.date") }}
</div>
<div class="column download"></div>
</div>
<!-- 报告列表 -->
<div class="reports-list">
<div
class="table-row"
v-for="(report, index) in annualReports"
:key="index"
>
<div class="column file-name">{{ report.fileName }}</div>
<div class="column date">{{ report.date }}</div>
<div class="column download">
<a :href="report.downloadUrl" class="download-link">{{
t("financialinformation.secfilings.annual_reports.view")
}}</a>
</div>
</div>
<div class="pagination-info">
Displaying {{ startIndex }} - {{ endIndex }} of
{{ filteredData.length }} results
</div>
</div>
</section>
<!-- SEC文件 -->
<section class="section">
<div class="section-title">
{{ t("financialinformation.secfilings.sec.title") }}
</div>
<p class="sec-text">
{{ t("financialinformation.secfilings.sec.desc") }}
<a
href="https://www.sec.gov/cgi-bin/browse-edgar?company=FiEE&match=starts-with&filenum=&State=&Country=&SIC=&myowner=exclude&action=getcompany"
class="link"
>{{ t("financialinformation.secfilings.sec.click_here") }}</a
>.
</p>
</section>
</div>
</div>
</div>
</template>
<script setup>
import { ref } from "vue";
import { reactive, computed, h, onMounted } from "vue";
import { NSelect, NDataTable, NPagination, NButton, NIcon } from "naive-ui";
import { useI18n } from "vue-i18n";
import { useRouter } from "vue-router";
import { fileList } from "@/dict/secTestData.js";
const { t } = useI18n();
//
const annualReports = ref([
const router = useRouter();
import iconLink from "@/assets/image/icon/icon-link.png";
// 使 reactive
const state = reactive({
selectedYear: null,
pageSize: 10,
currentPage: 1,
//
yearOptions: [
{ label: "- Any -", value: null },
{ label: "2025", value: 2025 },
{ label: "2024", value: 2024 },
{ label: "2023", value: 2023 },
{ label: "2022", value: 2022 },
{ label: "2021", value: 2021 },
{ label: "2020", value: 2020 },
{ label: "2019", value: 2019 },
{ label: "2018", value: 2018 },
],
//
pageSizeOptions: [
{ label: "10", value: 10 },
{ label: "25", value: 25 },
{ label: "50", value: 50 },
],
// SEC
secFilingsData: [],
});
onMounted(() => {
//
const monthNames = [
"Jan",
"Feb",
"Mar",
"Apr",
"May",
"Jun",
"Jul",
"Aug",
"Sep",
"Oct",
"Nov",
"Dec",
];
state.secFilingsData = fileList.map((item) => {
// filingDate
// 1. "Feb 04, 2019"
// 2. "2025-10-24" ISO
let year = null;
let formattedDate = item.filingDate;
if (item.filingDate) {
if (item.filingDate.includes(", ")) {
// "Feb 04, 2019"
year = parseInt(item.filingDate.split(", ")[1]);
} else if (item.filingDate.includes("-")) {
// "2025-10-24" "Oct 24, 2025"
const dateParts = item.filingDate.split("-");
const yearPart = parseInt(dateParts[0]);
const monthPart = parseInt(dateParts[1]);
const dayPart = parseInt(dateParts[2]);
year = yearPart;
const monthName = monthNames[monthPart - 1]; // 10
const dayFormatted = dayPart.toString().padStart(2, "0");
formattedDate = `${monthName} ${dayFormatted}, ${yearPart}`;
}
}
return {
...item,
formattedDate: formattedDate, //
year: year,
};
});
});
//
const columns = [
{
fileName: "2024 Annual Report",
date: "April 10, 2025",
downloadUrl:
"https://www.sec.gov/ix?doc=/Archives/edgar/data/1467761/000182912625002538/fieeinc_10k.htm",
title: "Filing Date",
key: "formattedDate",
sorter: true,
width: 150,
},
{
fileName: "2023 Annual Report",
date: "April 12, 2024",
downloadUrl:
"https://www.sec.gov/ix?doc=/Archives/edgar/data/1467761/000182912624002449/miniminc_10k.htm",
title: "Form",
key: "form",
width: 120,
render: (row) => {
return h(
"a",
{
href: "javascript:void(0)",
style: {
color: "#0078d7",
textDecoration: "none",
cursor: "pointer",
},
onClick: (e) => {
e.preventDefault();
router.push({
path: "/secfilingsDefail",
query: {
filingDate: row.filingDate,
},
});
},
onMouseover: (e) => {
e.target.style.textDecoration = "underline";
},
onMouseout: (e) => {
e.target.style.textDecoration = "none";
},
},
row.form
);
},
},
{
fileName: "2022 Annual Report",
date: "March 31, 2023",
downloadUrl:
"https://www.sec.gov/ix?doc=/Archives/edgar/data/1467761/000149315223010335/form10-k.htm",
title: "Description",
key: "description",
ellipsis: {
tooltip: true,
},
},
{
fileName: "2021 Annual Report",
date: "March 31, 2022",
downloadUrl:
"https://www.sec.gov/ix?doc=/Archives/edgar/data/1467761/000149315222008365/form10-k.htm",
title: "View",
key: "view",
width: 150,
render: (row) => {
return h(
"div",
{
style: {
display: "flex",
gap: "8px",
},
},
[
h(
"a",
{
href: row.link,
style: {
color: "#0078d7",
textDecoration: "none",
fontSize: "12px",
},
onMouseover: (e) => {
e.target.style.textDecoration = "underline";
},
onMouseout: (e) => {
e.target.style.textDecoration = "none";
},
},
h("img", {
src: iconLink,
alt: "link",
style: {
width: "24px",
height: "24px",
},
})
),
]
);
},
},
{
fileName: "2020 Annual Report",
date: "April 13, 2021",
downloadUrl:
"https://www.sec.gov/Archives/edgar/data/1467761/000165495421004133/zmtp_10k.htm",
},
{
fileName: "2019 Annual Report",
date: "April 15, 2020",
downloadUrl:
"https://www.sec.gov/Archives/edgar/data/1467761/000165495420004069/zmtp_10k.htm",
},
{
fileName: "2018 Annual Report",
date: "April 1, 2019",
downloadUrl:
"https://www.sec.gov/Archives/edgar/data/1467761/000165495419003878/zmtp_10k.htm",
},
{
fileName: "2017 Annual Report",
date: "March 30, 2018",
downloadUrl:
"https://www.sec.gov/Archives/edgar/data/1467761/000165495418003402/zmtp_10k.htm",
},
{
fileName: "2016 Annual Report",
date: "March 22, 2017",
downloadUrl:
"https://www.sec.gov/Archives/edgar/data/1467761/000165495417002279/zmtp_10k.htm",
},
{
fileName: "2015 Annual Report",
date: "March 15, 2016",
downloadUrl:
"https://www.sec.gov/Archives/edgar/data/1467761/000135448816006596/zmtp_10k.htm",
},
{
fileName: "2014 Annual Report",
date: "March 24, 2015",
downloadUrl:
"https://www.sec.gov/Archives/edgar/data/1467761/000135448815001308/zmtp_10k.htm",
},
{
fileName: "2013 Annual Report",
date: "March 31, 2014",
downloadUrl:
"https://www.sec.gov/Archives/edgar/data/1467761/000135448814001518/zmpt_10k.htm",
},
{
fileName: "2012 Annual Report",
date: "March 29, 2013",
downloadUrl:
"https://www.sec.gov/Archives/edgar/data/1467761/000135448813001584/zmtp_10k.htm",
},
{
fileName: "2011 Annual Report",
date: "March 30, 2012",
downloadUrl:
"https://www.sec.gov/Archives/edgar/data/1467761/000135448812001548/zoom_10k.htm",
},
{
fileName: "2010 Annual Report",
date: "March 29, 2011",
downloadUrl:
"https://www.sec.gov/Archives/edgar/data/1467761/000135448811000969/zmtp_10k.htm",
},
{
fileName: "2009 Annual Report",
date: "March 31, 2010",
downloadUrl:
"https://www.sec.gov/Archives/edgar/data/1467761/000135448810001043/zmtp_10k.htm",
},
]);
];
//
const filteredData = computed(() => {
let data = state.secFilingsData;
if (state.selectedYear) {
data = data.filter((item) => item.year === state.selectedYear);
}
return data;
});
//
const paginatedData = computed(() => {
const start = (state.currentPage - 1) * state.pageSize;
const end = start + state.pageSize;
return filteredData.value.slice(start, end);
});
//
const totalPages = computed(() => {
return Math.ceil(filteredData.value.length / state.pageSize);
});
//
const startIndex = computed(() => {
return (state.currentPage - 1) * state.pageSize + 1;
});
//
const endIndex = computed(() => {
const end = state.currentPage * state.pageSize;
return Math.min(end, filteredData.value.length);
});
//
const handleYearChange = (value) => {
state.selectedYear = value;
state.currentPage = 1;
};
//
const handlePageChange = (page) => {
state.currentPage = page;
};
//
const handlePageSizeChange = (size) => {
state.pageSize = size;
state.currentPage = 1;
};
</script>
<style scoped lang="scss">
@ -186,117 +309,104 @@ const annualReports = ref([
background-size: 100% 100%;
background-position: center;
background-repeat: no-repeat;
}
.financials-container {
max-width: 1200px;
margin: 0 auto;
min-height: 100vh;
padding: 20px;
}
.financials-title {
font-size: 40px;
text-align: center;
margin-bottom: 60px;
color: #333;
.sec-filings-container {
max-width: 1200px;
margin: 0 auto;
background: white;
padding: 40px;
}
.section {
margin-bottom: 60px;
.page-title {
font-size: 32px;
font-weight: bold;
color: #333;
margin-bottom: 40px;
}
.section-title {
font-size: 18px;
margin-bottom: 20px;
color: #333;
}
.overview-text {
font-size: 16px;
line-height: 1.6;
color: #333;
.filters {
display: flex;
gap: 40px;
margin-bottom: 30px;
align-items: end;
}
.tabs {
.filter-group {
display: flex;
margin-bottom: 20px;
flex-direction: column;
gap: 8px;
}
.tab {
padding: 10px 20px;
font-weight: bold;
cursor: pointer;
border-bottom: 2px solid transparent;
.filter-label {
font-size: 14px;
color: #333;
font-weight: 500;
}
&.active {
border-bottom: 2px solid #333;
.table-container {
.n-data-table {
--n-th-color: #f5f5f5;
--n-th-text-color: #333;
--n-td-color: #fff;
--n-border-color: #e0e0e0;
}
}
.reports-table {
width: 100%;
border-collapse: collapse;
}
.table-header {
.pagination-container {
display: flex;
padding: 10px 0;
border-bottom: 1px solid #ccc;
font-weight: bold;
justify-content: space-between;
}
.table-row {
display: flex;
padding: 15px 0;
border-bottom: 1px solid #eee;
align-items: center;
justify-content: space-between;
margin-top: 20px;
padding: 20px 0;
}
.reports-list {
// max-height: 600px;
// overflow-y: auto;
}
.column {
&.file-name {
width: 25%;
}
&.date {
width: 25%;
}
&.download {
width: 25%;
text-align: right;
margin-right: 50px;
.pagination-info {
font-size: 14px;
color: #666;
}
:deep(.n-data-table-th) {
background-color: #9e9e9e !important;
color: white !important;
font-weight: bold;
text-align: left;
}
:deep(.n-data-table-td) {
border-bottom: 1px solid #e0e0e0;
}
:deep(.n-data-table-tr:hover .n-data-table-td) {
background-color: #f9f9f9;
}
:deep(.n-select) {
.n-base-selection {
border: 1px solid #ccc;
border-radius: 4px;
}
}
.pdf-icon {
width: 36px;
height: 36px;
}
:deep(.n-pagination) {
.n-pagination-item {
border: 1px solid #ccc;
.download-link {
color: #0078d7;
text-decoration: none;
&:hover {
text-decoration: underline;
&.n-pagination-item--active {
background-color: #969696;
border-color: #969696;
color: white;
}
}
}
.sec-text {
font-size: 16px;
line-height: 1.6;
}
.n-pagination-quick-jumper {
font-size: 14px;
}
.link {
color: #f00;
text-decoration: none;
&:hover {
text-decoration: underline;
.n-pagination-sizes {
font-size: 14px;
}
}
</style>

View File

@ -55,21 +55,6 @@
</div>
</div>
</section>
<!-- SEC文件 -->
<section class="section">
<div class="section-title">
{{ t("financialinformation.secfilings.sec.title") }}
</div>
<p class="sec-text">
{{ t("financialinformation.secfilings.sec.desc") }}
<a
href="https://www.sec.gov/cgi-bin/browse-edgar?company=FiEE&match=starts-with&filenum=&State=&Country=&SIC=&myowner=exclude&action=getcompany"
class="link"
>{{ t("financialinformation.secfilings.sec.click_here") }}</a
>.
</p>
</section>
</div>
</div>
</template>

View File

@ -55,21 +55,6 @@
</div>
</div>
</section>
<!-- SEC文件 -->
<section class="section">
<div class="section-title">
{{ t("financialinformation.secfilings.sec.title") }}
</div>
<p class="sec-text">
{{ t("financialinformation.secfilings.sec.desc") }}
<a
href="https://www.sec.gov/cgi-bin/browse-edgar?company=FiEE&match=starts-with&filenum=&State=&Country=&SIC=&myowner=exclude&action=getcompany"
class="link"
>{{ t("financialinformation.secfilings.sec.click_here") }}</a
>.
</p>
</section>
</div>
</div>
</template>

View File

@ -0,0 +1,34 @@
<script setup>
import { computed } from "vue";
import { useWindowSize } from "@vueuse/core";
import size375 from "@/views/financialinformation/secfilingsdetail/size375/index.vue";
import size768 from "@/views/financialinformation/secfilingsdetail/size768/index.vue";
import size1440 from "@/views/financialinformation/secfilingsdetail/size1440/index.vue";
import size1920 from "@/views/financialinformation/secfilingsdetail/size1920/index.vue";
import { useRouter } from "vue-router";
import { useI18n } from "vue-i18n";
const router = useRouter();
const { width } = useWindowSize();
const { t } = useI18n();
const viewComponent = computed(() => {
const viewWidth = width.value;
if (viewWidth <= 450) {
return size375;
} else if (viewWidth <= 1100) {
return size768;
} else if (viewWidth <= 1500) {
return size1440;
} else if (viewWidth <= 1920 || viewWidth > 1920) {
return size1920;
}
});
</script>
<template>
<component :is="viewComponent" />
</template>
<style scoped lang="scss"></style>

View File

@ -0,0 +1,287 @@
<template>
<div class="page-container">
<div class="financials-container">
<!-- 标题 -->
<div class="financials-title">
{{ t("financialinformation.secfilings.title") }}
</div>
<!-- 公司财务概览 -->
<section class="section">
<div class="section-title">
{{ t("financialinformation.secfilings.overview.title") }}
</div>
<p
class="overview-text"
v-html="t('financialinformation.secfilings.overview.desc')"
></p>
</section>
<!-- 年度报告 -->
<section class="section">
<div class="section-title">
{{ t("financialinformation.secfilings.annual_reports.title") }}
</div>
<!-- 报告表格 -->
<div class="reports-table">
<div class="table-header">
<div class="column file-name">
{{
t("financialinformation.secfilings.annual_reports.file_name")
}}
</div>
<div class="column date">
{{ t("financialinformation.secfilings.annual_reports.date") }}
</div>
<div class="column download"></div>
</div>
<!-- 报告列表 -->
<div class="reports-list">
<div
class="table-row"
v-for="(report, index) in annualReports"
:key="index"
>
<div class="column file-name">{{ report.fileName }}</div>
<div class="column date">{{ report.date }}</div>
<div class="column download">
<a :href="report.downloadUrl" class="download-link">{{
t("financialinformation.secfilings.annual_reports.view")
}}</a>
</div>
</div>
</div>
</div>
</section>
</div>
</div>
</template>
<script setup>
import { ref } from "vue";
import { useI18n } from "vue-i18n";
const { t } = useI18n();
//
const annualReports = ref([
{
fileName: "2024 Annual Report",
date: "April 10, 2025",
downloadUrl:
"https://www.sec.gov/ix?doc=/Archives/edgar/data/1467761/000182912625002538/fieeinc_10k.htm",
},
{
fileName: "2023 Annual Report",
date: "April 12, 2024",
downloadUrl:
"https://www.sec.gov/ix?doc=/Archives/edgar/data/1467761/000182912624002449/miniminc_10k.htm",
},
{
fileName: "2022 Annual Report",
date: "March 31, 2023",
downloadUrl:
"https://www.sec.gov/ix?doc=/Archives/edgar/data/1467761/000149315223010335/form10-k.htm",
},
{
fileName: "2021 Annual Report",
date: "March 31, 2022",
downloadUrl:
"https://www.sec.gov/ix?doc=/Archives/edgar/data/1467761/000149315222008365/form10-k.htm",
},
{
fileName: "2020 Annual Report",
date: "April 13, 2021",
downloadUrl:
"https://www.sec.gov/Archives/edgar/data/1467761/000165495421004133/zmtp_10k.htm",
},
{
fileName: "2019 Annual Report",
date: "April 15, 2020",
downloadUrl:
"https://www.sec.gov/Archives/edgar/data/1467761/000165495420004069/zmtp_10k.htm",
},
{
fileName: "2018 Annual Report",
date: "April 1, 2019",
downloadUrl:
"https://www.sec.gov/Archives/edgar/data/1467761/000165495419003878/zmtp_10k.htm",
},
{
fileName: "2017 Annual Report",
date: "March 30, 2018",
downloadUrl:
"https://www.sec.gov/Archives/edgar/data/1467761/000165495418003402/zmtp_10k.htm",
},
{
fileName: "2016 Annual Report",
date: "March 22, 2017",
downloadUrl:
"https://www.sec.gov/Archives/edgar/data/1467761/000165495417002279/zmtp_10k.htm",
},
{
fileName: "2015 Annual Report",
date: "March 15, 2016",
downloadUrl:
"https://www.sec.gov/Archives/edgar/data/1467761/000135448816006596/zmtp_10k.htm",
},
{
fileName: "2014 Annual Report",
date: "March 24, 2015",
downloadUrl:
"https://www.sec.gov/Archives/edgar/data/1467761/000135448815001308/zmtp_10k.htm",
},
{
fileName: "2013 Annual Report",
date: "March 31, 2014",
downloadUrl:
"https://www.sec.gov/Archives/edgar/data/1467761/000135448814001518/zmpt_10k.htm",
},
{
fileName: "2012 Annual Report",
date: "March 29, 2013",
downloadUrl:
"https://www.sec.gov/Archives/edgar/data/1467761/000135448813001584/zmtp_10k.htm",
},
{
fileName: "2011 Annual Report",
date: "March 30, 2012",
downloadUrl:
"https://www.sec.gov/Archives/edgar/data/1467761/000135448812001548/zoom_10k.htm",
},
{
fileName: "2010 Annual Report",
date: "March 29, 2011",
downloadUrl:
"https://www.sec.gov/Archives/edgar/data/1467761/000135448811000969/zmtp_10k.htm",
},
{
fileName: "2009 Annual Report",
date: "March 31, 2010",
downloadUrl:
"https://www.sec.gov/Archives/edgar/data/1467761/000135448810001043/zmtp_10k.htm",
},
]);
</script>
<style scoped lang="scss">
.page-container {
background-image: url("@/assets/image/bg.png");
background-size: 100% 100%;
background-position: center;
background-repeat: no-repeat;
}
.financials-container {
max-width: 1200px;
margin: 0 auto;
padding: 20px;
}
.financials-title {
font-size: 40px;
text-align: center;
margin-bottom: 60px;
color: #333;
}
.section {
margin-bottom: 60px;
}
.section-title {
font-size: 18px;
margin-bottom: 20px;
color: #333;
}
.overview-text {
font-size: 16px;
line-height: 1.6;
color: #333;
margin-bottom: 30px;
}
.tabs {
display: flex;
margin-bottom: 20px;
}
.tab {
padding: 10px 20px;
font-weight: bold;
cursor: pointer;
border-bottom: 2px solid transparent;
&.active {
border-bottom: 2px solid #333;
}
}
.reports-table {
width: 100%;
border-collapse: collapse;
}
.table-header {
display: flex;
padding: 10px 0;
border-bottom: 1px solid #ccc;
font-weight: bold;
justify-content: space-between;
}
.table-row {
display: flex;
padding: 15px 0;
border-bottom: 1px solid #eee;
align-items: center;
justify-content: space-between;
}
.reports-list {
// max-height: 600px;
// overflow-y: auto;
}
.column {
&.file-name {
width: 25%;
}
&.date {
width: 25%;
}
&.download {
width: 25%;
text-align: right;
margin-right: 50px;
}
}
.pdf-icon {
width: 36px;
height: 36px;
}
.download-link {
color: #0078d7;
text-decoration: none;
&:hover {
text-decoration: underline;
}
}
.sec-text {
font-size: 16px;
line-height: 1.6;
}
.link {
color: #f00;
text-decoration: none;
&:hover {
text-decoration: underline;
}
}
</style>

View File

@ -0,0 +1,202 @@
<template>
<div class="page-container">
<div class="sec-filing-detail-container">
<!-- 标题 -->
<div class="page-title">SEC Filing Details</div>
<!-- Document Details 部分 -->
<div class="section">
<h2 class="section-title">Document Details</h2>
<div class="details-grid">
<div class="detail-item">
<span class="detail-label">Form:</span>
<a :href="filingData.htmlLink" class="detail-value link">{{
filingData.form
}}</a>
</div>
<div class="detail-item">
<span class="detail-label">Filing Date:</span>
<span class="detail-value">{{ filingData.filingDate }}</span>
</div>
<div class="detail-item">
<span class="detail-label">Form Description:</span>
<span class="detail-value">{{ filingData.formDescription }}</span>
</div>
<div class="detail-item">
<span class="detail-label">Company:</span>
<span class="detail-value">{{ filingData.company }}</span>
</div>
<div class="detail-item">
<span class="detail-label">Issuer:</span>
<span class="detail-value">{{ filingData.issuer }}</span>
</div>
</div>
</div>
<!-- Filing Formats 部分 -->
<div class="section">
<h2 class="section-title">Filing Formats</h2>
<div class="formats-list">
<div class="format-item">
<img :src="iconLink" alt="link" class="format-icon" />
<a :href="filingData.htmlLink" class="format-link" target="_blank"
>View HTML</a
>
</div>
</div>
</div>
<!-- XBRL 部分 -->
<div
v-if="
Array.isArray(filingData.dataFiles) && filingData.dataFiles.length > 0
"
class="section"
>
<h2 class="section-title">XBRL</h2>
<div class="formats-list">
<div
class="format-item"
v-for="(item, idx) in filingData.dataFiles"
:key="idx"
>
<img :src="iconLink" alt="link" class="format-icon" />
<a :href="item.fileUrl" class="format-link" target="_blank">{{
item.description
}}</a>
</div>
</div>
</div>
</div>
</div>
</template>
<script setup>
import { ref, onMounted } from "vue";
import iconLink from "@/assets/image/icon/icon-link.png";
import { fileList } from "@/dict/secTestData.js";
import { useRoute } from "vue-router";
// props
const filingData = ref({
form: "",
filingDate: "",
formDescription: "",
company: "",
issuer: "",
htmlLink: "#",
});
const route = useRoute();
onMounted(() => {
const { filingDate } = route.query;
const file = fileList.find((item) => item.filingDate === filingDate);
if (file) {
filingData.value = {
form: file.form,
filingDate: file.filingDate,
formDescription: file.description,
company: file.company,
issuer: file.issuer,
htmlLink: file.link || "#",
dataFiles: file.dataFiles || [],
};
}
console.log(filingData.value);
});
</script>
<style scoped lang="scss">
.page-container {
background-image: url("@/assets/image/bg.png");
background-size: 100% 100%;
background-position: center;
background-repeat: no-repeat;
min-height: 100vh;
padding: 20px;
}
.sec-filing-detail-container {
max-width: 1200px;
margin: 0 auto;
background: white;
padding: 40px;
}
.page-title {
font-size: 32px;
font-weight: bold;
color: #333;
margin-bottom: 40px;
}
.section {
margin-bottom: 40px;
}
.section-title {
font-size: 24px;
font-weight: bold;
color: #333;
margin-bottom: 20px;
}
.details-grid {
display: grid;
gap: 15px;
}
.detail-item {
display: flex;
align-items: flex-start;
gap: 10px;
}
.detail-label {
font-weight: bold;
color: #333;
min-width: 150px;
flex-shrink: 0;
}
.detail-value {
color: #333;
line-height: 1.5;
}
.link {
color: #0078d7;
text-decoration: underline;
cursor: pointer;
&:hover {
text-decoration: none;
}
}
.formats-list {
display: flex;
flex-direction: column;
gap: 10px;
}
.format-item {
display: flex;
align-items: center;
gap: 8px;
}
.format-icon {
width: 24px;
height: 24px;
}
.format-link {
color: #0078d7;
text-decoration: underline;
font-size: 14px;
&:hover {
text-decoration: none;
}
}
</style>

View File

@ -0,0 +1,286 @@
<template>
<div class="page-container">
<div class="financials-container">
<!-- 标题 -->
<div class="financials-title">
{{ t("financialinformation.secfilings.title") }}
</div>
<!-- 公司财务概览 -->
<section class="section">
<div class="section-title">
{{ t("financialinformation.secfilings.overview.title") }}
</div>
<p
class="overview-text"
v-html="t('financialinformation.secfilings.overview.desc')"
></p>
</section>
<!-- 年度报告 -->
<section class="section">
<div class="section-title">
{{ t("financialinformation.secfilings.annual_reports.title") }}
</div>
<!-- 报告表格 -->
<div class="reports-table">
<div class="table-header">
<div class="column file-name">
{{
t("financialinformation.secfilings.annual_reports.file_name")
}}
</div>
<div class="column date">
{{ t("financialinformation.secfilings.annual_reports.date") }}
</div>
<div class="column download"></div>
</div>
<!-- 报告列表 -->
<div class="reports-list">
<div
class="table-row"
v-for="(report, index) in annualReports"
:key="index"
>
<div class="column file-name">{{ report.fileName }}</div>
<div class="column date">{{ report.date }}</div>
<div class="column download">
<a :href="report.downloadUrl" class="download-link">{{
t("financialinformation.secfilings.annual_reports.view")
}}</a>
</div>
</div>
</div>
</div>
</section>
</div>
</div>
</template>
<script setup>
import { ref } from "vue";
import { useI18n } from "vue-i18n";
const { t } = useI18n();
//
const annualReports = ref([
{
fileName: "2024 Annual Report",
date: "April 10, 2025",
downloadUrl:
"https://www.sec.gov/ix?doc=/Archives/edgar/data/1467761/000182912625002538/fieeinc_10k.htm",
},
{
fileName: "2023 Annual Report",
date: "April 12, 2024",
downloadUrl:
"https://www.sec.gov/ix?doc=/Archives/edgar/data/1467761/000182912624002449/miniminc_10k.htm",
},
{
fileName: "2022 Annual Report",
date: "March 31, 2023",
downloadUrl:
"https://www.sec.gov/ix?doc=/Archives/edgar/data/1467761/000149315223010335/form10-k.htm",
},
{
fileName: "2021 Annual Report",
date: "March 31, 2022",
downloadUrl:
"https://www.sec.gov/ix?doc=/Archives/edgar/data/1467761/000149315222008365/form10-k.htm",
},
{
fileName: "2020 Annual Report",
date: "April 13, 2021",
downloadUrl:
"https://www.sec.gov/Archives/edgar/data/1467761/000165495421004133/zmtp_10k.htm",
},
{
fileName: "2019 Annual Report",
date: "April 15, 2020",
downloadUrl:
"https://www.sec.gov/Archives/edgar/data/1467761/000165495420004069/zmtp_10k.htm",
},
{
fileName: "2018 Annual Report",
date: "April 1, 2019",
downloadUrl:
"https://www.sec.gov/Archives/edgar/data/1467761/000165495419003878/zmtp_10k.htm",
},
{
fileName: "2017 Annual Report",
date: "March 30, 2018",
downloadUrl:
"https://www.sec.gov/Archives/edgar/data/1467761/000165495418003402/zmtp_10k.htm",
},
{
fileName: "2016 Annual Report",
date: "March 22, 2017",
downloadUrl:
"https://www.sec.gov/Archives/edgar/data/1467761/000165495417002279/zmtp_10k.htm",
},
{
fileName: "2015 Annual Report",
date: "March 15, 2016",
downloadUrl:
"https://www.sec.gov/Archives/edgar/data/1467761/000135448816006596/zmtp_10k.htm",
},
{
fileName: "2014 Annual Report",
date: "March 24, 2015",
downloadUrl:
"https://www.sec.gov/Archives/edgar/data/1467761/000135448815001308/zmtp_10k.htm",
},
{
fileName: "2013 Annual Report",
date: "March 31, 2014",
downloadUrl:
"https://www.sec.gov/Archives/edgar/data/1467761/000135448814001518/zmpt_10k.htm",
},
{
fileName: "2012 Annual Report",
date: "March 29, 2013",
downloadUrl:
"https://www.sec.gov/Archives/edgar/data/1467761/000135448813001584/zmtp_10k.htm",
},
{
fileName: "2011 Annual Report",
date: "March 30, 2012",
downloadUrl:
"https://www.sec.gov/Archives/edgar/data/1467761/000135448812001548/zoom_10k.htm",
},
{
fileName: "2010 Annual Report",
date: "March 29, 2011",
downloadUrl:
"https://www.sec.gov/Archives/edgar/data/1467761/000135448811000969/zmtp_10k.htm",
},
{
fileName: "2009 Annual Report",
date: "March 31, 2010",
downloadUrl:
"https://www.sec.gov/Archives/edgar/data/1467761/000135448810001043/zmtp_10k.htm",
},
]);
</script>
<style scoped lang="scss">
.page-container {
background-image: url("@/assets/image/bg-375.png");
background-size: 100% 100%;
background-position: center;
background-repeat: no-repeat;
}
.financials-container {
margin: 0 auto;
padding: 80px;
}
.financials-title {
font-size: 113px;
font-weight: 600;
text-align: center;
margin-bottom: 60px;
color: #333;
}
.section {
margin-bottom: 60px;
}
.section-title {
font-size: 92px;
font-weight: 600;
margin-bottom: 20px;
color: #333;
}
.overview-text {
font-size: 72px;
line-height: 1.6;
color: #333;
margin-bottom: 30px;
}
.tabs {
display: flex;
margin-bottom: 20px;
}
.tab {
padding: 10px 20px;
font-weight: bold;
cursor: pointer;
border-bottom: 2px solid transparent;
&.active {
border-bottom: 2px solid #333;
}
}
.reports-table {
width: 100%;
border-collapse: collapse;
}
.table-header {
display: flex;
padding: 10px 0;
border-bottom: 1px solid #ccc;
font-weight: bold;
justify-content: space-between;
}
.table-row {
display: flex;
padding: 45px 0;
border-bottom: 1px solid #eee;
align-items: center;
justify-content: space-between;
}
.reports-list {
// max-height: 600px;
// overflow-y: auto;
}
.column {
&.file-name {
width: 35%;
}
&.date {
width: 35%;
}
&.download {
margin-right: 100px;
}
}
.pdf-icon {
width: 36px;
height: 36px;
}
.download-link {
color: #0078d7;
text-decoration: none;
&:hover {
text-decoration: underline;
}
}
.sec-text {
font-size: 72px;
line-height: 1.6;
}
.link {
color: #f00;
text-decoration: none;
&:hover {
text-decoration: underline;
}
}
</style>

View File

@ -0,0 +1,287 @@
<template>
<div class="page-container">
<div class="financials-container">
<!-- 标题 -->
<div class="financials-title">
{{ t("financialinformation.secfilings.title") }}
</div>
<!-- 公司财务概览 -->
<section class="section">
<div class="section-title">
{{ t("financialinformation.secfilings.overview.title") }}
</div>
<p
class="overview-text"
v-html="t('financialinformation.secfilings.overview.desc')"
></p>
</section>
<!-- 年度报告 -->
<section class="section">
<div class="section-title">
{{ t("financialinformation.secfilings.annual_reports.title") }}
</div>
<!-- 报告表格 -->
<div class="reports-table">
<div class="table-header">
<div class="column file-name">
{{
t("financialinformation.secfilings.annual_reports.file_name")
}}
</div>
<div class="column date">
{{ t("financialinformation.secfilings.annual_reports.date") }}
</div>
<div class="column download"></div>
</div>
<!-- 报告列表 -->
<div class="reports-list">
<div
class="table-row"
v-for="(report, index) in annualReports"
:key="index"
>
<div class="column file-name">{{ report.fileName }}</div>
<div class="column date">{{ report.date }}</div>
<div class="column download">
<a :href="report.downloadUrl" class="download-link">{{
t("financialinformation.secfilings.annual_reports.view")
}}</a>
</div>
</div>
</div>
</div>
</section>
</div>
</div>
</template>
<script setup>
import { ref } from "vue";
import { useI18n } from "vue-i18n";
const { t } = useI18n();
//
const annualReports = ref([
{
fileName: "2024 Annual Report",
date: "April 10, 2025",
downloadUrl:
"https://www.sec.gov/ix?doc=/Archives/edgar/data/1467761/000182912625002538/fieeinc_10k.htm",
},
{
fileName: "2023 Annual Report",
date: "April 12, 2024",
downloadUrl:
"https://www.sec.gov/ix?doc=/Archives/edgar/data/1467761/000182912624002449/miniminc_10k.htm",
},
{
fileName: "2022 Annual Report",
date: "March 31, 2023",
downloadUrl:
"https://www.sec.gov/ix?doc=/Archives/edgar/data/1467761/000149315223010335/form10-k.htm",
},
{
fileName: "2021 Annual Report",
date: "March 31, 2022",
downloadUrl:
"https://www.sec.gov/ix?doc=/Archives/edgar/data/1467761/000149315222008365/form10-k.htm",
},
{
fileName: "2020 Annual Report",
date: "April 13, 2021",
downloadUrl:
"https://www.sec.gov/Archives/edgar/data/1467761/000165495421004133/zmtp_10k.htm",
},
{
fileName: "2019 Annual Report",
date: "April 15, 2020",
downloadUrl:
"https://www.sec.gov/Archives/edgar/data/1467761/000165495420004069/zmtp_10k.htm",
},
{
fileName: "2018 Annual Report",
date: "April 1, 2019",
downloadUrl:
"https://www.sec.gov/Archives/edgar/data/1467761/000165495419003878/zmtp_10k.htm",
},
{
fileName: "2017 Annual Report",
date: "March 30, 2018",
downloadUrl:
"https://www.sec.gov/Archives/edgar/data/1467761/000165495418003402/zmtp_10k.htm",
},
{
fileName: "2016 Annual Report",
date: "March 22, 2017",
downloadUrl:
"https://www.sec.gov/Archives/edgar/data/1467761/000165495417002279/zmtp_10k.htm",
},
{
fileName: "2015 Annual Report",
date: "March 15, 2016",
downloadUrl:
"https://www.sec.gov/Archives/edgar/data/1467761/000135448816006596/zmtp_10k.htm",
},
{
fileName: "2014 Annual Report",
date: "March 24, 2015",
downloadUrl:
"https://www.sec.gov/Archives/edgar/data/1467761/000135448815001308/zmtp_10k.htm",
},
{
fileName: "2013 Annual Report",
date: "March 31, 2014",
downloadUrl:
"https://www.sec.gov/Archives/edgar/data/1467761/000135448814001518/zmpt_10k.htm",
},
{
fileName: "2012 Annual Report",
date: "March 29, 2013",
downloadUrl:
"https://www.sec.gov/Archives/edgar/data/1467761/000135448813001584/zmtp_10k.htm",
},
{
fileName: "2011 Annual Report",
date: "March 30, 2012",
downloadUrl:
"https://www.sec.gov/Archives/edgar/data/1467761/000135448812001548/zoom_10k.htm",
},
{
fileName: "2010 Annual Report",
date: "March 29, 2011",
downloadUrl:
"https://www.sec.gov/Archives/edgar/data/1467761/000135448811000969/zmtp_10k.htm",
},
{
fileName: "2009 Annual Report",
date: "March 31, 2010",
downloadUrl:
"https://www.sec.gov/Archives/edgar/data/1467761/000135448810001043/zmtp_10k.htm",
},
]);
</script>
<style scoped lang="scss">
.page-container {
background-image: url("@/assets/image/bg.png");
background-size: 100% 100%;
background-position: center;
background-repeat: no-repeat;
}
.financials-container {
max-width: calc(100% - 300px);
margin: 0 auto;
padding: 20px;
}
.financials-title {
font-size: 85px;
text-align: center;
margin-bottom: 60px;
color: #333;
}
.section {
margin-bottom: 60px;
}
.section-title {
font-size: 50px;
margin-bottom: 20px;
color: #333;
}
.overview-text {
font-size: 40px;
line-height: 1.6;
color: #333;
margin-bottom: 30px;
}
.tabs {
display: flex;
margin-bottom: 20px;
}
.tab {
padding: 10px 20px;
font-weight: bold;
cursor: pointer;
border-bottom: 2px solid transparent;
&.active {
border-bottom: 2px solid #333;
}
}
.reports-table {
width: 100%;
border-collapse: collapse;
}
.table-header {
display: flex;
padding: 10px 0;
border-bottom: 1px solid #ccc;
font-weight: bold;
justify-content: space-between;
}
.table-row {
display: flex;
padding: 15px 0;
border-bottom: 1px solid #eee;
align-items: center;
justify-content: space-between;
}
.reports-list {
// max-height: 600px;
// overflow-y: auto;
}
.column {
&.file-name {
width: 25%;
}
&.date {
width: 25%;
}
&.download {
width: 25%;
text-align: right;
margin-right: 50px;
}
}
.pdf-icon {
width: 36px;
height: 36px;
}
.download-link {
color: #0078d7;
text-decoration: none;
&:hover {
text-decoration: underline;
}
}
.sec-text {
font-size: 40px;
line-height: 1.6;
}
.link {
color: #f00;
text-decoration: none;
&:hover {
text-decoration: underline;
}
}
</style>