714 lines
24 KiB
Vue
714 lines
24 KiB
Vue
<script lang="ts" setup>
|
||
import {ref, onMounted, onUnmounted} from 'vue'
|
||
|
||
/**
|
||
* 页面数据管理
|
||
* 存储页面中使用的各种数据和状态
|
||
*/
|
||
const pageData = ref({
|
||
// 轮播图数据
|
||
carouselItems: [
|
||
{
|
||
image: '/img/yuxiupdata/banner_2021_1.png',
|
||
alt: '成本降低，效率更高',
|
||
active: false
|
||
},
|
||
{
|
||
image: '/img/yuxiupdata/banner_2021_2.png',
|
||
alt: '成本降低，效率更高',
|
||
active: false
|
||
},
|
||
{
|
||
image: '/img/yuxiupdata/index23.png',
|
||
alt: '共享单车最佳拍档',
|
||
active: true
|
||
}
|
||
],
|
||
|
||
// 物联网解决方案数据
|
||
iotSolutions: [
|
||
{
|
||
id: 1,
|
||
title: '共享陪护床',
|
||
description: '解决医院陪护家属未配有床位，休息不便的问题…',
|
||
fullDescription: '解决医院陪护家属未配有床位，休息不便的问题，提高供给效率，满足患者及家属的需要，协助医院有效管理的同事，给患者家属更舒适的修养环境。',
|
||
image: '/img/yuxiupdata/banner3-1.png',
|
||
link: '/sharedbed'
|
||
},
|
||
{
|
||
id: 2,
|
||
title: '共享单车',
|
||
description: '解决大型园区或短距离出行麻烦，提高出行效率…',
|
||
fullDescription: '解决大型园区或短距离出行麻烦，提高出行效率，分时租赁单车，无桩共享，是一种新型的经济环保出行方式。',
|
||
image: '/img/yuxiupdata/banner3-2.png',
|
||
link: '/sharedSolutions/bike',
|
||
external: false
|
||
},
|
||
{
|
||
id: 3,
|
||
title: '共享电单车',
|
||
description: '解决人们最后三公里的出行，促进环保和健康出行...',
|
||
fullDescription: '解决人们最后三公里的出行，促进环保和健康出行，电动助力，省力高效。',
|
||
image: '/img/yuxiupdata/banner3-3.png',
|
||
link: '/sharedSolutions/eBike'
|
||
},
|
||
{
|
||
id: 4,
|
||
title: '共享电动车',
|
||
description: '电动车相比续航能力更强，适用于各种出行场…',
|
||
fullDescription: '电动车相比续航能力更强，适用于各种出行场景，一站式提供硬件设备与软件开发',
|
||
image: '/img/yuxiupdata/banner3-4.png',
|
||
link: '/sharedSolutions/eBike'
|
||
},
|
||
{
|
||
id: 5,
|
||
title: '共享滑板车',
|
||
description: '滑板车相对更加轻便，可穿梭于狭窄街巷，更符求…',
|
||
fullDescription: '滑板车相对更加轻便，可穿梭于狭窄街巷，更符合用户的短距离出行需求。',
|
||
image: '/img/yuxiupdata/banner3-5.png',
|
||
link: '/sharedSolutions/scooter'
|
||
}
|
||
],
|
||
|
||
// 多场景应用数据
|
||
multiScenarioApplications: [
|
||
{
|
||
id: 1,
|
||
title: '智能家居',
|
||
description: '智能门锁<br> 智能空调<br> 智能电饭煲<br> 智能窗帘<br> …',
|
||
image: '/img/yuxiupdata/banner2-1.png',
|
||
class: 'bodycnt-info1'
|
||
},
|
||
{
|
||
id: 2,
|
||
title: '智慧出行',
|
||
description: '共享单车<br> 共享汽车<br> 共享滑板车<br> 共享电动车<br> …',
|
||
image: '/img/yuxiupdata/banner2-2.png',
|
||
class: 'bodycnt-info2'
|
||
},
|
||
{
|
||
id: 3,
|
||
title: '智慧医疗',
|
||
description: '共享陪护床<br> 智能安防<br> 共享打印机<br> 共享充电宝<br> …',
|
||
image: '/img/yuxiupdata/banner2-3.png',
|
||
class: 'bodycnt-info3'
|
||
},
|
||
{
|
||
id: 4,
|
||
title: '智慧园区',
|
||
description: '智能自提柜<br> 共享健身房<br> 共享洗衣机<br> 智能门禁<br> …',
|
||
image: '/img/yuxiupdata/banner2-4.png',
|
||
class: 'bodycnt-info4'
|
||
}
|
||
],
|
||
|
||
// 软件应用开发数据
|
||
softwareDevelopment: [
|
||
{
|
||
id: 1,
|
||
title: 'iOS开发',
|
||
description: '专注于高端型IOS系统开发，提供优质的IOS APP开发设计方案服务。',
|
||
image: '/img/yuxiupdata/banner4-1.png'
|
||
},
|
||
{
|
||
id: 2,
|
||
title: 'Android开发',
|
||
description: '针对主流的android系统，提供一站式APP咨询、策划、开发服务。',
|
||
image: '/img/yuxiupdata/banner4-2.png'
|
||
},
|
||
{
|
||
id: 3,
|
||
title: '微信开发',
|
||
description: '针对企业需求提供专业微信公众平台开发服务。...',
|
||
image: '/img/yuxiupdata/banner4-3.png'
|
||
},
|
||
{
|
||
id: 4,
|
||
title: '小程序开发',
|
||
description: '无需安装APP，就可以带来更流畅快速的体验。',
|
||
image: '/img/yuxiupdata/banner4-4.png'
|
||
}
|
||
],
|
||
|
||
// 联网智能硬件数据
|
||
smartHardware: [
|
||
{
|
||
id: 1,
|
||
title: '锁',
|
||
description: 'N2搭载蓝牙4.0通讯技术，以及充分利用这项技术配合物联锁App实现蓝牙秒连接，秒解锁。未来，无需等待。GPS+移动基站LBS多重精准定位，蓝牙低功耗待机，轨迹记录，电子围栏（延伸），远程授权自动开锁，支持应急开锁（延伸），支持短信远程修改相关参数。',
|
||
image: '/img/yuxiupdata/locker.png',
|
||
position: 'left'
|
||
},
|
||
{
|
||
id: 2,
|
||
title: '联网控制器',
|
||
description: '通过改造传统传感器/PLC/变频器等实现快速联接（无需部署新设备）。通过灵活部署，快速形成各领域的物联网解决方案；有效降低用户改造、部署、维护成本。',
|
||
image: '/img/yuxiupdata/koz.png',
|
||
position: 'right'
|
||
}
|
||
],
|
||
|
||
// 联系我们数据
|
||
contactInfo: {
|
||
phone: '0755-85225123',
|
||
business: '18123752516',
|
||
email: 'yuxi@yuxiit.com',
|
||
address: '深圳市龙华新区1970文化创意产业园A栋206',
|
||
wechat: '/img/img/qywx.png'
|
||
}
|
||
})
|
||
|
||
/**
|
||
* 响应式状态管理
|
||
* 用于控制页面交互状态
|
||
*/
|
||
const uiState = ref({
|
||
// 导航菜单状态
|
||
mobileMenuOpen: false,
|
||
|
||
// 轮播图状态
|
||
currentSlide: 2,
|
||
autoPlayInterval: null as NodeJS.Timeout | null,
|
||
|
||
// 悬停状态
|
||
hoveredItem: null as number | null,
|
||
|
||
// 模态框状态
|
||
showModal: false
|
||
})
|
||
|
||
/**
|
||
* 导航菜单控制
|
||
* 功能：切换移动端导航菜单的显示/隐藏状态
|
||
*/
|
||
const toggleMobileMenu = () => {
|
||
uiState.value.mobileMenuOpen = !uiState.value.mobileMenuOpen
|
||
}
|
||
|
||
/**
|
||
* 轮播图控制
|
||
* 功能：管理轮播图的切换和自动播放
|
||
*/
|
||
const goToSlide = (index: number) => {
|
||
uiState.value.currentSlide = index
|
||
// 更新轮播图数据中的active状态
|
||
pageData.value.carouselItems.forEach((item, i) => {
|
||
item.active = i === index
|
||
})
|
||
}
|
||
|
||
const nextSlide = () => {
|
||
const nextIndex = (uiState.value.currentSlide + 1) % pageData.value.carouselItems.length
|
||
goToSlide(nextIndex)
|
||
}
|
||
|
||
const previousSlide = () => {
|
||
const prevIndex = uiState.value.currentSlide === 0
|
||
? pageData.value.carouselItems.length - 1
|
||
: uiState.value.currentSlide - 1
|
||
goToSlide(prevIndex)
|
||
}
|
||
|
||
const startAutoPlay = () => {
|
||
uiState.value.autoPlayInterval = setInterval(() => {
|
||
nextSlide()
|
||
}, 5000) // 5秒自动切换
|
||
}
|
||
|
||
const stopAutoPlay = () => {
|
||
if (uiState.value.autoPlayInterval) {
|
||
clearInterval(uiState.value.autoPlayInterval)
|
||
uiState.value.autoPlayInterval = null
|
||
}
|
||
}
|
||
|
||
/**
|
||
* 悬停效果控制
|
||
* 功能：管理卡片悬停时的状态变化
|
||
*/
|
||
const handleMouseEnter = (itemId: number) => {
|
||
uiState.value.hoveredItem = itemId
|
||
}
|
||
|
||
const handleMouseLeave = () => {
|
||
uiState.value.hoveredItem = null
|
||
}
|
||
|
||
/**
|
||
* 复制手机号功能
|
||
* 功能：复制手机号到剪贴板并显示成功提示
|
||
*/
|
||
const copyPhoneNumber = async () => {
|
||
try {
|
||
await navigator.clipboard.writeText(pageData.value.contactInfo.business)
|
||
uiState.value.showModal = true
|
||
|
||
// 3秒后自动关闭模态框
|
||
setTimeout(() => {
|
||
uiState.value.showModal = false
|
||
}, 3000)
|
||
} catch (error) {
|
||
console.error('复制失败:', error)
|
||
// 降级方案：使用传统复制方法
|
||
const textArea = document.createElement('textarea')
|
||
textArea.value = pageData.value.contactInfo.business
|
||
document.body.appendChild(textArea)
|
||
textArea.select()
|
||
document.execCommand('copy')
|
||
document.body.removeChild(textArea)
|
||
uiState.value.showModal = true
|
||
}
|
||
}
|
||
|
||
/**
|
||
* 关闭模态框
|
||
* 功能：关闭复制成功的提示模态框
|
||
*/
|
||
const closeModal = () => {
|
||
uiState.value.showModal = false
|
||
}
|
||
|
||
/**
|
||
* 处理锚点链接
|
||
* 功能：清除URL中的锚点，避免页面跳转问题
|
||
*/
|
||
const handleAnchorLinks = () => {
|
||
if (window.location.hash) {
|
||
history.replaceState('', document.title, window.location.pathname + window.location.search)
|
||
}
|
||
}
|
||
|
||
/**
|
||
* 加载CSS样式文件
|
||
* 功能：动态加载所需的CSS样式文件
|
||
*/
|
||
const loadCSSFiles = () => {
|
||
const cssFiles = [
|
||
'/css/bootstrap.min.css',
|
||
'/css/main2.css',
|
||
'/css/main.css',
|
||
'/css/yuxi2019.css'
|
||
]
|
||
|
||
cssFiles.forEach(href => {
|
||
// 检查是否已经加载过该CSS文件
|
||
const existingLink = document.querySelector(`link[href="${href}"]`)
|
||
if (!existingLink) {
|
||
const link = document.createElement('link')
|
||
link.rel = 'stylesheet'
|
||
link.href = href
|
||
link.type = 'text/css'
|
||
document.head.appendChild(link)
|
||
}
|
||
})
|
||
}
|
||
|
||
/**
|
||
* 加载 JavaScript 文件
|
||
* 功能：动态加载所需的 JavaScript 库和脚本文件
|
||
*/
|
||
const loadJSFiles = () => {
|
||
const jsFiles = [
|
||
'/js/jquery-1.10.2.js',
|
||
'/js/bootstrap.min.js',
|
||
'/js/index.js',
|
||
'/js/news.js',
|
||
'/js/gopcOm.js'
|
||
]
|
||
|
||
jsFiles.forEach(src => {
|
||
// 检查是否已经加载过该JS文件
|
||
const existingScript = document.querySelector(`script[src="${src}"]`)
|
||
if (!existingScript) {
|
||
const script = document.createElement('script')
|
||
script.src = src
|
||
script.type = 'text/javascript'
|
||
document.head.appendChild(script)
|
||
}
|
||
})
|
||
}
|
||
|
||
/**
|
||
* 添加网站图标
|
||
* 功能：动态添加 favicon 到页面头部
|
||
*/
|
||
const addFavicon = () => {
|
||
const link = document.createElement('link')
|
||
link.rel = 'shortcut icon'
|
||
link.href = '/img/logoIco.ico'
|
||
document.head.appendChild(link)
|
||
}
|
||
|
||
/**
|
||
* 百度统计代码
|
||
* 功能：动态加载百度统计脚本
|
||
*/
|
||
const loadBaiduAnalytics = () => {
|
||
const protocol = window.location.protocol === 'https:' ? 'https://' : 'http://'
|
||
const script = document.createElement('script')
|
||
script.src = `${protocol}hm.baidu.com/h.js?34439d222cbf169237b7b18841a6c8f0`
|
||
script.type = 'text/javascript'
|
||
document.head.appendChild(script)
|
||
}
|
||
|
||
/**
|
||
* 解决方案标签页切换
|
||
* 功能：处理解决方案部分的标签页切换逻辑
|
||
*/
|
||
const handleSolutionTabHover = (index: number) => {
|
||
// 移除所有active类
|
||
const tabs = document.querySelectorAll('.solution .items-body li')
|
||
tabs.forEach(tab => tab.classList.remove('active'))
|
||
|
||
// 添加active类到当前标签
|
||
if (tabs[index]) {
|
||
tabs[index].classList.add('active')
|
||
}
|
||
|
||
// 显示对应的内容
|
||
const contents = document.querySelectorAll('.items-body-right .solution-rightTabs')
|
||
contents.forEach((content, i) => {
|
||
if (i === index) {
|
||
(content as HTMLElement).style.display = 'block'
|
||
} else {
|
||
(content as HTMLElement).style.display = 'none'
|
||
}
|
||
})
|
||
|
||
// 更新内容类名
|
||
const content3 = document.querySelector('.content3')
|
||
if (content3) {
|
||
content3.className = `content3 content3${index}`
|
||
}
|
||
}
|
||
|
||
/**
|
||
* 下拉菜单图片切换
|
||
* 功能：处理下拉菜单中图片的悬停切换
|
||
*/
|
||
const handleDropdownImageHover = (index: number) => {
|
||
const dropdownMenu = document.querySelector('.dropdown-menu')
|
||
if (dropdownMenu) {
|
||
const images = dropdownMenu.querySelectorAll('.pull-left img')
|
||
images.forEach((img, i) => {
|
||
if (i === index) {
|
||
(img as HTMLElement).style.display = 'block'
|
||
} else {
|
||
(img as HTMLElement).style.display = 'none'
|
||
}
|
||
})
|
||
}
|
||
}
|
||
|
||
/**
|
||
* 页面初始化
|
||
* 功能：设置页面初始状态和事件监听
|
||
*/
|
||
onMounted(() => {
|
||
// 加载CSS样式文件
|
||
loadCSSFiles()
|
||
|
||
// 加载JavaScript文件
|
||
loadJSFiles()
|
||
|
||
// 添加 favicon
|
||
addFavicon()
|
||
|
||
// 处理锚点链接
|
||
handleAnchorLinks()
|
||
|
||
// 启动轮播图自动播放
|
||
startAutoPlay()
|
||
|
||
// 初始化轮播图状态
|
||
pageData.value.carouselItems.forEach((item, index) => {
|
||
item.active = index === uiState.value.currentSlide
|
||
})
|
||
|
||
// 加载百度统计
|
||
loadBaiduAnalytics()
|
||
|
||
// 绑定解决方案标签页事件
|
||
const solutionTabs = document.querySelectorAll('.solution .items-body li')
|
||
solutionTabs.forEach((tab, index) => {
|
||
tab.addEventListener('mouseenter', () => handleSolutionTabHover(index))
|
||
})
|
||
|
||
// 绑定下拉菜单事件
|
||
const dropdownItems = document.querySelectorAll('.dropdown-menu ul li')
|
||
dropdownItems.forEach((item, index) => {
|
||
item.addEventListener('mouseenter', () => handleDropdownImageHover(index))
|
||
})
|
||
})
|
||
|
||
/**
|
||
* 页面卸载清理
|
||
* 功能：清理定时器和事件监听器
|
||
*/
|
||
onUnmounted(() => {
|
||
stopAutoPlay()
|
||
})
|
||
</script>
|
||
|
||
<template>
|
||
<view>
|
||
<!-- 轮播轮播 轮播轮播 -->
|
||
<div id="carousel-example-generic" class="carousel slide" data-ride="carousel">
|
||
<ol class="carousel-indicators" style="background-color: rgba(0,0,0,0.08);">
|
||
<li class="active" data-slide-to="0" data-target="#carousel-example-generic"/>
|
||
<li data-slide-to="1" data-target="#carousel-example-generic"/>
|
||
<li data-slide-to="2" data-target="#carousel-example-generic"/>
|
||
</ol>
|
||
<!-- Wrapper for slides -->
|
||
<div class="carousel-inner" role="listbox">
|
||
<div class="item">
|
||
<img alt="成本降低，效率更高" src="/img/yuxiupdata/banner_2021_1.png" style="width: 100%;">
|
||
</div>
|
||
<div class="item">
|
||
<img alt="成本降低，效率更高" src="/img/yuxiupdata/banner_2021_2.png" style="width: 100%;">
|
||
</div>
|
||
<div class="item active">
|
||
<img alt="共享单车最佳拍档" src="/img/yuxiupdata/index23.png" style="width: 100%;">
|
||
<!-- <div class="carousel-caption">
|
||
<h2>智慧科技让生活更美好，帮助企业快速实现智能化</h2>
|
||
<ul class="list-unstyled hidden-xs hidden-sm">
|
||
<li><a href="/softwareDevelopment/app"><img src="/img/yuxiupdata/item1-1.png" alt="APP定制开发"></a> <span></span>APP定制开发</li>
|
||
<li><a href="/softwareDevelopment/wechat" target="_blank"><img src="/img/yuxiupdata/item1-2.png" alt="微信开发"></a><span></span>微信开发</li>
|
||
<li><a><img src="/img/yuxiupdata/item1-3.png" alt="管理后台开发"></a><span></span>管理后台开发</li>
|
||
<li><a href="/softwareDevelopment/miniprogram"><img src="/img/yuxiupdata/item1-4.png" alt="小程序开发"></a><span></span>小程序开发</li>
|
||
</ul>
|
||
</div> -->
|
||
</div>
|
||
<!-- <div class="item">
|
||
<img src="/img/yuxiupdata/banner1.png" alt="成本降低，效率更高"> -->
|
||
<!-- <div class="carousel-caption">
|
||
<h4 style="margin-top: 160px;">成本降低，效率更高</h4>
|
||
<h2 class="scondh2">物联网软硬件一站式解决方案提供商</h2>
|
||
<ul class="list-unstyled hidden-xs hidden-sm">
|
||
<li><a href="/softwareDevelopment/app"><img src="/img/yuxiupdata/item1-1.png" alt="APP定制开发"></a> <span></span>APP定制开发</li>
|
||
<li><a href="/softwareDevelopment/wechat" target="_blank"><img src="/img/yuxiupdata/item1-2.png" alt="微信开发"></a><span></span>微信开发</li>
|
||
<li><a><img src="/img/yuxiupdata/item1-3.png" alt="管理后台开发"></a><span></span>管理后台开发</li>
|
||
<li><a href="/softwareDevelopment/miniprogram"><img src="/img/yuxiupdata/item1-4.png" alt="小程序开发"></a><span></span>小程序开发</li>
|
||
</ul>
|
||
</div> -->
|
||
<!-- </div> -->
|
||
</div>
|
||
</div>
|
||
|
||
|
||
<!-- 物联网解决方案 -->
|
||
<div class="container-fluid text-center mainitems">
|
||
<div class="headtit">物联网解决方案</div>
|
||
<div class="minstit">针对不同类型使用场景需求，量身定制解决方案</div>
|
||
<div class="row inteBody">
|
||
<!-- -->
|
||
<div class="col-xs-12 col-lg-2 col-lg-offset-1">
|
||
<div class="intebody-info">
|
||
<a href="#"><img alt="" src="/img/yuxiupdata/banner3-1.png"></a>
|
||
<h2>共享陪护床</h2>
|
||
<p>解决医院陪护家属未配有床位，休息不便的问题…</p>
|
||
</div>
|
||
|
||
<div class="intebody-hover">
|
||
<h2>共享陪护床</h2>
|
||
<p>
|
||
解决医院陪护家属未配有床位，休息不便的问题，提高供给效率，满足患者及家属的需要，协助医院有效管理的同事，给患者家属更舒适的修养环境。</p>
|
||
<a href="/sharedSolutions/sharedbed">查看详情</a>
|
||
</div>
|
||
</div>
|
||
<!-- -->
|
||
<div class="col-xs-12 col-lg-2">
|
||
<div class="intebody-info">
|
||
<a href="#"><img alt="" src="/img/yuxiupdata/banner3-2.png"></a>
|
||
<h2>共享单车</h2>
|
||
<p>解决大型园区或短距离出行麻烦，提高出行效率…</p>
|
||
</div>
|
||
|
||
<div class="intebody-hover">
|
||
<h2>共享单车</h2>
|
||
<p>解决大型园区或短距离出行麻烦，提高出行效率，分时租赁单车，无桩共享，是一种新型的经济环保出行方式。</p>
|
||
<a href="/sharedSolutions/bike" target="_blank">查看详情</a>
|
||
</div>
|
||
</div>
|
||
<!-- -->
|
||
<div class="col-xs-12 col-lg-2">
|
||
<div class="intebody-info">
|
||
<a href="#"><img alt="" src="/img/yuxiupdata/banner3-3.png"></a>
|
||
<h2>共享电单车</h2>
|
||
<p>解决人们最后三公里的出行，促进环保和健康出行...</p>
|
||
</div>
|
||
<div class="intebody-hover">
|
||
<h2>共享单车</h2>
|
||
<p>解决人们最后三公里的出行，促进环保和健康出行，电动助力，省力高效。</p>
|
||
<a href="/sharedSolutions/eBike">查看详情</a>
|
||
</div>
|
||
</div>
|
||
<!-- -->
|
||
<div class="col-xs-12 col-lg-2">
|
||
<div class="intebody-info">
|
||
<a href="#"><img alt="" src="/img/yuxiupdata/banner3-4.png"></a>
|
||
<h2>共享电动车</h2>
|
||
<p>电动车相比续航能力更强，适用于各种出行场…</p>
|
||
</div>
|
||
|
||
<div class="intebody-hover">
|
||
<h2>共享电动车</h2>
|
||
<p>电动车相比续航能力更强，适用于各种出行场景，一站式提供硬件设备与软件开发</p>
|
||
<a href="/sharedSolutions/eBike">查看详情</a>
|
||
</div>
|
||
</div>
|
||
<!-- -->
|
||
<div class="col-xs-12 col-lg-2">
|
||
<div class="intebody-info">
|
||
<a href="#"><img alt="" src="/img/yuxiupdata/banner3-5.png"></a>
|
||
<h2>共享滑板车</h2>
|
||
<p>滑板车相对更加轻便，可穿梭于狭窄街巷，更符求…</p>
|
||
</div>
|
||
|
||
<div class="intebody-hover">
|
||
<h2>共享滑板车</h2>
|
||
<p>滑板车相对更加轻便，可穿梭于狭窄街巷，更符合用户的短距离出行需求。</p>
|
||
<a href="/sharedSolutions/scooter">查看详情</a>
|
||
</div>
|
||
</div>
|
||
</div>
|
||
</div>
|
||
|
||
|
||
<!-- 多场景应用 -->
|
||
<div class="container-fluid text-center mainitems" style="background: #FAFAFA;">
|
||
<div class="headtit">多场景应用</div>
|
||
<div class="minstit">通过专业的智能硬件与软件系统开发，解决物联网平台在各类复杂场景下的应用问题</div>
|
||
<div class="row bodycnt">
|
||
<!-- -->
|
||
<div class="col-xs-12 col-lg-2 col-lg-offset-2">
|
||
<div class="bodycnt-info bodycnt-info1">
|
||
<img alt="" src="/img/yuxiupdata/banner2-1.png"><span/>智能家居
|
||
</div>
|
||
|
||
<div class="bodycnt-datails">
|
||
<h2>智能家居</h2>
|
||
<span/>
|
||
<p>智能门锁<br> 智能空调<br> 智能电饭煲<br> 智能窗帘<br> …</p>
|
||
</div>
|
||
</div>
|
||
<!-- -->
|
||
<div class="col-xs-12 col-lg-2">
|
||
<div class="bodycnt-info bodycnt-info2">
|
||
<img alt="" src="/img/yuxiupdata/banner2-2.png"><span/>智慧出行
|
||
</div>
|
||
|
||
<div class="bodycnt-datails">
|
||
<h2>智慧出行</h2>
|
||
<span/>
|
||
<p>共享单车<br> 共享汽车<br> 共享滑板车<br> 共享电动车<br> …</p>
|
||
</div>
|
||
</div>
|
||
<!-- -->
|
||
<div class="col-xs-12 col-lg-2">
|
||
<div class="bodycnt-info bodycnt-info3">
|
||
<img alt="" src="/img/yuxiupdata/banner2-3.png"><span/>智慧医疗
|
||
</div>
|
||
<div class="bodycnt-datails">
|
||
<h2>智慧医疗</h2>
|
||
<span/>
|
||
<p>共享陪护床<br> 智能安防<br> 共享打印机<br> 共享充电宝<br> …</p>
|
||
</div>
|
||
</div>
|
||
<!-- -->
|
||
<div class="col-xs-12 col-lg-2">
|
||
<div class="bodycnt-info bodycnt-info4">
|
||
<img alt="" src="/img/yuxiupdata/banner2-4.png"><span/>智慧园区
|
||
</div>
|
||
<div class="bodycnt-datails">
|
||
<h2>智慧园区</h2>
|
||
<span/>
|
||
<p>智能自提柜<br> 共享健身房<br> 共享洗衣机<br> 智能门禁<br> …</p>
|
||
</div>
|
||
</div>
|
||
</div>
|
||
<div class="m-btns"><a href="/IoTSolutions/Internet_Things_hardware">了解更多</a></div>
|
||
</div>
|
||
|
||
|
||
<!-- 软件应用开发 -->
|
||
<div class="container text-center mainitems">
|
||
<div class="headtit">软件应用开发</div>
|
||
<div class="row applicatBody">
|
||
<!-- -->
|
||
<div class="col-xs-12 col-lg-3">
|
||
<div class="appbody-info">
|
||
<img alt="" src="/img/yuxiupdata/banner4-1.png">
|
||
<h2>iOS开发</h2>
|
||
<p>专注于高端型IOS系统开发，提供优质的IOS APP开发设计方案服务。</p>
|
||
</div>
|
||
</div>
|
||
<!-- -->
|
||
<div class="col-xs-12 col-lg-3">
|
||
<div class="appbody-info">
|
||
<img alt="" src="/img/yuxiupdata/banner4-2.png">
|
||
<h2>Android开发</h2>
|
||
<p>针对主流的android系统，提供一站式APP咨询、策划、开发服务。</p>
|
||
</div>
|
||
</div>
|
||
<!-- -->
|
||
<div class="col-xs-12 col-lg-3">
|
||
<div class="appbody-info">
|
||
<img alt="" src="/img/yuxiupdata/banner4-3.png">
|
||
<h2>微信开发</h2>
|
||
<p>针对企业需求提供专业微信公众平台开发服务。...</p>
|
||
</div>
|
||
</div>
|
||
<!-- -->
|
||
<div class="col-xs-12 col-lg-3">
|
||
<div class="appbody-info">
|
||
<img alt="" src="/img/yuxiupdata/banner4-4.png">
|
||
<h2>小程序开发</h2>
|
||
<p>无需安装APP，就可以带来更流畅快速的体验。</p>
|
||
</div>
|
||
</div>
|
||
</div>
|
||
</div>
|
||
|
||
|
||
<!-- 联网智能硬件 -->
|
||
<div class="container-fluid text-center mainitems hardware">
|
||
<div class="headtit" style="color: #fff;">联网智能硬件</div>
|
||
<div class="row">
|
||
<div class="col-xs-12 col-lg-8 col-lg-offset-2">
|
||
|
||
<div class="hardware-conter">
|
||
<img alt="联网智能硬件" class="img-responsive" src="/img/yuxiupdata/locker.png">
|
||
<div class="col-xs-12 col-lg-8">
|
||
<span>锁</span>
|
||
<i/>
|
||
<p>
|
||
N2搭载蓝牙4.0通讯技术，以及充分利用这项技术配合物联锁App实现蓝牙秒连接，秒解锁。未来，无需等待。GPS+移动基站LBS多重精准定位，蓝牙低功耗待机，轨迹记录，电子围栏（延伸），远程授权自动开锁，支持应急开锁（延伸），支持短信远程修改相关参数。</p>
|
||
</div>
|
||
</div>
|
||
|
||
<div class="hardware-conter" style="margin-top: 30px;">
|
||
<div class="col-xs-12 col-lg-8">
|
||
<span>联网控制器</span>
|
||
<i/>
|
||
<p>
|
||
通过改造传统传感器/PLC/变频器等实现快速联接（无需部署新设备）。通过灵活部署，快速形成各领域的物联网解决方案；有效降低用户改造、部署、维护成本。</p>
|
||
</div>
|
||
<img alt="联网智能硬件" class="img-responsive" src="/img/yuxiupdata/koz.png" style="float: right;">
|
||
</div>
|
||
|
||
</div>
|
||
</div>
|
||
<!-- 联网智能硬件锁-->
|
||
<div class="m-btns" style="background: none">
|
||
<a href="/IoTSolutions/Internet_Things_hardware">了解更多</a>
|
||
</div>
|
||
</div>
|
||
|
||
|
||
</view>
|
||
</template>
|
||
|
||
<style scoped>
|
||
/* 组件样式 */
|
||
</style> |