Merge pull request '红山开源新版首页' (#319) from tongChong/forgeplus-react:feature_jk_homepage into pre_dev_military
This commit is contained in:
commit
7ee151e652
|
|
@ -261,16 +261,15 @@
|
|||
"version": "0.13.9",
|
||||
"resolved": "https://registry.npmjs.org/regenerator-runtime/-/regenerator-runtime-0.13.9.tgz",
|
||||
"integrity": "sha512-p3VT+cOEgxFsRRA9X4lkI1E+k2/CtnKtU4gcxyaCUreilL/vqI6CdZ3wxVUx3UOUg+gnUOQQcRI7BmSI656MYA=="
|
||||
<<<<<<< HEAD
|
||||
}
|
||||
}
|
||||
},
|
||||
"@babel/runtime-corejs3": {
|
||||
"version": "7.15.3",
|
||||
"resolved": "https://registry.npmjs.org/@babel/runtime-corejs3/-/runtime-corejs3-7.15.3.tgz",
|
||||
"integrity": "sha512-30A3lP+sRL6ml8uhoJSs+8jwpKzbw8CqBvDc1laeptxPm5FahumJxirigcbD2qTs71Sonvj1cyZB0OKGAmxQ+A==",
|
||||
"version": "7.16.0",
|
||||
"resolved": "https://registry.npmjs.org/@babel/runtime-corejs3/-/runtime-corejs3-7.16.0.tgz",
|
||||
"integrity": "sha512-Oi2qwQ21X7/d9gn3WiwkDTJmq3TQtYNz89lRnoFy8VeZpWlsyXvzSwiRrRZ8cXluvSwqKxqHJ6dBd9Rv+p0ZGQ==",
|
||||
"requires": {
|
||||
"core-js-pure": "^3.16.0",
|
||||
"core-js-pure": "^3.19.0",
|
||||
"regenerator-runtime": "^0.13.4"
|
||||
},
|
||||
"dependencies": {
|
||||
|
|
@ -278,8 +277,6 @@
|
|||
"version": "0.13.9",
|
||||
"resolved": "https://registry.npmjs.org/regenerator-runtime/-/regenerator-runtime-0.13.9.tgz",
|
||||
"integrity": "sha512-p3VT+cOEgxFsRRA9X4lkI1E+k2/CtnKtU4gcxyaCUreilL/vqI6CdZ3wxVUx3UOUg+gnUOQQcRI7BmSI656MYA=="
|
||||
=======
|
||||
>>>>>>> 01f71bca87fac88ba9ad56c16260521c47f4ca6c
|
||||
}
|
||||
}
|
||||
},
|
||||
|
|
@ -1083,6 +1080,18 @@
|
|||
"react-lifecycles-compat": "^3.0.4",
|
||||
"warning": "^4.0.3"
|
||||
}
|
||||
},
|
||||
"react-slick": {
|
||||
"version": "0.25.2",
|
||||
"resolved": "https://registry.npmjs.org/react-slick/-/react-slick-0.25.2.tgz",
|
||||
"integrity": "sha512-8MNH/NFX/R7zF6W/w+FS5VXNyDusF+XDW1OU0SzODEU7wqYB+ZTGAiNJ++zVNAVqCAHdyCybScaUB+FCZOmBBw==",
|
||||
"requires": {
|
||||
"classnames": "^2.2.5",
|
||||
"enquire.js": "^2.1.6",
|
||||
"json2mq": "^0.2.0",
|
||||
"lodash.debounce": "^4.0.8",
|
||||
"resize-observer-polyfill": "^1.5.0"
|
||||
}
|
||||
}
|
||||
}
|
||||
},
|
||||
|
|
@ -3939,14 +3948,11 @@
|
|||
"version": "2.6.12",
|
||||
"resolved": "https://registry.npmjs.org/core-js/-/core-js-2.6.12.tgz",
|
||||
"integrity": "sha512-Kb2wC0fvsWfQrgk8HU5lW6U/Lcs8+9aaYcy4ZFc6DDlo4nZ7n70dEgE5rtR0oG6ufKDUnrwfWL1mXR5ljDatrQ=="
|
||||
<<<<<<< HEAD
|
||||
},
|
||||
"core-js-pure": {
|
||||
"version": "3.16.4",
|
||||
"resolved": "https://registry.npmjs.org/core-js-pure/-/core-js-pure-3.16.4.tgz",
|
||||
"integrity": "sha512-bY1K3/1Jy9D8Jd12eoeVahNXHLfHFb4TXWI8SQ4y8bImR9qDPmGITBAfmcffTkgUvbJn87r8dILOTWW5kZzkgA=="
|
||||
=======
|
||||
>>>>>>> 01f71bca87fac88ba9ad56c16260521c47f4ca6c
|
||||
"version": "3.19.1",
|
||||
"resolved": "https://registry.npmjs.org/core-js-pure/-/core-js-pure-3.19.1.tgz",
|
||||
"integrity": "sha512-Q0Knr8Es84vtv62ei6/6jXH/7izKmOrtrxH9WJTHLCMAVeU+8TF8z8Nr08CsH4Ot0oJKzBzJJL9SJBYIv7WlfQ=="
|
||||
},
|
||||
"core-util-is": {
|
||||
"version": "1.0.2",
|
||||
|
|
@ -3967,6 +3973,11 @@
|
|||
"require-from-string": "^1.1.0"
|
||||
}
|
||||
},
|
||||
"countup.js": {
|
||||
"version": "2.0.8",
|
||||
"resolved": "https://registry.npmjs.org/countup.js/-/countup.js-2.0.8.tgz",
|
||||
"integrity": "sha512-pW3xwwD+hB+xmtI16xFcuLS0D5hSQqPQWkZOdgpKQyzxCquDNo2VCFPkRw12vmvdpnicXVTcjmYiakG6biwINg=="
|
||||
},
|
||||
"create-ecdh": {
|
||||
"version": "4.0.4",
|
||||
"resolved": "https://registry.npmjs.org/create-ecdh/-/create-ecdh-4.0.4.tgz",
|
||||
|
|
@ -4029,7 +4040,6 @@
|
|||
"object-assign": "^4.1.1"
|
||||
}
|
||||
},
|
||||
<<<<<<< HEAD
|
||||
"cross-env": {
|
||||
"version": "7.0.3",
|
||||
"resolved": "https://registry.npmjs.org/cross-env/-/cross-env-7.0.3.tgz",
|
||||
|
|
@ -4082,8 +4092,6 @@
|
|||
}
|
||||
}
|
||||
},
|
||||
=======
|
||||
>>>>>>> 01f71bca87fac88ba9ad56c16260521c47f4ca6c
|
||||
"cross-spawn": {
|
||||
"version": "5.1.0",
|
||||
"resolved": "https://registry.npmjs.org/cross-spawn/-/cross-spawn-5.1.0.tgz",
|
||||
|
|
@ -14663,6 +14671,14 @@
|
|||
"object-assign": "^4.1.1"
|
||||
}
|
||||
},
|
||||
"react-countup": {
|
||||
"version": "6.1.0",
|
||||
"resolved": "https://registry.npmjs.org/react-countup/-/react-countup-6.1.0.tgz",
|
||||
"integrity": "sha512-0tN65l4ksaNa4rm8ZKshpGxbIHQ4RAh8TGaKYp06EZ7nZw+haXpW3dQTVDhTey9+10jDkJgdzyXKDmC96c1M8g==",
|
||||
"requires": {
|
||||
"countup.js": "^2.0.8"
|
||||
}
|
||||
},
|
||||
"react-datepicker": {
|
||||
"version": "2.16.0",
|
||||
"resolved": "https://registry.npmjs.org/react-datepicker/-/react-datepicker-2.16.0.tgz",
|
||||
|
|
@ -15147,9 +15163,9 @@
|
|||
}
|
||||
},
|
||||
"react-slick": {
|
||||
"version": "0.25.2",
|
||||
"resolved": "https://registry.npmjs.org/react-slick/-/react-slick-0.25.2.tgz",
|
||||
"integrity": "sha512-8MNH/NFX/R7zF6W/w+FS5VXNyDusF+XDW1OU0SzODEU7wqYB+ZTGAiNJ++zVNAVqCAHdyCybScaUB+FCZOmBBw==",
|
||||
"version": "0.28.1",
|
||||
"resolved": "https://registry.npmjs.org/react-slick/-/react-slick-0.28.1.tgz",
|
||||
"integrity": "sha512-JwRQXoWGJRbUTE7eZI1rGIHaXX/4YuwX6gn7ulfvUZ4vFDVQAA25HcsHSYaUiRCduTr6rskyIuyPMpuG6bbluw==",
|
||||
"requires": {
|
||||
"classnames": "^2.2.5",
|
||||
"enquire.js": "^2.1.6",
|
||||
|
|
@ -16311,7 +16327,6 @@
|
|||
"version": "3.1.0",
|
||||
"resolved": "https://registry.npmjs.org/string-width/-/string-width-3.1.0.tgz",
|
||||
"integrity": "sha512-vafcv6KjVZKSgz06oM/H6GDBrAtz8vdhQakGjFIvNrHA6y3HCF1CInLy+QLq8dTJPQ1b+KDUqDFctkdRW44e1w==",
|
||||
<<<<<<< HEAD
|
||||
"dev": true,
|
||||
"requires": {
|
||||
"emoji-regex": "^7.0.1",
|
||||
|
|
@ -16340,36 +16355,6 @@
|
|||
"integrity": "sha512-QC1/iN/2/RPVJ5jYK8BGttj5z83LmSKmvbvrXPNCLZSEb32KKVDJDl/MOt2N01qU2H/FkzEa9PKto1BqDjtd7Q==",
|
||||
"dev": true,
|
||||
"requires": {
|
||||
=======
|
||||
"dev": true,
|
||||
"requires": {
|
||||
"emoji-regex": "^7.0.1",
|
||||
"is-fullwidth-code-point": "^2.0.0",
|
||||
"strip-ansi": "^5.1.0"
|
||||
}
|
||||
},
|
||||
"strip-ansi": {
|
||||
"version": "5.2.0",
|
||||
"resolved": "https://registry.npmjs.org/strip-ansi/-/strip-ansi-5.2.0.tgz",
|
||||
"integrity": "sha512-DuRs1gKbBqsMKIZlrffwlug8MHkcnpjs5VPmL1PAh+mA30U0DTotfDZ0d2UUsXpPmPmMMJ6W773MaA3J+lbiWA==",
|
||||
"dev": true,
|
||||
"requires": {
|
||||
"ansi-regex": "^4.1.0"
|
||||
}
|
||||
},
|
||||
"which-module": {
|
||||
"version": "2.0.0",
|
||||
"resolved": "https://registry.npmjs.org/which-module/-/which-module-2.0.0.tgz",
|
||||
"integrity": "sha1-2e8H3Od7mQK4o6j6SzHD4/fm6Ho=",
|
||||
"dev": true
|
||||
},
|
||||
"wrap-ansi": {
|
||||
"version": "5.1.0",
|
||||
"resolved": "https://registry.npmjs.org/wrap-ansi/-/wrap-ansi-5.1.0.tgz",
|
||||
"integrity": "sha512-QC1/iN/2/RPVJ5jYK8BGttj5z83LmSKmvbvrXPNCLZSEb32KKVDJDl/MOt2N01qU2H/FkzEa9PKto1BqDjtd7Q==",
|
||||
"dev": true,
|
||||
"requires": {
|
||||
>>>>>>> 01f71bca87fac88ba9ad56c16260521c47f4ca6c
|
||||
"ansi-styles": "^3.2.0",
|
||||
"string-width": "^3.0.0",
|
||||
"strip-ansi": "^5.0.0"
|
||||
|
|
@ -17108,6 +17093,11 @@
|
|||
"is-fullwidth-code-point": "^2.0.0"
|
||||
}
|
||||
},
|
||||
"slick-carousel": {
|
||||
"version": "1.8.1",
|
||||
"resolved": "https://registry.npmjs.org/slick-carousel/-/slick-carousel-1.8.1.tgz",
|
||||
"integrity": "sha512-XB9Ftrf2EEKfzoQXt3Nitrt/IPbT+f1fgqBdoxO3W/+JYvtEOW6EgxnWfr9GH6nmULv7Y2tPmEX3koxThVmebA=="
|
||||
},
|
||||
"snapdragon": {
|
||||
"version": "0.8.2",
|
||||
"resolved": "https://registry.npmjs.org/snapdragon/-/snapdragon-0.8.2.tgz",
|
||||
|
|
@ -19245,22 +19235,15 @@
|
|||
"version": "2.1.1",
|
||||
"resolved": "https://registry.npmjs.org/is-extglob/-/is-extglob-2.1.1.tgz",
|
||||
"integrity": "sha1-qIwCU1eR8C7TfHahueqXc8gz+MI=",
|
||||
<<<<<<< HEAD
|
||||
"dev": true,
|
||||
"optional": true
|
||||
=======
|
||||
"dev": true
|
||||
>>>>>>> 01f71bca87fac88ba9ad56c16260521c47f4ca6c
|
||||
},
|
||||
"is-glob": {
|
||||
"version": "4.0.1",
|
||||
"resolved": "https://registry.npmjs.org/is-glob/-/is-glob-4.0.1.tgz",
|
||||
"integrity": "sha512-5G0tKtBTFImOqDnLB2hG6Bp2qcKEFduo4tZu9MT/H6NQv/ghhy30o55ufafxJ/LdH79LLs2Kfrn85TLKyA7BUg==",
|
||||
"dev": true,
|
||||
<<<<<<< HEAD
|
||||
"optional": true,
|
||||
=======
|
||||
>>>>>>> 01f71bca87fac88ba9ad56c16260521c47f4ca6c
|
||||
"requires": {
|
||||
"is-extglob": "^2.1.1"
|
||||
}
|
||||
|
|
|
|||
|
|
@ -80,6 +80,7 @@
|
|||
"react-color": "^2.18.0",
|
||||
"react-content-loader": "^3.1.1",
|
||||
"react-cookies": "^0.1.1",
|
||||
"react-countup": "^6.1.0",
|
||||
"react-datepicker": "^2.14.1",
|
||||
"react-dev-utils": "^9.2.0-next.80",
|
||||
"react-dom": "^16.13.1",
|
||||
|
|
@ -92,6 +93,7 @@
|
|||
"react-resizable": "^1.10.1",
|
||||
"react-router": "^4.2.0",
|
||||
"react-router-dom": "^4.2.2",
|
||||
"react-slick": "^0.28.1",
|
||||
"react-split-pane": "^0.1.91",
|
||||
"react-url-query": "^1.5.0",
|
||||
"react-zmage": "^0.8.5-beta.31",
|
||||
|
|
@ -102,6 +104,7 @@
|
|||
"scroll-into-view": "^1.14.2",
|
||||
"showdown": "^1.9.1",
|
||||
"showdown-katex": "^0.8.0",
|
||||
"slick-carousel": "^1.8.1",
|
||||
"store": "^2.0.12",
|
||||
"style-loader": "0.19.0",
|
||||
"styled-components": "^4.4.1",
|
||||
|
|
|
|||
|
|
@ -1,8 +1,8 @@
|
|||
@font-face {
|
||||
font-family: "iconfont"; /* Project id 2340181 */
|
||||
src: url('iconfont.woff2?t=1629767316093') format('woff2'),
|
||||
url('iconfont.woff?t=1629767316093') format('woff'),
|
||||
url('iconfont.ttf?t=1629767316093') format('truetype');
|
||||
src: url('iconfont.woff2?t=1637120496912') format('woff2'),
|
||||
url('iconfont.woff?t=1637120496912') format('woff'),
|
||||
url('iconfont.ttf?t=1637120496912') format('truetype');
|
||||
}
|
||||
|
||||
.iconfont {
|
||||
|
|
@ -13,6 +13,254 @@
|
|||
-moz-osx-font-smoothing: grayscale;
|
||||
}
|
||||
|
||||
.icon-zhishitupu:before {
|
||||
content: "\e8fc";
|
||||
}
|
||||
|
||||
.icon-jisuanji1:before {
|
||||
content: "\e8fd";
|
||||
}
|
||||
|
||||
.icon-dianzi1:before {
|
||||
content: "\e8ff";
|
||||
}
|
||||
|
||||
.icon-junshililun1:before {
|
||||
content: "\e900";
|
||||
}
|
||||
|
||||
.icon-ruanjiangongcheng1:before {
|
||||
content: "\e901";
|
||||
}
|
||||
|
||||
.icon-yixue1:before {
|
||||
content: "\e902";
|
||||
}
|
||||
|
||||
.icon-tongxin1:before {
|
||||
content: "\e904";
|
||||
}
|
||||
|
||||
.icon-zhengcefagui1:before {
|
||||
content: "\e906";
|
||||
}
|
||||
|
||||
.icon-dashuju:before {
|
||||
content: "\e8f3";
|
||||
}
|
||||
|
||||
.icon-rengongzhineng:before {
|
||||
content: "\e8f6";
|
||||
}
|
||||
|
||||
.icon-a-shuangyinhao12x:before {
|
||||
content: "\e8f2";
|
||||
}
|
||||
|
||||
.icon-dingbu:before {
|
||||
content: "\e8ee";
|
||||
}
|
||||
|
||||
.icon-bangzhu1:before {
|
||||
content: "\e8ef";
|
||||
}
|
||||
|
||||
.icon-yijianfankui2:before {
|
||||
content: "\e8f0";
|
||||
}
|
||||
|
||||
.icon-fenxiang:before {
|
||||
content: "\e8f1";
|
||||
}
|
||||
|
||||
.icon-dizhi:before {
|
||||
content: "\e8eb";
|
||||
}
|
||||
|
||||
.icon-youxiang1:before {
|
||||
content: "\e8ec";
|
||||
}
|
||||
|
||||
.icon-dianhuaicon:before {
|
||||
content: "\e8ed";
|
||||
}
|
||||
|
||||
.icon-tianjiaicon:before {
|
||||
content: "\e8e8";
|
||||
}
|
||||
|
||||
.icon-lingshengicon:before {
|
||||
content: "\e8ea";
|
||||
}
|
||||
|
||||
.icon-gengduoicon:before {
|
||||
content: "\e8e5";
|
||||
}
|
||||
|
||||
.icon-shijianicon:before {
|
||||
content: "\e8e7";
|
||||
}
|
||||
|
||||
.icon-mimaicon:before {
|
||||
content: "\e8e1";
|
||||
}
|
||||
|
||||
.icon-gouicon:before {
|
||||
content: "\e8e2";
|
||||
}
|
||||
|
||||
.icon-zhankaiicon:before {
|
||||
content: "\e8e3";
|
||||
}
|
||||
|
||||
.icon-wenjian7:before {
|
||||
content: "\e8e0";
|
||||
}
|
||||
|
||||
.icon-xiangyoujiantou:before {
|
||||
content: "\e8de";
|
||||
}
|
||||
|
||||
.icon-xiangzuojiantou:before {
|
||||
content: "\e8df";
|
||||
}
|
||||
|
||||
.icon-a-liulanicon2x:before {
|
||||
content: "\e8dd";
|
||||
}
|
||||
|
||||
.icon-wenjianicon:before {
|
||||
content: "\e8dc";
|
||||
}
|
||||
|
||||
.icon-a-yuanquan2x:before {
|
||||
content: "\e8db";
|
||||
}
|
||||
|
||||
.icon-xiangmubiaoqian:before {
|
||||
content: "\e8da";
|
||||
}
|
||||
|
||||
.icon-icon:before {
|
||||
content: "\e8ce";
|
||||
}
|
||||
|
||||
.icon-tar:before {
|
||||
content: "\e8cf";
|
||||
}
|
||||
|
||||
.icon-a-fuzhi2:before {
|
||||
content: "\e8d0";
|
||||
}
|
||||
|
||||
.icon-fujian1:before {
|
||||
content: "\e8d1";
|
||||
}
|
||||
|
||||
.icon-a-bianji1:before {
|
||||
content: "\e8d2";
|
||||
}
|
||||
|
||||
.icon-banbenicon:before {
|
||||
content: "\e8d3";
|
||||
}
|
||||
|
||||
.icon-shanchuicon2:before {
|
||||
content: "\e8d4";
|
||||
}
|
||||
|
||||
.icon-a-lajitong_icon3x:before {
|
||||
content: "\e8d5";
|
||||
}
|
||||
|
||||
.icon-xialaanniu2:before {
|
||||
content: "\e8d6";
|
||||
}
|
||||
|
||||
.icon-xiazai-icon:before {
|
||||
content: "\e8d7";
|
||||
}
|
||||
|
||||
.icon-master_icon1:before {
|
||||
content: "\e8d8";
|
||||
}
|
||||
|
||||
.icon-shangchuanicon:before {
|
||||
content: "\e8d9";
|
||||
}
|
||||
|
||||
.icon-gerenziliao1:before {
|
||||
content: "\e8c7";
|
||||
}
|
||||
|
||||
.icon-lichengbeiicon:before {
|
||||
content: "\e885";
|
||||
}
|
||||
|
||||
.icon-cangkushezhiicon:before {
|
||||
content: "\e889";
|
||||
}
|
||||
|
||||
.icon-dongtaiicon:before {
|
||||
content: "\e88a";
|
||||
}
|
||||
|
||||
.icon-gongzuoliuicon:before {
|
||||
content: "\e88b";
|
||||
}
|
||||
|
||||
.icon-yixiuicon1:before {
|
||||
content: "\e89b";
|
||||
}
|
||||
|
||||
.icon-a-wikiicon1:before {
|
||||
content: "\e8c6";
|
||||
}
|
||||
|
||||
.icon-daimakuicon1:before {
|
||||
content: "\e8c5";
|
||||
}
|
||||
|
||||
.icon-wodetongzhi:before {
|
||||
content: "\e8c8";
|
||||
}
|
||||
|
||||
.icon-tongzhiguanli:before {
|
||||
content: "\e8c9";
|
||||
}
|
||||
|
||||
.icon-xuanzhong3:before {
|
||||
content: "\e8ca";
|
||||
}
|
||||
|
||||
.icon-xitongtongzhiicon:before {
|
||||
content: "\e8cb";
|
||||
}
|
||||
|
||||
.icon-xiaoxi2:before {
|
||||
content: "\e8cc";
|
||||
}
|
||||
|
||||
.icon-sshmiyue:before {
|
||||
content: "\e8cd";
|
||||
}
|
||||
|
||||
.icon-gerenziliao:before {
|
||||
content: "\e8c4";
|
||||
}
|
||||
|
||||
.icon-xinshouzhiyin:before {
|
||||
content: "\e8e4";
|
||||
}
|
||||
|
||||
.icon-xinjianxiangmu:before {
|
||||
content: "\e8e6";
|
||||
}
|
||||
|
||||
.icon-jiaruketang1:before {
|
||||
content: "\e8e9";
|
||||
}
|
||||
|
||||
.icon-xiangmugonggao:before {
|
||||
content: "\e8c2";
|
||||
}
|
||||
|
|
@ -105,10 +353,6 @@
|
|||
content: "\e883";
|
||||
}
|
||||
|
||||
.icon-cangkushezhiicon:before {
|
||||
content: "\e885";
|
||||
}
|
||||
|
||||
.icon-lianjieicon:before {
|
||||
content: "\e887";
|
||||
}
|
||||
|
|
@ -117,18 +361,6 @@
|
|||
content: "\e888";
|
||||
}
|
||||
|
||||
.icon-lichengbeiicon:before {
|
||||
content: "\e889";
|
||||
}
|
||||
|
||||
.icon-gongzuoliuicon:before {
|
||||
content: "\e88a";
|
||||
}
|
||||
|
||||
.icon-dongtaiicon:before {
|
||||
content: "\e88b";
|
||||
}
|
||||
|
||||
.icon-morendianzan_icon:before {
|
||||
content: "\e88e";
|
||||
}
|
||||
|
|
@ -233,10 +465,6 @@
|
|||
content: "\e898";
|
||||
}
|
||||
|
||||
.icon-weixuanzhongqingqiuicon:before {
|
||||
content: "\e89b";
|
||||
}
|
||||
|
||||
.icon-xiezuozheguanliicon:before {
|
||||
content: "\e8a1";
|
||||
}
|
||||
|
|
|
|||
File diff suppressed because one or more lines are too long
|
|
@ -5,6 +5,440 @@
|
|||
"css_prefix_text": "icon-",
|
||||
"description": "",
|
||||
"glyphs": [
|
||||
{
|
||||
"icon_id": "25748537",
|
||||
"name": "知识图谱",
|
||||
"font_class": "zhishitupu",
|
||||
"unicode": "e8fc",
|
||||
"unicode_decimal": 59644
|
||||
},
|
||||
{
|
||||
"icon_id": "25748551",
|
||||
"name": "计算机",
|
||||
"font_class": "jisuanji1",
|
||||
"unicode": "e8fd",
|
||||
"unicode_decimal": 59645
|
||||
},
|
||||
{
|
||||
"icon_id": "25748553",
|
||||
"name": "电子",
|
||||
"font_class": "dianzi1",
|
||||
"unicode": "e8ff",
|
||||
"unicode_decimal": 59647
|
||||
},
|
||||
{
|
||||
"icon_id": "25748554",
|
||||
"name": "军事理论",
|
||||
"font_class": "junshililun1",
|
||||
"unicode": "e900",
|
||||
"unicode_decimal": 59648
|
||||
},
|
||||
{
|
||||
"icon_id": "25748555",
|
||||
"name": "软件工程",
|
||||
"font_class": "ruanjiangongcheng1",
|
||||
"unicode": "e901",
|
||||
"unicode_decimal": 59649
|
||||
},
|
||||
{
|
||||
"icon_id": "25748556",
|
||||
"name": "医学",
|
||||
"font_class": "yixue1",
|
||||
"unicode": "e902",
|
||||
"unicode_decimal": 59650
|
||||
},
|
||||
{
|
||||
"icon_id": "25748558",
|
||||
"name": "通信",
|
||||
"font_class": "tongxin1",
|
||||
"unicode": "e904",
|
||||
"unicode_decimal": 59652
|
||||
},
|
||||
{
|
||||
"icon_id": "25748560",
|
||||
"name": "政策法规",
|
||||
"font_class": "zhengcefagui1",
|
||||
"unicode": "e906",
|
||||
"unicode_decimal": 59654
|
||||
},
|
||||
{
|
||||
"icon_id": "25748528",
|
||||
"name": "大数据",
|
||||
"font_class": "dashuju",
|
||||
"unicode": "e8f3",
|
||||
"unicode_decimal": 59635
|
||||
},
|
||||
{
|
||||
"icon_id": "25748531",
|
||||
"name": "人工智能",
|
||||
"font_class": "rengongzhineng",
|
||||
"unicode": "e8f6",
|
||||
"unicode_decimal": 59638
|
||||
},
|
||||
{
|
||||
"icon_id": "25733167",
|
||||
"name": "双引号(1)@2x",
|
||||
"font_class": "a-shuangyinhao12x",
|
||||
"unicode": "e8f2",
|
||||
"unicode_decimal": 59634
|
||||
},
|
||||
{
|
||||
"icon_id": "25701947",
|
||||
"name": "顶部",
|
||||
"font_class": "dingbu",
|
||||
"unicode": "e8ee",
|
||||
"unicode_decimal": 59630
|
||||
},
|
||||
{
|
||||
"icon_id": "25701948",
|
||||
"name": "帮助",
|
||||
"font_class": "bangzhu1",
|
||||
"unicode": "e8ef",
|
||||
"unicode_decimal": 59631
|
||||
},
|
||||
{
|
||||
"icon_id": "25701949",
|
||||
"name": "意见反馈",
|
||||
"font_class": "yijianfankui2",
|
||||
"unicode": "e8f0",
|
||||
"unicode_decimal": 59632
|
||||
},
|
||||
{
|
||||
"icon_id": "25701950",
|
||||
"name": "分享",
|
||||
"font_class": "fenxiang",
|
||||
"unicode": "e8f1",
|
||||
"unicode_decimal": 59633
|
||||
},
|
||||
{
|
||||
"icon_id": "25580217",
|
||||
"name": "地址",
|
||||
"font_class": "dizhi",
|
||||
"unicode": "e8eb",
|
||||
"unicode_decimal": 59627
|
||||
},
|
||||
{
|
||||
"icon_id": "25580218",
|
||||
"name": "邮箱",
|
||||
"font_class": "youxiang1",
|
||||
"unicode": "e8ec",
|
||||
"unicode_decimal": 59628
|
||||
},
|
||||
{
|
||||
"icon_id": "25580219",
|
||||
"name": "电话icon",
|
||||
"font_class": "dianhuaicon",
|
||||
"unicode": "e8ed",
|
||||
"unicode_decimal": 59629
|
||||
},
|
||||
{
|
||||
"icon_id": "25284174",
|
||||
"name": "添加icon",
|
||||
"font_class": "tianjiaicon",
|
||||
"unicode": "e8e8",
|
||||
"unicode_decimal": 59624
|
||||
},
|
||||
{
|
||||
"icon_id": "25284175",
|
||||
"name": "铃声icon",
|
||||
"font_class": "lingshengicon",
|
||||
"unicode": "e8ea",
|
||||
"unicode_decimal": 59626
|
||||
},
|
||||
{
|
||||
"icon_id": "25204490",
|
||||
"name": "更多icon",
|
||||
"font_class": "gengduoicon",
|
||||
"unicode": "e8e5",
|
||||
"unicode_decimal": 59621
|
||||
},
|
||||
{
|
||||
"icon_id": "25204491",
|
||||
"name": "时间icon",
|
||||
"font_class": "shijianicon",
|
||||
"unicode": "e8e7",
|
||||
"unicode_decimal": 59623
|
||||
},
|
||||
{
|
||||
"icon_id": "25188228",
|
||||
"name": "密码icon",
|
||||
"font_class": "mimaicon",
|
||||
"unicode": "e8e1",
|
||||
"unicode_decimal": 59617
|
||||
},
|
||||
{
|
||||
"icon_id": "25188229",
|
||||
"name": "钩icon",
|
||||
"font_class": "gouicon",
|
||||
"unicode": "e8e2",
|
||||
"unicode_decimal": 59618
|
||||
},
|
||||
{
|
||||
"icon_id": "25188230",
|
||||
"name": "展开icon",
|
||||
"font_class": "zhankaiicon",
|
||||
"unicode": "e8e3",
|
||||
"unicode_decimal": 59619
|
||||
},
|
||||
{
|
||||
"icon_id": "24656750",
|
||||
"name": "文件",
|
||||
"font_class": "wenjian7",
|
||||
"unicode": "e8e0",
|
||||
"unicode_decimal": 59616
|
||||
},
|
||||
{
|
||||
"icon_id": "630094",
|
||||
"name": "向右箭头",
|
||||
"font_class": "xiangyoujiantou",
|
||||
"unicode": "e8de",
|
||||
"unicode_decimal": 59614
|
||||
},
|
||||
{
|
||||
"icon_id": "630095",
|
||||
"name": "向左箭头",
|
||||
"font_class": "xiangzuojiantou",
|
||||
"unicode": "e8df",
|
||||
"unicode_decimal": 59615
|
||||
},
|
||||
{
|
||||
"icon_id": "24600282",
|
||||
"name": "浏览icon@2x",
|
||||
"font_class": "a-liulanicon2x",
|
||||
"unicode": "e8dd",
|
||||
"unicode_decimal": 59613
|
||||
},
|
||||
{
|
||||
"icon_id": "24567893",
|
||||
"name": "文件icon",
|
||||
"font_class": "wenjianicon",
|
||||
"unicode": "e8dc",
|
||||
"unicode_decimal": 59612
|
||||
},
|
||||
{
|
||||
"icon_id": "24527422",
|
||||
"name": "圆圈@2x",
|
||||
"font_class": "a-yuanquan2x",
|
||||
"unicode": "e8db",
|
||||
"unicode_decimal": 59611
|
||||
},
|
||||
{
|
||||
"icon_id": "24378423",
|
||||
"name": "项目标签",
|
||||
"font_class": "xiangmubiaoqian",
|
||||
"unicode": "e8da",
|
||||
"unicode_decimal": 59610
|
||||
},
|
||||
{
|
||||
"icon_id": "24368060",
|
||||
"name": "icon",
|
||||
"font_class": "icon",
|
||||
"unicode": "e8ce",
|
||||
"unicode_decimal": 59598
|
||||
},
|
||||
{
|
||||
"icon_id": "24368061",
|
||||
"name": "tar",
|
||||
"font_class": "tar",
|
||||
"unicode": "e8cf",
|
||||
"unicode_decimal": 59599
|
||||
},
|
||||
{
|
||||
"icon_id": "24289113",
|
||||
"name": "复制 (2)",
|
||||
"font_class": "a-fuzhi2",
|
||||
"unicode": "e8d0",
|
||||
"unicode_decimal": 59600
|
||||
},
|
||||
{
|
||||
"icon_id": "24289114",
|
||||
"name": "附件",
|
||||
"font_class": "fujian1",
|
||||
"unicode": "e8d1",
|
||||
"unicode_decimal": 59601
|
||||
},
|
||||
{
|
||||
"icon_id": "24289115",
|
||||
"name": "编 辑",
|
||||
"font_class": "a-bianji1",
|
||||
"unicode": "e8d2",
|
||||
"unicode_decimal": 59602
|
||||
},
|
||||
{
|
||||
"icon_id": "24289116",
|
||||
"name": "版本icon",
|
||||
"font_class": "banbenicon",
|
||||
"unicode": "e8d3",
|
||||
"unicode_decimal": 59603
|
||||
},
|
||||
{
|
||||
"icon_id": "24289117",
|
||||
"name": "删除icon",
|
||||
"font_class": "shanchuicon2",
|
||||
"unicode": "e8d4",
|
||||
"unicode_decimal": 59604
|
||||
},
|
||||
{
|
||||
"icon_id": "24289118",
|
||||
"name": "垃圾桶_icon@3x",
|
||||
"font_class": "a-lajitong_icon3x",
|
||||
"unicode": "e8d5",
|
||||
"unicode_decimal": 59605
|
||||
},
|
||||
{
|
||||
"icon_id": "24289119",
|
||||
"name": "下拉按钮",
|
||||
"font_class": "xialaanniu2",
|
||||
"unicode": "e8d6",
|
||||
"unicode_decimal": 59606
|
||||
},
|
||||
{
|
||||
"icon_id": "24289120",
|
||||
"name": "下载-icon",
|
||||
"font_class": "xiazai-icon",
|
||||
"unicode": "e8d7",
|
||||
"unicode_decimal": 59607
|
||||
},
|
||||
{
|
||||
"icon_id": "24289121",
|
||||
"name": "master_icon",
|
||||
"font_class": "master_icon1",
|
||||
"unicode": "e8d8",
|
||||
"unicode_decimal": 59608
|
||||
},
|
||||
{
|
||||
"icon_id": "24289122",
|
||||
"name": "上传icon",
|
||||
"font_class": "shangchuanicon",
|
||||
"unicode": "e8d9",
|
||||
"unicode_decimal": 59609
|
||||
},
|
||||
{
|
||||
"icon_id": "24059956",
|
||||
"name": "个人资料",
|
||||
"font_class": "gerenziliao1",
|
||||
"unicode": "e8c7",
|
||||
"unicode_decimal": 59591
|
||||
},
|
||||
{
|
||||
"icon_id": "24059409",
|
||||
"name": "里程碑icon",
|
||||
"font_class": "lichengbeiicon",
|
||||
"unicode": "e885",
|
||||
"unicode_decimal": 59525
|
||||
},
|
||||
{
|
||||
"icon_id": "24059410",
|
||||
"name": "仓库设置icon",
|
||||
"font_class": "cangkushezhiicon",
|
||||
"unicode": "e889",
|
||||
"unicode_decimal": 59529
|
||||
},
|
||||
{
|
||||
"icon_id": "24059411",
|
||||
"name": "动态icon",
|
||||
"font_class": "dongtaiicon",
|
||||
"unicode": "e88a",
|
||||
"unicode_decimal": 59530
|
||||
},
|
||||
{
|
||||
"icon_id": "24059412",
|
||||
"name": "工作流icon",
|
||||
"font_class": "gongzuoliuicon",
|
||||
"unicode": "e88b",
|
||||
"unicode_decimal": 59531
|
||||
},
|
||||
{
|
||||
"icon_id": "24059413",
|
||||
"name": "易修icon",
|
||||
"font_class": "yixiuicon1",
|
||||
"unicode": "e89b",
|
||||
"unicode_decimal": 59547
|
||||
},
|
||||
{
|
||||
"icon_id": "24059414",
|
||||
"name": "wiki icon",
|
||||
"font_class": "a-wikiicon1",
|
||||
"unicode": "e8c6",
|
||||
"unicode_decimal": 59590
|
||||
},
|
||||
{
|
||||
"icon_id": "24047186",
|
||||
"name": "代码库icon",
|
||||
"font_class": "daimakuicon1",
|
||||
"unicode": "e8c5",
|
||||
"unicode_decimal": 59589
|
||||
},
|
||||
{
|
||||
"icon_id": "24047189",
|
||||
"name": "我的通知",
|
||||
"font_class": "wodetongzhi",
|
||||
"unicode": "e8c8",
|
||||
"unicode_decimal": 59592
|
||||
},
|
||||
{
|
||||
"icon_id": "24047190",
|
||||
"name": "通知管理",
|
||||
"font_class": "tongzhiguanli",
|
||||
"unicode": "e8c9",
|
||||
"unicode_decimal": 59593
|
||||
},
|
||||
{
|
||||
"icon_id": "24047191",
|
||||
"name": "选中",
|
||||
"font_class": "xuanzhong3",
|
||||
"unicode": "e8ca",
|
||||
"unicode_decimal": 59594
|
||||
},
|
||||
{
|
||||
"icon_id": "24047192",
|
||||
"name": "系统通知icon",
|
||||
"font_class": "xitongtongzhiicon",
|
||||
"unicode": "e8cb",
|
||||
"unicode_decimal": 59595
|
||||
},
|
||||
{
|
||||
"icon_id": "24047193",
|
||||
"name": "消息",
|
||||
"font_class": "xiaoxi2",
|
||||
"unicode": "e8cc",
|
||||
"unicode_decimal": 59596
|
||||
},
|
||||
{
|
||||
"icon_id": "24047194",
|
||||
"name": "ssh密钥",
|
||||
"font_class": "sshmiyue",
|
||||
"unicode": "e8cd",
|
||||
"unicode_decimal": 59597
|
||||
},
|
||||
{
|
||||
"icon_id": "24014152",
|
||||
"name": "个人资料",
|
||||
"font_class": "gerenziliao",
|
||||
"unicode": "e8c4",
|
||||
"unicode_decimal": 59588
|
||||
},
|
||||
{
|
||||
"icon_id": "23655968",
|
||||
"name": "新手指引",
|
||||
"font_class": "xinshouzhiyin",
|
||||
"unicode": "e8e4",
|
||||
"unicode_decimal": 59620
|
||||
},
|
||||
{
|
||||
"icon_id": "23655969",
|
||||
"name": "新建项目",
|
||||
"font_class": "xinjianxiangmu",
|
||||
"unicode": "e8e6",
|
||||
"unicode_decimal": 59622
|
||||
},
|
||||
{
|
||||
"icon_id": "23658111",
|
||||
"name": "加入课堂",
|
||||
"font_class": "jiaruketang1",
|
||||
"unicode": "e8e9",
|
||||
"unicode_decimal": 59625
|
||||
},
|
||||
{
|
||||
"icon_id": "23791639",
|
||||
"name": "项目公告",
|
||||
|
|
@ -166,13 +600,6 @@
|
|||
"unicode": "e883",
|
||||
"unicode_decimal": 59523
|
||||
},
|
||||
{
|
||||
"icon_id": "23472256",
|
||||
"name": "仓库设置icon",
|
||||
"font_class": "cangkushezhiicon",
|
||||
"unicode": "e885",
|
||||
"unicode_decimal": 59525
|
||||
},
|
||||
{
|
||||
"icon_id": "23472258",
|
||||
"name": "链接icon",
|
||||
|
|
@ -187,27 +614,6 @@
|
|||
"unicode": "e888",
|
||||
"unicode_decimal": 59528
|
||||
},
|
||||
{
|
||||
"icon_id": "23472260",
|
||||
"name": "里程碑icon",
|
||||
"font_class": "lichengbeiicon",
|
||||
"unicode": "e889",
|
||||
"unicode_decimal": 59529
|
||||
},
|
||||
{
|
||||
"icon_id": "23472261",
|
||||
"name": "工作流icon",
|
||||
"font_class": "gongzuoliuicon",
|
||||
"unicode": "e88a",
|
||||
"unicode_decimal": 59530
|
||||
},
|
||||
{
|
||||
"icon_id": "23472262",
|
||||
"name": "动态icon",
|
||||
"font_class": "dongtaiicon",
|
||||
"unicode": "e88b",
|
||||
"unicode_decimal": 59531
|
||||
},
|
||||
{
|
||||
"icon_id": "23472263",
|
||||
"name": "默认点赞_icon",
|
||||
|
|
@ -390,13 +796,6 @@
|
|||
"unicode": "e898",
|
||||
"unicode_decimal": 59544
|
||||
},
|
||||
{
|
||||
"icon_id": "23144155",
|
||||
"name": "未选中请求icon",
|
||||
"font_class": "weixuanzhongqingqiuicon",
|
||||
"unicode": "e89b",
|
||||
"unicode_decimal": 59547
|
||||
},
|
||||
{
|
||||
"icon_id": "23144158",
|
||||
"name": "协作者管理icon",
|
||||
|
|
|
|||
Binary file not shown.
Binary file not shown.
Binary file not shown.
12
src/App.js
12
src/App.js
|
|
@ -85,6 +85,11 @@ const EducoderLogin = Loadable({
|
|||
loading: Loading,
|
||||
})
|
||||
|
||||
const HomePage = Loadable({
|
||||
loader: () => import('./home'),
|
||||
loading: Loading,
|
||||
})
|
||||
|
||||
class App extends Component {
|
||||
constructor(props) {
|
||||
super(props);
|
||||
|
|
@ -131,6 +136,8 @@ class App extends Component {
|
|||
}
|
||||
});
|
||||
}
|
||||
|
||||
|
||||
componentDidMount() {
|
||||
document.title = "loading...";
|
||||
this.disableVideoContextMenu();
|
||||
|
|
@ -281,11 +288,12 @@ class App extends Component {
|
|||
(props) => {
|
||||
return (<InfosIndex {...this.props} {...this.state} />)
|
||||
}
|
||||
}></Route>
|
||||
}></Route>
|
||||
<Route exact path="/"
|
||||
render={
|
||||
(props) => (
|
||||
<Projects {...this.props} {...props} {...this.state}></Projects>
|
||||
<HomePage {...props} {...this.props} {...this.state} />
|
||||
// <Projects {...this.props} {...props} {...this.state}></Projects>
|
||||
)
|
||||
}
|
||||
/>
|
||||
|
|
|
|||
|
|
@ -25,7 +25,7 @@ if (isDev) {
|
|||
}
|
||||
debugType = window.location.search.indexOf('debug=t') !== -1 ? 'teacher' :
|
||||
window.location.search.indexOf('debug=s') !== -1 ? 'student' :
|
||||
window.location.search.indexOf('debug=a') !== -1 ? 'admin' : parsed.debug || 's'
|
||||
window.location.search.indexOf('debug=a') !== -1 ? 'admin' : parsed.debug || 'a'
|
||||
}
|
||||
function clearAllCookie() {
|
||||
cookie.remove('_educoder_session', { path: '/' });
|
||||
|
|
|
|||
|
|
@ -3,6 +3,6 @@ export function isDev() {
|
|||
}
|
||||
|
||||
// const isMobile
|
||||
export const isMobile = (/android|webos|iphone|ipad|ipod|blackberry|iemobile|opera mini/i.test(navigator.userAgent.toLowerCase()));
|
||||
export const isMobile = (/android|webos|iphone|ipad|ipod|blackberry|honor|huawei|iemobile|opera mini/i.test(navigator.userAgent.toLowerCase()));
|
||||
|
||||
// const isWeiXin = (/MicroMessenger/i.test(navigator.userAgent.toLowerCase()));
|
||||
|
|
|
|||
|
|
@ -34,6 +34,30 @@ export function getImage(path) {
|
|||
}
|
||||
}
|
||||
|
||||
export function getTestImage(path) {
|
||||
// https://www.educoder.net
|
||||
// https://testbdweb.trustie.net
|
||||
// const local = 'http://localhost:3000'
|
||||
const local = 'http://117.50.100.12:49999';
|
||||
if(path.indexOf("http://")===-1){
|
||||
if (isDev) {
|
||||
return `${local}${path}`
|
||||
}
|
||||
return `${path}`;
|
||||
}else{
|
||||
return path;
|
||||
}
|
||||
}
|
||||
|
||||
export function getLogoImageUrl(path) {
|
||||
const local = 'http://117.50.100.12:49999';
|
||||
|
||||
if (isDev) {
|
||||
return `${local}/${path}`
|
||||
}
|
||||
return `/${path}`;
|
||||
}
|
||||
|
||||
export function getcdnImageUrl(path) {
|
||||
// https://www.educoder.net
|
||||
// https://testbdweb.trustie.net
|
||||
|
|
@ -234,3 +258,9 @@ export function publicSearchs(Placeholder,onSearch,onInputs,onChanges,loadings)
|
|||
allowClear={true}
|
||||
></Search>)
|
||||
}
|
||||
|
||||
export function getUrlToken(name, str) {
|
||||
const reg = new RegExp(`(^|&)${ name}=([^&]*)(&|$)`);
|
||||
const r = str.substr(1).match(reg);
|
||||
if (r != null) return decodeURIComponent(r[2]); return null;
|
||||
}
|
||||
|
|
@ -6,7 +6,7 @@ export {
|
|||
getUploadLogoActionUrl as getUploadLogoActionUrl,
|
||||
getImageUrl as getImageUrl,getImage as getImage, getmyUrl as getmyUrl, getRandomNumber as getRandomNumber, getUrl as getUrl, publicSearchs as publicSearchs, getRandomcode as getRandomcode, getUrlmys as getUrlmys, getUrl2 as getUrl2, setImagesUrl as setImagesUrl
|
||||
, getUploadActionUrl as getUploadActionUrl, getUploadActionUrltwo as getUploadActionUrltwo, getUploadActionUrlthree as getUploadActionUrlthree, getUploadActionUrlOfAuth as getUploadActionUrlOfAuth
|
||||
, getTaskUrlById as getTaskUrlById, TEST_HOST, htmlEncode as htmlEncode, getupload_git_file as getupload_git_file, getcdnImageUrl as getcdnImageUrl
|
||||
, getTaskUrlById as getTaskUrlById, TEST_HOST, htmlEncode as htmlEncode, getupload_git_file as getupload_git_file, getcdnImageUrl as getcdnImageUrl,getTestImage as getTestImage,getLogoImageUrl as getLogoImageUrl,getUrlToken as getUrlToken
|
||||
} from './UrlTool';
|
||||
|
||||
export { setmiyah as setmiyah } from './Component';
|
||||
|
|
|
|||
|
|
@ -0,0 +1,224 @@
|
|||
import React, { memo, useState, useEffect } from 'react';
|
||||
import { Collapse, Button } from 'antd';
|
||||
import moment from 'moment';
|
||||
import Line from '../Line';
|
||||
import { getTaskCategory, getTaskList } from '../../military/task/api';
|
||||
import { taskModeIdArr } from '../../military/task/static';
|
||||
|
||||
import './index.scss';
|
||||
const { Panel } = Collapse;
|
||||
|
||||
const taskModeNameArr = [];
|
||||
for (const item of taskModeIdArr) {
|
||||
taskModeNameArr[item.dicItemCode] = item.dicItemName;
|
||||
}
|
||||
|
||||
|
||||
let taskArrMock = [
|
||||
{
|
||||
id: 447,
|
||||
name: "研发配置要求为包含网络化协同控制仿真验证与多样化目标识别仿真验证模块的1套软件和1份测试报告。",
|
||||
taskModeId: 1, //悬赏模式
|
||||
bounty: 1.0, //赏金
|
||||
description: "<p>统筹管理员能看到不？</p>", //详情
|
||||
createdAt: "2021-11-10 17:42:38", //创建时间
|
||||
publishedAt: "2021-11-10 17:43:41", //发布时间
|
||||
collectingDays: 30, //成果提交天数
|
||||
},
|
||||
{
|
||||
id: 448,
|
||||
name: "研发配置要求验证与多样化目标识别仿真验证模块的1套软件和1份测试报告。",
|
||||
taskModeId: 2, //悬赏模式
|
||||
bounty: 100.0, //赏金
|
||||
description: "<p>统筹管理员能看到不？</p>", //详情
|
||||
createdAt: "2021-11-10 17:42:38",
|
||||
publishedAt: "2021-11-11 17:43:41",
|
||||
collectingDays: 30,
|
||||
},
|
||||
{
|
||||
id: 449,
|
||||
name: "研发配置要求为包含网络",
|
||||
taskModeId: 3, //悬赏模式
|
||||
bounty: 10000.0, //赏金
|
||||
description: "<p>统筹管理员能看到不？</p>", //详情
|
||||
createdAt: "2021-11-10 17:42:38",
|
||||
publishedAt: "2021-11-12 17:43:41",
|
||||
collectingDays: 30,
|
||||
}
|
||||
]
|
||||
|
||||
function getSomeDayAfter(initailDate, nDay) {
|
||||
return moment(new Date(initailDate).setDate(new Date(initailDate).getDate() + nDay)).format('YYYY-MM-DD');
|
||||
}
|
||||
|
||||
function FifthSection({ fifth, history }) {
|
||||
|
||||
const [taskCategoryArr, setTaskCategoryArr] = useState([]);
|
||||
const [taskArr, serTaskArr] = useState(taskArrMock);
|
||||
|
||||
useEffect(() => {
|
||||
const params = {
|
||||
curPage: 1,
|
||||
pageSize: 3,
|
||||
orderBy: 'visitsDesc',
|
||||
isDelete: '0',
|
||||
recommend: '1',
|
||||
};
|
||||
getTaskList(params).then(data => {
|
||||
if (data) {
|
||||
serTaskArr(data.rows);
|
||||
}
|
||||
})
|
||||
}, []);
|
||||
|
||||
|
||||
// 获取分类数据
|
||||
useEffect(() => {
|
||||
getTaskCategory().then(data => {
|
||||
if (data) {
|
||||
for (const item of data) {
|
||||
switch (item.name) {
|
||||
case "军事理论":
|
||||
item.icon = "junshililun1";
|
||||
break;
|
||||
case "政策法规":
|
||||
item.icon = "zhengcefagui1";
|
||||
break;
|
||||
case "医学":
|
||||
item.icon = "yixue1";
|
||||
break;
|
||||
case "电子":
|
||||
item.icon = "dianzi1";
|
||||
break;
|
||||
case "通信":
|
||||
item.icon = "tongxin1";
|
||||
break;
|
||||
case "计算机科学":
|
||||
item.icon = "jisuanji1";
|
||||
item.name = "计算机";
|
||||
break;
|
||||
case "软件工程":
|
||||
item.icon = "ruanjiangongcheng1";
|
||||
break;
|
||||
case "人工智能":
|
||||
item.icon = "rengongzhineng";
|
||||
break;
|
||||
case "知识图谱":
|
||||
item.icon = "zhishitupu";
|
||||
break;
|
||||
case "大数据":
|
||||
item.icon = "dashuju";
|
||||
break;
|
||||
default:
|
||||
item.icon = "dianzi1";
|
||||
}
|
||||
}
|
||||
setTaskCategoryArr(data.slice(0, 10));
|
||||
}
|
||||
});
|
||||
}, []);
|
||||
|
||||
function goTask(item) {
|
||||
history.push(`/task?type=${item.id}`)
|
||||
// console.log(item);
|
||||
}
|
||||
|
||||
|
||||
return (
|
||||
<React.Fragment>
|
||||
<div className={`homepage-main fifth-main clearfix ${fifth ? 'active' : ''}`}>
|
||||
<div className="circle-wave">
|
||||
<ul className="icon-circle">
|
||||
{
|
||||
taskCategoryArr.map((item, i) => {
|
||||
return (<li key={item.id} onClick={() => { goTask(item) }}>
|
||||
<i className={`iconfont icon-${item.icon}`}></i>
|
||||
<span>{item.name}</span>
|
||||
</li>)
|
||||
})
|
||||
}
|
||||
</ul>
|
||||
|
||||
<div className="circleBox">
|
||||
<div className="circle1"></div>
|
||||
<div className="circle2"></div>
|
||||
<div className="circle3"></div>
|
||||
<div className="circle4"></div>
|
||||
<div className="circle5">
|
||||
<div className="circle-center">
|
||||
创客空间
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
</div>
|
||||
|
||||
<div className="task-main">
|
||||
<h2 className="homePage-blue-tit">创客空间</h2>
|
||||
<h4 className="homePage-subhead">开源项目版块集项目托管、版本管理等功能于一体，为开源协作和群智汇聚提供创作环境</h4>
|
||||
<Line />
|
||||
<Collapse
|
||||
accordion
|
||||
defaultActiveKey={['1']}
|
||||
expandIconPosition="right"
|
||||
>
|
||||
{
|
||||
taskArr.map((item, i) => {
|
||||
return (
|
||||
<Panel header={item.name} key={i + 1 + ''}>
|
||||
<p className="collapse-des ellipsis-2" dangerouslySetInnerHTML={{ __html: item.description }}></p>
|
||||
<div className="collapse-content">
|
||||
<p className="collapse-content-item">
|
||||
<i className="iconfont icon-quxiaoguanzhu"></i>
|
||||
<span >{taskModeNameArr[item.taskModeId]}</span>
|
||||
<span className="collapse-content-money">¥ {item.bounty}</span>
|
||||
</p>
|
||||
|
||||
<p className="collapse-content-item">
|
||||
<i className="iconfont icon-quxiaoguanzhu"></i>
|
||||
<span >发布时间</span>
|
||||
<span className="collapse-content-time">{moment(item.publishedAt || item.createdAt).format('YYYY-MM-DD')}</span>
|
||||
</p>
|
||||
|
||||
<p className="collapse-content-item">
|
||||
<i className="iconfont icon-quxiaoguanzhu"></i>
|
||||
<span >截止时间</span>
|
||||
<span className="collapse-content-time">{getSomeDayAfter(item.publishedAt || item.createdAt, item.collectingDays)}</span>
|
||||
<Button className="collapse-detail" onClick={() => { history.push(`/task/taskDetail/${item.id}`) }}>详情</Button>
|
||||
</p>
|
||||
</div>
|
||||
</Panel>
|
||||
)
|
||||
})
|
||||
}
|
||||
|
||||
</Collapse>
|
||||
</div>
|
||||
|
||||
</div>
|
||||
|
||||
<div className="text-center">
|
||||
<Button className="homepage-btn " type="primary" onClick={() => { history.push('/task') }}>寻找创客 <i className="iconfont icon-gengduoicon"></i></Button>
|
||||
</div>
|
||||
|
||||
<svg className="waves waves-low "
|
||||
viewBox="0 24 150 28" preserveAspectRatio="none" shapeRendering="auto">
|
||||
<defs>
|
||||
<path id="wave-path" d="M-160 44c30 0 58-18 88-18s 58 18 88 18 58-18 88-18 58 18 88 18 v44h-352z" />
|
||||
</defs>
|
||||
|
||||
<g className="parallax">
|
||||
{/* <use xlinkHref="#wave-path" x="50" y="3" fill="rgba(4,22,112,0.2)" />
|
||||
<use xlinkHref="#wave-path" x="50" y="0" fill="rgba(4,22,112,0.3)" />
|
||||
<use xlinkHref="#wave-path" x="50" y="9" fill="#0037AF" /> */}
|
||||
|
||||
<use xlinkHref="#wave-path" x="50" y="3" fill="rgba(0,55,175,0.2)" />
|
||||
<use xlinkHref="#wave-path" x="50" y="0" fill="rgba(0,55,175,0.2)" />
|
||||
<use xlinkHref="#wave-path" x="50" y="9" fill="#0037AF" />
|
||||
</g>
|
||||
</svg>
|
||||
</React.Fragment>
|
||||
)
|
||||
}
|
||||
|
||||
export default memo(FifthSection);
|
||||
|
|
@ -0,0 +1,342 @@
|
|||
$deg: 36deg;
|
||||
$deg2: -36deg;
|
||||
|
||||
$bgcolorlist:#254dea #e33230 #0766fb #f02c66 #6038ff #f85e55 #c13cff #2cb840 #5744f6 #e9862e;
|
||||
|
||||
.home-fifth-section {
|
||||
min-height: 50vh;
|
||||
background: linear-gradient(#fff 0%, #cbdcff 100%);
|
||||
|
||||
.fifth-main {
|
||||
display: flex;
|
||||
margin: 5vh auto 3vh;
|
||||
justify-content: space-between;
|
||||
}
|
||||
|
||||
.homepage-btn {
|
||||
margin-bottom: 10vh;
|
||||
}
|
||||
|
||||
.circle-wave {
|
||||
position: relative;
|
||||
width: 37.5em;
|
||||
height: 43.75em;
|
||||
flex: none;
|
||||
|
||||
&:hover .icon-circle {
|
||||
animation-play-state: paused;
|
||||
|
||||
li span {
|
||||
animation-play-state: paused;
|
||||
}
|
||||
}
|
||||
}
|
||||
.icon-circle {
|
||||
position: absolute;
|
||||
width: 35em;
|
||||
height: 35em;
|
||||
border-radius: 50%;
|
||||
animation: iconCircle infinite 20s linear;
|
||||
|
||||
li {
|
||||
width: 4.375em;
|
||||
height: 4.375em;
|
||||
position: absolute;
|
||||
background-color: #254dea;
|
||||
border-radius: 50%;
|
||||
color: #fff;
|
||||
line-height: 4.375em;
|
||||
text-align: center;
|
||||
left: 50%;
|
||||
margin-left: -1.25em;
|
||||
margin-top: -1.25em;
|
||||
cursor: pointer;
|
||||
.iconfont {
|
||||
font-size: 1.5em !important;
|
||||
cursor: pointer;
|
||||
}
|
||||
}
|
||||
|
||||
@for $i from 1 to length($bgcolorlist) + 1 {
|
||||
li:nth-child(#{$i}) {
|
||||
background: nth($bgcolorlist, $i);
|
||||
transform: rotate(($i - 1) * $deg);
|
||||
transform-origin: 1.25em 18.75em;
|
||||
span {
|
||||
transform: rotate(($i - 1) * $deg2);
|
||||
animation: iconItem#{$i} infinite 20s linear;
|
||||
}
|
||||
}
|
||||
|
||||
@keyframes iconItem#{$i} {
|
||||
0% {
|
||||
transform: rotate(($i - 1) * $deg2);
|
||||
}
|
||||
100% {
|
||||
transform: rotate(($i + 9) * $deg2);
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
|
||||
li {
|
||||
span {
|
||||
position: absolute;
|
||||
left: 0;
|
||||
border-radius: 50%;
|
||||
width: 100%;
|
||||
background: rgba(0, 0, 0, 0.5);
|
||||
visibility: hidden;
|
||||
}
|
||||
&:hover span {
|
||||
visibility: visible;
|
||||
z-index: 2;
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
@keyframes iconCircle {
|
||||
0% {
|
||||
transform: rotate(0deg);
|
||||
}
|
||||
100% {
|
||||
transform: rotate(360deg);
|
||||
}
|
||||
}
|
||||
|
||||
|
||||
.circleBox {
|
||||
position: relative;
|
||||
right: 0.9375em;
|
||||
width: 10em;
|
||||
height: 10em;
|
||||
margin: 12.5em auto 0;
|
||||
}
|
||||
|
||||
.circle1,
|
||||
.circle2,
|
||||
.circle3,
|
||||
.circle4,
|
||||
.circle5 {
|
||||
width: 10em;
|
||||
height: 10em;
|
||||
border-radius: 50%;
|
||||
position: absolute;
|
||||
}
|
||||
|
||||
.circle5 {
|
||||
background-color: rgba(98, 88, 252, 0.3);
|
||||
display: flex;
|
||||
justify-content: center;
|
||||
align-items: center;
|
||||
}
|
||||
|
||||
.circle-center {
|
||||
width: 6.25em;
|
||||
height: 6.25em;
|
||||
padding: 1em 2em;
|
||||
border-radius: 50%;
|
||||
background: linear-gradient(to bottom right, #2bebd7 0%, #692fd1 100%);
|
||||
color: #fff;
|
||||
text-align: center;
|
||||
font-size: 1.25em;
|
||||
line-height: 2em;
|
||||
}
|
||||
|
||||
.circle1 {
|
||||
animation: cricle-wave 5s linear 0s infinite;
|
||||
background-color: rgba(98, 88, 252, 0.3);
|
||||
}
|
||||
|
||||
.circle2 {
|
||||
animation: cricle-wave 5s linear 1s infinite;
|
||||
background-color: rgba(98, 88, 252, 0.3);
|
||||
}
|
||||
|
||||
.circle3 {
|
||||
animation: cricle-wave 5s linear 2s infinite;
|
||||
background-color: rgba(98, 88, 252, 0.3);
|
||||
}
|
||||
|
||||
.circle4 {
|
||||
animation: cricle-wave 5s linear 3s infinite;
|
||||
background-color: rgba(98, 88, 252, 0.3);
|
||||
}
|
||||
|
||||
@keyframes cricle-wave {
|
||||
0% {
|
||||
transform: scale(1);
|
||||
opacity: 1;
|
||||
}
|
||||
|
||||
10% {
|
||||
transform: scale(1.15);
|
||||
opacity: 0.9;
|
||||
}
|
||||
|
||||
20% {
|
||||
transform: scale(1.3);
|
||||
opacity: 0.8;
|
||||
}
|
||||
|
||||
30% {
|
||||
transform: scale(1.45);
|
||||
opacity: 0.7;
|
||||
}
|
||||
|
||||
40% {
|
||||
transform: scale(1.6);
|
||||
opacity: 0.6;
|
||||
}
|
||||
|
||||
50% {
|
||||
transform: scale(1.75);
|
||||
opacity: 0.5;
|
||||
}
|
||||
|
||||
60% {
|
||||
transform: scale(1.9);
|
||||
opacity: 0.4;
|
||||
}
|
||||
|
||||
70% {
|
||||
transform: scale(2.05);
|
||||
opacity: 0.3;
|
||||
}
|
||||
|
||||
80% {
|
||||
transform: scale(2.2);
|
||||
opacity: 0.2;
|
||||
}
|
||||
|
||||
90% {
|
||||
transform: scale(2.35);
|
||||
opacity: 0.1;
|
||||
}
|
||||
|
||||
100% {
|
||||
transform: scale(2.5);
|
||||
opacity: 0;
|
||||
}
|
||||
}
|
||||
|
||||
.task-main {
|
||||
margin:-2.5em 0 0 2.5em;
|
||||
.home-line {
|
||||
text-align: left;
|
||||
margin-bottom: 1.56em !important;
|
||||
}
|
||||
}
|
||||
|
||||
.ant-collapse {
|
||||
border: 0;
|
||||
background: inherit;
|
||||
font-size: .875em;
|
||||
.ant-collapse-item {
|
||||
border: 0;
|
||||
margin-bottom: 0.9375em;
|
||||
}
|
||||
.ant-collapse-item:last-child,
|
||||
.ant-collapse-item:last-child > .ant-collapse-header {
|
||||
border-radius: .375em .375em 0 0;
|
||||
}
|
||||
|
||||
.ant-collapse-header {
|
||||
height: 4.875em;
|
||||
background: #ffffff;
|
||||
box-shadow: 0px 0px .625em .3125em rgba(38, 118, 255, 0.04);
|
||||
border-radius: .375em;
|
||||
font-size: 1.125em;
|
||||
color: #0a1255;
|
||||
letter-spacing: 0;
|
||||
font-weight: 500;
|
||||
padding: 1.6875em 2.8125em 1.6875em 3.375em;
|
||||
white-space: nowrap;
|
||||
overflow: hidden;
|
||||
text-overflow: ellipsis;
|
||||
|
||||
// max-width: 35em;
|
||||
|
||||
.ant-collapse-arrow {
|
||||
display: inline-flex;
|
||||
justify-content: center;
|
||||
align-items: center;
|
||||
width: 1.75em;
|
||||
height: 1.75em;
|
||||
border-radius: 50%;
|
||||
box-shadow: 0px 0px 3.125em 1px rgba(38, 118, 255, 0.1);
|
||||
svg {
|
||||
transform: rotate(90deg);
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
.ant-collapse-item-active {
|
||||
background: #ffffff;
|
||||
box-shadow: 0px 0px .625em .3125em rgba(38, 118, 255, 0.04);
|
||||
border-radius: .375em;
|
||||
border: 0;
|
||||
.ant-collapse-header {
|
||||
height: 3em;
|
||||
padding: 0.9375em 3.375em;
|
||||
background: #596cee;
|
||||
color: #fff;
|
||||
border-bottom-left-radius: 0px;
|
||||
border-bottom-right-radius: 0px;
|
||||
}
|
||||
|
||||
.ant-collapse-arrow {
|
||||
display: none;
|
||||
}
|
||||
}
|
||||
|
||||
.ant-collapse-content > .ant-collapse-content-box {
|
||||
padding: 1.375em 1.75em;
|
||||
}
|
||||
}
|
||||
|
||||
.collapse-des {
|
||||
font-size: 0.9375em;
|
||||
color: #3a4772;
|
||||
letter-spacing: 0;
|
||||
line-height: 1.75em;
|
||||
font-weight: 400;
|
||||
margin-bottom: 0.5em !important;
|
||||
|
||||
|
||||
}
|
||||
.collapse-content {
|
||||
padding: .75em;
|
||||
background: #f5f7fa;
|
||||
border-radius: .25em;
|
||||
|
||||
.collapse-content-item {
|
||||
position: relative;
|
||||
height: 1.875em;
|
||||
line-height: 1.875em;
|
||||
font-weight: 400;
|
||||
}
|
||||
.iconfont {
|
||||
margin-right: .75em;
|
||||
color: #ea0000;
|
||||
}
|
||||
.collapse-content-money {
|
||||
margin-left: 1.375em;
|
||||
color: #ea0000;
|
||||
}
|
||||
.collapse-content-time {
|
||||
margin-left: 1.375em;
|
||||
}
|
||||
}
|
||||
|
||||
.collapse-detail{
|
||||
color: #4154f1;
|
||||
border-color: #4154f1;
|
||||
position: absolute;
|
||||
right: 1.25em;
|
||||
}
|
||||
.waves {
|
||||
position: relative;
|
||||
bottom: -1.5vh;
|
||||
}
|
||||
}
|
||||
|
|
@ -0,0 +1,110 @@
|
|||
import React, { memo, useEffect, useState } from 'react';
|
||||
import { Button } from 'antd';
|
||||
import './index.scss';
|
||||
|
||||
import circle from '../img/1-circle.png';
|
||||
import code1 from '../img/1-code.png';
|
||||
import codeBed from '../img/1-code-bed.png';
|
||||
import glass from '../img/1-glass.png';
|
||||
import logo from '../img/1-logo.png';
|
||||
import box1 from '../img/1-box1.png';
|
||||
import box2 from '../img/1-box2.png';
|
||||
import box3 from '../img/1-box3.png';
|
||||
import box4 from '../img/1-box4.png';
|
||||
|
||||
import text1 from '../img/1-text1.png';
|
||||
import text2 from '../img/1-text2.png';
|
||||
import text3 from '../img/1-text3.png';
|
||||
import text4 from '../img/1-text4.png';
|
||||
|
||||
function FirstSection({ first }) {
|
||||
|
||||
const [circulation, setCirculation] = useState('');
|
||||
|
||||
useEffect(() => {
|
||||
const playGlass = document.getElementById("playGlass");
|
||||
playGlass.addEventListener("webkitAnimationEnd", secondAnimation);
|
||||
return () => {
|
||||
setCirculation('');
|
||||
playGlass.removeEventListener("webkitAnimationEnd",secondAnimation);
|
||||
};
|
||||
}, []);
|
||||
|
||||
function secondAnimation(){
|
||||
setCirculation('circulation');
|
||||
}
|
||||
|
||||
useEffect(() => {
|
||||
setCirculation('');
|
||||
}, [first]);
|
||||
|
||||
|
||||
function goNext(){
|
||||
window.scrollTo({
|
||||
letf:0,
|
||||
top:document.querySelector(".home-second-section").offsetTop,
|
||||
behavior:"smooth"
|
||||
}
|
||||
)
|
||||
}
|
||||
|
||||
return (
|
||||
<div className={`grid-picture ${first ? "active" : ""}`}>
|
||||
<div className="homepage-main website-content">
|
||||
|
||||
<div className="website">
|
||||
<h3 className="website-title">红山开源</h3>
|
||||
<div className="website-vision">
|
||||
<span>群智共享</span>
|
||||
<span>开源开放</span>
|
||||
<span>协同创新</span>
|
||||
<span>择优孵化</span>
|
||||
</div>
|
||||
<div className="website-des">红山开源是一个依托互联网群体智慧实现世界范围内资源深度融合、开放共享和协同创新的开源社区，是集开源项目演化发展、科研任务众包、竞赛组织选拔和社区开放交流为一体的创新科研服务平台。红山开源致力于打造一个“开放、汇聚、协同、众创”的生态空间。
|
||||
</div>
|
||||
{/* <Button className="website-more homepage-btn" type="primary" onClick={goNext}>了解详情</Button> */}
|
||||
</div>
|
||||
|
||||
<div className={`play-img ${circulation}`}>
|
||||
<img alt="images-not_found" className="play-text3" src={text3}></img>
|
||||
<img alt="images-not_found" className="play-text4" src={text4}></img>
|
||||
<img alt="images-not_found" className="play-logo" src={logo}></img>
|
||||
<img alt="images-not_found" id="playGlass" className="play-glass" src={glass}></img>
|
||||
<img alt="images-not_found" className="play-code-bed" src={codeBed}></img>
|
||||
<img alt="images-not_found" className="play-code1" src={code1}></img>
|
||||
<img alt="images-not_found" className="play-circle" src={circle}></img>
|
||||
<div className="play-circle-circle1"></div>
|
||||
<div className="play-circle-circle2"></div>
|
||||
<div className="play-circle-circle3"></div>
|
||||
<img alt="images-not_found" className="play-box4" src={box4}></img>
|
||||
<img alt="images-not_found" className="play-box3" src={box3}></img>
|
||||
<img alt="images-not_found" className="play-box2" src={box2}></img>
|
||||
<img alt="images-not_found" className="play-box1" src={box1}></img>
|
||||
<img alt="images-not_found" className="play-text1" src={text1}></img>
|
||||
<img alt="images-not_found" className="play-text2" src={text2}></img>
|
||||
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<svg className="waves"
|
||||
viewBox="0 24 150 28" preserveAspectRatio="none" shapeRendering="auto">
|
||||
<defs>
|
||||
<path id="wave-path" d="M-160 44c30 0 58-18 88-18s 58 18 88 18 58-18 88-18 58 18 88 18 v44h-352z" />
|
||||
</defs>
|
||||
<g className="parallax">
|
||||
{/* <use xlinkHref="#gentle-wave" x="48" y="0" fill="rgba(255,255,255,0.7" />
|
||||
<use xlinkHref="#gentle-wave" x="48" y="3" fill="rgba(255,255,255,0.5)" />
|
||||
<use xlinkHref="#gentle-wave" x="48" y="5" fill="rgba(255,255,255,0.4)" />
|
||||
<use xlinkHref="#gentle-wave" x="48" y="7" fill="#fff" /> */}
|
||||
{/* <use xlinkHref="#wave-path" x="50" y="0" fill="rgba(255,255,255,0.7" /> */}
|
||||
<use xlinkHref="#wave-path" x="50" y="3" fill="rgba(255,255,255,0.6)" />
|
||||
<use xlinkHref="#wave-path" x="50" y="0" fill="rgba(255,255,255,0.45)" />
|
||||
<use xlinkHref="#wave-path" x="50" y="9" fill="#fff" />
|
||||
</g>
|
||||
</svg>
|
||||
|
||||
</div>
|
||||
)
|
||||
}
|
||||
|
||||
export default memo(FirstSection);
|
||||
|
|
@ -0,0 +1,696 @@
|
|||
.home-first-section {
|
||||
height: 90vh;
|
||||
min-height: 650px;
|
||||
// background: linear-gradient(
|
||||
// #1a2358 0%,
|
||||
// #12277b 33%,
|
||||
// #0c2d8f 67%,
|
||||
// #002a89 100%
|
||||
// );
|
||||
background: linear-gradient(
|
||||
#0037AF 0%,
|
||||
#0c2d8f 100%,
|
||||
);
|
||||
|
||||
.grid-picture {
|
||||
position: relative;
|
||||
height: 100%;
|
||||
background: url(../img/grid.png) no-repeat;
|
||||
background-size: 100% auto;
|
||||
.waves {
|
||||
position: absolute;
|
||||
left: 0;
|
||||
right: 0;
|
||||
bottom: -2px;
|
||||
height: 10vh;
|
||||
}
|
||||
}
|
||||
|
||||
.website-content {
|
||||
display: flex;
|
||||
justify-content: space-between;
|
||||
align-items: center;
|
||||
height: 80vh;
|
||||
min-height: 600px;
|
||||
}
|
||||
|
||||
.website {
|
||||
position: relative;
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
justify-content: center;
|
||||
height: 100%;
|
||||
margin-right: 3.5%;
|
||||
color: #fff;
|
||||
.website-title {
|
||||
color: #fff;
|
||||
font-size: 2.4em;
|
||||
}
|
||||
.website-vision {
|
||||
display: flex;
|
||||
justify-content: space-between;
|
||||
margin-bottom: 1.3em;
|
||||
color: #ff832b;
|
||||
font-size: 1.5em;
|
||||
}
|
||||
.website-des {
|
||||
font-size: 1em;
|
||||
line-height: 2.3;
|
||||
margin-bottom: 1.5em;
|
||||
opacity: 0.8;
|
||||
}
|
||||
|
||||
.website-more {
|
||||
margin: 0;
|
||||
}
|
||||
}
|
||||
|
||||
.play-img {
|
||||
display: flex;
|
||||
flex: none;
|
||||
justify-content: center;
|
||||
align-items: flex-end;
|
||||
position: relative;
|
||||
width: 680px;
|
||||
height: 580px;
|
||||
img {
|
||||
opacity: 0;
|
||||
}
|
||||
|
||||
.play-glass {
|
||||
position: relative;
|
||||
width: 351px;
|
||||
z-index: 1;
|
||||
}
|
||||
.play-circle {
|
||||
position: absolute;
|
||||
width: 165px;
|
||||
height: 160px;
|
||||
right: 17%;
|
||||
bottom: -6.5%;
|
||||
z-index: 2;
|
||||
}
|
||||
|
||||
.play-circle-circle1,.play-circle-circle2,.play-circle-circle3,.play-circle-circle4,.play-circle-circle5 {
|
||||
position: absolute;
|
||||
width: 85px;
|
||||
height: 53px;
|
||||
right: 23.2%;
|
||||
bottom: 9%;
|
||||
z-index: 2;
|
||||
border: 1px solid rgb(73, 169, 241);
|
||||
border-radius: 50%;
|
||||
}
|
||||
|
||||
.play-pillar {
|
||||
position: absolute;
|
||||
left: -11%;
|
||||
top: 37%;
|
||||
width: 230px;
|
||||
}
|
||||
.play-box1 {
|
||||
position: absolute;
|
||||
left: -6%;
|
||||
bottom: 30%;
|
||||
width: 57px;
|
||||
}
|
||||
.play-box2 {
|
||||
position: absolute;
|
||||
left: 0%;
|
||||
bottom: 34%;
|
||||
width: 57px;
|
||||
}
|
||||
.play-box3 {
|
||||
position: absolute;
|
||||
left: 6%;
|
||||
bottom: 38%;
|
||||
width: 57px;
|
||||
}
|
||||
.play-box4 {
|
||||
position: absolute;
|
||||
left: 12%;
|
||||
bottom: 42%;
|
||||
width: 57px;
|
||||
}
|
||||
.play-code1 {
|
||||
position: absolute;
|
||||
right: 0%;
|
||||
top: 33%;
|
||||
width: 128px;
|
||||
z-index: 1;
|
||||
}
|
||||
.play-code-bed {
|
||||
position: absolute;
|
||||
right: -5%;
|
||||
top: 44%;
|
||||
width: 211px;
|
||||
z-index: 1;
|
||||
opacity: 1;
|
||||
}
|
||||
.play-logo {
|
||||
position: absolute;
|
||||
top: 25%;
|
||||
width: 87px;
|
||||
z-index: 10;
|
||||
color: #fff;
|
||||
font-size: 40px;
|
||||
}
|
||||
.play-text1 {
|
||||
position: absolute;
|
||||
z-index: 2;
|
||||
}
|
||||
.play-text2 {
|
||||
position: absolute;
|
||||
z-index: 2;
|
||||
}
|
||||
.play-text3 {
|
||||
position: absolute;
|
||||
}
|
||||
.play-text4 {
|
||||
position: absolute;
|
||||
}
|
||||
}
|
||||
|
||||
.active {
|
||||
.website {
|
||||
animation: website 0.75s 1 forwards;
|
||||
}
|
||||
.play-glass {
|
||||
animation: glass 0.75s 1 forwards;
|
||||
}
|
||||
.play-circle {
|
||||
animation: circle 0.75s 1 forwards;
|
||||
}
|
||||
.play-circle-circle1,.play-circle-circle2,.play-circle-circle3,.play-circle-circle4,.play-circle-circle5{
|
||||
animation: circle-before 0.75s 1 forwards;
|
||||
}
|
||||
.play-box1 {
|
||||
animation: box1 0.75s 1 forwards;
|
||||
}
|
||||
.play-box2 {
|
||||
animation: box2 0.75s 1 forwards;
|
||||
}
|
||||
.play-box3 {
|
||||
animation: box3 0.75s 1 forwards;
|
||||
}
|
||||
.play-box4 {
|
||||
animation: box4 0.75s 1 forwards;
|
||||
}
|
||||
// .play-code {
|
||||
// animation: code 0.75s 1 forwards;
|
||||
// }
|
||||
.play-code1 {
|
||||
animation: code1 0.75s 1 forwards;
|
||||
}
|
||||
.play-code-bed {
|
||||
animation: codeBed 0.75s 1 forwards;
|
||||
}
|
||||
.play-logo {
|
||||
animation: logo 6s 0.5s infinite; //linear
|
||||
}
|
||||
.play-text1 {
|
||||
// animation: text1-show 0.5s 1 0.5s forwards;
|
||||
animation: text1-show 6s 0.5s infinite;
|
||||
}
|
||||
.play-text2 {
|
||||
animation: text2-show 6s 0.5s infinite;
|
||||
}
|
||||
.play-text3 {
|
||||
animation: text3-show 6s 0.5s infinite;
|
||||
}
|
||||
.play-text4 {
|
||||
animation: text4-show 6s 0.5s infinite;
|
||||
}
|
||||
|
||||
.circulation {
|
||||
.play-code1 {
|
||||
animation: code1-circulation 6s infinite;
|
||||
}
|
||||
|
||||
.play-box1 {
|
||||
animation: box1-circulation 2s infinite;
|
||||
}
|
||||
|
||||
.play-box2 {
|
||||
animation: box2-circulation 2s infinite;
|
||||
}
|
||||
|
||||
.play-box3 {
|
||||
animation: box3-circulation 2s infinite;
|
||||
}
|
||||
|
||||
.play-box4 {
|
||||
animation: box4-circulation 2s infinite;
|
||||
}
|
||||
|
||||
.play-circle-circle1{
|
||||
animation: circle-circle 6s 0.25s infinite;
|
||||
}
|
||||
.play-circle-circle2{
|
||||
animation: circle-circle 6s 2.25s infinite;
|
||||
}
|
||||
.play-circle-circle3{
|
||||
animation: circle-circle 6s 4.25s infinite;
|
||||
}
|
||||
// .play-circle-circle4{
|
||||
// animation: circle-circle 6s 4.5s infinite;
|
||||
// }
|
||||
// .play-circle-circle5{
|
||||
// animation: circle-circle 6s 6s infinite;
|
||||
// }
|
||||
}
|
||||
}
|
||||
|
||||
@keyframes website {
|
||||
0% {
|
||||
top: 25vh;
|
||||
opacity: 0;
|
||||
}
|
||||
100% {
|
||||
top: 0;
|
||||
opacity: 1;
|
||||
}
|
||||
}
|
||||
|
||||
@keyframes glass {
|
||||
0% {
|
||||
opacity: 0;
|
||||
transform: rotate(-25deg);
|
||||
top: 5.5%;
|
||||
}
|
||||
100% {
|
||||
opacity: 1;
|
||||
transform: rotate(0deg);
|
||||
top: 0;
|
||||
}
|
||||
}
|
||||
|
||||
@keyframes logo {
|
||||
0% {
|
||||
opacity: 1;
|
||||
top: 23%;
|
||||
}
|
||||
50% {
|
||||
opacity: 1;
|
||||
top: 12%;
|
||||
}
|
||||
100% {
|
||||
opacity: 1;
|
||||
top: 23%;
|
||||
}
|
||||
}
|
||||
|
||||
// logo动效方案一
|
||||
// @keyframes logo {
|
||||
// 10% {
|
||||
// opacity: 0;
|
||||
// top: 33%;
|
||||
// transform: rotateY(0deg);
|
||||
// }
|
||||
// 50% {
|
||||
// opacity: 1;
|
||||
// top: 12%;
|
||||
// transform: rotateY(360deg);
|
||||
// }
|
||||
// 90% {
|
||||
// opacity: 0;
|
||||
// top: 33%;
|
||||
// transform: rotateY(360deg);
|
||||
// }
|
||||
// }
|
||||
|
||||
// logo动效方案二
|
||||
// @keyframes logo {
|
||||
// 15% {
|
||||
// opacity: 0;
|
||||
// top: 33%;
|
||||
// // transform: rotate(0deg);
|
||||
// }
|
||||
// 40% {
|
||||
// opacity: 1;
|
||||
// top: 10%;
|
||||
// transform: rotateX(0deg);
|
||||
// }
|
||||
// 60% {
|
||||
// opacity: 1;
|
||||
// top: 10%;
|
||||
// transform: rotateX(360deg);
|
||||
// }
|
||||
// 85% {
|
||||
// opacity: 0;
|
||||
// top: 40%;
|
||||
// // transform: rotateY(360deg);
|
||||
// }
|
||||
// }
|
||||
|
||||
// logo动效方案三
|
||||
// @keyframes logo {
|
||||
// 0% {
|
||||
// opacity: 1;
|
||||
// top: 10%;
|
||||
// transform: rotateY(0deg);
|
||||
// }
|
||||
|
||||
// 25% {
|
||||
// opacity: 1;
|
||||
// top: 10%;
|
||||
// transform: rotateY(90deg);
|
||||
// }
|
||||
// 50% {
|
||||
// opacity: 1;
|
||||
// top: 10%;
|
||||
// transform: rotateY(180deg);
|
||||
// }
|
||||
|
||||
// 75% {
|
||||
// opacity: 1;
|
||||
// top: 10%;
|
||||
// transform: rotateY(270deg);
|
||||
// }
|
||||
|
||||
// 100% {
|
||||
// opacity: 1;
|
||||
// top: 10%;
|
||||
// transform: rotateY(360deg);
|
||||
// }
|
||||
// }
|
||||
|
||||
@keyframes circle {
|
||||
0% {
|
||||
opacity: 0;
|
||||
bottom: -10%;
|
||||
}
|
||||
100% {
|
||||
opacity: 1;
|
||||
bottom: -6.5%;
|
||||
}
|
||||
}
|
||||
|
||||
@keyframes circle-before {
|
||||
0% {
|
||||
opacity: 0;
|
||||
bottom: -1%;
|
||||
}
|
||||
100% {
|
||||
opacity: 1;
|
||||
bottom: 9%;
|
||||
}
|
||||
}
|
||||
|
||||
|
||||
@keyframes box1 {
|
||||
0% {
|
||||
opacity: 0;
|
||||
bottom: 20%;
|
||||
}
|
||||
100% {
|
||||
opacity: 1;
|
||||
bottom: 30%;
|
||||
}
|
||||
}
|
||||
|
||||
@keyframes box2 {
|
||||
0% {
|
||||
opacity: 0;
|
||||
bottom: 24%;
|
||||
}
|
||||
100% {
|
||||
opacity: 1;
|
||||
bottom: 34%;
|
||||
}
|
||||
}
|
||||
|
||||
@keyframes box3 {
|
||||
0% {
|
||||
opacity: 0;
|
||||
bottom: 28%;
|
||||
}
|
||||
100% {
|
||||
opacity: 1;
|
||||
bottom: 38%;
|
||||
}
|
||||
}
|
||||
|
||||
@keyframes box4 {
|
||||
0% {
|
||||
opacity: 0;
|
||||
bottom: 32%;
|
||||
}
|
||||
100% {
|
||||
opacity: 1;
|
||||
bottom: 42%;
|
||||
}
|
||||
}
|
||||
|
||||
@keyframes box1-circulation {
|
||||
0% {
|
||||
opacity: 1;
|
||||
height: 60px;
|
||||
}
|
||||
48% {
|
||||
height: 65px;
|
||||
}
|
||||
52% {
|
||||
height: 65px;
|
||||
}
|
||||
100% {
|
||||
height: 60px;
|
||||
opacity: 1;
|
||||
}
|
||||
}
|
||||
|
||||
@keyframes box2-circulation {
|
||||
0% {
|
||||
height: 96px;
|
||||
opacity: 1;
|
||||
}
|
||||
48% {
|
||||
height: 90px;
|
||||
}
|
||||
52% {
|
||||
height: 90px;
|
||||
}
|
||||
100% {
|
||||
height: 96px;
|
||||
opacity: 1;
|
||||
}
|
||||
}
|
||||
|
||||
@keyframes box3-circulation {
|
||||
0% {
|
||||
height: 128px;
|
||||
opacity: 1;
|
||||
}
|
||||
48% {
|
||||
height: 135px;
|
||||
}
|
||||
52% {
|
||||
height: 135px;
|
||||
}
|
||||
100% {
|
||||
height: 128px;
|
||||
opacity: 1;
|
||||
}
|
||||
}
|
||||
|
||||
@keyframes box4-circulation {
|
||||
0% {
|
||||
height: 113px;
|
||||
opacity: 1;
|
||||
}
|
||||
48% {
|
||||
height: 108px;
|
||||
}
|
||||
52% {
|
||||
height: 108px;
|
||||
}
|
||||
100% {
|
||||
height: 113px;
|
||||
opacity: 1;
|
||||
}
|
||||
}
|
||||
|
||||
// @keyframes code {
|
||||
// 0% {
|
||||
// opacity: 0;
|
||||
// top: 40%;
|
||||
// }
|
||||
// 100% {
|
||||
// opacity: 1;
|
||||
// top: 30%;
|
||||
// }
|
||||
// }
|
||||
|
||||
@keyframes code1 {
|
||||
0% {
|
||||
opacity: 0;
|
||||
top: 43%;
|
||||
}
|
||||
100% {
|
||||
opacity: 1;
|
||||
top: 33%;
|
||||
}
|
||||
}
|
||||
|
||||
@keyframes code1-circulation {
|
||||
0% {
|
||||
opacity: 1;
|
||||
top: 33%;
|
||||
}
|
||||
50% {
|
||||
opacity: 1;
|
||||
top: 30%;
|
||||
}
|
||||
100% {
|
||||
opacity: 1;
|
||||
top: 33%;
|
||||
}
|
||||
}
|
||||
|
||||
@keyframes codeBed {
|
||||
0% {
|
||||
opacity: 0;
|
||||
top: 54%;
|
||||
}
|
||||
100% {
|
||||
opacity: 1;
|
||||
top: 44%;
|
||||
}
|
||||
}
|
||||
|
||||
@keyframes text1-show {
|
||||
5% {
|
||||
opacity: 0;
|
||||
width: 0;
|
||||
bottom: 36%;
|
||||
right: 60%;
|
||||
}
|
||||
20% {
|
||||
opacity: 1;
|
||||
width: 262px;
|
||||
bottom: 12%;
|
||||
left: 55%;
|
||||
}
|
||||
80% {
|
||||
opacity: 1;
|
||||
width: 262px;
|
||||
bottom: 12%;
|
||||
left: 55%;
|
||||
}
|
||||
100% {
|
||||
opacity: 0;
|
||||
width: 0;
|
||||
bottom: 36%;
|
||||
right: 60%;
|
||||
}
|
||||
}
|
||||
|
||||
@keyframes text2-show {
|
||||
5% {
|
||||
opacity: 0;
|
||||
width: 0;
|
||||
bottom: 36%;
|
||||
right: 60%;
|
||||
}
|
||||
20% {
|
||||
opacity: 1;
|
||||
width: 262px;
|
||||
bottom: 10%;
|
||||
right: 56%;
|
||||
}
|
||||
80% {
|
||||
opacity: 1;
|
||||
width: 262px;
|
||||
bottom: 10%;
|
||||
right: 56%;
|
||||
}
|
||||
100% {
|
||||
opacity: 0;
|
||||
width: 0;
|
||||
bottom: 36%;
|
||||
right: 60%;
|
||||
}
|
||||
}
|
||||
|
||||
@keyframes text3-show {
|
||||
5% {
|
||||
opacity: 0;
|
||||
width: 0;
|
||||
right: 36%;
|
||||
top: 50%;
|
||||
}
|
||||
20% {
|
||||
opacity: 1;
|
||||
right: 8%;
|
||||
top: 6%;
|
||||
width: 227px;
|
||||
}
|
||||
80% {
|
||||
opacity: 1;
|
||||
right: 8%;
|
||||
top: 6%;
|
||||
width: 227px;
|
||||
}
|
||||
100% {
|
||||
opacity: 0;
|
||||
width: 0;
|
||||
right: 36%;
|
||||
top: 50%;
|
||||
}
|
||||
}
|
||||
|
||||
@keyframes text4-show {
|
||||
5% {
|
||||
opacity: 0;
|
||||
width: 0;
|
||||
right: 50%;
|
||||
top: 50%;
|
||||
}
|
||||
20% {
|
||||
opacity: 1;
|
||||
top: 14%;
|
||||
right: 55%;
|
||||
width: 206px;
|
||||
}
|
||||
80% {
|
||||
opacity: 1;
|
||||
top: 14%;
|
||||
right: 55%;
|
||||
width: 206px;
|
||||
}
|
||||
100% {
|
||||
opacity: 0;
|
||||
width: 0;
|
||||
right: 50%;
|
||||
top: 50%;
|
||||
}
|
||||
}
|
||||
|
||||
@keyframes circle-circle {
|
||||
|
||||
0% {
|
||||
transform: scale(1);
|
||||
opacity: 1;
|
||||
bottom: 9%;
|
||||
}
|
||||
|
||||
33% {
|
||||
transform: scale(1.2);
|
||||
opacity: 0.7;
|
||||
bottom: 9.5%;
|
||||
}
|
||||
|
||||
|
||||
67% {
|
||||
transform: scale(1.5);
|
||||
opacity: 0.35;
|
||||
bottom: 10.2%;
|
||||
}
|
||||
|
||||
100% {
|
||||
transform: scale(2);
|
||||
opacity: 0;
|
||||
bottom: 11.5%;
|
||||
}
|
||||
}
|
||||
}
|
||||
|
|
@ -0,0 +1,32 @@
|
|||
import React, { memo } from "react";
|
||||
// import logo from '../../modules/tpm/images/hskylogo.png';
|
||||
|
||||
import './index.scss';
|
||||
|
||||
function HomeFooter() {
|
||||
let chromesettingArray = JSON.parse(localStorage.getItem('chromesetting'));
|
||||
let footerHtml= chromesettingArray.footer;
|
||||
|
||||
return (
|
||||
<div className="home-footer homePage">
|
||||
<div className="arc"></div>
|
||||
<div className="homepage-main footer-main" dangerouslySetInnerHTML={{__html:footerHtml}}>
|
||||
{/* <p>
|
||||
<span className="mr15"><i className="iconfont icon-weibiaoti- font-16"></i>+86-010-66357650</span>
|
||||
<span className="mr15"><i className="iconfont icon-xiazai18 font-16"></i> 北京市海淀区西三环北路72号</span>
|
||||
<span className="footer-email mr15"><i className="iconfont icon-mail font-16"></i>osredm@163.com</span>
|
||||
</p>
|
||||
|
||||
<p>
|
||||
版权所有：红山开源社区
|
||||
<a className="police" href="http://www.beian.gov.cn/portal/registerSystemInfo?recordcode=11010802034576">
|
||||
<img className="police-img" src="https://forge.osredm.com/police.png" />京公网安备 11010802034576 号</a>
|
||||
<a className="police-number" href="https://beian.miit.gov.cn/#/Integrated/index">京ICP备2021005060</a>
|
||||
</p>
|
||||
*/}
|
||||
</div>
|
||||
</div>
|
||||
)
|
||||
}
|
||||
|
||||
export default memo(HomeFooter);
|
||||
|
|
@ -0,0 +1,61 @@
|
|||
.home-footer {
|
||||
height: 40vh;
|
||||
min-width: 100vw;
|
||||
// background: #162046;
|
||||
background: linear-gradient(#cbdcff 0%, #162046 5%, #162046 100%);
|
||||
|
||||
overflow: hidden;
|
||||
.arc {
|
||||
position: relative;
|
||||
margin: -15vh -5vw 0 -5vw;
|
||||
height: 30vh;
|
||||
// width: 110vw;
|
||||
// background: linear-gradient(#cbdcff 0%, #bbccef 100%);
|
||||
background: #cbdcff;
|
||||
border-radius: 50%;
|
||||
}
|
||||
.logo {
|
||||
position: absolute;
|
||||
left: 20px;
|
||||
bottom: 75px;
|
||||
width: 190px;
|
||||
height: 60px;
|
||||
}
|
||||
.footer-main {
|
||||
position: relative;
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
justify-content: center;
|
||||
align-items: center;
|
||||
height: 18vh;
|
||||
font-size: 12px;
|
||||
font-family: PingFangSC-Regular, PingFang SC;
|
||||
font-weight: 400;
|
||||
color: #bdc2d1;
|
||||
line-height: 28px;
|
||||
}
|
||||
.police {
|
||||
color: #bdc2d1;
|
||||
margin-right: 20px;
|
||||
}
|
||||
.police-img {
|
||||
width: 16px;
|
||||
border-radius: 10px;
|
||||
margin-right: 3px;
|
||||
}
|
||||
.police-number {
|
||||
color: #bdc2d1;
|
||||
}
|
||||
|
||||
.footer-email {
|
||||
display: inline-flex;
|
||||
.iconfont {
|
||||
margin-right: 2px;
|
||||
}
|
||||
}
|
||||
|
||||
.footerbottom {
|
||||
background-color: #162046 !important;
|
||||
}
|
||||
}
|
||||
|
||||
|
|
@ -0,0 +1,126 @@
|
|||
import React, { memo } from 'react';
|
||||
import { Button } from 'antd';
|
||||
import Line from '../Line';
|
||||
import logoLine from '../img/4-logo.png';
|
||||
import task from '../img/4-task.png';
|
||||
import codeManage from '../img/4-codeManage.png';
|
||||
import versionManage from '../img/4-versionManage.png';
|
||||
import editorInline from '../img/4-editorInline.png';
|
||||
import teamwork from '../img/4-teamwork.png';
|
||||
import './index.scss';
|
||||
|
||||
const code = [
|
||||
{ str: <span><span className='code-blue'>latest:</span> Pulling from appleboy/drone-ssh</span> },
|
||||
{ str: <span><span className='code-red'>Digest:</span>sha256:095ca4ceafcb7</span> },
|
||||
{ str: <span>Status:Image is up to date for appleboy/drone-ssh:latest</span> },
|
||||
{ str: <span><span className='code-green'>echo ====开始部署=======</span></span> },
|
||||
// { str: <span><span className='code-green'>echo ====暂停容器开始======= </span></span> },
|
||||
{ str: <span><span className='code-red'>docker</span> rm -f mo-test</span> },
|
||||
{ str: <span><span className='code-red'>docker</span> rmi mo-test:1.0</span> },
|
||||
// { str: <span><span className='code-blue'>cd</span> /opt/demo</span> },
|
||||
{ str: <span><span className='code-red'>docker </span>build -t mo-test:1.0 .</span> },
|
||||
{ str: <span><span className='code-red'>docker </span>run -d -p 8080:8080 --name mo-test mo-test:1.0</span> },
|
||||
{ str: <span><span className='code-green'>echo ====部署成功=======</span></span> },
|
||||
{ str: <span className="code-input"><span className='code-blue'>~/opt/Users/demo/app/static/</span><span className="animation-is-typing"></span></span> },
|
||||
// { str: <span><span className='code-green'>======END======</span></span> },
|
||||
]
|
||||
|
||||
function FourthSection({ fourth, history }) {
|
||||
return (
|
||||
<div className="fourth-main homepage-main">
|
||||
<div className="fourth-title">
|
||||
<div className="fourth-main-title">
|
||||
<h2 className="homePage-blue-tit">开源项目</h2>
|
||||
<h4 className="homePage-subhead">开源项目版块集项目托管、版本管理等功能于一体，为开源协作和群智汇聚提供创作环境</h4>
|
||||
<Line />
|
||||
<Button className="homepage-btn" type="primary" onClick={()=>{history.push('/projects')}}>查看项目 <i className="iconfont icon-gengduoicon"></i></Button>
|
||||
</div>
|
||||
|
||||
<div className={fourth ? "code-box clearfix activeCode" : "code-box clearfix"} >
|
||||
<div className="code-box-action code-box-picture">
|
||||
<img src={task}></img>
|
||||
</div>
|
||||
<div className="code-box-action code-box-code">
|
||||
<div className="hadoopCode">
|
||||
<ul className="code-content">
|
||||
<li key={0}>
|
||||
<pre >
|
||||
<span className="codenum">1</span>
|
||||
<span className="">
|
||||
<span className='word-item code-blue' style={{ animationDelay: '2.4s' }}> ~/</span>
|
||||
<span className='word-item code-blue' style={{ animationDelay: '2.5s' }}>c</span>
|
||||
<span className='word-item code-blue' style={{ animationDelay: '2.6s' }}>d</span>
|
||||
<span className="code-input js-type-letters animation-is-typing" style={{ animationDelay: '2.6s' }}></span>
|
||||
<span className='word-item code-green' style={{ animationDelay: '3.3s' }}> /opt</span>
|
||||
<span className='word-item code-green' style={{ animationDelay: '3.4s' }}>/Us</span>
|
||||
<span className='word-item code-green' style={{ animationDelay: '3.5s' }}>ers</span>
|
||||
<span className='word-item code-green' style={{ animationDelay: '3.6s' }}>/de</span>
|
||||
<span className='word-item code-green' style={{ animationDelay: '3.7s' }}>mo</span>
|
||||
<span className='word-item code-green' style={{ animationDelay: '3.8s' }}>/app</span>
|
||||
<span className='word-item code-green' style={{ animationDelay: '3.9s' }}>/sta</span>
|
||||
<span className='word-item code-green' style={{ animationDelay: '4.0s' }}>tic</span>
|
||||
<span className="code-input js-type-letters animation-is-typing" style={{ animationDelay: '4.0s' }}></span>
|
||||
</span>
|
||||
</pre>
|
||||
</li>
|
||||
{
|
||||
code.map((i, k) => {
|
||||
return (
|
||||
<li key={k + 1}><pre className="word-item" style={{ animationDelay: `${k * 0.2 + 4.5}s` }}><span className="codenum">{k + 2}</span>{i.str}</pre></li>
|
||||
)
|
||||
})
|
||||
}
|
||||
</ul>
|
||||
</div>
|
||||
</div>
|
||||
<img src={logoLine}></img>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div className={fourth ? "fourth-projects activeCode" : "fourth-projects"}>
|
||||
|
||||
<div className="project-item">
|
||||
<div className="fourth-item-img">
|
||||
<img src={codeManage} />
|
||||
<div className="fourth-item-circle"></div>
|
||||
</div>
|
||||
<h3 className="fourth-item-title">代码托管</h3>
|
||||
<p className="fourth-item-des">免费提供海量代码仓储</p>
|
||||
</div>
|
||||
|
||||
<div className="project-item">
|
||||
<div className="fourth-item-img">
|
||||
<img src={versionManage} />
|
||||
<div className="fourth-item-circle"></div>
|
||||
</div>
|
||||
<h3 className="fourth-item-title">版本管理</h3>
|
||||
<p className="fourth-item-des">记录和维护软件演化全过程</p>
|
||||
</div>
|
||||
|
||||
<div className="project-item">
|
||||
<div className="fourth-item-img">
|
||||
<img src={editorInline} />
|
||||
<div className="fourth-item-circle"></div>
|
||||
</div>
|
||||
<h3 className="fourth-item-title">在线编辑</h3>
|
||||
<p className="fourth-item-des">轻量级修改和提交</p>
|
||||
</div>
|
||||
|
||||
<div className="project-item">
|
||||
<div className="fourth-item-img">
|
||||
<img src={teamwork} />
|
||||
<div className="fourth-item-circle"></div>
|
||||
</div>
|
||||
<h3 className="fourth-item-title">质量追踪</h3>
|
||||
<p className="fourth-item-des">代码安全和质量管控</p>
|
||||
</div>
|
||||
|
||||
|
||||
</div>
|
||||
|
||||
|
||||
</div>
|
||||
)
|
||||
}
|
||||
|
||||
export default memo(FourthSection);
|
||||
|
|
@ -0,0 +1,349 @@
|
|||
.home-fourth-section {
|
||||
text-align: center;
|
||||
min-height: 45vh;
|
||||
padding: 1.95em 0 1.25em 0;
|
||||
background: url(../img/4-map.png) no-repeat;
|
||||
|
||||
.homepage-btn{
|
||||
margin-top:1.25em;
|
||||
}
|
||||
.fourth-main {
|
||||
margin: 1.25em auto;
|
||||
}
|
||||
.fourth-title {
|
||||
display: flex;
|
||||
}
|
||||
.fourth-main-title {
|
||||
width: 33%;
|
||||
margin-right: 4.5%;
|
||||
}
|
||||
|
||||
.code-box {
|
||||
position: relative;
|
||||
width: 62.5%;
|
||||
img {
|
||||
float: left;
|
||||
width: 32%;
|
||||
}
|
||||
&>img{
|
||||
max-width: 20vw;
|
||||
}
|
||||
}
|
||||
.code-box-action {
|
||||
width: 67%;
|
||||
height: 20.75em;
|
||||
border-radius: 1.25em;
|
||||
}
|
||||
.code-box-picture {
|
||||
position: relative;
|
||||
float: left;
|
||||
// background: url(../img/task.png) no-repeat;
|
||||
opacity: 0;
|
||||
img {
|
||||
width: 100%;
|
||||
}
|
||||
}
|
||||
|
||||
.code-box-code {
|
||||
position: absolute;
|
||||
top: 6.25em;
|
||||
left: 10em;
|
||||
background: #fff;
|
||||
box-shadow: 0px 0px .25em .25em rgba(0, 0, 0, 0.06);
|
||||
opacity: 0;
|
||||
}
|
||||
|
||||
.hadoopCode {
|
||||
border-radius: .3em;
|
||||
margin: .625em;
|
||||
background: #1c1c25;
|
||||
padding: 1.125em 1.25em;
|
||||
flex: 1;
|
||||
position: relative;
|
||||
li {
|
||||
display: flex;
|
||||
flex-wrap: wrap;
|
||||
font-size: .75em;
|
||||
font-weight: 500;
|
||||
line-height: 2.1em;
|
||||
color: #e1e1e1;
|
||||
}
|
||||
}
|
||||
|
||||
pre {
|
||||
font-family: ui-monospace, SFMono-Regular, SF Mono, Menlo, Consolas,
|
||||
Liberation Mono, monospace;
|
||||
word-break: break-all;
|
||||
overflow: initial;
|
||||
margin-bottom: 0;
|
||||
.codenum {
|
||||
display: inline-block;
|
||||
width: .95em;
|
||||
text-align: left;
|
||||
margin-right: .95em;
|
||||
}
|
||||
.code-green {
|
||||
color: #00fa30;
|
||||
}
|
||||
.code-red {
|
||||
color: #ff5058;
|
||||
}
|
||||
.code-blue {
|
||||
color: #05cfc8;
|
||||
}
|
||||
}
|
||||
.code-input{
|
||||
position: relative;
|
||||
}
|
||||
.animation-is-typing::before {
|
||||
position: absolute;
|
||||
top: 0;
|
||||
right: -0.8em;
|
||||
bottom: 0;
|
||||
display: block;
|
||||
height: 100%;
|
||||
margin-top: auto;
|
||||
margin-bottom: auto;
|
||||
font-size: 1em;
|
||||
line-height: 1em;
|
||||
content: "▊";
|
||||
}
|
||||
.word-item {
|
||||
opacity: 0;
|
||||
}
|
||||
.js-type-letters{
|
||||
opacity: 0;
|
||||
}
|
||||
|
||||
|
||||
.fourth-projects {
|
||||
position: relative;
|
||||
display: flex;
|
||||
justify-content: space-between;
|
||||
padding: 1.25em 0;
|
||||
opacity: 0;
|
||||
}
|
||||
|
||||
.project-item {
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
justify-content: center;
|
||||
align-items: center;
|
||||
width: 15.875em;
|
||||
height: 12em;
|
||||
border: .1em dashed #517df1;
|
||||
border-radius: 0.375em;
|
||||
|
||||
.fourth-item-img {
|
||||
position: relative;
|
||||
display: flex;
|
||||
justify-content: center;
|
||||
align-items: center;
|
||||
width: 4.5em;
|
||||
height: 4.5em;
|
||||
background: #ffffff;
|
||||
border-radius: 50%;
|
||||
box-shadow: 0px 0px .5em .5em rgba(38, 118, 255, 0.04);
|
||||
}
|
||||
|
||||
.fourth-item-circle {
|
||||
position: absolute;
|
||||
width: 100%;
|
||||
height: 100%;
|
||||
animation: turnCircle infinite 10s linear;
|
||||
}
|
||||
.fourth-item-circle::before,
|
||||
.fourth-item-circle::after {
|
||||
content: "";
|
||||
position: absolute;
|
||||
width: .5em;
|
||||
height: .5em;
|
||||
border-radius: 50%;
|
||||
background: linear-gradient(-45deg, #0949ff 0, #03bdff 100%);
|
||||
}
|
||||
.fourth-item-circle::before {
|
||||
top: -.25em;
|
||||
left: 2em;
|
||||
}
|
||||
.fourth-item-circle::after {
|
||||
left: 2em;
|
||||
bottom: -.25em;
|
||||
}
|
||||
|
||||
.fourth-item-title {
|
||||
margin: 0.5em auto 0;
|
||||
font-family: PingFangSC-Medium;
|
||||
font-size: 1.25em;
|
||||
color: #0a1255;
|
||||
font-weight: 500;
|
||||
}
|
||||
|
||||
.fourth-item-des {
|
||||
font-family: PingFangSC-Medium;
|
||||
font-size: 1em;
|
||||
color: #777988;
|
||||
line-height: 2em;
|
||||
font-weight: 500;
|
||||
}
|
||||
}
|
||||
|
||||
.project-item:nth-child(2) {
|
||||
margin-top: 5em;
|
||||
border-color: #df0757;
|
||||
.fourth-item-circle {
|
||||
animation: turnCircle2 infinite 10s linear;
|
||||
}
|
||||
.fourth-item-circle::before,
|
||||
.fourth-item-circle::after {
|
||||
background: linear-gradient(-45deg, #df0757 0, #ffa38d 100%);
|
||||
}
|
||||
}
|
||||
|
||||
.project-item:nth-child(3) {
|
||||
margin-top: 10em;
|
||||
border-color: #00ffa4;
|
||||
.fourth-item-circle::before,
|
||||
.fourth-item-circle::after {
|
||||
background: linear-gradient(-45deg, #00ffa4 0, #f2ffa4 100%);
|
||||
}
|
||||
}
|
||||
|
||||
.project-item:nth-child(4) {
|
||||
margin-top: 8.75em;
|
||||
border-color: #8b5ff0;
|
||||
.fourth-item-circle {
|
||||
animation: turnCircle2 infinite 10s linear;
|
||||
}
|
||||
.fourth-item-circle::before,
|
||||
.fourth-item-circle::after {
|
||||
background: linear-gradient(-45deg, #8b5ff0 0, #fe86ff 100%);
|
||||
}
|
||||
}
|
||||
|
||||
.activeCode {
|
||||
.code-box-picture {
|
||||
animation: taskPicture 1s 1 forwards;
|
||||
}
|
||||
.code-box-code {
|
||||
animation: taskCode 1s 1 0.75s forwards;
|
||||
}
|
||||
.hadoopCode .code-content {
|
||||
margin: 0;
|
||||
animation: showBackgroud 16s 2s infinite;
|
||||
}
|
||||
|
||||
.animation-is-typing::before {
|
||||
animation: BlinkingCursor .8s infinite;
|
||||
}
|
||||
|
||||
.js-type-letters{
|
||||
animation: BlinkingCursor-1 16s infinite;
|
||||
}
|
||||
|
||||
.word-item {
|
||||
animation: show 16s infinite;
|
||||
}
|
||||
&.fourth-projects {
|
||||
animation: taskPicture 1s 1 1s forwards;
|
||||
}
|
||||
}
|
||||
|
||||
@keyframes show {
|
||||
0% {
|
||||
opacity: 0;
|
||||
}
|
||||
1% {
|
||||
opacity: 1;
|
||||
}
|
||||
70% {
|
||||
opacity: 1;
|
||||
}
|
||||
71% {
|
||||
opacity: 0;
|
||||
}
|
||||
100% {
|
||||
opacity: 0;
|
||||
}
|
||||
}
|
||||
|
||||
@keyframes BlinkingCursor-1 {
|
||||
0% {
|
||||
opacity: 0;
|
||||
}
|
||||
2% {
|
||||
opacity: 1;
|
||||
}
|
||||
4% {
|
||||
opacity: 0;
|
||||
}
|
||||
100% {
|
||||
opacity: 0;
|
||||
}
|
||||
|
||||
}
|
||||
|
||||
@keyframes BlinkingCursor {
|
||||
0% {
|
||||
opacity: 0;
|
||||
}
|
||||
100% {
|
||||
opacity: 1;
|
||||
}
|
||||
}
|
||||
|
||||
@keyframes showBackgroud {
|
||||
0% {
|
||||
opacity: 1;
|
||||
}
|
||||
71% {
|
||||
opacity: 1;
|
||||
}
|
||||
72% {
|
||||
opacity: 0;
|
||||
}
|
||||
100% {
|
||||
opacity: 0;
|
||||
}
|
||||
}
|
||||
|
||||
@keyframes taskPicture {
|
||||
0% {
|
||||
opacity: 0;
|
||||
top: 35vh;
|
||||
}
|
||||
100% {
|
||||
opacity: 1;
|
||||
top: 0;
|
||||
}
|
||||
}
|
||||
|
||||
@keyframes taskCode {
|
||||
0% {
|
||||
opacity: 0;
|
||||
top: 35vh;
|
||||
}
|
||||
100% {
|
||||
opacity: 1;
|
||||
}
|
||||
}
|
||||
|
||||
@keyframes turnCircle {
|
||||
0% {
|
||||
transform: rotate(0deg);
|
||||
}
|
||||
100% {
|
||||
transform: rotate(360deg);
|
||||
}
|
||||
}
|
||||
|
||||
@keyframes turnCircle2 {
|
||||
0% {
|
||||
transform: rotate(-90deg);
|
||||
}
|
||||
100% {
|
||||
transform: rotate(270deg);
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
|
||||
|
|
@ -0,0 +1,14 @@
|
|||
import React, { memo } from 'react';
|
||||
import './index.scss';
|
||||
|
||||
|
||||
export default memo(() => {
|
||||
return (
|
||||
<p className="home-line">
|
||||
<i className="yellow-line"></i>
|
||||
<i className="brown-line"></i>
|
||||
<i className="yellow-line"></i>
|
||||
</p>
|
||||
)
|
||||
})
|
||||
|
||||
|
|
@ -0,0 +1,20 @@
|
|||
.home-line {
|
||||
text-align: center;
|
||||
line-height: 0;
|
||||
.yellow-line {
|
||||
display: inline-block;
|
||||
width: 23px;
|
||||
height: 4px;
|
||||
background: #ff8520;
|
||||
border-radius: 3px;
|
||||
}
|
||||
.brown-line {
|
||||
display: inline-block;
|
||||
width: 38px;
|
||||
height: 4px;
|
||||
margin:0 5px;
|
||||
background: #e67a21;
|
||||
border-radius: 3px;
|
||||
|
||||
}
|
||||
}
|
||||
|
|
@ -0,0 +1,124 @@
|
|||
import React, { memo, useEffect, useState } from 'react';
|
||||
import { Button } from 'antd';
|
||||
import axios from 'axios';
|
||||
import Slider from 'react-slick';
|
||||
import "slick-carousel/slick/slick.css";
|
||||
import "slick-carousel/slick/slick-theme.css";
|
||||
import Line from '../Line';
|
||||
|
||||
import './index.scss';
|
||||
|
||||
|
||||
let setting = {
|
||||
infinite: true,
|
||||
speed: 750,
|
||||
slidesToShow: 3,
|
||||
slidesToScroll: 1,
|
||||
pauseOnDotsHover: true,
|
||||
autoplaySpeed: 4000,
|
||||
centerMode: true,
|
||||
centerPadding: "10px",
|
||||
// pauseOnFocus: true,
|
||||
autoplay: true,
|
||||
arrows: false,
|
||||
vertical: true,
|
||||
}
|
||||
|
||||
|
||||
function SecondSection({ second ,main_web_site_url}) {
|
||||
|
||||
const [leftItem, setLeftItem] = useState({});
|
||||
const [list, setList] = useState([]);
|
||||
|
||||
useEffect(() => {
|
||||
const url = `/home/platform_communicates.json`;
|
||||
axios.get(url, {
|
||||
params: {
|
||||
limit: 10,
|
||||
page: 1
|
||||
}
|
||||
}).then(result => {
|
||||
if (result && result.data) {
|
||||
let communicates = result.data.communicates;
|
||||
if (communicates.length) {
|
||||
setLeftItem(communicates[0]);
|
||||
setList(communicates.slice(1, 5));
|
||||
}
|
||||
}
|
||||
}).catch(error => { });
|
||||
}, [])
|
||||
|
||||
|
||||
function goDetail(id) {
|
||||
window.open(`${main_web_site_url}/forums/${id}/detail`);
|
||||
}
|
||||
|
||||
return (
|
||||
<React.Fragment>
|
||||
<h2 className="homePage-blue-tit">社区动态</h2>
|
||||
<h4 className="homePage-subhead">为社区用户提供自主交流空间，实现思维碰撞和智慧融合</h4>
|
||||
<Line />
|
||||
<div className="homepage-main community-main">
|
||||
|
||||
<div className={`community-left ${second ? "community-active" : ''}`}>
|
||||
<div className="community-english">C O M M U N I T Y D Y N A M I C S</div>
|
||||
<h3 className="community-star">
|
||||
<i className="iconfont icon-quxiaoguanzhu"></i>
|
||||
<i className="iconfont icon-quxiaoguanzhu"></i>
|
||||
<i className="iconfont icon-quxiaoguanzhu"></i>
|
||||
<i className="iconfont icon-quxiaoguanzhu"></i>
|
||||
<i className="iconfont icon-quxiaoguanzhu"></i>
|
||||
</h3>
|
||||
|
||||
<h4 className="community-left-tit link" onClick={() => { goDetail(leftItem.fake_id) }}>{leftItem.title}</h4>
|
||||
|
||||
<div className="community-left-content ellipsis-8">
|
||||
{leftItem.content}
|
||||
</div>
|
||||
|
||||
<div className="text-center">
|
||||
<Button className="homepage-btn" type="primary" onClick={() => { window.open(`${main_web_site_url}/forums`)}}>更多动态 <i className="iconfont icon-gengduoicon"></i></Button>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div className="home-second-section-slide">
|
||||
<Slider {...setting}>
|
||||
{
|
||||
list.map((item, i) => {
|
||||
return (
|
||||
<div className="news-slide-item" key={i}>
|
||||
<div className="slide-title" onClick={() => { goDetail(item.fake_id) }}>
|
||||
<span className="order-num">{i + 1}</span>
|
||||
<h3 className="slide-title-content ellipsis-1 link">{item.title}</h3>
|
||||
<span className={`slide-tag slide-tag-${item.type}`}>{item.tag}</span>
|
||||
</div>
|
||||
<p className="ellipsis-2">{item.content}</p>
|
||||
<span className="news-time">{item.created_time && item.created_time.split(' ')[0]}</span>
|
||||
</div>
|
||||
)
|
||||
})
|
||||
}
|
||||
</Slider>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<svg className="waves waves-low "
|
||||
viewBox="0 24 150 28" preserveAspectRatio="none" shapeRendering="auto">
|
||||
<defs>
|
||||
<path id="wave-path" d="M-160 44c30 0 58-18 88-18s 58 18 88 18 58-18 88-18 58 18 88 18 v44h-352z" />
|
||||
</defs>
|
||||
<g className="parallax">
|
||||
{/* <use xlinkHref="#wave-path" x="50" y="3" fill="rgba(4,22,112,0.2)" />
|
||||
<use xlinkHref="#wave-path" x="50" y="0" fill="rgba(4,22,112,0.2)" />
|
||||
<use xlinkHref="#wave-path" x="50" y="9" fill="#041670" /> */}
|
||||
<use xlinkHref="#wave-path" x="50" y="3" fill="rgba(0,55,175,0.2)" />
|
||||
<use xlinkHref="#wave-path" x="50" y="0" fill="rgba(0,55,175,0.2)" />
|
||||
<use xlinkHref="#wave-path" x="50" y="9" fill="#0037AF" />
|
||||
</g>
|
||||
</svg>
|
||||
</React.Fragment>
|
||||
|
||||
)
|
||||
}
|
||||
|
||||
export default memo(SecondSection);
|
||||
|
|
@ -0,0 +1,167 @@
|
|||
.home-second-section {
|
||||
background: linear-gradient(#fff 0%, #cbdcff 100%);
|
||||
text-align: center;
|
||||
padding-top: 40px;
|
||||
margin-bottom: -10px;
|
||||
|
||||
.community-left-tit {
|
||||
font-size: 1.15em;
|
||||
color: #000870;
|
||||
}
|
||||
|
||||
.community-main {
|
||||
display: flex;
|
||||
justify-content: space-between;
|
||||
margin: 1.25em auto 3.15em;
|
||||
text-align: left;
|
||||
|
||||
.homepage-btn {
|
||||
margin-top: 2.5em;
|
||||
}
|
||||
}
|
||||
|
||||
.community-english {
|
||||
font-size: 1.25em;
|
||||
opacity: 0.88;
|
||||
color: #e67a21;
|
||||
margin-right: 1.25em;
|
||||
}
|
||||
|
||||
.community-star {
|
||||
color: #ff7a21;
|
||||
i {
|
||||
margin-right: 0.5em;
|
||||
}
|
||||
}
|
||||
|
||||
.community-left {
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
justify-content: center;
|
||||
width: 50%;
|
||||
padding-right: 20px;
|
||||
opacity: 0;
|
||||
text-align: left;
|
||||
}
|
||||
.community-left-content {
|
||||
font-size: .95em;
|
||||
font-family: PingFangSC-Regular, PingFang SC;
|
||||
font-weight: 400;
|
||||
color: #3c476e;
|
||||
line-height: 2.25em;
|
||||
}
|
||||
|
||||
.community-active {
|
||||
position: relative;
|
||||
animation: community 0.75s 1 forwards;
|
||||
}
|
||||
|
||||
@keyframes community {
|
||||
0% {
|
||||
right: 50vw;
|
||||
opacity: 0;
|
||||
}
|
||||
100% {
|
||||
right: 0;
|
||||
opacity: 1;
|
||||
transition: all 2s;
|
||||
}
|
||||
}
|
||||
|
||||
// .parallax > use:nth-child(1) {
|
||||
// animation-delay: -5s;
|
||||
// animation-duration: 20s;
|
||||
// }
|
||||
}
|
||||
|
||||
.home-second-section-slide {
|
||||
width: 50%;
|
||||
.slick-track > div {
|
||||
max-width: 83.3%;
|
||||
position: relative;
|
||||
transition: all 0.7s;
|
||||
}
|
||||
.news-slide-item {
|
||||
height: 11.25em;
|
||||
overflow: hidden;
|
||||
background-image: linear-gradient(
|
||||
to bottom right,
|
||||
#e9f5ff 0%,
|
||||
#f1f2fd 25%,
|
||||
#e8f2ff 50%,
|
||||
#e1eaff 75%,
|
||||
#c6d3ff 100%
|
||||
);
|
||||
margin-bottom: 10px;
|
||||
padding: 1.25em 1.8em 1.6em;
|
||||
border: 1px solid #fff;
|
||||
border-radius: .3em;
|
||||
|
||||
.slide-title {
|
||||
display: flex;
|
||||
align-items: center;
|
||||
}
|
||||
.slide-title-content {
|
||||
color: #000870;
|
||||
font-size: 1em;
|
||||
margin-bottom: 0 !important;
|
||||
flex: auto;
|
||||
}
|
||||
.order-num {
|
||||
flex: none;
|
||||
display: inline-block;
|
||||
margin-right: 1em;
|
||||
color: #fff;
|
||||
border-radius: 50%;
|
||||
width: 1.75em;
|
||||
height: 1.75em;
|
||||
line-height: 1.75em;
|
||||
background: linear-gradient(
|
||||
272deg,
|
||||
#4154f1 0%,
|
||||
#4154f1 47%,
|
||||
#4154f1 100%
|
||||
);
|
||||
box-shadow: 0px 0px 9px 2px rgba(65, 84, 241, 0.33);
|
||||
text-align: center;
|
||||
}
|
||||
|
||||
.slide-tag {
|
||||
flex: none;
|
||||
color: #fff;
|
||||
padding: .2em .75em;
|
||||
background: #586dff;
|
||||
border-radius: .2em;
|
||||
}
|
||||
|
||||
.slide-tag-1{
|
||||
background: #586dff;
|
||||
}
|
||||
|
||||
.slide-tag-2 {
|
||||
background: #e53939;
|
||||
}
|
||||
|
||||
.slide-tag-3 {
|
||||
background: #ff7300;
|
||||
}
|
||||
|
||||
|
||||
.news-time {
|
||||
font-size: .95em;
|
||||
font-weight: 400;
|
||||
color: #3c476e;
|
||||
}
|
||||
|
||||
p {
|
||||
margin:1em 0 .5em;
|
||||
color: #3c476e;
|
||||
font-size: .9em;
|
||||
|
||||
}
|
||||
}
|
||||
.slick-center {
|
||||
margin-left: 100px;
|
||||
}
|
||||
|
||||
}
|
||||
|
|
@ -0,0 +1,89 @@
|
|||
import React, { memo, useEffect, useState } from 'react';
|
||||
import { Button } from 'antd';
|
||||
import axios from 'axios';
|
||||
import Slider from 'react-slick';
|
||||
import "slick-carousel/slick/slick.css";
|
||||
import "slick-carousel/slick/slick-theme.css";
|
||||
import { getTestImage } from "educoder";
|
||||
import Line from '../Line';
|
||||
|
||||
|
||||
import './index.scss';
|
||||
|
||||
|
||||
let setting = {
|
||||
infinite: true,
|
||||
dots:true,
|
||||
speed: 750,
|
||||
slidesToShow: 1,
|
||||
slidesToScroll: 1,
|
||||
pauseOnDotsHover: true,
|
||||
autoplaySpeed: 5000,
|
||||
// pauseOnFocus: true,
|
||||
centerMode: true,
|
||||
centerPadding: "0px",
|
||||
autoplay: true,
|
||||
arrows: false,
|
||||
}
|
||||
|
||||
|
||||
function SeventhSection({ main_web_site_url }) {
|
||||
|
||||
const [list, setList] = useState([]);
|
||||
|
||||
useEffect(() => {
|
||||
const url = `/home/platform_people.json`;
|
||||
axios.get(url, {
|
||||
params: {
|
||||
limit: 6,
|
||||
page: 1
|
||||
}
|
||||
}).then(result => {
|
||||
if (result && result.data) {
|
||||
setList(result.data.people);
|
||||
}
|
||||
}).catch(error => { });
|
||||
}, [])
|
||||
|
||||
function goDetail(fake_login) {
|
||||
window.open(`${main_web_site_url}/accounts/${fake_login}`);
|
||||
}
|
||||
|
||||
return (
|
||||
<div className="homepage-main seventh-main">
|
||||
<h2 className="homePage-blue-tit">论坛交流</h2>
|
||||
<h4 className="homePage-subhead">论坛交流版块通过技术交流、学术探讨等方式，为社区用户提供自主交流空间，实现思维碰撞和智慧融合</h4>
|
||||
<Line />
|
||||
<div className="clients">
|
||||
{
|
||||
list.map((item, i) => {
|
||||
return (<img className="client link" key={i} src={getTestImage(item.image_url)} onClick={() => { goDetail(item.fake_login) }} alt="images-not_found" />)
|
||||
})
|
||||
}
|
||||
<i className="start-icon iconfont icon-a-shuangyinhao12x"></i>
|
||||
<i className="end-icon iconfont icon-a-shuangyinhao12x"></i>
|
||||
|
||||
</div>
|
||||
<Slider {...setting}>
|
||||
{
|
||||
list.map((item, i) => {
|
||||
return (<div className="issue-item" key={i} >
|
||||
<img className="author-head link" src={getTestImage(item.image_url)} onClick={() => { goDetail(item.fake_login) }} alt="images-not_found" />
|
||||
<span className="issue-author link" onClick={() => { goDetail(item.fake_login) }}>{item.name}</span>
|
||||
<h3 className="issue-title ellipsis-1">{item.announcement}</h3>
|
||||
<p className="issue-content ellipsis-5">{item.content}</p>
|
||||
<span className="issue-time">{item.created_time && item.created_time.split(' ')[0]}</span>
|
||||
</div>)
|
||||
})
|
||||
}
|
||||
|
||||
</Slider>
|
||||
|
||||
<Button className="homepage-btn" type="primary" onClick={() => { window.open(`${main_web_site_url}/forums`) }}>参与交流 <i className="iconfont icon-gengduoicon"></i></Button>
|
||||
|
||||
</div>
|
||||
|
||||
)
|
||||
}
|
||||
|
||||
export default memo(SeventhSection);
|
||||
|
|
@ -0,0 +1,207 @@
|
|||
.home-seventh-section {
|
||||
background: linear-gradient(#fff 0%, #cbdcff 100%);
|
||||
text-align: center;
|
||||
padding-top: 2.5em;
|
||||
padding-bottom: 0.625em;
|
||||
z-index: 100000;
|
||||
margin-bottom: -0.625em;
|
||||
border-bottom: 1px solid #cbdcff;
|
||||
.seventh-main {
|
||||
position: relative;
|
||||
}
|
||||
.clients {
|
||||
position: absolute;
|
||||
width: 100%;
|
||||
height: 31.25em;
|
||||
left: 0;
|
||||
bottom: 2.5em;
|
||||
// z-index: 10;
|
||||
.client {
|
||||
position: absolute;
|
||||
width: 6.25em;
|
||||
height: 6.25em;
|
||||
border-radius: 50%;
|
||||
z-index: 100;
|
||||
}
|
||||
|
||||
.client:nth-child(1) {
|
||||
top: 0;
|
||||
left: 0;
|
||||
animation: zoomin 0.9s infinite alternate;
|
||||
}
|
||||
.client:nth-child(2) {
|
||||
top: 11.875em;
|
||||
left: -7.1875em;
|
||||
animation: zoomin 1.3s infinite alternate;
|
||||
}
|
||||
.client:nth-child(3) {
|
||||
left: 0;
|
||||
bottom: 4.375em;
|
||||
animation: zoomin 1.6s infinite alternate;
|
||||
}
|
||||
.client:nth-child(4) {
|
||||
top: 2.5em;
|
||||
right: 0;
|
||||
animation: zoomin 1.9s infinite alternate;
|
||||
}
|
||||
.client:nth-child(5) {
|
||||
right: -5.3125em;
|
||||
bottom: 8.4375em;
|
||||
animation: zoomin 2.1s infinite alternate;
|
||||
}
|
||||
.client:nth-child(6) {
|
||||
right: 9.375em;
|
||||
bottom: 0.625em;
|
||||
animation: zoomin 1.6s infinite alternate;
|
||||
}
|
||||
|
||||
.icon-a-shuangyinhao12x {
|
||||
position: absolute;
|
||||
color: #ef7a30;
|
||||
font-size: 2.25em !important ;
|
||||
}
|
||||
.start-icon {
|
||||
top: 50px;
|
||||
left: 280px;
|
||||
transform: rotateY(180deg);
|
||||
z-index: 100;
|
||||
}
|
||||
.end-icon {
|
||||
bottom: 130px;
|
||||
right: 330px;
|
||||
z-index: 100;
|
||||
}
|
||||
}
|
||||
|
||||
.slick-dots {
|
||||
height: 31.25em;
|
||||
left: 0;
|
||||
bottom: -4.5em;
|
||||
z-index: 101;
|
||||
li {
|
||||
position: absolute;
|
||||
width: 7em;
|
||||
height: 7em;
|
||||
border-radius: 50%;
|
||||
button{
|
||||
width: inherit;
|
||||
height: inherit;
|
||||
&:before {
|
||||
width: inherit;
|
||||
height: inherit;
|
||||
color: #fff;
|
||||
opacity: 0;
|
||||
}
|
||||
}
|
||||
|
||||
}
|
||||
li:nth-child(1) {
|
||||
top: -.5em;
|
||||
left: -.5em;
|
||||
}
|
||||
li:nth-child(2) {
|
||||
top: 11.875em;
|
||||
left: -7.6875em;
|
||||
}
|
||||
li:nth-child(3) {
|
||||
left: -.5em;
|
||||
bottom: 3.875em;
|
||||
}
|
||||
li:nth-child(4) {
|
||||
top: 2.5em;
|
||||
right: -.5em;
|
||||
}
|
||||
li:nth-child(5) {
|
||||
right: -5.8125em;
|
||||
bottom: 8em;
|
||||
}
|
||||
li:nth-child(6) {
|
||||
right: 8.875em;
|
||||
bottom: 0.125em;
|
||||
}
|
||||
}
|
||||
.slick-slider {
|
||||
margin: 2.5em auto 1.25em;
|
||||
height: 30em;
|
||||
background: url(../img/7-bg.png) no-repeat;
|
||||
background-size: 50.25em 29.625em;
|
||||
background-position: center;
|
||||
}
|
||||
.slick-list {
|
||||
width: 33.75em;
|
||||
margin: 0 auto;
|
||||
z-index: 10000;
|
||||
}
|
||||
.issue-item {
|
||||
text-align: center;
|
||||
|
||||
.author-head {
|
||||
width: 8.125em;
|
||||
height: 8.125em;
|
||||
border-radius: 50%;
|
||||
margin: 0 auto;
|
||||
}
|
||||
.issue-author {
|
||||
display: inline-block;
|
||||
font-size: 1.125em;
|
||||
font-weight: 500;
|
||||
color: #ff7300;
|
||||
line-height: 1.75em;
|
||||
margin: 0.625em auto;
|
||||
}
|
||||
.issue-title {
|
||||
font-size: 1.25em;
|
||||
font-weight: 500;
|
||||
color: #000870;
|
||||
line-height: 1.75em;
|
||||
margin-bottom: 1.25em;
|
||||
}
|
||||
.issue-content {
|
||||
text-align: left;
|
||||
text-indent: 2em;
|
||||
font-size: 15px;
|
||||
font-weight: 400;
|
||||
color: #3c476e;
|
||||
line-height: 28px;
|
||||
}
|
||||
.issue-time {
|
||||
height: 28px;
|
||||
font-size: 15px;
|
||||
color: #3c476e;
|
||||
line-height: 28px;
|
||||
}
|
||||
}
|
||||
|
||||
.homepage-btn {
|
||||
margin-top: 50px;
|
||||
}
|
||||
|
||||
@keyframes zoomin {
|
||||
0% {
|
||||
transform: scale(0.9);
|
||||
}
|
||||
|
||||
100% {
|
||||
transform: scale(1.1);
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
@media screen and (max-width: 1400px) {
|
||||
.home-seventh-section {
|
||||
.slick-dots,.clients {
|
||||
width: 86%;
|
||||
left: 8%;
|
||||
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
@media screen and (max-width: 1200px) {
|
||||
.home-seventh-section {
|
||||
.slick-dots,.clients {
|
||||
width: 80%;
|
||||
left: 11%;
|
||||
}
|
||||
}
|
||||
}
|
||||
|
|
@ -0,0 +1,97 @@
|
|||
import React, { memo, useEffect, useState } from 'react';
|
||||
import { Button } from 'antd';
|
||||
import axios from 'axios';
|
||||
import Line from '../Line';
|
||||
import completeIcon1 from '../img/6-completeIcon1.png';
|
||||
import completeIcon2 from '../img/6-completeIcon2.png';
|
||||
import completeIcon3 from '../img/6-completeIcon3.png';
|
||||
import ball from '../img/6-ball.png';
|
||||
import cup from '../img/6-cup.png';
|
||||
import yLetter from '../img/6-y.png';
|
||||
import net from '../img/6-net.png';
|
||||
import overall from '../img/6-overall.png';
|
||||
import pillar1 from '../img/6-pillar1.png';
|
||||
import pillar2 from '../img/6-pillar2.png';
|
||||
import pillar3 from '../img/6-pillar3.png';
|
||||
import './index.scss';
|
||||
let iconArr = [completeIcon1, completeIcon2, completeIcon3];
|
||||
|
||||
|
||||
function SixthSection({ sixth, main_web_site_url }) {
|
||||
|
||||
const [list, setList] = useState();
|
||||
|
||||
useEffect(() => {
|
||||
const url = `/home/competitions.json`;
|
||||
axios.get(url).then(result => {
|
||||
if (result && result.data) {
|
||||
setList(result.data.competitions);
|
||||
}
|
||||
}).catch(error => { });
|
||||
}, [])
|
||||
|
||||
function goDetail(id) {
|
||||
window.open(`${main_web_site_url}/competitions/${id}/enroll`);
|
||||
}
|
||||
|
||||
return (
|
||||
<div className="grid-picture">
|
||||
<div className="homepage-main sixth-main">
|
||||
|
||||
<div className={sixth ? "active complete-des" : "complete-des"}>
|
||||
|
||||
{
|
||||
list && list.map((item, i) => {
|
||||
return (
|
||||
<div className="des-item" key={i}>
|
||||
<img className="des-item-img" alt="竞赛" src={iconArr[i]}></img>
|
||||
<div className="des-item-content">
|
||||
<h4 className="des-item-title ellipsis-1 link" onClick={() => { goDetail(item.id) }}>{item.title}</h4>
|
||||
<p className="des-item-time">竞赛时间：{item.start_time && item.start_time.split(' ')[0]}-{item.end_time && item.end_time.split(' ')[0]}</p>
|
||||
<p className="des-item-intro ellipsis-2">赛事简介： {item.content||'暂无简介'}</p>
|
||||
</div>
|
||||
</div>
|
||||
)
|
||||
})
|
||||
}
|
||||
</div>
|
||||
|
||||
<div className="sixth-right">
|
||||
<div className="sixth-right-title">
|
||||
<h2 className="homePage-white-tit">开放竞赛</h2>
|
||||
<h4 className="homePage-white-subhead">开放竞赛版块通过赛事和学术活动组织，为验证技术成果、挖掘优秀人才提供有效途径</h4>
|
||||
<Line />
|
||||
</div>
|
||||
|
||||
<div className="sixth-play-img">
|
||||
<img alt="images-not_found" className="overall" src={overall}></img>
|
||||
<img alt="images-not_found" className="ball" src={ball}></img>
|
||||
<img alt="images-not_found" className="cup" src={cup}></img>
|
||||
<img alt="images-not_found" className="net" src={net}></img>
|
||||
<img alt="images-not_found" className="yLetter" src={yLetter}></img>
|
||||
<img alt="images-not_found" className="pillar3" src={pillar3}></img>
|
||||
<img alt="images-not_found" className="pillar2" src={pillar2}></img>
|
||||
<img alt="images-not_found" className="pillar1" src={pillar1}></img>
|
||||
|
||||
</div>
|
||||
</div>
|
||||
|
||||
</div>
|
||||
|
||||
<Button className="homepage-btn" type="primary" onClick={() => { window.open(`${main_web_site_url}/competitions`) }}>我要参赛 <i className="iconfont icon-gengduoicon"></i></Button>
|
||||
<svg className="waves"
|
||||
viewBox="0 24 150 28" preserveAspectRatio="none" shapeRendering="auto">
|
||||
<defs>
|
||||
<path id="wave-path" d="M-160 44c30 0 58-18 88-18s 58 18 88 18 58-18 88-18 58 18 88 18 v44h-352z" />
|
||||
</defs>
|
||||
<g className="parallax">
|
||||
<use xlinkHref="#wave-path" x="50" y="3" fill="rgba(255,255,255,0.5)" />
|
||||
<use xlinkHref="#wave-path" x="50" y="0" fill="rgba(255,255,255,0.4)" />
|
||||
<use xlinkHref="#wave-path" x="50" y="9" fill="#fff" />
|
||||
</g>
|
||||
</svg>
|
||||
|
||||
</div>
|
||||
)
|
||||
}
|
||||
export default memo(SixthSection);
|
||||
|
|
@ -0,0 +1,293 @@
|
|||
.home-sixth-section {
|
||||
position: relative;
|
||||
color: #fff;
|
||||
background: linear-gradient(#0037AF 0%, #2951da 100%);
|
||||
text-align: center;
|
||||
margin-bottom: -2px;
|
||||
z-index: 10;
|
||||
.grid-picture {
|
||||
background: url(../img/grid.png) no-repeat;
|
||||
background-size: auto 100%;
|
||||
padding-bottom: 6.25em;
|
||||
}
|
||||
|
||||
.sixth-main {
|
||||
display: flex;
|
||||
padding-top: 10vh;
|
||||
overflow: visible;
|
||||
}
|
||||
|
||||
.des-item {
|
||||
position: relative;
|
||||
opacity: 0;
|
||||
display: flex;
|
||||
padding: .9375em;
|
||||
margin: 1.875em 0;
|
||||
align-items: center;
|
||||
width: 30em;
|
||||
height: 10.625em;
|
||||
background: rgba(255, 255, 255, 0.06);
|
||||
box-shadow: 0px 0px .625em .3125em rgba(38, 118, 255, 0.04);
|
||||
border-radius: .625em;
|
||||
border: 1px transparent solid;
|
||||
border-image: linear-gradient(
|
||||
to right,
|
||||
rgba(255, 255, 255, 0.2),
|
||||
rgba(255, 255, 255, 1),
|
||||
rgba(255, 255, 255, 0.2)
|
||||
)
|
||||
1 10;
|
||||
|
||||
p{
|
||||
margin-bottom: .5em;
|
||||
}
|
||||
}
|
||||
|
||||
.des-item:nth-child(2) {
|
||||
margin: 3.75em 0 0 1.25em;
|
||||
}
|
||||
|
||||
.des-item:nth-child(3) {
|
||||
margin: 3.75em 0 0 2.5em;
|
||||
}
|
||||
|
||||
.des-item-img {
|
||||
width: 6.25em;
|
||||
height: 6.25em;
|
||||
flex: none;
|
||||
}
|
||||
|
||||
.des-item-content {
|
||||
width: 21.75em;
|
||||
text-align: left;
|
||||
font-size: .9375em;
|
||||
font-weight: 400;
|
||||
line-height: 1.75em;
|
||||
opacity: .8;
|
||||
.des-item-title {
|
||||
font-size: 1.125em;
|
||||
font-family: PingFangSC-Medium, PingFang SC;
|
||||
font-weight: 500;
|
||||
color: #ff9931;
|
||||
line-height: 1.5625em;
|
||||
}
|
||||
}
|
||||
|
||||
.sixth-right {
|
||||
width: 42.5em;
|
||||
overflow: visible;
|
||||
}
|
||||
.sixth-right-title {
|
||||
margin-left: 5em;
|
||||
width: 28.125em;
|
||||
text-align: left;
|
||||
|
||||
.home-line {
|
||||
text-align: left;
|
||||
}
|
||||
}
|
||||
.sixth-play-img {
|
||||
width: 48.1825em;
|
||||
position: relative;
|
||||
|
||||
.ball {
|
||||
position: absolute;
|
||||
top: 18.75em;
|
||||
left: 6.875em;
|
||||
z-index: 1;
|
||||
width: 2.0625em;
|
||||
animation: ball infinite 5s linear;
|
||||
}
|
||||
|
||||
.cup {
|
||||
position: absolute;
|
||||
top: 15%;
|
||||
left: 45%;
|
||||
z-index: 1;
|
||||
width: 5.75em;
|
||||
animation: cup infinite 4s;
|
||||
}
|
||||
|
||||
.net {
|
||||
position: absolute;
|
||||
top: 9%;
|
||||
left: 22%;
|
||||
z-index: 1;
|
||||
width: 3.75em;
|
||||
animation: net infinite 4s 1s;
|
||||
}
|
||||
|
||||
.yLetter {
|
||||
position: absolute;
|
||||
top: 6%;
|
||||
right: 17%;
|
||||
z-index: 1;
|
||||
width: 3.4375em;
|
||||
animation: yLetter infinite 4s 1.5s;
|
||||
}
|
||||
|
||||
.pillar1 {
|
||||
position: absolute;
|
||||
bottom: 10%;
|
||||
left: 43%;
|
||||
z-index: 1;
|
||||
width: 2.25em;
|
||||
height: 2.625em;
|
||||
animation: pillar1 infinite 3s;
|
||||
}
|
||||
.pillar2 {
|
||||
position: absolute;
|
||||
bottom: 12%;
|
||||
left: 40%;
|
||||
z-index: 1;
|
||||
width: 1.75em;
|
||||
height: 3.125em;
|
||||
animation: pillar2 infinite 3s;
|
||||
}
|
||||
.pillar3 {
|
||||
position: absolute;
|
||||
bottom: 12%;
|
||||
left: 42%;
|
||||
z-index: 1;
|
||||
width: 1.75em;
|
||||
height: 3.6875em;
|
||||
animation: pillar3 infinite 3s;
|
||||
}
|
||||
}
|
||||
|
||||
.overall {
|
||||
width: 47.4375em;
|
||||
}
|
||||
|
||||
.homepage-btn{
|
||||
margin-top: 0;
|
||||
background-color: #4F7DFF ;
|
||||
}
|
||||
|
||||
.waves {
|
||||
position: absolute;
|
||||
left: 0;
|
||||
right: 0;
|
||||
bottom: -2px;
|
||||
}
|
||||
|
||||
.complete-des.active {
|
||||
.des-item {
|
||||
animation: showTop 1s 1 forwards;
|
||||
}
|
||||
.des-item:nth-child(2) {
|
||||
animation: showTop 1s 1 .75s forwards;
|
||||
}
|
||||
.des-item:nth-child(3) {
|
||||
animation: showTop 1s 1 1.5s forwards;
|
||||
}
|
||||
}
|
||||
|
||||
@keyframes showTop {
|
||||
0% {
|
||||
opacity: 0;
|
||||
top: 30vh;
|
||||
}
|
||||
100% {
|
||||
opacity: 1;
|
||||
top: 0;
|
||||
}
|
||||
}
|
||||
|
||||
@keyframes ball {
|
||||
0% {
|
||||
transform: rotate(0deg);
|
||||
}
|
||||
100% {
|
||||
transform: rotate(-360deg);
|
||||
}
|
||||
}
|
||||
|
||||
@keyframes cup {
|
||||
0% {
|
||||
top: 12%;
|
||||
}
|
||||
45% {
|
||||
top: 20%;
|
||||
}
|
||||
55% {
|
||||
top: 20%;
|
||||
}
|
||||
100% {
|
||||
top: 12%;
|
||||
}
|
||||
}
|
||||
|
||||
@keyframes net {
|
||||
0% {
|
||||
top: 2%;
|
||||
}
|
||||
45% {
|
||||
top: 9%;
|
||||
}
|
||||
55% {
|
||||
top: 9%;
|
||||
}
|
||||
100% {
|
||||
top: 2%;
|
||||
}
|
||||
}
|
||||
@keyframes yLetter {
|
||||
0% {
|
||||
top: 0%;
|
||||
}
|
||||
45% {
|
||||
top: 6%;
|
||||
}
|
||||
55% {
|
||||
top: 6%;
|
||||
}
|
||||
100% {
|
||||
top: 0%;
|
||||
}
|
||||
}
|
||||
@keyframes pillar1 {
|
||||
0% {
|
||||
height: 2.5em;
|
||||
}
|
||||
48% {
|
||||
height: 2em;
|
||||
}
|
||||
52% {
|
||||
height: 2em;
|
||||
}
|
||||
100% {
|
||||
height: 2.5em;
|
||||
}
|
||||
}
|
||||
|
||||
@keyframes pillar2 {
|
||||
0% {
|
||||
height: 2.5em;
|
||||
}
|
||||
48% {
|
||||
height: 4.0625em;
|
||||
}
|
||||
52% {
|
||||
height: 4.0625em;
|
||||
}
|
||||
100% {
|
||||
height: 2.5em;
|
||||
}
|
||||
}
|
||||
|
||||
@keyframes pillar3 {
|
||||
0% {
|
||||
height: 4.0625em;
|
||||
}
|
||||
48% {
|
||||
height: 2.5em;
|
||||
}
|
||||
52% {
|
||||
height: 2.5em;
|
||||
}
|
||||
100% {
|
||||
height: 4.0625em;
|
||||
}
|
||||
}
|
||||
}
|
||||
|
|
@ -0,0 +1,96 @@
|
|||
import React, { memo, useEffect, useState } from 'react';
|
||||
import CountUp from 'react-countup';
|
||||
import axios from 'axios';
|
||||
import Line from '../Line';
|
||||
import './index.scss';
|
||||
|
||||
const countUpProps = {
|
||||
redraw: true,
|
||||
start: 0,
|
||||
duration: 1
|
||||
};
|
||||
|
||||
|
||||
function ThirdSection({ third }) {
|
||||
const [statisticsNum, setStatisticsNum] = useState({});
|
||||
|
||||
useEffect(() => {
|
||||
const url = `/home/platform_statistics.json`;
|
||||
axios.get(url).then(result => {
|
||||
if (result && result.data) {
|
||||
setStatisticsNum(result.data);
|
||||
}
|
||||
}).catch(error => { });
|
||||
}, [])
|
||||
|
||||
return (
|
||||
<div className="ball-background">
|
||||
<h2 className="third-tit">数据统计总览</h2>
|
||||
<Line />
|
||||
<div className="homepage-main third-main ">
|
||||
<div className="circle-item">
|
||||
<div className="circle-item-box">
|
||||
<div className="circle-item-num" style={{fontSize:statisticsNum.visits>9999999?'24px':statisticsNum.visits>99999?'36px':'48px'}}>
|
||||
<CountUp
|
||||
{...countUpProps}
|
||||
end={statisticsNum.visits}
|
||||
/>
|
||||
</div>
|
||||
</div>
|
||||
<h4>平台点击量</h4>
|
||||
</div>
|
||||
|
||||
<div className="circle-item">
|
||||
<div className="circle-item-box">
|
||||
<div className="circle-item-num">
|
||||
<CountUp {...countUpProps} end={statisticsNum.users_count} />
|
||||
</div>
|
||||
</div>
|
||||
<h4 >平台用户数</h4>
|
||||
</div>
|
||||
|
||||
<div className="circle-item">
|
||||
<div className="circle-item-box">
|
||||
<div className="circle-item-num">
|
||||
<CountUp {...countUpProps} end={statisticsNum.projects_count} />
|
||||
</div>
|
||||
</div>
|
||||
<h4 >开源项目托管数</h4>
|
||||
</div>
|
||||
|
||||
<div className="circle-item">
|
||||
<div className="circle-item-box">
|
||||
<div className="circle-item-num">
|
||||
<CountUp {...countUpProps} end={statisticsNum.tasks_count} />
|
||||
</div>
|
||||
</div>
|
||||
<h4 >创客任务发布数</h4>
|
||||
</div>
|
||||
|
||||
<div className="circle-item">
|
||||
<div className="circle-item-box">
|
||||
<div className="circle-item-num">
|
||||
<CountUp {...countUpProps} end={statisticsNum.memos_count} />
|
||||
</div>
|
||||
</div>
|
||||
<h4 >论坛发帖数量</h4>
|
||||
</div>
|
||||
|
||||
</div>
|
||||
|
||||
<svg className="waves waves-low "
|
||||
viewBox="0 24 150 28" preserveAspectRatio="none" shapeRendering="auto">
|
||||
<defs>
|
||||
<path id="wave-path" d="M-160 44c30 0 58-18 88-18s 58 18 88 18 58-18 88-18 58 18 88 18 v44h-352z" />
|
||||
</defs>
|
||||
<g className="parallax">
|
||||
<use xlinkHref="#wave-path" x="50" y="0" fill="rgba(255,255,255,0.7" />
|
||||
<use xlinkHref="#wave-path" x="50" y="0" fill="rgba(255,255,255,0.4)" />
|
||||
<use xlinkHref="#wave-path" x="50" y="9" fill="#fff" />
|
||||
</g>
|
||||
</svg>
|
||||
</div>
|
||||
)
|
||||
}
|
||||
|
||||
export default memo(ThirdSection);
|
||||
|
|
@ -0,0 +1,168 @@
|
|||
.home-third-section {
|
||||
color: #fff;
|
||||
background: linear-gradient(
|
||||
#0037AF 0%,
|
||||
#2951DA 100%,
|
||||
);
|
||||
text-align: center;
|
||||
// #041670 0%,
|
||||
|
||||
.ball-background{
|
||||
background: url(../img/3-ballBg.png) no-repeat;
|
||||
background-size: 100% 100%;
|
||||
}
|
||||
.third-tit {
|
||||
padding-top: 1.75em;
|
||||
color: #fff;
|
||||
font-size: 2em;
|
||||
}
|
||||
|
||||
.third-main {
|
||||
display: flex;
|
||||
justify-content: space-around;
|
||||
max-width: 100%;
|
||||
margin: 10vh auto;
|
||||
}
|
||||
|
||||
.circle-item > h4 {
|
||||
margin-top: 1.25em;
|
||||
color: #fff;
|
||||
font-weight: 600;
|
||||
font-size: 1.15rem;
|
||||
}
|
||||
|
||||
.circle-item-box {
|
||||
position: relative;
|
||||
width: 10.25em;
|
||||
height: 10.25em;
|
||||
box-sizing: border-box;
|
||||
padding: .25em;
|
||||
border-radius: 50%;
|
||||
background-image: linear-gradient(
|
||||
to bottom right,
|
||||
rgba(255, 255, 255, 0.63) 0%,
|
||||
rgba(55, 236, 255, 0.56) 33%,
|
||||
rgba(255, 255, 255, 0.42) 67%,
|
||||
rgba(255, 255, 255, 0.45) 100%
|
||||
);
|
||||
}
|
||||
|
||||
.circle-item-num {
|
||||
position: relative;
|
||||
display: inline-flex;
|
||||
justify-content: center;
|
||||
align-items: center;
|
||||
width: 100%;
|
||||
height: 100%;
|
||||
border-radius: 50%;
|
||||
background: #12277b;
|
||||
font-size: 3em;
|
||||
font-weight: 600;
|
||||
span {
|
||||
background-image: -webkit-linear-gradient(bottom, red, #fd8403, yellow);
|
||||
-webkit-background-clip: text;
|
||||
-webkit-text-fill-color: transparent;
|
||||
}
|
||||
|
||||
&::before {
|
||||
position: absolute;
|
||||
left: -5%;
|
||||
top: -5%;
|
||||
content: "";
|
||||
background-image: url(../img/3-dashCircle.png);
|
||||
width: 110%;
|
||||
height: 110%;
|
||||
background-position: center center;
|
||||
background-size: cover;
|
||||
background-repeat: no-repeat;
|
||||
z-index: 9;
|
||||
opacity: 1;
|
||||
visibility: hidden;
|
||||
}
|
||||
|
||||
&:hover::before{
|
||||
visibility: visible;
|
||||
animation: dashCircle infinite 4s linear;
|
||||
}
|
||||
}
|
||||
|
||||
.circle-item:nth-child(2) {
|
||||
.circle-item-box {
|
||||
background-image: linear-gradient(
|
||||
to bottom left,
|
||||
rgba(255, 255, 255, 0.88) 0%,
|
||||
rgba(7, 188, 207, 0.56) 33%,
|
||||
rgba(255, 255, 255, 0.16) 67%,
|
||||
rgba(255, 255, 255, 1) 100%
|
||||
);
|
||||
}
|
||||
span {
|
||||
background-image: -webkit-linear-gradient(bottom, #f5f65b, #15ccf6);
|
||||
}
|
||||
}
|
||||
|
||||
.circle-item:nth-child(3) {
|
||||
.circle-item-box {
|
||||
background-image: linear-gradient(
|
||||
to bottom left,
|
||||
rgba(255, 255, 255, 1) 0%,
|
||||
rgba(255, 255, 255, 0.16) 0%,
|
||||
rgba(7, 188, 207, 0.56) 33%,
|
||||
rgba(255, 255, 255, 0.88) 100%
|
||||
);
|
||||
}
|
||||
span {
|
||||
background-image: -webkit-linear-gradient(bottom, #bad3ff, #00a0dd);
|
||||
}
|
||||
}
|
||||
|
||||
.circle-item:nth-child(4) {
|
||||
.circle-item-box {
|
||||
background-image: linear-gradient(
|
||||
to bottom left,
|
||||
rgba(255, 255, 255, 0.88) 0%,
|
||||
rgba(7, 188, 207, 0.56) 33%,
|
||||
rgba(255, 255, 255, 0.16) 67%,
|
||||
rgba(255, 255, 255, 1) 100%
|
||||
);
|
||||
}
|
||||
span {
|
||||
background-image: -webkit-linear-gradient(bottom, #f0a3ff, #b33dff);
|
||||
}
|
||||
}
|
||||
|
||||
.circle-item:nth-child(5) {
|
||||
.circle-item-box {
|
||||
background-image: linear-gradient(
|
||||
to bottom left,
|
||||
rgba(255, 255, 255, 0.45) 0%,
|
||||
rgba(7, 188, 207, 0.56) 33%,
|
||||
rgba(255, 255, 255, 0.16) 67%,
|
||||
rgba(255, 255, 255, 1) 100%
|
||||
);
|
||||
}
|
||||
span {
|
||||
background-image: -webkit-linear-gradient(bottom, #08ece1, #ff7e3d);
|
||||
}
|
||||
}
|
||||
|
||||
.circle-item .circle-item-box {
|
||||
&:hover{
|
||||
background:rgba(255, 255, 255, 0);
|
||||
}
|
||||
}
|
||||
|
||||
.waves{
|
||||
position: relative;
|
||||
bottom: -1.5vh;
|
||||
}
|
||||
|
||||
@keyframes dashCircle {
|
||||
0% {
|
||||
transform: rotate(0deg);
|
||||
}
|
||||
100% {
|
||||
transform: rotate(360deg);
|
||||
}
|
||||
}
|
||||
}
|
||||
Binary file not shown.
|
After Width: | Height: | Size: 12 KiB |
Binary file not shown.
|
After Width: | Height: | Size: 16 KiB |
Binary file not shown.
|
After Width: | Height: | Size: 26 KiB |
Binary file not shown.
|
After Width: | Height: | Size: 10 KiB |
Binary file not shown.
|
After Width: | Height: | Size: 93 KiB |
Binary file not shown.
|
After Width: | Height: | Size: 130 KiB |
Binary file not shown.
|
After Width: | Height: | Size: 77 KiB |
Binary file not shown.
|
After Width: | Height: | Size: 108 KiB |
Binary file not shown.
|
After Width: | Height: | Size: 5.2 KiB |
Binary file not shown.
|
After Width: | Height: | Size: 68 KiB |
Binary file not shown.
|
After Width: | Height: | Size: 211 KiB |
Binary file not shown.
|
After Width: | Height: | Size: 207 KiB |
Binary file not shown.
|
After Width: | Height: | Size: 157 KiB |
Binary file not shown.
|
After Width: | Height: | Size: 1.6 MiB |
Binary file not shown.
|
After Width: | Height: | Size: 1.1 KiB |
Binary file not shown.
|
After Width: | Height: | Size: 2.0 KiB |
Binary file not shown.
|
After Width: | Height: | Size: 2.3 KiB |
Binary file not shown.
|
After Width: | Height: | Size: 16 KiB |
Binary file not shown.
|
After Width: | Height: | Size: 282 KiB |
Binary file not shown.
|
After Width: | Height: | Size: 182 KiB |
Binary file not shown.
|
After Width: | Height: | Size: 2.3 KiB |
Binary file not shown.
|
After Width: | Height: | Size: 3.0 KiB |
Binary file not shown.
|
After Width: | Height: | Size: 6.4 KiB |
Binary file not shown.
|
After Width: | Height: | Size: 10 KiB |
Binary file not shown.
|
After Width: | Height: | Size: 8.9 KiB |
Binary file not shown.
|
After Width: | Height: | Size: 9.0 KiB |
Binary file not shown.
|
After Width: | Height: | Size: 39 KiB |
Binary file not shown.
|
After Width: | Height: | Size: 67 KiB |
Binary file not shown.
|
After Width: | Height: | Size: 21 KiB |
Binary file not shown.
|
After Width: | Height: | Size: 751 KiB |
Binary file not shown.
|
After Width: | Height: | Size: 5.5 KiB |
Binary file not shown.
|
After Width: | Height: | Size: 4.8 KiB |
Binary file not shown.
|
After Width: | Height: | Size: 6.7 KiB |
Binary file not shown.
|
After Width: | Height: | Size: 24 KiB |
Binary file not shown.
|
After Width: | Height: | Size: 55 KiB |
Binary file not shown.
|
After Width: | Height: | Size: 99 KiB |
Binary file not shown.
|
After Width: | Height: | Size: 65 KiB |
Binary file not shown.
|
After Width: | Height: | Size: 52 KiB |
Binary file not shown.
|
After Width: | Height: | Size: 92 KiB |
Binary file not shown.
|
After Width: | Height: | Size: 74 KiB |
Binary file not shown.
|
After Width: | Height: | Size: 60 KiB |
Binary file not shown.
|
After Width: | Height: | Size: 75 KiB |
Binary file not shown.
|
After Width: | Height: | Size: 16 KiB |
Binary file not shown.
|
After Width: | Height: | Size: 23 KiB |
Binary file not shown.
|
After Width: | Height: | Size: 957 KiB |
Binary file not shown.
|
After Width: | Height: | Size: 13 KiB |
|
|
@ -0,0 +1,153 @@
|
|||
import React, { useEffect, useState } from 'react';
|
||||
import { TPMIndexHOC } from '../modules/tpm/TPMIndexHOC';
|
||||
import { isMobile } from 'educoder';
|
||||
import './index.scss';
|
||||
|
||||
import FirstSection from './FirstSection';
|
||||
import SecondSection from './SecondSection';
|
||||
import ThirdSection from './ThirdSection';
|
||||
import FourthSection from './FourthSection';
|
||||
import FifthSection from './FifthSection';
|
||||
import SixthSection from './SixthSection';
|
||||
import SeventhSection from './SeventhSection';
|
||||
import Footer from './Footer';
|
||||
|
||||
|
||||
let isHuawei = (/honor|huawei/i.test(navigator.userAgent.toLowerCase()));
|
||||
function HomePage({ history }) {
|
||||
|
||||
useEffect(() => {
|
||||
window.addEventListener("scroll", scrollListener, false);
|
||||
return () => {
|
||||
window.removeEventListener("scroll", scrollListener, false);
|
||||
}
|
||||
}, []);
|
||||
|
||||
const [first, setFirst] = useState(true);
|
||||
const [second, setSecond] = useState(isMobile);
|
||||
const [third, setThird] = useState(false || isHuawei);
|
||||
const [fourth, setFourth] = useState(false || isHuawei);
|
||||
const [fifth, setFifth] = useState(false || isHuawei);
|
||||
const [sixth, setSixth] = useState(false || isHuawei);
|
||||
|
||||
|
||||
let settings = JSON.parse(localStorage.chromesetting);
|
||||
let main_web_site_url = settings.main_web_site_url;
|
||||
|
||||
|
||||
function scrollListener() {
|
||||
let clientHeight = document.body.clientHeight;
|
||||
let clientWidth = document.body.clientWidth;
|
||||
// let secondSection = document.querySelector(".home-second-section").offsetTop;
|
||||
// let thirdSection = document.querySelector(".home-third-section").offsetTop;
|
||||
// let fourthSection = document.querySelector(".home-fourth-section").offsetTop;
|
||||
// let fifthSection = document.querySelector(".home-fifth-section").offsetTop;
|
||||
// let sixthSection = document.querySelector(".home-sixth-section").offsetTop;
|
||||
// let seventhSection = document.querySelector(".home-seventh-section").offsetTop;
|
||||
let secondSection = document.getElementById("home-second-section").offsetTop;
|
||||
let thirdSection = document.getElementById("home-third-section").offsetTop;
|
||||
let fourthSection = document.getElementById("home-fourth-section").offsetTop;
|
||||
let fifthSection = document.getElementById("home-fifth-section").offsetTop;
|
||||
let sixthSection = document.getElementById("home-sixth-section").offsetTop;
|
||||
let seventhSection = document.getElementById("home-seventh-section").offsetTop;
|
||||
|
||||
let top = document.documentElement.scrollTop;
|
||||
|
||||
|
||||
if (top >= clientHeight - 300) {
|
||||
setFirst(false);
|
||||
} else {
|
||||
setFirst(true);
|
||||
}
|
||||
|
||||
if (clientWidth > 1100) {
|
||||
// 第二个动效
|
||||
if (top >= secondSection - clientHeight * 0.8 && top < thirdSection) {
|
||||
setSecond(true);
|
||||
} else {
|
||||
setSecond(false);
|
||||
}
|
||||
} else {
|
||||
// 第二个动效
|
||||
if (top >= secondSection - clientHeight && top < thirdSection) {
|
||||
setSecond(true);
|
||||
} else {
|
||||
setSecond(false);
|
||||
}
|
||||
}
|
||||
|
||||
// 第三个动效
|
||||
if (top >= thirdSection - clientHeight && top < fourthSection) {
|
||||
setThird(true);
|
||||
} else {
|
||||
setThird(false);
|
||||
}
|
||||
|
||||
// 第四个动效
|
||||
if (top >= fourthSection - clientHeight && top < fifthSection) {
|
||||
setFourth(true);
|
||||
} else {
|
||||
setFourth(false);
|
||||
}
|
||||
|
||||
// 第五个动效
|
||||
if (top >= fifthSection - clientHeight && top < sixthSection) {
|
||||
setFifth(true);
|
||||
} else {
|
||||
setFifth(false);
|
||||
}
|
||||
|
||||
// 第六个动效
|
||||
if (top >= sixthSection - clientHeight && top < seventhSection - 100) {
|
||||
setSixth(true);
|
||||
} else {
|
||||
setSixth(false);
|
||||
}
|
||||
|
||||
if(isHuawei){
|
||||
setFourth(true);
|
||||
setSixth(true);
|
||||
}
|
||||
}
|
||||
|
||||
|
||||
return (
|
||||
<div className="homePage">
|
||||
|
||||
<div id="home-first-section" className="home-first-section">
|
||||
<FirstSection first={first} />
|
||||
</div>
|
||||
|
||||
|
||||
<div id="home-second-section" className="home-second-section">
|
||||
<SecondSection second={second} main_web_site_url={main_web_site_url} />
|
||||
</div>
|
||||
|
||||
|
||||
<div id="home-third-section" className="home-third-section">
|
||||
<ThirdSection third={third} />
|
||||
</div>
|
||||
|
||||
<div id="home-fourth-section" className="home-fourth-section">
|
||||
<FourthSection fourth={fourth} history={history} />
|
||||
</div>
|
||||
|
||||
<div id="home-fifth-section" className="home-fifth-section">
|
||||
<FifthSection fifth={fifth} history={history} />
|
||||
</div>
|
||||
|
||||
<div id="home-sixth-section" className="home-sixth-section">
|
||||
<SixthSection sixth={sixth} main_web_site_url={main_web_site_url} />
|
||||
</div>
|
||||
|
||||
<div id="home-seventh-section" className="home-seventh-section">
|
||||
<SeventhSection main_web_site_url={main_web_site_url} />
|
||||
</div>
|
||||
|
||||
<Footer />
|
||||
|
||||
</div>
|
||||
)
|
||||
}
|
||||
|
||||
export default TPMIndexHOC(HomePage, { noFooter: true });
|
||||
|
|
@ -0,0 +1,335 @@
|
|||
.homePage {
|
||||
background: #fff;
|
||||
font-size: 16px;
|
||||
// min-width: 800px;
|
||||
// 首页多个部分公共样式
|
||||
|
||||
// 1行省略号
|
||||
.ellipsis-1 {
|
||||
white-space: nowrap;
|
||||
overflow: hidden;
|
||||
text-overflow: ellipsis;
|
||||
}
|
||||
// 2行省略号
|
||||
.ellipsis-2 {
|
||||
text-overflow: -o-ellipsis-lastline;
|
||||
overflow: hidden;
|
||||
text-overflow: ellipsis;
|
||||
display: -webkit-box;
|
||||
-webkit-line-clamp: 2;
|
||||
line-clamp: 2;
|
||||
-webkit-box-orient: vertical;
|
||||
}
|
||||
|
||||
// 5行省略号
|
||||
.ellipsis-5 {
|
||||
text-overflow: -o-ellipsis-lastline;
|
||||
overflow: hidden;
|
||||
text-overflow: ellipsis;
|
||||
display: -webkit-box;
|
||||
-webkit-line-clamp: 5;
|
||||
line-clamp: 5;
|
||||
-webkit-box-orient: vertical;
|
||||
}
|
||||
|
||||
// 8行省略号
|
||||
.ellipsis-8 {
|
||||
text-overflow: -o-ellipsis-lastline;
|
||||
overflow: hidden;
|
||||
text-overflow: ellipsis;
|
||||
display: -webkit-box;
|
||||
-webkit-line-clamp: 8;
|
||||
line-clamp: 8;
|
||||
-webkit-box-orient: vertical;
|
||||
}
|
||||
|
||||
.link {
|
||||
cursor: pointer;
|
||||
&:hover {
|
||||
opacity: 0.8;
|
||||
}
|
||||
}
|
||||
|
||||
.ant-btn-primary {
|
||||
background-color: #2a3ee9;
|
||||
border-color: #2a3ee9;
|
||||
height: 3.5em;
|
||||
box-shadow: 0px 0px 9px 2px rgba(65, 84, 241, 0.33) !important;
|
||||
border-radius: 0.375em;
|
||||
}
|
||||
.homepage-btn {
|
||||
width: 8.75em;
|
||||
height: 3.5em;
|
||||
font-size: 1em;
|
||||
&:hover {
|
||||
background-color: #4154f1;
|
||||
border-color: #4154f1;
|
||||
}
|
||||
.icon-gengduoicon {
|
||||
margin-left: 0.375em;
|
||||
color: #ffbf2d;
|
||||
font-size: 1em !important;
|
||||
}
|
||||
}
|
||||
.text-center {
|
||||
text-align: center;
|
||||
}
|
||||
|
||||
.homepage-main {
|
||||
width: 1200px;
|
||||
max-width: 96%;
|
||||
margin: -1px auto 0;
|
||||
}
|
||||
|
||||
.homePage-blue-tit {
|
||||
color: #000870;
|
||||
font-size: 2.125em;
|
||||
margin-bottom: 0;
|
||||
}
|
||||
|
||||
.homePage-subhead {
|
||||
font-size: 1em;
|
||||
color: #666;
|
||||
}
|
||||
|
||||
.homePage-white-tit {
|
||||
font-size: 2.25em;
|
||||
font-weight: 500;
|
||||
color: #ffffff;
|
||||
line-height: 3.125em;
|
||||
}
|
||||
|
||||
.homePage-white-subhead {
|
||||
font-size: 1em;
|
||||
font-weight: 400;
|
||||
color: #fff;
|
||||
line-height: 1.6875em;
|
||||
opacity: 0.8;
|
||||
}
|
||||
|
||||
// 首页特定头部样式起
|
||||
|
||||
&.newHeaders {
|
||||
// background-color: #1a2358;
|
||||
background-color: #0037af;
|
||||
}
|
||||
.head-nav {
|
||||
min-width: auto;
|
||||
}
|
||||
.head-nav ul#header-nav li a {
|
||||
font-size: 1em;
|
||||
color: #fff;
|
||||
}
|
||||
.head-nav ul#header-nav li:hover a,
|
||||
.head-nav ul#header-nav li.active a {
|
||||
color: #ffa13a;
|
||||
}
|
||||
.head-nav ul#header-nav li.active a::after {
|
||||
background-color: #ffa13a;
|
||||
}
|
||||
|
||||
.logoDiv img {
|
||||
min-width: 2.8125em;
|
||||
height: 2.8125em;
|
||||
}
|
||||
|
||||
.color-home {
|
||||
color: #fff;
|
||||
}
|
||||
|
||||
.color-home:hover {
|
||||
color: #4154f1;
|
||||
}
|
||||
|
||||
.register-button {
|
||||
height: 3em;
|
||||
margin-left: 1.25em;
|
||||
padding: 0 1.5625em;
|
||||
font-size: 0.875em;
|
||||
}
|
||||
// 首页特定头部样式止
|
||||
}
|
||||
|
||||
// 波浪样式起
|
||||
.waves {
|
||||
position: relative;
|
||||
width: 100%;
|
||||
height: 8vh;
|
||||
bottom: -0.5vh;
|
||||
}
|
||||
// .waves-low {
|
||||
// height: 6vh;
|
||||
// }
|
||||
.parallax > use {
|
||||
animation: move-forever 25s cubic-bezier(0.55, 0.5, 0.45, 0.5) infinite;
|
||||
}
|
||||
.parallax > use:nth-child(1) {
|
||||
animation-delay: -2s;
|
||||
animation-duration: 7s;
|
||||
}
|
||||
.parallax > use:nth-child(2) {
|
||||
animation-delay: -3s;
|
||||
animation-duration: 10s;
|
||||
}
|
||||
.parallax > use:nth-child(3) {
|
||||
animation-delay: -4s;
|
||||
animation-duration: 13s;
|
||||
}
|
||||
.parallax > use:nth-child(4) {
|
||||
animation-delay: -5s;
|
||||
animation-duration: 20s;
|
||||
}
|
||||
@keyframes move-forever {
|
||||
0% {
|
||||
transform: translate3d(-90px, 0, 0);
|
||||
}
|
||||
100% {
|
||||
transform: translate3d(85px, 0, 0);
|
||||
}
|
||||
} /*Shrinking for mobile*/
|
||||
|
||||
@media screen and (max-width: 1000px) {
|
||||
.newContainer .home-first-section {
|
||||
height: auto;
|
||||
margin-top: -5vh;
|
||||
.website-content {
|
||||
height: 60vh;
|
||||
}
|
||||
.grid-picture {
|
||||
background-size: auto 100%;
|
||||
}
|
||||
}
|
||||
}
|
||||
@media screen and (max-width: 1200px) {
|
||||
.waves {
|
||||
height: 6vh;
|
||||
}
|
||||
.newContainer .home-first-section {
|
||||
.grid-picture {
|
||||
background-size: auto 100%;
|
||||
}
|
||||
}
|
||||
.home-fifth-section .circle-wave {
|
||||
left: 1.5vw;
|
||||
}
|
||||
|
||||
.home-seventh-section {
|
||||
.seventh-main .clients {
|
||||
.start-icon {
|
||||
top: 100px;
|
||||
left: 150px;
|
||||
}
|
||||
.end-icon {
|
||||
bottom: 100px;
|
||||
right: 280px;
|
||||
}
|
||||
}
|
||||
}
|
||||
.home-footer {
|
||||
height: 400px;
|
||||
.arc {
|
||||
margin: -100px -100px 0;
|
||||
height: 200px;
|
||||
border-radius: 50%;
|
||||
}
|
||||
.footer-main {
|
||||
height: 200px;
|
||||
}
|
||||
}
|
||||
}
|
||||
@media screen and (min-width: 2000px) {
|
||||
.homePage {
|
||||
font-size: 20px;
|
||||
&.newHeaders {
|
||||
height: 4.375em;
|
||||
.head-nav {
|
||||
height: inherit;
|
||||
ul#header-nav {
|
||||
height: inherit;
|
||||
li {
|
||||
height: inherit;
|
||||
font-size: 1em;
|
||||
line-height: 4.375em;
|
||||
a {
|
||||
font-size: 1.1em;
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
.login-box {
|
||||
font-size: 0.9375em;
|
||||
}
|
||||
}
|
||||
.homepage-main {
|
||||
width: 1600px;
|
||||
}
|
||||
.home-first-section {
|
||||
.website {
|
||||
margin-right: 7%;
|
||||
.website-vision {
|
||||
justify-content: flex-start;
|
||||
span {
|
||||
margin-right: 1.5em;
|
||||
}
|
||||
}
|
||||
}
|
||||
.play-img {
|
||||
width: 50%;
|
||||
height: 600px;
|
||||
.play-circle {
|
||||
right: 21%;
|
||||
}
|
||||
.play-circle-circle1,
|
||||
.play-circle-circle2,
|
||||
.play-circle-circle3,
|
||||
.play-circle-circle4,
|
||||
.play-circle-circle5 {
|
||||
right: 26.1%;
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
.home-seventh-section {
|
||||
.clients {
|
||||
.start-icon {
|
||||
top: 100px;
|
||||
left: 380px;
|
||||
}
|
||||
.end-icon {
|
||||
bottom: 130px;
|
||||
right: 480px;
|
||||
}
|
||||
}
|
||||
}
|
||||
.footerbottom {
|
||||
font-size: 16px !important;
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
@media screen and (min-width: 2800px) {
|
||||
.homePage {
|
||||
font-size: 24px;
|
||||
.homepage-main {
|
||||
width: 2000px;
|
||||
}
|
||||
.home-first-section {
|
||||
.website {
|
||||
margin-right: 14%;
|
||||
}
|
||||
.play-img {
|
||||
width: 40%;
|
||||
.play-circle {
|
||||
right: 21%;
|
||||
}
|
||||
.play-circle-circle1,
|
||||
.play-circle-circle2,
|
||||
.play-circle-circle3,
|
||||
.play-circle-circle4,
|
||||
.play-circle-circle5 {
|
||||
right: 26.1%;
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
|
|
@ -1,10 +1,10 @@
|
|||
import React, { useEffect, useState,memo } from 'react';
|
||||
import React, { useEffect, useState, memo } from 'react';
|
||||
import classNames from 'classnames';
|
||||
import './index.scss';
|
||||
|
||||
export default memo((props) => {
|
||||
const { title, options, changeOptionId, type ,size} = props;
|
||||
const [option, setOption] = useState({ code: "", dicItemName: "" ,dicItemCode:""});
|
||||
const { title, options, changeOptionId, type, size, defaultOption } = props;
|
||||
const [option, setOption] = useState(defaultOption || { code: "", dicItemName: "", dicItemCode: "" });
|
||||
|
||||
useEffect(() => {
|
||||
changeOptionId(option, type);
|
||||
|
|
@ -12,13 +12,13 @@ export default memo((props) => {
|
|||
|
||||
return (
|
||||
|
||||
<div className={classNames({"choose-box":true,"choose-box-big":size})}>
|
||||
<div className={classNames({ "choose-box": true, "choose-box-big": size })}>
|
||||
<div className="choose-title">{title}</div>
|
||||
<div className="choose-list">
|
||||
<div className={classNames({ "choose-item-checked": option.dicItemCode === "", "choose-item": true })} key={"all"} onClick={() => { setOption({ dicItemCode: "", dicItemName: "" }) }}>全部</div>
|
||||
{
|
||||
options.map((item) => {
|
||||
return <div className={classNames({ "choose-item-checked": option.dicItemCode === item.dicItemCode, "choose-item": true })} key={item.dicItemCode} onClick={() => { setOption(item) }} >{item.dicItemName}</div>
|
||||
return <div className={classNames({ "choose-item-checked": option.dicItemCode == item.dicItemCode, "choose-item": true })} key={item.dicItemCode} onClick={() => { setOption(item) }} >{item.dicItemName}</div>
|
||||
})
|
||||
}
|
||||
</div>
|
||||
|
|
|
|||
|
|
@ -32,7 +32,6 @@ export default memo((props) => {
|
|||
setMyOptions(myOptions);
|
||||
}
|
||||
|
||||
console.log('-----options----')
|
||||
return (
|
||||
|
||||
<div className="sort-box">
|
||||
|
|
|
|||
|
|
@ -17,7 +17,6 @@ export default function javaFetch(actionUrl){
|
|||
// request拦截器
|
||||
service.interceptors.request.use(config => {
|
||||
if (cookie.load(TokenKey)) {
|
||||
console.log(cookie.load(TokenKey));
|
||||
config.headers['Authorization'] = cookie.load(TokenKey); // 让每个请求携带自定义token 请根据实际情况自行修改
|
||||
}
|
||||
if (window.location.port === "3007") {
|
||||
|
|
|
|||
|
|
@ -160,6 +160,13 @@ export function deleteTask(id, isDelete) {
|
|||
});
|
||||
}
|
||||
|
||||
//推荐
|
||||
export function recommendTask(id, recommend) {
|
||||
return fetch({
|
||||
url: '/api/tasks/backend/changeTaskRecommendedStatus/' + id + '?recommend=' + recommend,
|
||||
method: 'PUT',
|
||||
});
|
||||
}
|
||||
|
||||
//新增成果
|
||||
export function addPaper(data) {
|
||||
|
|
|
|||
|
|
@ -4,7 +4,7 @@ import { Input, Select, Button, Form, DatePicker, Table, Pagination, Modal } fro
|
|||
import { Link } from "react-router-dom";
|
||||
|
||||
import { paperCheckStatusArr, publishModeArr, taskStatusAllArr, showUserModeArr, main_web_site_url } from '../static';
|
||||
import { getTaskAdminList, changeShowUserMode, deleteTask } from '../api';
|
||||
import { getTaskAdminList, changeShowUserMode, deleteTask, recommendTask } from '../api';
|
||||
import '../index.scss';
|
||||
import './index.scss';
|
||||
const format = "YYYY-MM-DD HH:mm:ss";
|
||||
|
|
@ -29,6 +29,7 @@ export default Form.create()(({ form, showNotification, match, history }) => {
|
|||
const [publishMode, setPublishMode] = useState('');
|
||||
const [showUserMode, setShowUserMode] = useState('');
|
||||
const [isDelete, setIsDelete] = useState('0');
|
||||
const [recommend, setRecommend] = useState('');
|
||||
|
||||
const [sort, setSort] = useState('Desc');
|
||||
const [order, setOrder] = useState('createdAt');
|
||||
|
|
@ -48,6 +49,7 @@ export default Form.create()(({ form, showNotification, match, history }) => {
|
|||
pageSize: 10,
|
||||
orderBy: order + sort,
|
||||
isDelete,
|
||||
recommend,
|
||||
};
|
||||
setLoading(true);
|
||||
getTaskAdminList(params).then(data => {
|
||||
|
|
@ -57,7 +59,7 @@ export default Form.create()(({ form, showNotification, match, history }) => {
|
|||
}
|
||||
setLoading(false);
|
||||
})
|
||||
}, [statusString, order, sort, publishMode, showUserMode, curPage, searchObj, isDelete, reload]);
|
||||
}, [statusString, order, sort, publishMode, showUserMode, curPage, searchObj, isDelete, reload ,recommend]);
|
||||
|
||||
|
||||
const helper = useCallback(
|
||||
|
|
@ -205,8 +207,13 @@ export default Form.create()(({ form, showNotification, match, history }) => {
|
|||
<React.Fragment>
|
||||
|
||||
{
|
||||
isDelete == '0' ? <Button className="mr5 font-12" type="danger" size="small" onClick={() => { deletItem(record.id, '1') }}>隐藏</Button>
|
||||
: <Button className="mr5 font-12" type="primary" size="small" onClick={() => { deletItem(record.id, '0') }}>恢复</Button>
|
||||
isDelete == '0' ? <Button className="mr5 font-12" type="danger" size="small" onClick={() => { deleteItem(record.id, '1') }}>隐藏</Button>
|
||||
: <Button className="mr5 font-12" type="primary" size="small" onClick={() => { deleteItem(record.id, '0') }}>恢复</Button>
|
||||
}
|
||||
|
||||
{
|
||||
record.recommend ? <Button className="mr5 font-12" type="danger" size="small" onClick={() => { recommendItem(record.id, '0') }}>撤销推荐</Button>
|
||||
: <Button className="mr5 font-12" type="primary" size="small" onClick={() => { recommendItem(record.id, '1') }}>首页推荐</Button>
|
||||
}
|
||||
|
||||
{/* <Link className="line_1 color-grey3" to={`/task/taskDetail/${record.taskId}`}>查看</Link> */}
|
||||
|
|
@ -216,8 +223,24 @@ export default Form.create()(({ form, showNotification, match, history }) => {
|
|||
]
|
||||
}, [isDelete]);
|
||||
|
||||
function recommendItem(id, recommend) {
|
||||
Modal.confirm({
|
||||
title: "警告",
|
||||
content: recommend == '0' ? "确认撤销该推荐吗 ？撤销后首页中将不再展示该任务" : "确认推荐吗？推荐后，用户可以在首页看到推荐任务中点击量前三的任务！",
|
||||
okText: '确定',
|
||||
cancelText: '取消',
|
||||
onOk() {
|
||||
recommendTask(id, recommend).then(res => {
|
||||
if (res.message === 'success') {
|
||||
showNotification('操作成功!');
|
||||
setReload(Math.random());
|
||||
}
|
||||
});
|
||||
},
|
||||
});
|
||||
}
|
||||
|
||||
function deletItem(id, isDelete) {
|
||||
function deleteItem(id, isDelete) {
|
||||
Modal.confirm({
|
||||
title: "警告",
|
||||
content: isDelete == '0' ? "确认恢复该任务吗？恢复后用户可以重新看到该任务！" : "确认隐藏？隐藏后用户无法看到该任务！",
|
||||
|
|
@ -261,7 +284,16 @@ export default Form.create()(({ form, showNotification, match, history }) => {
|
|||
const changeShow = useCallback((isDelete) => {
|
||||
setIsDelete(isDelete);
|
||||
setCurPage(1);
|
||||
})
|
||||
});
|
||||
|
||||
const changeRecommend = useCallback((recommend) => {
|
||||
if (recommend === 'all') {
|
||||
setRecommend('');
|
||||
} else {
|
||||
setRecommend(recommend);
|
||||
}
|
||||
setCurPage(1);
|
||||
});
|
||||
|
||||
function downloadFile() {
|
||||
window.open(main_web_site_url + '/admin/tasks.xlsx');
|
||||
|
|
@ -334,6 +366,19 @@ export default Form.create()(({ form, showNotification, match, history }) => {
|
|||
</Select>
|
||||
</Form.Item>
|
||||
|
||||
<Form.Item className="inline-form" label="是否推荐">
|
||||
<Select
|
||||
style={{ width: '200px' }}
|
||||
showArrow
|
||||
onChange={changeRecommend}
|
||||
defaultValue='all'
|
||||
>
|
||||
<Option key={'all'} >全部</Option>
|
||||
<Option key={'0'} >未推荐</Option>
|
||||
<Option key={'1'} >已推荐</Option>
|
||||
</Select>
|
||||
</Form.Item>
|
||||
|
||||
<Form.Item className="inline-form" label="排序">
|
||||
<Select
|
||||
style={{ width: '200px' }}
|
||||
|
|
|
|||
|
|
@ -389,7 +389,7 @@ export default Form.create()(
|
|||
<div className="clearfix tasks_status_father mb30" style={{ background: "#FAFAFA" }}>
|
||||
|
||||
<ul className="tasks_status clearfix">
|
||||
<li className="active"><span>发布任务</span></li>
|
||||
<li className="active"><span>需求提报</span></li>
|
||||
|
||||
{process('成果提交', 3, detailData.collectingDays)}
|
||||
|
||||
|
|
|
|||
|
|
@ -268,7 +268,7 @@ export default Form.create()(forwardRef(({ current_user, form, showNotification,
|
|||
<div className="head-navigation">
|
||||
<Link to="/task">创客空间 ></Link>
|
||||
<Link to="/task">任务大厅 ></Link>
|
||||
<span >发布任务 </span>
|
||||
<span >需求提报 </span>
|
||||
</div>
|
||||
<p className="font-18 font-bd mb15">任务提交</p>
|
||||
|
||||
|
|
@ -423,7 +423,7 @@ export default Form.create()(forwardRef(({ current_user, form, showNotification,
|
|||
|
||||
<div className="task-setting-days">
|
||||
<div className="timing_task">
|
||||
<div className="mbt10 color-grey-9 lineh-35"><span className="inline-span active">发布任务</span></div>
|
||||
<div className="mbt10 color-grey-9 lineh-35"><span className="inline-span active">需求提报</span></div>
|
||||
<div className="color-grey-9 ">自主提交：立即发布</div>
|
||||
<div className="color-grey-9 ">统筹任务：遴选后发布</div>
|
||||
</div>
|
||||
|
|
|
|||
|
|
@ -1,7 +1,7 @@
|
|||
import React, { useCallback, useEffect, useState } from 'react';
|
||||
import { Input, Button, Modal } from 'antd';
|
||||
import moment from 'moment';
|
||||
import { formatDuring } from 'educoder';
|
||||
import { formatDuring, getUrlToken } from 'educoder';
|
||||
import ChooseNav from '../../components/chooseNav';
|
||||
import SortBox from '../../components/sortBox';
|
||||
import ItemListTask from '../components/itemListTask';
|
||||
|
|
@ -10,12 +10,15 @@ import { getTaskList, getTaskCategory, getCompanyInfo } from '../api';
|
|||
import '../index.scss';
|
||||
const Search = Input.Search;
|
||||
|
||||
export default ({ history, current_user, showLoginDialog }) => {
|
||||
console.log(current_user);
|
||||
|
||||
export default ({ history, current_user, showLoginDialog, location }) => {
|
||||
// console.log(current_user);
|
||||
|
||||
let initType = getUrlToken('type', location.search) || '';
|
||||
|
||||
const [loading, setLoading] = useState(false);
|
||||
const [taskCategoryArr, setTaskCategoryArr] = useState([]);
|
||||
const [categoryId, setCategoryId] = useState('');
|
||||
const [categoryId, setCategoryId] = useState(initType);
|
||||
const [taskModeId, setTaskModeId] = useState('');
|
||||
const [expiredStartTime, setExpiredStartTime] = useState('');
|
||||
const [expiredEndTime, setExpiredEndTime] = useState('');
|
||||
|
|
@ -160,7 +163,7 @@ export default ({ history, current_user, showLoginDialog }) => {
|
|||
});
|
||||
} else {
|
||||
Modal.info({
|
||||
content: '您没有权限发布任务'
|
||||
content: '您没有权限需求提报'
|
||||
});
|
||||
}
|
||||
}
|
||||
|
|
@ -177,6 +180,7 @@ export default ({ history, current_user, showLoginDialog }) => {
|
|||
options={taskCategoryArr}
|
||||
changeOptionId={changeOptionId}
|
||||
size='big'
|
||||
defaultOption={{ code: initType || "", dicItemName: "", dicItemCode: initType || "" }}
|
||||
/>
|
||||
|
||||
<ChooseNav
|
||||
|
|
@ -223,7 +227,7 @@ export default ({ history, current_user, showLoginDialog }) => {
|
|||
onSearch={(value) => { setSearchInput(value); setCurPage(1); }}
|
||||
/>
|
||||
|
||||
<Button className="mr20 font-12" type="primary" onClick={goAdd}><i className="iconfont icon-zaibianji font-12 mr3"></i>发布任务</Button>
|
||||
<Button className="mr20 font-12" type="primary" onClick={goAdd}><i className="iconfont icon-zaibianji font-12 mr3"></i>需求提报</Button>
|
||||
|
||||
</div>
|
||||
</div>
|
||||
|
|
|
|||
|
|
@ -11,21 +11,44 @@ import { TPMIndexHOC } from '../tpm/TPMIndexHOC';
|
|||
import { SnackbarHOC,getImageUrl } from 'educoder';
|
||||
|
||||
class http500 extends Component {
|
||||
constructor(props) {
|
||||
super(props);
|
||||
this.state = {
|
||||
isAdmins:true,
|
||||
}
|
||||
}
|
||||
|
||||
UNSAFE_componentWillMount() {
|
||||
if (this.props.history.location.pathname.indexOf('/admins/') > -1) {
|
||||
let nowTime = new Date().getTime();
|
||||
if ((nowTime - (localStorage.reloadTime || 0)) > 2000) {
|
||||
localStorage.setItem('reloadTime', nowTime);
|
||||
window.location.reload();
|
||||
return;
|
||||
}
|
||||
}
|
||||
this.setState({isAdmins:false});
|
||||
}
|
||||
|
||||
|
||||
render() {
|
||||
return (
|
||||
<div className="newMain clearfix">
|
||||
<div className=" edu-txt-center mt60 mb60">
|
||||
{/*mt100 mb100*/}
|
||||
<img src={getImageUrl("images/warn/pic_404.jpg")} />
|
||||
<p className="font-18 mt40">
|
||||
您可以稍后尝试 <a href="/"
|
||||
className="color-blue">返回首页</a>
|
||||
，或者
|
||||
<a target="_blank"
|
||||
href="//shang.qq.com/wpa/qunwpa?idkey=2f2043d88c1bd61d182b98bf1e061c6185e23055bec832c07d8148fe11c5a6cd"
|
||||
className="color-blue">QQ反馈>></a>
|
||||
</p>
|
||||
</div>
|
||||
{
|
||||
this.state.isAdmins? <Loading />:<div className=" edu-txt-center mt60 mb60">
|
||||
{/*mt100 mb100*/}
|
||||
<img src={getImageUrl("images/warn/pic_404.jpg")} />
|
||||
<p className="font-18 mt40">
|
||||
您可以稍后尝试 <a href="/"
|
||||
className="color-blue">返回首页</a>
|
||||
，或者
|
||||
<a target="_blank"
|
||||
href="//shang.qq.com/wpa/qunwpa?idkey=2f2043d88c1bd61d182b98bf1e061c6185e23055bec832c07d8148fe11c5a6cd"
|
||||
className="color-blue">QQ反馈>></a>
|
||||
</p>
|
||||
</div>
|
||||
}
|
||||
|
||||
{/*<div style="clear:both;"></div>*/}
|
||||
{/*<div id="ajax-indicator" style="display:none;"><span>载入中...</span></div>*/}
|
||||
{/*<div id="ajax-modal" style="display:none;"></div>*/}
|
||||
|
|
|
|||
|
|
@ -1,9 +1,9 @@
|
|||
import React, { Component } from 'react';
|
||||
import { Link } from "react-router-dom";
|
||||
import AccountProfile from "../user/AccountProfile";
|
||||
import { getImageUrl } from 'educoder'
|
||||
import { getImageUrl,getLogoImageUrl } from 'educoder'
|
||||
import axios from 'axios';
|
||||
import { Modal, Input, message, notification } from 'antd';
|
||||
import { Modal, Input, message, notification, Button } from 'antd';
|
||||
|
||||
import LoginDialog from '../login/LoginDialog';
|
||||
import GotoQQgroup from '../../modal/GotoQQgroup'
|
||||
|
|
@ -13,7 +13,7 @@ import 'antd/lib/radio/style/index.css';
|
|||
import 'antd/lib/input/style/index.css';
|
||||
import './TPMIndex.css';
|
||||
import './css/headerExcess.css';
|
||||
import logo from './images/logo.png';
|
||||
import logo from './images/hskylogo.png';
|
||||
|
||||
const $ = window.$
|
||||
// TODO 这部分脚本从公共脚本中直接调用
|
||||
|
|
@ -586,6 +586,8 @@ class NewHeader extends Component {
|
|||
return true
|
||||
} else if (url.indexOf('users') > -1 && match.path.indexOf('users') > -1) {
|
||||
return true
|
||||
} else if (['http://117.50.100.12:8080','https://osredm.com'].includes(url) && match.path === '/') {
|
||||
return true
|
||||
} else {
|
||||
return false
|
||||
}
|
||||
|
|
@ -618,74 +620,76 @@ class NewHeader extends Component {
|
|||
mygetHelmetapi2,
|
||||
goshowqqgtounp,
|
||||
} = this.state;
|
||||
|
||||
let activeIndex =match.path === '/'?true: '';
|
||||
|
||||
/*用户名称 用户头像url*/
|
||||
let activeIndex = false;
|
||||
let activeForums = false;
|
||||
let activeShixuns = false;
|
||||
let activePaths = false;
|
||||
let coursestype = false;
|
||||
let activePackages = false;
|
||||
let activeMoopCases = false;
|
||||
let activeCompetitions = false;
|
||||
// let activeIndex = false;
|
||||
// let activeForums = false;
|
||||
// let activeShixuns = false;
|
||||
// let activePaths = false;
|
||||
// let coursestype = false;
|
||||
// let activePackages = false;
|
||||
// let activeMoopCases = false;
|
||||
// let activeCompetitions = false;
|
||||
|
||||
if (match.path === '/forums') {
|
||||
activeForums = true;
|
||||
} else if (match.path.startsWith('/shixuns')) {
|
||||
activeShixuns = true;
|
||||
} else if (match.path.startsWith('/paths')) {
|
||||
activePaths = true;
|
||||
} else if (match.path.startsWith('/courses')) {
|
||||
coursestype = true;
|
||||
} else if (match.path.startsWith('/crowdsourcing')) {
|
||||
activePackages = true;
|
||||
} else if (match.path.startsWith('/moop_cases')) {
|
||||
activeMoopCases = true;
|
||||
} else if (match.path.startsWith('/competitions')) {
|
||||
activeCompetitions = true;
|
||||
} else {
|
||||
activeIndex = true;
|
||||
}
|
||||
|
||||
let headtypes = '/';
|
||||
if (mygetHelmetapi2) {
|
||||
if (mygetHelmetapi2.navbar) {
|
||||
if (mygetHelmetapi2.navbar.length > 0) {
|
||||
if (match.path === '/') {
|
||||
if (headtypesonClickbool === false) {
|
||||
headtypes = undefined;
|
||||
} else {
|
||||
headtypes = headtypess;
|
||||
}
|
||||
} else {
|
||||
for (var i = 0; i < mygetHelmetapi2.navbar.length; i++) {
|
||||
if (match.path === mygetHelmetapi2.navbar[i].link) {
|
||||
headtypes = mygetHelmetapi2.navbar[i].link;
|
||||
break;
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
let shixuntype = false;
|
||||
let pathstype = false;
|
||||
// if (match.path === '/forums') {
|
||||
// activeForums = true;
|
||||
// } else if (match.path.startsWith('/shixuns')) {
|
||||
// activeShixuns = true;
|
||||
// } else if (match.path.startsWith('/paths')) {
|
||||
// activePaths = true;
|
||||
// } else if (match.path.startsWith('/courses')) {
|
||||
// coursestype = true;
|
||||
// } else if (match.path.startsWith('/crowdsourcing')) {
|
||||
// activePackages = true;
|
||||
// } else if (match.path.startsWith('/moop_cases')) {
|
||||
// activeMoopCases = true;
|
||||
// } else if (match.path.startsWith('/competitions')) {
|
||||
// activeCompetitions = true;
|
||||
// } else {
|
||||
// activeIndex = true;
|
||||
// }
|
||||
// let headtypes = '/';
|
||||
// if (mygetHelmetapi2) {
|
||||
// if (mygetHelmetapi2.navbar) {
|
||||
// if (mygetHelmetapi2.navbar.length > 0) {
|
||||
// if (match.path === '/') {
|
||||
// if (headtypesonClickbool === false) {
|
||||
// headtypes = undefined;
|
||||
// } else {
|
||||
// headtypes = headtypess;
|
||||
// }
|
||||
// } else {
|
||||
// for (var i = 0; i < mygetHelmetapi2.navbar.length; i++) {
|
||||
// if (match.path === mygetHelmetapi2.navbar[i].link) {
|
||||
// headtypes = mygetHelmetapi2.navbar[i].link;
|
||||
// break;
|
||||
// }
|
||||
// }
|
||||
// }
|
||||
// }
|
||||
// }
|
||||
// }
|
||||
// let shixuntype = false;
|
||||
// let pathstype = false;
|
||||
let coursestypes = false;
|
||||
if (this.props && this.props.mygetHelmetapi != null) {
|
||||
let shixun = "/shixuns";
|
||||
let paths = "/paths";
|
||||
// let shixun = "/shixuns";
|
||||
// let paths = "/paths";
|
||||
let courses = "/courses";
|
||||
this.props.mygetHelmetapi.navbar.map((item, key) => {
|
||||
var reg = RegExp(item.link);
|
||||
if (shixun.match(reg)) {
|
||||
if (item.hidden === true) {
|
||||
shixuntype = true
|
||||
}
|
||||
}
|
||||
if (paths.match(reg)) {
|
||||
if (item.hidden === true) {
|
||||
pathstype = true
|
||||
}
|
||||
}
|
||||
// if (shixun.match(reg)) {
|
||||
// if (item.hidden === true) {
|
||||
// shixuntype = true
|
||||
// }
|
||||
// }
|
||||
// if (paths.match(reg)) {
|
||||
// if (item.hidden === true) {
|
||||
// pathstype = true
|
||||
// }
|
||||
// }
|
||||
if (courses.match(reg)) {
|
||||
if (item.hidden === true) {
|
||||
coursestypes = true
|
||||
|
|
@ -694,7 +698,7 @@ class NewHeader extends Component {
|
|||
})
|
||||
}
|
||||
return (
|
||||
<div className="newHeaders" id="nHeader">
|
||||
<div className={`newHeaders ${activeIndex && 'homePage'}`} id="nHeader">
|
||||
<div className="headerContent">
|
||||
{isRender === true ?
|
||||
<LoginDialog
|
||||
|
|
@ -717,7 +721,7 @@ class NewHeader extends Component {
|
|||
<a href={mygetHelmetapi2 && mygetHelmetapi2.new_course.default_url} className={"fl mr30"} style={{minWidth:"45px"}}>
|
||||
{
|
||||
mygetHelmetapi2 && mygetHelmetapi2.nav_logo_url ?
|
||||
<img alt="可控开源社区" className="logoimg" style={{ heigth: "40px" }} src={getImageUrl(mygetHelmetapi2.nav_logo_url)}></img>
|
||||
<img alt="红山开源社区" className="logoimg" style={{ heigth: "40px" }} src={activeIndex?logo:getLogoImageUrl(mygetHelmetapi2.nav_logo_url)}></img>
|
||||
:
|
||||
""
|
||||
}
|
||||
|
|
@ -762,7 +766,7 @@ class NewHeader extends Component {
|
|||
<div className="head-right">
|
||||
{this.props.user && this.props.user.login &&
|
||||
<div className="edu-menu-panel">
|
||||
<i className="iconfont icon-tianjiafangda color-grey-6"></i>
|
||||
<i className={`iconfont icon-tianjiafangda ${activeIndex?'color-home':'color-grey-6'} `}></i>
|
||||
<div className="edu-menu-list" style={{ top: '48px' }}>
|
||||
<div className="overPart"></div>
|
||||
{
|
||||
|
|
@ -780,7 +784,7 @@ class NewHeader extends Component {
|
|||
<div className="ml30 edu-menu-panel">
|
||||
{user && user.login &&
|
||||
<a href={`${mygetHelmetapi2 && mygetHelmetapi2.new_course && mygetHelmetapi2.new_course.tiding_url}`} style={{ position: 'relative' }} target="_blank">
|
||||
<i className="iconfont icon-xiaoxilingdang color-grey-6"></i>
|
||||
<i className={`iconfont icon-xiaoxilingdang ${activeIndex?'color-home':'color-grey-6'}`}></i>
|
||||
<span className="newslight" style={{ display: this.props.Headertop === undefined ? "none" : this.props.Headertop.new_message === true ? "block" : "none" }}>
|
||||
</span>
|
||||
</a>
|
||||
|
|
@ -814,20 +818,15 @@ class NewHeader extends Component {
|
|||
</div>
|
||||
</Modal>
|
||||
</div>
|
||||
{user === undefined ?
|
||||
<span className="font-15">
|
||||
<a onClick={() => this.educoderlogin()} className="mr5 color-grey-6">登录</a>
|
||||
{user === undefined || user.login === "" ?
|
||||
<span className="login-box">
|
||||
<a onClick={() => this.educoderlogin()} className={`mr5 ${activeIndex ? 'color-home' : 'color-grey-6'}`}>登录</a>
|
||||
{
|
||||
mygetHelmetapi2 && mygetHelmetapi2.new_course && mygetHelmetapi2.new_course.register_url &&
|
||||
<span><em className="vertical-line"></em><a className="ml5 color-grey-6" href={`${mygetHelmetapi2.new_course.register_url}`} target="_blank">注册</a></span>
|
||||
}
|
||||
</span>
|
||||
: user.login === "" ?
|
||||
<span className="font-15">
|
||||
<a onClick={() => this.educoderlogin()} className="mr5 color-grey-6">登录</a>
|
||||
{
|
||||
mygetHelmetapi2 && mygetHelmetapi2.new_course && mygetHelmetapi2.new_course.register_url &&
|
||||
<span><em className="vertical-line"></em><a className="color-grey-6 ml5" href={`${mygetHelmetapi2.new_course.register_url}`} target="_blank">注册</a></span>
|
||||
mygetHelmetapi2 && mygetHelmetapi2.new_course && mygetHelmetapi2.new_course.register_url && (
|
||||
activeIndex ?
|
||||
<Button className="register-button" type="primary" size="large">免费注册</Button> :
|
||||
<span><em className="vertical-line"></em><a className={`ml5 ${activeIndex ? 'color-home' : 'color-grey-6'}`} href={`${mygetHelmetapi2.new_course.register_url}`} target="_blank">注册</a></span>
|
||||
)
|
||||
}
|
||||
</span>
|
||||
:
|
||||
|
|
|
|||
|
|
@ -772,14 +772,14 @@ class NewHeader extends Component {
|
|||
mygetHelmetapi2.nav_logo_url &&
|
||||
mygetHelmetapi2.nav_logo_url ? (
|
||||
<img
|
||||
alt="可控开源社区"
|
||||
alt="红山开源社区"
|
||||
className="logoimg"
|
||||
style={{ heigth: "40px" }}
|
||||
src={getImageUrl(mygetHelmetapi2.nav_logo_url)}
|
||||
></img>
|
||||
) : (
|
||||
<img
|
||||
alt="可控开源社区"
|
||||
alt="红山开源社区"
|
||||
className="logoimg"
|
||||
style={{ heigth: "40px" }}
|
||||
src={getImageUrl("images/educoder/headNavLogo.png?1526520218")}
|
||||
|
|
|
|||
|
|
@ -9,7 +9,7 @@ import LoginDialog from '../login/LoginDialog';
|
|||
import AccountProfile from '../user/AccountProfile';
|
||||
import AccountPhoneemail from '../user/AccountPhoneemail';
|
||||
|
||||
export function TPMIndexHOC(WrappedComponent) {
|
||||
export function TPMIndexHOC(WrappedComponent, headFoot) {
|
||||
return class II extends React.Component {
|
||||
constructor(props) {
|
||||
super(props);
|
||||
|
|
@ -153,7 +153,7 @@ export function TPMIndexHOC(WrappedComponent) {
|
|||
this.gettablogourlnull();
|
||||
});
|
||||
}
|
||||
|
||||
|
||||
fetchUsers = () => {
|
||||
let url = `/users/get_user_info.json`;
|
||||
axios.get(url).then((response) => {
|
||||
|
|
@ -162,9 +162,9 @@ export function TPMIndexHOC(WrappedComponent) {
|
|||
this.setState({
|
||||
tpmLoading: false
|
||||
})
|
||||
if (this.props.match.path === "/" && response.data.login) {
|
||||
this.props.history.push(`/users/${response.data.login}`);
|
||||
}
|
||||
// if (this.props.match.path === "/" && response.data.login) {
|
||||
// this.props.history.push(`/users/${response.data.login}`);
|
||||
// }
|
||||
}
|
||||
}).catch((error) => {
|
||||
console.log(error)
|
||||
|
|
@ -405,13 +405,16 @@ export function TPMIndexHOC(WrappedComponent) {
|
|||
>
|
||||
</WrappedComponent>
|
||||
}
|
||||
|
||||
|
||||
</div>
|
||||
</Spin>
|
||||
<NewFooter
|
||||
{...this.state} {...this.props}
|
||||
Footerdown={Footerdown}
|
||||
/>
|
||||
{
|
||||
headFoot && headFoot.noFooter ? "" :
|
||||
<NewFooter
|
||||
{...this.state} {...this.props}
|
||||
Footerdown={Footerdown}
|
||||
/>
|
||||
}
|
||||
</div>
|
||||
);
|
||||
}
|
||||
|
|
|
|||
|
|
@ -9,4 +9,7 @@
|
|||
left:0px;
|
||||
bottom: 12px;
|
||||
position: absolute;
|
||||
}
|
||||
}
|
||||
.login-box{
|
||||
font-size: 15px;
|
||||
}
|
||||
|
|
|
|||
Binary file not shown.
|
After Width: | Height: | Size: 10 KiB |
Loading…
Reference in New Issue