Merge branch 'zhangyuanshan-20250925' into newmain-20250926

src/components/customEcharts/size1920/index.vue

@@ -140,7 +140,7 @@ const initEcharts = (data) => {
         sampling: "lttb",
         symbol: "none",
         lineStyle: {
-          color: "#2c6288",
+          color: "#CC346C",
         },
         areaStyle: {
           color: {
@@ -152,7 +152,7 @@ const initEcharts = (data) => {
             colorStops: [
               {
                 offset: 0,
-                color: "#2c6288",
+                color: "#CC346C",
               },
               {
                 offset: 1,
@@ -198,7 +198,7 @@ const initEcharts = (data) => {
         show: true,
         dataBackground: {
           lineStyle: {
-            color: "#2C6288",
+            color: "#CC346C",
           },
           areaStyle: {
             color: {
@@ -208,7 +208,7 @@ const initEcharts = (data) => {
               x2: 0,
               y2: 1,
               colorStops: [
-                { offset: 1, color: "#2c6288" },
+                { offset: 1, color: "#CC346C" },
                 { offset: 0, color: "#F4F6F8" },
               ],
             },
@@ -216,7 +216,7 @@ const initEcharts = (data) => {
         },
         selectedDataBackground: {
           lineStyle: {
-            color: "#2C6288",
+            color: "#CC346C",
           },
           areaStyle: {
             color: {
@@ -226,7 +226,7 @@ const initEcharts = (data) => {
               x2: 0,
               y2: 1,
               colorStops: [
-                { offset: 1, color: "#2c6288" },
+                { offset: 1, color: "#CC346C" },
                 { offset: 0, color: "#F4F6F8" },
               ],
             },
@@ -571,7 +571,7 @@ const handleDateRangeChange = (range) => {
     }
 
     .echarts-search-area {
-      padding: 2rem 0 0;
+      padding: 0 16px 32px 16px;
       display: flex;
       flex-direction: row;
       align-items: center;

src/router/index.js

@@ -30,31 +30,31 @@ const routes = [
       {
         path: "/stock-quote",
         name: "stock-quote",
-        meta: { bg:'url("@/assets/image/bg-stock-quote.png")' },
+        meta: { bg:'url("@/assets/image/1920/bg-stock-quote.png")' },
         component: () => import("@/views/stock-quote/index.vue"),
       },
       {
         path: "/historic-stock",
         name: "historic-stock",
-        meta: { bg: 'url("@/assets/image/bg-events-calendar.png")' },
+        meta: { bg: 'url("@/assets/image/1920/bg-events-calendar.png")' },
         component: () => import("@/views/historic-stock/index.vue"),
       },
       {
         path: "/contacts",
         name: "contacts",
-        meta: { bg: 'url("@/assets/image/bg-contacts.png")' },
+        meta: { bg: 'url("@/assets/image/1920/bg-contacts.png")' },
         component: () => import("@/views/contacts/index.vue"),
       },
       {
         path: "/email-alerts",
         name: "email-alerts",
-        meta: { bg: 'url("@/assets/image/bg-contacts.png")' },
+        meta: { bg: 'url("@/assets/image/1920/bg-contacts.png")' },
         component: () => import("@/views/email-alerts/index.vue"),
       },
       {
         path: "/quarterlyreports",
         name: "quarterlyreports",
-        meta: { bg: 'url("@/assets/image/bg-events-calendar.png")' },
+        meta: { bg: 'url("@/assets/image/1920/bg-events-calendar.png")' },
         component: () =>
           import("@/views/financialinformation/quarterlyreports/index.vue"),
       },
@@ -73,26 +73,26 @@ const routes = [
       {
         path: "/annualreports",
         name: "AnnualReports",
-        meta: { bg: 'url("@/assets/image/bg-events-calendar.png")' },
+        meta: { bg: 'url("@/assets/image/1920/bg-events-calendar.png")' },
         component: () =>
           import("@/views/financialinformation/annualreports/index.vue"),
       },
       {
         path: "/press-releases",
         name: "press-releases",
-        meta: { bg: 'url("@/assets/image/bg-events-calendar.png")' },
+        meta: { bg: 'url("@/assets/image/1920/bg-events-calendar.png")' },
         component: () => import("@/views/press-releases/index.vue"),
       },
       {
         path: "/news",
         name: "news",
-        meta: { bg: 'url("@/assets/image/bg-news.png")' },
+        meta: { bg: 'url("@/assets/image/1920/bg-news.png")' },
         component: () => import("@/views/news/index.vue"),
       },
       {
         path: "/events-calendar",
         name: "events-calendar",
-        meta: { bg: 'url("@/assets/image/bg-events-calendar.png")' },
+        meta: { bg: 'url("@/assets/image/1920/bg-events-calendar.png")' },
         component: () => import("@/views/events-calendar/index.vue"),
       },
       {

src/views/contacts/size1920/index.vue

@@ -69,7 +69,7 @@ function copyEmail() {
   gap: 4px;
   background-color: white;
   border-radius: 1rem;
-  background-image: url("@/assets/image/contacts-bg.png");
+  background-image: url("@/assets/image/1920/contacts-bg.png");
   background-size: 64% auto;
   background-position: center;
   background-repeat: no-repeat;

src/views/email-alerts/size1920/index.vue

@@ -240,7 +240,7 @@ async function handleSubmit(e) {
   left: 0;
   width: 100%;
   height: 100%;
-  background-image: url("@/assets/image/email-alerts-submit.png");
+  background-image: url("@/assets/image/1920/email-alerts-submit.png");
   background-repeat: no-repeat;
   background-position: bottom;
   background-size: 100%;

src/views/events-calendar/size1920/index.vue

@@ -79,7 +79,7 @@
         <!-- 背景图片区域 -->
         <div class="background-image-container">
           <img
-            src="@/assets/image/events-calendar-bg.png"
+            src="@/assets/image/1920/events-calendar-bg.png"
             alt="Events Calendar Background"
             class="background-image"
           />

src/views/financialinformation/annualreports/size1920/index.vue

@@ -1,12 +1,9 @@
 <template>
   <div class="page-container">
     <div class="financials-container">
-      <!-- 标题区域 -->
+      <!-- 标题 -->
-      <div class="title-section">
+      <div class="financials-title">
-        <div class="title-decoration"></div>
+        {{ t("financialinformation.secfilings.title") }}
-        <div class="financials-title">
-          {{ t("financialinformation.secfilings.title") }}
-        </div>
       </div>
 
       <!-- 公司财务概览 -->
@@ -37,7 +34,7 @@
             <div class="column date">
               {{ t("financialinformation.secfilings.annual_reports.date") }}
             </div>
-            <div class="column download">view</div>
+            <div class="column download"></div>
           </div>
 
           <!-- 报告列表 -->
@@ -50,158 +47,31 @@
               <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">
+                <a :href="report.downloadUrl" class="download-link">{{
-                  <img src="/src/assets/image/icon-link-svg.svg" alt="View" />
+                  t("financialinformation.secfilings.annual_reports.view")
-                </a>
+                }}</a>
               </div>
             </div>
           </div>
         </div>
       </section>
-
-      <!-- 分页器 -->
-      <div class="pagination-container">
-        <div class="pagination-info">
-          Displaying {{ displayRange.start }} - {{ displayRange.end }} of
-          {{ state.total }} results
-        </div>
-        <div class="pagination-controls">
-          <div class="pagination-buttons">
-            <button
-              class="page-btn prev-btn"
-              :disabled="state.currentPage === 1"
-              @click="goToPrevPage"
-            >
-              <svg width="5" height="9" viewBox="0 0 5 9" fill="none">
-                <path
-                  d="M4 1L1 4.5L4 8"
-                  stroke="#455363"
-                  stroke-width="1.5"
-                  stroke-linecap="round"
-                  stroke-linejoin="round"
-                />
-              </svg>
-            </button>
-
-            <!-- 动态生成页码按钮 -->
-            <template v-for="page in getVisiblePages()" :key="page">
-              <button
-                v-if="page !== '...'"
-                class="page-btn"
-                :class="{ active: page === state.currentPage }"
-                @click="goToPage(page)"
-              >
-                {{ page }}
-              </button>
-              <button v-else class="page-btn disabled" disabled>...</button>
-            </template>
-
-            <button
-              class="page-btn next-btn"
-              :disabled="state.currentPage === totalPages"
-              @click="goToNextPage"
-            >
-              <svg width="5" height="9" viewBox="0 0 5 9" fill="none">
-                <path
-                  d="M1 1L4 4.5L1 8"
-                  stroke="#455363"
-                  stroke-width="1.5"
-                  stroke-linecap="round"
-                  stroke-linejoin="round"
-                />
-              </svg>
-            </button>
-          </div>
-          <div class="page-size-selector" @click="togglePageSizeMenu">
-            <span>{{ state.pageSize }}/page</span>
-            <svg width="10" height="5" viewBox="0 0 10 5" fill="none">
-              <path
-                d="M1 1L5 4L9 1"
-                stroke="#455363"
-                stroke-width="1.5"
-                stroke-linecap="round"
-                stroke-linejoin="round"
-              />
-            </svg>
-            <!-- 页面大小选择菜单 -->
-            <div v-if="showPageSizeMenu" class="page-size-menu">
-              <div
-                v-for="size in [10, 20, 50]"
-                :key="size"
-                class="page-size-option"
-                :class="{ active: state.pageSize === size }"
-                @click="changePageSize(size)"
-              >
-                {{ size }}/page
-              </div>
-            </div>
-          </div>
-          <div class="goto-section">
-            <span>Goto</span>
-            <input
-              type="number"
-              v-model="state.gotoPage"
-              class="goto-input"
-              :min="1"
-              :max="totalPages"
-              @keyup.enter="handleGoto"
-            />
-          </div>
-        </div>
-      </div>
     </div>
   </div>
 </template>
 
 <script setup>
-import { ref, reactive, computed, watch, onMounted, onUnmounted } from "vue";
+import { ref } from "vue";
 import { useI18n } from "vue-i18n";
 
 const { t } = useI18n();
-
-// 分页状态
-const state = reactive({
-  currentPage: 1,
-  pageSize: 10,
-  total: 0,
-  gotoPage: 1,
-});
-
-// 页面大小选择菜单显示状态
-const showPageSizeMenu = ref(false);
-
 // 年度报告数据
-const allAnnualReports = ref([
+const annualReports = ref([
-  {
-    fileName: "2024 Annual Report Amendment No.2",
-    date: "August 20, 2025",
-    downloadUrl:
-      "https://www.sec.gov/ix?doc=/Archives/edgar/data/1467761/000182912625006571/fieeinc_10ka.htm",
-  },
-  {
-    fileName: "2024 Annual Report Amendment No.1",
-    date: "April 30, 2025",
-    downloadUrl:
-      "https://www.sec.gov/ix?doc=/Archives/edgar/data/1467761/000182912625003214/fieeinc_10ka.htm",
-  },
   {
     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 Amendment",
-    date: "July 28, 2025",
-    downloadUrl:
-      "https://www.sec.gov/ix?doc=/Archives/edgar/data/1467761/000182912625005429/fieeinc_10ka.htm",
-  },
-  {
-    fileName: "2023 Annual Report Amendment No.1",
-    date: "April 29, 2024",
-    downloadUrl:
-      "https://www.sec.gov/ix?doc=/Archives/edgar/data/1467761/000182912624002836/miniminc_10ka.htm",
-  },
   {
     fileName: "2023 Annual Report",
     date: "April 12, 2024",
@@ -214,48 +84,24 @@ const allAnnualReports = ref([
     downloadUrl:
       "https://www.sec.gov/ix?doc=/Archives/edgar/data/1467761/000149315223010335/form10-k.htm",
   },
-  {
-    fileName: "2021 Annual Report Amendment No.1",
-    date: "August 19, 2022",
-    downloadUrl:
-      "https://www.sec.gov/ix?doc=/Archives/edgar/data/1467761/000149315222023610/form10ka.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 Amendment No.1",
-    date: "April 29, 2021",
-    downloadUrl:
-      "https://www.sec.gov/Archives/edgar/data/1467761/000114036121015017/brhc10023805_10ka.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 Amendment No.1",
-    date: " April 29, 2020",
-    downloadUrl:
-      "https://www.sec.gov/Archives/edgar/data/1467761/000165495420004635/zmtp_10ka.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 Amendment No.1",
-    date: "April 30, 2019",
-    downloadUrl:
-      "https://www.sec.gov/Archives/edgar/data/1467761/000165495419005031/zmtp_10ka.htm",
-  },
   {
     fileName: "2018 Annual Report",
     date: "April 1, 2019",
@@ -317,199 +163,43 @@ const allAnnualReports = ref([
       "https://www.sec.gov/Archives/edgar/data/1467761/000135448810001043/zmtp_10k.htm",
   },
 ]);
-
-// 初始化总数
-state.total = allAnnualReports.value.length;
-
-// 计算当前页显示的数据
-const annualReports = computed(() => {
-  const start = (state.currentPage - 1) * state.pageSize;
-  const end = start + state.pageSize;
-  return allAnnualReports.value.slice(start, end);
-});
-
-// 计算总页数
-const totalPages = computed(() => {
-  return Math.ceil(state.total / state.pageSize);
-});
-
-// 计算显示范围
-const displayRange = computed(() => {
-  const start = (state.currentPage - 1) * state.pageSize + 1;
-  const end = Math.min(state.currentPage * state.pageSize, state.total);
-  return { start, end };
-});
-
-// 分页方法
-const goToPage = (page) => {
-  if (page >= 1 && page <= totalPages.value) {
-    state.currentPage = page;
-  }
-};
-
-const goToPrevPage = () => {
-  if (state.currentPage > 1) {
-    state.currentPage--;
-  }
-};
-
-const goToNextPage = () => {
-  if (state.currentPage < totalPages.value) {
-    state.currentPage++;
-  }
-};
-
-const changePageSize = (size) => {
-  state.pageSize = size;
-  state.currentPage = 1; // 重置到第一页
-};
-
-const handleGoto = () => {
-  const page = parseInt(state.gotoPage);
-  if (page >= 1 && page <= totalPages.value) {
-    state.currentPage = page;
-  }
-};
-
-// 切换页面大小选择菜单
-const togglePageSizeMenu = () => {
-  showPageSizeMenu.value = !showPageSizeMenu.value;
-};
-
-// 获取可见的页码数组
-const getVisiblePages = () => {
-  const current = state.currentPage;
-  const total = totalPages.value;
-  const pages = [];
-
-  if (total <= 7) {
-    // 如果总页数小于等于7，显示所有页码
-    for (let i = 1; i <= total; i++) {
-      pages.push(i);
-    }
-  } else {
-    // 显示第一页
-    pages.push(1);
-
-    if (current <= 4) {
-      // 当前页在前4页
-      for (let i = 2; i <= 5; i++) {
-        pages.push(i);
-      }
-      pages.push("...");
-      pages.push(total);
-    } else if (current >= total - 3) {
-      // 当前页在后4页
-      pages.push("...");
-      for (let i = total - 4; i <= total; i++) {
-        pages.push(i);
-      }
-    } else {
-      // 当前页在中间
-      pages.push("...");
-      for (let i = current - 1; i <= current + 1; i++) {
-        pages.push(i);
-      }
-      pages.push("...");
-      pages.push(total);
-    }
-  }
-
-  return pages;
-};
-
-// 监听页面大小变化
-watch(
-  () => state.pageSize,
-  () => {
-    state.currentPage = 1;
-  }
-);
-
-// 监听当前页变化，更新goto输入框
-watch(
-  () => state.currentPage,
-  (newPage) => {
-    state.gotoPage = newPage;
-  }
-);
-
-// 点击外部关闭页面大小选择菜单
-const handleClickOutside = (event) => {
-  if (!event.target.closest(".page-size-selector")) {
-    showPageSizeMenu.value = false;
-  }
-};
-
-// 添加和移除事件监听器
-onMounted(() => {
-  document.addEventListener("click", handleClickOutside);
-});
-
-onUnmounted(() => {
-  document.removeEventListener("click", handleClickOutside);
-});
 </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: 932px;
+  max-width: 1200px;
   margin: 0 auto;
-}
+  padding: 20px;
-
-.title-section {
-  display: flex;
-  flex-direction: column;
-  gap: 16px;
-  padding: 0 16px;
-  margin-bottom: 32px;
-}
-
-.title-decoration {
-  width: 58px;
-  height: 7px;
-  background: #ff7bac;
-  margin: auto 0;
-  margin-top: 43px;
 }
 
 .financials-title {
-  font-family: "PingFang SC", sans-serif;
-  font-weight: 500;
   font-size: 40px;
-  line-height: 1.4em;
+  text-align: center;
-  letter-spacing: 3%;
+  margin-bottom: 60px;
-  color: #000000;
+  color: #333;
 }
 
 .section {
-  margin-bottom: 16px;
+  margin-bottom: 60px;
 }
 
 .section-title {
-  font-family: "PingFang SC", sans-serif;
+  font-size: 18px;
-  font-weight: 500;
+  margin-bottom: 20px;
-  font-size: 24px;
+  color: #333;
-  line-height: 1.333em;
-  letter-spacing: 5%;
-  color: #000000;
-  margin-bottom: 12px;
 }
 
 .overview-text {
-  font-family: "PingFang SC", sans-serif;
-  font-weight: 400;
   font-size: 16px;
-  line-height: 1.375em;
+  line-height: 1.6;
-  letter-spacing: 3%;
+  color: #333;
-  color: #455363;
+  margin-bottom: 30px;
-  margin-bottom: 12px;
 }
 
 .tabs {
@@ -530,88 +220,40 @@ onUnmounted(() => {
 
 .reports-table {
   width: 100%;
-  background: #ffffff;
+  border-collapse: collapse;
-  border-radius: 16px;
-  box-shadow: 0px 3px 14px 0px rgba(0, 0, 0, 0.16);
-  padding: 16px;
 }
 
 .table-header {
   display: flex;
-  background: #fff0f5;
+  padding: 10px 0;
-  border-radius: 8px;
+  border-bottom: 1px solid #ccc;
-  padding: 16px 0;
+  font-weight: bold;
-  margin-bottom: 4px;
   justify-content: space-between;
-  align-items: center;
-
-  .column {
-    font-family: "PingFang SC", sans-serif;
-    font-weight: 500;
-    font-size: 16px;
-    line-height: 1.375em;
-    letter-spacing: 3%;
-    color: #000000;
-    text-align: center;
-  }
 }
 
 .table-row {
   display: flex;
-  padding: 16px 0;
+  padding: 15px 0;
+  border-bottom: 1px solid #eee;
   align-items: center;
   justify-content: space-between;
-  position: relative;
-  border-radius: 8px;
-  &:hover {
-    background: #fff8fb;
-  }
-
-  &:last-child {
-    border-bottom: none;
-  }
-
-  &:nth-child(even) {
-    margin: 4px 0;
-  }
 }
-
 .reports-list {
-  display: flex;
+  // max-height: 600px;
-  flex-direction: column;
+  // overflow-y: auto;
-  gap: 4px;
 }
-
 .column {
   &.file-name {
-    width: 420px;
+    width: 25%;
-    padding: 4px 16px;
-    font-family: "PingFang SC", sans-serif;
-    font-weight: 400;
-    font-size: 16px;
-    line-height: 1.375em;
-    letter-spacing: 3%;
-    color: #455363;
-    text-align: left;
   }
   &.date {
-    flex: 1;
+    width: 25%;
-    padding: 4px 16px;
-    font-family: "PingFang SC", sans-serif;
-    font-weight: 400;
-    font-size: 16px;
-    line-height: 1.375em;
-    letter-spacing: 3%;
-    color: #455363;
-    text-align: left;
   }
+
   &.download {
-    width: 152px;
+    width: 25%;
-    padding: 4px 16px;
+    text-align: right;
-    text-align: center;
+    margin-right: 50px;
-    display: flex;
-    align-items: center;
-    justify-content: center;
   }
 }
 
@@ -621,22 +263,11 @@ onUnmounted(() => {
 }
 
 .download-link {
-  display: inline-flex;
+  color: #0078d7;
-  align-items: center;
-  justify-content: center;
-  width: 23px;
-  height: 22px;
-  border-radius: 4px;
   text-decoration: none;
 
-  img {
-    width: 100%;
-    height: 100%;
-    object-fit: contain;
-  }
-
   &:hover {
-    background: #fff8fb;
+    text-decoration: underline;
   }
 }
 
@@ -653,159 +284,4 @@ onUnmounted(() => {
     text-decoration: underline;
   }
 }
-
-// 分页器样式
-.pagination-container {
-  display: flex;
-  align-items: center;
-  justify-content: flex-end;
-  margin-bottom: 30px;
-  gap: 21px;
-}
-
-.pagination-info {
-  font-family: "PingFang SC", sans-serif;
-  font-weight: 400;
-  font-size: 16px;
-  line-height: 1.4375em;
-  color: #455363;
-  text-align: right;
-}
-
-.pagination-controls {
-  display: flex;
-  align-items: center;
-  gap: 8px;
-}
-
-.pagination-buttons {
-  display: flex;
-  align-items: center;
-  gap: 8px;
-}
-
-.page-btn {
-  display: flex;
-  align-items: center;
-  justify-content: center;
-  width: 28px;
-  height: 28px;
-  border: 1px solid #e0e0e6;
-  border-radius: 3px;
-  background: #ffffff;
-  font-family: "PingFang SC", sans-serif;
-  font-weight: 400;
-  font-size: 14px;
-  line-height: 1.428em;
-  color: #455363;
-  cursor: pointer;
-  transition: all 0.2s ease;
-
-  &:hover:not(:disabled) {
-    border-color: #ff7bac;
-    color: #ff7bac;
-  }
-
-  &.active {
-    border-color: #ff7bac;
-    color: #ff7bac;
-    background: #fff0f5;
-  }
-
-  &:disabled {
-    cursor: not-allowed;
-    opacity: 0.5;
-  }
-
-  &.disabled {
-    cursor: not-allowed;
-    opacity: 0.5;
-  }
-}
-
-.page-size-selector {
-  position: relative;
-  display: flex;
-  align-items: center;
-  gap: 18px;
-  padding: 4px 12px;
-  height: 28px;
-  border: 1px solid #e0e0e6;
-  border-radius: 3px;
-  background: #ffffff;
-  font-family: "PingFang SC", sans-serif;
-  font-weight: 400;
-  font-size: 14px;
-  line-height: 1.428em;
-  color: #455363;
-  cursor: pointer;
-
-  &:hover {
-    border-color: #ff7bac;
-  }
-}
-
-.page-size-menu {
-  position: absolute;
-  top: 100%;
-  left: 0;
-  right: 0;
-  background: #ffffff;
-  border: 1px solid #e0e0e6;
-  border-radius: 3px;
-  box-shadow: 0 2px 8px rgba(0, 0, 0, 0.1);
-  z-index: 1000;
-  margin-top: 2px;
-}
-
-.page-size-option {
-  padding: 8px 12px;
-  font-family: "PingFang SC", sans-serif;
-  font-weight: 400;
-  font-size: 14px;
-  line-height: 1.428em;
-  color: #455363;
-  cursor: pointer;
-  transition: background-color 0.2s ease;
-
-  &:hover {
-    background: #fff0f5;
-  }
-
-  &.active {
-    background: #fff0f5;
-    color: #ff7bac;
-  }
-}
-
-.goto-section {
-  display: flex;
-  align-items: center;
-  gap: 8px;
-  font-family: "PingFang SC", sans-serif;
-  font-weight: 400;
-  font-size: 14px;
-  line-height: 1.428em;
-  color: #455363;
-  margin-right: 16px;
-}
-
-.goto-input {
-  width: 60px;
-  height: 28px;
-  padding: 4px 12px;
-  border: 1px solid #e0e0e6;
-  border-radius: 3px;
-  font-family: "PingFang SC", sans-serif;
-  font-weight: 400;
-  font-size: 14px;
-  line-height: 1.428em;
-  color: #455363;
-  text-align: center;
-
-  &:focus {
-    outline: none;
-    border-color: #ff7bac;
-  }
-}
 </style>

src/views/index/size1920/index.vue

@@ -20,7 +20,7 @@ function resolveAssetUrl(possiblePath) {
   }
 }
 
-const defaultBgUrl = resolveAssetUrl("@/assets/image/bg-pc.png");
+const defaultBgUrl = resolveAssetUrl("@/assets/image/1920/bg-pc.png");
 
 const currentBg = computed(() => {
   // 支持三种：

src/views/news/size1920/index.vue

@@ -54,8 +54,8 @@ const getPressReleasesInfo = () => {
 </script>
 <style scoped lang="scss">
 .page-container {
-  // max-width: 900px;
+  max-width: 932px;
   margin: 0 auto;
-  // padding: 40px;
+  padding: 0 16px;
 }
 </style>

src/views/press-releases/size1920/index.vue

@@ -652,8 +652,8 @@ const handleClickOutside = (event) => {
 .pagination-container {
   display: flex;
   align-items: center;
-  justify-content: space-between;
+  margin-top: 20px;
-  margin-top: 30px;
+  justify-content: flex-end;
   margin-bottom: 30px;
   gap: 21px;
 }
@@ -670,7 +670,7 @@ const handleClickOutside = (event) => {
 .pagination-controls {
   display: flex;
   align-items: center;
-  gap: 21px;
+  gap: 8px;
 }
 
 .pagination-buttons {
@@ -678,7 +678,6 @@ const handleClickOutside = (event) => {
   align-items: center;
   gap: 8px;
 }
-
 .page-btn {
   display: flex;
   align-items: center;
@@ -742,7 +741,7 @@ const handleClickOutside = (event) => {
 
 .page-size-menu {
   position: absolute;
-  top: 100%;
+  bottom: 100%;
   left: 0;
   right: 0;
   background: #ffffff;
@@ -750,7 +749,7 @@ const handleClickOutside = (event) => {
   border-radius: 3px;
   box-shadow: 0 2px 8px rgba(0, 0, 0, 0.1);
   z-index: 1000;
-  margin-top: 2px;
+  margin-bottom: 2px;
 }
 
 .page-size-option {
@@ -782,6 +781,7 @@ const handleClickOutside = (event) => {
   font-size: 14px;
   line-height: 1.428em;
   color: #455363;
+  margin-right: 16px;
 }
 
 .goto-input {

src/views/product-introduction/size1920/index.vue

@@ -2,6 +2,13 @@
 
 <template>
   <div class="page-container">
+    <div class="grid-lines">
+      <div class="line solid line-1"></div>
+      <div class="line dashed line-2"></div>
+      <div class="line dashed line-3"></div>
+      <div class="line dashed line-4"></div>
+      <div class="line solid line-5"></div>
+    </div>
     <section class="hero-section relative">
       <div class="hero-content">
         <div class="hero-title">
@@ -26,7 +33,7 @@
         </div>
       </div>
       <img
-        src="@/assets/image/product-introduction-img2.png"
+        src="@/assets/image/1920/product-introduction-img2.png"
         alt="background"
         class="hero-bg-img"
       />
@@ -102,7 +109,7 @@
         <div class="solutions-list">
           <div class="solution-item">
             <img
-              src="@/assets/image/product-introduction-icon1.png"
+              src="@/assets/image/1920/product-introduction-icon1.png"
               alt="KOL Brand Promotion"
               class="solution-icon"
             />
@@ -118,7 +125,7 @@
           </div>
           <div class="solution-item">
             <img
-              src="@/assets/image/product-introduction-icon2.png"
+              src="@/assets/image/1920/product-introduction-icon2.png"
               alt="Content Creation Support"
               class="solution-icon"
             />
@@ -134,7 +141,7 @@
           </div>
           <div class="solution-item">
             <img
-              src="@/assets/image/product-introduction-icon3.png"
+              src="@/assets/image/1920/product-introduction-icon3.png"
               alt="Account Operation"
               class="solution-icon"
             />
@@ -151,7 +158,7 @@
         </div>
         <div class="solution-image-container">
           <img
-            src="@/assets/image/product-introduction-img1.png"
+            src="@/assets/image/1920/product-introduction-img1.png"
             alt="Value Added Solutions"
             class="solution-image"
           />
@@ -221,7 +228,7 @@
 
     <section class="cta-section">
       <img
-        src="@/assets/image/product-introduction-img5.png"
+        src="@/assets/image/1920/product-introduction-img5.png"
         alt="background"
         class="cta-bg-img"
       />
@@ -246,7 +253,7 @@
         </div>
         <div class="cta-qr-code">
           <img
-            src="@/assets/image/product-introduction-img6.png"
+            src="@/assets/image/1920/product-introduction-img6.png"
             alt="QR Code"
           />
         </div>
@@ -261,12 +268,13 @@
   font-family: "PingFang SC", sans-serif;
   /* max-width: 932px; */
   margin: 0 auto;
+  position: relative;
 }
 
 .hero-section {
   text-align: center;
   position: relative;
-  background-image: url("@/assets/image/product-introduction-img3.png");
+  background-image: url("@/assets/image/1920/product-introduction-img3.png");
   background-repeat: no-repeat;
   background-size: 100% auto;
   background-position: top;
@@ -368,7 +376,7 @@
   line-height: 32px;
   letter-spacing: 1.2px;
   display: flex;
-  align-items: center;
+  align-items: flex-start;
   gap: 16px;
 }
 .feature-description {
@@ -386,7 +394,7 @@
 }
 .solutions-content {
   display: flex;
-  gap: 16px;
+  gap: 24px;
 }
 .solutions-list {
   display: flex;
@@ -398,7 +406,6 @@
   text-align: left;
   display: flex;
   flex-direction: column;
-  gap: 16px;
 }
 .solution-icon {
   width: 92px;
@@ -406,12 +413,16 @@
   padding-left: 16px;
 }
 .solution-title {
-  font-size: 20px;
+  font-family: "PingFang SC";
-  line-height: 28px;
+  font-size: 24px;
+  font-style: normal;
   font-weight: 500;
+  line-height: 32px; /* 133.333% */
+  letter-spacing: 1.2px;
   display: flex;
   gap: 16px;
-  align-items: center;
+  align-items: flex-start;
+  margin-bottom: 16px;
 }
 .solution-description {
   font-size: 16px;
@@ -422,7 +433,6 @@
 }
 .solution-image-container {
   width: 434px;
-  height: 628px;
   border-radius: 16px;
 }
 .solution-image {
@@ -435,7 +445,7 @@
 .advantages-section {
   margin-top: 80px;
   padding: 80px 0;
-  background-image: url("@/assets/image/product-introduction-img4.png");
+  background-image: url("@/assets/image/1920/product-introduction-img4.png");
   background-size: cover;
   background-position: center;
   color: #fff;
@@ -473,7 +483,7 @@
   letter-spacing: 1.2px;
   display: flex;
   gap: 16px;
-  align-items: center;
+  align-items: flex-start;
 }
 .advantage-description {
   font-size: 16px;
@@ -542,5 +552,49 @@
   height: 20px;
   background: #ff7bac;
   flex-shrink: 0;
+  margin-top: 6px;
+}
+
+.grid-lines {
+  position: absolute;
+  top: 0;
+  left: 50%;
+  transform: translateX(-50%);
+  width: 932px;
+  height: 100%;
+  pointer-events: none;
+  z-index: 0;
+}
+
+.grid-lines .line {
+  position: absolute;
+  top: 0;
+  bottom: 0;
+}
+
+.grid-lines .line.solid {
+  width: 1px;
+  background-color: rgba(0, 0, 0, 0.08);
+}
+
+.grid-lines .line.dashed {
+  width: 0;
+  border-left: 1px dotted rgba(0, 0, 0, 0.12);
+}
+
+.grid-lines .line-1 {
+  left: 0;
+}
+.grid-lines .line-2 {
+  left: 233px;
+}
+.grid-lines .line-3 {
+  left: 466px;
+}
+.grid-lines .line-4 {
+  left: 699px;
+}
+.grid-lines .line-5 {
+  right: 0;
 }
 </style>