2025-04-30 17:10:58 +08:00

1137 lines
37 KiB
HTML
Raw Blame History

This file contains ambiguous Unicode characters

This file contains Unicode characters that might be confused with other characters. If you think that this is intentional, you can safely ignore this warning. Use the Escape button to reveal them.

<!DOCTYPE html>
<html lang="zh-CN">
<head>
<meta name="baidu-site-verification" content="codeva-oXWASlP547" />
<meta charset="UTF-8">
<meta name="viewport"
content="width=device-width,initial-scale=1.0,maximum-scale=1.0,minimum-scale=1.0,user-scalable=no">
<title>龙翔工程咨询集团 </title>
<script src="{dreamer-cms:template /}css/tailwindcss.css"></script>
<!-- <link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/font-awesome/6.4.0/css/all.min.css"> -->
<link rel="stylesheet" href="{dreamer-cms:template /}css/font-awesome.css">
<!-- 1. 引入 Animate.css 实现标题飞入-->
<link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/animate.css/4.1.1/animate.min.css">
<meta http-equiv="X-UA-Compatible" content="IE=edge,chrome=1">
<!-- 禁止百度转码 -->
<meta http-equiv="Cache-Control" content="no-siteapp">
<!-- uc强制竖屏 -->
<meta name="screen-orientation" content="portrait">
<!-- QQ强制竖屏 -->
<meta name="x5-orientation" content="portrait">
<title>{dreamer-cms:global name="title"/}</title>
<meta name="Keywords" content="{dreamer-cms:global name=" keywords"/}" />
<meta name="Description" content="{dreamer-cms:global name=" describe"/}" />
<link rel="stylesheet" href="{dreamer-cms:template /}css/iconfont/iconfont.css">
<link rel="stylesheet" href="{dreamer-cms:template /}css/reset.css">
<link rel="stylesheet" href="{dreamer-cms:template /}css/animate.css">
<link rel="stylesheet" href="{dreamer-cms:template /}css/style.css">
<link rel="stylesheet" href="{dreamer-cms:template /}scripts/theme/default/layer.css">
<script src="{dreamer-cms:template /}scripts/jquery-1.11.3.min.js"></script>
<script src="{dreamer-cms:template /}scripts/jquery.SuperSlide.2.1.1.js"></script>
<script src="{dreamer-cms:template /}scripts/js.js"></script>
<script src="{dreamer-cms:template /}scripts/layer.js"></script>
<style>
.hero-section {
background: linear-gradient(rgba(0, 0, 0, 0.6), rgba(0, 0, 0, 0.6)), url('https://images.unsplash.com/photo-1605152276897-4f618f831968?ixlib=rb-4.0.3&ixid=M3wxMjA3fDB8MHxwaG90by1wYWdlfHx8fGVufDB8fHx8fA%3D%3D&auto=format&fit=crop&w=1470&q=80');
background-size: cover;
background-position: center;
}
.news-container {
display: flex;
height: 500px;
}
.news-image {
flex: 1;
height: 100%;
overflow: hidden;
position: relative;
}
.news-image img {
width: 100%;
height: 100%;
object-fit: cover;
}
.news-list {
flex: 1;
height: 100%;
overflow-y: auto;
background: white;
position: relative;
}
.news-item {
padding: 16px;
border-bottom: 1px solid #eee;
transition: all 0.3s ease;
}
.news-item:hover {
background: #f8fafc;
}
.divider {
width: 1px;
background-color: #e5e7eb;
}
.page-item {
display: inline-block;
margin: 0 2px;
}
.page-link {
padding: 6px 12px;
border-radius: 4px;
cursor: pointer;
}
.page-link:hover {
background-color: #f1f5f9;
}
.page-link.active {
background-color: #3b82f6;
color: white;
}
.pagination-container {
position: absolute;
bottom: 0;
left: 0;
right: 0;
background: white;
padding: 12px;
border-top: 1px solid #e5e7eb;
display: flex;
justify-content: center;
}
.view-details {
display: inline-flex;
align-items: center;
color: #3b82f6;
font-size: 0.875rem;
font-weight: 500;
transition: all 0.2s ease;
white-space: nowrap;
}
.view-details:hover {
color: #2563eb;
text-decoration: underline;
}
.view-details i {
margin-left: 4px;
font-size: 0.75rem;
}
/* 服务card图片显示 */
.service-card::before {
content: "";
position: absolute;
top: 0;
left: 0;
width: 100%;
height: 100%;
opacity: 0.2;
z-index: -1;
background-size: cover;
background-position: center;
transition: opacity 0.3s ease;
}
.service-card {
transition: all 0.3s ease;
/* 服务card图片显示 */
position: relative;
z-index: 1;
}
/* 动态样式注入 */
/* 服务card图片显示 */
.service-card::before {
background-image: var(--bg-image);
}
.service-card:hover {
transform: translateY(-5px);
box-shadow: 0 10px 25px rgba(0, 0, 0, 0.1);
}
/* 服务card图片显示 */
.service-card:hover::before {
opacity: 0.35;
}
.carousel {
position: relative;
height: 500px;
overflow: hidden;
}
.carousel-inner {
display: flex;
transition: transform 0.5s ease;
height: 100%;
}
.carousel-item {
min-width: 100%;
height: 100%;
position: relative;
}
.carousel-item img {
width: 100%;
height: 100%;
object-fit: cover;
max-width: 100%;
max-height: 100%;
}
.carousel-caption {
position: absolute;
bottom: 0;
left: 0;
right: 0;
padding: 30px;
background: linear-gradient(to top, rgba(0, 0, 0, 0.7), transparent);
color: white;
}
.carousel-control {
position: absolute;
top: 50%;
transform: translateY(-50%);
width: 40px;
height: 40px;
background: rgba(0, 0, 0, 0.5);
border-radius: 50%;
display: flex;
align-items: center;
justify-content: center;
color: white;
cursor: pointer;
z-index: 10;
}
.carousel-control.prev {
left: 20px;
}
.carousel-control.next {
right: 20px;
}
.carousel-indicators {
position: absolute;
bottom: 20px;
left: 50%;
transform: translateX(-50%);
display: flex;
gap: 10px;
z-index: 10;
}
.carousel-indicator {
width: 12px;
height: 12px;
border-radius: 50%;
background: rgba(255, 255, 255, 0.5);
cursor: pointer;
}
.carousel-indicator.active {
background: white;
}
#timeline {
height: 235px;
}
.custom-btn {
position: relative;
display: inline-flex;
align-items: center;
justify-content: center;
padding: 16px 40px;
/* 增加左右内边距 */
min-width: 240px;
/* 设置最小宽度 */
font-size: 18px;
font-weight: 600;
text-decoration: none;
border-radius: 50px;
overflow: visible !important;
z-index: 1;
}
/* 按钮文字 */
.btn-text {
position: relative;
z-index: 2;
color: #1a365d;
transition: color 0.3s ease;
text-align: center;
/* 确保文字居中 */
}
/* 动态背景层 */
.btn-bg {
position: absolute;
top: 0;
left: 0;
width: 100%;
height: 100%;
background: linear-gradient(135deg,
#3b82f6 0%,
#8b5cf6 100%);
transform: scale(0.95);
transition: transform 0.4s cubic-bezier(0.4, 0, 0.2, 1);
z-index: 1;
}
/* 悬停动效 */
.custom-btn:hover {
transform: translateY(-3px);
}
.custom-btn:hover .btn-bg {
transform: scale(1);
}
.custom-btn:hover .btn-text {
color: #f0f8ff;
}
/* 二级按钮样式 */
.btn-secondary .btn-bg {
background: linear-gradient(135deg,
#10b981 0%,
#34d399 100%);
}
/* 点击动效 */
.custom-btn:active {
transform: translateY(1px);
}
/* 平台按钮点击动效 */
#bbb {
z-index: 3;
}
</style>
</head>
<body class="font-sans text-gray-800">
<!-- 导航栏 -->
{dreamer-cms:include file='inc/header.html'/}
<!-- 轮播图 -->
<section class="carousel">
<!-- 加载状态 -->
<div id="carousel-loading" class="loading">
<div class="loading-spinner"></div>
</div>
<!-- 轮播内容 -->
<div id="carousel-inner" class="carousel-inner hidden">
<!-- 轮播项将通过JavaScript动态添加 -->
</div>
<!-- 控制按钮 -->
<div class="carousel-control prev" id="carousel-prev">
<i class="fas fa-chevron-left"></i>
</div>
<div class="carousel-control next" id="carousel-next">
<i class="fas fa-chevron-right"></i>
</div>
<!-- 指示器 -->
<div class="carousel-indicators" id="carousel-indicators">
<!-- 指示器将通过JavaScript动态添加 -->
</div>
</section>
<!-- 新闻动态 - 放在轮播图下方 -->
<section class="py-16 bg-gray-50">
<div class="container mx-auto px-6">
<div class="text-center mb-12">
<h2 class="text-3xl md:text-4xl font-bold mb-4">新闻动态</h2>
<div class="w-20 h-1 bg-blue-600 mx-auto mb-6"></div>
<p class="text-gray-600 max-w-3xl mx-auto"><b>了解我们的最新动态和资讯</b></p>
</div>
<div class="news-container bg-white rounded-lg shadow-md overflow-hidden">
<!-- 左侧新闻图片 -->
{dreamer-cms:list typeid="zac9idyl" pagenum="1" pagesize="1" cascade="true" sortBy="show_time" sortWay="desc"}
<div class="news-image">
<img src="[field:litpic/]" alt="新闻图片">
<div
class="absolute bottom-0 left-0 right-0 p-6 bg-gradient-to-t from-black to-transparent text-white">
<div class="text-sm text-gray-300 mb-2">
<span>[field:showtime function="format('yyyy-MM-dd HH:mm:ss')" /]</span>
<!-- <span class="mx-2">|</span>
<span>公司新闻</span> -->
</div>
<h3 class="text-xl font-bold mb-3">[field:title/]</h3>
<a href="[field:arcurl/]" class="view-details">
阅读更多 <i class="fas fa-arrow-right"></i>
</a>
</div>
</div>
{/dreamer-cms:list}
<!-- 分割线 -->
<div class="divider"></div>
<!-- 右侧新闻列表 -->
<div class="news-list">
<div id="news-list-content">
<!-- News items will be dynamically inserted here -->
</div>
<div class="pagination-container">
<nav>
<ul class="pagination flex" id="pagination">
<!-- Pagination will be dynamically inserted here -->
</ul>
</nav>
</div>
</div>
</div>
</div>
</section>
<section class="flex flex-col md:flex-row w-full max-w-[1480px] mx-auto gap-8 py-12">
<!-- 左侧区块 -->
<div class="bg-white rounded-xl shadow-md overflow-hidden flex-1 flex flex-col">
<div class="p-6 border-b">
<h3 class="text-xl font-semibold text-gray-700 mb-4">招采信息</h3>
<!-- 表格容器修改 -->
<div class="overflow-hidden">
<!-- 移除滚动条 -->
<table class="w-full table-auto">
<colgroup>
<col span="1" style="width: 70%;">
<col span="1" style="width: 30%;">
</colgroup>
<tbody class="divide-y divide-gray-100">
{dreamer-cms:list typeid="c44273d2" pagenum="1" pagesize="5" cascade="true" sortBy="show_time" sortWay="desc"}
<tr class="hover:bg-gray-50">
<!-- 修改后的单元格 -->
<td
class="px-6 py-4 font-medium text-gray-800 text-lg max-w-[30ch] truncate break-words">
[field:title/]
</td>
<td class="px-6 py-4 text-gray-600 text-lg max-w-[30ch] truncate">
[field:showtime function="format('yyyy-MM-dd')" /]
</td>
</tr>
<!-- 其他行保持相同结构 -->
{/dreamer-cms:list}
</tbody>
</table>
</div>
<div class="pt-4 flex justify-end">
<a href="/list-c44273d2/gongsixinwen/1/10">
<button
class="px-6 py-3 bg-blue-600 text-white rounded-lg hover:bg-blue-700 transition-colors text-lg">
显示更多
</button>
</a>
</div>
</div>
</div>
<!-- 右侧区块(相同修改) -->
<div class="bg-white rounded-xl shadow-md overflow-hidden flex-1 flex flex-col">
<div class="p-6 border-b">
<h3 class="text-xl font-semibold text-gray-700 mb-4">政策法规</h3>
<!-- 表格容器修改 -->
<div class="overflow-hidden">
<!-- 移除滚动条 -->
<table class="w-full table-auto">
<colgroup>
<col span="1" style="width: 70%;">
<col span="1" style="width: 30%;">
</colgroup>
<tbody class="divide-y divide-gray-100">
{dreamer-cms:list typeid="gez4xw34" pagenum="1" pagesize="5" cascade="true" sortBy="show_time" sortWay="desc"}
<tr class="hover:bg-gray-50">
<!-- 修改后的单元格 -->
<td
class="px-6 py-4 font-medium text-gray-800 text-lg max-w-[30ch] truncate break-words">
[field:title/]
</td>
<td id="thetime" class="px-6 py-4 text-gray-600 text-lg max-w-[30ch] truncate">
[field:showtime function="format('yyyy-MM-dd')" /]
</td>
</tr>
<!-- 其他行保持相同结构 -->
{/dreamer-cms:list}
</tbody>
</table>
</div>
<div class="pt-4 flex justify-end">
<a href="/list-gez4xw34/ztb/1/10">
<button
class="px-6 py-3 bg-blue-600 text-white rounded-lg hover:bg-blue-700 transition-colors text-lg">
显示更多
</button>
</a>
</div>
</div>
</div>
</section>
<section class="py-16 bg-gray-50">
<div class="container mx-auto px-6">
<div class="flex flex-col md:flex-row items-center justify-center gap-8 max-w-6xl mx-auto">
<!-- 加长版招采平台按钮 -->
<a href="http://lxjt.lxxmgl.net/trading#/login?activeName=1" target="_blank"
class="custom-btn btn-primary">
<span class="btn-bg"></span>
<i id="bbb" class="fas fa-search text-blue-600 text-2xl fa-1x ml-2 mr-4"
style="position: relative;left:-10px"></i>
<span class="btn-text">进入招采平台</span>
</a>
<!-- 加长版数字平台按钮 -->
<a href="http://lxjt.lxxmgl.net/trading#/login?activeName=1" target="_blank"
class="custom-btn btn-secondary">
<span class="btn-bg"></span>
<i id="bbb" class="fas fal fa-city text-blue-600 text-2xl fa-1x ml-2 mr-4"
style="position: relative;left:-10px"></i>
<span class="btn-text">进入数字平台</span>
</a>
</div>
</div>
</section>
<!-- 服务项目 -->
<section class="py-20 bg-gray-50">
<div class="container mx-auto px-6">
<div class="text-center mb-16">
<h2 class="text-3xl md:text-4xl font-bold mb-4">我们的服务</h2>
<div class="w-20 h-1 bg-blue-600 mx-auto mb-6"></div>
<h>
<p class="text-gray-600 max-w-3xl mx-auto"><b>我们提供全方位的工程咨询服务,助力项目顺利实施</b></p>
</h>
</div>
<div class="grid grid-cols-1 md:grid-cols-2 lg:grid-cols-3 gap-8">
{dreamer-cms:list typeid="48385ou5" pagenum="1" pagesize="1" cascade="true" sortBy="show_time" sortWay="desc"}
<div class="service-card bg-white p-8 rounded-lg shadow-md" data-bg-image="[field:litpic/]">
<div class="bg-blue-100 w-16 h-16 rounded-full flex items-center justify-center mb-6">
<i class="fas fa-project-diagram text-blue-600 text-2xl"></i>
</div>
<h3 class="text-xl font-bold mb-4"><strong>全过程工程咨询</strong></h3>
<p class="text-gray-600 mb-6"><b>提供从项目前期策划到竣工验收的全过程咨询服务</b></p>
<a href="/list-48385ou5/quanguocheng/1/10" class="text-blue-600 font-medium flex items-center">
了解更多 <i class="fas fa-arrow-right ml-2 text-sm"></i>
</a>
</div>
{/dreamer-cms:list}
{dreamer-cms:list typeid="3m1s0813" pagenum="1" pagesize="1" cascade="true" sortBy="show_time" sortWay="desc"}
<div class="service-card bg-white p-8 rounded-lg shadow-md" data-bg-image="[field:litpic/]">
<div class="bg-blue-100 w-16 h-16 rounded-full flex items-center justify-center mb-6">
<i class="fas fa-tasks text-blue-600 text-2xl"></i>
</div>
<h3 class="text-xl font-bold mb-4"><strong>项目管理服务</strong></h3>
<p class="text-gray-600 mb-6"><b>专业的项目管理团队,确保项目按计划顺利实施</b></p>
<a href="/list-3m1s0813/gongchengzixun/1/10" class="text-blue-600 font-medium flex items-center">
了解更多 <i class="fas fa-arrow-right ml-2 text-sm"></i>
</a>
</div>
{/dreamer-cms:list}
{dreamer-cms:list typeid="0723u098" pagenum="1" pagesize="1" cascade="true" sortBy="show_time" sortWay="desc"}
<div class="service-card bg-white p-8 rounded-lg shadow-md" data-bg-image="[field:litpic/]">
<div class="bg-blue-100 w-16 h-16 rounded-full flex items-center justify-center mb-6">
<i class="fas fa-calculator text-blue-600 text-2xl"></i>
</div>
<h3 class="text-xl font-bold mb-4"><strong>工程造价咨询</strong></h3>
<p class="text-gray-600 mb-6"><b>专业的造价控制服务,优化项目投资效益</b></p>
<a href="/list-0723u098/zjzx/1/10" class="text-blue-600 font-medium flex items-center">
了解更多 <i class="fas fa-arrow-right ml-2 text-sm"></i>
</a>
</div>
{/dreamer-cms:list}
{dreamer-cms:list typeid="5dwqhes7" pagenum="1" pagesize="1" cascade="true" sortBy="show_time" sortWay="desc"}
<div class="service-card bg-white p-8 rounded-lg shadow-md" data-bg-image="[field:litpic/]">
<div class="bg-blue-100 w-16 h-16 rounded-full flex items-center justify-center mb-6">
<i class="fas fa-search text-blue-600 text-2xl"></i>
</div>
<h3 class="text-xl font-bold mb-4"><strong>BIM咨询</strong></h3>
<p class="text-gray-600 mb-6"><b>BIM咨询赋能智建高效协同</b></p>
<a href="/list-5dwqhes7/bim/1/10" class="text-blue-600 font-medium flex items-center">
了解更多 <i class="fas fa-arrow-right ml-2 text-sm"></i>
</a>
</div>
{/dreamer-cms:list}
{dreamer-cms:list typeid="v35683wr" pagenum="1" pagesize="1" cascade="true" sortBy="show_time" sortWay="desc"}
<div class="service-card bg-white p-8 rounded-lg shadow-md" data-bg-image="[field:litpic/]">
<div class="bg-blue-100 w-16 h-16 rounded-full flex items-center justify-center mb-6">
<i class="fas fa-file-contract text-blue-600 text-2xl"></i>
</div>
<h3 class="text-xl font-bold mb-4"><strong>工程监理服务</strong></h3>
<p class="text-gray-600 mb-6"><b>专业的工程监理团队,确保工程质量达标</b></p>
<a href="/list-v35683wr/gcjl/1/10" class="text-blue-600 font-medium flex items-center">
了解更多 <i class="fas fa-arrow-right ml-2 text-sm"></i>
</a>
</div>
{/dreamer-cms:list}
{dreamer-cms:list typeid="fjr7p75l" pagenum="1" pagesize="1" cascade="true" sortBy="show_time" sortWay="desc"}
<div class="service-card bg-white p-8 rounded-lg shadow-md" data-bg-image="[field:litpic/]">
<div class="bg-blue-100 w-16 h-16 rounded-full flex items-center justify-center mb-6">
<i class="fas fa-solid fa-user text-blue-600 text-2xl"></i>
</div>
<h3 class="text-xl font-bold mb-4"><strong>资金申请</strong></h3>
<p class="text-gray-600 mb-6"><b>精准资金规划,体现服务价值</b></p>
<a href="/list-fjr7p75l/zjsq/1/10" class="text-blue-600 font-medium flex items-center">
了解更多 <i class="fas fa-arrow-right ml-2 text-sm"></i>
</a>
</div>
{/dreamer-cms:list}
{dreamer-cms:list typeid="32n9y542" pagenum="1" pagesize="1" cascade="true" sortBy="show_time" sortWay="desc"}
<div class="service-card bg-white p-8 rounded-lg shadow-md" data-bg-image="[field:litpic/]">
<div class="bg-blue-100 w-16 h-16 rounded-full flex items-center justify-center mb-6">
<i class="fas fal fa-city text-blue-600 text-2xl"></i>
</div>
<h3 class="text-xl font-bold mb-4"><strong>勘察设计</strong></h3>
<p class="text-gray-600 mb-6"><b>精勘设计先行,赋能工程科学决策</b></p>
<a href="/list-32n9y542/kcsj/1/10" class="text-blue-600 font-medium flex items-center">
了解更多 <i class="fas fa-arrow-right ml-2 text-sm"></i>
</a>
</div>
{/dreamer-cms:list}
{dreamer-cms:list typeid="8q398bn8" pagenum="1" pagesize="1" cascade="true" sortBy="show_time" sortWay="desc"}
<div class="service-card bg-white p-8 rounded-lg shadow-md" data-bg-image="[field:litpic/]">
<div class="bg-blue-100 w-16 h-16 rounded-full flex items-center justify-center mb-6">
<i class="fas fa-shield-alt text-blue-600 text-2xl"></i>
</div>
<h3 class="text-xl font-bold mb-4"><strong>安全咨询</strong></h3>
<p class="text-gray-600 mb-6"><b>专业安全咨询,护航工程零风险</b></p>
<a href="/list-8q398bn8/aqzx/1/10" class="text-blue-600 font-medium flex items-center">
了解更多 <i class="fas fa-arrow-right ml-2 text-sm"></i>
</a>
</div>
{/dreamer-cms:list}
{dreamer-cms:list typeid="10o2ipu3" pagenum="1" pagesize="1" cascade="true" sortBy="show_time" sortWay="desc"}
<div class="service-card bg-white p-8 rounded-lg shadow-md" data-bg-image="[field:litpic/]">
<div class="bg-blue-100 w-16 h-16 rounded-full flex items-center justify-center mb-6">
<i class="fas fa-desktop text-blue-600 text-2xl"></i>
</div>
<h3 class="text-xl font-bold mb-4"><strong>信息化咨询</strong></h3>
<p class="text-gray-600 mb-6"><b>智能信息化,赋能工程高效决策</b></p>
<a href="/list-10o2ipu3/xxh/1/10" class="text-blue-600 font-medium flex items-center">
了解更多 <i class="fas fa-arrow-right ml-2 text-sm"></i>
</a>
</div>
{/dreamer-cms:list}
</div>
</div>
</section>
<!-- 关于我们 -->
<section class="py-20">
<div class="container mx-auto px-6">
<div class="text-center mb-16">
<h2 class="text-3xl md:text-4xl font-bold mb-4">关于我们</h2>
<div class="w-20 h-1 bg-blue-600 mx-auto mb-6"></div>
<p class="text-gray-800 text-left text-lg">
&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;龙翔工程咨询集团成立于2005年是一家集工程咨询、投融资咨询、财税鉴证、安全咨询、环保职业卫生、信息化咨询、数据资产、项目管理、勘察设计、监理服务、行业咨询教育为一体的综合性企业。集团管理中心位于北京市西城区集团总部位于青岛西海岸新区现有职工300余人注册类工程师百余人。集团自成立以来始终坚持“专业第一服务第一信誉第一”核心发展理念秉承与恪守“公平、公正、守法”的职业风范为客户提供全方位咨询服务。
</p>
</div>
<div class="flex flex-col md:flex-row items-center">
<div class="md:w-1/2 mb-10 md:mb-0 md:pr-10">
<img src="{dreamer-cms:template /}images/IMG_20250429150832.png" alt="关于我们"
class="rounded-lg shadow-xl">
</div>
<div class="md:w-1/2">
<h3 class="text-2xl font-bold mb-6">我们的使命与愿景</h3>
<p class="text-gray-600 mb-6">我们致力于通过专业咨询服务推动工程建设行业高质量发展,帮助客户实现项目价值最大化。我们的愿景是成为国内领先的工程咨询企业。</p>
<div class="mb-8">
<div class="flex items-start mb-4">
<div class="bg-blue-100 p-2 rounded-full mr-4">
<i class="fas fa-check text-blue-600"></i>
</div>
<div>
<h4 class="font-bold mb-1">20年行业经验</h4>
<p class="text-gray-600">深耕工程咨询行业20年积累了丰富的项目经验</p>
</div>
</div>
<div class="flex items-start mb-4">
<div class="bg-blue-100 p-2 rounded-full mr-4">
<i class="fas fa-check text-blue-600"></i>
</div>
<div>
<h4 class="font-bold mb-1">300+客户信赖</h4>
<p class="text-gray-600">服务超过300家企业客户获得一致好评</p>
</div>
</div>
<div class="flex items-start">
<div class="bg-blue-100 p-2 rounded-full mr-4">
<i class="fas fa-check text-blue-600"></i>
</div>
<div>
<h4 class="font-bold mb-1">80+专业团队</h4>
<p class="text-gray-600">拥有80多名注册咨询工程师、造价工程师等专业人才</p>
</div>
</div>
</div>
<!-- <button class="bg-blue-600 hover:bg-blue-700 text-white px-6 py-3 rounded-lg font-medium transition duration-300">了解更多</button> -->
</div>
</div>
</div>
</section>
{dreamer-cms:include file="inc/footer.html" /}
<script>
// var user = [[{dreamer-cms:list typeid="6j0r9qzq" pagenum="1" pagesize="1" cascade="true"/}]];
// Sample news data for engineering consulting company
const newsData = [
// {
// date: "2023-05-28",
// category: "行业动态",
// title: "2023年工程咨询行业发展论坛在京举行"
// },
// {
// date: "2023-05-10",
// category: "技术前沿",
// title: "BIM技术在大型工程项目中的应用研讨会圆满结束"
// },
// {
// date: "2023-04-22",
// category: "公司新闻",
// title: "我司荣获2023年度优秀工程咨询企业称号"
// },
// {
// date: "2023-03-15",
// category: "行业动态",
// title: "2023年第一季度工程咨询行业发展报告发布"
// },
// {
// date: "2023-02-28",
// category: "技术前沿",
// title: "新型建筑材料在工程中的应用研讨会成功举办"
// },
// {
// date: "2023-01-15",
// category: "行业动态",
// title: "2023年工程咨询行业发展趋势分析"
// },
// {
// date: "2022-12-10",
// category: "公司新闻",
// title: "我司与某大型建筑集团达成战略合作协议"
// },
// {
// date: "2022-11-25",
// category: "技术前沿",
// title: "绿色建筑技术应用研讨会成功举办"
// }
];
// Pagination variables
const itemsPerPage = 5;
let currentPage = 1;
// 从接口获取新闻数据
async function fetchNewsData() {
try {
// 显示加载状态
document.getElementById('news-list-content').innerHTML = `
<div class="loading">
<div class="loading-spinner"></div>
</div>
`;
// 实际项目中替换为你的真实API地址
const response = await fetch('/getIndexNews', {
method: 'GET',
headers: {
'Content-Type': 'application/json',
// 如果需要认证,可以添加认证头
// 'Authorization': 'Bearer your_token_here'
}
});
if (!response.ok) {
throw new Error('网络响应不正常');
}
const data = await response.json();
// 假设API返回的数据格式为
// {
// success: true,
// data: [
// { date: "2023-06-15", category: "公司新闻", title: "新闻标题1" },
// { date: "2023-06-10", category: "行业动态", title: "新闻标题2" },
// // 更多新闻...
// ]
// }
if (data.code == 200) {
return data.data;
} else {
throw new Error(data.message || '获取新闻数据失败');
}
} catch (error) {
console.error('获取新闻数据失败:', error);
// 显示错误信息
document.getElementById('news-list-content').innerHTML = `
<div class="p-8 text-center text-red-500">
<i class="fas fa-exclamation-triangle text-2xl mb-2"></i>
<p>加载新闻失败: ${error.message}</p>
<button onclick="fetchNewsDataAndDisplay()" class="mt-4 px-4 py-2 bg-blue-600 text-white rounded hover:bg-blue-700">
重试
</button>
</div>
`;
// 返回空数组或默认数据
return [];
}
}
// 获取新闻数据并显示
async function fetchNewsDataAndDisplay() {
const newsData = await fetchNewsData();
// 如果获取数据成功,初始化分页和显示
if (newsData.length > 0) {
// 初始化分页和显示
displayNewsItems(newsData);
setupPagination(newsData);
} else {
// 如果没有数据,显示提示信息
document.getElementById('news-list-content').innerHTML = `
<div class="p-8 text-center text-gray-500">
<i class="fas fa-info-circle text-2xl mb-2"></i>
<p>暂无新闻数据</p>
</div>
`;
}
}
let currentNewsData = [];
// const newsData =await fetchNewsData();
// Function to display news items for current page
function displayNewsItems(newsData) {
const newsListContent = document.getElementById('news-list-content');
newsListContent.innerHTML = '';
currentNewsData = newsData;
const startIndex = (currentPage - 1) * itemsPerPage;
const endIndex = Math.min(startIndex + itemsPerPage, newsData.length);
const paginatedData = newsData.slice(startIndex, endIndex);
// <span class="mx-2">|</span>
// <span>${item.title}</span>
paginatedData.forEach(item => {
const newsItem = document.createElement('div');
newsItem.className = 'news-item';
newsItem.innerHTML = `
<div class="flex justify-between items-center">
<div class="flex-1 min-w-0">
<div class="text-sm text-gray-500 mb-1">
<span>${item.showTime}</span>
</div>
<h3 class="text-lg font-medium truncate">${item.title}</h3>
</div>
<div class="ml-4 flex-shrink-0">
<a href="article/${item.id}" class="view-details">
查看详情 <i class="fas fa-arrow-right"></i>
</a>
</div>
</div>
`;
newsListContent.appendChild(newsItem);
});
}
// Function to setup pagination
function setupPagination(newsData) {
const pagination = document.getElementById('pagination');
pagination.innerHTML = '';
const pageCount = Math.ceil(newsData.length / itemsPerPage);
// Previous button
const prevLi = document.createElement('li');
prevLi.className = 'page-item';
prevLi.innerHTML = `
<a class="page-link ${currentPage === 1 ? 'disabled' : ''}" onclick="changePage(${currentPage - 1})">
<i class="fas fa-chevron-left"></i>
</a>
`;
pagination.appendChild(prevLi);
// Page numbers
for (let i = 1; i <= pageCount; i++) {
const li = document.createElement('li');
li.className = 'page-item';
li.innerHTML = `
<a class="page-link ${i === currentPage ? 'active' : ''}" onclick="changePage(${i})">${i}</a>
`;
pagination.appendChild(li);
}
// Next button
const nextLi = document.createElement('li');
nextLi.className = 'page-item';
nextLi.innerHTML = `
<a class="page-link ${currentPage === pageCount ? 'disabled' : ''}" onclick="changePage(${currentPage + 1})">
<i class="fas fa-chevron-right"></i>
</a>
`;
pagination.appendChild(nextLi);
}
// Function to change page
function changePage(page) {
if (page < 1 || page > Math.ceil(currentNewsData.length / itemsPerPage)) return;
currentPage = page;
displayNewsItems(currentNewsData);
setupPagination(currentNewsData);
// Scroll to top of news list
document.getElementById('news-list-content').scrollTop = 0;
}
// 轮播图功能
// 模拟从后台获取轮播图数据
function fetchCarouselData() {
// 这里模拟一个API请求实际项目中应该是fetch或axios请求真实API
return new Promise((resolve) => {
setTimeout(() => {
resolve({
success: true,
data: [
{
id: 1,
imageUrl: "{dreamer-cms:template /}images/carousel/IMG_202504218658_860x482.png",
title: "专业工程咨询服务",
description: "提供全过程工程咨询解决方案,助力项目成功",
link: "#"
},
{
id: 2,
imageUrl: "{dreamer-cms:template /}images/carousel/img_20250427150419.jpg",
title: "专业项目管理服务",
description: "科学管理,确保项目按时按质完成",
link: "#"
},
{
id: 3,
imageUrl: "{dreamer-cms:template /}images/carousel/photo-1486406146926-c627a92ad1ab.jpg",
title: "工程造价咨询服务",
description: "精准造价控制,优化项目投资",
link: "#"
},
{
id: 4,
imageUrl: "{dreamer-cms:template /}images/carousel/photo-1600585154340-be6161a56a0c.jpg",
title: "工程监理服务",
description: "专业监理团队,确保工程质量",
link: "#"
}
]
});
}, 100); // 模拟网络延迟
});
}
// 初始化轮播图
async function initCarousel() {
try {
// 显示加载状态
document.getElementById('carousel-loading').classList.remove('hidden');
// 从后台获取数据
const response = await fetchCarouselData();
if (response.success) {
const carouselData = response.data;
// 渲染轮播图
renderCarousel(carouselData);
// 隐藏加载状态,显示轮播图
document.getElementById('carousel-loading').classList.add('hidden');
document.getElementById('carousel-inner').classList.remove('hidden');
// 初始化轮播图功能
initCarouselFunctionality();
}
} catch (error) {
console.error('获取轮播图数据失败:', error);
// 可以在这里添加错误处理,比如显示错误信息或默认内容
document.getElementById('carousel-loading').innerHTML =
'<p class="text-red-500">加载轮播图失败,请刷新页面重试</p>';
}
}
// 渲染轮播图内容
function renderCarousel(data) {
const carouselInner = document.getElementById('carousel-inner');
const indicatorsContainer = document.getElementById('carousel-indicators');
// 清空现有内容
carouselInner.innerHTML = '';
indicatorsContainer.innerHTML = '';
// 添加轮播项
data.forEach((item, index) => {
const isActive = index === 0 ? 'active' : '';
// 创建轮播项
const carouselItem = document.createElement('div');
carouselItem.className = `carousel-item ${isActive}`;
carouselItem.innerHTML = `
<img id="carousel" src="${item.imageUrl}" alt="${item.title}">
<div class="carousel-caption">
<h2 class="text-3xl font-bold mb-2">${item.title}</h2>
<p class="text-lg">${item.description}</p>
</div>
`;
// 这段原本在div里 <a href="${item.link}" class="inline-block mt-4 px-6 py-2 bg-blue-600 text-white rounded-lg hover:bg-blue-700 transition duration-300">了解更多</a> -->
carouselInner.appendChild(carouselItem);
// 创建指示器
const indicator = document.createElement('div');
indicator.className = `carousel-indicator ${isActive}`;
indicator.dataset.index = index;
indicatorsContainer.appendChild(indicator);
});
}
// 初始化轮播图功能
function initCarouselFunctionality() {
const carousel = document.querySelector('.carousel-inner');
const items = document.querySelectorAll('.carousel-item');
const indicators = document.querySelectorAll('.carousel-indicator');
const prevBtn = document.getElementById('carousel-prev');
const nextBtn = document.getElementById('carousel-next');
let currentIndex = 0;
const itemCount = items.length;
let slideInterval;
function updateCarousel() {
carousel.style.transform = `translateX(-${currentIndex * 100}%)`;
// 更新指示器
indicators.forEach((indicator, index) => {
if (index === currentIndex) {
indicator.classList.add('active');
} else {
indicator.classList.remove('active');
}
});
}
function nextSlide() {
currentIndex = (currentIndex + 1) % itemCount;
updateCarousel();
}
function prevSlide() {
currentIndex = (currentIndex - 1 + itemCount) % itemCount;
updateCarousel();
}
// 自动轮播
function startAutoSlide() {
slideInterval = setInterval(nextSlide, 5000);
}
// 停止自动轮播
function stopAutoSlide() {
clearInterval(slideInterval);
}
// 事件监听
nextBtn.addEventListener('click', () => {
stopAutoSlide();
nextSlide();
startAutoSlide();
});
prevBtn.addEventListener('click', () => {
stopAutoSlide();
prevSlide();
startAutoSlide();
});
indicators.forEach((indicator) => {
indicator.addEventListener('click', () => {
stopAutoSlide();
currentIndex = parseInt(indicator.dataset.index);
updateCarousel();
startAutoSlide();
});
});
// 鼠标悬停时暂停自动轮播
carousel.addEventListener('mouseenter', stopAutoSlide);
carousel.addEventListener('mouseleave', startAutoSlide);
// 开始自动轮播
startAutoSlide();
}
// 初始化页面
document.addEventListener('DOMContentLoaded', function () {
// 初始化轮播图
initCarousel();
// 初始化新闻列表
// displayNewsItems();
// setupPagination();
// 初始化新闻列表 - 从API获取数据
fetchNewsDataAndDisplay();
});
window.onload = function () {
console.log("页面加载完成,自动运行方法");
// 在这里调用你的方法
removeLast9();
};
function removeLast9() {
var elements = document.querySelectorAll('#thetime');
elements.forEach(function (element) {
var text = element.textContent;
if (text.length > 9) {
element.textContent = text.slice(0, -17);
} else {
// 处理长度不足的情况,比如清空或者保留原样
element.textContent = '';
}
});
}
// 一次性绑定所有卡片
document.addEventListener('DOMContentLoaded', () => {
document.querySelectorAll('.service-card').forEach(card => {
// 动态设置背景图
const bgImage = card.dataset.bgImage;
card.style.setProperty('--bg-image', `url('${bgImage}')`);
// 动态设置悬停透明度(可选)
const hoverOpacity = card.dataset.hoverOpacity || 0.35;
card.style.setProperty('--hover-opacity', hoverOpacity);
});
});
</script>
</body>
{dreamer-cms:include file="inc/service.html" /}
</html>