fengjun/ag-index
1
0
Fork 0
Code Activity

up

Browse Source
This commit is contained in:
fengjun
2026-04-15 17:35:22 +08:00
parent 188f5274fe
commit d6dc28f62c
140 changed files with 3464 additions and 3137 deletions
Download Patch File Download Diff File Expand all files Collapse all files

338
product_ecommerce_freight_booking.html
View File

@@ -29,59 +29,10 @@
<!--<link href="assets/css/style 2.css" rel="stylesheet">-->
<link href="assets/css/style.css" rel="stylesheet">
<link href="assets/css/pro.css" rel="stylesheet">
<link href="assets/css/product.css" rel="stylesheet">
<!-- Custom styles for cargo platform page title -->
<style>
/* 产品页面双列布局样式 */
.cargo-platform-content {
display: flex;
flex-wrap: wrap;
}
.cargo-info-left {
width: 580px;
flex: 0 0 580px;
padding-right: 30px;
box-sizing: border-box;
text-align: left;
}
.cargo-info-left h2,
.cargo-info-left p {
text-align: left;
}
.cargo-info-right {
flex: 1;
min-width: 0;
box-sizing: border-box;
}
/* 响应式设计 - 移动端调整为垂直布局 */
@media (max-width: 768px) {
.cargo-platform-content {
flex-direction: column;
}
.cargo-info-left {
width: 100%;
flex: 1;
padding-right: 0;
margin-bottom: 20px;
}
.cargo-info-right {
width: 100%;
}
}
/* Swiper轮播居中父容器 */
.main2 {
display: flex;
justify-content: center;
width: 100%;
}
</style>
<!-- HTML5 shim and Respond.js for IE8 support of HTML5 elements and media queries -->
<!--[if lt IE 9]>
<script src="https://oss.maxcdn.com/html5shiv/3.7.3/html5shiv.min.js"></script>
@@ -112,14 +63,14 @@
<!-- start page-title -->
<section class="page-title page-title-cargo-platform">
<div class="container" style="padding-top:0px">
<section class="page-title page-title-cargo-platform1">
<div class="container product-hero-container">
<div class="row">
<div class="cargo-platform-content col col-xs-12 col-md-12">
<div class="cargo-info-left">
<h2 id="cargoTitle" style="margin-bottom: 20px;color:black;">岸基海运订舱平台</h2>
<p style="font-size: 16px; line-height: 1.8;color:black;">
构建线上线下融合的智慧海运服务平台，实现订舱、拖车、报关全流程线上化操作。依托服务产品化、流程可视化与智能营销，赋能企业提升业务效率、降低运营成本，打造一站式海运电商体验。
<h2 id="cargoTitle" class="product-hero-title">岸基海运订舱平台</h2>
<p class="product-hero-description">
岸基海运订舱平台是面向国际物流领域的一站式数字化解决方案，将订舱、拖车、报关等传统线下服务全面线上化，通过服务产品化、全链路可视化、智能营销、多端协同与自动化规则引擎，帮助企业提升业务效率、降低运营成本，打造如电商般便捷的海运服务体验。
</p>
</div>
<div class="cargo-info-right"></div>
@@ -140,63 +91,121 @@
</div>
</div>
<section class="section-padding">
<section class="feature-highlight-section fun-fact-section">
<div class="container">
<div class="row">
<div style="text-align: center;">
<div>
<h1 style="margin-bottom: 30px;">产品功能亮点</h1>
<div class="feature-highlight-heading">
<h1>产品核心功能与价值</h1>
<p>围绕海运订舱场景，构建从服务上架到履约跟踪的全链路数字能力。</p>
</div>
<ul class="feature-highlight-tabs" role="tablist">
<li role="presentation">
<button class="feature-highlight-tab active" type="button" role="tab" aria-selected="true" aria-controls="feature-panel-1" data-target="#feature-panel-1">服务产品化</button>
</li>
<li role="presentation">
<button class="feature-highlight-tab" type="button" role="tab" aria-selected="false" aria-controls="feature-panel-2" data-target="#feature-panel-2">全链路可视化</button>
</li>
<li role="presentation">
<button class="feature-highlight-tab" type="button" role="tab" aria-selected="false" aria-controls="feature-panel-3" data-target="#feature-panel-3">智能营销中心</button>
</li>
<li role="presentation">
<button class="feature-highlight-tab" type="button" role="tab" aria-selected="false" aria-controls="feature-panel-4" data-target="#feature-panel-4">多端协同触达</button>
</li>
<li role="presentation">
<button class="feature-highlight-tab" type="button" role="tab" aria-selected="false" aria-controls="feature-panel-5" data-target="#feature-panel-5">自动化规则引擎</button>
</li>
</ul>
<div class="feature-highlight-panels">
<div id="feature-panel-1" class="feature-highlight-panel active" role="tabpanel">
<div class="feature-highlight-detail">
<div class="feature-highlight-copy">
<h2>将非标服务转化为标准商品</h2>
<p>把订舱、拖车、报关等线下服务抽象为标准化 SPU/SKU，实现线上透明展示与自由组合交易。</p>
<ul class="feature-highlight-points">
<li>客户可像电商选品一样比价、组合服务，决策周期显著缩短。</li>
<li>服务可售性增强，便于批量销售与渠道推广。</li>
<li>销售沟通成本下降，非专业人员也能快速完成报价。</li>
</ul>
</div>
<div class="feature-highlight-visual">
<div class="feature-highlight-visual-card">
<img src="assets/images/product/haiyundingcang/fuwuchanpinhua.png" alt="服务产品化功能图示">
</div>
</div>
</div>
</div>
</div>
<div class="row">
<div class="col col-xs-12">
<div class="service-grids services-slider clearfix">
<div class="feature-card">
<div class="feature-card-icon">
<img src="assets/images/project/common/资源_5.svg" alt="服务产品化（SPU/SKU）">
</div>
<div class="feature-card-body">
<h4>服务产品化（SPU/SKU）</h4>
<p>将线下服务抽象为标准化产品单元，支持线上自由组合交易，提升服务可售性与客户决策效率。</p>
</div>
<div id="feature-panel-2" class="feature-highlight-panel" role="tabpanel">
<div class="feature-highlight-detail">
<div class="feature-highlight-copy">
<h2>节点透明，业务可控</h2>
<p>以提单号为线索实时追踪订舱确认、提单签发、海关放行、装船离港等关键节点，按时间轴清晰呈现。</p>
<ul class="feature-highlight-points">
<li>客户随时查看货物所处环节，减少催单沟通负担。</li>
<li>节点停滞可被自动识别并触发预警，推动主动跟进。</li>
<li>透明信息展示提升服务可信度，增强客户复购意愿。</li>
</ul>
</div>
<div class="feature-highlight-visual">
<div class="feature-highlight-visual-card">
<img src="assets/images/product/haiyundingcang/quanchenglukeshihuagenzong.png" alt="全链路可视化跟踪图示">
</div>
<div class="feature-card">
<div class="feature-card-icon">
<img src="assets/images/project/common/编组-14.svg" alt="全链路可视化跟踪">
</div>
<div class="feature-card-body">
<h4>全链路可视化跟踪</h4>
<p>以提单号为唯一线索，实时追踪订舱、提单签发、舱单传输等关键节点状态，提升业务透明度与客户信任度。</p>
</div>
</div>
</div>
</div>
<div id="feature-panel-3" class="feature-highlight-panel" role="tabpanel">
<div class="feature-highlight-detail">
<div class="feature-highlight-copy">
<h2>电商级活动提升客户粘性</h2>
<p>集成积分、满减、秒杀、优惠券等营销能力，构建可运营、可追踪、可优化的数字化增长体系。</p>
<ul class="feature-highlight-points">
<li>积分体系联动会员等级，提升留存与复购率。</li>
<li>秒杀与满减活动吸引新客户并激活沉睡客户。</li>
<li>基于客户画像进行精准优惠推送，提高转化效率。</li>
<li>营销数据可回溯，支持持续优化投放策略。</li>
</ul>
</div>
<div class="feature-highlight-visual">
<div class="feature-highlight-visual-card">
<img src="assets/images/product/haiyundingcang/zhinengyingxiaozhongxin.png" alt="智能营销中心图示">
</div>
<div class="feature-card">
<div class="feature-card-icon">
<img src="assets/images/project/common/资源_3.svg" alt="全渠道交互覆盖">
</div>
<div class="feature-card-body">
<h4>智能营销中心</h4>
<p>集成积分、满减、秒杀、优惠券等促销工具，帮助企业构建电商化营销体系，增强客户粘性。</p>
</div>
</div>
</div>
</div>
<div id="feature-panel-4" class="feature-highlight-panel" role="tabpanel">
<div class="feature-highlight-detail">
<div class="feature-highlight-copy">
<h2>全渠道消息确保关键信息必达</h2>
<p>通过 APP、微信公众号、邮件、短信等渠道主动推送订单状态、异常预警与活动通知，提升服务响应速度。</p>
<ul class="feature-highlight-points">
<li>关键节点实时通知，客户无需频繁登录查询。</li>
<li>多渠道冗余保障，降低单一触达失败风险。</li>
<li>支持按需订阅消息类型，减少信息过载。</li>
<li>服务响应提速，客户满意度持续提升。</li>
</ul>
</div>
<div class="feature-highlight-visual">
<div class="feature-highlight-visual-card">
<img src="assets/images/product/haiyundingcang/duoduanxietongchuda.png" alt="多端协同触达图示">
</div>
<div class="feature-card">
<div class="feature-card-icon">
<img src="assets/images/project/common/资源_3.svg" alt="多端协同触达">
</div>
<div class="feature-card-body">
<h4>多端协同触达</h4>
<p>通过APP、微信、邮件、短信全渠道推送订单状态，提升服务响应速度与客户满意度。</p>
</div>
</div>
<div class="feature-card">
<div class="feature-card-icon">
<img src="assets/images/project/common/编组-2-copy-5.svg" alt="自动化规则引擎">
</div>
<div class="feature-card-body">
<h4>自动化规则引擎</h4>
<p>支持船公司业务规则、计费事件、表单流程的自定义配置，适应港口/货代/船东等复杂场景，提升系统灵活性。</p>
</div>
</div>
</div>
</div>
<div id="feature-panel-5" class="feature-highlight-panel" role="tabpanel">
<div class="feature-highlight-detail">
<div class="feature-highlight-copy">
<h2>零代码配置，快速适配复杂场景</h2>
<p>支持计费规则、表单流程、审批逻辑等可配置化管理，无需二次开发即可适配不同港口、客户与船公司差异化需求。</p>
<ul class="feature-highlight-points">
<li>费目与计费规则按需定义，灵活应对复杂收费场景。</li>
<li>船公司表单可动态配置，快速适配申报要求。</li>
<li>业务流转规则可视化调整，响应变化更及时。</li>
<li>实施周期显著缩短，上线后仍可持续迭代优化。</li>
</ul>
</div>
<div class="feature-highlight-visual">
<div class="feature-highlight-visual-card">
<img src="assets/images/product/haiyundingcang/zidonghuaguizeyinqing.png" alt="自动化规则引擎图示">
</div>
</div>
</div>
</div>
</div>
@@ -204,11 +213,12 @@
</section>
<!-- 产品架构图区域 - 全宽背景 -->
<section style="background: linear-gradient(135deg, #d2e5fa 0%, #f0f7ff 30%, #f5f9ff 70%, #d2e7fd 100%)">
<div class="container" style="padding:40px;">
<section class="product-architecture-section--gradient">
<div class="container product-architecture-container">
<div class="row">
<div class="col col-xs-12 text-center">
<h1 style="margin:40px 0 30px 0;">产品架构</h1>
<h1 class="product-architecture-title">产品架构</h1>
<p>从底层到应用，构建全链路协同骨架</p>
<img src="assets/images/project/ecommerce/booking.webp"
class="img-responsive center-block" />
</div>
@@ -216,56 +226,80 @@
</div>
</section>
<section >
<section>
<div class="container">
<div class="row">
<div style="text-align: center;padding-top: 60px;">
<div class="product-advantages-header">
<div>
<h1 style="margin-bottom: 10px;">产品优势</h1>
<h1 class="product-advantages-title">产品优势</h1>
<p>从业务连接到经营决策，持续放大海运订舱运营价值。</p>
</div>
</div>
</div>
<div class="row">
<div class="col col-xs-12">
<div class="service-grids services-slider clearfix">
<div class="feature-card feature-card-advantage">
<div class="feature-card">
<div class="feature-card-icon">
<h4>强大的数据服务与EDI能力</h4>
<img src="assets/images/project/common/资源_5.svg" alt="全域数据枢纽">
</div>
<div class="feature-card-body">
<p>通过标准化接口实现船代、财务、OA等多系统无缝对接，支持订单、舱单、账单数据实时同步，彻底打破信息孤岛，构建全域数据枢纽。</p>
<h4>全域数据枢纽</h4>
<p>通过标准化 EDI 接口打通多系统数据通道，消除信息孤岛，实现一套业务数据在多端共享与复用。</p>
</div>
</div>
<div class="feature-card feature-card-advantage">
<div class="feature-card">
<div class="feature-card-icon">
<h4>业务链路可视化与智能优化</h4>
<img src="assets/images/project/common/编组-14.svg" alt="全流程自动化处理">
</div>
<div class="feature-card-body">
<p>全流程节点状态与时间轴清晰可视，实时触发异常预警（如延迟超时、操作卡顿），支持动态调整流程逻辑，助力企业快速定位并疏通业务瓶颈。</p>
</div>
</div>
<div class="feature-card feature-card-advantage">
<div class="feature-card-icon">
<h4>高度灵活的规则引擎</h4>
</div>
<div class="feature-card-body">
<p>支持计费费目自定义、船公司页面表单动态配置、业务流转规则按需调整，灵活适配不同客户与船公司的差异化需求，零代码满足复杂场景。</p>
</div>
</div>
<div class="feature-card feature-card-advantage">
<div class="feature-card-icon">
<h4>全流程自动化处理</h4>
</div>
<div class="feature-card-body">
<p>基于邮件主题智能识别实现订单自动分发，同步触发状态更新与异常提醒，减少人工核对环节，操作效率提升50%+。</p>
<p>邮件与业务指令可智能识别并自动分发，显著减少人工核对环节，持续提升整体作业效率。</p>
</div>
</div>
<div class="feature-card feature-card-advantage">
<div class="feature-card">
<div class="feature-card-icon">
<h4>多渠道支付与智能结算</h4>
<img src="assets/images/project/common/资源_3.svg" alt="多渠道支付与智能结算">
</div>
<div class="feature-card-body">
<p>集成东方支付、网银、微信、支付宝等主流支付方式，支持线上线下混合结算模式，资金到账时效压缩至分钟级，提升资金周转率30%+。</p>
<h4>多渠道支付与智能结算</h4>
<p>支持主流线上支付与自动归集结算，缩短资金到账时间，提升资金周转效率与财务协同能力。</p>
</div>
</div>
<div class="feature-card">
<div class="feature-card-icon">
<img src="assets/images/project/common/资源_9.svg" alt="零代码柔性配置">
</div>
<div class="feature-card-body">
<h4>零代码柔性配置</h4>
<p>计费、表单、审批规则均可按场景配置，快速匹配客户与船司差异需求，降低系统改造成本。</p>
</div>
</div>
<div class="feature-card">
<div class="feature-card-icon">
<img src="assets/images/project/common/编组-2-copy-5.svg" alt="透明决策引擎">
</div>
<div class="feature-card-body">
<h4>透明决策引擎</h4>
<p>关键节点可视化与异常自动预警形成闭环，让业务瓶颈可定位、可追踪、可持续优化。</p>
</div>
</div>
<div class="feature-card">
<div class="feature-card-icon">
<img src="assets/images/project/common/编组-14.svg" alt="多端协同触达">
</div>
<div class="feature-card-body">
<h4>多端协同触达</h4>
<p>APP、微信、邮件、短信协同触达业务状态与异常信息，保障通知及时传递，提升客户服务体验。</p>
</div>
</div>
<div class="feature-card">
<div class="feature-card-icon">
<img src="assets/images/project/common/资源_5.svg" alt="服务产品化交易模式">
</div>
<div class="feature-card-body">
<h4>服务产品化交易模式</h4>
<p>将非标海运服务沉淀为标准商品，支持自由组合与快速决策，增强服务销售能力与规模化复制效率。</p>
</div>
</div>
</div>
@@ -298,31 +332,19 @@
$("#footer").load("footer.html");
$("#header").load("header.html");
// 初始化功能卡片轮播 - 使用 Owl Carousel
$(document).ready(function() {
$(".feature-cards-slider").owlCarousel({
loop: true,
margin: 25,
smartSpeed: 500,
autoplay: true,
autoplayTimeout: 5000,
autoplayHoverPause: true,
dots: false,
nav: false,
responsive: {
0: {
items: 1
},
768: {
items: 2
},
992: {
items: 3
}
}
$(".feature-highlight-tab").on("click", function() {
var $tab = $(this);
var target = $tab.data("target");
$(".feature-highlight-tab").removeClass("active").attr("aria-selected", "false");
$(".feature-highlight-panel").removeClass("active");
$tab.addClass("active").attr("aria-selected", "true");
$(target).addClass("active");
});
});
</script>
</body>
</html>
</html>