Skip to content

N
ngic-company
Commit 9ea567e7 authored by wuhao's avatar wuhao 🎯
Browse files
Options

asder

parent ca97005b
Show whitespace changes
Inline Side-by-side
Showing with 1008 additions and 184 deletions
.umirc.ts
View file @ 9ea567e7
......@@ -19,7 +19,14 @@ export default defineConfig({
{
path: '/',
component: '@/layouts/index',
routes,
routes: [
...routes,
{
path: '/download',
name: '下载中心',
component: '@/pages/download',
},
],
},
],
fastRefresh: {},
......
routes.ts
View file @ 9ea567e7
......@@ -94,7 +94,7 @@ export default [
{
path: '/factory/typea/pdm',
name: 'PDM产品数据管理系统',
component: '@/pages/index',
component: '@/pages/factory/pdm',
},
],
},
......@@ -106,7 +106,7 @@ export default [
{
path: '/factory/typeb/datagate',
name: '智能网关',
component: '@/pages/index',
component: '@/pages/factory/datagate',
},
],
},
......@@ -115,7 +115,7 @@ export default [
{
path: '/internet',
name: '工业互联网平台',
component: '@/pages/index',
component: '@/pages/internet',
},
{
path: '/cgx',
......
src/global.less
View file @ 9ea567e7
......@@ -4,17 +4,27 @@ body,
width: 100%;
height: 100%;
}
.ant-menu-item-group-list {
.ant-menu-item {
padding: 0.4rem !important;
height: auto !important;
}
}
.ant-menu-item-group-title {
color: rgba(0, 0, 0, 1) !important;
position: relative;
font-weight: bold !important;
padding: 0.4rem !important;
font-size: 16px !important;
text-indent: 6px !important;
&::before {
content: '';
background-color: rgba(31, 108, 232, 0.8);
position: absolute;
left: 8px;
top: 12px;
top: 16px;
width: 2px;
height: 14px;
border-radius: 4px;
......@@ -30,6 +40,12 @@ body,
display: flex;
align-items: center;
}
.centerv {
display: flex;
justify-content: center;
align-items: flex-start;
flex-direction: column;
}
.center {
display: flex;
justify-content: center;
......@@ -283,6 +299,9 @@ body,
.section {
padding: 2rem;
position: relative;
.ant-tabs-tab-btn {
font-size: 0.8rem;
}
.tabs {
text-align: center;
font-size: 0.6rem;
......@@ -700,3 +719,200 @@ body,
}
}
}
.itemqs {
width: 100%;
height: 100%;
display: flex;
flex-direction: column;
justify-content: flex-start;
align-items: center;
overflow: hidden;
img {
display: block;
width: 75% !important;
min-width: auto !important;
margin: 1rem;
}
h2 {
font-size: 0.8rem !important;
margin: 0.2rem 0 0.8rem 0 !important;
padding: 0 !important;
}
p {
font-size: 0.6rem;
}
}
.newspaper {
overflow: hidden;
}
@media (min-width: 400px) {
.newspaper {
column-count: 1; // two columns on larger phones
column-gap: 32px;
}
}
@media (min-width: 768px) {
.newspaper {
column-count: 2; // two columns on larger phones
column-gap: 32px;
}
}
@media (min-width: 992px) {
.newspaper {
column-count: 3; // three columns on...you get it
column-gap: 32px;
}
}
@media (min-width: 1200px) {
.newspaper {
column-count: 3; // three columns on...you get it
column-gap: 32px;
}
}
@media (min-width: 1660px) {
.newspaper {
column-count: 3; // three columns on...you get it
column-gap: 32px;
}
}
.newspaper {
padding: 2rem;
> div {
break-inside: avoid !important;
margin-bottom: 2rem;
h2 {
color: #333333 !important;
text-align: left !important;
padding: 0 0 1rem 0 !important;
margin: 0 !important;
font-size: 0.8rem !important;
}
p {
font-size: 0.6rem !important;
}
}
}
.newspapers {
padding: 2rem;
display: flex;
flex-direction: column;
justify-content: center;
align-items: flex-start;
> div {
break-inside: avoid !important;
margin-bottom: 1rem;
h2 {
color: #333333 !important;
text-align: left !important;
padding: 0 0 0.4rem 0 !important;
margin: 0 !important;
font-size: 0.8rem !important;
}
p {
font-size: 0.6rem !important;
}
}
}
.animate {
display: block;
width: 1rem;
height: 1rem;
position: relative;
overflow: visible;
margin-right: 0.6rem;
&::before {
content: '';
position: absolute;
width: 0.6rem;
height: 0.6rem;
border-radius: 50%;
z-index: 999;
left: 0;
right: 0;
top: 0;
bottom: 0;
margin: auto;
background-color: rgba(255, 255, 255, 1);
box-shadow: 0 0 4px rgba(20, 119, 246, 0.8);
}
&::after {
content: '';
position: absolute;
width: 1rem;
height: 1rem;
background-color: rgba(20, 119, 246, 0.4);
border-radius: 50%;
left: 0;
right: 0;
top: 0;
bottom: 0;
margin: auto;
transform-origin: center center;
animation: lager 1s ease-in-out 0s infinite forwards;
}
}
@keyframes lager {
from {
transform: scale(1);
background-color: rgba(20, 119, 246, 0.4);
}
to {
transform: scale(1.4);
background-color: rgba(20, 119, 246, 0);
}
}
.fot {
h4 {
font-size: 0.8rem;
text-align: center;
width: 100%;
padding: 0.2rem;
}
p {
font-size: 0.6rem;
width: 100%;
padding: 0 0.8rem;
}
span {
display: block;
margin-bottom: 0.4rem;
position: relative;
color: #000000;
padding-bottom: 0.4rem;
&::after {
content: '';
width: 100%;
height: 100%;
position: absolute;
bottom: 0px;
left: 0px;
height: 2px;
background-image: linear-gradient(
145deg,
#ffffff 0%,
#edf5ff 25%,
#edf5ff 50%,
#edf5ff 75%,
#ffffff 100%
);
background-size: 400% 400%;
animation: bgmove 4s linear 0s infinite alternate forwards;
}
}
}
.diyinput {
input {
background-color: rgba(255, 255, 255, 0.5) !important;
}
}
src/pages/download/index.jsx 0 → 100644
View file @ 9ea567e7
import React, { useState, useEffect } from 'react';
import { Input, Space, Tabs } from 'antd';
const { Search } = Input;
function Download() {
const onSearch = (value) => {
console.log(value);
};
const items = [
{ label: '宣传画册及其他', key: '1', children: 'Content 1' }, // remember to pass the key prop
{ label: '硬件产品资料', key: '2', children: 'Content 2' },
{ label: '软件产品资料', key: '3', children: 'Content 2' },
];
return (
<div id="mesContainer">
<div style={{ position: 'relative' }}>
<img
src={require('@/assets/fac9.jpg')}
alt=""
style={{ width: '100%' }}
/>
<div
className="diyinput"
style={{
position: 'absolute',
left: 0,
right: 0,
top: 0,
bottom: 0,
margin: 'auto',
width: '20vw',
height: 42,
minWidth: 320,
}}
>
<Search
placeholder="输入关键词搜索"
onSearch={onSearch}
enterButton
size="large"
style={{ borderRadius: 6, overflow: 'hidden' }}
/>
</div>
</div>
<div className="section">
<Tabs items={items} />
</div>
</div>
);
}
export default Download;
src/pages/factory/datagate/index.jsx 0 → 100644
View file @ 9ea567e7
/* eslint-disable import/no-anonymous-default-export */
import React from 'react';
import { Row, Col, Carousel, Grid, Card } from 'antd';
const colc = { xs: 24, sm: 24, md: 12, lg: 12, xl: 12, xxl: 12 },
col = { xs: 24, sm: 24, md: 10, lg: 10, xl: 10, xxl: 10 },
cold = { xs: 24, sm: 24, md: 12, lg: 8, xl: 8, xxl: 8 },
colds = { xs: 24, sm: 24, md: 12, lg: 8, xl: 8, xxl: 8 },
cols = { xs: 24, sm: 24, md: 14, lg: 14, xl: 14, xxl: 14 };
export default () => {
return (
<div id="mesContainer">
<img
src={require('@/assets/fac7.jpg')}
alt=""
style={{ width: '100%' }}
/>
<div>
<h2 className="title">智能网关</h2>
</div>
<div className="cpjs bgjs">
<h3>产品介绍</h3>
<p>
南高智能系列网关产品可应用于成型、金切、特种数控机床和自动化设备，支持多传感器接入，安全、稳定，助力企业工业互联网升级。南高智能网关是一款具备挖掘工业设备数据并接入到自主开发的云平台的智能嵌入式网络设备。它具备数据采集、协议解析、边缘计算，支持以太网，移动2G/3G/4G/5G数据传输，可满足绝大部分工业应用场景及工业设备接入。
</p>
</div>
<div
className="cpjs"
style={{ backgroundColor: 'rgba(250, 249, 250, 1)' }}
>
<h3 className="center">
<i className="animate" /> Z系列
</h3>
<Row gutter={66} style={{ marginTop: '2rem' }}>
<Col {...cols}>
<Row
style={{
width: '100%',
borderRadius: '1rem',
backgroundColor: '#FFFFFF',
}}
>
<Col {...col} className="centerv">
<img
style={{ width: '100%', margin: 0 }}
src={require('@/assets/Z.png')}
alt=""
/>
</Col>
<Col {...cols} className="cpjs centerv">
<h3
style={{
fontSize: '0.8rem',
textAlign: 'left',
marginLeft: 0,
}}
>
对接能力
</h3>
<p style={{ fontSize: '0.6rem' }}>
支持西门子(含有OPCUA配件)/FANUC
全系列/DELEM65等系列(含有OPCUA配件)等CNC的采集。
<br />
支持三菱、西门子、施耐德、汇川、欧姆龙、产电、基恩士、松下、罗克韦尔、倍福、通用电气、安川、富士、信捷、横河、台达等网口PLC的采集。
<br />
支持定制开发TCP相关协议、支持4G传输,WIFI传输，以太传输、持内置OPCUA服务器功能、支持接入第三方IOT平台(限MQTT通道、TCP通道)、支持python脚本的边缘计算、支持看门狗程序、支持重连机制、支持断点续传功能。
</p>
</Col>
</Row>
</Col>
<Col {...col}>
<div
className="centerv"
style={{
borderRadius: '1rem',
backgroundColor: '#FFFFFF',
width: '100%',
height: '100%',
}}
>
<p style={{ fontSize: '0.6rem', padding: '0 2rem' }}>
<b
style={{
fontSize: '0.8rem',
display: 'block',
marginBottom: '1rem',
}}
>
硬件参数
</b>
<b>接入方式 ：</b>以太网，移动2G/3G/4G/5G <br />
<b>CPU ：</b>1GHz,ARM Cortex-A7 <br />
<b>存储器 ：</b>8GB eMMC，512MB DDR3
<br />
<b>USB端口 ：</b>1个USB host2.0接口
<br />
<b>传感器接口 ：</b>1个DB15接口，可接南高传感器配件
<br />
<b>以太网：</b> 2路10M/100M自适应端口
<br />
<b>适用范围 ：</b>满足数控机床和自动化设备的互联互通需求
<br />
</p>
</div>
</Col>
</Row>
</div>
<div
className="cpjs"
style={{ backgroundColor: 'rgba(250, 249, 250, 1)' }}
>
<h3 className="center">
<i className="animate" /> S系列
</h3>
<Row gutter={66} style={{ marginTop: '2rem' }}>
<Col {...colc}>
<Row
style={{
width: '100%',
borderRadius: '1rem',
backgroundColor: '#FFFFFF',
}}
>
<Col {...col} className="centerv">
<img
style={{ width: '100%', margin: 0 }}
src={require('@/assets/S.png')}
alt=""
/>
</Col>
<Col {...cols} className="cpjs centerv">
<h3
style={{
fontSize: '0.8rem',
textAlign: 'left',
marginLeft: 0,
}}
>
对接能力
</h3>
<p style={{ fontSize: '0.6rem' }}>
包含Z系列基础版本的所有功能，还支持6组0-10V电压型输入传感器的采集。
</p>
</Col>
</Row>
</Col>
<Col {...colc}>
<div
className="centerv"
style={{
borderRadius: '1rem',
backgroundColor: '#FFFFFF',
width: '100%',
height: '100%',
}}
>
<p style={{ fontSize: '0.6rem', padding: '0 2rem' }}>
<b
style={{
fontSize: '0.8rem',
display: 'block',
marginBottom: '1rem',
}}
>
硬件参数
</b>
<b>接入方式 ：</b>以太网，移动2G/3G/4G/5G <br />
<b>CPU ：</b>1GHz,ARM Cortex-A7 <br />
<b>存储器 ：</b>8GB eMMC，512MB DDR3
<br />
<b>USB端口 ：</b>1个USB host2.0接口
<br />
<b>传感器接口 ：</b>6组端子、电压型(0-10V)
<br />
<b>以太网：</b> 2路10M/100M自适应端口
<br />
<b>适用范围 ：</b>
满足连接数控机床、自动化设备，和外接传感器的需求
<br />
</p>
</div>
</Col>
</Row>
</div>
<div
className="cpjs"
style={{ backgroundColor: 'rgba(250, 249, 250, 1)' }}
>
<h3 className="center">
<i className="animate" /> C系列
</h3>
<Row gutter={66} style={{ marginTop: '2rem' }}>
<Col {...colc}>
<Row
style={{
width: '100%',
borderRadius: '1rem',
backgroundColor: '#FFFFFF',
}}
>
<Col {...col} className="centerv">
<img
style={{ width: '100%', margin: 0 }}
src={require('@/assets/C.png')}
alt=""
/>
</Col>
<Col {...cols} className="cpjs centerv">
<h3
style={{
fontSize: '0.8rem',
textAlign: 'left',
marginLeft: 0,
}}
>
对接能力
</h3>
<p style={{ fontSize: '0.6rem' }}>
包含Z系列基础版本的所有功能，以外还支持施耐德、汇川、产电、
松下、安川、山武、富士、信捷、台达等串口PLC的采集。
</p>
</Col>
</Row>
</Col>
<Col {...colc}>
<div
className="centerv"
style={{
borderRadius: '1rem',
backgroundColor: '#FFFFFF',
width: '100%',
height: '100%',
}}
>
<p style={{ fontSize: '0.6rem', padding: '0 2rem' }}>
<b
style={{
fontSize: '0.8rem',
display: 'block',
marginBottom: '1rem',
}}
>
硬件参数
</b>
<b>接入方式 ：</b>以太网，移动2G/3G/4G/5G <br />
<b>CPU ：</b>1GHz,ARM Cortex-A7 <br />
<b>存储器 ：</b>8GB eMMC，512MB DDR3
<br />
<b>USB端口 ：</b>1个USB host2.0接口
<br />
<b>串口接口 ：</b> 1路 RS485 1路RS232
<br />
<b>以太网：</b> 2路10M/100M自适应端口
<br />
<b>适用范围 ：</b>满足连接网口以及串口数控机床、自动化设备
<br />
</p>
</div>
</Col>
</Row>
</div>
</div>
);
};
src/pages/factory/pdm/index.css deleted 100644 → 0
View file @ ca97005b
* {
margin: 0;
padding: 0;
}
#mesContainer {
padding-bottom: 24px;
}
#mesContainer h3,
h4 {
padding-bottom: 24px;
text-align: center;
}
#mesContainer h2 {
padding: 16px;
text-align: center;
color: rgba(1, 92, 172, 1)
}
#mesContainer>div:nth-child(2) {
background-color: rgba(247, 250, 252, 1);
}
.ywkj,
.khjz,
.yyal,.gnmk {
display: flex;
flex-direction: column;
align-items: center;
}
.yyal {
width: 75%;
margin: auto;
}
.yingyonganli {
display: flex;
flex-direction: row;
}
.anli-text-left {
display: flex;
flex-direction: column;
align-items: flex-end;
padding: 32px;
}
.anli-text-right {
display: flex;
flex-direction: column;
align-items: flex-start;
padding: 32px;
}
.yingyonganli>div:nth-child(1) {
display: flex;
flex-direction: column;
}
.anli-content {
display: flex;
flex-direction: row;
padding-bottom: 32px;
}
.khjz>div {
display: flex;
flex-direction: row;
justify-content: space-between;
}
.khjz img,
.khjz>div {
width:75%;
margin-right: 16px;
}
.khjz-text p:nth-child(1){
margin: 16px;
padding-left: 16px;
border-left: 4px solid rgba(51, 142, 245, 1);
}
.khjz-text p:nth-child(2){
margin: 16px;
padding-left: 16px;
border-left: 4px solid rgba(255, 195, 0, 1);
}
.khjz-text p:nth-child(3){
margin: 16px;
padding-left: 16px;
border-left: 4px solid rgba(0, 186, 173, 1);
}
.khjz-text p:nth-child(4){
margin: 16px;
padding-left: 16px;
border-left: 4px solid rgba(18, 208, 255, 1);
}
.khjz-text p:nth-child(5){
margin: 16px;
padding-left: 16px;
border-left: 4px solid rgba(7, 108, 224, 1);
}
src/pages/factory/pdm/index.jsx
View file @ 9ea567e7
/* eslint-disable import/no-anonymous-default-export */
import React from 'react';
import './index.css';
import { Row, Col, Carousel, Grid } from 'antd';
const colc = { xs: 12, sm: 12, md: 8, lg: 8, xl: 4, xxl: 4 },
col = { xs: 0, sm: 0, md: 10, lg: 10, xl: 10, xxl: 10 },
cold = { xs: 24, sm: 24, md: 12, lg: 8, xl: 8, xxl: 8 },
cols = { xs: 24, sm: 24, md: 14, lg: 14, xl: 14, xxl: 14 };
const qsarr = [
{
title: '系列产品',
desc: '技术中心设计和生产过的各系列产品缺乏平台支撑，缺乏统一规范管理产品库信息的工具。技术中心的公共零部件库管理难度大，各系列的产品零部件标准化程度低、设计重用率低。',
},
{
title: '数据关联',
desc: '产品技术资料关联性和齐套性管理越来越困难，查找零部件相关联的文件效率低，设计变更时难管控产生的影响范围，难以确保相关联的变更资料都能同步更新升级。',
},
{
title: '借用管理',
desc: '产品数据越来越多，不同产品之间的零部件相互借用频繁，管理和维护借用关系难度越来越大。',
},
{
title: '零部件认证',
desc: '产品的新零部件缺乏工具评估分析及认证，容易出现重复的零部件及图纸，容易造成一物多码及增加库存积压。',
},
{
title: '数据流转',
desc: '设计产品后需要手工编制和维护BOM表、采购报表等等，工作量大效率低且容易出错，设计人员出BOM表后需要再次在ERP手工创建BOM物料信息，重复工作。',
},
{
title: '积累沉淀',
desc: '缺乏有利于核心技术成果的收集汇总、协同分享、学习交流的大数据平台，这不仅可以提高技术团队的产品创新能力，更成为了企业生存和发展的关键要素。',
},
],
funcarr = [
{
title: '产品结构管理',
desc: '先进的产品树状结构化管理，产品、零部件结构科学清晰；二维、三维、工艺等数据信息围绕零部件结构进行组织，多视图展示产品节点信息；可以从二维、三维 CAD 图纸提取相关信息生成产品结构树，自动生成零部件明细；',
},
{
title: '模板管理',
desc: '自定义各类工作流程模板，建立企业标准的工作流程模板库； 新建数据时，直接套用模板，保障数据的时效性和规范性；创建工作流程时，可以直接引用工作流程模板，启动企业定义好的工作流程。',
},
{
title: '消息提醒',
desc: '为了更好地实现工作的协同和管理， PDM 还集成了实用的邮件系统，即时消息和个人工作计划管理的功能。邮件和消息这些实用功能让用户之间工作协同更加及时方便，首页的工作计划提醒让用户不会遗忘任何一项工作。',
},
{
title: '编码管理',
desc: '系统自定义任何规则的编码器，任何有编码的地方实现轻松编码；编码可以自动关联编码器生成或手动生成，准确唯一，编码再无烦恼； 根据编码进行各种查询：模糊查询、精确查询和导航查询。',
},
{
title: '流程管理',
desc: '强大的工作流程管理，提高工作效率；系统为用户提供方便、直观的流程定义工具，管理人员根据企业流程定义不同类型的工作流程模板，如审核、 ECR/ECN 、发布、分发等流程。',
},
{
title: '权限管理',
desc: '完善、严密的权限控制和数据维护等安全机制；维护数据的安全是 PDM 最重要的功能之一，多重安全机制确保数据的安全，也使得“正确的人做正确的操作”；系统自动对数据进行加密，脱离 PDM 系统后，用户无法打开图纸和文档，加密具有独享性。',
},
{
title: '零部件管理',
desc: '建立企业零部件库及产品资料库，实现知识积累；通过对企业零部件库及产品资料库的管理维护，倡导组件化、模块化设计，提高产品设计重用，减少零部件种类；方便的产品选配功能，快速搭建新产品。',
},
{
title: '系统集成',
desc: '与 CAD 系统、 ERP 系统、各种办公软件轻松集成；PDM 系统通过功能强大的图形浏览器，可以浏览 200 多种文件格式的文件；审批流程中，主管可以对图纸进行圈红批阅等。',
},
{
title: '工艺管理',
desc: 'PDM中的工艺设计管理实现企业全局的工艺规划，帮助开发产品零部件合理的工艺路线，安排高质量的生产工艺。为工艺设计者创造一个与产品设计数据共享一致数据源的关联设计环境，工艺设计人员可以很方便地引用和参考产品开发部门设计的BOM、图纸等。',
},
{
title: 'BOM管理',
desc: '系统自动生成产品零部件明细表、产品材料明细表；自动生成各类分类 BOM 表：标准件 / 外购 / 外协 / 自制 / 借用汇总表；用户自定义 BOM 格式和内容；通过工作协同工具，各类 BOM 表快速流转至需求部门。',
},
{
title: '数据检索',
desc: '方便的数据检索和定位功能；强大的搜索引擎功能把产品研发过程中的人和物等对象类型在任何需要的地方都能筛选出来；用户再不用“满世界”找资料了；查询条件可以保存起来，方便下次再利用；对于查询结果可以直接浏览属性、以及生命周期管理等有关操作等。',
},
],
lastarr = [
{
title: '先进的技术框架',
desc: '三层体系结构，面向对象的技术和组件化的组织形式。采用继承、封装和多态三个特性设计系统。',
},
{
title: '基于大型数据库、支持海量用户和存储',
desc: '采用SQL数据库，将所有信息数据以文件的方式存储于电子仓库中，并经过加密处理。',
},
{
title: '强大的客户化技术',
desc: '先进的管理理念，支持并行工程与协同工作的研发管理体系，全面提升企业研发管理水平。支持个性化的定制开发，为企业定制工作流程、项目管理方式、编码规则等，增加系统的柔性。',
},
{
title: '广泛的系统集成技术',
desc: '与CAD/CAPP/ERP/MES/CRM/SRM/OA等系统无缝集成，将各系统中的共同信息提取出来，实现各个系统在数据级上的集成，保证数据一次性输入，多次重用。',
},
{
title: '七层数据安全体系全面管理企业知识财产',
desc: '多层安全控制机制，细致、周密地保护企业知识财富的绝对安全。实现全企业核心数据的“集中管理”、“权限控制”、“流程管控”、“操作追踪”等多重安全特性，令企业管理者高枕无忧！',
},
];
export default () => {
return (
<div id="mesContainer">
<img
src={require('@/assets/fac6.jpg')}
alt=""
style={{ width: '100%' }}
/>
<div>
<h2>PDM产品数据管理</h2>
<h2 className="title">PDM产品数据管理</h2>
</div>
<div className="cpjs content">
<div className="cpjs bgjs">
<h3>系统介绍</h3>
<p>
PDM依托中国领先的产品技术及解决方案，有机的把产品生命周期相关的数据和业务整合起来，为企业提供了一整套全方位的数字化产品生命周期管理平台。通过图文档管理、物料管理、产品管理、流程管理、协同办公等系统功能，支持从概念创意、设计、工艺、样机制作、生产制造、销售、维护到报废产品全生命周期各个阶段的信息创建、协同、应用和管理。{' '}
</p>
</div>
<div className="ywkj content">
<h3>业务框架</h3>
<img src={require('./img/框架.JPG')} alt="" />
</div>
<div className="yyal content">
<h3>应用案例</h3>
<div className="yingyonganli">
<div>
<div className="anli-content">
<img src={require('./img/案例1.png')} alt="" />
<div className="anli-text-left">
<h4>家电行业</h4>
<p>
为多家彩电、冰箱、空调、洗衣机制造企业提供了设备管理系统。
</p>
</div>
</div>
<div className="anli-content">
<img src={require('./img/案例3.png')} alt="" />
<div className="anli-text-left">
<h4>食品行业</h4>
<p>为多家食品、饮料、食品耗材加工企业提供了设备管理系统。</p>
</div>
<div className="cpjs">
<h3>解决问题</h3>
<Row gutter={36}>
{qsarr.map((it, i) => {
return (
<Col {...colc} key={i}>
<div className="itemqs">
<img src={require(`@/assets/qs${i + 1}.png`)} alt="" />
<h2>{it?.title}</h2>
<p>{it?.desc}</p>
</div>
<div></div>
</Col>
);
})}
</Row>
</div>
<div></div>
<div
className="cpjs bgjs"
style={{
paddingLeft: 0,
paddingRight: 0,
width: '100%',
overflow: 'hidden',
}}
>
<h3>产品功能</h3>
<Row style={{ marginTop: '2rem' }} gutter={88}>
<Col {...col}>
<img
style={{ width: '100%' }}
src={require('@/assets/fav.png')}
alt=""
/>
</Col>
<Col {...cols}>
<div className="newspaper">
{funcarr.map((it, i) => {
return (
<div>
<div className="anli-content">
<div className="anli-text-right">
<h4>半导体行业</h4>
<p>为多家晶圆制造、芯片封装企业提供了设备管理系统。</p>
</div>
<img src={require('./img/案例1.png')} alt="" />
</div>
<div className="anli-content">
<div className="anli-text-right">
<h4>机械制造行业</h4>
<p>
为多家交通设备、机器人、数控机床、包装设备制造企业提供了设备管理系统。
</p>
</div>
<img src={require('./img/案例3.png')} alt="" />
</div>
<div></div>
<h2>{it.title}</h2>
<p>{it.desc}</p>
</div>
);
})}
</div>
</Col>
</Row>
</div>
<div className="khjz content">
<h3>应用效益</h3>
<div
className="cpjs"
style={{
paddingLeft: 0,
paddingRight: 0,
width: '100%',
overflow: 'hidden',
}}
>
<h3>产品优势</h3>
<Row style={{ marginTop: '2rem' }} gutter={88}>
<Col {...cols}>
<div className="newspapers">
{lastarr.map((it, i) => {
return (
<div>
<img src={require('./img/价值.JPG')} alt="" />
<div className="khjz-text">
<p>
根据备品备件领用及使用记录信息，优化备品备件库存、降低备件库存资金积压。
</p>
<p>
通过设备维保智能分析，为企业提供管理决策依据，减少故障发生率，缩短停机时间。
</p>
<p>
以精益TPM理念为指导，实现管理决策、资产管理、设备运维、知识库等四大维度的管理。
</p>
<p>
快速定位故障设备及故障类型，缩短维修派单时间与维修工准备时间，实现维修过程透明化、数字化，提升维修管理效率，减少非计划停机时间。
</p>
<p>
通过一机一码，在PC、移动端多种应用上实现收集、记录、上报信息，自动生成各种分析报表，实现设备运维管理、人员绩效考核及产线效能分析等的无纸化办公、高效化管理。
</p>
</div>
<h2>{it.title}</h2>
<p>{it.desc}</p>
</div>
</div>
<div className="gnmk content">
<h3>功能模块</h3>
<img src={require('./img/功能模块.jpg')} alt="" />
);
})}
</div>
</Col>
<Col {...col}>
<img
style={{ width: '100%' }}
src={require('@/assets/advs.png')}
alt=""
/>
</Col>
</Row>
</div>
</div>
);
......
src/pages/factory/plm/index.jsx
View file @ 9ea567e7
......@@ -5,7 +5,7 @@ import './index.css';
const colc = { xs: 24, sm: 24, md: 24, lg: 12, xl: 12, xxl: 12 },
col = { xs: 24, sm: 24, md: 24, lg: 8, xl: 7, xxl: 6 },
cold = { xs: 24, sm: 24, md: 12, lg: 8, xl: 8, xxl: 6 },
cold = { xs: 24, sm: 24, md: 12, lg: 8, xl: 8, xxl: 8 },
cols = { xs: 24, sm: 24, md: 24, lg: 16, xl: 17, xxl: 18 };
function spArr(arr, num) {
......
src/pages/internet/index.jsx 0 → 100644
View file @ 9ea567e7
/* eslint-disable import/no-anonymous-default-export */
import React from 'react';
import { Row, Col, Carousel, Grid, Card } from 'antd';
const colc = { xs: 24, sm: 24, md: 12, lg: 12, xl: 12, xxl: 12 },
col = { xs: 24, sm: 24, md: 10, lg: 10, xl: 10, xxl: 10 },
cold = { xs: 24, sm: 24, md: 0, lg: 0, xl: 0, xxl: 0 },
colds = { xs: 0, sm: 0, md: 0, lg: 2, xl: 2, xxl: 2 },
coldc = { xs: 24, sm: 24, md: 12, lg: 4, xl: 4, xxl: 4 },
cols = { xs: 24, sm: 24, md: 14, lg: 14, xl: 14, xxl: 14 };
const qsarr = [
{
title: '流程全生命周期管理',
desc: '提供流程的全生命周期管理，包含流程设计、运行、监控、告警、分析、优化，全面掌握流程的运行情况。',
},
{
title: '支持多租户',
desc: '支持多租户部署模式，工作流程服务划分为从多个租户管理，同一个数据库层面实现数据逻辑隔离。',
},
{
title: '集成方便',
desc: '提供标准轨范的API接口，支持统一登陆，零代码无缝集成组织架构用户等，实现与各个业务系统的快速集成，解决业务系统确实流程引擎的问题。',
},
{
title: '可视化流程工具',
desc: '提供可视化Web流程设计工具，配置界面简洁，通过鼠标操作即可轻松实现流程绘制、路由规则和节点属性规则配置。支持流程查看预览可视化，流程修改可视化。',
},
{
title: '推进型引擎',
desc: '支持流程模板/实例采用网状活动结构，可根据业务自由组合。支持子流程实例，实现流程实例的嵌套。',
},
];
export default () => {
return (
<div id="mesContainer">
<img
src={require('@/assets/fac8.jpg')}
alt=""
style={{ width: '100%' }}
/>
<div>
<h2 className="title">南高工业互联网平台</h2>
</div>
<div className="cpjs bgjs">
<h3>方案介绍</h3>
<p>
通过连接企业各类设备，获取设备状态、工艺参数、质量检测等实时数据，提供工业互联网和数字工厂解决方案，实现设备健康管理，产品质量预测，企业能耗分析，提升设备使用效率，改进产品生产质量，提高企业经济效益。在工业制造的全生命周期，获取从产品设计到服务使用的全部数据，提取数据蕴含的关键信息，最终达到智能决策的目的。在核心体系互联透明的基础上，外延到工厂外进行更多的数据连接与整合，为生产加工过程提供跨流程的优化与运营决策支撑。
</p>
</div>
<div className="cpjs">
<h3 className="center">互联技术</h3>
<Row gutter={66} style={{ marginTop: '2rem' }}>
<Col {...cols}>
<img
style={{ width: '100%', margin: 0 }}
src={require('@/assets/pt1.png')}
alt=""
/>
</Col>
<Col {...cold}>
<div style={{ height: '2rem' }}></div>
</Col>
<Col {...col}>
<div
className="centerv"
style={{
borderRadius: '1rem',
backgroundColor: '#FFFFFF',
width: '100%',
height: '100%',
}}
>
<p style={{ fontSize: '0.6rem', padding: '0 2rem' }}>
<b
style={{
fontSize: '0.8rem',
display: 'block',
marginBottom: '1rem',
}}
>
技术优势
</b>
<b
style={{
display: 'block',
}}
>
技术特点：
</b>
基于工业网络，通过有线、WIFI、4G、5G等方式接入设备，将数据信息通过核心交换机上传到IOT平台，通过PC、移动端、监控大屏等方式进行信息呈现
<br />
<b
style={{
display: 'block',
marginTop: 18,
}}
>
高效、安全的设备接入与管理：
</b>
南高云支持多种接入协议，并提供一机一密、双向证书、通道加密等多重安全防护，简化设备接入与管理
<br />
<b
style={{
display: 'block',
marginTop: 18,
}}
>
支持多种类型装备：
</b>
基于工业云平台架构，支持多种类型装备数据采集，统一数据采集服务平台，支持海量设备接入
<br />
</p>
</div>
</Col>
</Row>
</div>
<div
className="cpjs"
style={{ backgroundColor: 'rgba(250, 249, 250, 1)' }}
>
<h3 className="center">核心框架</h3>
<Row gutter={66} style={{ marginTop: '2rem' }}>
<Col {...colc}>
<img
style={{ width: '100%', margin: '0 0 0 0' }}
src={require('@/assets/kuangjia.png')}
alt=""
/>
</Col>
<Col {...cold}>
<div style={{ height: '2rem' }}></div>
</Col>
<Col {...colc}>
<div
className="centerv"
style={{
borderRadius: '1rem',
backgroundColor: '#FFFFFF',
width: '100%',
height: '100%',
}}
>
<p
style={{ fontSize: '0.8rem', padding: '2rem' }}
className="fot"
>
<span>
与设备互联互通，打通企业内部数据流、业务流、管理流，实现信息透明化
</span>
<span>
支持大数据存储，支持大数据的应用分析基于大数据分析算法，对设备进行实时检测、备件寿命预测等
</span>
<span>
围绕设备数据采集的信息，实现设备远程运维、远程监控、实时分析等应用
</span>
<span>
业务模块微服务化，简化代码的复杂度SAAS架构，实现多租户下数据和权限的隔离
</span>
<span>容器化部署，实现跨平台部署，简化部署操作</span>
<span>基于微服务架构实现对服务的性能监控和告警</span>
</p>
</div>
</Col>
</Row>
</div>
<div
className="cpjs"
style={{ backgroundColor: 'rgba(250, 249, 250, 1)' }}
>
<h3 className="center">产品特点</h3>
<Row gutter={36} style={{ marginTop: '2rem' }}>
<Col {...colds}></Col>
{qsarr.map((it, i) => {
return (
<Col
{...coldc}
className="fot"
style={{
marginBottom: 36,
}}
>
<div
className="centerv"
style={{
borderRadius: '1rem',
backgroundColor: '#FFFFFF',
width: '100%',
height: '100%',
justifyContent: 'flex-start',
}}
>
<img
style={{ width: '36%', minWidth: 'auto', maxWidth: 100 }}
src={require(`@/assets/td${i + 1}.png`)}
alt=""
/>
<h4>{it.title}</h4>
<p>{it.desc}</p>
</div>
</Col>
);
})}
<Col {...colds}></Col>
</Row>
</div>
<div className="cpjs">
<h3 className="center">南高工业物联网平台SAAS 应用</h3>
<Row gutter={66} style={{ marginTop: '2rem' }}>
<Col {...colc}>
<img
style={{ width: '100%', margin: 0 }}
src={require('@/assets/application.png')}
alt=""
/>
</Col>
<Col {...cold}>
<div style={{ height: '2rem' }}></div>
</Col>
<Col {...colc}>
<div
className="centerv"
style={{
borderRadius: '1rem',
backgroundColor: '#FFFFFF',
width: '100%',
height: '100%',
lineHeight: 2.5,
}}
>
<p style={{ fontSize: '0.6rem', padding: '0 2rem' }}>
<b
style={{
fontSize: '0.8rem',
display: 'block',
marginBottom: '1rem',
}}
>
业务覆盖
</b>
通过设备互联，实现设备实时数据采集，提供工厂设备稼动率、MTTR、MTBF等设备运行效率分析报告。
<br />
基于设备实时故障信号，提供设备故障的实时诊断与快速维修，保证生产计划的执行。
<br />
基于设备实时状态数据，提供设备实时监控、远程诊断、故障预测、健康管理等服务。
<br />
基于设备和产品的实时数据，提供产品故障原因分析工具，实现产品质量提升。
<br />
基于设备连接，提供数控程序自动编程、远程下载服务。
<br />
根据设备和产品模型，提供设备误差补偿服务，提高产品质量。
</p>
</div>
</Col>
</Row>
</div>
<div className="cpjs">
<h3 className="center">南高工业物联网解决实施案例</h3>
<img src={require('@/assets/casese.png')} alt="" />
</div>
</div>
);
};
Markdown is supported
0% or
You are about to add 0 people to the discussion. Proceed with caution.
Finish editing this message first!
Please register or to comment