소스 검색

📦 完成设计图页面

快乐的梦鱼 13 시간 전
부모
커밋
2007c1f5d9

+ 1 - 1
components/navbar.php

@@ -4,7 +4,7 @@ $navItems = [
   ["name" => "党建工作", "url" => "/dangnJianGongZuo.php"],
   ["name" => "单位概况", "url" => "/danWeiGaiKuang.php"],
   ["name" => "工作动态", "url" => "/gongZuoDongTai.php"],
-  ["name" => "文化保护", "url" => "/wenBaoJiaYuan.php"],
+  ["name" => "文保家园", "url" => "/wenBaoJiaYuan.php"],
   ["name" => "鹭岛文脉", "url" => "/luDaoWenMai.php"],
   ["name" => "政策法规", "url" => "/zhengCeFaGui.php"],
   ["name" => "联系我们", "url" => "/lianXiWoMeng.php"]

+ 100 - 1
css/style.css

@@ -5,6 +5,7 @@
   --color-secondary: #ac361e;
   --color-text: #333;
   --color-text-light: #fff;
+  --color-text-dark: #000;
   --color-text-secondary: #888;
   --color-border: #ddd;
   --color-box: #f9fafb;
@@ -76,6 +77,46 @@ button:hover {
 button i {
   color: var(--color-text-light);
 }
+button.bordered {
+  color: var(--color-text);
+  background-color: #f3f3f3;
+  background-repeat: no-repeat;
+  background-size: 100% 100%;
+  /* 九宫格切图实现 - 防止图片变形 */
+  border-image: url("../images/button-deactive.png") 25 25 25 25 stretch;
+  border-width: 10px;
+  border-style: solid;
+  background-clip: padding-box;
+  padding: 0 16px;
+  margin-right: 8px;
+  cursor: pointer;
+  font-size: 14px;
+  font-family: "STSongtiSC";
+  box-sizing: border-box;
+}
+button.bordered:hover, button.bordered.active {
+  color: var(--color-text-light);
+  background-color: #d74a2e;
+  border-image: url("../images/button-active.png") 25 25 25 25 stretch;
+}
+
+.bordered-input {
+  color: var(--color-text);
+  border-style: solid;
+  border-width: 10px;
+  border-image: url("../images/button-deactive.png") 25 25 25 25 stretch;
+}
+.bordered-input input {
+  background-color: #f3f3f3;
+  border: none;
+  font-size: 15px;
+  font-family: "STSongtiSC";
+  color: var(--color-text);
+  width: 220px;
+}
+.bordered-input input:focus {
+  outline: none;
+}
 
 /* 导航样式 */
 nav.main-nav {
@@ -161,6 +202,20 @@ nav.main-nav a:hover, nav.main-nav a:active {
   padding-bottom: 10px;
   border-bottom: 2px solid var(--color-primary);
 }
+.section-title.center {
+  justify-content: center;
+}
+.section-title.large {
+  border-bottom: none;
+}
+.section-title.large h2 {
+  font-size: 30px;
+}
+.section-title.large h2.icon::before, .section-title.large h2.icon::after {
+  width: 28px;
+  height: 28px;
+  background-size: 28px 28px;
+}
 .section-title h2 {
   position: relative;
   display: flex;
@@ -308,6 +363,9 @@ nav.main-nav a:hover, nav.main-nav a:active {
 .news-item:last-child {
   border-bottom: none;
 }
+.news-item.dark .title {
+  color: var(--color-text-dark);
+}
 .news-item .title {
   flex: 1;
   margin-right: 15px;
@@ -476,8 +534,10 @@ footer {
 .sidebar .title h2 {
   position: relative;
   margin: 0;
-  font-size: 40px;
+  font-size: 30px;
   font-weight: bold;
+  font-family: "STSongtiSC";
+  line-height: 50px;
   z-index: 2;
 }
 
@@ -550,6 +610,45 @@ footer {
   font-size: 15px;
 }
 
+/* 联系我们页面样式 */
+.contact-info {
+  padding-right: 30px;
+}
+
+.info-list {
+  padding-left: 0;
+}
+
+.info-item {
+  display: flex;
+  flex-direction: row;
+  padding: 10px 0;
+  align-items: center;
+  transition: transform 0.3s, box-shadow 0.3s;
+}
+.info-item:hover {
+  transform: translateY(-3px);
+  box-shadow: 0 4px 12px rgba(0, 0, 0, 0.1);
+}
+.info-item i {
+  color: var(--color-primary);
+  font-size: 20px;
+  margin-right: 15px;
+  width: 30px;
+  text-align: center;
+}
+
+.map-section {
+  position: relative;
+  height: 100%;
+}
+
+#map-container {
+  border-radius: 8px;
+  overflow: hidden;
+  margin-bottom: 20px;
+}
+
 @media (max-width: 992px) {
   .featured-image {
     width: 100%;

파일 크기가 너무 크기때문에 변경 상태를 표시하지 않습니다.
+ 1 - 1
css/style.css.map


+ 107 - 1
css/style.scss

@@ -4,6 +4,7 @@
   --color-secondary: #ac361e;
   --color-text: #333;
   --color-text-light: #fff;
+  --color-text-dark: #000;
   --color-text-secondary: #888;
   --color-border: #ddd;
   --color-box: #f9fafb;
@@ -77,8 +78,51 @@ button {
   & i {
     color: var(--color-text-light);
   }
+
+  &.bordered {
+    color: var(--color-text);
+    background-color: #f3f3f3;
+    background-repeat: no-repeat;
+    background-size: 100% 100%;
+    /* 九宫格切图实现 - 防止图片变形 */
+    border-image: url('../images/button-deactive.png') 25 25 25 25 stretch;
+    border-width: 10px;
+    border-style: solid;
+    background-clip: padding-box;
+    padding: 0 16px;
+    margin-right: 8px;
+    cursor: pointer;
+    font-size: 14px;
+    font-family: "STSongtiSC";
+    box-sizing: border-box;
+
+    &:hover,
+    &.active {
+      color: var(--color-text-light);
+      background-color: #d74a2e;
+      border-image: url('../images/button-active.png') 25 25 25 25 stretch;
+    }
+  }
 }
+.bordered-input {
+  color: var(--color-text);
+  border-style: solid;
+  border-width: 10px;
+  border-image: url('../images/button-deactive.png') 25 25 25 25 stretch;
 
+  input {
+    background-color: #f3f3f3;
+    border: none;
+    font-size: 15px;
+    font-family: "STSongtiSC";
+    color: var(--color-text);
+    width: 220px;
+
+    &:focus {
+      outline: none;
+    }
+  }
+}
 
 /* 导航样式 */
 nav.main-nav {
@@ -168,6 +212,25 @@ nav.main-nav {
   padding-bottom: 10px;
   border-bottom: 2px solid var(--color-primary);
 
+  &.center {
+    justify-content: center;
+  }
+  &.large {
+    border-bottom: none;
+
+    h2 {
+      font-size: 30px;
+
+      &.icon {
+        &::before, &::after {
+          width: 28px;
+          height: 28px;
+          background-size: 28px 28px;
+        }
+      }
+    }
+  }
+
   h2 {
     position: relative;
     display: flex;
@@ -327,6 +390,11 @@ nav.main-nav {
   &:last-child {
     border-bottom: none;
   }
+  &.dark {
+    .title {
+      color: var(--color-text-dark);
+    }
+  }
 
   .title {
     flex: 1;
@@ -499,8 +567,10 @@ footer {
     h2 {
       position: relative;
       margin: 0;
-      font-size: 40px;
+      font-size: 30px;
       font-weight: bold;
+      font-family: "STSongtiSC";
+      line-height: 50px;
       z-index: 2;
     }
   }
@@ -585,6 +655,42 @@ footer {
   }
 }
 
+/* 联系我们页面样式 */
+.contact-info {
+  padding-right: 30px;
+}
+.info-list {
+  padding-left: 0;
+}
+.info-item {
+  display: flex;
+  flex-direction: row;
+  padding: 10px 0;
+  align-items: center;
+  transition: transform 0.3s, box-shadow 0.3s;
+
+  &:hover {
+    transform: translateY(-3px);
+    box-shadow: 0 4px 12px rgba(0, 0, 0, 0.1);
+  }
+  i {
+    color: var(--color-primary);
+    font-size: 20px;
+    margin-right: 15px;
+    width: 30px;
+    text-align: center;
+  }
+}
+.map-section {
+  position: relative;
+  height: 100%;
+}
+#map-container {
+  border-radius: 8px;
+  overflow: hidden;
+  margin-bottom: 20px;
+}
+
 @media (max-width: 992px) {
   .featured-image {
     width: 100%;

+ 47 - 14
danWeiGaiKuang.php

@@ -1,19 +1,19 @@
 <?php
-// 轮播图数据
+// 轮播图数据 - 修改为单张图片
 $carouselItems = [
   [
-    "image" => "/images/test-header-1.png",
-    "alt" => "厦门市文化遗产宣传图"
-  ],
-  [
-    "image" => "https://picsum.photos/id/1036/1200/400",
-    "alt" => "厦门风景图"
-  ],
-  [
-    "image" => "https://picsum.photos/id/1037/1200/400",
-    "alt" => "厦门文化遗产保护"
+    "image" => "/images/test-header-3.png",
+    "alt" => "部门概况"
   ]
 ];
+
+$newsData =
+  [
+    "title" => "厦门市文化和旅游局关于2025年厦门市乡村旅游高质量发展的通知",
+    "content" => "内容内容内容内容内容内容内容内容内容内容内容内容",
+    "date" => "2025-12-07",
+    "views" => "2025-12-07",
+  ];
 ?>
 <!DOCTYPE html>
 <html lang="zh-CN">
@@ -21,7 +21,7 @@ $carouselItems = [
 <head>
   <meta charset="UTF-8">
   <meta name="viewport" content="width=device-width, initial-scale=1.0">
-  <title>厦门市文化遗产保护中心 - 单位概况</title>
+  <title>厦门市文化遗产保护中心 - <?php echo $newsData['title']; ?></title>
   <link rel="stylesheet" href="/css/fonts.css">
   <link rel="stylesheet" href="/css/fontawesome.min.css">
   <link rel="stylesheet" href="/css/bootstrap.min.css">
@@ -52,13 +52,47 @@ $carouselItems = [
   <!-- 主要内容 -->
   <div class="main-content">
     <div class="container">
+      <div class="row">
+        <!-- 左侧导航 -->
+        <div class="col col-sm-12 col-md-3 col-lg-3">
+          <div class="sidebar">
+            <div class="title">
+              <h2>部门概况</h2>
+            </div>
+            <ul class="sidebar-menu">
+              <li><a href="#">中心简介<i class="fa fa-arrow-right"></i></a></li>
+              <li><a href="#">机构设置<i class="fa fa-arrow-right"></i></a></li>
+            </ul>
+          </div>
+        </div>
         
+        <!-- 右侧内容 -->
+        <div class="col col-sm-12 col-md-9 col-lg-9">
+          <div class="content">
+            <div class="section-title">
+              <h2 class="icon">中心简介</h2>
+              
+              <nav aria-label="breadcrumb">
+                <ol class="breadcrumb">
+                  <li class="breadcrumb-item"><a href="/">首页</a></li>
+                  <li class="breadcrumb-item active" aria-current="page">部门概况</li>
+                </ol>
+              </nav>
+            </div>
+            
+            <div class="news-detail">
+              <p><?php echo $newsData['content']; ?></p>
+            </div>
+
 
+          </div>
+        </div>
+      </div>
     </div>
   </div>
 
   <?php include __DIR__ . '/components/footer.php'; ?>
-
+  
   <script>
     $(document).ready(function() {
       // 初始化 Swiper
@@ -79,7 +113,6 @@ $carouselItems = [
           disableOnInteraction: false,
         },
       });
-      
     });
   </script>
 </body>

+ 115 - 9
gongZuoDongTai.php

@@ -1,19 +1,75 @@
 <?php
-// 轮播图数据
+// 轮播图数据 - 修改为单张图片
 $carouselItems = [
   [
-    "image" => "/images/test-header-1.png",
-    "alt" => "厦门市文化遗产宣传图"
+    "image" => "/images/test-header-4.png",
+    "alt" => "工作动态"
+  ]
+];
+
+// 工作动态数据
+$workUpdates = [
+  [
+    "title" => "厦门市文化和旅游局关于2025年厦门市乡村旅游高质量发展的通知",
+    "date" => "2025-12-07"
+  ],
+  [
+    "title" => "厦门市文化和旅游局关于2025年厦门市乡村旅游高质量发展的通知",
+    "date" => "2025-12-07"
+  ],
+  [
+    "title" => "厦门市文化和旅游局关于2025年厦门市乡村旅游高质量发展的通知",
+    "date" => "2025-12-07"
+  ],
+  [
+    "title" => "厦门市文化和旅游局关于2025年厦门市乡村旅游高质量发展的通知",
+    "date" => "2025-12-07"
+  ],
+  [
+    "title" => "厦门市文化和旅游局关于2025年厦门市乡村旅游高质量发展的通知",
+    "date" => "2025-12-07"
+  ],
+  [
+    "title" => "厦门市文化和旅游局关于2025年厦门市乡村旅游高质量发展的通知",
+    "date" => "2025-12-07"
   ],
   [
-    "image" => "https://picsum.photos/id/1036/1200/400",
-    "alt" => "厦门风景图"
+    "title" => "厦门市文化和旅游局关于2025年厦门市乡村旅游高质量发展的通知",
+    "date" => "2025-12-07"
   ],
   [
-    "image" => "https://picsum.photos/id/1037/1200/400",
-    "alt" => "厦门文化遗产保护"
+    "title" => "厦门市文化和旅游局关于2025年厦门市乡村旅游高质量发展的通知",
+    "date" => "2025-12-07"
+  ],
+  [
+    "title" => "厦门市文化和旅游局关于2025年厦门市乡村旅游高质量发展的通知",
+    "date" => "2025-12-07"
+  ],
+  [
+    "title" => "厦门市文化和旅游局关于2025年厦门市乡村旅游高质量发展的通知",
+    "date" => "2025-12-07"
+  ],
+  [
+    "title" => "厦门市文化和旅游局关于2025年厦门市乡村旅游高质量发展的通知",
+    "date" => "2025-12-07"
+  ],
+  [
+    "title" => "厦门市文化和旅游局关于2025年厦门市乡村旅游高质量发展的通知",
+    "date" => "2025-12-07"
   ]
 ];
+
+// 左侧菜单数据
+$sideMenu = [
+  ["name" => "新闻公告", "url" => "#"],
+  ["name" => "保护项目", "url" => "#"],
+  ["name" => "学术研究", "url" => "#"],
+  ["name" => "展览活动", "url" => "#"]
+];
+
+// 分页数据
+$totalPages = 5;
+$currentPage = 1;
 ?>
 <!DOCTYPE html>
 <html lang="zh-CN">
@@ -52,8 +108,58 @@ $carouselItems = [
   <!-- 主要内容 -->
   <div class="main-content">
     <div class="container">
-        
-
+        <div class="row">
+          <!-- 左侧导航 -->
+          <div class="col col-sm-12 col-md-3 col-lg-3">
+            <div class="sidebar">
+              <div class="title">
+                <h2>工作动态</h2>
+              </div>
+              <ul class="sidebar-menu">
+                <?php foreach ($sideMenu as $item): ?>
+                  <li><a href="<?php echo $item['url']; ?>"><?php echo $item['name']; ?><i class="fa fa-arrow-right"></i></a></li>
+                <?php endforeach; ?>
+              </ul>
+            </div>
+          </div>
+          
+          <!-- 右侧内容 -->
+          <div class="col col-sm-12 col-md-9 col-lg-9">
+            <div class="content">
+              <div class="section-title">
+                <h2 class="icon">工作动态</h2>
+                
+                <nav aria-label="breadcrumb">
+                  <ol class="breadcrumb">
+                    <li class="breadcrumb-item"><a href="/">首页</a></li>
+                    <li class="breadcrumb-item active" aria-current="page">工作动态</li>
+                  </ol>
+                </nav>
+              </div>
+              
+              <!-- 文章列表 -->
+              <div class="news-list">
+                <?php foreach ($workUpdates as $item): ?>
+                  <div class="news-item">
+                    <a href="./xinWenXiangQing.php?id=<?php echo urlencode($item['title']); ?>" class="title"><?php echo $item['title']; ?></a>
+                    <span class="date"><?php echo $item['date']; ?></span>
+                  </div>
+                <?php endforeach; ?>
+              </div>
+              
+              <!-- 分页 -->
+              <nav aria-label="List Page navigation">
+                <ul class="pagination mt-4">
+                  <li class="prev"><a href="?page=<?php echo $currentPage > 1 ? $currentPage - 1 : 1; ?>">&lt;</a></li>
+                  <?php for ($i = 1; $i <= $totalPages; $i++): ?>
+                    <li class="<?php echo $i == $currentPage ? 'active' : ''; ?>"><a href="?page=<?php echo $i; ?>"><?php echo $i; ?></a></li>
+                  <?php endfor; ?>
+                  <li class="next"><a href="?page=<?php echo $currentPage < $totalPages ? $currentPage + 1 : $totalPages; ?>">&gt;</a></li>
+                </ul>
+              </nav>
+            </div>
+          </div>
+        </div>
     </div>
   </div>
 

BIN
images/about-logo.png


BIN
images/button-active.png


BIN
images/button-deactive.png


BIN
images/test-header-3.png


BIN
images/test-header-4.png


BIN
images/test-header-5.png


BIN
images/test-header-6.png


BIN
images/test-header-7.png


BIN
images/test-header-8.png


+ 87 - 14
lianXiWoMeng.php

@@ -1,17 +1,9 @@
 <?php
-// 轮播图数据
+// 轮播图数据 - 联系我们页面
 $carouselItems = [
   [
-    "image" => "/images/test-header-1.png",
-    "alt" => "厦门市文化遗产宣传图"
-  ],
-  [
-    "image" => "https://picsum.photos/id/1036/1200/400",
-    "alt" => "厦门风景图"
-  ],
-  [
-    "image" => "https://picsum.photos/id/1037/1200/400",
-    "alt" => "厦门文化遗产保护"
+    "image" => "/images/test-header-8.png",
+    "alt" => "联系我们"
   ]
 ];
 ?>
@@ -21,7 +13,7 @@ $carouselItems = [
 <head>
   <meta charset="UTF-8">
   <meta name="viewport" content="width=device-width, initial-scale=1.0">
-  <title>厦门市文化遗产保护中心 - 类型我们</title>
+  <title>厦门市文化遗产保护中心 - 联系我们</title>
   <link rel="stylesheet" href="/css/fonts.css">
   <link rel="stylesheet" href="/css/fontawesome.min.css">
   <link rel="stylesheet" href="/css/bootstrap.min.css">
@@ -52,8 +44,51 @@ $carouselItems = [
   <!-- 主要内容 -->
   <div class="main-content">
     <div class="container">
-        
-
+      <div class="section-title center large mt-4">
+        <h2 class="icon">联系方式</h2>
+      </div>
+      <div class="row">
+        <div class="col col-sm-12 col-md-12 col-lg-6">
+          
+          <ul class="info-list">
+            <li class="info-item">
+              <i class="fa fa-phone"></i>
+              电话: 13888888888
+            </li>
+            <li class="info-item">
+              <i class="fa fa-envelope"></i>
+              邮箱: 13888888888@163.com
+            </li>
+            <li class="info-item">
+              <i class="fa fa-fax"></i>
+              传真: 13888888888
+            </li>
+            <li class="info-item">
+              <i class="fa fa-clock"></i>
+              办公时间: 周一至周五 8:00-17:00
+            </li>
+            <li class="info-item">
+              <i class="fa fa-map-marker"></i>
+              地址: 厦门市文化遗产保护中心
+            </li>
+          </ul>
+        </div>
+        <div class="col col-sm-12 col-md-12 col-lg-6">
+          <div id="map-container" style="width:100%; height:200px;"></div>
+        </div>
+      </div>
+      <div class="section-title center large mt-5">
+        <h2 class="icon">关于我们</h2>
+      </div>
+      <div class="row">
+        <div class="col col-sm-12 col-md-6 col-lg-8">
+          <h3>厦门市文化遗传保护中心</h3>
+          <p>“逐渐做一点”的微光力量——每代人的半片燕尾脊,终将连成历史的天空 聚集微光,照亮守护文化遗产之路。 围绕厦门宝藏文物、厦门考古、厦门非遗三大内容,构建全方位、多维度、立体化的文化遗产传播体系,提升厦门文化遗产的社会认知度和影响力,打造全国知名的文化遗产传播品牌。</p>
+        </div>
+        <div class="col col-sm-12 col-md-6 col-lg-4 d-flex flex-row justify-content-end">
+          <img src="/images/about-logo.png" alt="厦门市文化遗产保护中心">
+        </div>
+      </div>
     </div>
   </div>
 
@@ -82,6 +117,44 @@ $carouselItems = [
       
     });
   </script>
+  
+  <!-- 引入高德地图API -->
+  <script type="text/javascript" src="https://webapi.amap.com/maps?v=1.4.15&key=0f853d9f1a25328615f708e3c6f1b61b"></script>
+  
+  <!-- 初始化地图 -->
+  <script>
+    document.addEventListener('DOMContentLoaded', function() {
+      // 初始化地图
+      var map = new AMap.Map('map-container', {
+        resizeEnable: true,
+        zoom: 16,
+        center: [118.08294, 24.476082] // 厦门市中心坐标
+      });
+      
+      // 添加标记
+      var marker = new AMap.Marker({
+        position: [118.08294, 24.476082],
+        title: '厦门市文化遗产保护中心'
+      });
+      
+      // 将标记添加到地图
+      marker.setMap(map);
+      
+      // 添加信息窗口
+      var infoWindow = new AMap.InfoWindow({
+        content: '<div style="padding: 10px;">厦门市文化遗产保护中心</div>',
+        offset: new AMap.Pixel(0, -30)
+      });
+      
+      // 点击标记时显示信息窗口
+      marker.on('click', function() {
+        infoWindow.open(map, marker.getPosition());
+      });
+      
+      // 初始就打开信息窗口
+      infoWindow.open(map, marker.getPosition());
+    });
+  </script>
 </body>
 
 </html>

+ 50 - 8
luDaoWenMai.php

@@ -1,17 +1,43 @@
 <?php
-// 轮播图数据
+// 轮播图数据 - 修改为单张图片
 $carouselItems = [
   [
+    "image" => "/images/test-header-6.png",
+    "alt" => "鹭岛文脉"
+  ]
+];
+
+// 鹭岛文脉数据
+$luDaoItems = [
+  [
     "image" => "/images/test-header-1.png",
-    "alt" => "厦门市文化遗产宣传图"
+    "alt" => "传统工艺展示",
+    "title" => "厦门市文化和旅游局关于2025年厦门市乡村旅游高质量发展的通知"
+  ],
+  [
+    "image" => "/images/test-header-2.png",
+    "alt" => "古建筑保护",
+    "title" => "厦门市文化和旅游局关于2025年厦门市乡村旅游高质量发展的通知"
   ],
   [
-    "image" => "https://picsum.photos/id/1036/1200/400",
-    "alt" => "厦门风景图"
+    "image" => "/images/test-header-3.png",
+    "alt" => "非遗传承人采访",
+    "title" => "厦门市文化和旅游局关于2025年厦门市乡村旅游高质量发展的通知"
   ],
   [
-    "image" => "https://picsum.photos/id/1037/1200/400",
-    "alt" => "厦门文化遗产保护"
+    "image" => "/images/test-header-4.png",
+    "alt" => "文化遗产展览",
+    "title" => "厦门市文化和旅游局关于2025年厦门市乡村旅游高质量发展的通知"
+  ],
+  [
+    "image" => "/images/test-header-6.png",
+    "alt" => "民俗活动",
+    "title" => "厦门市文化和旅游局关于2025年厦门市乡村旅游高质量发展的通知"
+  ],
+  [
+    "image" => "/images/test-header-7.png",
+    "alt" => "历史街区改造",
+    "title" => "厦门市文化和旅游局关于2025年厦门市乡村旅游高质量发展的通知"
   ]
 ];
 ?>
@@ -52,8 +78,24 @@ $carouselItems = [
   <!-- 主要内容 -->
   <div class="main-content">
     <div class="container">
-        
-
+        <div class="content">
+          
+          <!-- 精彩推荐网格布局 -->
+          <div class="featured-section">
+            <div class="section-title center large">
+              <h2 class="icon">鹭岛文脉</h2>
+            </div>
+            <div class="featured-grid">
+              <?php foreach ($luDaoItems as $item): ?>
+                <div class="featured-card">
+                  <img src="<?php echo $item['image']; ?>" alt="<?php echo $item['alt']; ?>">
+                  <p><?php echo $item['title']; ?></p>
+                </div>
+              <?php endforeach; ?>
+            </div>
+          </div>
+        </div>
+      </div>
     </div>
   </div>
 

+ 90 - 8
wenBaoJiaYuan.php

@@ -1,19 +1,55 @@
 <?php
-// 轮播图数据
+// 轮播图数据 - 修改为单张图片
 $carouselItems = [
   [
-    "image" => "/images/test-header-1.png",
-    "alt" => "厦门市文化遗产宣传图"
+    "image" => "/images/test-header-5.png",
+    "alt" => "文保家园"
+  ]
+];
+
+// 文保家园数据
+$wenBaoJiaYuan = [
+  [
+    "title" => "厦门市文化遗产保护中心关于开展2025年文物保护志愿者招募的通知",
+    "date" => "2025-12-10"
+  ],
+  [
+    "title" => "厦门市文化遗产保护中心关于开展2025年文物保护志愿者招募的通知",
+    "date" => "2025-12-10"
+  ],
+  [
+    "title" => "厦门市文化遗产保护中心关于开展2025年文物保护志愿者招募的通知",
+    "date" => "2025-12-10"
+  ],
+  [
+    "title" => "厦门市文化遗产保护中心关于开展2025年文物保护志愿者招募的通知",
+    "date" => "2025-12-10"
   ],
   [
-    "image" => "https://picsum.photos/id/1036/1200/400",
-    "alt" => "厦门风景图"
+    "title" => "厦门市文化遗产保护中心关于开展2025年文物保护志愿者招募的通知",
+    "date" => "2025-12-10"
   ],
   [
-    "image" => "https://picsum.photos/id/1037/1200/400",
-    "alt" => "厦门文化遗产保护"
+    "title" => "厦门市文化遗产保护中心关于开展2025年文物保护志愿者招募的通知",
+    "date" => "2025-12-10"
+  ],
+  [
+    "title" => "厦门市文化遗产保护中心关于开展2025年文物保护志愿者招募的通知",
+    "date" => "2025-12-10"
+  ],
+  [
+    "title" => "厦门市文化遗产保护中心关于开展2025年文物保护志愿者招募的通知",
+    "date" => "2025-12-10"
+  ],
+  [
+    "title" => "厦门市文化遗产保护中心关于开展2025年文物保护志愿者招募的通知",
+    "date" => "2025-12-10"
   ]
 ];
+
+// 分页数据
+$totalPages = 5;
+$currentPage = 1;
 ?>
 <!DOCTYPE html>
 <html lang="zh-CN">
@@ -52,8 +88,54 @@ $carouselItems = [
   <!-- 主要内容 -->
   <div class="main-content">
     <div class="container">
+      <div class="row">
+        <!-- 左侧导航 -->
+        <div class="col col-sm-12 col-md-3 col-lg-3">
+          <div class="sidebar">
+            <div class="title">
+              <h2>文保家园</h2>
+            </div>
+            <ul class="sidebar-menu">
+              <li><a href="#">文化遗产知识库<i class="fa fa-arrow-right"></i></a></li>
+            </ul>
+          </div>
+        </div>
         
-
+        <!-- 右侧内容 -->
+        <div class="col col-sm-12 col-md-9 col-lg-9">
+          <div class="content">
+            <div class="section-title">
+              <h2 class="icon">文保家园</h2>
+              
+              <nav aria-label="breadcrumb">
+                <ol class="breadcrumb">
+                  <li class="breadcrumb-item"><a href="/">首页</a></li>
+                  <li class="breadcrumb-item active" aria-current="page">文保家园</li>
+                </ol>
+              </nav>
+            </div>
+            
+            <!-- 文章列表 -->
+            <div class="news-list">
+              <?php foreach ($wenBaoJiaYuan as $item): ?>
+                <div class="news-item">
+                  <a href="./xinWenXiangQing.php?id=<?php echo $item['title']; ?>" class="title"><?php echo $item['title']; ?></a>
+                  <span class="date"><?php echo $item['date']; ?></span>
+                </div>
+              <?php endforeach; ?>
+            </div>
+            
+            <!-- 分页 -->
+            <nav aria-label="List Page navigation">
+              <ul class="pagination mt-4">
+                <?php for ($i = 1; $i <= $totalPages; $i++): ?>
+                  <li class="<?php echo $i == $currentPage ? 'active' : ''; ?>"><a href="?page=<?php echo $i?>"><?php echo $i; ?></a></li>
+                <?php endfor; ?>
+              </ul>
+            </nav>
+          </div>
+        </div>
+      </div>
     </div>
   </div>
 

+ 62 - 13
zhengCeFaGui.php

@@ -1,19 +1,31 @@
 <?php
-// 轮播图数据
+// 轮播图数据 - 修改为单张图片
 $carouselItems = [
   [
-    "image" => "/images/test-header-1.png",
-    "alt" => "厦门市文化遗产宣传图"
-  ],
-  [
-    "image" => "https://picsum.photos/id/1036/1200/400",
-    "alt" => "厦门风景图"
-  ],
-  [
-    "image" => "https://picsum.photos/id/1037/1200/400",
-    "alt" => "厦门文化遗产保护"
+    "image" => "/images/test-header-7.png",
+    "alt" => "政策法规"
   ]
 ];
+
+// 政策法规数据
+$policyItems = [
+  ["title" => "文字占位符", "date" => "2025-12-07"],
+  ["title" => "文字占位符", "date" => "2025-12-07"],
+  ["title" => "文字占位符", "date" => "2025-12-07"],
+  ["title" => "文字占位符", "date" => "2025-12-07"],
+  ["title" => "文字占位符", "date" => "2025-12-07"],
+  ["title" => "文字占位符", "date" => "2025-12-07"],
+  ["title" => "文字占位符", "date" => "2025-12-07"],
+  ["title" => "文字占位符", "date" => "2025-12-07"],
+  ["title" => "文字占位符", "date" => "2025-12-07"],
+  ["title" => "文字占位符", "date" => "2025-12-07"],
+  ["title" => "文字占位符", "date" => "2025-12-07"],
+  ["title" => "文字占位符", "date" => "2025-12-07"]
+];
+
+// 分页数据
+$totalPages = 5;
+$currentPage = 1;
 ?>
 <!DOCTYPE html>
 <html lang="zh-CN">
@@ -52,8 +64,45 @@ $carouselItems = [
   <!-- 主要内容 -->
   <div class="main-content">
     <div class="container">
-        
-
+      <div class="row">
+        <!-- 右侧内容 -->
+        <div class="col-12">
+          <div class="content">
+            <div class="section-title center large">
+              <h2 class="icon">政策法规</h2>
+            </div>
+            
+            <!-- 搜索区域 -->
+            <div class="d-flex justify-content-center align-items-center gap-3 mb-4">
+              <button class="bordered active">国家法律法规</button>
+              <button class="bordered">地方政策文件</button>
+              <div class="bordered-input">
+                <input type="text" placeholder="输入关键字搜索政策法规">
+              </div>
+              <button class="bordered active">搜索</button>
+            </div>
+            
+            <!-- 文章列表 -->
+            <div class="news-list">
+              <?php foreach ($policyItems as $item): ?>
+                <div class="news-item dark">
+                  <a href="./xinWenXiangQing.php?id=<?php echo urlencode($item['title']); ?>" class="title"><?php echo $item['title']; ?></a>
+                  <span class="date"><?php echo $item['date']; ?></span>
+                </div>
+              <?php endforeach; ?>
+            </div>
+            
+            <!-- 分页 -->
+            <nav aria-label="List Page navigation">
+              <ul class="pagination mt-4">
+                <?php for ($i = 1; $i <= $totalPages; $i++): ?>
+                  <li class="<?php echo $i == $currentPage ? 'active' : ''; ?>"><a href="?page=<?php echo $i?>"><?php echo $i; ?></a></li>
+                <?php endfor; ?>
+              </ul>
+            </nav>
+          </div>
+        </div>
+      </div>
     </div>
   </div>