- nginx 安全加固 (CSP, HSTS, 缓存策略) - 共享 style.css - 138个页面全部接入 Co-authored-by: Hermes AI <agent@hermes>
607 lines
31 KiB
HTML
607 lines
31 KiB
HTML
<html lang="zh-CN"><head>
|
||
<meta charset="UTF-8">
|
||
<meta name="viewport" content="width=device-width, initial-scale=1.0">
|
||
<title>陕西博海网络科技 · 专业IT服务</title>
|
||
<meta name="description" content="陕西博海网络科技 — 电脑维修、打印机维修、网络工程、电子产品销售、Web开发、IT运维,一站式IT解决方案。">
|
||
<meta name="keywords" content="榆林电脑维修,定边IT服务,陕西博海网络科技,电脑维修,打印机维修,网络工程,IT运维,Web开发,电子产品销售,榆林IT服务,定边电脑维修">
|
||
<meta http-equiv="Cache-Control" content="no-cache, no-store, must-revalidate">
|
||
<meta http-equiv="Pragma" content="no-cache">
|
||
<meta http-equiv="Expires" content="0">
|
||
<meta property="og:title" content="陕西博海网络科技 · 专业IT服务">
|
||
<meta property="og:description" content="电脑维修、打印机维修、网络工程、电子产品销售、Web开发、IT运维 — 一站式IT解决方案,30分钟响应,2小时上门。">
|
||
<meta property="og:image" content="https://sxbh.ltd/og-image.png">
|
||
<meta property="og:url" content="https://sxbh.ltd">
|
||
<meta property="og:type" content="website">
|
||
<meta name="twitter:card" content="summary">
|
||
<meta name="twitter:title" content="陕西博海网络科技 · 专业IT服务">
|
||
<meta name="twitter:description" content="电脑维修、打印机维修、网络工程、电子产品销售、Web开发、IT运维 — 一站式IT解决方案。">
|
||
<!-- Fonts: Inter + Noto Serif SC (通过国内镜像加速) -->
|
||
<link rel="preconnect" href="https://fonts.loli.net">
|
||
<link rel="preconnect" href="https://gstatic.loli.net" crossorigin="">
|
||
<link href="https://fonts.loli.net/css2?family=Inter:wght@400;500;600;700&family=Noto+Serif+SC:wght@500;600;700&display=swap" rel="stylesheet">
|
||
<script type="application/ld+json">
|
||
{
|
||
"@context": "https://schema.org",
|
||
"@type": "LocalBusiness",
|
||
"name": "陕西博海网络科技有限公司",
|
||
"url": "https://sxbh.ltd",
|
||
"telephone": "+86-912-4223980",
|
||
"email": "service@sxbh.ltd",
|
||
"description": "电脑维修、打印机维修、网络工程、电子产品销售、Web开发、IT运维一站式IT解决方案",
|
||
"address": {
|
||
"@type": "PostalAddress",
|
||
"addressLocality": "定边县",
|
||
"addressRegion": "榆林市",
|
||
"addressCountry": "CN",
|
||
"streetAddress": "二道西街"
|
||
},
|
||
"areaServed": ["定边县", "榆林市"],
|
||
"openingHours": "Mo-Sa 08:30-18:00",
|
||
"priceRange": "¥¥"
|
||
}
|
||
</script>
|
||
<!-- End Umami -->
|
||
<script defer src="https://sxbh.ltd/umami/api/send" data-website-id="22bcb6ef-cc9d-4e3a-91f5-c218ba4e9437"></script>
|
||
<link rel="stylesheet" href="/style.css">
|
||
</head>
|
||
<body>
|
||
|
||
<!-- HEADER -->
|
||
<header>
|
||
<div class="header-inner">
|
||
<a href="#" class="logo">
|
||
<div class="logo-icon">博</div>
|
||
博海网络科技 <span>· BHWL</span>
|
||
</a>
|
||
<nav id="nav">
|
||
<a href="#services">服务项目</a>
|
||
<a href="/services.html">IT服务</a>
|
||
<a href="/cases.html">客户案例</a>
|
||
<a href="#products">产品销售</a>
|
||
<a href="#perspective">博海视角</a>
|
||
<a href="/faq.html">FAQ</a>
|
||
<a href="#contact">联系我们</a>
|
||
</nav>
|
||
<button class="mobile-toggle" onclick="document.getElementById('nav').classList.toggle('open')" aria-label="菜单">
|
||
<svg viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="1.5" stroke-linecap="round" stroke-linejoin="round">
|
||
<line x1="3" y1="6" x2="21" y2="6"></line>
|
||
<line x1="3" y1="12" x2="21" y2="12"></line>
|
||
<line x1="3" y1="18" x2="21" y2="18"></line>
|
||
</svg>
|
||
</button>
|
||
</div>
|
||
</header>
|
||
|
||
<!-- HERO -->
|
||
<section class="hero">
|
||
<div class="hero-inner">
|
||
<div class="hero-badge fade-in visible">
|
||
<svg viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="1.5" stroke-linecap="round" stroke-linejoin="round">
|
||
<path d="M6 9H4.5a2.5 2.5 0 0 1 0-5C7 4 7 7 9 7c0-2.5 2-5 5.5-4 .5 1 .5 2.5 1 3 2 .5 3 2 3 4 0 .5-2.5 2.5-2.5 4"></path>
|
||
<path d="M13 17H8l-2 5h10l-2-5"></path>
|
||
<path d="M20 11a2.5 2.5 0 1 0-3 4.2M10 13a2.5 2.5 0 1 0-1-4.7"></path>
|
||
</svg>
|
||
定边本地专业IT服务商 · 25年+行业经验
|
||
</div>
|
||
<h1 class="fade-in visible fade-in-d1">您的<em>专业IT服务</em>管家</h1>
|
||
<p class="fade-in visible fade-in-d2">深耕IT服务与数字化领域,集设备维修、产品销售、网络工程、Web应用开发于一体,为企业和个人提供一站式IT解决方案。</p>
|
||
<div class="hero-actions fade-in visible fade-in-d3">
|
||
<a href="tel:09124223980" class="btn btn-primary">
|
||
<svg viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="1.5" stroke-linecap="round" stroke-linejoin="round">
|
||
<path d="M22 16.92v3a2 2 0 0 1-2.18 2A19.79 19.79 0 0 1 7.32 6.18 2 2 0 0 1 9.5 4.5h3a2 2 0 0 1 2 1.72 12.84 12.84 0 0 0 .7 2.81 2 2 0 0 1-.45 2.11L13.5 13.5a12.06 12.06 0 0 0 5.67 5.67l1.78-1.78a2 2 0 0 1 2.11-.45 12.84 12.84 0 0 0 2.81.7A2 2 0 0 1 22 16.92z"></path>
|
||
</svg>
|
||
立即咨询:0912-4223980
|
||
</a>
|
||
<a href="#services" class="btn btn-outline">
|
||
查看服务项目
|
||
<svg viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="1.5" stroke-linecap="round" stroke-linejoin="round">
|
||
<line x1="5" y1="12" x2="19" y2="12"></line>
|
||
<polyline points="12 5 19 12 12 19"></polyline>
|
||
</svg>
|
||
</a>
|
||
</div>
|
||
</div>
|
||
</section>
|
||
|
||
<!-- SERVICES -->
|
||
<section id="services">
|
||
<div class="section-inner">
|
||
<div class="section-label fade-in">
|
||
<svg viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="1.5" stroke-linecap="round" stroke-linejoin="round">
|
||
<rect x="2" y="3" width="20" height="14" rx="2" ry="2"></rect>
|
||
<line x1="8" y1="21" x2="16" y2="21"></line>
|
||
<line x1="12" y1="17" x2="12" y2="21"></line>
|
||
</svg>
|
||
OUR SERVICES
|
||
</div>
|
||
<h2 class="section-title fade-in">我们的服务</h2>
|
||
<p class="section-desc fade-in">覆盖您全方位IT需求的专业服务,30分钟响应,2小时上门</p>
|
||
<div class="services-grid">
|
||
|
||
<!-- 电脑维修 -->
|
||
<div class="service-card fade-in fade-in-d1">
|
||
<div class="service-icon" style="background:#ede9fe;color:#7c3aed;">
|
||
<svg viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="1.5" stroke-linecap="round" stroke-linejoin="round">
|
||
<rect x="2" y="3" width="20" height="14" rx="2" ry="2"></rect>
|
||
<line x1="8" y1="21" x2="16" y2="21"></line>
|
||
<line x1="12" y1="17" x2="12" y2="21"></line>
|
||
</svg>
|
||
</div>
|
||
<h3>电脑维修</h3>
|
||
<p>台式机/笔记本故障诊断、硬件更换升级、系统安装优化、数据备份恢复、清灰保养</p>
|
||
<div class="service-tags">
|
||
<span>硬件维修</span><span>系统安装</span><span>数据恢复</span><span>清灰保养</span>
|
||
</div>
|
||
</div>
|
||
|
||
<!-- 打印机维修 -->
|
||
<div class="service-card fade-in fade-in-d1">
|
||
<div class="service-icon" style="background:#e0f2fe;color:#0284c7;">
|
||
<svg viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="1.5" stroke-linecap="round" stroke-linejoin="round">
|
||
<polyline points="6 9 6 2 18 2 18 9"></polyline>
|
||
<path d="M6 18H4a2 2 0 0 1-2-2v-5a2 2 0 0 1 2-2h16a2 2 0 0 1 2 2v5a2 2 0 0 1-2 2h-2"></path>
|
||
<rect x="6" y="14" width="12" height="8"></rect>
|
||
</svg>
|
||
</div>
|
||
<h3>打印机维修</h3>
|
||
<p>激光/喷墨打印机维修、驱动安装调试、加粉换墨、不进纸修复、网络打印配置</p>
|
||
<div class="service-tags">
|
||
<span>打印机维修</span><span>加粉换墨</span><span>驱动安装</span><span>网络打印</span>
|
||
</div>
|
||
</div>
|
||
|
||
<!-- 网络工程监控 -->
|
||
<div class="service-card fade-in fade-in-d2">
|
||
<div class="service-icon" style="background:#dcfce7;color:#16a34a;">
|
||
<svg viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="1.5" stroke-linecap="round" stroke-linejoin="round">
|
||
<circle cx="12" cy="12" r="10"></circle>
|
||
<line x1="2" y1="12" x2="22" y2="12"></line>
|
||
<path d="M12 2a15.3 15.3 0 0 1 4 10 15.3 15.3 0 0 1-4 10 15.3 15.3 0 0 1-4-10 15.3 15.3 0 0 1 4-10z"></path>
|
||
</svg>
|
||
</div>
|
||
<h3>网络工程监控</h3>
|
||
<p>综合布线、无线覆盖、企业组网、监控安防、弱电工程、机房建设</p>
|
||
<div class="service-tags">
|
||
<span>综合布线</span><span>无线覆盖</span><span>监控安防</span><span>弱电工程</span>
|
||
</div>
|
||
</div>
|
||
|
||
<!-- 行业应用开发 -->
|
||
<a href="https://learn.sxbh.ltd" target="_blank" class="service-card-link">
|
||
<div class="service-card fade-in fade-in-d2">
|
||
<div class="service-icon" style="background:#fff7ed;color:#ea580c;">
|
||
<svg viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="1.5" stroke-linecap="round" stroke-linejoin="round">
|
||
<rect x="5" y="2" width="14" height="20" rx="2"></rect>
|
||
<line x1="12" y1="18" x2="12" y2="18"></line>
|
||
</svg>
|
||
</div>
|
||
<h3>行业应用开发</h3>
|
||
<p>企业官网、管理后台、小程序、移动应用、行业管理系统定制、网站运维升级</p>
|
||
<div class="service-tags">
|
||
<span style="display:inline-flex;align-items:center;gap:4px;padding:5px 12px;border-radius:6px;background:#0f1f4a;color:#fff;font-size:13px;font-weight:500;">
|
||
<svg viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="1.5" stroke-linecap="round" stroke-linejoin="round" style="width:14px;height:14px;">
|
||
<circle cx="12" cy="12" r="10"></circle>
|
||
<line x1="2" y1="12" x2="22" y2="12"></line>
|
||
<path d="M12 2a15.3 15.3 0 0 1 4 10 15.3 15.3 0 0 1-4 10 15.3 15.3 0 0 1-4-10 15.3 15.3 0 0 1 4-10z"></path>
|
||
</svg>
|
||
全栈学习网
|
||
</span>
|
||
<span style="display:inline-flex;align-items:center;gap:4px;padding:5px 12px;border-radius:6px;background:#f1f5f9;color:#94a3b8;font-size:13px;font-weight:500;">
|
||
<svg viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="1.5" stroke-linecap="round" stroke-linejoin="round" style="width:14px;height:14px;">
|
||
<rect x="2" y="3" width="20" height="14" rx="2" ry="2"></rect>
|
||
<line x1="8" y1="21" x2="16" y2="21"></line>
|
||
<line x1="12" y1="17" x2="12" y2="21"></line>
|
||
</svg>
|
||
管理会计OS
|
||
</span>
|
||
</div>
|
||
</div>
|
||
</a>
|
||
|
||
<!-- IT运维服务 -->
|
||
<div class="service-card fade-in fade-in-d3">
|
||
<div class="service-icon" style="background:#fce7f3;color:#db2777;">
|
||
<svg viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="1.5" stroke-linecap="round" stroke-linejoin="round">
|
||
<circle cx="12" cy="12" r="3"></circle>
|
||
<path d="M19.4 15a1.65 1.65 0 0 0 .33 1.82l.06.06a2 2 0 0 1-2.83 2.83l-.06-.06a1.65 1.65 0 0 0-1.82-.33 1.65 1.65 0 0 0-1 1.51V21a2 2 0 0 1-4 0v-.09A1.65 1.65 0 0 0 9 19.4a1.65 1.65 0 0 0-1.82.33l-.06.06a2 2 0 0 1-2.83-2.83l.06-.06A1.65 1.65 0 0 0 4.68 15a1.65 1.65 0 0 0-1.51-1H3a2 2 0 0 1 0-4h.09A1.65 1.65 0 0 0 4.6 9a1.65 1.65 0 0 0-.33-1.82l-.06-.06a2 2 0 0 1 2.83-2.83l.06.06A1.65 1.65 0 0 0 9 4.68a1.65 1.65 0 0 0 1-1.51V3a2 2 0 0 1 4 0v.09a1.65 1.65 0 0 0 1 1.51 1.65 1.65 0 0 0 1.82-.33l.06-.06a2 2 0 0 1 2.83 2.83l-.06.06A1.65 1.65 0 0 0 19.4 9a1.65 1.65 0 0 0 1.51 1H21a2 2 0 0 1 0 4h-.09a1.65 1.65 0 0 0-1.51 1z"></path>
|
||
</svg>
|
||
</div>
|
||
<h3>IT运维服务</h3>
|
||
<p>驻场IT技术支持、服务器运维、网站建设维护、办公设备年度维保、IT规划咨询</p>
|
||
<div class="service-tags">
|
||
<span>驻场运维</span><span>服务器维护</span><span>IT规划</span>
|
||
</div>
|
||
</div>
|
||
|
||
</div>
|
||
</div>
|
||
</section>
|
||
|
||
<!-- PRODUCTS -->
|
||
<section id="products" style="background:var(--gray-100);">
|
||
<div class="section-inner">
|
||
<div class="section-label fade-in">
|
||
<svg viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="1.5" stroke-linecap="round" stroke-linejoin="round">
|
||
<path d="M6 2L3 6v14a2 2 0 0 0 2 2h14a2 2 0 0 0 2-2V6l-3-4z"></path>
|
||
<line x1="3" y1="6" x2="21" y2="6"></line>
|
||
<path d="M16 10a4 4 0 0 1-8 0"></path>
|
||
</svg>
|
||
PRODUCTS
|
||
</div>
|
||
<h2 class="section-title fade-in">产品销售</h2>
|
||
<p class="section-desc fade-in">正品行货,品质保障,电话下单2小时送达,免费安装</p>
|
||
<div class="products-grid">
|
||
|
||
<!-- 联想电脑 -->
|
||
<div class="product-card fade-in fade-in-d1">
|
||
<div class="product-img" style="background:linear-gradient(135deg,#eef2ff,#e0e7ff);">
|
||
<svg viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="1.5" stroke-linecap="round" stroke-linejoin="round" style="color:#6366f1;">
|
||
<rect x="2" y="3" width="20" height="14" rx="2" ry="2"></rect>
|
||
<line x1="8" y1="21" x2="16" y2="21"></line>
|
||
<line x1="12" y1="17" x2="12" y2="21"></line>
|
||
</svg>
|
||
</div>
|
||
<div class="product-body">
|
||
<h3>联想电脑</h3>
|
||
<p>联想 ThinkPad / 小新 / 拯救者系列笔记本、扬天 / ThinkCentre 台式机、工作站</p>
|
||
<div class="product-tags">
|
||
<span>笔记本</span><span>台式机</span><span>工作站</span><span>ThinkPad</span><span>小新</span><span>拯救者</span>
|
||
</div>
|
||
<a href="/products/lenovo.html" class="product-btn">
|
||
<svg viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="1.5" stroke-linecap="round" stroke-linejoin="round">
|
||
<line x1="5" y1="12" x2="19" y2="12"></line>
|
||
<polyline points="12 5 19 12 12 19"></polyline>
|
||
</svg>
|
||
查看详情
|
||
</a>
|
||
</div>
|
||
</div>
|
||
|
||
<!-- 办公设备 -->
|
||
<div class="product-card fade-in fade-in-d1">
|
||
<div class="product-img" style="background:linear-gradient(135deg,#f0fdf4,#dcfce7);">
|
||
<svg viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="1.5" stroke-linecap="round" stroke-linejoin="round" style="color:#16a34a;">
|
||
<polyline points="6 9 6 2 18 2 18 9"></polyline>
|
||
<path d="M6 18H4a2 2 0 0 1-2-2v-5a2 2 0 0 1 2-2h16a2 2 0 0 1 2 2v5a2 2 0 0 1-2 2h-2"></path>
|
||
<rect x="6" y="14" width="12" height="8"></rect>
|
||
</svg>
|
||
</div>
|
||
<div class="product-body">
|
||
<h3>办公设备</h3>
|
||
<p>打印机、复印机、扫描仪、多功能一体机、投影仪、碎纸机、会议设备</p>
|
||
<div class="product-tags">
|
||
<span>打印机</span><span>复印机</span><span>扫描仪</span><span>投影仪</span><span>一体机</span><span>会议设备</span>
|
||
</div>
|
||
<a href="/products/office.html" class="product-btn">
|
||
<svg viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="1.5" stroke-linecap="round" stroke-linejoin="round">
|
||
<line x1="5" y1="12" x2="19" y2="12"></line>
|
||
<polyline points="12 5 19 12 12 19"></polyline>
|
||
</svg>
|
||
查看详情
|
||
</a>
|
||
</div>
|
||
</div>
|
||
|
||
<!-- 配件耗材 -->
|
||
<div class="product-card fade-in fade-in-d2">
|
||
<div class="product-img" style="background:linear-gradient(135deg,#fefce8,#fef9c3);">
|
||
<svg viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="1.5" stroke-linecap="round" stroke-linejoin="round" style="color:#ca8a04;">
|
||
<circle cx="12" cy="12" r="3"></circle>
|
||
<path d="M19.4 15a1.65 1.65 0 0 0 .33 1.82l.06.06a2 2 0 0 1-2.83 2.83l-.06-.06a1.65 1.65 0 0 0-1.82-.33 1.65 1.65 0 0 0-1 1.51V21a2 2 0 0 1-4 0v-.09A1.65 1.65 0 0 0 9 19.4a1.65 1.65 0 0 0-1.82.33l-.06.06a2 2 0 0 1-2.83-2.83l.06-.06A1.65 1.65 0 0 0 4.68 15a1.65 1.65 0 0 0-1.51-1H3a2 2 0 0 1 0-4h.09A1.65 1.65 0 0 0 4.6 9a1.65 1.65 0 0 0-.33-1.82l-.06-.06a2 2 0 0 1 2.83-2.83l.06.06A1.65 1.65 0 0 0 9 4.68a1.65 1.65 0 0 0 1-1.51V3a2 2 0 0 1 4 0v.09a1.65 1.65 0 0 0 1 1.51 1.65 1.65 0 0 0 1.82-.33l.06-.06a2 2 0 0 1 2.83 2.83l-.06.06A1.65 1.65 0 0 0 19.4 9a1.65 1.65 0 0 0 1.51 1H21a2 2 0 0 1 0 4h-.09a1.65 1.65 0 0 0-1.51 1z"></path>
|
||
</svg>
|
||
</div>
|
||
<div class="product-body">
|
||
<h3>配件耗材</h3>
|
||
<p>原装/品牌硒鼓、墨盒、碳粉、色带、打印纸、网线、水晶头、电源、键鼠、内存、硬盘</p>
|
||
<div class="product-tags">
|
||
<span>硒鼓墨盒</span><span>碳粉</span><span>打印纸</span><span>网线</span><span>键鼠</span><span>内存硬盘</span>
|
||
</div>
|
||
<a href="/products/consumables.html" class="product-btn">
|
||
<svg viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="1.5" stroke-linecap="round" stroke-linejoin="round">
|
||
<line x1="5" y1="12" x2="19" y2="12"></line>
|
||
<polyline points="12 5 19 12 12 19"></polyline>
|
||
</svg>
|
||
查看详情
|
||
</a>
|
||
</div>
|
||
</div>
|
||
|
||
</div>
|
||
</div>
|
||
</section>
|
||
|
||
<!-- WHY US -->
|
||
<section id="why" class="why-section">
|
||
<div class="section-inner">
|
||
<div class="section-label fade-in">
|
||
<svg viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="1.5" stroke-linecap="round" stroke-linejoin="round">
|
||
<path d="M12 20h9"></path>
|
||
<path d="M16.5 3.5a2.121 2.121 0 0 1 3 3L7 19l-4 1 1-4L16.5 3.5z"></path>
|
||
</svg>
|
||
WHY CHOOSE US
|
||
</div>
|
||
<h2 class="section-title fade-in">为什么选择我们</h2>
|
||
<p class="section-desc fade-in">专业值得信赖,服务创造价值</p>
|
||
<div class="why-grid">
|
||
<div class="why-card fade-in fade-in-d1">
|
||
<div class="why-icon" style="background:#fef3c7;color:#d97706;">
|
||
<svg viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="1.5" stroke-linecap="round" stroke-linejoin="round">
|
||
<polygon points="13 2 3 14 12 14 11 22 21 10 12 10 13 2"></polygon>
|
||
</svg>
|
||
</div>
|
||
<h3>快速响应</h3>
|
||
<p>30分钟内响应您的需求<br>2小时内上门服务<br>紧急情况随叫随到</p>
|
||
</div>
|
||
<div class="why-card fade-in fade-in-d1">
|
||
<div class="why-icon" style="background:#ede9fe;color:#7c3aed;">
|
||
<svg viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="1.5" stroke-linecap="round" stroke-linejoin="round">
|
||
<circle cx="12" cy="8" r="6"></circle>
|
||
<path d="M15.477 12.89 17 22l-5-3-5 3 1.523-9.11"></path>
|
||
</svg>
|
||
</div>
|
||
<h3>专业资质</h3>
|
||
<p>资深认证工程师团队<br>十年以上行业经验<br>持续技术培训更新</p>
|
||
</div>
|
||
<div class="why-card fade-in fade-in-d2">
|
||
<div class="why-icon" style="background:#dbeafe;color:#2563eb;">
|
||
<svg viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="1.5" stroke-linecap="round" stroke-linejoin="round">
|
||
<path d="M12 22s8-4 8-10V5l-8-3-8 3v7c0 6 8 10 8 10z"></path>
|
||
</svg>
|
||
</div>
|
||
<h3>售后保障</h3>
|
||
<p>维修后质保3个月<br>所有报价公开透明<br>无隐形消费承诺</p>
|
||
</div>
|
||
<div class="why-card fade-in fade-in-d2">
|
||
<div class="why-icon" style="background:#fce7f3;color:#db2777;">
|
||
<svg viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="1.5" stroke-linecap="round" stroke-linejoin="round">
|
||
<rect x="2" y="3" width="20" height="14" rx="2" ry="2"></rect>
|
||
<line x1="8" y1="21" x2="16" y2="21"></line>
|
||
<line x1="12" y1="17" x2="12" y2="21"></line>
|
||
</svg>
|
||
</div>
|
||
<h3>全品类覆盖</h3>
|
||
<p>一站式IT服务解决方案<br>电脑·打印机·网络·服务器<br>省心省力·降本增效</p>
|
||
</div>
|
||
</div>
|
||
</div>
|
||
</section>
|
||
|
||
<!-- 博海视角(PERSPECTIVE) -->
|
||
<section id="perspective" class="perspective-section">
|
||
<div class="section-inner">
|
||
<div class="section-label fade-in">
|
||
<svg viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="1.5" stroke-linecap="round" stroke-linejoin="round">
|
||
<circle cx="12" cy="12" r="10"></circle>
|
||
<line x1="2" y1="12" x2="22" y2="12"></line>
|
||
<path d="M12 2a15.3 15.3 0 0 1 4 10 15.3 15.3 0 0 1-4 10 15.3 15.3 0 0 1-4-10 15.3 15.3 0 0 1 4-10z"></path>
|
||
</svg>
|
||
博海视角
|
||
</div>
|
||
<h2 class="section-title fade-in">洞察 · 思考 · 观点</h2>
|
||
<p class="section-desc fade-in">博海公司出品 · 一切皆如 — 品宣BOT同步发布的热点洞察与人文思考</p>
|
||
<div class="perspective-grid" id="perspective-list">
|
||
<!-- 动态由 JavaScript 加载 -->
|
||
</div>
|
||
<div class="perspective-actions fade-in fade-in-d3">
|
||
<a href="/perspective/" class="perspective-btn">
|
||
<svg viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="1.5" stroke-linecap="round" stroke-linejoin="round">
|
||
<line x1="5" y1="12" x2="19" y2="12"></line>
|
||
<polyline points="12 5 19 12 12 19"></polyline>
|
||
</svg>
|
||
查看全部 57 篇文章
|
||
</a>
|
||
</div>
|
||
</div>
|
||
</section>
|
||
|
||
<!-- CONTACT -->
|
||
<section class="contact-section" id="contact">
|
||
<div class="section-inner">
|
||
<div class="section-label fade-in" style="color:rgba(255,255,255,.4);">
|
||
<svg viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="1.5" stroke-linecap="round" stroke-linejoin="round">
|
||
<path d="M4 4h16c1.1 0 2 .9 2 2v12c0 1.1-.9 2-2 2H4c-1.1 0-2-.9-2-2V6c0-1.1.9-2 2-2z"></path>
|
||
<polyline points="22,6 12,13 2,6"></polyline>
|
||
</svg>
|
||
CONTACT US
|
||
</div>
|
||
<h2 class="section-title fade-in">联系我们</h2>
|
||
<p class="section-desc fade-in">随时为您服务,期待您的来电</p>
|
||
<div class="contact-grid">
|
||
<div class="contact-item fade-in fade-in-d1">
|
||
<div class="icon">
|
||
<svg viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="1.5" stroke-linecap="round" stroke-linejoin="round">
|
||
<path d="M22 16.92v3a2 2 0 0 1-2.18 2A19.79 19.79 0 0 1 7.32 6.18 2 2 0 0 1 9.5 4.5h3a2 2 0 0 1 2 1.72 12.84 12.84 0 0 0 .7 2.81 2 2 0 0 1-.45 2.11L13.5 13.5a12.06 12.06 0 0 0 5.67 5.67l1.78-1.78a2 2 0 0 1 2.11-.45 12.84 12.84 0 0 0 2.81.7A2 2 0 0 1 22 16.92z"></path>
|
||
</svg>
|
||
</div>
|
||
<h4>服务热线 · 售后专线</h4>
|
||
<div class="value">
|
||
<a href="tel:09124223980">0912-4223980</a> / <a href="tel:09124221786">0912-4221786</a>
|
||
<span class="divider">|</span>
|
||
<a href="tel:09124215944">0912-4215944</a>
|
||
</div>
|
||
<div class="sub">服务热线 8:30-18:00 · 售后技术支持 · 周末紧急报修</div>
|
||
</div>
|
||
<div class="contact-item fade-in fade-in-d1">
|
||
<div class="icon">
|
||
<svg viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="1.5" stroke-linecap="round" stroke-linejoin="round">
|
||
<path d="M21 10c0 7-9 13-9 13s-9-6-9-13a9 9 0 0 1 18 0z"></path>
|
||
<circle cx="12" cy="10" r="3"></circle>
|
||
</svg>
|
||
</div>
|
||
<h4>公司地址</h4>
|
||
<div class="value">陕西省榆林市定边县二道西街</div>
|
||
<div class="sub">定边县内均可上门服务</div>
|
||
</div>
|
||
<div class="contact-item fade-in fade-in-d2">
|
||
<div class="icon">
|
||
<svg viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="1.5" stroke-linecap="round" stroke-linejoin="round">
|
||
<circle cx="12" cy="12" r="10"></circle>
|
||
<polyline points="12 6 12 12 16 14"></polyline>
|
||
</svg>
|
||
</div>
|
||
<h4>服务时间</h4>
|
||
<div class="value">周一至周六 8:30 - 18:00</div>
|
||
<div class="sub">周日及节假日接受预约服务</div>
|
||
</div>
|
||
<div class="contact-item fade-in fade-in-d2">
|
||
<div class="icon">
|
||
<svg viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="1.5" stroke-linecap="round" stroke-linejoin="round">
|
||
<path d="M4 4h16c1.1 0 2 .9 2 2v12c0 1.1-.9 2-2 2H4c-1.1 0-2-.9-2-2V6c0-1.1.9-2 2-2z"></path>
|
||
<polyline points="22,6 12,13 2,6"></polyline>
|
||
</svg>
|
||
</div>
|
||
<h4>电子邮箱</h4>
|
||
<div class="value"><a href="mailto:service@sxbh.ltd">service@sxbh.ltd</a></div>
|
||
<div class="sub">24小时内回复邮件</div>
|
||
</div>
|
||
</div>
|
||
|
||
</section>
|
||
|
||
<!-- FOOTER -->
|
||
<footer>
|
||
<div>
|
||
© 2026 陕西博海网络科技有限公司
|
||
<span class="sep">|</span> 专业IT服务 · 值得信赖
|
||
</div>
|
||
<div style="margin-top:8px;">
|
||
<a href="https://beian.miit.gov.cn" target="_blank" rel="noopener">陕ICP备2023001969号-3</a>
|
||
<span class="sep">|</span>
|
||
<a href="https://beian.miit.gov.cn" target="_blank" rel="noopener">陕ICP备2023001969号</a>
|
||
</div>
|
||
</footer>
|
||
|
||
<!-- FLOAT CONSULT - 电话 + 微信 + 在线咨询 -->
|
||
<button class="float-btn consult-btn" onclick="toggleConsultModal()" aria-label="在线咨询" style="bottom:164px;">
|
||
<svg viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="1.5" stroke-linecap="round" stroke-linejoin="round">
|
||
<path d="M12 20h9"></path><path d="M16.5 3.5a2.121 2.121 0 0 1 3 3L7 19l-4 1 1-4L16.5 3.5z"></path>
|
||
</svg>
|
||
</button>
|
||
<a href="tel:09124223980" class="float-btn phone-btn" aria-label="电话咨询" style="bottom:96px;">
|
||
<svg viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="1.5" stroke-linecap="round" stroke-linejoin="round">
|
||
<path d="M22 16.92v3a2 2 0 0 1-2.18 2A19.79 19.79 0 0 1 7.32 6.18 2 2 0 0 1 9.5 4.5h3a2 2 0 0 1 2 1.72 12.84 12.84 0 0 0 .7 2.81 2 2 0 0 1-.45 2.11L13.5 13.5a12.06 12.06 0 0 0 5.67 5.67l1.78-1.78a2 2 0 0 1 2.11-.45 12.84 12.84 0 0 0 2.81.7A2 2 0 0 1 22 16.92z"></path>
|
||
</svg>
|
||
</a>
|
||
<a href="https://work.weixin.qq.com/ca/cawcde4a54ff2e7ff5" target="_blank" class="float-btn wecom-btn" aria-label="微信咨询" style="bottom:28px;">
|
||
<svg viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="1.5" stroke-linecap="round" stroke-linejoin="round">
|
||
<path d="M21 15a2 2 0 0 1-2 2H7l-4 4V5a2 2 0 0 1 2-2h14a2 2 0 0 1 2 2z"></path>
|
||
</svg>
|
||
</a>
|
||
|
||
<!-- CONSULT MODAL -->
|
||
<div id="consultOverlay" class="consult-overlay" onclick="closeConsultModal(event)">
|
||
<div class="consult-modal" onclick="event.stopPropagation()">
|
||
<button class="consult-close" onclick="closeConsultModal()">×</button>
|
||
<h3>在线咨询</h3>
|
||
<p class="consult-desc">请留下您的联系方式,我们将尽快与您取得联系</p>
|
||
<form id="consultForm" onsubmit="submitConsult(event)">
|
||
<div class="form-group">
|
||
<label for="consultName">姓名</label>
|
||
<input type="text" id="consultName" name="name" required placeholder="请输入您的姓名">
|
||
</div>
|
||
<div class="form-group">
|
||
<label for="consultPhone">联系电话</label>
|
||
<input type="tel" id="consultPhone" name="phone" required placeholder="请输入您的手机号">
|
||
</div>
|
||
<div class="form-group">
|
||
<label for="consultMsg">需求描述</label>
|
||
<textarea id="consultMsg" name="message" rows="3" placeholder="请简要描述您的需求(如:需要购买联想电脑、办公设备采购等)"></textarea>
|
||
</div>
|
||
<button type="submit" class="consult-submit">提交咨询</button>
|
||
<p class="consult-tip">或直接拨打 <strong>0912-4223980</strong></p>
|
||
</form>
|
||
<div id="consultSuccess" class="consult-success" style="display:none;">
|
||
<div class="success-icon">✓</div>
|
||
<h4>提交成功!</h4>
|
||
<p>感谢您的咨询,我们将尽快与您联系。</p>
|
||
<p style="font-size:13px;color:var(--gray-400);margin-top:4px;">或直接拨打 0912-4223980</p>
|
||
</div>
|
||
</div>
|
||
</div>
|
||
|
||
<script>
|
||
// ===== 咨询弹窗 =====
|
||
function toggleConsultModal() {
|
||
document.getElementById('consultOverlay').classList.toggle('open');
|
||
document.body.style.overflow = document.getElementById('consultOverlay').classList.contains('open') ? 'hidden' : '';
|
||
}
|
||
function closeConsultModal(e) {
|
||
if (e && e.target !== e.currentTarget) return;
|
||
document.getElementById('consultOverlay').classList.remove('open');
|
||
document.body.style.overflow = '';
|
||
}
|
||
function submitConsult(e) {
|
||
e.preventDefault();
|
||
const btn = document.querySelector('.consult-submit');
|
||
btn.disabled = true; btn.textContent = '提交中...';
|
||
const name = document.getElementById('consultName').value.trim();
|
||
const phone = document.getElementById('consultPhone').value.trim();
|
||
const msg = document.getElementById('consultMsg').value.trim();
|
||
const text = `📩 新咨询\n姓名: ${name}\n电话: ${phone}\n需求: ${msg || '未填写'}`;
|
||
|
||
// 通过 gotify 发送通知 - 尝试本地通知服务
|
||
fetch('https://sxbh.ltd/api/consult', {
|
||
method: 'POST',
|
||
headers: {'Content-Type': 'application/json'},
|
||
body: JSON.stringify({name, phone, message: msg})
|
||
}).catch(() => {
|
||
// 静默失败 - 通知可能失败但咨询已记录
|
||
});
|
||
|
||
// 显示成功
|
||
document.getElementById('consultForm').style.display = 'none';
|
||
document.getElementById('consultSuccess').style.display = 'block';
|
||
setTimeout(() => { closeConsultModal(); }, 3000);
|
||
}
|
||
|
||
const observer = new IntersectionObserver((entries) => {
|
||
entries.forEach(e => {
|
||
if (e.isIntersecting) e.target.classList.add('visible');
|
||
});
|
||
}, { threshold: .1 });
|
||
document.querySelectorAll('.fade-in').forEach(el => observer.observe(el));
|
||
|
||
// ===== 加载博海视角最新文章 =====
|
||
(async function() {
|
||
const container = document.getElementById('perspective-list');
|
||
try {
|
||
const resp = await fetch('/perspective-articles.json?t=' + Date.now());
|
||
if (!resp.ok) throw new Error('HTTP ' + resp.status);
|
||
const data = await resp.json();
|
||
const articles = data.articles || [];
|
||
if (articles.length === 0) {
|
||
container.innerHTML = '<p style="text-align:center;color:var(--gray-400);padding:40px;">暂无文章</p>';
|
||
return;
|
||
}
|
||
container.innerHTML = articles.slice(0, 6).map(a => `
|
||
<a href="${a.url}" target="_blank" class="service-card-link">
|
||
<div class="perspective-card fade-in">
|
||
<div class="cat">${a.category || '博海视角'}</div>
|
||
<h3>${a.title}</h3>
|
||
<div class="meta">${a.date || ''}</div>
|
||
<span class="perspective-link">
|
||
阅读全文
|
||
<svg viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="1.5" stroke-linecap="round" stroke-linejoin="round">
|
||
<line x1="5" y1="12" x2="19" y2="12"></line>
|
||
<polyline points="12 5 19 12 12 19"></polyline>
|
||
</svg>
|
||
</span>
|
||
</div>
|
||
</a>
|
||
`).join('');
|
||
// Trigger fade-in animation
|
||
requestAnimationFrame(() => {
|
||
container.querySelectorAll('.perspective-card').forEach(el => {
|
||
observer.observe(el);
|
||
// Force a quick reflow so the fade-in triggers
|
||
el.getBoundingClientRect();
|
||
});
|
||
});
|
||
} catch(e) {
|
||
console.error('加载博海视角文章失败:', e);
|
||
container.innerHTML = '<p style="text-align:center;color:var(--gray-400);padding:40px;">博海视角文章正在加载中…</p>';
|
||
}
|
||
})();
|
||
</script>
|
||
|
||
</body></html> |