From 614ae9fce46b3cd419fc5aa0d4679ff15d3bf37c Mon Sep 17 00:00:00 2001
From: liwenhao <1273011930@qq.com>
Date: Mon, 26 May 2025 16:38:51 +0800
Subject: [PATCH] =?UTF-8?q?=E4=BF=AE=E6=94=B9=20=E8=82=A1=E7=A5=A8?=
 =?UTF-8?q?=E6=95=B0=E6=8D=AE?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 .../CommitteeAppointment/size1440/index.vue   | 21 +++++++++++++-
 .../CommitteeAppointment/size1920/index.vue   | 20 ++++++++++++-
 .../CommitteeAppointment/size375/index.vue    | 21 +++++++++++++-
 .../CommitteeAppointment/size768/index.vue    | 21 +++++++++++++-
 src/views/govern/size1920/index.vue           |  3 +-
 src/views/myHome/size1440/index.vue           | 28 +++++++++---------
 src/views/myHome/size1920/index.vue           | 29 ++++++++++---------
 src/views/myHome/size375/index.vue            | 28 +++++++++---------
 src/views/myHome/size768/index.vue            | 28 +++++++++---------
 9 files changed, 137 insertions(+), 62 deletions(-)

diff --git a/src/views/CommitteeAppointment/size1440/index.vue b/src/views/CommitteeAppointment/size1440/index.vue
index 5600832..629afe4 100644
--- a/src/views/CommitteeAppointment/size1440/index.vue
+++ b/src/views/CommitteeAppointment/size1440/index.vue
@@ -4,7 +4,6 @@
 
     <div class="title mb-[50px] text-center">
       <h1 style="font-size: 40px; margin-top: 60px">Committee Composition</h1>
-      <div class="w-24 h-1 bg-[#895bff] mx-auto"></div>
     </div>
 
     <!-- 委员会表格 -->
@@ -136,6 +135,26 @@ const getCommitteeRole = (name, committee) => {
 </script>
 
 <style scoped>
+.title h1 {
+  position: relative;
+
+  &::after {
+    content: "";
+    position: absolute;
+    bottom: -14px;
+    left: 50%;
+    transform: translateX(-50%);
+    width: 80px;
+    height: 3px;
+    background: #895bff;
+    border-radius: 3px;
+    transition: width 0.3s ease;
+  }
+
+  &:hover::after {
+    width: 120px;
+  }
+}
 /* 紫色主题变量 */
 :root {
   --primary: #895bff;
diff --git a/src/views/CommitteeAppointment/size1920/index.vue b/src/views/CommitteeAppointment/size1920/index.vue
index 5600832..4d41222 100644
--- a/src/views/CommitteeAppointment/size1920/index.vue
+++ b/src/views/CommitteeAppointment/size1920/index.vue
@@ -4,7 +4,6 @@
 
     <div class="title mb-[50px] text-center">
       <h1 style="font-size: 40px; margin-top: 60px">Committee Composition</h1>
-      <div class="w-24 h-1 bg-[#895bff] mx-auto"></div>
     </div>
 
     <!-- 委员会表格 -->
@@ -151,7 +150,26 @@ const getCommitteeRole = (name, committee) => {
   background-repeat: no-repeat;
   min-height: 100vh;
 }
+.title h1 {
+  position: relative;
 
+  &::after {
+    content: "";
+    position: absolute;
+    bottom: -14px;
+    left: 50%;
+    transform: translateX(-50%);
+    width: 80px;
+    height: 3px;
+    background: #895bff;
+    border-radius: 3px;
+    transition: width 0.3s ease;
+  }
+
+  &:hover::after {
+    width: 120px;
+  }
+}
 /* 标题区设计 */
 .hero-section {
   background: linear-gradient(
diff --git a/src/views/CommitteeAppointment/size375/index.vue b/src/views/CommitteeAppointment/size375/index.vue
index 50140e3..30cafe0 100644
--- a/src/views/CommitteeAppointment/size375/index.vue
+++ b/src/views/CommitteeAppointment/size375/index.vue
@@ -3,7 +3,6 @@
     <!-- 页面头部 -->
     <div class="title mb-[50px] text-center">
       <h1 style="font-size: 40px; margin-top: 60px">Committee Composition</h1>
-      <div class="w-24 h-1 bg-[#895bff] mx-auto"></div>
     </div>
     <!-- 移动端视图 -->
     <div class="container">
@@ -126,6 +125,26 @@ const getInitials = (name) => {
 </script>
 
 <style scoped>
+.title h1 {
+  position: relative;
+
+  &::after {
+    content: "";
+    position: absolute;
+    bottom: -14px;
+    left: 50%;
+    transform: translateX(-50%);
+    width: 80px;
+    height: 3px;
+    background: #895bff;
+    border-radius: 3px;
+    transition: width 0.3s ease;
+  }
+
+  &:hover::after {
+    width: 120px;
+  }
+}
 /* 基础变量 */
 :root {
   --primary: #895bff;
diff --git a/src/views/CommitteeAppointment/size768/index.vue b/src/views/CommitteeAppointment/size768/index.vue
index 50140e3..30cafe0 100644
--- a/src/views/CommitteeAppointment/size768/index.vue
+++ b/src/views/CommitteeAppointment/size768/index.vue
@@ -3,7 +3,6 @@
     <!-- 页面头部 -->
     <div class="title mb-[50px] text-center">
       <h1 style="font-size: 40px; margin-top: 60px">Committee Composition</h1>
-      <div class="w-24 h-1 bg-[#895bff] mx-auto"></div>
     </div>
     <!-- 移动端视图 -->
     <div class="container">
@@ -126,6 +125,26 @@ const getInitials = (name) => {
 </script>
 
 <style scoped>
+.title h1 {
+  position: relative;
+
+  &::after {
+    content: "";
+    position: absolute;
+    bottom: -14px;
+    left: 50%;
+    transform: translateX(-50%);
+    width: 80px;
+    height: 3px;
+    background: #895bff;
+    border-radius: 3px;
+    transition: width 0.3s ease;
+  }
+
+  &:hover::after {
+    width: 120px;
+  }
+}
 /* 基础变量 */
 :root {
   --primary: #895bff;
diff --git a/src/views/govern/size1920/index.vue b/src/views/govern/size1920/index.vue
index dc7fb56..b48c7e7 100644
--- a/src/views/govern/size1920/index.vue
+++ b/src/views/govern/size1920/index.vue
@@ -1,6 +1,6 @@
 <template>
   <div class="title mb-[50px] text-center">
-    <h1 style="font-size: 40px; margin-top: 60px">Corporate Governance</h1>
+    <h1 style="font-size: 40px; margin-top: 60px">Governance</h1>
   </div>
 
   <div
@@ -116,7 +116,6 @@ const state = reactive({
 <style scoped lang="scss">
 /* 标题样式 */
 .title h1 {
-  font-family: "Georgia", serif;
   position: relative;
 
   &::after {
diff --git a/src/views/myHome/size1440/index.vue b/src/views/myHome/size1440/index.vue
index c03a3b9..574a707 100644
--- a/src/views/myHome/size1440/index.vue
+++ b/src/views/myHome/size1440/index.vue
@@ -200,6 +200,7 @@ const { getStockQuate, stockQuote, formatted } = useStockQuote();
 getStockQuate();
 
 const formatCustomDate = (dateString, timeZone = "EDT") => {
+  // 尝试解析日期
   const date = new Date(dateString);
 
   // 验证日期有效性
@@ -207,26 +208,25 @@ const formatCustomDate = (dateString, timeZone = "EDT") => {
     return "Invalid Date";
   }
 
-  // 保留原始小时数用于AM/PM判断
-  const originalHours = date.getHours();
+  // 从原始字符串提取 AM/PM
+  const periodMatch = dateString.match(/(AM|PM)/i);
+  const period = periodMatch ? periodMatch[0] : "AM"; // 默认 AM（如果没有匹配到）
 
-  // 转换为12小时制
-  let displayHours = originalHours % 12;
-  displayHours = displayHours ? displayHours : 12; // 0应显示为12
-
-  // 格式化分钟
+  // 提取小时和分钟（基于 Date 对象，避免时区影响）
+  let hours = date.getHours();
   const minutes = date.getMinutes().toString().padStart(2, "0");
 
-  // 判断AM/PM
-  const period = originalHours >= 12 ? "PM" : "AM";
+  // 转换为 12 小时制
+  let displayHours = hours % 12;
+  displayHours = displayHours || 12; // 0 显示为 12
 
-  // 时间部分 (8:10PM)
+  // 时间部分（如 2:44AM）
   const timePart = `${displayHours}:${minutes}${period}`;
 
-  // 日期部分 (EDT23/15/25)
-  const month = (date.getMonth() + 1).toString().padStart(2, "0");
+  // 日期部分（如 EDT 26/05/25）
   const day = date.getDate().toString().padStart(2, "0");
-  const year = date.getFullYear().toString().slice(2); // 取后两位
+  const month = (date.getMonth() + 1).toString().padStart(2, "0");
+  const year = date.getFullYear().toString(); // 取后两位
 
   const datePart = `${timeZone} ${day}/${month}/${year}`;
 
@@ -235,7 +235,7 @@ const formatCustomDate = (dateString, timeZone = "EDT") => {
 };
 
 // 示例数据
-const sampleDate = ref("May 26, 2025, 2:44 AM EDT");
+const sampleDate = ref(formatted);
 const formattedDate = computed(() => formatCustomDate(sampleDate.value));
 
 const { t: $t } = useI18n();
diff --git a/src/views/myHome/size1920/index.vue b/src/views/myHome/size1920/index.vue
index 549fe77..83ee6b0 100644
--- a/src/views/myHome/size1920/index.vue
+++ b/src/views/myHome/size1920/index.vue
@@ -189,6 +189,7 @@ const { getStockQuate, stockQuote, formatted } = useStockQuote();
 getStockQuate();
 
 const formatCustomDate = (dateString, timeZone = "EDT") => {
+  // 尝试解析日期
   const date = new Date(dateString);
 
   // 验证日期有效性
@@ -196,26 +197,25 @@ const formatCustomDate = (dateString, timeZone = "EDT") => {
     return "Invalid Date";
   }
 
-  // 保留原始小时数用于AM/PM判断
-  const originalHours = date.getHours();
+  // 从原始字符串提取 AM/PM
+  const periodMatch = dateString.match(/(AM|PM)/i);
+  const period = periodMatch ? periodMatch[0] : "AM"; // 默认 AM（如果没有匹配到）
 
-  // 转换为12小时制
-  let displayHours = originalHours % 12;
-  displayHours = displayHours ? displayHours : 12; // 0应显示为12
-
-  // 格式化分钟
+  // 提取小时和分钟（基于 Date 对象，避免时区影响）
+  let hours = date.getHours();
   const minutes = date.getMinutes().toString().padStart(2, "0");
 
-  // 判断AM/PM
-  const period = originalHours >= 12 ? "PM" : "AM";
+  // 转换为 12 小时制
+  let displayHours = hours % 12;
+  displayHours = displayHours || 12; // 0 显示为 12
 
-  // 时间部分 (8:10PM)
+  // 时间部分（如 2:44AM）
   const timePart = `${displayHours}:${minutes}${period}`;
 
-  // 日期部分 (EDT23/15/25)
-  const month = (date.getMonth() + 1).toString().padStart(2, "0");
+  // 日期部分（如 EDT 26/05/25）
   const day = date.getDate().toString().padStart(2, "0");
-  const year = date.getFullYear().toString().slice(2); // 取后两位
+  const month = (date.getMonth() + 1).toString().padStart(2, "0");
+  const year = date.getFullYear().toString(); // 取后两位
 
   const datePart = `${timeZone} ${day}/${month}/${year}`;
 
@@ -224,8 +224,9 @@ const formatCustomDate = (dateString, timeZone = "EDT") => {
 };
 
 // 示例数据
-const sampleDate = ref("May 26, 2025, 2:44 AM EDT");
+const sampleDate = ref(formatted);
 const formattedDate = computed(() => formatCustomDate(sampleDate.value));
+
 const { t: $t } = useI18n();
 const contentRef = ref(null);
 const isInView = ref(false);
diff --git a/src/views/myHome/size375/index.vue b/src/views/myHome/size375/index.vue
index ccc75a7..2dac1d2 100644
--- a/src/views/myHome/size375/index.vue
+++ b/src/views/myHome/size375/index.vue
@@ -199,6 +199,7 @@ const { getStockQuate, stockQuote, formatted } = useStockQuote();
 getStockQuate();
 
 const formatCustomDate = (dateString, timeZone = "EDT") => {
+  // 尝试解析日期
   const date = new Date(dateString);
 
   // 验证日期有效性
@@ -206,26 +207,25 @@ const formatCustomDate = (dateString, timeZone = "EDT") => {
     return "Invalid Date";
   }
 
-  // 保留原始小时数用于AM/PM判断
-  const originalHours = date.getHours();
+  // 从原始字符串提取 AM/PM
+  const periodMatch = dateString.match(/(AM|PM)/i);
+  const period = periodMatch ? periodMatch[0] : "AM"; // 默认 AM（如果没有匹配到）
 
-  // 转换为12小时制
-  let displayHours = originalHours % 12;
-  displayHours = displayHours ? displayHours : 12; // 0应显示为12
-
-  // 格式化分钟
+  // 提取小时和分钟（基于 Date 对象，避免时区影响）
+  let hours = date.getHours();
   const minutes = date.getMinutes().toString().padStart(2, "0");
 
-  // 判断AM/PM
-  const period = originalHours >= 12 ? "PM" : "AM";
+  // 转换为 12 小时制
+  let displayHours = hours % 12;
+  displayHours = displayHours || 12; // 0 显示为 12
 
-  // 时间部分 (8:10PM)
+  // 时间部分（如 2:44AM）
   const timePart = `${displayHours}:${minutes}${period}`;
 
-  // 日期部分 (EDT23/15/25)
-  const month = (date.getMonth() + 1).toString().padStart(2, "0");
+  // 日期部分（如 EDT 26/05/25）
   const day = date.getDate().toString().padStart(2, "0");
-  const year = date.getFullYear().toString().slice(2); // 取后两位
+  const month = (date.getMonth() + 1).toString().padStart(2, "0");
+  const year = date.getFullYear().toString(); // 取后两位
 
   const datePart = `${timeZone} ${day}/${month}/${year}`;
 
@@ -234,7 +234,7 @@ const formatCustomDate = (dateString, timeZone = "EDT") => {
 };
 
 // 示例数据
-const sampleDate = ref("May 26, 2025, 2:44 AM EDT");
+const sampleDate = ref(formatted);
 const formattedDate = computed(() => formatCustomDate(sampleDate.value));
 
 const { t: $t } = useI18n();
diff --git a/src/views/myHome/size768/index.vue b/src/views/myHome/size768/index.vue
index 3a34450..ce9ee97 100644
--- a/src/views/myHome/size768/index.vue
+++ b/src/views/myHome/size768/index.vue
@@ -201,6 +201,7 @@ const { getStockQuate, stockQuote, formatted } = useStockQuote();
 getStockQuate();
 
 const formatCustomDate = (dateString, timeZone = "EDT") => {
+  // 尝试解析日期
   const date = new Date(dateString);
 
   // 验证日期有效性
@@ -208,26 +209,25 @@ const formatCustomDate = (dateString, timeZone = "EDT") => {
     return "Invalid Date";
   }
 
-  // 保留原始小时数用于AM/PM判断
-  const originalHours = date.getHours();
+  // 从原始字符串提取 AM/PM
+  const periodMatch = dateString.match(/(AM|PM)/i);
+  const period = periodMatch ? periodMatch[0] : "AM"; // 默认 AM（如果没有匹配到）
 
-  // 转换为12小时制
-  let displayHours = originalHours % 12;
-  displayHours = displayHours ? displayHours : 12; // 0应显示为12
-
-  // 格式化分钟
+  // 提取小时和分钟（基于 Date 对象，避免时区影响）
+  let hours = date.getHours();
   const minutes = date.getMinutes().toString().padStart(2, "0");
 
-  // 判断AM/PM
-  const period = originalHours >= 12 ? "PM" : "AM";
+  // 转换为 12 小时制
+  let displayHours = hours % 12;
+  displayHours = displayHours || 12; // 0 显示为 12
 
-  // 时间部分 (8:10PM)
+  // 时间部分（如 2:44AM）
   const timePart = `${displayHours}:${minutes}${period}`;
 
-  // 日期部分 (EDT23/15/25)
-  const month = (date.getMonth() + 1).toString().padStart(2, "0");
+  // 日期部分（如 EDT 26/05/25）
   const day = date.getDate().toString().padStart(2, "0");
-  const year = date.getFullYear().toString().slice(2); // 取后两位
+  const month = (date.getMonth() + 1).toString().padStart(2, "0");
+  const year = date.getFullYear().toString(); // 取后两位
 
   const datePart = `${timeZone} ${day}/${month}/${year}`;
 
@@ -236,7 +236,7 @@ const formatCustomDate = (dateString, timeZone = "EDT") => {
 };
 
 // 示例数据
-const sampleDate = ref("May 26, 2025, 2:44 AM EDT");
+const sampleDate = ref(formatted);
 const formattedDate = computed(() => formatCustomDate(sampleDate.value));
 
 const { t: $t } = useI18n();