smartOpration.vue 6.6 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141142143144145146147148149150151152153154155156157158159160161162163164165166167168169170171172173174175176177178179180181182183184185186187188189190191192193194195196197198199200201202203204205206207208209210211212213214215216217218219220221222223224225
  1. <template>
  2. <view class="content">
  3. <!-- 顶部logo和菜单 -->
  4. <uTop></uTop>
  5. <!-- 标题和介绍 -->
  6. <uDesc :title="dTitle" :description="dMemo" :bg="bannerBg"></uDesc>
  7. <view class="boxs">
  8. <!-- 产品功能 -->
  9. <view class="fatz box">
  10. <view class="title">方案特征</view>
  11. <view class="items">
  12. <view class="item">
  13. <image src="../../static/imgs/fmcs_fatz1.png"></image>
  14. <p>设备覆盖广</p>
  15. <p>支持跨设备类型、协议、厂商、地域的统一连接,实现设备在线化、数据化</p>
  16. </view>
  17. <view class="item">
  18. <image src="../../static/imgs/fmcs_fatz3.png"></image>
  19. <p>智慧化运维</p>
  20. <p>可解决实时监测、无人值守、联动策略、设备群控、智能报警、自动化排程等多种运维场景</p>
  21. </view>
  22. <view class="item">
  23. <image src="../../static/imgs/fmcs_fatz4.png"></image>
  24. <p>业务赋能</p>
  25. <p>将物联网设备的动态数据及业务相融合,重塑业务流建立更高效的场景运维体系</p>
  26. </view>
  27. <view class="item">
  28. <image src="../../static/imgs/fmcs_fatz2.png"></image>
  29. <p>更低的人力投入</p>
  30. <p>通过物联网的设备管理代替传统人力维护,提升管理精度的同时大幅降低人力成本</p>
  31. </view>
  32. </view>
  33. </view>
  34. <view class="box">
  35. <view class="title">产品功能</view>
  36. <block v-if="functionList.length">
  37. <uFunction :showTitle="false" :title="item.title" :list="item.list" v-for="(item,index) in functionList" :key="index">
  38. </uFunction>
  39. </block>
  40. </view>
  41. </view>
  42. <!-- 合作与咨询 -->
  43. <uForm></uForm>
  44. </view>
  45. </template>
  46. <script>
  47. export default {
  48. data() {
  49. return {
  50. dTitle: '智慧运维',
  51. bannerBg: '../../static/imgs/fmcs_xtbg3.png',
  52. dMemo: '通过物联网技术实现对社区、商业、园区、场馆等空间和设备的智能化运维及管理。为项目工程管理人员提供涵盖基础设备信息维护、任务计划管控、数据报表分析的运维管控平台,管理者可通过平台完成各类设备运维的业务管控。',
  53. functionList: [
  54. // 设备运维
  55. {
  56. title: '设备运维',
  57. list: [{
  58. title: '智控中心',
  59. desc: '为监控值班人员提供集监控、控制、报警中心一体化的综合运营管理平台,通过一个操作界面快速对各终端设备异常、控制进行处理,高效响应运营要求'
  60. },
  61. {
  62. title: '运行管理',
  63. desc: '可对任意空间下终端设备进行实时设备数据监控,并通过列表、动态图示等拟态化展示真实的设备运行状态'
  64. },
  65. {
  66. title: '策略管理',
  67. desc: '可根据运营时间要求批量对照明暖通的运行模式进行参数设定,高效排程设备运行计划'
  68. },
  69. {
  70. title: '集成控制',
  71. desc: '满足人工对各系统设备运行模式进行调控,并支持通过时间表、人工手动操作实现一键批量设备控制'
  72. },
  73. {
  74. title: '报警中心',
  75. desc: '自动汇集各类设备故障、运行报警、能耗异常、AI事件等报警消息,值班员根据不同报警等级进行响应处理'
  76. },
  77. {
  78. title: '设备模型',
  79. desc: '提供涵盖实时物联数据、历史数据及业务事件的智能化设备档案,汇集设备从全生命周期的运行数据,构建全新的数字管理模型'
  80. },
  81. {
  82. title: '异常管理',
  83. desc: '支持对任意设备进行状态监测,达到阈值可自动触发报单等企业内部系统实现跨场景的业务联动'
  84. },
  85. {
  86. title: '场景联动',
  87. desc: '可根据设备状态、自然天气、智能化事件、作业时间等构建跨系统、跨协议的设备联动策略,实现设备智能化自主运行'
  88. },
  89. {
  90. title: '智能巡检',
  91. desc: '可自由组合各类空间设备的机器巡检,通过loT设备对监控点进行数据采集,自动完成数据的抓取、异常主动触发、输出巡检报告'
  92. },
  93. {
  94. title: '运行报告',
  95. desc: '提供设备故障分析、报警响应效率、设备风险报告、厂商健康度评价等多维度分析报告,辅助管理决策'
  96. },
  97. ],
  98. }
  99. ]
  100. }
  101. },
  102. created() {
  103. uni.setNavigationBarTitle({
  104. title: '智慧运维'
  105. })
  106. },
  107. methods: {
  108. //方案架构点击展示大图并且可下载到手机
  109. showBigImg(e) {
  110. let current = e.target.dataset.src;
  111. let that = this;
  112. uni.previewImage({
  113. current,
  114. urls: ['../../static/imgs/jjfa.png'],
  115. longPressActions: {
  116. itemList: ['保存图片'],
  117. success(data) {
  118. let imgUrl = '../../static/imgs/fmcs_fajg.png';
  119. that.saveImage(imgUrl);
  120. },
  121. fail(err) {
  122. that.$showToast(err.errMsg);
  123. }
  124. }
  125. })
  126. },
  127. saveImage(url) {
  128. let that = this;
  129. uni.downloadFile({
  130. url,
  131. success(res) {
  132. let filePath = res.tempFilePath;
  133. uni.saveImageToPhotosAlbum({
  134. filePath,
  135. success() {
  136. that.$showToast('保存成功');
  137. },
  138. fail(err) {
  139. that.$showToast('保存失败');
  140. }
  141. })
  142. }
  143. })
  144. }
  145. }
  146. }
  147. </script>
  148. <style scoped lang="less">
  149. .content {
  150. padding-bottom: 68rpx;
  151. .boxs {
  152. width: 100%;
  153. padding: 0 30rpx;
  154. box-sizing: border-box;
  155. background: #FFFFFF;
  156. .box {
  157. width: 100%;
  158. margin-top: 48rpx;
  159. .title {
  160. font-family: PingFang-SC, PingFang-SC;
  161. font-weight: bold;
  162. font-size: 36rpx;
  163. color: #111111;
  164. line-height: 50rpx;
  165. text-align: center;
  166. }
  167. &.fatz {
  168. margin: 48rpx 0;
  169. .items {
  170. margin-top: 48rpx;
  171. display: flex;
  172. justify-content: space-between;
  173. flex-wrap: wrap;
  174. gap: 30rpx 0;
  175. .item {
  176. width: calc(50% - 15rpx);
  177. height:360rpx;
  178. display: flex;
  179. flex-direction: column;
  180. align-items: center;
  181. background-color: #FAFCFF;
  182. border-radius: 2rpx;
  183. image {
  184. width: 118rpx;
  185. height: 118rpx;
  186. margin-top: 16rpx;
  187. }
  188. p{
  189. &:nth-of-type(1){
  190. font-size: 30rpx;
  191. color: #111111;
  192. line-height: 42rpx;
  193. margin-bottom: 16rpx;
  194. font-weight: bold;
  195. }
  196. &:nth-of-type(2) {
  197. font-family: PingFangSC, PingFang SC;
  198. font-weight: 400;
  199. font-size: 24rpx;
  200. color: #777777;
  201. line-height: 33rpx;
  202. margin-top: 10rpx;
  203. padding: 0 20rpx;
  204. }
  205. }
  206. }
  207. }
  208. }
  209. }
  210. }
  211. }
  212. </style>