ct/app/pages/IoTSolutions/Internet_Things_hardware.vue

<script lang="ts" setup>
import {useHead} from "#app";

definePageMeta({
  layout: 'no-new'
})

// 使用 Nuxt 3 的 useHead 来管理头部资源
useHead({
  link: [
    {rel: 'stylesheet', href: '/css/bootstrap.min.css'},
    {rel: 'stylesheet', href: '/css/main2.css'},

    {rel: 'stylesheet', href: '/css/yuxi2019.css'},
    {rel: 'stylesheet', href: '/css/Internet_Things.css'}
  ],
  script: [

    {src: '/js/index.js'},
    {src: '/js/gopcOm.js'}
  ]
})
</script>

<template>

  <view>


    <div class="internet_Things_hardware">
      <!-- item1 智能硬件—物联网解决方案基石-->
      <div class="item1">
        <h2>智能硬件—物联网解决方案基石</h2>
        <h4>成熟稳定、可管可控、快速改造传统设备</h4>
      </div>


      <!--item2  多行业赋能 -->
      <div class="container">
        <div class="row item2 text-center">
          <!--  -->
          <h2>多行业赋能</h2>

          <div class="col-xs-4 col-md-1 col-md-offset-2">
            <img alt="共享经济" class="img-responsive center-block" src="/img/internet_thinks/icon_hard11.png">
            <h4>共享经济</h4>
          </div>

          <div class="col-xs-4 col-md-1">
            <img alt="新零售" class="img-responsive center-block" src="/img/internet_thinks/icon_hard12.png">
            <h4>新零售</h4>
          </div>

          <div class="col-xs-4 col-md-1">
            <img alt="智慧景区" class="img-responsive center-block" src="/img/internet_thinks/icon_hard13.png">
            <h4>智慧景区</h4>
          </div>

          <div class="col-xs-4 col-md-1">
            <img alt="智慧农业" class="img-responsive center-block" src="/img/internet_thinks/icon_hard14.png">
            <h4>智慧农业</h4>
          </div>

          <div class="col-xs-4 col-md-1">
            <img alt="智慧医疗" class="img-responsive center-block" src="/img/internet_thinks/icon_hard15.png">
            <h4>智慧医疗</h4>
          </div>

          <div class="col-xs-4 col-md-1">
            <img alt="智能家居" class="img-responsive center-block" src="/img/internet_thinks/icon_hard16.png">
            <h4>智能家居</h4>
          </div>

          <div class="col-xs-4 col-md-1">
            <img alt="智慧校区" class="img-responsive center-block" src="/img/internet_thinks/icon_hard17.png">
            <h4>智慧校区</h4>
          </div>

          <div class="col-xs-4 col-md-1">
            <img alt="智慧物业" class="img-responsive center-block" src="/img/internet_thinks/icon_hard18.png">
            <h4>智慧物业</h4>
          </div>

          <div class="col-xs-12">
            <a href="#">多行业赋能</a>
          </div>
          <!--  -->
        </div>
      </div>


      <!-- item3 设备端物联网智能模块 -->
      <div class="container-fluid">
        <div class="row item3 text-center">
          <!--  -->
          <div class="col-xs-12">
            <h2>设备端物联网智能模块</h2>
            <h4>提供一系列集成物联网通信协议、保证实时可靠传输的IOT终端适配模块产品</h4>
            <img
                alt="设备端物联网智能模块" class="img-responsive center-block"
                src="/img/internet_thinks/item_hard1.png">
          </div>
          <!--  -->
        </div>
      </div>


      <!-- item4 软件功能模块 -->
      <div class="container">
        <div class="row item4 text-center">
          <!--  -->
          <h2>软件功能模块</h2>
          <h3>与服务支撑系统无缝对接，可按需求定制，为企业有效降低开发成本</h3>

          <div class="col-xs-6 col-md-3">
            <img alt="接入优势" class="img-responsive center-block" src="/img/internet_thinks/icon_hard21.png">
            <h4>对接</h4>
            <h6>可按需求定义基于二进制的协议</h6>
          </div>

          <div class="col-xs-6 col-md-3">
            <img alt="服务器协议" class="img-responsive center-block" src="/img/internet_thinks/icon_hard22.png">
            <h4>服务器协议</h4>
            <h6>可按需求定义基于二进制的协议</h6>
          </div>

          <div class="col-xs-6 col-md-3">
            <img alt="逻辑控制" class="img-responsive center-block" src="/img/internet_thinks/icon_hard23.png">
            <h4>逻辑控制</h4>
            <h6>简单状态控制，数量报警</h6>
          </div>

          <div class="col-xs-6 col-md-3">
            <img alt="数据传输" class="img-responsive center-block" src="/img/internet_thinks/icon_hard24.png">
            <h4>数据传输</h4>
            <h6>基于flash的可靠性数据传输</h6>
          </div>
          <!--  -->
        </div>
      </div>


      <!-- item5 产品参数 -->
      <div class="container-fluid">
        <div id="grad2" class="row item5 text-center">
          <!--  -->
          <h2>产品参数</h2>
          <h4>以下产品参数是以智能电动车解决方案为例，可根据客户需求调整或进行定制开发</h4>
          <img alt="接入优势" class="img-responsive center-block" src="/img/internet_thinks/item_hard2.png">
          <!--  -->
        </div>
      </div>


      <!-- item6 产品参数 -->
      <div class="container-fluid item6 text-center">
        <!--  -->
        <div class="row">
          <h2>产品优势</h2>
          <h4>具备高兼容性和柔性适配能力，能够完美支撑个性场景需求</h4>
        </div>
        <!--  -->
        <div class="row item6-index">
          <div class="col-xs-6 col-md-4">
            <img alt="数据传输" class="img-responsive center-block" src="/img/internet_thinks/icon_hard31.png">
            <p>硬件采用低功耗设计方案，联网状态下，功耗低于5mA以下</p>
          </div>

          <div class="col-xs-6 col-md-4">
            <img alt="数据传输" class="img-responsive center-block" src="/img/internet_thinks/icon_hard32.png">
            <p>支持GPRS数据通道，支持蓝牙4.0</p>
          </div>

          <div class="col-xs-6 col-md-4">
            <img alt="数据传输" class="img-responsive center-block" src="/img/internet_thinks/icon_hard33.png">
            <p>支持GPS定位，GPRS辅助定位，定位精度高</p>
          </div>

          <div class="col-xs-6 col-md-4">
            <img alt="数据传输" class="img-responsive center-block" src="/img/internet_thinks/icon_hard34.png">
            <p>支持标准TTL通道，TTL调试通道</p>
          </div>

          <div class="col-xs-6 col-md-4">
            <img alt="数据传输" class="img-responsive center-block" src="/img/internet_thinks/icon_hard35.png">
            <p>支持断电重启，支持软件和硬件看门狗</p>
          </div>

          <div class="col-xs-6 col-md-4">
            <img alt="数据传输" class="img-responsive center-block" src="/img/internet_thinks/icon_hard36.png">
            <p>整体方案，服务器指令响应时间2秒内</p>
          </div>
        </div>
        <!--  -->
      </div>


      <!-- //////////////-->
      <!-- //////////////-->
    </div>

  </view>
</template>