commit
b672914802
57 changed files with 10047 additions and 0 deletions
@ -0,0 +1,23 @@
|
||||
.DS_Store |
||||
node_modules |
||||
/dist |
||||
|
||||
|
||||
# local env files |
||||
.env.local |
||||
.env.*.local |
||||
|
||||
# Log files |
||||
npm-debug.log* |
||||
yarn-debug.log* |
||||
yarn-error.log* |
||||
pnpm-debug.log* |
||||
|
||||
# Editor directories and files |
||||
.idea |
||||
.vscode |
||||
*.suo |
||||
*.ntvs* |
||||
*.njsproj |
||||
*.sln |
||||
*.sw? |
||||
@ -0,0 +1,29 @@
|
||||
# library |
||||
|
||||
## Project setup |
||||
``` |
||||
npm install |
||||
``` |
||||
|
||||
### Compiles and hot-reloads for development |
||||
``` |
||||
npm run serve |
||||
``` |
||||
|
||||
### Compiles and minifies for production |
||||
``` |
||||
npm run build |
||||
``` |
||||
|
||||
### Run your tests |
||||
``` |
||||
npm run test |
||||
``` |
||||
|
||||
### Lints and fixes files |
||||
``` |
||||
npm run lint |
||||
``` |
||||
|
||||
### Customize configuration |
||||
See [Configuration Reference](https://cli.vuejs.org/config/). |
||||
@ -0,0 +1,5 @@
|
||||
module.exports = { |
||||
presets: [ |
||||
'@vue/cli-plugin-babel/preset' |
||||
] |
||||
} |
||||
@ -0,0 +1,19 @@
|
||||
{ |
||||
"compilerOptions": { |
||||
"target": "es5", |
||||
"module": "esnext", |
||||
"baseUrl": "./", |
||||
"moduleResolution": "node", |
||||
"paths": { |
||||
"@/*": [ |
||||
"src/*" |
||||
] |
||||
}, |
||||
"lib": [ |
||||
"esnext", |
||||
"dom", |
||||
"dom.iterable", |
||||
"scripthost" |
||||
] |
||||
} |
||||
} |
||||
@ -0,0 +1,30 @@
|
||||
{ |
||||
"name": "library", |
||||
"version": "0.1.0", |
||||
"private": true, |
||||
"scripts": { |
||||
"dev": "vue-cli-service serve", |
||||
"build": "vue-cli-service build" |
||||
}, |
||||
"dependencies": { |
||||
"animate.css": "^3.5.1", |
||||
"axios": "^0.27.2", |
||||
"core-js": "^3.8.3", |
||||
"element-ui": "^2.15.9", |
||||
"html2canvas": "^1.4.1", |
||||
"vue": "^2.6.14", |
||||
"vue-router": "^3.5.1" |
||||
}, |
||||
"devDependencies": { |
||||
"@vue/cli-plugin-babel": "^5.0.0", |
||||
"@vue/cli-service": "^5.0.0", |
||||
"less": "^4.0.0", |
||||
"less-loader": "^8.0.0", |
||||
"vue-template-compiler": "^2.6.14" |
||||
}, |
||||
"browserslist": [ |
||||
"> 1%", |
||||
"last 2 versions", |
||||
"not dead" |
||||
] |
||||
} |
||||
|
After Width: | Height: | Size: 62 KiB |
@ -0,0 +1,20 @@
|
||||
<!DOCTYPE html> |
||||
<html lang=""> |
||||
|
||||
<head> |
||||
<meta charset="utf-8"> |
||||
<meta http-equiv="X-UA-Compatible" content="IE=edge"> |
||||
<!-- <meta name="viewport" content="width=device-width,initial-scale=1.0"> --> |
||||
<link rel="icon" href="<%= BASE_URL %>favicon.ico"> |
||||
<title>山东青鸟工业互联网</title> |
||||
</head> |
||||
|
||||
<body> |
||||
<noscript> |
||||
<strong>We're sorry but <%= htmlWebpackPlugin.options.title %> doesn't work properly without JavaScript enabled. |
||||
Please enable it to continue.</strong> |
||||
</noscript> |
||||
<div id="app"></div> |
||||
</body> |
||||
|
||||
</html> |
||||
@ -0,0 +1,28 @@
|
||||
<template> |
||||
<div id="app"> |
||||
<router-link to="/"></router-link> |
||||
<router-view /> |
||||
</div> |
||||
</template> |
||||
<script> |
||||
</script> |
||||
<style lang="less"> |
||||
::-webkit-scrollbar { |
||||
-webkit-appearance: none; |
||||
width: 6px; |
||||
height: 6px; |
||||
} |
||||
::-webkit-scrollbar-track { |
||||
background: rgba(0, 0, 0, 0.1); |
||||
border-radius: 0; |
||||
} |
||||
::-webkit-scrollbar-thumb { |
||||
cursor: pointer; |
||||
border-radius: 5px; |
||||
background: rgba(0, 0, 0, 0.15); |
||||
transition: color 0.2s ease; |
||||
} |
||||
::-webkit-scrollbar-thumb:hover { |
||||
background: rgba(0, 0, 0, 0.3); |
||||
} |
||||
</style> |
||||
@ -0,0 +1,274 @@
|
||||
import request from "@/utils/request"; |
||||
// 事故快报
|
||||
export function getAccidentList(data) { |
||||
return request({ |
||||
url: "zzhController/getAccidentList.action", |
||||
method: "get", |
||||
params: data, |
||||
}); |
||||
} |
||||
// 资料库
|
||||
export function getWxData_baseList(data) { |
||||
return request({ |
||||
url: "zzhController/getWxData_baseList.action", |
||||
method: "get", |
||||
params: data, |
||||
}); |
||||
} |
||||
// 专家库 机构库
|
||||
export function getMemberList(data) { |
||||
return request({ |
||||
url: "zzhController/getMemberList.action", |
||||
method: "get", |
||||
params: data, |
||||
}); |
||||
} |
||||
// 风险库行业
|
||||
export function getRiskTypelistWX(data) { |
||||
return request({ |
||||
url: "/adminController/getRiskTypelistWX.action", |
||||
method: "get", |
||||
params: data, |
||||
}); |
||||
} |
||||
// 子行业
|
||||
export function getRiskClassListWX(data) { |
||||
return request({ |
||||
url: "/adminController/getRiskClassListWX.action", |
||||
method: "get", |
||||
params: data, |
||||
}); |
||||
} |
||||
//分项
|
||||
export function getRiskListWX(data) { |
||||
return request({ |
||||
url: "/adminController/getRiskListWX.action", |
||||
method: "get", |
||||
params: data, |
||||
}); |
||||
} |
||||
// 风险库详情
|
||||
export function getRiskDetaidentBySidWX(data) { |
||||
return request({ |
||||
url: "/adminController/getRiskDetaidentBySidWX.action", |
||||
method: "get", |
||||
params: data, |
||||
}); |
||||
} |
||||
// 资料库分类
|
||||
export function getDataBaseType(data) { |
||||
return request({ |
||||
url: "/zzhController/getDataBaseType.action", |
||||
method: "get", |
||||
params: data, |
||||
}); |
||||
} |
||||
// 机构库详情
|
||||
export function getMemberBySid(data) { |
||||
return request({ |
||||
url: "/zzhController/getMemberBySid.action", |
||||
method: "get", |
||||
params: data, |
||||
}); |
||||
} |
||||
// 机构库相关推荐
|
||||
export function getOrgMember(data) { |
||||
return request({ |
||||
url: "/zzhController/getOrgMember.action", |
||||
method: "get", |
||||
params: data, |
||||
}); |
||||
} |
||||
// 省份
|
||||
export function getPosition(data) { |
||||
return request({ |
||||
url: "/zzhController/getPosition.action", |
||||
method: "get", |
||||
params: data, |
||||
}); |
||||
} |
||||
// 市
|
||||
export function getPpositionByB(data) { |
||||
return request({ |
||||
url: "/zzhController/getPpositionByB.action", |
||||
method: "get", |
||||
params: data, |
||||
}); |
||||
} |
||||
// 专家相关资料
|
||||
export function getDataBaseList(data) { |
||||
return request({ |
||||
url: "/zzhController/getDataBaseList.action", |
||||
method: "get", |
||||
params: data, |
||||
}); |
||||
} |
||||
// 事故类型
|
||||
export function getAccidentType(data) { |
||||
return request({ |
||||
url: "/zzhController/getAccidentType.action", |
||||
method: "get", |
||||
params: data, |
||||
}); |
||||
} |
||||
// 事故等级
|
||||
export function getAccidentLevel(data) { |
||||
return request({ |
||||
url: "/zzhController/getAccidentLevel.action", |
||||
method: "get", |
||||
params: data, |
||||
}); |
||||
} |
||||
// 事故快报详情
|
||||
export function getAccidentBysid(data) { |
||||
return request({ |
||||
url: "/zzhController/getAccidentBysid.action", |
||||
method: "get", |
||||
params: data, |
||||
}); |
||||
} |
||||
// 法规库
|
||||
export function getAllLawDetailList(data) { |
||||
return request({ |
||||
url: "/zzhController/getAllLawDetailList.action", |
||||
method: "get", |
||||
params: data, |
||||
}); |
||||
} |
||||
// 法规类型
|
||||
export function getAllLibLawType(data) { |
||||
return request({ |
||||
url: "/zzhController/getAllLibLawType.action", |
||||
method: "get", |
||||
params: data, |
||||
}); |
||||
} |
||||
// 法规适用领域
|
||||
export function getAllLibLawIndustry(data) { |
||||
return request({ |
||||
url: "/zzhController/getAllLibLawIndustry.action", |
||||
method: "get", |
||||
params: data, |
||||
}); |
||||
} |
||||
// 法规详情
|
||||
export function getLawDetailBysid(data) { |
||||
return request({ |
||||
url: "/zzhController/getLawDetailBysid.action", |
||||
method: "get", |
||||
params: data, |
||||
}); |
||||
} |
||||
// 登录
|
||||
export function addMemberPcLogin(data) { |
||||
return request({ |
||||
url: "/zzhController/addMemberPcLogin.action", |
||||
method: "get", |
||||
params: data, |
||||
}); |
||||
} |
||||
// 获取用户userid、sid、member
|
||||
export function getMemberPcLogin(data) { |
||||
return request({ |
||||
url: "/zzhController/getMemberPcLogin.action", |
||||
method: "get", |
||||
params: data, |
||||
}); |
||||
} |
||||
// 判断用户是否有邮箱
|
||||
export function getMemberPointsAndEmail(data) { |
||||
return request({ |
||||
url: "/zzhController/getMemberPointsAndEmail.action", |
||||
method: "get", |
||||
params: data, |
||||
}); |
||||
} |
||||
// 法规下载
|
||||
export function getFileDownlode(data) { |
||||
return request({ |
||||
url: "/zzhController/getFileDownlode.action", |
||||
method: "get", |
||||
params: data, |
||||
}); |
||||
} |
||||
// 增加法规预览量
|
||||
export function updateLawPreview(data) { |
||||
return request({ |
||||
url: "/zzhController/updateLawPreview.action", |
||||
method: "get", |
||||
params: data, |
||||
}); |
||||
} |
||||
// 增加法规下载量
|
||||
export function updateLawDownload(data) { |
||||
return request({ |
||||
url: "/zzhController/updateLawDownload.action", |
||||
method: "get", |
||||
params: data, |
||||
}); |
||||
} |
||||
// 资料库详情
|
||||
export function getWxDataBaseBySid(data) { |
||||
return request({ |
||||
url: "/zzhController/getWxDataBaseBySid.action", |
||||
method: "get", |
||||
params: data, |
||||
}); |
||||
} |
||||
// 增加资料下载量
|
||||
export function updateDataBaseNum(data) { |
||||
return request({ |
||||
url: "/zzhController/updateDataBaseNum.action", |
||||
method: "get", |
||||
params: data, |
||||
}); |
||||
} |
||||
// 点击个人中心
|
||||
export function getAuthUser(data) { |
||||
return request({ |
||||
url: "/zzhController/getAuthUser.action", |
||||
method: "get", |
||||
params: data, |
||||
}); |
||||
} |
||||
// 推荐事故
|
||||
export function getAccidentRecommend(data) { |
||||
return request({ |
||||
url: "/zzhController/getAccidentRecommend.action", |
||||
method: "get", |
||||
params: data, |
||||
}); |
||||
} |
||||
// 法规高级搜索是否超过今日搜索量
|
||||
export function getDataSeeCount(data) { |
||||
return request({ |
||||
url: "/zzhController/getDataSeeCount.action", |
||||
method: "get", |
||||
params: data, |
||||
}); |
||||
} |
||||
// 法规高级搜索 查询数据
|
||||
export function getLibLawSearch(data) { |
||||
return request({ |
||||
url: "/zzhController/getLibLawSearch.action", |
||||
method: "get", |
||||
params: data, |
||||
}); |
||||
} |
||||
// 事故快报查看是否超过今日查看量
|
||||
export function getDangerSee(data) { |
||||
return request({ |
||||
url: "/zzhController/getDangerSee.action", |
||||
method: "get", |
||||
params: data, |
||||
}); |
||||
} |
||||
// 精品风险库事故快报详情
|
||||
export function getRiskPayorder(data) { |
||||
return request({ |
||||
url: "/zzhController/getRiskPayorder.action", |
||||
method: "get", |
||||
params: data, |
||||
}); |
||||
} |
||||
|
||||
@ -0,0 +1,99 @@
|
||||
* { |
||||
margin: 0; |
||||
padding: 0; |
||||
box-sizing: border-box; |
||||
} |
||||
|
||||
body { |
||||
background-color: #F7FAFF; |
||||
margin: 0; |
||||
padding: 0; |
||||
} |
||||
|
||||
a { |
||||
text-decoration: none; |
||||
} |
||||
|
||||
ul, |
||||
ol { |
||||
list-style: none; |
||||
} |
||||
|
||||
|
||||
|
||||
.mode { |
||||
width: 100%; |
||||
margin: 0 auto; |
||||
} |
||||
|
||||
.modelWidth { |
||||
width: 80%; |
||||
margin: 0 auto; |
||||
} |
||||
|
||||
.max { |
||||
height: 100%; |
||||
} |
||||
|
||||
.card { |
||||
background-color: #fff; |
||||
border-radius: 8px; |
||||
box-shadow: 0px 3px 9px 0px rgba(123, 123, 123, 0.0900); |
||||
padding: 20px; |
||||
margin-top: 20px; |
||||
} |
||||
|
||||
.flex { |
||||
display: flex; |
||||
align-items: center; |
||||
} |
||||
|
||||
.flex_btw { |
||||
display: flex; |
||||
justify-content: space-between; |
||||
align-items: center; |
||||
} |
||||
|
||||
.flex_aro { |
||||
display: flex; |
||||
justify-content: space-around; |
||||
align-items: center; |
||||
} |
||||
|
||||
.flex_center { |
||||
display: flex; |
||||
justify-content: center; |
||||
align-items: center; |
||||
} |
||||
|
||||
.flex_col { |
||||
display: flex; |
||||
flex-direction: column; |
||||
justify-content: center; |
||||
align-items: center; |
||||
} |
||||
|
||||
.content_title { |
||||
display: flex; |
||||
justify-content: center; |
||||
align-items: center; |
||||
} |
||||
|
||||
.content_title img { |
||||
width: 35px; |
||||
margin-right: 10px; |
||||
} |
||||
|
||||
.content_title h4 { |
||||
position: relative; |
||||
} |
||||
|
||||
|
||||
.el-empty { |
||||
width: 100%; |
||||
} |
||||
|
||||
.el-pagination { |
||||
margin-top: 20px; |
||||
float: right; |
||||
} |
||||
|
After Width: | Height: | Size: 99 KiB |
|
After Width: | Height: | Size: 3.3 KiB |
|
After Width: | Height: | Size: 2.0 KiB |
|
After Width: | Height: | Size: 2.1 KiB |
|
After Width: | Height: | Size: 3.4 KiB |
|
After Width: | Height: | Size: 2.3 KiB |
|
After Width: | Height: | Size: 313 B |
|
After Width: | Height: | Size: 343 B |
|
After Width: | Height: | Size: 600 B |
|
After Width: | Height: | Size: 60 KiB |
|
After Width: | Height: | Size: 4.1 KiB |
|
After Width: | Height: | Size: 2.3 KiB |
|
After Width: | Height: | Size: 4.7 KiB |
|
After Width: | Height: | Size: 1.2 KiB |
|
After Width: | Height: | Size: 206 B |
|
After Width: | Height: | Size: 157 KiB |
|
After Width: | Height: | Size: 8.9 KiB |
|
After Width: | Height: | Size: 10 KiB |
|
After Width: | Height: | Size: 10 KiB |
|
After Width: | Height: | Size: 10 KiB |
|
After Width: | Height: | Size: 1.3 KiB |
|
After Width: | Height: | Size: 23 KiB |
|
After Width: | Height: | Size: 5.3 KiB |
|
After Width: | Height: | Size: 22 KiB |
|
After Width: | Height: | Size: 9.3 KiB |
|
After Width: | Height: | Size: 2.1 KiB |
|
After Width: | Height: | Size: 336 KiB |
|
After Width: | Height: | Size: 387 KiB |
|
After Width: | Height: | Size: 1.7 KiB |
|
After Width: | Height: | Size: 1.6 KiB |
|
After Width: | Height: | Size: 525 B |
|
After Width: | Height: | Size: 10 KiB |
|
After Width: | Height: | Size: 8.9 KiB |
|
After Width: | Height: | Size: 326 B |
|
After Width: | Height: | Size: 318 B |
|
After Width: | Height: | Size: 1.2 KiB |
|
After Width: | Height: | Size: 1.3 KiB |
|
After Width: | Height: | Size: 62 KiB |
@ -0,0 +1,287 @@
|
||||
<template> |
||||
<div class="footer"> |
||||
<div class="modelWidth" style="height: 100%; padding-top: 30px"> |
||||
<div class="top flex"> |
||||
<div class="left"> |
||||
<div class="type" v-for="(item, index) in footArray" :key="index"> |
||||
<div class="line"></div> |
||||
<div class="font" v-for="(items, indexs) in item" :key="indexs"> |
||||
{{ items.name }} |
||||
</div> |
||||
</div> |
||||
</div> |
||||
<div class="right"> |
||||
<div class="need"> |
||||
<div class="flex_btw"> |
||||
<input |
||||
id="input1" |
||||
type="text" |
||||
v-model="formInline.name" |
||||
placeholder="姓名" |
||||
/> |
||||
<input |
||||
id="input2" |
||||
type="text" |
||||
v-model="formInline.phone" |
||||
placeholder="手机" |
||||
/> |
||||
</div> |
||||
<div style="margin-top: 6px; flex: 2"> |
||||
<input |
||||
id="input3" |
||||
type="text" |
||||
v-model="formInline.need" |
||||
placeholder="您的需求" |
||||
/> |
||||
</div> |
||||
<div class="submit">提交申请</div> |
||||
</div> |
||||
</div> |
||||
</div> |
||||
|
||||
<div class="bottom flex"> |
||||
<div class="address"> |
||||
<div class="address-top flex"> |
||||
<div>全国服务电话：17610200130</div> |
||||
<div>总部电话：17610200139</div> |
||||
<div>客服微信：17610200139</div> |
||||
</div> |
||||
<div class="address-bottom"> |
||||
地址：山东省济南市历下区千佛山路1号建邦创意星空广场A座10楼A1002室 |
||||
</div> |
||||
<div class="address-bottom"> |
||||
运营中心：山东省济南市历下区千佛山路1号建邦创意星空广场A座10楼A1002室 |
||||
</div> |
||||
<div class="address-bottom">ICP备案号：京ICP备13008577号-1</div> |
||||
</div> |
||||
<div class="qr flex"> |
||||
<div> |
||||
<img |
||||
style="width: 80px; height: 80px" |
||||
:src="require('@/assets/img/home/qr.png')" |
||||
/> |
||||
<div class="wx">微信公众号</div> |
||||
</div> |
||||
</div> |
||||
</div> |
||||
</div> |
||||
</div> |
||||
</template> |
||||
|
||||
<script> |
||||
export default { |
||||
data() { |
||||
return { |
||||
footArray: [ |
||||
[ |
||||
{ |
||||
name: "工业SAAS平台", |
||||
}, |
||||
{ |
||||
name: "硬件设备", |
||||
}, |
||||
{ |
||||
name: "工业互联网", |
||||
}, |
||||
{ |
||||
name: "数促中心", |
||||
}, |
||||
], |
||||
[ |
||||
{ |
||||
name: "公司资讯", |
||||
}, |
||||
{ |
||||
name: "行业动态", |
||||
}, |
||||
{ |
||||
name: "工业互联网", |
||||
}, |
||||
{ |
||||
name: "技术分享", |
||||
}, |
||||
], |
||||
[ |
||||
{ |
||||
name: "商业合作", |
||||
}, |
||||
], |
||||
[ |
||||
{ |
||||
name: "企业介绍", |
||||
}, |
||||
{ |
||||
name: "发展历程", |
||||
}, |
||||
{ |
||||
name: "愿景使命", |
||||
}, |
||||
], |
||||
], |
||||
formInline: { |
||||
name: "", |
||||
phone: "", |
||||
need: "", |
||||
}, |
||||
}; |
||||
}, |
||||
}; |
||||
</script> |
||||
|
||||
<style lang="less" scoped> |
||||
.footer { |
||||
background: #323443; |
||||
padding-bottom: 50px; |
||||
width: 100%; |
||||
.top { |
||||
height: 50%; |
||||
padding-top: 30px; |
||||
padding-bottom: 30px; |
||||
border-bottom: 1px solid #fff; |
||||
.left { |
||||
flex: 1.5; |
||||
display: flex; |
||||
align-items: start; |
||||
justify-content: space-between; |
||||
padding-right: 100px; |
||||
position: relative; |
||||
.type { |
||||
.line { |
||||
width: 32px; |
||||
height: 3px; |
||||
background: #0069eb; |
||||
border-radius: 2px; |
||||
margin-bottom: 10px; |
||||
} |
||||
.font { |
||||
font-size: 12px; |
||||
font-family: PingFang SC; |
||||
font-weight: 400; |
||||
color: #ffffff; |
||||
padding-top: 12px; |
||||
cursor: pointer; |
||||
} |
||||
} |
||||
} |
||||
.left::after { |
||||
content: ""; |
||||
display: inline-block; |
||||
width: 1px; |
||||
height: 140px; |
||||
background: #999999; |
||||
position: absolute; |
||||
right: 0; |
||||
top: 50%; |
||||
transform: translateY(-50%); |
||||
} |
||||
.right { |
||||
flex: 1; |
||||
display: flex; |
||||
align-items: center; |
||||
justify-content: center; |
||||
.submit { |
||||
cursor: pointer; |
||||
margin-top: 14px; |
||||
width: 90px; |
||||
height: 27px; |
||||
border: 1px solid #ffffff; |
||||
text-align: center; |
||||
line-height: 27px; |
||||
font-size: 13px; |
||||
color: #fff; |
||||
} |
||||
.need { |
||||
#input1 { |
||||
width: 49%; |
||||
box-sizing: border-box; |
||||
padding-left: 10px; |
||||
font-size: 15px; |
||||
background: #999999; |
||||
height: 25px; |
||||
color: #fff; |
||||
-web-kit-appearance: none; |
||||
display: block; |
||||
outline: 0; |
||||
|
||||
border: 0; |
||||
text-decoration: none; |
||||
} |
||||
#input2 { |
||||
width: 49%; |
||||
box-sizing: border-box; |
||||
font-size: 15px; |
||||
padding-left: 10px; |
||||
height: 25px; |
||||
color: #fff; |
||||
background: #999999; |
||||
-web-kit-appearance: none; |
||||
display: block; |
||||
outline: 0; |
||||
border: 0; |
||||
text-decoration: none; |
||||
} |
||||
#input3 { |
||||
width: 100%; |
||||
box-sizing: border-box; |
||||
font-size: 15px; |
||||
color: #fff; |
||||
height: 25px; |
||||
padding-left: 10px; |
||||
background: #999999; |
||||
-web-kit-appearance: none; |
||||
display: block; |
||||
outline: 0; |
||||
border: 0; |
||||
text-decoration: none; |
||||
} |
||||
} |
||||
} |
||||
} |
||||
|
||||
.bottom { |
||||
.address { |
||||
flex: 1.5; |
||||
font-size: 14px; |
||||
font-family: PingFang SC; |
||||
font-weight: 400; |
||||
color: #ffffff; |
||||
line-height: 28px; |
||||
padding-top: 30px; |
||||
|
||||
.address-top { |
||||
justify-content: space-between; |
||||
} |
||||
.address-bottom { |
||||
padding-top: 10px; |
||||
} |
||||
} |
||||
.qr { |
||||
flex: 1; |
||||
justify-content: end; |
||||
padding-right: 100px; |
||||
.wx { |
||||
color: #fff; |
||||
} |
||||
} |
||||
} |
||||
} |
||||
input::-webkit-input-placeholder { |
||||
/* WebKit browsers */ |
||||
color: #fae5e5; |
||||
} |
||||
|
||||
input:-moz-placeholder { |
||||
/* Mozilla Firefox 4 to 18 */ |
||||
color: #fae5e5; |
||||
} |
||||
|
||||
input::-moz-placeholder { |
||||
/* Mozilla Firefox 19+ */ |
||||
color: #fae5e5; |
||||
} |
||||
|
||||
input:-ms-input-placeholder { |
||||
/* Internet Explorer 10+ */ |
||||
color: #fae5e5; |
||||
} |
||||
</style> |
||||
@ -0,0 +1,297 @@
|
||||
<template> |
||||
<div class="home"> |
||||
<!-- 导航 --> |
||||
<div class="nav"> |
||||
<div class="modelWidth max flex"> |
||||
<div style="flex: 1"> |
||||
<el-image |
||||
style="height: 60px" |
||||
:src="require('@/assets/img/blogo.png')" |
||||
fit="contain" |
||||
></el-image> |
||||
</div> |
||||
<div class="menu"> |
||||
<div |
||||
v-for="(item, index) in navList" |
||||
:key="index" |
||||
:class="activeIndex === index ? 'a active' : 'a noactive'" |
||||
> |
||||
<div @click="hanldeNav(index)"> |
||||
{{ item }} |
||||
<img |
||||
v-if="index == 1 || index == 2 || index == 3" |
||||
style="width: 14px; height: 12px" |
||||
src="@/assets/img/home/gengduo.png" |
||||
/> |
||||
</div> |
||||
|
||||
<div :class="activeIndex === index ? 'line' : 'noline'"></div> |
||||
<div class="transition-box"> |
||||
<div class="box"> |
||||
<div class="box-left"> |
||||
<div |
||||
:class="showIndex == index ? 'silders' : 'silder'" |
||||
v-for="(item, index) in serve" |
||||
:key="index" |
||||
@mouseenter="handleServe(index)" |
||||
> |
||||
{{ item.name }} |
||||
</div> |
||||
</div> |
||||
<div class="box-right" v-show="showIndex == 0"> |
||||
<div |
||||
class="platform" |
||||
v-for="(item, index) in platform" |
||||
:key="index" |
||||
> |
||||
<div class="top">{{ item.title }}</div> |
||||
<div class="bottom">{{ item.name }}</div> |
||||
</div> |
||||
</div> |
||||
<div class="box-right" v-show="showIndex == 1"> |
||||
<div |
||||
class="platform" |
||||
v-for="(item, index) in platform1" |
||||
:key="index" |
||||
> |
||||
<div class="top">{{ item.title }}</div> |
||||
<div class="bottom">{{ item.name }}</div> |
||||
</div> |
||||
</div> |
||||
<div class="box-right" v-show="showIndex == 2"> |
||||
<div |
||||
class="platform" |
||||
v-for="(item, index) in platform2" |
||||
:key="index" |
||||
> |
||||
<div class="top">{{ item.title }}</div> |
||||
<div class="bottom">{{ item.name }}</div> |
||||
</div> |
||||
</div> |
||||
</div> |
||||
</div> |
||||
</div> |
||||
</div> |
||||
</div> |
||||
</div> |
||||
</div> |
||||
</template> |
||||
|
||||
<script> |
||||
export default { |
||||
name: "Header", |
||||
// props: ["activeIndex"], |
||||
data() { |
||||
return { |
||||
navList: ["首页", "产品与服务", "解决方案", "新闻中心", "关于我们"], |
||||
serve: [ |
||||
{ |
||||
name: "数据服务", |
||||
id: 1, |
||||
}, |
||||
{ |
||||
name: "工业SAAS平台", |
||||
id: 2, |
||||
}, |
||||
{ |
||||
name: "硬件产品", |
||||
id: 3, |
||||
}, |
||||
], |
||||
platform: [ |
||||
{ |
||||
title: "大数据技术1", |
||||
name: "大数据核验平台", |
||||
}, |
||||
{ |
||||
title: "大数据技术1", |
||||
name: "大数据核验平台", |
||||
}, |
||||
{ |
||||
title: "大数据技术1", |
||||
name: "大数据核验平台", |
||||
}, |
||||
{ |
||||
title: "大数据技术1", |
||||
name: "大数据核验平台", |
||||
}, |
||||
], |
||||
platform1: [ |
||||
{ |
||||
title: "大数据技术2", |
||||
name: "大数据核验平台", |
||||
}, |
||||
{ |
||||
title: "大数据技术2", |
||||
name: "大数据核验平台", |
||||
}, |
||||
{ |
||||
title: "大数据技术2", |
||||
name: "大数据核验平台", |
||||
}, |
||||
{ |
||||
title: "大数据技术2", |
||||
name: "大数据核验平台", |
||||
}, |
||||
], |
||||
platform2: [ |
||||
{ |
||||
title: "大数据技术3", |
||||
name: "大数据核验平台", |
||||
}, |
||||
{ |
||||
title: "大数据技术3", |
||||
name: "大数据核验平台", |
||||
}, |
||||
{ |
||||
title: "大数据技术3", |
||||
name: "大数据核验平台", |
||||
}, |
||||
{ |
||||
title: "大数据技术3", |
||||
name: "大数据核验平台", |
||||
}, |
||||
], |
||||
activeIndex: 0, |
||||
timer: null, |
||||
showIndex: 0, |
||||
}; |
||||
}, |
||||
created() {}, |
||||
methods: { |
||||
//跳转导航 |
||||
hanldeNav(index) { |
||||
this.activeIndex = index; |
||||
}, |
||||
//产品服务 |
||||
handleServe(index) { |
||||
this.showIndex = index; |
||||
}, |
||||
}, |
||||
}; |
||||
</script> |
||||
<style lang="less" scoped> |
||||
.home { |
||||
width: 100%; |
||||
|
||||
.nav { |
||||
width: 100%; |
||||
height: 85px; |
||||
background-color: #fff; |
||||
|
||||
.menu { |
||||
height: 100%; |
||||
display: flex; |
||||
justify-content: space-around; |
||||
|
||||
flex: 7; |
||||
cursor: pointer; |
||||
.a { |
||||
padding-top: 30px; |
||||
|
||||
&:nth-child(2):hover .transition-box { |
||||
display: block; |
||||
} |
||||
} |
||||
.noactive { |
||||
color: #333333; |
||||
font-size: 18px; |
||||
font-family: PingFang SC; |
||||
font-weight: 400; |
||||
position: relative; |
||||
} |
||||
.active { |
||||
font-size: 18px; |
||||
font-family: PingFang SC; |
||||
font-weight: 500; |
||||
color: #0252d9; |
||||
position: relative; |
||||
} |
||||
.line { |
||||
margin: 6px auto 0 auto; |
||||
height: 3px; |
||||
background-color: #2311e8; |
||||
width: 30px; |
||||
} |
||||
.noline { |
||||
margin: 6px auto 0 auto; |
||||
height: 3px; |
||||
width: 30px; |
||||
} |
||||
.transition-box { |
||||
margin-top: 15px; |
||||
width: 100%; |
||||
height: 250px; |
||||
display: none; |
||||
border-radius: 4px; |
||||
background-color: #fff; |
||||
position: fixed; |
||||
left: 0; |
||||
right: 0; |
||||
z-index: 999; |
||||
border-top: 1px solid #d1d1d1; |
||||
.box { |
||||
width: 80%; |
||||
margin: 0 auto; |
||||
height: 250px; |
||||
display: flex; |
||||
.box-left { |
||||
width: 30%; |
||||
border-right: 1px solid #d1d1d1; |
||||
display: flex; |
||||
font-size: 16px; |
||||
flex-direction: column; |
||||
align-items: center; |
||||
padding-bottom: 50px; |
||||
.silder { |
||||
flex: 1; |
||||
width: 100%; |
||||
display: flex; |
||||
align-items: center; |
||||
justify-content: center; |
||||
color: #333; |
||||
font-weight: bolder; |
||||
} |
||||
.silders { |
||||
flex: 1; |
||||
width: 100%; |
||||
display: flex; |
||||
align-items: center; |
||||
justify-content: center; |
||||
color: #2d13c1; |
||||
font-weight: bolder; |
||||
border-right: 2px solid #2d13c1; |
||||
} |
||||
} |
||||
.box-right { |
||||
width: 70%; |
||||
display: flex; |
||||
|
||||
padding: 30px; |
||||
justify-content: center; |
||||
flex-wrap: wrap; |
||||
.platform { |
||||
width: 25%; |
||||
|
||||
& > .bottom:hover { |
||||
color: #2d13c1; |
||||
font-weight: bolder; |
||||
} |
||||
.top { |
||||
color: #333; |
||||
font-size: 15px; |
||||
font-weight: bolder; |
||||
} |
||||
.bottom { |
||||
color: #666; |
||||
font-size: 13px; |
||||
padding-top: 14px; |
||||
} |
||||
} |
||||
} |
||||
} |
||||
} |
||||
} |
||||
} |
||||
} |
||||
</style> |
||||
@ -0,0 +1,50 @@
|
||||
<template> |
||||
<div class="mode"> |
||||
<div class="title flex_col"> |
||||
<div :class="type == 'white' ? 'noheading' : 'heading'"> |
||||
{{ this.heading }} |
||||
</div> |
||||
<div class="footing">{{ this.footing }}</div> |
||||
<div> |
||||
<img |
||||
style="height: 24px; width: 200px" |
||||
src="@/assets/img/home/line.png" |
||||
/> |
||||
</div> |
||||
</div> |
||||
</div> |
||||
</template> |
||||
<script> |
||||
export default { |
||||
props: ["heading", "footing", "type"], |
||||
data() { |
||||
return {}; |
||||
}, |
||||
}; |
||||
</script> |
||||
|
||||
<style lang="less" scoped> |
||||
.title { |
||||
display: flex; |
||||
.heading { |
||||
font-size: 33px; |
||||
font-family: PingFang SC; |
||||
font-weight: 600; |
||||
color: #333333; |
||||
} |
||||
.noheading { |
||||
font-size: 33px; |
||||
font-family: PingFang SC; |
||||
font-weight: 600; |
||||
color: #fff; |
||||
} |
||||
.footing { |
||||
font-size: 22px; |
||||
font-family: PingFang SC; |
||||
font-weight: 600; |
||||
color: #666; |
||||
opacity: 0.3; |
||||
margin-top: -18px; |
||||
} |
||||
} |
||||
</style> |
||||
@ -0,0 +1,14 @@
|
||||
import Vue from "vue"; |
||||
import App from "./App.vue"; |
||||
import router from "./router"; |
||||
import Element from "element-ui"; |
||||
import "element-ui/lib/theme-chalk/index.css"; |
||||
import animated from 'animate.css' |
||||
Vue.use(animated); |
||||
Vue.use(Element); |
||||
import "@/assets/css/style.css"; |
||||
Vue.config.productionTip = false; |
||||
new Vue({ |
||||
router, |
||||
render: (h) => h(App), |
||||
}).$mount("#app"); |
||||
@ -0,0 +1,19 @@
|
||||
import Vue from "vue"; |
||||
import VueRouter from "vue-router"; |
||||
import HomeView from "../views/home.vue"; |
||||
|
||||
Vue.use(VueRouter); |
||||
|
||||
const routes = [ |
||||
{ |
||||
path: "/", |
||||
name: "home", |
||||
component: HomeView, |
||||
}, |
||||
]; |
||||
|
||||
const router = new VueRouter({ |
||||
routes, |
||||
}); |
||||
|
||||
export default router; |
||||
@ -0,0 +1,94 @@
|
||||
import axios from "axios"; |
||||
import { Message } from "element-ui"; |
||||
const tip = (msg) => { |
||||
Message({ |
||||
message: msg, |
||||
duration: 1000, |
||||
}); |
||||
}; |
||||
const toLogin = () => { |
||||
router.replace({ |
||||
path: "/login", |
||||
}); |
||||
}; |
||||
const service = axios.create({ |
||||
// baseURL: "https://zhinengku.zhixunanquan.com/fsms-library/",
|
||||
baseURL:"/fsms-library", |
||||
timeout: 5000, |
||||
}); |
||||
service.defaults.headers.post["Content-Type"] = |
||||
"application/x-www-form-urlencoded"; |
||||
|
||||
// 请求拦截器
|
||||
service.interceptors.request.use( |
||||
(config) => { |
||||
// 登录流程控制中，根据本地是否存在token判断用户的登录情况
|
||||
// 但是即使token存在，也有可能token是过期的，所以在每次的请求头中携带token
|
||||
// 后台根据携带的token判断用户的登录情况，并返回给我们对应的状态码
|
||||
// 而后我们可以在响应拦截器中，根据状态码进行一些统一的操作。
|
||||
const token = localStorage.getItem("token"); |
||||
token && (config.headers.Authorization = token); |
||||
return config; |
||||
}, |
||||
(error) => { |
||||
// 处理请求错误
|
||||
return Promise.reject(error); |
||||
} |
||||
); |
||||
// 响应拦截器
|
||||
service.interceptors.response.use( |
||||
//请求成功
|
||||
(response) => { |
||||
const res = response.data; |
||||
if (res.code == 200) { |
||||
return Promise.reject(res); |
||||
} else { |
||||
return res; |
||||
} |
||||
}, |
||||
//请求失败
|
||||
(error) => { |
||||
const { response } = error; |
||||
if (response) { |
||||
// 请求已发出，但是不在30分钟的范围
|
||||
errorHandle(response.status, response.data.message); |
||||
return Promise.reject(response); |
||||
} else { |
||||
// 处理断网的情况
|
||||
// eg:请求超时或断网时，更新state的network状态
|
||||
// network状态在app.vue中控制着一个全局的断网提示组件的显示隐藏
|
||||
// 关于断网组件中的刷新重新获取数据，会在断网组件中说明
|
||||
// store.commit('changeNetwork', false);
|
||||
} |
||||
} |
||||
); |
||||
/** |
||||
* 请求失败后的错误统一处理 |
||||
* @param {Number} status 请求失败的状态码 |
||||
*/ |
||||
const errorHandle = (status) => { |
||||
// 状态码判断
|
||||
switch (status) { |
||||
// 401: 未登录状态，跳转登录页
|
||||
case 401: |
||||
toLogin(); |
||||
break; |
||||
// 403 token过期
|
||||
// 清除token并跳转登录页
|
||||
case 403: |
||||
localStorage.removeItem("token"); |
||||
message({ |
||||
message: "登录过期，请重新登录", |
||||
callback: (action) => { |
||||
console.log("action", action); |
||||
toLogin(); |
||||
}, |
||||
}); |
||||
break; |
||||
// 404请求不存在
|
||||
case 404: |
||||
tip("请求的资源不存在"); |
||||
break; |
||||
} |
||||
}; |
||||
export default service; |
||||
@ -0,0 +1,997 @@
|
||||
<template> |
||||
<div class="home"> |
||||
<top :activeIndex="activeIndexs"></top> |
||||
<div class="ban"> |
||||
<el-carousel height="500px" autoplay> |
||||
<el-carousel-item v-for="item in 4" :key="item"> |
||||
<h3>{{ item }}</h3> |
||||
</el-carousel-item> |
||||
</el-carousel> |
||||
</div> |
||||
<!-- 标识量 --> |
||||
<div class="technical flex_center"> |
||||
<div class="exponent max"> |
||||
<div class="imgs max"> |
||||
<img |
||||
class="logo3" |
||||
style="height: 90px" |
||||
src="@/assets/img/home/logo3.png" |
||||
/> |
||||
<div class="exponentTitle">平台服务指数</div> |
||||
<div class="more-box">更多数据 →</div> |
||||
</div> |
||||
</div> |
||||
<div class="enterprise flex_center"> |
||||
<div> |
||||
<img style="height: 36px" src="@/assets/img/home/zhishu1.png" /> |
||||
</div> |
||||
<div class="signboard"> |
||||
<div>61</div> |
||||
<div>企业节点注册量</div> |
||||
</div> |
||||
</div> |
||||
<div class="accumulated flex_center"> |
||||
<div> |
||||
<img style="height: 36px" src="@/assets/img/home/zhishu2.png" /> |
||||
</div> |
||||
<div class="signboard"> |
||||
<div>61</div> |
||||
<div>标识累计解析量</div> |
||||
</div> |
||||
</div> |
||||
<div class="register flex_center"> |
||||
<div> |
||||
<img style="height: 36px" src="@/assets/img/home/zhishu3.png" /> |
||||
</div> |
||||
<div class="signboard"> |
||||
<div>61</div> |
||||
<div>标识累计组成量</div> |
||||
</div> |
||||
</div> |
||||
</div> |
||||
<!-- saas --> |
||||
<div |
||||
class="box-style" |
||||
style=" |
||||
background: linear-gradient(0deg, #f5f8fe 0%, #ffffff 100%); |
||||
padding-top: 70px; |
||||
" |
||||
> |
||||
<div class="box-style-box"> |
||||
<headline heading="工业SaaS平台" footing="INDUSTRIALSAASPLAIFORM" /> |
||||
|
||||
<div class="detail"> |
||||
<div class="detail-box" v-for="(item, index) in saas" :key="index"> |
||||
<div class="contant"> |
||||
<div> |
||||
<img style="width: 55px" :src="item.img" alt="" /> |
||||
</div> |
||||
<div class="title1">{{ item.title1 }}</div> |
||||
<div class="title2">{{ item.title2 }}</div> |
||||
<div class="showplay"> |
||||
<div |
||||
v-for="(items, indexs) in item.arr" |
||||
:key="indexs" |
||||
class="showplayName" |
||||
> |
||||
<span>{{ items.names }}</span> |
||||
</div> |
||||
</div> |
||||
</div> |
||||
<div class="bottom"> |
||||
<el-image |
||||
:src="require('@/assets/img/home/dian.png')" |
||||
fit="fill" |
||||
></el-image> |
||||
</div> |
||||
</div> |
||||
<el-image |
||||
class="word" |
||||
:src="require('@/assets/img/home/word.png')" |
||||
fit="fill" |
||||
></el-image> |
||||
</div> |
||||
</div> |
||||
</div> |
||||
|
||||
<!-- 解决方案 --> |
||||
<div |
||||
class="box-style" |
||||
style=" |
||||
background: linear-gradient(0deg, #f5f8fe 0%, #ffffff 100%); |
||||
padding-top: 40px; |
||||
padding-bottom: 30px; |
||||
" |
||||
> |
||||
<div class="box-style-box"> |
||||
<headline heading="解决方案" footing="Solution" /> |
||||
<div class="solutabs"> |
||||
<el-menu |
||||
:default-active="solutabsIndex" |
||||
class="el-menu-demo" |
||||
mode="horizontal" |
||||
@select="handleSelect" |
||||
active-text-color="#3370FF" |
||||
> |
||||
<el-menu-item index="1" |
||||
>工业互联网标识解析企业节点一体化设备</el-menu-item |
||||
> |
||||
<el-menu-item index="2">规约管理边缘网关</el-menu-item> |
||||
<el-menu-item index="3" |
||||
>工业互联网标识解析二级节点建设服务</el-menu-item |
||||
> |
||||
<el-menu-item index="4">青鸟智能物联管控系统</el-menu-item> |
||||
</el-menu> |
||||
<div class="solutabscontent"> |
||||
<div class="left"> |
||||
<el-image |
||||
style="width: 100%; height: 400px" |
||||
:src="require('@/assets/img/home/content.png')" |
||||
></el-image> |
||||
</div> |
||||
<div class="right"> |
||||
<div class="right-content"> |
||||
<div class="top">工业互联网+区块链</div> |
||||
<div class="bottom" v-for="item in 3" :key="item"> |
||||
<div class="leftimg"> |
||||
<img |
||||
src="@/assets/img/home/computer.png" |
||||
style="width: 40px" |
||||
/> |
||||
</div> |
||||
<div class="soluright"> |
||||
<div>物联数据感知</div> |
||||
<div>以物联网智能监管终端为核心，通过物联网技术感...</div> |
||||
</div> |
||||
</div> |
||||
<div class="understand"> |
||||
<div>了解更多</div> |
||||
</div> |
||||
</div> |
||||
</div> |
||||
</div> |
||||
</div> |
||||
</div> |
||||
</div> |
||||
|
||||
<!-- 关于我们 --> |
||||
<div |
||||
class="box-style" |
||||
style=" |
||||
width: 100%; |
||||
height: 730px; |
||||
background: #2b2d3a; |
||||
padding-top: 60px; |
||||
position: relative; |
||||
" |
||||
> |
||||
<div class="box-style-box"> |
||||
<headline heading="关于我们" footing="About us" type="white" /> |
||||
<div class="usimg"> |
||||
<img src="@/assets/img/home/usimg.png" style="width: 100%" /> |
||||
</div> |
||||
<div class="usdetail"> |
||||
<div class="useleft"> |
||||
<div class="useleft-detail" v-for="item in 3" :key="item"> |
||||
<div class="usContent"> |
||||
<div class="top">国家工业互联网标识解析二级节点</div> |
||||
<div class="bottom"> |
||||
工业互联网标识解析体系类似互联网领域的域名解析系统（DNS）， |
||||
是全球工业互联网安全运行的核心基础设sssss施之一。 |
||||
</div> |
||||
</div> |
||||
<div class="usround-box"> |
||||
<div class="usround"> |
||||
<img |
||||
class="usround-img" |
||||
src="@/assets/img/home/us1.png" |
||||
alt="" |
||||
/> |
||||
</div> |
||||
</div> |
||||
</div> |
||||
</div> |
||||
<div class="usecenter"> |
||||
<img src="@/assets/img/home/outquan.png" style="width: 250px" /> |
||||
<div class="annular"> |
||||
<img |
||||
class="uselogo" |
||||
src="@/assets/img/home/logo2.png" |
||||
style="width: 130px" |
||||
/> |
||||
</div> |
||||
</div> |
||||
<div class="useright"> |
||||
<div class="useleft-detail" v-for="item in 3" :key="item"> |
||||
<div class="usround-box"> |
||||
<div class="usround"> |
||||
<img |
||||
class="usround-img" |
||||
src="@/assets/img/home/us1.png" |
||||
alt="" |
||||
/> |
||||
</div> |
||||
</div> |
||||
<div class="usContent"> |
||||
<div class="top">国家工业互联网标识解析二级节点</div> |
||||
<div class="bottom"> |
||||
工业互联网标识解析体系类似互联网领域的域名解析系统（DNS）， |
||||
是全球工业互联网安全运行的核心基础设施之一。 |
||||
</div> |
||||
</div> |
||||
</div> |
||||
</div> |
||||
</div> |
||||
</div> |
||||
</div> |
||||
<!-- 新闻中心 --> |
||||
<div |
||||
class="box-style" |
||||
style=" |
||||
width: 100%; |
||||
background: #e5eff9; |
||||
padding-top: 60px; |
||||
padding-bottom: 40px; |
||||
" |
||||
> |
||||
<div class="box-style-box"> |
||||
<headline heading="新闻中心" footing="News Center" /> |
||||
<div class="journalism"> |
||||
<div class="jo-left"> |
||||
<el-image |
||||
style="width: 100%; height: 400px" |
||||
:src="require('@/assets/img/home/content.png')" |
||||
fit="fill" |
||||
></el-image> |
||||
</div> |
||||
<div class="jo-right"> |
||||
<div class="jo-content" v-for="item in 3" :key="item"> |
||||
<div class="jo-img"> |
||||
<el-image |
||||
style="height: 100%; width: 100%" |
||||
:src="require('@/assets/img/home/content.png')" |
||||
fit="fill" |
||||
></el-image> |
||||
</div> |
||||
<div class="jo-detail"> |
||||
<div class="jo-title"> |
||||
热烈祝贺山东青鸟顺利通过国家“高新技术企业”认定 |
||||
</div> |
||||
<div class="jo-title-bottom"> |
||||
根据《高新技术企业认定管理办法》（国科发火〔2016〕32号） |
||||
和《高新技术企业认定管理工作指引》（国科发火〔2016〕... |
||||
</div> |
||||
</div> |
||||
</div> |
||||
</div> |
||||
</div> |
||||
</div> |
||||
</div> |
||||
|
||||
<!-- 合作客户 --> |
||||
<div |
||||
class="box-style" |
||||
style=" |
||||
width: 100%; |
||||
background: #fff; |
||||
padding-top: 60px; |
||||
padding-bottom: 40px; |
||||
" |
||||
> |
||||
<div class="box-style-box"> |
||||
<headline heading="合作客户" footing="Solution" /> |
||||
<div class="partner"> |
||||
<div class="partner-left"> |
||||
<div> |
||||
<img |
||||
style="width: 100%; height: 400px" |
||||
:src="require('@/assets/img/home/hb.png')" |
||||
/> |
||||
</div> |
||||
</div> |
||||
<div class="partner-right-box"> |
||||
<div class="partner-right" :style="{ top }"> |
||||
<div |
||||
class="par-company" |
||||
v-for="(item, index) in company" |
||||
:key="index" |
||||
> |
||||
<img :src="item.img" alt="" /> |
||||
</div> |
||||
</div> |
||||
</div> |
||||
</div> |
||||
</div> |
||||
</div> |
||||
<bottom /> |
||||
</div> |
||||
</template> |
||||
|
||||
<script> |
||||
import top from "@/components/header.vue"; |
||||
import bottom from "@/components/footer.vue"; |
||||
import headline from "@/components/headline.vue"; |
||||
export default { |
||||
name: "HomeView", |
||||
components: { |
||||
top, |
||||
bottom, |
||||
headline, |
||||
}, |
||||
data() { |
||||
return { |
||||
activeIndexs: 0, |
||||
solutabsIndex: "1", |
||||
saas: [ |
||||
{ |
||||
name: "1", |
||||
img: require("@/assets/img/home/d1.png"), |
||||
title1: "基于工业互联网标识解析的", |
||||
title2: "大数据核验平台", |
||||
arr: [ |
||||
{ |
||||
icon: "", |
||||
names: "权威授权", |
||||
}, |
||||
{ |
||||
icon: "", |
||||
names: "严格准入", |
||||
}, |
||||
{ |
||||
icon: "", |
||||
names: "精确查询", |
||||
}, |
||||
{ |
||||
icon: "", |
||||
names: "安全稳定", |
||||
}, |
||||
], |
||||
}, |
||||
{ |
||||
name: "2", |
||||
img: require("@/assets/img/home/d2.png"), |
||||
title1: "基于区块链+标识解析的", |
||||
title2: "授权通信存证平台", |
||||
arr: [ |
||||
{ |
||||
icon: "", |
||||
names: "星火链网", |
||||
}, |
||||
{ |
||||
icon: "", |
||||
names: "数据存证", |
||||
}, |
||||
{ |
||||
icon: "", |
||||
names: "标识赋码", |
||||
}, |
||||
{ |
||||
icon: "", |
||||
names: "行业监管", |
||||
}, |
||||
], |
||||
}, |
||||
{ |
||||
name: "3", |
||||
img: require("@/assets/img/home/d3.png"), |
||||
title1: "基于物联网sim卡的", |
||||
title2: "青鸟翼联平台", |
||||
arr: [ |
||||
{ |
||||
icon: "", |
||||
names: "接入便捷", |
||||
}, |
||||
{ |
||||
icon: "", |
||||
names: "产品全面", |
||||
}, |
||||
{ |
||||
icon: "", |
||||
names: "使用安全", |
||||
}, |
||||
{ |
||||
icon: "", |
||||
names: "数据统计", |
||||
}, |
||||
], |
||||
}, |
||||
{ |
||||
name: "4", |
||||
img: require("@/assets/img/home/d2.png"), |
||||
title1: "基于工业互联网标识解析的", |
||||
title2: "主动标识载体公共服务平台", |
||||
arr: [ |
||||
{ |
||||
icon: "", |
||||
names: "敏捷易用", |
||||
}, |
||||
{ |
||||
icon: "", |
||||
names: "完备高效", |
||||
}, |
||||
{ |
||||
icon: "", |
||||
names: "灵活开放", |
||||
}, |
||||
{ |
||||
icon: "", |
||||
names: "安全可靠", |
||||
}, |
||||
], |
||||
}, |
||||
], |
||||
|
||||
company: [ |
||||
{ |
||||
img: require("@/assets/img/home/jt1.png"), |
||||
}, |
||||
{ |
||||
img: require("@/assets/img/home/jt2.png"), |
||||
}, |
||||
{ |
||||
img: require("@/assets/img/home/jt3.png"), |
||||
}, |
||||
{ |
||||
img: require("@/assets/img/home/jt4.png"), |
||||
}, |
||||
{ |
||||
img: require("@/assets/img/home/jt1.png"), |
||||
}, |
||||
{ |
||||
img: require("@/assets/img/home/jt2.png"), |
||||
}, |
||||
{ |
||||
img: require("@/assets/img/home/jt3.png"), |
||||
}, |
||||
], |
||||
}; |
||||
}, |
||||
|
||||
methods: { |
||||
handleSelect(e) { |
||||
this.solutabsIndex = e; |
||||
}, |
||||
}, |
||||
}; |
||||
</script> |
||||
<style lang="less" scoped> |
||||
.ban { |
||||
.el-carousel__item h3 { |
||||
color: #475669; |
||||
font-size: 18px; |
||||
opacity: 0.75; |
||||
line-height: 300px; |
||||
margin: 0; |
||||
} |
||||
|
||||
.el-carousel__item:nth-child(2n) { |
||||
background-color: #99a9bf; |
||||
} |
||||
|
||||
.el-carousel__item:nth-child(2n + 1) { |
||||
background-color: #d3dce6; |
||||
} |
||||
} |
||||
//指数 |
||||
.technical { |
||||
height: 130px; |
||||
|
||||
text-align: center; |
||||
.exponent { |
||||
flex: 1.5; |
||||
width: 100%; |
||||
background: #3370ff; |
||||
.imgs { |
||||
width: 100%; |
||||
position: relative; |
||||
.logo3 { |
||||
position: absolute; |
||||
top: 50%; |
||||
right: 100px; |
||||
transform: translateY(-50%); |
||||
z-index: 9; |
||||
} |
||||
.exponentTitle { |
||||
font-size: 24px; |
||||
font-family: iFontszhounianti; |
||||
font-weight: 400; |
||||
font-style: italic; |
||||
color: #ffffff; |
||||
position: absolute; |
||||
top: 25%; |
||||
right: 80px; |
||||
} |
||||
.more-box { |
||||
position: absolute; |
||||
top: 63%; |
||||
right: 80px; |
||||
transform: translateY(-50%); |
||||
width: 90px; |
||||
height: 22px; |
||||
background: #3370ff; |
||||
border: 1px solid #ffffff; |
||||
|
||||
font-size: 10px; |
||||
font-family: PingFang SC; |
||||
font-weight: 400; |
||||
color: #ffffff; |
||||
line-height: 22px; |
||||
} |
||||
} |
||||
} |
||||
.enterprise { |
||||
flex: 1; |
||||
height: 130px; |
||||
background: #25292e; |
||||
position: relative; |
||||
} |
||||
.enterprise::after { |
||||
content: ""; |
||||
display: inline-block; |
||||
width: 2px; |
||||
height: 70px; |
||||
background-color: #fff; |
||||
position: absolute; |
||||
right: 0; |
||||
top: 50%; |
||||
transform: translateY(-50%); |
||||
} |
||||
.accumulated { |
||||
flex: 1; |
||||
height: 130px; |
||||
background: #25292e; |
||||
position: relative; |
||||
} |
||||
.accumulated::after { |
||||
content: ""; |
||||
display: inline-block; |
||||
width: 2px; |
||||
height: 70px; |
||||
background-color: #fff; |
||||
position: absolute; |
||||
right: 0; |
||||
top: 50%; |
||||
transform: translateY(-50%); |
||||
} |
||||
.register { |
||||
flex: 1.5; |
||||
height: 130px; |
||||
background: #25292e; |
||||
} |
||||
.signboard { |
||||
color: #fff; |
||||
padding-left: 20px; |
||||
} |
||||
.signboard > div:nth-child(1) { |
||||
font-weight: bolder; |
||||
text-align: left; |
||||
font-size: 44px; |
||||
font-family: xiaowei; |
||||
font-weight: 400; |
||||
color: #ffffff; |
||||
} |
||||
.signboard > div:nth-child(2) { |
||||
font-size: 16px; |
||||
font-family: PingFang SC; |
||||
font-weight: 400; |
||||
color: #ffffff; |
||||
} |
||||
} |
||||
//详情 |
||||
.box-style { |
||||
width: 100%; |
||||
|
||||
.box-style-box { |
||||
width: 100%; |
||||
|
||||
// 工业SaaS平台 |
||||
.detail { |
||||
width: 70%; |
||||
margin: 0px auto; |
||||
padding-bottom: 80px; |
||||
display: flex; |
||||
z-index: 2; |
||||
justify-content: space-between; |
||||
position: relative; |
||||
& .detail-box:nth-child(2) { |
||||
margin-top: 130px; |
||||
} |
||||
& .detail-box:nth-child(3) { |
||||
margin-top: 130px; |
||||
} |
||||
|
||||
& .detail-box:nth-child(1) { |
||||
margin-top: 40px; |
||||
} |
||||
& .detail-box:nth-child(4) { |
||||
margin-top: 40px; |
||||
} |
||||
.detail-box { |
||||
width: 20%; |
||||
.contant { |
||||
width: 100%; |
||||
padding: 40px 20px 20px 20px; |
||||
background: linear-gradient(0deg, #ffffff 0%, #eaf3ff 100%); |
||||
box-shadow: 0px 9px 8px 0px rgba(2, 82, 217, 0.1); |
||||
border-radius: 16px; |
||||
.title1 { |
||||
padding-top: 30px; |
||||
font-size: 12px; |
||||
font-family: PingFang SC; |
||||
font-weight: 400; |
||||
color: #666; |
||||
} |
||||
.title2 { |
||||
font-size: 16px; |
||||
padding-top: 5px; |
||||
font-family: PingFang SC; |
||||
font-weight: 400; |
||||
color: #333333; |
||||
} |
||||
.showplay { |
||||
font-size: 12px; |
||||
padding-top: 20px; |
||||
font-family: PingFang SC; |
||||
font-weight: 400; |
||||
color: #666; |
||||
.showplayName { |
||||
padding-bottom: 10%; |
||||
} |
||||
} |
||||
} |
||||
.bottom { |
||||
text-align: center; |
||||
.line-dian { |
||||
height: 53px; |
||||
} |
||||
} |
||||
} |
||||
|
||||
.word { |
||||
width: 100%; |
||||
height: 80%; |
||||
position: absolute; |
||||
bottom: 0; |
||||
z-index: -1; |
||||
} |
||||
} |
||||
|
||||
// 解决方案 |
||||
.solutabs { |
||||
width: 70%; |
||||
margin: 0px auto; |
||||
.el-menu-demo { |
||||
display: flex; |
||||
justify-content: space-between; |
||||
} |
||||
.solutabscontent { |
||||
margin-top: 20px; |
||||
display: flex; |
||||
width: 100%; |
||||
|
||||
.left { |
||||
width: 60%; |
||||
} |
||||
.right { |
||||
width: 40%; |
||||
.right-content { |
||||
width: 100%; |
||||
padding: 30px 0 0 20%; |
||||
.top { |
||||
font-size: 24px; |
||||
font-family: PingFang SC; |
||||
font-weight: 600; |
||||
color: #333333; |
||||
} |
||||
.bottom { |
||||
width: 100%; |
||||
margin-top: 20px; |
||||
display: flex; |
||||
.leftimg { |
||||
margin-top: 8px; |
||||
} |
||||
.soluright { |
||||
padding-left: 10px; |
||||
& > div:nth-child(1) { |
||||
font-size: 18px; |
||||
font-family: PingFang SC; |
||||
font-weight: 600; |
||||
color: #333333; |
||||
line-height: 32px; |
||||
} |
||||
& > div:nth-child(2) { |
||||
font-size: 15px; |
||||
font-family: PingFang SC; |
||||
font-weight: 600; |
||||
color: #6a7890; |
||||
line-height: 32px; |
||||
white-space: nowrap; |
||||
text-overflow: ellipsis; |
||||
overflow: hidden; |
||||
} |
||||
} |
||||
} |
||||
|
||||
.understand { |
||||
margin-top: 30px; |
||||
width: 120px; |
||||
height: 32px; |
||||
background: #3370ff; |
||||
box-shadow: 0px 0px 16px 0px rgba(56, 109, 253, 0.1); |
||||
border-radius: 20px; |
||||
font-size: 14px; |
||||
font-family: PingFang SC; |
||||
font-weight: 400; |
||||
color: #ffffff; |
||||
text-align: center; |
||||
display: flex; |
||||
align-items: center; |
||||
justify-content: center; |
||||
div { |
||||
width: 110px; |
||||
height: 29px; |
||||
border: 1px solid #ffffff; |
||||
box-shadow: 0px 0px 16px 0px rgba(56, 109, 253, 0.6); |
||||
opacity: 0.6; |
||||
border-radius: 16px; |
||||
line-height: 25px; |
||||
} |
||||
} |
||||
} |
||||
} |
||||
} |
||||
} |
||||
//关于我们 |
||||
.usimg { |
||||
width: 100%; |
||||
position: absolute; |
||||
bottom: 0; |
||||
} |
||||
.usdetail { |
||||
width: 100%; |
||||
display: flex; |
||||
justify-content: center; |
||||
.usecenter { |
||||
margin-top: 100px; |
||||
margin-bottom: 100px; |
||||
position: relative; |
||||
flex: 1; |
||||
display: flex; |
||||
justify-content: center; |
||||
.annular { |
||||
width: 170px; |
||||
height: 170px; |
||||
background: #434c5f; |
||||
border-radius: 50%; |
||||
position: absolute; |
||||
top: 50%; |
||||
left: 50%; |
||||
transform: translate(-50%, -50%); |
||||
.uselogo { |
||||
position: absolute; |
||||
top: 50%; |
||||
left: 50%; |
||||
transform: translate(-50%, -50%); |
||||
} |
||||
} |
||||
} |
||||
|
||||
.useleft { |
||||
display: flex; |
||||
flex-direction: column; |
||||
align-items: end; |
||||
flex: 2; |
||||
text-align: right; |
||||
& > .useleft-detail:nth-child(2) { |
||||
margin-right: 60px; |
||||
} |
||||
.useleft-detail { |
||||
flex: 1; |
||||
display: flex; |
||||
align-items: center; |
||||
.usround-box { |
||||
width: 10%; |
||||
.usround { |
||||
width: 50px; |
||||
height: 50px; |
||||
background: #323443; |
||||
border: 2px solid #434c5f; |
||||
border-radius: 50%; |
||||
display: flex; |
||||
align-items: center; |
||||
justify-content: center; |
||||
.usround-img { |
||||
width: 35px; |
||||
height: 35px; |
||||
} |
||||
} |
||||
} |
||||
|
||||
.usContent { |
||||
.top { |
||||
font-size: 13rpx; |
||||
font-family: PingFang SC; |
||||
font-weight: 600; |
||||
color: #ffffff; |
||||
padding-right: 15px; |
||||
} |
||||
.bottom { |
||||
width: 350px; |
||||
font-size: 12px; |
||||
font-family: PingFang SC; |
||||
font-weight: 400; |
||||
color: #c5c5c5; |
||||
line-height: 26px; |
||||
padding-right: 20px; |
||||
padding-top: 5px; |
||||
display: -webkit-box; |
||||
-webkit-line-clamp: 2; |
||||
-webkit-box-orient: vertical; |
||||
overflow: hidden; |
||||
} |
||||
} |
||||
} |
||||
} |
||||
.useright { |
||||
display: flex; |
||||
flex-direction: column; |
||||
align-items: start; |
||||
flex: 2; |
||||
text-align: left; |
||||
|
||||
& > .useleft-detail:nth-child(2) { |
||||
margin-left: 60px; |
||||
} |
||||
.useleft-detail { |
||||
flex: 1; |
||||
display: flex; |
||||
align-items: center; |
||||
.usround-box { |
||||
width: 10%; |
||||
.usround { |
||||
width: 50px; |
||||
height: 50px; |
||||
background: #323443; |
||||
border: 2px solid #434c5f; |
||||
border-radius: 50%; |
||||
display: flex; |
||||
align-items: center; |
||||
justify-content: center; |
||||
.usround-img { |
||||
width: 35px; |
||||
height: 35px; |
||||
} |
||||
} |
||||
} |
||||
|
||||
.usContent { |
||||
.top { |
||||
font-size: 13rpx; |
||||
font-family: PingFang SC; |
||||
font-weight: 600; |
||||
color: #ffffff; |
||||
padding-left: 20px; |
||||
} |
||||
.bottom { |
||||
width: 350px; |
||||
font-size: 12px; |
||||
font-family: PingFang SC; |
||||
font-weight: 400; |
||||
color: #c5c5c5; |
||||
line-height: 26px; |
||||
padding-left: 25px; |
||||
padding-top: 5px; |
||||
display: -webkit-box; |
||||
-webkit-line-clamp: 2; |
||||
-webkit-box-orient: vertical; |
||||
overflow: hidden; |
||||
} |
||||
} |
||||
} |
||||
} |
||||
} |
||||
|
||||
// 新闻中心 |
||||
.journalism { |
||||
width: 80%; |
||||
margin: 0 auto; |
||||
padding-top: 30px; |
||||
display: flex; |
||||
justify-content: space-between; |
||||
.jo-left { |
||||
width: 50%; |
||||
height: 100%; |
||||
} |
||||
|
||||
.jo-right { |
||||
width: 48%; |
||||
height: 100%; |
||||
display: flex; |
||||
flex-direction: column; |
||||
align-items: center; |
||||
|
||||
.jo-content { |
||||
width: 100%; |
||||
height: 120px; |
||||
display: flex; |
||||
flex: 1; |
||||
align-items: center; |
||||
margin-bottom: 18px; |
||||
.jo-img { |
||||
width: 30%; |
||||
height: 120px; |
||||
} |
||||
.jo-detail { |
||||
width: 70%; |
||||
height: 120px; |
||||
background: #fff; |
||||
padding: 20px 30px; |
||||
.jo-title { |
||||
font-size: 14px; |
||||
font-family: PingFang SC; |
||||
font-weight: 500; |
||||
color: #333333; |
||||
line-height: 24px; |
||||
white-space: nowrap; |
||||
text-overflow: ellipsis; |
||||
overflow: hidden; |
||||
} |
||||
.jo-title-bottom { |
||||
font-size: 11px; |
||||
font-family: PingFang SC; |
||||
font-weight: 400; |
||||
color: #333333; |
||||
line-height: 26px; |
||||
padding-top: 10px; |
||||
display: -webkit-box; |
||||
-webkit-line-clamp: 2; |
||||
-webkit-box-orient: vertical; |
||||
overflow: hidden; |
||||
} |
||||
} |
||||
} |
||||
} |
||||
} |
||||
|
||||
//合作伙伴 |
||||
.partner { |
||||
width: 80%; |
||||
margin: 0 auto; |
||||
padding-top: 30px; |
||||
display: flex; |
||||
justify-content: space-between; |
||||
.partner-left { |
||||
width: 65%; |
||||
} |
||||
.partner-right-box { |
||||
width: 35%; |
||||
height: 300px; |
||||
overflow: auto; |
||||
|
||||
.partner-right { |
||||
display: flex; |
||||
flex-direction: column; |
||||
align-items: end; |
||||
|
||||
.par-company { |
||||
width: 240px; |
||||
height: 80px; |
||||
border: 1px solid #d7dbf0; |
||||
|
||||
background: #ffffff; |
||||
box-shadow: 0px 0px 12px 0px rgba(44, 62, 148, 0.15); |
||||
|
||||
display: flex; |
||||
justify-content: center; |
||||
align-items: center; |
||||
img { |
||||
width: 100px; |
||||
height: 30px; |
||||
} |
||||
} |
||||
} |
||||
} |
||||
} |
||||
} |
||||
} |
||||
</style> |
||||
@ -0,0 +1,20 @@
|
||||
module.exports = { |
||||
transpileDependencies: true, |
||||
publicPath: "/", |
||||
outputDir: "dist", |
||||
assetsDir: "static", |
||||
devServer: { |
||||
proxy: { |
||||
"/fsms-library": { |
||||
target: "https://zhinengku.zhixunanquan.com/fsms-library", |
||||
// target: "http://192.168.0.101:8104/fsms-library",
|
||||
changeOrigin: true, |
||||
secure: false, |
||||
// 路径重写
|
||||
pathRewrite: { |
||||
"^/fsms-library": "", |
||||
}, |
||||
} |
||||
}, |
||||
}, |
||||
}; |
||||
Loading…
Reference in new issue