up
This commit is contained in:
@@ -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;">
|
||||
网上业务大厅平台作为多类型码头业务前端客户服务子系统的核心模块,专为货主、货代、船代、车队等外部客户设计,同时支撑大型港口集团实现码头业务的统一化、标准化管理。平台提供电子办单、财务计费与开票、办单数据对接后端TOS系统、作业数据查询等全流程客户服务功能,并通过集群部署、负载均衡及数据异地存储技术,全面提升系统安全性与运行可靠性。
|
||||
<h2 id="cargoTitle" class="product-hero-title">岸基网上业务大厅平台</h2>
|
||||
<p class="product-hero-description">
|
||||
网上业务大厅平台是多类型码头业务前端客户服务的核心模块,面向货主、货代、船代、车队等外部客户,支撑港口集团实现码头业务统一化与标准化管理。平台提供电子办单、计费开票、TOS 数据对接、作业查询等全流程服务,并通过集群部署、负载均衡与异地存储保障系统安全与稳定运行。
|
||||
</p>
|
||||
</div>
|
||||
<div class="cargo-info-right"></div>
|
||||
@@ -134,60 +85,145 @@
|
||||
<div class="row">
|
||||
<div class="col col-xs-12">
|
||||
<div class="page-path">
|
||||
<a href="../index.html">首页</a> > <a href="../product_eCommerce.html">产品中心</a> > 岸基网上业务大厅平台
|
||||
<a href="../index.html">首页</a> > <a href="../product_eCommerce.html">产品中心</a> > 岸基港航客户服务平台(网上业务大厅)
|
||||
</div>
|
||||
</div>
|
||||
</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>
|
||||
<li role="presentation">
|
||||
<button class="feature-highlight-tab" type="button" role="tab" aria-selected="false" aria-controls="feature-panel-6" data-target="#feature-panel-6">AI辅助审核</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>通过 BPM 工作流实现合同办单全过程可视化,并引入 AI 异常识别能力,提升审核效率与处理准确性。</p>
|
||||
<ul class="feature-highlight-points">
|
||||
<li>办单进度实时可见,客户无需反复催办。</li>
|
||||
<li>单证异常自动标记,帮助审核人员快速聚焦风险点。</li>
|
||||
<li>单节点审批时效可压缩至 300 分钟内,整体周期明显缩短。</li>
|
||||
</ul>
|
||||
</div>
|
||||
<div class="feature-highlight-visual">
|
||||
<div class="feature-highlight-visual-card">
|
||||
<img src="assets/images/product/wangshangyewudating/zhinengliuchengtixiao.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/编组-14.svg" alt="业务流程化、规范化、无纸化">
|
||||
</div>
|
||||
<div class="feature-card-body">
|
||||
<h4>业务流程化、规范化、无纸化</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/wangshangyewudating/yidongbangong.png" alt="移动办公图示">
|
||||
</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>
|
||||
</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>
|
||||
</ul>
|
||||
</div>
|
||||
<div class="feature-highlight-visual">
|
||||
<div class="feature-highlight-visual-card">
|
||||
<img src="assets/images/product/wangshangyewudating/guanlikeshihua.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>平台作为业务枢纽,对外联通代理与海关系统,对内集成 TOS、门禁、理货等业务系统,实现数据贯通。</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/wangshangyewudating/qianhouduanliandong.png" alt="前后端联动图示">
|
||||
</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>网厅平台作为核心枢纽,对外联通代理系统、海关系统,对内集成TOS系统、门禁、理货等业务系统,实现跨系统数据无缝交互,奠定全链路协同基础。</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>
|
||||
</ul>
|
||||
</div>
|
||||
<div class="feature-highlight-visual">
|
||||
<div class="feature-highlight-visual-card">
|
||||
<img src="assets/images/product/wangshangyewudating/zhifuyitihua.png" alt="支付流程一体化图示">
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<div id="feature-panel-6" class="feature-highlight-panel" role="tabpanel">
|
||||
<div class="feature-highlight-detail">
|
||||
<div class="feature-highlight-copy">
|
||||
<h2>AI辅助审核:智能识别风险,提升审核质量</h2>
|
||||
<p>引入 AI 审核引擎自动识别单证信息与潜在风险,辅助人工审核聚焦关键问题,实现高效与可控并重。</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/wangshangyewudating/aifuzhushenhe.png" alt="AI辅助审核图示">
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
@@ -195,11 +231,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/obh.webp"
|
||||
class="img-responsive center-block" />
|
||||
</div>
|
||||
@@ -207,74 +244,82 @@
|
||||
</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-icon">
|
||||
<h4>智能流程提效</h4>
|
||||
</div>
|
||||
<div class="feature-card-body">
|
||||
<p>通过BPM工作流实现合同办单全流程可视化,客户与审核人员可实时追踪动态,落地项目平均单节点审批时效压缩至300分钟内。</p>
|
||||
</div>
|
||||
<div class="feature-card">
|
||||
<div class="feature-card-icon">
|
||||
<img src="assets/images/project/common/编组-14.svg" alt="智能流程提效">
|
||||
</div>
|
||||
<div class="feature-card feature-card-advantage">
|
||||
<div class="feature-card-icon">
|
||||
<h4>九大系统全域交互</h4>
|
||||
</div>
|
||||
<div class="feature-card-body">
|
||||
<p>与TOS系统、金税系统、财务系统、EDI系统、海关系统、短信平台、车队系统、门禁系统建立数据通道,打破信息孤岛,支撑跨系统业务协同。</p>
|
||||
</div>
|
||||
<div class="feature-card-body">
|
||||
<h4>智能流程提效</h4>
|
||||
<p>BPM 工作流实现全流程可视化,审批节点时效持续优化,客户可实时掌握办单进展。</p>
|
||||
</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">
|
||||
<div class="feature-card-icon">
|
||||
<img src="assets/images/project/common/资源_5.svg" alt="九大系统互联">
|
||||
</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 class="feature-card-body">
|
||||
<h4>九大系统互联</h4>
|
||||
<p>打通 TOS、金税、财务、EDI、海关、短信、车队、门禁等系统数据,建立统一协同通道。</p>
|
||||
</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">
|
||||
<div class="feature-card-icon">
|
||||
<img src="assets/images/project/common/资源_3.svg" alt="高可用架构保障">
|
||||
</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 class="feature-card-body">
|
||||
<h4>高可用架构保障</h4>
|
||||
<p>采用集群部署、负载均衡与热加载机制,支持不停机迭代,保障平台稳定运行。</p>
|
||||
</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">
|
||||
<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/编组-14.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/资源_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/资源_3.svg" alt="AI辅助审核">
|
||||
</div>
|
||||
<div class="feature-card-body">
|
||||
<h4>AI辅助审核</h4>
|
||||
<p>单证自动识别与风险筛查提升审核效率,降低人为疏漏带来的业务与合规风险。</p>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
@@ -305,31 +350,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>
|
||||
|
||||
Reference in New Issue
Block a user