index.php 12 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141142143144145146147148149150151152153154155156157158159160161162163164165166167168169170171172173174175176177178179180181182183184185186187188189190191192193194195196197198199200201202203204205206207208209210211212213214215216217218219220221222223224225226227228229230231232233234235236237238239240241242243244245246247248249250251252253254255256257258259260261262263264265266267268269270271272273274275276277278279280281282283284285286287288289290291292293294295296297298299300301302303304305306307308309310311312313314315316317318319
  1. <?php
  2. require 'CommonQuery.php';
  3. // 轮播图数据 - 从pr_cms_block表中获取
  4. $carouselItems = getBannerData();
  5. $carouselItems2 = getRecommendArticles(6);
  6. // 通知公告数据
  7. $notices = loadListByChannelName(10, "新闻公告");
  8. // 工作动态数据
  9. $workUppublishtimes = loadListByChannelName(10, "工作动态");
  10. // 党建工作数据
  11. $partyBuilding = loadListByChannelName(10, "党建工作");
  12. // 热点新闻数据
  13. $hot = loadListByChannelName(10, "热门新闻");
  14. // 精彩推荐数据
  15. $featured = loadListByChannelName(6, "热门新闻");
  16. ?>
  17. <!DOCTYPE html>
  18. <html lang="zh-CN">
  19. <head>
  20. <meta charset="UTF-8">
  21. <meta name="viewport" content="width=device-width, initial-scale=1.0">
  22. <title>厦门市文化遗产保护中心</title>
  23. <link rel="stylesheet" href="/css/fonts.css">
  24. <link rel="stylesheet" href="/css/fontawesome.min.css">
  25. <link rel="stylesheet" href="/css/bootstrap.min.css">
  26. <link rel="stylesheet" href="/css/swiper-bundle.min.css">
  27. <link rel="stylesheet" href="/css/style.css">
  28. <script src="/js/jquery-3.7.1.js"></script>
  29. <script src="/js/bootstrap.bundle.js"></script>
  30. <script src="/js/swiper-bundle.min.js"></script>
  31. </head>
  32. <body>
  33. <?php include __DIR__ . '/components/navbar.php'; ?>
  34. <!-- 轮播图 -->
  35. <div class="swiper mySwiper" style="width: 100%; height: 400px;">
  36. <div class="swiper-wrapper bg-secondary">
  37. <?php foreach ($carouselItems as $item): ?>
  38. <div class="swiper-slide">
  39. <?php if (!empty($item['url'])): ?>
  40. <a href="<?php echo $item['url']; ?>" target="_blank">
  41. <img src="<?php echo $item['image']; ?>" alt="<?php echo $item['title'] ?? '轮播图'; ?>" style="width: 100%; height: 100%; object-fit: cover;">
  42. </a>
  43. <?php else: ?>
  44. <img src="<?php echo $item['image']; ?>" alt="<?php echo $item['title'] ?? '轮播图'; ?>" style="width: 100%; height: 100%; object-fit: cover;">
  45. <?php endif; ?>
  46. </div>
  47. <?php endforeach; ?>
  48. </div>
  49. <div class="swiper-pagination"></div>
  50. <div class="swiper-button-prev"></div>
  51. <div class="swiper-button-next"></div>
  52. </div>
  53. <!-- 主要内容 -->
  54. <div class="main-content">
  55. <div class="container">
  56. <!-- 通知公告和热点新闻 -->
  57. <div class="row">
  58. <div class="col col-sm-12 col-md-6 col-lg-6 notices-list">
  59. <div class="section-title">
  60. <div class="d-flex flex-row align-items-center">
  61. <h2 id="notices-button" class="button active icon">通知公告</h2>
  62. <h2 id="hot-news-button" class="button icon">热点新闻</h2>
  63. </div>
  64. <a href="#" class="section-more" id="notices-more">查看更多 <i class="fa fa-angle-right"></i></a>
  65. </div>
  66. <div id="notices-list" class="notices-content">
  67. <?php if (!empty($notices)): ?>
  68. <?php foreach ($notices as $notice): ?>
  69. <div class="notice-item">
  70. <div>
  71. <a href="/xinWenXiangQing/?id=<?php echo $notice['id']; ?>" class="notice-title"><?php echo $notice['title']; ?></a>
  72. <p><?php echo $notice['description']; ?></p>
  73. </div>
  74. <span class="notice-publishtime"><?php echo date('Y-m-d', intval($notice['publishtime'])); ?></span>
  75. </div>
  76. <?php endforeach; ?>
  77. <?php else: ?>
  78. <div class="no-news">通知公告暂无数据</div>
  79. <?php endif; ?>
  80. </div>
  81. <div id="hot-news-list" style="display:none;" class="news-content">
  82. <?php if (!empty($hot)): ?>
  83. <?php foreach ($hot as $item): ?>
  84. <div class="news-item">
  85. <a href="/xinWenXiangQing/?id=<?php echo $item['id']; ?>" class="title"><?php echo $item['title']; ?></a>
  86. <span class="publishtime"><?php echo date('Y-m-d', intval($item['publishtime'])); ?></span>
  87. </div>
  88. <?php endforeach; ?>
  89. <?php else: ?>
  90. <div class="no-news">热点新闻暂无数据</div>
  91. <?php endif; ?>
  92. </div>
  93. </div>
  94. <div class="col col-sm-12 col-md-6 col-lg-6">
  95. <div class="swiper mySwiper2" style="width: 100%; height:350px;">
  96. <div class="swiper-wrapper">
  97. <?php if (!empty($carouselItems2)): ?>
  98. <?php foreach ($carouselItems2 as $item): ?>
  99. <div class="swiper-slide featured-image bg-secondary" style="background-image: url('<?php echo $item['image']; ?>'); background-size: cover;">
  100. <a href="/xinWenXiangQing/?id=<?php echo $item['id']; ?>">
  101. <img src="<?php echo $item['image']; ?>" alt="<?php echo $item['desc']; ?>" style="width: 100%; height: 100%; object-fit: contain;">
  102. <div class="caption">
  103. <h3><?php echo $item['title']; ?></h3>
  104. <p><?php echo $item['desc']; ?></p>
  105. </div>
  106. </a>
  107. </div>
  108. <?php endforeach; ?>
  109. <?php else: ?>
  110. <div class="swiper-slide featured-image">
  111. <div class="no-news">热门新闻暂无数据</div>
  112. </div>
  113. <?php endif; ?>
  114. </div>
  115. <div class="swiper-pagination"></div>
  116. </div>
  117. <div class="d-flex flex-row justify-content-between">
  118. <a href="http://cpc.people.com.cn/GB/67481/448544/index.html" class="w-50">
  119. <img src="https://wlj.xm.gov.cn/ztzl/202211/W020221213510920336898.jpg" class="mt-3" style="width: 100%; height:130px;object-fit:cover;" />
  120. </a>
  121. <a href="https://www.12371.cn/special/xxzd/" class="w-50">
  122. <img src="images/xuexi.png" class="mt-3" style="width: 100%; height:130px;object-fit:cover;" />
  123. </a>
  124. </div>
  125. </div>
  126. </div>
  127. <!-- 工作动态和党建工作 -->
  128. <div class="row mt-lg-3 mt-md-2 mt-sm-2">
  129. <div class="col col-sm-12 col-md-6 col-lg-6">
  130. <div class="main-box">
  131. <div class="section-title">
  132. <h2><i class="fa fa-flag"></i> 党建工作</h2>
  133. <a href="./dangnJianGongZuo.php" class="section-more">查看更多 <i class="fa fa-angle-right"></i></a>
  134. </div>
  135. <div class="news-content">
  136. <?php if (!empty($partyBuilding)): ?>
  137. <?php foreach ($partyBuilding as $item): ?>
  138. <div class="news-item">
  139. <a href="/xinWenXiangQing/?id=<?php echo $item['id']; ?>" class="title"><?php echo $item['title']; ?></a>
  140. <span class="publishtime"><?php echo date('Y-m-d', intval($item['publishtime'])); ?></span>
  141. </div>
  142. <?php endforeach; ?>
  143. <?php else: ?>
  144. <div class="no-news">党建工作暂无数据</div>
  145. <?php endif; ?>
  146. </div>
  147. </div>
  148. </div>
  149. <div class="col col-sm-12 col-md-6 col-lg-6">
  150. <div class="main-box">
  151. <div class="section-title">
  152. <h2><i class="fa fa-refresh"></i> 工作动态</h2>
  153. <a href="./gongZuoDongTai.php" class="section-more">查看更多 <i class="fa fa-angle-right"></i></a>
  154. </div>
  155. <div class="news-content">
  156. <?php if (!empty($workUppublishtimes)): ?>
  157. <?php foreach ($workUppublishtimes as $uppublishtime): ?>
  158. <div class="news-item">
  159. <a href="/xinWenXiangQing/?id=<?php echo $uppublishtime['id']; ?>" class="title"><?php echo $uppublishtime['title']; ?></a>
  160. <span class="publishtime"><?php echo date('Y-m-d', intval($uppublishtime['publishtime'])); ?></span>
  161. </div>
  162. <?php endforeach; ?>
  163. <?php else: ?>
  164. <div class="no-news">工作动态暂无数据</div>
  165. <?php endif; ?>
  166. </div>
  167. </div>
  168. </div>
  169. </div>
  170. <hr class="main-hr" />
  171. <!-- 精彩推荐 -->
  172. <div class="featured-section main-box">
  173. <div class="section-title">
  174. <h2 class="icon">精彩推荐</h2>
  175. <!-- <a href="#" class="section-more">查看更多 <i class="fa fa-angle-right"></i></a> -->
  176. </div>
  177. <div class="featured-grid">
  178. <?php if (!empty($featured)): ?>
  179. <?php foreach ($featured as $item): ?>
  180. <div class="featured-card">
  181. <a href="/xinWenXiangQing/?id=<?php echo $item['id']; ?>">
  182. <img src="<?php echo $item['image']; ?>" alt="<?php echo $item['alt']; ?>">
  183. <p><?php echo $item['title']; ?></p>
  184. </a>
  185. </div>
  186. <?php endforeach; ?>
  187. <?php else: ?>
  188. <div class="no-news">精彩推荐暂无数据</div>
  189. <?php endif; ?>
  190. </div>
  191. </div>
  192. <!-- 公共服务 -->
  193. <div class="services-section">
  194. <img class="title" src="/images/box-service.png" alt="公共服务">
  195. <div class="services-grid">
  196. <div class="service-card">
  197. <img class="icon" src="/images/icon-explore.png">
  198. <h3>志愿者招募</h3>
  199. <a href="#" class="service-link">
  200. <i class="fa fa-solid fa-chevron-right"></i>
  201. </a>
  202. </div>
  203. <div class="service-card">
  204. <img class="icon" src="/images/icon-join.png">
  205. <h3>活动报名</h3>
  206. <a href="#" class="service-link">
  207. <i class="fa fa-solid fa-chevron-right"></i>
  208. </a>
  209. </div>
  210. <div class="service-card">
  211. <img class="icon" src="/images/icon-contract.png">
  212. <h3>联系咨询通道</h3>
  213. <a href="#" class="service-link">
  214. <i class="fa fa-solid fa-chevron-right"></i>
  215. </a>
  216. </div>
  217. </div>
  218. </div>
  219. </div>
  220. </div>
  221. <?php include __DIR__ . '/components/footer.php'; ?>
  222. <!-- 内部测试提示弹窗 -->
  223. <div id="test-notice-modal" class="modal" tabindex="-1" role="dialog" style="display:block; position: fixed; z-index: 9999; left: 0; top: 0; width: 100%; height: 100%; overflow: auto; background-color: rgba(0,0,0,0.4);">
  224. <div class="modal-dialog" role="document" style="max-width: 500px; margin: 15% auto;">
  225. <div class="modal-content" style="background-color: #fefefe; margin: 15% auto; padding: 20px; border: 1px solid #888; width: 80%;">
  226. <div class="modal-body text-center">
  227. <h3>网站内部测试中</h3>
  228. <p style="margin: 20px 0;">网站正在进行内部测试,暂未对外开放。</p>
  229. <button id="close-modal-btn" class="btn btn-primary" style="margin-top: 10px;">确定</button>
  230. </div>
  231. </div>
  232. </div>
  233. </div>
  234. <!-- Swiper.js 初始化脚本 -->
  235. <script>
  236. $(document).ready(function() {
  237. // 关闭测试弹窗
  238. $('#close-modal-btn').click(function() {
  239. $('#test-notice-modal').hide();
  240. });
  241. // 初始化 Swiper
  242. const swiper = new Swiper(".mySwiper", {
  243. slidesPerView: 1,
  244. spaceBetween: 30,
  245. loop: true,
  246. pagination: {
  247. el: ".swiper-pagination",
  248. clickable: true,
  249. },
  250. navigation: {
  251. nextEl: ".swiper-button-next",
  252. prevEl: ".swiper-button-prev",
  253. },
  254. autoplay: {
  255. delay: 5000,
  256. disableOnInteraction: false,
  257. },
  258. });
  259. const swiper2 = new Swiper(".mySwiper2", {
  260. slidesPerView: 1,
  261. spaceBetween: 30,
  262. loop: true,
  263. pagination: {
  264. el: ".swiper-pagination",
  265. clickable: true,
  266. },
  267. autoplay: {
  268. delay: 5000,
  269. disableOnInteraction: false,
  270. },
  271. });
  272. $('#notices-more').click(function() {
  273. if ($('#notices-list').is(':visible')) {
  274. location.href = '/gongZuoDongTai.php';
  275. } else {
  276. location.href = '/xinWenLieBiao.php';
  277. }
  278. });
  279. $('#notices-button').click(function() {
  280. $('#notices-button').addClass('active');
  281. $('#hot-news-button').removeClass('active');
  282. $('#hot-news-list').hide();
  283. $('#notices-list').show();
  284. });
  285. $('#hot-news-button').click(function() {
  286. $('#hot-news-button').addClass('active');
  287. $('#notices-button').removeClass('active');
  288. $('#hot-news-list').show();
  289. $('#notices-list').hide();
  290. });
  291. });
  292. </script>
  293. </body>
  294. </html>