Sfoglia il codice sorgente

feat:home-yemianui

0235474 3 giorni fa
parent
commit
30222edcb9

BIN
travel-platform-web/travel-web/public/assets/images/approval.webp


BIN
travel-platform-web/travel-web/public/assets/images/culture.webp


BIN
travel-platform-web/travel-web/public/assets/images/datavisual.webp


BIN
travel-platform-web/travel-web/public/assets/images/engine.webp


BIN
travel-platform-web/travel-web/public/assets/images/govidocument.webp


BIN
travel-platform-web/travel-web/public/assets/images/key.webp


+ 82 - 23
travel-platform-web/travel-web/src/crm/mobile/page-crm-home/page-crm-home.html

@@ -12,33 +12,92 @@
   
   <!-- 数智动态区 -->
   <section class="dynamic-section" id="platform">
-    <h2 class="section-title">数智动态</h2>
-    <div class="dynamic-grid">
-      <div class="dynamic-card">
-        <div class="card-img" routerLink="/mobile/development" style="background-image: url('assets/images/digital-heritage.webp' );"></div>
-        <div class="card-content" routerLink="/mobile/development">
-          <h3 class="card-title" >数字非遗保护工程</h3>
-          <p class="card-desc">运用3D扫描与VR技术,对江西传统手工艺进行数字化存档与展示,让非遗文化永续传承。</p>
-          <a href="#" class="card-link" routerLink="/mobile/development">了解更多 →</a>
-        </div>
+  
+  <h2 class="section-title">数智动态</h2>
+  
+  <h3 style="font-size: 2.2em">新闻动态</h3>
+  <div class="dynamic-grid">
+    <div class="dynamic-card">
+      <div class="card-img" style="background-image: url('assets/images/digital-heritage.webp');"></div>
+      <div class="card-content">
+        <h3 class="card-title">数字非遗保护工程</h3>
+        <p class="card-desc">运用3D扫描与VR技术,对江西传统手工艺进行数字化存档与展示,让非遗文化永续传承。</p>
+        <a href="#" class="card-link" routerLink="/mobile/development">了解更多 →</a>
       </div>
-      <div class="dynamic-card">
-        <div class="card-img" style="background-image: url('assets/images/cultural-map.webp');"></div>
-        <div class="card-content">
-          <h3 class="card-title">江西文化基因图谱</h3>
-          <p class="card-desc">通过大数据分析,绘制江西文化元素关联网络,揭示赣鄱文化的深层结构与演变脉络。</p>
-          <a href="#" class="card-link">了解更多 →</a>
-        </div>
+    </div>
+    <div class="dynamic-card">
+      <div class="card-img" style="background-image: url('assets/images/cultural-map.webp');"></div>
+      <div class="card-content">
+        <h3 class="card-title">江西文化基因图谱</h3>
+        <p class="card-desc">通过大数据分析,绘制江西文化元素关联网络,揭示赣鄱文化的深层结构与演变脉络。</p>
+        <a href="#" class="card-link">了解更多 →</a>
       </div>
-      <div class="dynamic-card">
-        <div class="card-img" style="background-image: url('assets/images/smart-tourism.webp');"></div>
-        <div class="card-content">
-          <h3 class="card-title">智慧旅游解决方案</h3>
-          <p class="card-desc">整合AI导览、AR实景增强等技术,为江西景区提供全方位的数字化升级方案。</p>
-          <a href="#" class="card-link" routerLink="/mobile/news">了解更多 →</a>
-        </div>
+    </div>
+    <div class="dynamic-card">
+      <div class="card-img" style="background-image: url('assets/images/smart-tourism.webp');"></div>
+      <div class="card-content">
+        <h3 class="card-title">智慧旅游解决方案</h3>
+        <p class="card-desc">整合AI导览、AR实景增强等技术,为江西景区提供全方位的数字化升级方案。</p>
+        <a href="#" class="card-link" routerLink="/mobile/news">了解更多 →</a>
+      </div>
+    </div>
+  </div>
+
+  <h3 style="font-size: 2.2em">文件传达</h3>
+  <div class="dynamic-grid">
+    <div class="dynamic-card">
+      <div class="card-img" style="background-image: url('assets/images/govidocument.webp');"></div>
+      <div class="card-content">
+        <h3 class="card-title">政务文件区块链存证</h3>
+        <p class="card-desc">基于区块链技术的文件存证系统,确保政务文件传输全程可追溯、不可篡改,提升公文流转效率。</p>
+        <a href="#" class="card-link">了解更多 →</a>
+      </div>
+    </div>
+    <div class="dynamic-card">
+      <div class="card-img" style="background-image: url('assets/images/key.webp');"></div>
+      <div class="card-content">
+        <h3 class="card-title">安全传输通道</h3>
+        <p class="card-desc">采用国密算法加密的跨部门文件传输系统,保障敏感数据在传输过程中的绝对安全。</p>
+        <a href="#" class="card-link">了解更多 →</a>
+      </div>
+    </div>
+    <div class="dynamic-card">
+      <div class="card-img" style="background-image: url('assets/images/approval.webp');"></div>
+      <div class="card-content">
+        <h3 class="card-title">智能合约审批</h3>
+        <p class="card-desc">利用智能合约实现自动化审批流程,减少人为干预,提高政务处理透明度和效率。</p>
+        <a href="#" class="card-link">了解更多 →</a>
+      </div>
+    </div>
+  </div>
+
+  <h3 style="font-size: 2.2em">学术前沿</h3>
+  <div class="dynamic-grid">
+    <div class="dynamic-card">
+      <div class="card-img" style="background-image: url('assets/images/culture.webp');"></div>
+      <div class="card-content">
+        <h3 class="card-title">文化知识图谱构建</h3>
+        <p class="card-desc">运用NLP技术从海量文献中提取实体关系,构建江西文化领域的结构化知识网络。</p>
+        <a href="#" class="card-link">了解更多 →</a>
+      </div>
+    </div>
+    <div class="dynamic-card">
+      <div class="card-img" style="background-image: url('assets/images/datavisual.webp');"></div>
+      <div class="card-content">
+        <h3 class="card-title">多维数据可视化</h3>
+        <p class="card-desc">通过动态交互式图表展现复杂学术数据,支持多维度筛选与深度钻取分析。</p>
+        <a href="#" class="card-link">了解更多 →</a>
+      </div>
+    </div>
+    <div class="dynamic-card">
+      <div class="card-img" style="background-image: url('assets/images/engine.webp');"></div>
+      <div class="card-content">
+        <h3 class="card-title">语义分析引擎</h3>
+        <p class="card-desc">基于深度学习的文献语义分析系统,自动识别研究热点与学术趋势演变。</p>
+        <a href="#" class="card-link">了解更多 →</a>
       </div>
     </div>
+  </div>
   </section>
   
   <!-- 共创展示区 -->

+ 119 - 78
travel-platform-web/travel-web/src/crm/mobile/page-crm-home/page-crm-home.scss

@@ -50,7 +50,7 @@
       color: #6D6D6D;
       margin-bottom: 2rem;
       margin-left: -110px;
-      margin-right: 150px;
+      margin-right: 180px;
       line-height: 1.8;
     }
     
@@ -95,108 +95,149 @@
   }
   
   /* 数智动态区 */
-  .dynamic-section {
-    padding: 4rem 10%;
-    background-color: #f1f4f1db;
-    position: relative;
-  }
+.dynamic-section {
+  padding: 4rem 10%;
+  background-color: #f1f4f1db;
+  position: relative;
   
-  .section-title {
-    font-family: "Noto Serif SC", serif;
-    font-size: 2.2rem;
-    color: #2F7DAD;
-    text-align: center;
-    margin-bottom: 3rem;
+  h3 {
+    font-family: "Noto Sans SC", sans-serif;
+    font-size: 1.5rem;
+    color: #5B8C5A;
+    margin: 3rem 0 1.5rem;
     position: relative;
+    padding-left: 1rem;
     
-    &::after {
+    &::before {
       content: "";
-      display: block;
-      width: 80px;
-      height: 3px;
-      background: linear-gradient(to right, #2F7DAD, #5B8C5A);
-      margin: 1rem auto 0;
+      position: absolute;
+      left: 0;
+      top: 50%;
+      transform: translateY(-50%);
+      height: 70%;
+      width: 4px;
+      background: linear-gradient(to bottom, #2F7DAD, #5B8C5A);
+      border-radius: 2px;
     }
   }
+}
+
+.section-title {
+  font-family: "Noto Serif SC", serif;
+  font-size: 3rem;
+  color: #2F7DAD;
+  text-align: center;
+  margin-bottom: 3rem;
+  position: relative;
   
-  .dynamic-grid {
-    display: grid;
-    grid-template-columns: repeat(3, 1fr);
-    gap: 2rem;
+  &::after {
+    content: "";
+    display: block;
+    width: 80px;
+    height: 3px;
+    background: linear-gradient(to right, #2F7DAD, #5B8C5A);
+    margin: 1rem auto 0;
   }
+}
+
+.dynamic-grid {
+  display: grid;
+  grid-template-columns: repeat(3, 1fr);
+  gap: 2rem;
   
-  .dynamic-card {
-    background-color: white;
-    border-radius: 8px;
-    overflow: hidden;
-    box-shadow: 0 4px 12px rgba(0,0,0,0.08);
-    transition: all 0.3s ease;
-    position: relative;
-    
-    &:hover {
-      transform: translateY(-10px);
-      box-shadow: 0 12px 24px rgba(0,0,0,0.12);
-    }
+  @media (max-width: 992px) {
+    grid-template-columns: repeat(2, 1fr);
   }
   
-  .card-img {
-    height: 200px;
-    background-size: cover;
-    background-position: center;
-    position: relative;
-    
-    &::after {
-      content: "";
-      position: absolute;
-      top: 0;
-      left: 0;
-      right: 0;
-      bottom: 0;
-      background: linear-gradient(to bottom, transparent 60%, rgba(0,0,0,0.6));
-    }
+  @media (max-width: 768px) {
+    grid-template-columns: 1fr;
   }
+}
+
+.dynamic-card {
+  background-color: white;
+  border-radius: 8px;
+  overflow: hidden;
+  box-shadow: 0 4px 12px rgba(0,0,0,0.08);
+  transition: all 0.3s ease;
+  position: relative;
   
-  .card-content {
-    padding: 1.5rem;
+  &:hover {
+    transform: translateY(-10px);
+    box-shadow: 0 12px 24px rgba(0,0,0,0.12);
+    
+    .card-img::after {
+      background: linear-gradient(to bottom, transparent 40%, rgba(0,0,0,0.7));
+    }
   }
+}
+
+.card-img {
+  height: 200px;
+  background-size: cover;
+  background-position: center;
+  position: relative;
   
-  .card-title {
-    font-size: 1.3rem;
-    color: #2F7DAD;
-    margin-bottom: 0.8rem;
+  &::after {
+    content: "";
+    position: absolute;
+    top: 0;
+    left: 0;
+    right: 0;
+    bottom: 0;
+    background: linear-gradient(to bottom, transparent 60%, rgba(0,0,0,0.6));
+    transition: all 0.3s ease;
   }
+}
+
+.card-content {
+  padding: 1.5rem;
+}
+
+.card-title {
+  font-size: 1.3rem;
+  color: #2F7DAD;
+  margin-bottom: 0.8rem;
+  line-height: 1.4;
+}
+
+.card-desc {
+  color: #6D6D6D;
+  margin-bottom: 1.5rem;
+  font-size: 0.95rem;
+  line-height: 1.6;
+}
+
+.card-link {
+  display: inline-block;
+  color: #D4B16A;
+  text-decoration: none;
+  font-weight: bold;
+  position: relative;
+  transition: color 0.3s ease;
   
-  .card-desc {
-    color: #6D6D6D;
-    margin-bottom: 1.5rem;
-    font-size: 0.95rem;
+  &::after {
+    content: "";
+    position: absolute;
+    bottom: -2px;
+    left: 0;
+    width: 100%;
+    height: 1px;
+    background-color: #D4B16A;
+    transition: transform 0.3s ease;
+    transform-origin: right;
+    transform: scaleX(0);
   }
   
-  .card-link {
-    display: inline-block;
-    color: #D4B16A;
-    text-decoration: none;
-    font-weight: bold;
-    position: relative;
+  &:hover {
+    color: darken(#D4B16A, 10%);
     
     &::after {
-      content: "";
-      position: absolute;
-      bottom: -2px;
-      left: 0;
-      width: 100%;
-      height: 1px;
-      background-color: #D4B16A;
-      transition: transform 0.3s ease;
-      transform-origin: right;
-      transform: scaleX(0);
-    }
-    
-    &:hover::after {
       transform-origin: left;
       transform: scaleX(1);
     }
   }
+}
   
   /* 共创展示区 */
   .co-creation-section {