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