smartFactory/pages/solution/znpc.vue

<template>
	<view class="content">
		<!-- 顶部logo和菜单 -->
		<uTop></uTop>
		<!-- 标题和介绍 -->
		<uDesc :title="dTitle" :description="dMemo" :bg="descBg"></uDesc>
		
		<view class="box1">
			<view class="title">您的企业是否正面临以下烦恼？</view>
		</view>
		<view class="box2">
			<div class="title">智能排产方案</div>
			<image src="../../static/imgs/znpc_img2.png" mode="widthFix" @click="e=>showBigImg(e,'../../static/imgs/znpc_img2.png')"></image>
		</view>
		<view class="box3">
			<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>
		<view class="box4">
			<image src="../../static/imgs/line.png" mode=""></image>
		</view>
		<view class="box5">
			<view class="title">应用场景</view>
			<view class="items">
				<view class="item" v-for="(item,index) in yycjList" :key="index">
					<view class="img">
						<image :src="item.img" mode=""></image>
					</view>
					<view class="title">{{item.title}}</view>
					<view class="desc">{{item.desc}}</view>
				</view>
			</view>
		</view>
		<!-- 合作与咨询 -->
		<uForm></uForm>
	</view>
</template>

<script>
	export default {
		data(){
			return {
				dTitle:'智能排产系统',
				dMemo:'科学合理的智能排产，能帮助企业实现按需生产，精益制透，柔性运作，助力生产制造型企业数智化转型。',
				descBg:'../../static/imgs/znpc_msbg.png',
				functionList:[
					{
						list:[
							{
								title:'可视化计划与排程闭环体系',
								desc:'通过人机料等多维度的约束与订单排序和资源选定的排程自动生成精确到时分秒的工序/机台/产线计划，后与生产实绩结合滚动排程,做到计划指导生产,可通过可视化甘特图/图表进行监控和预警。'
							},
							{
								title:'计划甘特图',
								desc:'以图形化方式展示计划的生产进度，时间线上的任务一目了然，便于企业直观地了解各个任务在时间线上的分布。'
							},
							{
								title:'资源负荷图',
								desc:'以图形方式展示资源的利用情况，清晰呈现资源的忙闲时段，帮助企业合理安排资源，避免资源闲置和浪费，确保生产计划的高效执行。'
							},
							{
								title:'生产报工',
								desc:'按资源管理工单计划、记录、统计和分析员工的各项工作内容和所花费的时间、可以采集各工序标准工时、考核员工绩效、核算人工成本，并通过系统实时的报表统计，提高工作效率。'
							},
							{
								title:'工作计划进度',
								desc:'以表格形式详细列出排产结果，提供详细的数据支持，便于企业进行数据分析和挖掘，为决策提供更为精准的数据依据。'
							}
						]
					}
				],
				yycjList:[
					{
						img:'../../static/imgs/znpc_yycj1.png',
						title:'生产准备',
						desc:'通过生产排班，开班检查、开线点检等生产作业前检查功能，确保生产准备就绪'
					},
					{
						img:'../../static/imgs/znpc_yycj2.png',
						title:'工艺管理',
						desc:'图形化工艺路线，支持依据工站自定义维护工序和集成审批流，确保工艺可控'
					},
					{
						img:'../../static/imgs/znpc_yycj3.png',
						title:'生产执行',
						desc:'透明化、严控化生产执行，实现生产过程合规操作，防止跳序、乱序等异常发生'
					},
					{
						img:'../../static/imgs/znpc_yycj4.png',
						title:'条码管理',
						desc:'支持条码规则维护、条码生成、标签打印功能(支持工单、在线、零散、模板等)'
					},
					{
						img:'../../static/imgs/znpc_yycj5.png',
						title:'质量管理',
						desc:'多维度生成来料、入库、首、巡、出厂检规则，配合返修、维修、返工管理等'
					},
					{
						img:'../../static/imgs/znpc_yycj6.png',
						title:'人力资源管理',
						desc:'可导入或对接HR系统获取人员基础信息，实现人员技能培训、工时申报等业务'
					},
					{
						img:'../../static/imgs/znpc_yycj7.png',
						title:'异常管理',
						desc:'实现生产异常快速响应，建立异常产品快速锁定，解锁，及rework管理等'
					},
					{
						img:'../../static/imgs/znpc_yycj8.png',
						title:'计划管理',
						desc:'满足人工对各系统设备运行模式进行调控，并支持通过时间表、人工手动操作实现一键批量设备控制'
					}
				],
			}
		},
		created() {
			uni.setNavigationBarTitle({
				title: '智能排产系统'
			})
		},
		methods:{
			showBigImg(e,imgUrl) {
				let current = e.target.dataset.src;
				let that = this;
				uni.previewImage({
					current,
					urls: [imgUrl],
					longPressActions: {
						itemList: ['保存图片'],
						success(data) {
							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">
	::v-deep .desc .memo{
		padding-right: 253rpx;
	}
	
	.content{
		padding-bottom: 44rpx;
		.box1{
			width: 100%;
			height: 940rpx;
			background: url(../../static/imgs/znpc_img1.png) no-repeat;
			background-size: 100% 100%;
			.title{
				font-family: PingFang-SC, PingFang-SC;
				font-weight: bold;
				font-size: 42rpx;
				color: #333333;
				line-height: 60rpx;
				text-align: center;
				margin: 48rpx 138rpx 0;
			}
		}
	
		.box2{
			margin-top: 48rpx;
			.title{
				font-family: PingFang-SC, PingFang-SC;
				font-weight: bold;
				font-size: 36rpx;
				color: #111111;
				line-height: 50rpx;
				text-align: center;
			}
			image{
				width: 100%;
				margin-top: 40rpx;
			}
		}
		
		.box3{
			width: 100%;
			padding: 0 30rpx;
			box-sizing: border-box;
			margin-top: -16rpx;
		}
		
		.box4{
			margin-top: 64rpx;
			width: 100%;
			height: 10rpx;
			image{
				width: 100%;
				height: 100%;
			}
		}
	
		.box5{
			width: 100%;
			padding: 0 30rpx;
			box-sizing: border-box;
			margin-top: 64rpx;
			.title{
				font-family: PingFang-SC, PingFang-SC;
				font-weight: bold;
				font-size: 36rpx;
				color: #111111;
				line-height: 50rpx;
				text-align: center;
			}
			.items{
				display: flex;
				justify-content: space-between;
				flex-wrap: wrap;
				.item{
					width: calc(50% - 25rpx);
					margin-top: 48rpx;
					.img{
						width: 320rpx;
						height: 200rpx;
						image{
							width: 100%;
							height: 100%;
						}
					}
					.title{
						font-family: PingFang-SC, PingFang-SC;
						font-weight: bold;
						font-size: 32rpx;
						color: #111111;
						line-height: 45rpx;
						text-align: left;
						margin-top: 20rpx;
					}
					.desc{
						font-family: PingFangSC, PingFang SC;
						font-weight: 400;
						font-size: 24rpx;
						color: #666666;
						line-height: 33rpx;
						margin-top: 16rpx;
					}
				}
			}
		}
	}
</style>