smartFactory/pages/solution/lampSms.vue

<template>
	<view class="content">
		<!-- 顶部logo和菜单 -->
		<uTop data-aos="fade-down"></uTop>
		<!-- 标题和介绍 -->
		<uDesc :title="dTitle" :description="dMemo" :bg="bannerBg" data-aos="slide-right" data-aos-delay="300"></uDesc>
		<view class="quesTitle" data-aos="zoom-in" data-aos-delay="600">工厂设备的维修管理，您是否有以下烦恼？</view>
		<view class="boxs">
			<block v-if="functionList.length">
				<uFunction :showTitle="false" :list="functionList[0]" data-aos="zoom-in" data-aos-delay="600">
				</uFunction>
			</block>
			<view class="fajg box">
				<view class="fajg2" data-aos="slide-left" data-aos-delay="900">
					<view class="title">解决方案</view>
					<view class="subtit">帮助<span>工厂</span>快速识别堵点，并<span>大幅消除生产异常浪费</span></view>
					<image src="../../static/imgs/jjfa.png" mode="widthFix" @click="showBigImg"></image>
				</view>
			</view>
			<block v-if="functionList.length">
				<uFunction :showTitle="false" :list="functionList[1]" data-aos="slide-right">
				</uFunction>
			</block>
			<!-- 产品优势 -->
			<view class="fatz box">
				<view class="title" data-aos="slide-left">产品优势</view>
				<view class="items">
					<view class="item" data-aos="slide-right">
						<image src="../../static/imgs/fmcs_fatz1.png"></image>
						<p>精益理念+数字化系统 - 推动精益化生产，提升现场管理水平</p>
					</view>
					<view class="item" data-aos="slide-right">
						<image src="../../static/imgs/fmcs_fatz2.png"></image>
						<p>优化生产现场异常信息的反馈流程，有效考核支援人员解决问题的能力及工作态度</p>
					</view>
					<view class="item" data-aos="slide-right">
						<image src="../../static/imgs/fmcs_fatz3.png"></image>
						<p>建立生产现场异常状况的处理机制，引入异常逐层上报机制</p>
					</view>
					<view class="item" data-aos="slide-right">
						<image src="../../static/imgs/fmcs_fatz4.png"></image>
						<p>存储异常处理过程的完整信息</p>
					</view>
				</view>
			</view>
		</view>
		<!-- 合作与咨询 -->
		<uForm data-aos="zoom-in"></uForm>
	</view>
</template>

<script>
	export default {
		data() {
			return {
				dTitle: '安灯系统',
				bannerBg: '../../static/imgs/fmcs_xtbg2.png',
				dMemo: '可快速实现设备异常自动呼叫，工位异常人工呼叫、及时通知相关责任人，保证生产异常处理的闭环。提供了丰富的异常探知硬件终端、推送呼叫工具，全流程性处理模式，精益化分析、持续积累形成生产企业问题处理知识库的能力。',
				functionList: [
					// 设备运维

					[{
							title: '异常发现靠人工',
							desc: '1人长时间看管多台设备，人员懈怠异常容易被忽略'
						},
						{
							title: '生产异常无记录',
							desc: '异常数据无记录，想改善没有数据支撑'
						},
						{
							title: '生产计划调整慢',
							desc: '设备状态无实时监控，生产计划不能迅速调整'
						},
						{
							title: '设备异常传达慢',
							desc: '车间现场嘈杂，范围大，发生异常不能及时找到相关负责人'
						}
					],
					[{
							title: '自动安灯',
							desc: '可通过TS系列设备状态数据果集器，实现设备异常自动触发安灯;品质异常，物料异常，人员异常等通过SS-10系列实现人工手动一键触发安灯。'
						},
						{
							title: '即时通知',
							desc: '支持生产异常信息自定义及分组;支持穿戴设备、移动设备等多种信息通知方式;针对长时间未响应异常，进行安灯级别即时通知'
						},
						{
							title: '数据可视化',
							desc: '安灯信息、安灯位置、安灯级烈等需要立即处理的异常通过看板实时展示，让生产现场一目了然;支持安灯信息追溯及安灯数据统计分析'
						},
						{
							title: '状态采集',
							desc: '系统自动记录安灯触发位置、安灯类型、呼叫人员、触发时间、级别等信息，避免人工记录易遗漏、不准确的问题，为绩效评估提供数据支撑。可通过PC、手机等多终端随时设备安灯信息、运行状态，轻松实现“人在办公室，眼在生产现场”'
						}
					]

				]
			}
		},
		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/jjfa.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">
	.quesTitle {
		margin: 54rpx 80rpx 58rpx;
		font-size: 42rpx;
		color: #333;
		line-height: 60rpx;
		text-align: center;
		font-weight: bold;
	}

	.content {
		padding-bottom: 80rpx;
		overflow: hidden;
		.boxs {
			width: 100%;
			padding: 0 30rpx;
			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: 54rpx 0 64rpx;
					
					.items {
						margin-top: 48rpx;
						display: flex;
						justify-content: space-between;
						flex-wrap: wrap;
						gap: 30rpx 0;
						.item {
							width: calc(50% - 15rpx);
							height: 280rpx;
							border-radius: 2rpx;
							display: flex;
							flex-direction: column;
							align-items: center;
							background-color: #F3F8FF;
							image {
								width: 118rpx;
								height: 118rpx;
								margin-top: 16rpx;
							}

							p {
								font-family: PingFangSC, PingFang SC;
								font-weight: 400;
								font-size: 24rpx;
								color: #111111;
								line-height: 33rpx;
								margin-top: 10rpx;
								padding: 0 20rpx;
							}
						}
					}
				}

				&.fajg {
					margin: 48rpx 0;
					overflow: hidden;
					.fajg2{
						width: 100%;
					}

					.subtit {
						font-size: 24rpx;
						color: #666;
						margin: 16rpx 0 48rpx;
						text-align: center;

						span {
							color: #134F99;
							font-weight: bold;
						}
					}

					image {
						width: 100%;
					}
				}
			}
		}
	}
</style>