smartFactory/pages/solution/smartOpration.vue

<template>
	<view class="content">
		<!-- 顶部logo和菜单 -->
		<uTop></uTop>
		<!-- 标题和介绍 -->
		<uDesc :title="dTitle" :description="dMemo" :bg="bannerBg"></uDesc>
		<view class="boxs">
			
			<!-- 产品功能 -->
			<view class="fatz box">
				<view class="title">方案特征</view>
				<view class="items">
					<view class="item">
						<image src="../../static/imgs/fmcs_fatz1.png"></image>
						<p>设备覆盖广</p>
						<p>支持跨设备类型、协议、厂商、地域的统一连接，实现设备在线化、数据化</p>
					</view>
					
					<view class="item">
						<image src="../../static/imgs/fmcs_fatz3.png"></image>
						<p>智慧化运维</p>
						<p>可解决实时监测、无人值守、联动策略、设备群控、智能报警、自动化排程等多种运维场景</p>
					</view>
					<view class="item">
						<image src="../../static/imgs/fmcs_fatz4.png"></image>
						<p>业务赋能</p>
						<p>将物联网设备的动态数据及业务相融合，重塑业务流建立更高效的场景运维体系</p>
					</view>
					<view class="item">
						<image src="../../static/imgs/fmcs_fatz2.png"></image>
						<p>更低的人力投入</p>
						<p>通过物联网的设备管理代替传统人力维护，提升管理精度的同时大幅降低人力成本</p>
					</view>
				</view>
			</view>
			<view class="box">
				<view class="title">产品功能</view>
				<block v-if="functionList.length">
					<uFunction :showTitle="false" :title="item.title" :list="item.list" v-for="(item,index) in functionList" :key="index">
					</uFunction>
				</block>
			</view>
			<!-- 合作与咨询 -->
			<uForm></uForm>
		</view>
	</view>
</template>

<script>
	export default {
		data() {
			return {
				dTitle: '智慧运维',
				bannerBg: '../../static/imgs/fmcs_xtbg3.png',
				dMemo: '通过物联网技术实现对社区、商业、园区、场馆等空间和设备的智能化运维及管理。为项目工程管理人员提供涵盖基础设备信息维护、任务计划管控、数据报表分析的运维管控平台，管理者可通过平台完成各类设备运维的业务管控。',
				functionList: [
					// 设备运维
					{
						title: '设备运维',
						list: [{
								title: '智控中心',
								desc: '为监控值班人员提供集监控、控制、报警中心一体化的综合运营管理平台，通过一个操作界面快速对各终端设备异常、控制进行处理，高效响应运营要求'
							},
							{
								title: '运行管理',
								desc: '可对任意空间下终端设备进行实时设备数据监控，并通过列表、动态图示等拟态化展示真实的设备运行状态'
							},
							{
								title: '策略管理',
								desc: '可根据运营时间要求批量对照明暖通的运行模式进行参数设定，高效排程设备运行计划'
							},
							{
								title: '集成控制',
								desc: '满足人工对各系统设备运行模式进行调控，并支持通过时间表、人工手动操作实现一键批量设备控制'
							},
							{
								title: '报警中心',
								desc: '自动汇集各类设备故障、运行报警、能耗异常、AI事件等报警消息，值班员根据不同报警等级进行响应处理'
							},
							{
								title: '设备模型',
								desc: '提供涵盖实时物联数据、历史数据及业务事件的智能化设备档案，汇集设备从全生命周期的运行数据，构建全新的数字管理模型'
							},
							{
								title: '异常管理',
								desc: '支持对任意设备进行状态监测，达到阈值可自动触发报单等企业内部系统实现跨场景的业务联动'
							},
							{
								title: '场景联动',
								desc: '可根据设备状态、自然天气、智能化事件、作业时间等构建跨系统、跨协议的设备联动策略，实现设备智能化自主运行'
							},
							{
								title: '智能巡检',
								desc: '可自由组合各类空间设备的机器巡检，通过loT设备对监控点进行数据采集，自动完成数据的抓取、异常主动触发、输出巡检报告'
							},
							{
								title: '运行报告',
								desc: '提供设备故障分析、报警响应效率、设备风险报告、厂商健康度评价等多维度分析报告，辅助管理决策'
							},
						],
					}
				]
			}
		},
		created() {
			uni.setNavigationBarTitle({
				title: '智慧运维'
			})
		},
		methods: {
			//方案架构点击展示大图并且可下载到手机
			showBigImg(e) {
				let current = e.target.dataset.src;
				let that = this;
				uni.previewImage({
					current,
					urls: ['../../static/imgs/jjfa.png'],
					longPressActions: {
						itemList: ['保存图片'],
						success(data) {
							let imgUrl = '../../static/imgs/fmcs_fajg.png';
							that.saveImage(imgUrl);
						},
						fail(err) {
							that.$showToast(err.errMsg);
						}
					}
				})
			},
			saveImage(url) {
				let that = this;
				uni.downloadFile({
					url,
					success(res) {
						let filePath = res.tempFilePath;
						uni.saveImageToPhotosAlbum({
							filePath,
							success() {
								that.$showToast('保存成功');
							},
							fail(err) {
								that.$showToast('保存失败');
							}
						})
					}
				})
			}
		}
	}
</script>

<style scoped lang="less">
	.content {
		.boxs {
			width: 100%;
			padding: 0 30rpx 148rpx;
			box-sizing: border-box;
			background: #FFFFFF;

			.box {
				width: 100%;
				margin-top: 48rpx;

				.title {
					font-family: PingFang-SC, PingFang-SC;
					font-weight: bold;
					font-size: 36rpx;
					color: #111111;
					line-height: 50rpx;
					text-align: center;
				}

				&.fatz {
					margin: 48rpx 0;

					.items {
						margin-top: 48rpx;
						display: flex;
						justify-content: space-between;
						flex-wrap: wrap;
						gap: 30rpx 0;

						.item {
							width: calc(50% - 15rpx);
							height:360rpx;
							display: flex;
							flex-direction: column;
							align-items: center;
							background-color: #FAFCFF;
							border-radius: 2rpx;

							image {
								width: 118rpx;
								height: 118rpx;
								margin-top: 16rpx;
							}
							p{
								&:nth-of-type(1){
									font-size: 30rpx;
									color: #111111;
									line-height: 42rpx;
									margin-bottom: 16rpx;
									font-weight: bold;
								}
								&:nth-of-type(2) {
									font-family: PingFangSC, PingFang SC;
									font-weight: 400;
									font-size: 24rpx;
									color: #777777;
									line-height: 33rpx;
									margin-top: 10rpx;
									padding: 0 20rpx;
								}
							}
							
						}
					}
				}

				
			}
		}
	}
</style>