Merge pull request '内网合并竞赛' (#352) from tongChong/forgeplus-react:dev_military_local into dev_military_qz2022
|
@ -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"
|
||||
}
|
||||
}
|
||||
}
|
||||
},
|
||||
|
@ -2170,7 +2179,7 @@
|
|||
},
|
||||
"babel-plugin-transform-runtime": {
|
||||
"version": "6.23.0",
|
||||
"resolved": "https://registry.npmjs.org/babel-plugin-transform-runtime/-/babel-plugin-transform-runtime-6.23.0.tgz",
|
||||
"resolved": "https://registry.npm.taobao.org/babel-plugin-transform-runtime/download/babel-plugin-transform-runtime-6.23.0.tgz",
|
||||
"integrity": "sha1-iEkNRGUC6puOfvsP4J7E2ZR5se4=",
|
||||
"requires": {
|
||||
"babel-runtime": "^6.22.0"
|
||||
|
@ -2291,7 +2300,7 @@
|
|||
},
|
||||
"babel-preset-react": {
|
||||
"version": "6.24.1",
|
||||
"resolved": "https://registry.npmjs.org/babel-preset-react/-/babel-preset-react-6.24.1.tgz",
|
||||
"resolved": "https://registry.npm.taobao.org/babel-preset-react/download/babel-preset-react-6.24.1.tgz",
|
||||
"integrity": "sha1-umnfrqRfw+xjm2pOzqbhdwLJE4A=",
|
||||
"requires": {
|
||||
"babel-plugin-syntax-jsx": "^6.3.13",
|
||||
|
@ -3649,7 +3658,7 @@
|
|||
},
|
||||
"code-prettify": {
|
||||
"version": "0.1.0",
|
||||
"resolved": "https://registry.npmjs.org/code-prettify/-/code-prettify-0.1.0.tgz",
|
||||
"resolved": "https://registry.npm.taobao.org/code-prettify/download/code-prettify-0.1.0.tgz",
|
||||
"integrity": "sha1-RocMyMGlDQm61TmzOpg9vUqjSx4="
|
||||
},
|
||||
"codemirror": {
|
||||
|
@ -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,61 +4040,74 @@
|
|||
"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",
|
||||
"integrity": "sha512-+/HKd6EgcQCJGh2PSjZuUitQBQynKor4wrFbRg4DtAgS1aWO+gU52xpH7M9ScGgXSYmAVS9bIJ8EzuaGw0oNAw==",
|
||||
"version": "5.2.1",
|
||||
"resolved": "https://registry.npmjs.org/cross-env/-/cross-env-5.2.1.tgz",
|
||||
"integrity": "sha512-1yHhtcfAd1r4nwQgknowuUNfIT9E8dOMMspC36g45dN+iD1blloi7xp8X/xAIDnjHWyt1uQ8PHk2fkNaym7soQ==",
|
||||
"dev": true,
|
||||
"requires": {
|
||||
"cross-spawn": "^7.0.1"
|
||||
"cross-spawn": "^6.0.5"
|
||||
},
|
||||
"dependencies": {
|
||||
"cross-spawn": {
|
||||
"version": "7.0.3",
|
||||
"resolved": "https://registry.npmjs.org/cross-spawn/-/cross-spawn-7.0.3.tgz",
|
||||
"integrity": "sha512-iRDPJKUPVEND7dHPO8rkbOnPpyDygcDFtWjpeWNCgy8WP2rXcxXL8TskReQl6OrB2G7+UJrags1q15Fudc7G6w==",
|
||||
"version": "6.0.5",
|
||||
"resolved": "https://registry.npmjs.org/cross-spawn/-/cross-spawn-6.0.5.tgz",
|
||||
"integrity": "sha512-eTVLrBSt7fjbDygz805pMnstIs2VTBNkRm0qxZd+M7A5XDdxVRWO5MxGBXZhjY4cqLYLdtrGqRf8mBPmzwSpWQ==",
|
||||
"dev": true,
|
||||
"requires": {
|
||||
"path-key": "^3.1.0",
|
||||
"shebang-command": "^2.0.0",
|
||||
"which": "^2.0.1"
|
||||
}
|
||||
},
|
||||
"path-key": {
|
||||
"version": "3.1.1",
|
||||
"resolved": "https://registry.npmjs.org/path-key/-/path-key-3.1.1.tgz",
|
||||
"integrity": "sha512-ojmeN0qd+y0jszEtoY48r0Peq5dwMEkIlCOu6Q5f41lfkswXuKtYrhgoTpLnyIcHm24Uhqx+5Tqm2InSwLhE6Q==",
|
||||
"dev": true
|
||||
},
|
||||
"shebang-command": {
|
||||
"version": "2.0.0",
|
||||
"resolved": "https://registry.npmjs.org/shebang-command/-/shebang-command-2.0.0.tgz",
|
||||
"integrity": "sha512-kHxr2zZpYtdmrN1qDjrrX/Z1rR1kG8Dx+gkpK1G4eXmvXswmcE1hTWBWYUzlraYw1/yZp6YuDY77YtvbN0dmDA==",
|
||||
"dev": true,
|
||||
"requires": {
|
||||
"shebang-regex": "^3.0.0"
|
||||
}
|
||||
},
|
||||
"shebang-regex": {
|
||||
"version": "3.0.0",
|
||||
"resolved": "https://registry.npmjs.org/shebang-regex/-/shebang-regex-3.0.0.tgz",
|
||||
"integrity": "sha512-7++dFhtcx3353uBaq8DDR4NuxBetBzC7ZQOhmTQInHEd6bSrXdiEyzCvG07Z44UYdLShWUyXt5M/yhz8ekcb1A==",
|
||||
"dev": true
|
||||
},
|
||||
"which": {
|
||||
"version": "2.0.2",
|
||||
"resolved": "https://registry.npmjs.org/which/-/which-2.0.2.tgz",
|
||||
"integrity": "sha512-BLI3Tl1TW3Pvl70l3yq3Y64i+awpwXqsGBYWkkqMtnbXgrMD+yj7rhW0kuEDxzJaYXGjEW5ogapKNMEKNMjibA==",
|
||||
"dev": true,
|
||||
"requires": {
|
||||
"isexe": "^2.0.0"
|
||||
"nice-try": "^1.0.4",
|
||||
"path-key": "^2.0.1",
|
||||
"semver": "^5.5.0",
|
||||
"shebang-command": "^1.2.0",
|
||||
"which": "^1.2.9"
|
||||
}
|
||||
}
|
||||
}
|
||||
},
|
||||
<<<<<<< HEAD
|
||||
=======
|
||||
>>>>>>> 01f71bca87fac88ba9ad56c16260521c47f4ca6c
|
||||
"cross-fetch": {
|
||||
"version": "3.1.5",
|
||||
"resolved": "http://173.15.15.82:8081/repository/npm-all/cross-fetch/-/cross-fetch-3.1.5.tgz",
|
||||
"integrity": "sha512-lvb1SBsI0Z7GDwmuid+mU3kWVBwTVUbe7S0H52yaaAdQOXq2YktTCZdlAcNKFzE6QtRz0snpw9bNiPeOIkkQvw==",
|
||||
"dev": true,
|
||||
"requires": {
|
||||
"node-fetch": "2.6.7"
|
||||
},
|
||||
"dependencies": {
|
||||
"node-fetch": {
|
||||
"version": "2.6.7",
|
||||
"resolved": "http://173.15.15.82:8081/repository/npm-all/node-fetch/-/node-fetch-2.6.7.tgz",
|
||||
"integrity": "sha512-ZjMPFEfVx5j+y2yF35Kzx5sF7kDzxuDj6ziH4FFbOp87zKDZNx8yExJIb05OGF4Nlt9IHFIMBkRl41VdvcNdbQ==",
|
||||
"dev": true,
|
||||
"requires": {
|
||||
"whatwg-url": "^5.0.0"
|
||||
}
|
||||
},
|
||||
"webidl-conversions": {
|
||||
"version": "3.0.1",
|
||||
"resolved": "http://173.15.15.82:8081/repository/npm-all/webidl-conversions/-/webidl-conversions-3.0.1.tgz",
|
||||
"integrity": "sha512-2JAn3z8AR6rjK8Sm8orRC0h/bcl/DqL7tRPdGZ4I1CjdF+EaMLmYxBHyXuKL849eucPFhvBoxMsflfOb8kxaeQ==",
|
||||
"dev": true
|
||||
},
|
||||
"whatwg-url": {
|
||||
"version": "5.0.0",
|
||||
"resolved": "http://173.15.15.82:8081/repository/npm-all/whatwg-url/-/whatwg-url-5.0.0.tgz",
|
||||
"integrity": "sha512-saE57nupxk6v3HY35+jzBwYa0rKSy0XR8JSxZPwgLr7ys0IBzhGviA1/TUGJLmSVqs8pb9AnvICXEuOHLprYTw==",
|
||||
"dev": true,
|
||||
"requires": {
|
||||
"tr46": "~0.0.3",
|
||||
"webidl-conversions": "^3.0.0"
|
||||
}
|
||||
}
|
||||
}
|
||||
},
|
||||
"cross-port-killer": {
|
||||
"version": "1.4.0",
|
||||
"resolved": "https://registry.npmjs.org/cross-port-killer/-/cross-port-killer-1.4.0.tgz",
|
||||
"integrity": "sha512-ujqfftKsSeorFMVI6JP25xMBixHEaDWVK+NarRZAGnJjR5AhebRQU+g+k/Lj8OHwM6f+wrrs8u5kkCdI7RLtxQ=="
|
||||
},
|
||||
>>>>>>> 5b7235fa (参赛报名样式)
|
||||
"cross-spawn": {
|
||||
"version": "5.1.0",
|
||||
"resolved": "https://registry.npmjs.org/cross-spawn/-/cross-spawn-5.1.0.tgz",
|
||||
|
@ -5086,7 +5110,7 @@
|
|||
},
|
||||
"dom-closest": {
|
||||
"version": "0.2.0",
|
||||
"resolved": "https://registry.npmjs.org/dom-closest/-/dom-closest-0.2.0.tgz",
|
||||
"resolved": "https://registry.npm.taobao.org/dom-closest/download/dom-closest-0.2.0.tgz",
|
||||
"integrity": "sha1-69n5HRvyLo1vR3h2u80+yQIWwM8=",
|
||||
"requires": {
|
||||
"dom-matches": ">=1.0.1"
|
||||
|
@ -5130,7 +5154,7 @@
|
|||
},
|
||||
"dom-matches": {
|
||||
"version": "2.0.0",
|
||||
"resolved": "https://registry.npmjs.org/dom-matches/-/dom-matches-2.0.0.tgz",
|
||||
"resolved": "https://registry.npm.taobao.org/dom-matches/download/dom-matches-2.0.0.tgz",
|
||||
"integrity": "sha1-0nKLQWqHUzmA6wibhI0lPPI6dYw="
|
||||
},
|
||||
"dom-scroll-into-view": {
|
||||
|
@ -5386,7 +5410,7 @@
|
|||
},
|
||||
"enquire.js": {
|
||||
"version": "2.1.6",
|
||||
"resolved": "https://registry.npmjs.org/enquire.js/-/enquire.js-2.1.6.tgz",
|
||||
"resolved": "https://registry.npm.taobao.org/enquire.js/download/enquire.js-2.1.6.tgz?cache=0&other_urls=https%3A%2F%2Fregistry.npm.taobao.org%2Fenquire.js%2Fdownload%2Fenquire.js-2.1.6.tgz",
|
||||
"integrity": "sha1-PoeAybi4NQhMP2DhZtvDwqPImBQ="
|
||||
},
|
||||
"entities": {
|
||||
|
@ -5934,7 +5958,7 @@
|
|||
},
|
||||
"eventlistener": {
|
||||
"version": "0.0.1",
|
||||
"resolved": "https://registry.npmjs.org/eventlistener/-/eventlistener-0.0.1.tgz",
|
||||
"resolved": "https://registry.npm.taobao.org/eventlistener/download/eventlistener-0.0.1.tgz",
|
||||
"integrity": "sha1-7Suqu4UiJ68rz4iRUscsY8pTLrg="
|
||||
},
|
||||
"events": {
|
||||
|
@ -7681,7 +7705,7 @@
|
|||
},
|
||||
"hammerjs": {
|
||||
"version": "2.0.8",
|
||||
"resolved": "https://registry.npmjs.org/hammerjs/-/hammerjs-2.0.8.tgz",
|
||||
"resolved": "https://registry.npm.taobao.org/hammerjs/download/hammerjs-2.0.8.tgz",
|
||||
"integrity": "sha1-BO93hiz/K7edMPdpIJWTAiK/YPE="
|
||||
},
|
||||
"handle-thing": {
|
||||
|
@ -8576,7 +8600,7 @@
|
|||
},
|
||||
"immutable": {
|
||||
"version": "3.7.6",
|
||||
"resolved": "https://registry.npmjs.org/immutable/-/immutable-3.7.6.tgz",
|
||||
"resolved": "https://registry.npm.taobao.org/immutable/download/immutable-3.7.6.tgz",
|
||||
"integrity": "sha1-E7TTyxK++hVIKib+Gy665kAHHks="
|
||||
},
|
||||
"import-fresh": {
|
||||
|
@ -10211,7 +10235,7 @@
|
|||
},
|
||||
"lodash.throttle": {
|
||||
"version": "4.1.1",
|
||||
"resolved": "https://registry.npmjs.org/lodash.throttle/-/lodash.throttle-4.1.1.tgz",
|
||||
"resolved": "https://registry.npm.taobao.org/lodash.throttle/download/lodash.throttle-4.1.1.tgz",
|
||||
"integrity": "sha1-wj6RtxAkKscMN/HhzaknTMOb8vQ="
|
||||
},
|
||||
"lodash.uniq": {
|
||||
|
@ -14663,6 +14687,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 +15179,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 +16343,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 +16371,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 +17109,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 +19251,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";
|
||||
}
|
||||
|
|
|
@ -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",
|
||||
|
|
18
src/App.js
|
@ -55,6 +55,11 @@ const Task = Loadable({
|
|||
loader: () => import('./military/task'),
|
||||
loading: Loading,
|
||||
})
|
||||
//任务/需求
|
||||
const Qz2022 = Loadable({
|
||||
loader: () => import('./military/qz2022'),
|
||||
loading: Loading,
|
||||
});
|
||||
//403页面
|
||||
const Shixunauthority = Loadable({
|
||||
loader: () => import('./modules/403/Shixunauthority'),
|
||||
|
@ -85,6 +90,11 @@ const EducoderLogin = Loadable({
|
|||
loading: Loading,
|
||||
})
|
||||
|
||||
const HomePage = Loadable({
|
||||
loader: () => import('./home'),
|
||||
loading: Loading,
|
||||
})
|
||||
|
||||
class App extends Component {
|
||||
constructor(props) {
|
||||
super(props);
|
||||
|
@ -131,6 +141,8 @@ class App extends Component {
|
|||
}
|
||||
});
|
||||
}
|
||||
|
||||
|
||||
componentDidMount() {
|
||||
document.title = "loading...";
|
||||
this.disableVideoContextMenu();
|
||||
|
@ -262,6 +274,9 @@ class App extends Component {
|
|||
{/*任务*/}
|
||||
<Route path="/task" component={Task} />
|
||||
|
||||
{/*任务*/}
|
||||
<Route path="/competition/qz2022" component={Qz2022} />
|
||||
|
||||
{/*403*/}
|
||||
<Route path="/403" component={Shixunauthority} />
|
||||
|
||||
|
@ -285,7 +300,8 @@ class App extends Component {
|
|||
<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: '/' });
|
||||
|
@ -56,8 +56,10 @@ export function initAxiosInterceptors(props) {
|
|||
// TODO 避免重复的请求 https://github.com/axios/axios#cancellation
|
||||
var
|
||||
proxy = "http://localhost:3000";
|
||||
proxy = "https://forge.osredm.com";
|
||||
// proxy = "https://forge.osredm.com";
|
||||
// proxy = "http://117.50.100.12:49999";
|
||||
proxy = "http://111.8.36.180:8000";
|
||||
|
||||
|
||||
const requestMap = {};
|
||||
window.setfalseInRequestMap = function (keyName) {
|
||||
|
|
|
@ -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()));
|
||||
|
|
|
@ -68,6 +68,7 @@ export function appendFileSizeToUploadFile(item) {
|
|||
return `${item.title}${uploadNameSizeSeperator}${item.filesize}`
|
||||
}
|
||||
export function appendFileSizeToUploadFileAll(fileList) {
|
||||
console.log('fileList',fileList);
|
||||
return fileList && fileList.map(item => {
|
||||
if (item.name.indexOf(uploadNameSizeSeperator) == -1) {
|
||||
return Object.assign({}, item, { name: `${item.name}${uploadNameSizeSeperator}${bytesToSize(item.size)}` })
|
||||
|
|
|
@ -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';
|
||||
|
|
|
@ -5,7 +5,7 @@ import './Component.scss';
|
|||
export default (()=>{
|
||||
return(
|
||||
<div className="handleBox">
|
||||
<a href="https://forum.trustie.net/forums/3075/detail" target="_blank" >
|
||||
<a href="https://www.osredm.com/forums/594/detail" target="_blank" >
|
||||
<img src={Handbook} alt=""/>
|
||||
</a>
|
||||
</div>
|
||||
|
|
|
@ -0,0 +1,367 @@
|
|||
|
||||
.dropdownFlex{
|
||||
display:flex;
|
||||
background:#fff;
|
||||
border-radius: 3px;
|
||||
.ant-menu-vertical > .ant-menu-item{
|
||||
border:none;
|
||||
height: 35px;
|
||||
line-height: 35px;
|
||||
margin:0px;
|
||||
&.ant-menu-item-selected{
|
||||
background-color: #fff;
|
||||
a{color: rgba(0, 0, 0, 0.65)!important;}
|
||||
}
|
||||
&.ant-menu-item-active{
|
||||
a{color: #4cacff!important;}
|
||||
}
|
||||
}
|
||||
.ant-menu-vertical{
|
||||
border:none;
|
||||
}
|
||||
}
|
||||
.currentImg{
|
||||
width: 34px;
|
||||
height: 34px;
|
||||
border-radius: 50%;
|
||||
margin-left: 15px;
|
||||
}
|
||||
|
||||
.currentMenu{
|
||||
width: 120px;
|
||||
text-align: center;
|
||||
padding:0px;
|
||||
.currentName{
|
||||
padding:0px 8px;
|
||||
overflow: hidden;
|
||||
white-space: nowrap;
|
||||
text-overflow: ellipsis;
|
||||
display: block;
|
||||
}
|
||||
li{
|
||||
height: 40px;
|
||||
line-height: 40px;
|
||||
padding:0px!important;
|
||||
cursor: default;
|
||||
&:hover{
|
||||
background-color: #fff;
|
||||
}
|
||||
&:first-child{
|
||||
border-bottom: 1px solid #eee;
|
||||
}
|
||||
&:last-child{
|
||||
border-top: 1px solid #eee;
|
||||
a{
|
||||
border-radius: 0px 0px 4px 4px;
|
||||
}
|
||||
}
|
||||
a{
|
||||
padding:0px;
|
||||
margin:0px;
|
||||
display: block;
|
||||
color: #666;
|
||||
&:hover{
|
||||
color: #fff;
|
||||
background: #4CACFF;
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
.newFooter {
|
||||
// position: absolute;
|
||||
bottom: 0;
|
||||
width: 100%;
|
||||
background: #323232;
|
||||
clear: both;
|
||||
min-width: 1200px;
|
||||
z-index: 8;
|
||||
left: 0px;
|
||||
padding-bottom: 15px;
|
||||
p {
|
||||
margin-top: 0;
|
||||
margin-bottom:0px !important;
|
||||
}
|
||||
.footerInfos{
|
||||
display: flex;
|
||||
max-width: 1200px;
|
||||
margin:0px auto;
|
||||
justify-content: space-around;
|
||||
padding:60px 0px;
|
||||
& >ul{
|
||||
padding:0px 40px;
|
||||
box-sizing: border-box;
|
||||
max-width: 25%;
|
||||
text-align: left;
|
||||
li{
|
||||
color: #fff;
|
||||
font-weight: 300;
|
||||
&:first-child{
|
||||
font-size: 17px;
|
||||
}
|
||||
&>a,&>span{
|
||||
color: #bbb;
|
||||
}
|
||||
&>a:hover{
|
||||
color: #4cacff;
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
.footerCopy{
|
||||
color: #bbb;
|
||||
border-top: 1px solid #4e4e4e;
|
||||
padding:10px 0px;
|
||||
a{
|
||||
color: #bbb;
|
||||
&:hover{
|
||||
color: #4cacff;
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
.inviteForm{
|
||||
.ant-form-item{
|
||||
margin-right: 0px;
|
||||
}
|
||||
.ant-form-item-label{
|
||||
width: 110px;
|
||||
text-align: right;
|
||||
}
|
||||
.ant-form-explain{
|
||||
position: absolute;
|
||||
}
|
||||
}
|
||||
|
||||
// 右上角小铃铛单独样式
|
||||
.notice-popover{
|
||||
z-index: 1000001;
|
||||
//popover小尖尖
|
||||
.ant-popover-arrow{
|
||||
display: none;
|
||||
}
|
||||
|
||||
//popover框
|
||||
.ant-popover-inner-content {
|
||||
width: 386px;
|
||||
height: 446px;
|
||||
box-shadow: 0px 4px 8px 2px rgba(212, 212, 212, 0.5);
|
||||
border-radius: 4px;
|
||||
margin-top: -10px;
|
||||
padding: 12px 1px 12px 0;
|
||||
}
|
||||
}
|
||||
|
||||
.messageHoverDiv .ant-menu-item{
|
||||
margin-right: 24px !important;
|
||||
}
|
||||
|
||||
.hoverNotice-head{
|
||||
margin-left: 18px;
|
||||
|
||||
& .ant-badge{
|
||||
font-size: 14px !important;
|
||||
}
|
||||
|
||||
&>.ant-menu-horizontal {
|
||||
border-bottom: 1px solid #e8e8e8 !important;
|
||||
}
|
||||
}
|
||||
|
||||
.hoverNotice-body{
|
||||
height: 342px;
|
||||
overflow-y: scroll;
|
||||
|
||||
& b{
|
||||
font-weight: 400;
|
||||
text-shadow: 0.5px 0 0 #333;
|
||||
}
|
||||
|
||||
.none_panels{
|
||||
height: 100%;
|
||||
}
|
||||
}
|
||||
|
||||
.message-icon{
|
||||
position: relative;
|
||||
.ant-scroll-number{
|
||||
// right:12px;
|
||||
padding: 0 0px;
|
||||
}
|
||||
}
|
||||
|
||||
|
||||
|
||||
.hoverNotice-buttom{
|
||||
display: flex;
|
||||
justify-content: space-between;
|
||||
padding: 12px 18px;
|
||||
a{
|
||||
color: #466AFF;
|
||||
&:hover{
|
||||
opacity:0.85;
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
.noticeCont-back{
|
||||
.pointer{
|
||||
cursor: pointer;
|
||||
}
|
||||
&:hover{
|
||||
background: #F3F4F6;
|
||||
}
|
||||
}
|
||||
|
||||
.noticeCont{
|
||||
display: flex;
|
||||
margin: 0 16px 0 18px;
|
||||
padding: 12px 0 10px 0;
|
||||
line-height: 24px;
|
||||
border-bottom: 1px solid #EEEEEE;
|
||||
cursor: default;
|
||||
i{
|
||||
font-size: 14px !important;
|
||||
margin-right: 6px;
|
||||
color: #333333;
|
||||
}
|
||||
|
||||
.boldSpan{
|
||||
font-weight: 400;
|
||||
text-shadow: 0.5px 0 0 #333;
|
||||
}
|
||||
|
||||
.noticeCont-text{
|
||||
display: flex;
|
||||
color:#333333;
|
||||
flex:auto;
|
||||
justify-content: space-between;
|
||||
|
||||
& .content-span{
|
||||
word-break: break-all;
|
||||
text-overflow: ellipsis;
|
||||
display: -webkit-box;
|
||||
-webkit-box-orient: vertical;
|
||||
-webkit-line-clamp: 2;
|
||||
overflow: hidden;
|
||||
}
|
||||
|
||||
& .atme-cont-span{
|
||||
width: 272px;
|
||||
}
|
||||
|
||||
& .notice-cont-span{
|
||||
width: 255px;
|
||||
}
|
||||
|
||||
.timeSpan{
|
||||
font-size: 12px;
|
||||
color: #666666;
|
||||
}
|
||||
|
||||
.at-name{
|
||||
margin-right: 12px;
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
.text-center{
|
||||
text-align: center;
|
||||
}
|
||||
|
||||
.footEdition{
|
||||
background-color: #171B23;
|
||||
.footContent{
|
||||
display: flex;
|
||||
align-items: flex-start;
|
||||
padding:86px 0px;
|
||||
justify-content: space-around;
|
||||
width: 1200px;
|
||||
margin:0px auto;
|
||||
ul{
|
||||
min-width: 120px;
|
||||
text-align: left;
|
||||
margin-right: 80px;
|
||||
&.center{
|
||||
text-align: center;
|
||||
}
|
||||
&>p{
|
||||
height: 22px;
|
||||
font-size: 16px;
|
||||
font-weight: 400;
|
||||
color: #FFFFFF;
|
||||
line-height: 22px;
|
||||
}
|
||||
&>img{
|
||||
width: 100px;
|
||||
height: 100%;
|
||||
margin-bottom: 30px;
|
||||
margin-top: 25px;
|
||||
border-radius: 10px;
|
||||
}
|
||||
li{
|
||||
height: 20px;
|
||||
font-size: 14px;
|
||||
font-weight: 400;
|
||||
line-height: 20px;
|
||||
color: #BDC2D1;
|
||||
margin-bottom: 15px!important;
|
||||
a{
|
||||
color: #BDC2D1!important;
|
||||
&:hover{
|
||||
text-decoration: underline;
|
||||
}
|
||||
}
|
||||
&.thehead{
|
||||
height: 25px;
|
||||
font-size: 18px;
|
||||
font-weight: 600;
|
||||
color: #FFFFFF;
|
||||
line-height: 25px;
|
||||
margin-bottom: 20px!important;
|
||||
}
|
||||
}
|
||||
.theline{
|
||||
.imgCon{
|
||||
width: 90px;
|
||||
height: 90px;
|
||||
padding:5px;
|
||||
border-radius: 4px;
|
||||
background-color: #fff;
|
||||
img{
|
||||
width: 100%;
|
||||
border-radius: 3px;
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
.copyrightDesc{
|
||||
font-size: 12px;
|
||||
font-weight: 400;
|
||||
color: #BDC2D1;
|
||||
line-height: 28px;
|
||||
padding:15px 0px;
|
||||
text-align: center;
|
||||
background-color: #1B212C;
|
||||
a{
|
||||
color: #BDC2D1!important;
|
||||
}
|
||||
}
|
||||
.regBtn{
|
||||
height: 40px;
|
||||
background: #466AFF;
|
||||
border-radius: 2px;
|
||||
display: inline-block;
|
||||
padding:0px 18px;
|
||||
margin-left: 20px;
|
||||
font-size: 14px;
|
||||
font-weight: 400;
|
||||
color: #FFFFFF!important;
|
||||
line-height: 40px;
|
||||
&:hover{
|
||||
color: #FFFFFF!important;
|
||||
background-color: #355CFF;
|
||||
}
|
||||
}
|
|
@ -50,9 +50,13 @@ class Attachment extends Component {
|
|||
if (result) {
|
||||
this.setState({
|
||||
show_video: status === "preview",
|
||||
// video_url:
|
||||
// status === "preview"
|
||||
// ? "https://forgeplus.trustie.net" + result.data.url
|
||||
// : undefined,
|
||||
video_url:
|
||||
status === "preview"
|
||||
? "https://forgeplus.trustie.net" + result.data.url
|
||||
? result.data.url
|
||||
: undefined,
|
||||
move_spin: false,
|
||||
});
|
||||
|
|
|
@ -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&&list.map((item, i) => {
|
||||
return (
|
||||
<div className="news-slide-item" key={i}>
|
||||
<div className="slide-title" >
|
||||
<span className="order-num">{i + 1}</span>
|
||||
<h3 className="slide-title-content ellipsis-1 link" onClick={() => { goDetail(item.fake_id) }}>{item.title}</h3>
|
||||
<span className="slide-tag">{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,166 @@
|
|||
.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;
|
||||
}
|
||||
|
||||
|
||||
.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;
|
||||
}
|
||||
|
||||
.slick-slide:nth-child(n) .slide-tag{
|
||||
background: #586dff;
|
||||
}
|
||||
|
||||
.slick-slide:nth-child(2n) .slide-tag{
|
||||
background: #e53939;
|
||||
}
|
||||
|
||||
.slick-slide:nth-child(3n) .slide-tag{
|
||||
background: #ff7300;
|
||||
}
|
||||
}
|
|
@ -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&& 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&& 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);
|
||||
}
|
||||
}
|
||||
}
|
After Width: | Height: | Size: 12 KiB |
After Width: | Height: | Size: 16 KiB |
After Width: | Height: | Size: 26 KiB |
After Width: | Height: | Size: 10 KiB |
After Width: | Height: | Size: 93 KiB |
After Width: | Height: | Size: 130 KiB |
After Width: | Height: | Size: 77 KiB |
After Width: | Height: | Size: 108 KiB |
After Width: | Height: | Size: 5.2 KiB |
After Width: | Height: | Size: 68 KiB |
After Width: | Height: | Size: 211 KiB |
After Width: | Height: | Size: 207 KiB |
After Width: | Height: | Size: 157 KiB |
After Width: | Height: | Size: 1.6 MiB |
After Width: | Height: | Size: 1.1 KiB |
After Width: | Height: | Size: 2.0 KiB |
After Width: | Height: | Size: 2.3 KiB |
After Width: | Height: | Size: 16 KiB |
After Width: | Height: | Size: 282 KiB |
After Width: | Height: | Size: 182 KiB |
After Width: | Height: | Size: 2.3 KiB |
After Width: | Height: | Size: 3.0 KiB |
After Width: | Height: | Size: 6.4 KiB |
After Width: | Height: | Size: 10 KiB |
After Width: | Height: | Size: 8.9 KiB |
After Width: | Height: | Size: 9.0 KiB |
After Width: | Height: | Size: 39 KiB |
After Width: | Height: | Size: 67 KiB |
After Width: | Height: | Size: 21 KiB |
After Width: | Height: | Size: 751 KiB |
After Width: | Height: | Size: 5.5 KiB |
After Width: | Height: | Size: 4.8 KiB |
After Width: | Height: | Size: 6.7 KiB |
After Width: | Height: | Size: 24 KiB |
After Width: | Height: | Size: 55 KiB |
After Width: | Height: | Size: 99 KiB |
After Width: | Height: | Size: 65 KiB |
After Width: | Height: | Size: 52 KiB |
After Width: | Height: | Size: 92 KiB |
After Width: | Height: | Size: 74 KiB |
After Width: | Height: | Size: 60 KiB |
After Width: | Height: | Size: 75 KiB |
After Width: | Height: | Size: 16 KiB |
After Width: | Height: | Size: 23 KiB |
After Width: | Height: | Size: 957 KiB |
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,7 +1,7 @@
|
|||
import React, { useEffect, useState } from "react";
|
||||
import { Upload, Button } from 'antd';
|
||||
import { appendFileSizeToUploadFileAll } from 'educoder';
|
||||
import { httpUrl } from '../fetch';
|
||||
import { httpUrl } from '../task/fetch';
|
||||
|
||||
function Uploads({ className, size, actionUrl, fileList, showNotification, load }) {
|
||||
const [files, setFiles] = useState(undefined);
|
||||
|
|
|
@ -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>
|
||||
|
|
|
@ -1,4 +1,4 @@
|
|||
import { httpUrl } from '../fetch';
|
||||
import { httpUrl } from '../task/fetch';
|
||||
|
||||
export const editorConfig = {
|
||||
placeholder: '请输入',
|
||||
|
|
|
@ -0,0 +1,37 @@
|
|||
import React, { Fragment } from 'react';
|
||||
import { Table, Pagination } from 'antd';
|
||||
import './index.scss';
|
||||
|
||||
export default (props) => {
|
||||
const {className, loading, dataSource, columns, handleRow, total, setCurPage, current, rowSelection, expandedRowRender, expandIconColumnIndex, expandIconAsCell, onShowSizeChange, showSizeChanger, pagination, scroll,pageSize } = props;
|
||||
console.log(total);
|
||||
return (
|
||||
<div className={`pagination-table ${className}`}>
|
||||
<Table
|
||||
{...props}
|
||||
loading={loading}
|
||||
rowKey={(row,i) => row.id || i}
|
||||
dataSource={dataSource}
|
||||
columns={columns}
|
||||
pagination={false}
|
||||
onRow={handleRow}
|
||||
rowSelection={rowSelection}
|
||||
expandedRowRender={expandedRowRender}
|
||||
expandIconColumnIndex={expandIconColumnIndex}
|
||||
expandIconAsCell={expandIconAsCell}
|
||||
scroll={scroll}
|
||||
/>
|
||||
{total > 10 && (!pagination) &&
|
||||
<Pagination
|
||||
showQuickJumper
|
||||
onShowSizeChange={onShowSizeChange}
|
||||
onChange={setCurPage}
|
||||
current={current}
|
||||
total={total}
|
||||
showSizeChanger={showSizeChanger}
|
||||
pageSize={pageSize}
|
||||
/>}
|
||||
</div>
|
||||
|
||||
)
|
||||
}
|
|
@ -32,7 +32,6 @@ export default memo((props) => {
|
|||
setMyOptions(myOptions);
|
||||
}
|
||||
|
||||
console.log('-----options----')
|
||||
return (
|
||||
|
||||
<div className="sort-box">
|
||||
|
|
|
@ -1,36 +1,31 @@
|
|||
import { notification,message } from 'antd';
|
||||
import { notification} from 'antd';
|
||||
import axios from 'axios';
|
||||
import cookie from 'react-cookies';
|
||||
|
||||
|
||||
let settings=JSON.parse(localStorage.chromesetting);
|
||||
let actionUrl = settings.api_urls? settings.api_urls.task :'https://task.osredm.com';
|
||||
if (window.location.href.indexOf('localhost') < 0) {
|
||||
export const TokenKey = 'autologin_forge_military';
|
||||
export default function javaFetch(actionUrl){
|
||||
if (window.location.href.indexOf('localhost') < 0) {
|
||||
axios.defaults.withCredentials = true;
|
||||
}
|
||||
export const httpUrl = actionUrl;
|
||||
}
|
||||
|
||||
const TokenKey = 'autologin_forge_military';
|
||||
|
||||
// 创建axios实例
|
||||
const service = axios.create({
|
||||
baseURL: httpUrl,
|
||||
// 创建axios实例
|
||||
const service = axios.create({
|
||||
baseURL: actionUrl,
|
||||
timeout: 1800000, // 请求超时时间
|
||||
});
|
||||
});
|
||||
|
||||
// request拦截器
|
||||
// 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") {
|
||||
// 模拟token为登录用户
|
||||
const taskToken = sessionStorage.taskToken;
|
||||
const osredmToken = sessionStorage.osredmToken;
|
||||
if (config.url.indexOf('?') === -1) {
|
||||
config.url = `${config.url}?token=${taskToken}`;
|
||||
config.url = `${config.url}?token=${osredmToken}`;
|
||||
} else {
|
||||
config.url = `${config.url}&token=${taskToken}`;
|
||||
config.url = `${config.url}&token=${osredmToken}`;
|
||||
}
|
||||
}
|
||||
return config;
|
||||
|
@ -110,4 +105,5 @@ service.interceptors.response.use(
|
|||
}
|
||||
);
|
||||
|
||||
export default service;
|
||||
return service;
|
||||
}
|
|
@ -1,114 +1,10 @@
|
|||
import { notification } from 'antd';
|
||||
import axios from 'axios';
|
||||
import cookie from 'react-cookies';
|
||||
|
||||
import javaFetch from '../javaFetch';
|
||||
|
||||
|
||||
let settings = JSON.parse(localStorage.chromesetting);
|
||||
let actionUrl = settings.api_urls ? settings.api_urls.notice : 'https://info.osredm.com';
|
||||
if (window.location.href.indexOf('localhost')< 0) {
|
||||
axios.defaults.withCredentials = true;
|
||||
}
|
||||
let settings=JSON.parse(localStorage.chromesetting);
|
||||
let actionUrl =settings&&settings.api_urls? settings.api_urls.notice :'https://info.osredm.com';
|
||||
|
||||
const service = javaFetch(actionUrl);
|
||||
export const httpUrl = actionUrl;
|
||||
|
||||
const TokenKey = 'autologin_forge_military';
|
||||
|
||||
|
||||
// 创建axios实例
|
||||
const service = axios.create({
|
||||
baseURL: httpUrl,
|
||||
timeout: 1800000, // 请求超时时间
|
||||
});
|
||||
|
||||
// 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") {
|
||||
// 模拟token为登录用户
|
||||
const taskToken = sessionStorage.taskToken;
|
||||
if (config.url.indexOf('?') === -1) {
|
||||
config.url = `${config.url}?token=${taskToken}`;
|
||||
} else {
|
||||
config.url = `${config.url}&token=${taskToken}`;
|
||||
}
|
||||
}
|
||||
return config;
|
||||
}, error => {
|
||||
// Do something with request error
|
||||
console.log(error); // for debug
|
||||
Promise.reject(error);
|
||||
});
|
||||
// respone拦截器
|
||||
service.interceptors.response.use(
|
||||
response => {
|
||||
const res = response;
|
||||
if (res.status === 400) {
|
||||
notification.open({
|
||||
message: "提示",
|
||||
description: res.data.message || '验证失败',
|
||||
});
|
||||
return Promise.reject('error');
|
||||
}
|
||||
if (res.status === 401) {
|
||||
notification.open({
|
||||
message: "提示",
|
||||
description: res.data.message || '未授权,请登录!',
|
||||
});
|
||||
return Promise.reject('error');
|
||||
}
|
||||
if (res.status === 403) {
|
||||
notification.open({
|
||||
message: "提示",
|
||||
description: res.data.message || '无权限',
|
||||
});
|
||||
return Promise.reject('error');
|
||||
}
|
||||
if (res.status === 40001) {
|
||||
notification.open({
|
||||
message: "提示",
|
||||
description: '账户或密码错误!',
|
||||
});
|
||||
return Promise.reject('error');
|
||||
}
|
||||
if (response.status !== 200 && res.status !== 200) {
|
||||
notification.open({
|
||||
message: "提示",
|
||||
description: res.message,
|
||||
});
|
||||
} else {
|
||||
return response.data;
|
||||
}
|
||||
},
|
||||
error => {
|
||||
console.log(error);
|
||||
let res = error.response || {};
|
||||
if (res.status === 400) {
|
||||
notification.open({
|
||||
message: "提示",
|
||||
description: res.data.message || '操作失败',
|
||||
});
|
||||
return Promise.reject('error');
|
||||
}
|
||||
if (res.status === 401) {
|
||||
notification.open({
|
||||
message: "提示",
|
||||
description: res.data.message || '登录信息已过期',
|
||||
});
|
||||
return Promise.reject('error');
|
||||
}
|
||||
if (res.status === 403) {
|
||||
notification.open({
|
||||
message: "提示",
|
||||
description: res.data.message || '无权限!',
|
||||
});
|
||||
window.location.href = "/403";
|
||||
return Promise.reject('error');
|
||||
}
|
||||
|
||||
return Promise.reject(error);
|
||||
}
|
||||
);
|
||||
|
||||
export default service;
|
||||
|
|
|
@ -217,7 +217,7 @@ export default (props) => {
|
|||
showTotal={total => `共 ${total} 条`}
|
||||
/>
|
||||
</div>} */}
|
||||
{noticeList.length > 0 ? noticeList.length === 10 && <div className="edu-txt-center mt30 mb30">
|
||||
{total > 0 ? total> 10 ? <div className="edu-txt-center mt30 mb30">
|
||||
<Pagination
|
||||
showQuickJumper
|
||||
onChange={(page) => { setCurPage(page) }}
|
||||
|
@ -225,7 +225,7 @@ export default (props) => {
|
|||
total={total}
|
||||
showTotal={total => `共 ${total} 条`}
|
||||
/>
|
||||
</div> : <Nodata _html="暂无数据" />}
|
||||
</div> : "" : <Nodata _html="暂无数据" />}
|
||||
</React.Fragment>
|
||||
}
|
||||
}
|
||||
|
|
|
@ -0,0 +1,234 @@
|
|||
import React, { useEffect, useState } from "react";
|
||||
import { Link, Route, Switch } from "react-router-dom";
|
||||
import { withRouter } from "react-router";
|
||||
import { SnackbarHOC } from "educoder";
|
||||
import { CNotificationHOC } from "../modules/courses/common/CNotificationHOC";
|
||||
import { TPMIndexHOC } from "../modules/tpm/TPMIndexHOC";
|
||||
import Loadable from "react-loadable";
|
||||
import Loading from "../Loading";
|
||||
import { ImageLayerOfCommentHOC } from "../modules/page/layers/ImageLayerOfCommentHOC";
|
||||
import './qz2022/index.scss';
|
||||
import { Menu, Popover, Spin } from "antd";
|
||||
import banner from './qz2022/image/banner.png'
|
||||
import { getQz2022, userCompetitionStatus } from "./qz2022/api";
|
||||
import { paths } from "./qz2022/static";
|
||||
|
||||
const Introduce = Loadable({
|
||||
loader: () => import('./qz2022/introduce'),
|
||||
loading: Loading,
|
||||
})
|
||||
const Fingerpost = Loadable({
|
||||
loader: () => import('./qz2022/fingerpost'),
|
||||
loading: Loading,
|
||||
})
|
||||
const Notice = Loadable({
|
||||
loader: () => import('./qz2022/notice'),
|
||||
loading: Loading,
|
||||
})
|
||||
const NoticeDetail = Loadable({
|
||||
loader: () => import('./qz2022/notice/detail.jsx'),
|
||||
loading: Loading,
|
||||
})
|
||||
const Apply = Loadable({
|
||||
loader: () => import('./qz2022/apply'),
|
||||
loading: Loading,
|
||||
})
|
||||
const Chat = Loadable({
|
||||
loader: () => import('./qz2022/chat'),
|
||||
loading: Loading,
|
||||
});
|
||||
const Contact = Loadable({
|
||||
loader: () => import('./qz2022/contact'),
|
||||
loading: Loading,
|
||||
});
|
||||
const Statistics = Loadable({
|
||||
loader: () => import('./qz2022/statistics'),
|
||||
loading: Loading,
|
||||
})
|
||||
const Management = Loadable({
|
||||
loader: () => import('./qz2022/management'),
|
||||
loading: Loading,
|
||||
})
|
||||
|
||||
const Qz2022 = (props) => {
|
||||
const {history, current_user} = props;
|
||||
const {location} = history;
|
||||
const {pathname} = location;
|
||||
const [active, setActive] = useState();
|
||||
const [reload, setReload] = useState();
|
||||
const [qzDetail, setQzDetail] = useState();
|
||||
const [enrollStatus, setEnrollStatus] = useState();
|
||||
|
||||
const menu = (
|
||||
<Menu>
|
||||
<Menu.Item>
|
||||
<Link to={{ pathname: current_user && current_user.login ? `/competition/qz2022/management/applys` :'' }} onClick={()=>{current_user && !current_user.login && props.showLoginDialog()}}>报名列表</Link>
|
||||
</Menu.Item>
|
||||
<Menu.Item>
|
||||
<Link to={{ pathname: current_user && current_user.login ? `/competition/qz2022/management/production` :'' }} onClick={()=>{current_user && !current_user.login && props.showLoginDialog()}}>作品列表</Link>
|
||||
</Menu.Item>
|
||||
</Menu>
|
||||
);
|
||||
|
||||
useEffect(()=>{
|
||||
setActive(pathname.substring(pathname.lastIndexOf('/')+1, pathname.lenght));
|
||||
// document.body.scrollTop = 0;
|
||||
// window.scrollTo(0,0);
|
||||
}, [pathname])
|
||||
|
||||
useEffect(()=>{
|
||||
// 获取启智2022详情
|
||||
getQz2022().then(response=>{
|
||||
if(response && response.status===200){
|
||||
setQzDetail(response.data.data);
|
||||
}
|
||||
})
|
||||
}, [])
|
||||
|
||||
useEffect(()=>{
|
||||
// 获取用户参与竞赛状态
|
||||
userCompetitionStatus('qz2022').then(response=>{
|
||||
if(response && response.status === 200){
|
||||
setEnrollStatus(response.data.data);
|
||||
}
|
||||
})
|
||||
}, [reload])
|
||||
|
||||
let applyStatus; // 是否处于报名阶段
|
||||
let referStatus; // 提交作品的开始时间 = 报名的最后时间
|
||||
if(qzDetail){
|
||||
applyStatus = Date.parse(new Date()) < Date.parse(new Date(qzDetail.enroll_date));
|
||||
referStatus = !applyStatus && Date.parse(new Date()) < Date.parse(new Date(qzDetail.upload_date));
|
||||
}
|
||||
|
||||
return (
|
||||
<React.Fragment>
|
||||
{/* banner图+选项 */}
|
||||
<img src={banner} className="qz_banner"/>
|
||||
<div className="qz2022">
|
||||
{paths.indexOf(active) !== -1 && <ul className="qz2022Menu mt20 qz_main">
|
||||
<li className={ active==='qz2022' ||active === "introduce"? "active" : ""}>
|
||||
<Link to={{ pathname: `/competition/qz2022/introduce` }}>大赛介绍</Link>
|
||||
</li>
|
||||
<li className={active === "fingerpost" ? "active" : ""}>
|
||||
<Link to={{ pathname: `/competition/qz2022/fingerpost` }}>大赛指南</Link>
|
||||
</li>
|
||||
<li className={active === "notice" ? "active" : ""}>
|
||||
<Link to={{ pathname: `/competition/qz2022/notice` }}>通知公告</Link>
|
||||
</li>
|
||||
{/* 处于报名阶段正常跳转到报名页面,不处于右侧弹消息 */}
|
||||
<li className={active === "apply" ? "active" : ""}>
|
||||
<Link to={{ pathname: applyStatus ? '/competition/qz2022/apply' :'' }} onClick={()=>{current_user && current_user.login ? !applyStatus && props.showNotification("当前不处于报名时间") : props.showLoginDialog()}}>参赛报名</Link>
|
||||
</li>
|
||||
<li className={active === "refer" ? "active" : ""}>
|
||||
<Link to={{ pathname: referStatus ? `/competition/qz2022/refer` : '' }} onClick={()=>{current_user && current_user.login ? !referStatus && props.showNotification("未到作品提交时间,请耐心等待") : props.showLoginDialog()}}>提案提交</Link>
|
||||
</li>
|
||||
{/* <li className={active === "apply" ? "active" : ""}>
|
||||
<Link to={{ pathname: '/competition/qz2022/apply'}}>参赛报名</Link>
|
||||
</li> */}
|
||||
{/* <li className={active === "refer" ? "active" : ""}>
|
||||
<Link to={{ pathname: `/competition/qz2022/refer`}}>提案提交</Link>
|
||||
</li> */}
|
||||
<li className={active === "statistics" ? "active" : ""}>
|
||||
<Link to={{ pathname: `/competition/qz2022/statistics` }}>数据统计</Link>
|
||||
</li>
|
||||
<li className={active === "chat" ? "active" : ""}>
|
||||
<Link to={{ pathname: `/competition/qz2022/chat` }}>交流互动</Link>
|
||||
</li>
|
||||
<li className={active === "contact" ? "active" : ""}>
|
||||
<Link to={{ pathname: `/competition/qz2022/contact` }}>联系我们</Link>
|
||||
</li>
|
||||
{qzDetail && qzDetail.is_manager && <li className={(active === "applys" || active === "production") ? "active" : ""}>
|
||||
<Popover content={menu} placement="bottomRight" overlayClassName="qz_manage">
|
||||
<a>后台管理</a>
|
||||
</Popover>
|
||||
</li>}
|
||||
</ul>}
|
||||
{paths.indexOf(active) !== -1 && <div className="menu_border mt20 qz_main"></div>}
|
||||
<Spin spinning={false} wrapperClassName="spinstyle qzCont" tip="正在同步镜像" size="large">
|
||||
<Switch {...props}>
|
||||
{/* 大赛介绍 */}
|
||||
<Route path="/competition/qz2022/introduce"
|
||||
render={
|
||||
() => (<Introduce {...props} qzDetail={qzDetail} />)
|
||||
}
|
||||
></Route>
|
||||
{/* 大赛指南 */}
|
||||
<Route path="/competition/qz2022/fingerpost"
|
||||
render={
|
||||
() => (<Fingerpost {...props} qzDetail={qzDetail}/>)
|
||||
}
|
||||
></Route>
|
||||
{/* 通知公告详情页 */}
|
||||
<Route path="/competition/qz2022/notice/:noticeId"
|
||||
render={
|
||||
() => (<NoticeDetail {...props} />)
|
||||
}
|
||||
></Route>
|
||||
{/* 通知公告 */}
|
||||
<Route path="/competition/qz2022/notice"
|
||||
render={
|
||||
() => (<Notice {...props} />)
|
||||
}
|
||||
></Route>
|
||||
{/* 参赛报名 */}
|
||||
<Route path="/competition/qz2022/apply"
|
||||
render={
|
||||
() => (<Apply {...props} qzDetail={qzDetail} enrollStatus={enrollStatus} setReload={setReload}/>)
|
||||
}
|
||||
></Route>
|
||||
{/* 提案提交 */}
|
||||
<Route path="/competition/qz2022/refer"
|
||||
render={
|
||||
() => (<Refer {...props} enrollStatus={enrollStatus}/>)
|
||||
}
|
||||
></Route>
|
||||
{/* 交流互动 */}
|
||||
<Route path="/competition/qz2022/chat"
|
||||
render={
|
||||
() => (<Chat {...props} />)
|
||||
}
|
||||
></Route>
|
||||
{/* 联系我们 */}
|
||||
<Route path="/competition/qz2022/contact"
|
||||
render={
|
||||
() => (<Contact {...props} aboutUs={qzDetail&&qzDetail.about_us}/>)
|
||||
}
|
||||
></Route>
|
||||
{/* 数据统计 */}
|
||||
<Route path="/competition/qz2022/statistics"
|
||||
render={
|
||||
() => (<Statistics {...props} qzDetail={qzDetail}/>)
|
||||
}
|
||||
></Route>
|
||||
{/* 后台管理-报名列表 */}
|
||||
<Route path="/competition/qz2022/management/applys"
|
||||
render={
|
||||
() => (<Management {...props} qzDetail={qzDetail}/>)
|
||||
}
|
||||
></Route>
|
||||
{/* 后台管理-作品列表 */}
|
||||
<Route path="/competition/qz2022/management/production"
|
||||
render={
|
||||
() => (<Management {...props} qzDetail={qzDetail}/>)
|
||||
}
|
||||
></Route>
|
||||
{/* 大赛介绍 */}
|
||||
<Route path="/competition/qz2022"
|
||||
render={
|
||||
() => (<Introduce {...props} qzDetail={qzDetail}/>)
|
||||
}
|
||||
></Route>
|
||||
</Switch>
|
||||
</Spin>
|
||||
</div>
|
||||
</React.Fragment>
|
||||
);
|
||||
}
|
||||
|
||||
export default withRouter(
|
||||
ImageLayerOfCommentHOC({
|
||||
imgSelector: ".imageLayerParent img, .imageLayerParent .imageTarget",
|
||||
parentSelector: ".newMain",
|
||||
})(CNotificationHOC()(SnackbarHOC()(TPMIndexHOC(Qz2022))))
|
||||
);
|
|
@ -0,0 +1,40 @@
|
|||
import axios from 'axios';
|
||||
|
||||
// 用户参与启智2022状态?debug=teacher
|
||||
export async function userCompetitionStatus(id) {
|
||||
return axios.get(`/competition_infos/${id}/enroll_status.json`);
|
||||
}
|
||||
|
||||
// 启智2022详情接口
|
||||
export function getQz2022() {
|
||||
return axios.get(`/competition_infos/qz2022.json`);
|
||||
}
|
||||
|
||||
// 报名启智2022 竞赛?debug=teacher
|
||||
export async function enrollCompetition(data){
|
||||
return axios.post(`/competition_infos/qz2022/enroll.json`,data);
|
||||
}
|
||||
|
||||
// 统计启智2022 竞赛
|
||||
export async function stattistics(data){
|
||||
// return fetch({
|
||||
// url: `${current_main_site_url}/api/competition_infos/qz2022/statistics.json`,
|
||||
// method: 'get',
|
||||
// });
|
||||
return axios.get( `/competition_infos/qz2022/statistics.json`);
|
||||
}
|
||||
|
||||
// 竞赛提交作品
|
||||
export async function uploadCompetition(data){
|
||||
return axios.post(`/competition_infos/qz2022/upload.json`,data);
|
||||
}
|
||||
|
||||
// 管理-竞赛报名列表?debug=admin
|
||||
export function getQzEnrollList(params) {
|
||||
return axios.get(`/competition_infos/qz2022/enroll_list.json`,params={params});
|
||||
}
|
||||
|
||||
// 管理-竞赛提交作品列表&debug=admin
|
||||
export function getQzProList(params) {
|
||||
return axios.get(`/competition_infos/qz2022/enroll_list.json?upload=true`,params={params});
|
||||
}
|
|
@ -0,0 +1,190 @@
|
|||
import React, {useState, useCallback} from "react";
|
||||
import { Input, Select, Button, Form, message, Radio } from 'antd';
|
||||
import {enrollCompetition} from '../api';
|
||||
import {httpUrl} from '../fetch';
|
||||
import EditTable from "../editTable";
|
||||
import apply_top from "../image/apply_top.png";
|
||||
import apply_down from "../image/apply_down.png";
|
||||
import apply_one_active from "../image/apply_one_active.png";
|
||||
import apply_one from "../image/apply_one.png";
|
||||
import apply_two_active from "../image/apply_two_active.png";
|
||||
import apply_two from "../image/apply_two.png";
|
||||
import apply_notice from "../image/apply_notice.png";
|
||||
|
||||
import './index.scss';
|
||||
const Option = Select.Option;
|
||||
|
||||
export default Form.create()((props) => {
|
||||
const {form, qzDetail, enrollStatus, setReload} = props;
|
||||
const {getFieldDecorator, validateFields, setFieldsValue } = form;
|
||||
const [members, setMembers] = useState([]);
|
||||
const [errorMessage, setErrorMessage] = useState(undefined);
|
||||
const [sourceBy, setSourceBy] = useState(1);
|
||||
|
||||
// form表单公共处理函数
|
||||
const helper = useCallback(
|
||||
(label, name, rules, widget) => (
|
||||
<Form.Item label={label}>
|
||||
{getFieldDecorator(name, { rules, validateFirst: true })(widget)}
|
||||
</Form.Item>
|
||||
),
|
||||
[]
|
||||
);
|
||||
|
||||
// 当用户输入结束时 检验用户输入是否符合规范
|
||||
function verify(dataIndex){
|
||||
validateFields([dataIndex],(error, values)=>{
|
||||
if(error && error[dataIndex]){
|
||||
return;
|
||||
}
|
||||
})
|
||||
}
|
||||
|
||||
//提交报名信息
|
||||
function applySubmit(){
|
||||
// 检查用户输入的成员属性是否完全
|
||||
if(members.length > 0){
|
||||
let all = false;
|
||||
members.map(item=>{
|
||||
all = Object.keys(item).length === 5;
|
||||
})
|
||||
if(!all){
|
||||
setErrorMessage("成员信息未填写完成");
|
||||
return;
|
||||
}
|
||||
}
|
||||
validateFields((error, values)=>{
|
||||
if(error){
|
||||
return
|
||||
}else{
|
||||
// 用户输入正确 报名该竞赛
|
||||
const params = {
|
||||
...values,
|
||||
members,
|
||||
subject_source_type: sourceBy,
|
||||
}
|
||||
enrollCompetition(params).then(response=>{
|
||||
if(response && response.data.message === "success"){
|
||||
setReload(Math.random());
|
||||
message.success('报名成功')
|
||||
}else{
|
||||
message.error(response.message);
|
||||
}
|
||||
})
|
||||
}
|
||||
})
|
||||
}
|
||||
|
||||
return (
|
||||
<div className="qz_main">
|
||||
<div className="step">
|
||||
<span className="left_tit"> 报名</span>
|
||||
<img src={apply_top} className="step_icon"/>
|
||||
<div className="border_dashed"></div>
|
||||
<div className="img_span">
|
||||
<img src={enrollStatus && enrollStatus.enroll_status ? apply_one : apply_one_active} className="step_icon"/>
|
||||
个人信息
|
||||
</div>
|
||||
<div className="border_dashed"></div>
|
||||
<div className="img_span">
|
||||
<img src={enrollStatus && enrollStatus.enroll_status ? apply_two_active : apply_two} className="step_icon"/>
|
||||
报名成功
|
||||
</div>
|
||||
<div className="border_dashed"></div>
|
||||
<img src={apply_down} className="step_icon"/>
|
||||
</div>
|
||||
{!(enrollStatus && enrollStatus.enroll_status) && <div className="apply_tip font-15">
|
||||
<img src={apply_notice} className="apply_notice"/>
|
||||
请认真核对报名信息,务必与线下报名表信息一致!
|
||||
</div>}
|
||||
<div className="apply_information mb60">
|
||||
<div className="info_head">{!(enrollStatus && enrollStatus.enroll_status) && '填写'}报名信息</div>
|
||||
{/* 报名表单 */}
|
||||
{!(enrollStatus && enrollStatus.enroll_status) && <Form className="info_form">
|
||||
{helper('参赛单位',
|
||||
'org_name',
|
||||
[{ required: true, message: "请正确输入参赛单位" },
|
||||
{ max: 32, message: '超出限制长度32位字符,请重新编辑' }],
|
||||
<Input placeholder="请输入参赛单位" onBlur={()=>{verify("org_name")}}/>
|
||||
)}
|
||||
{helper('参赛团队负责人姓名',
|
||||
'leader',
|
||||
[{ required: true, message: "请正确输入负责人姓名" },
|
||||
{ max: 32, message: '超出限制长度32位字符,请重新编辑' }],
|
||||
<Input placeholder="请输入参赛团队负责人姓名" onBlur={()=>{verify("leader")}}/>
|
||||
)}
|
||||
{qzDetail && qzDetail.is_local && helper('职务',
|
||||
'org_job',
|
||||
[{ required: true, message: "请正确输入职务" },
|
||||
{ max: 32, message: '超出限制长度32位字符,请重新编辑' }],
|
||||
<Input placeholder="请输入职务" onBlur={()=>{verify("org_job")}}/>
|
||||
)}
|
||||
{qzDetail && qzDetail.is_local && helper('军衔',
|
||||
'org_rank',
|
||||
[{ required: true, message: "请正确输入JXJXJX" },
|
||||
{ max: 32, message: '超出限制长度32位字符,请重新编辑' }],
|
||||
<Input placeholder="请输入JXJXJX" onBlur={()=>{verify("org_rank")}}/>
|
||||
)}
|
||||
{helper('赛区',
|
||||
'zone',
|
||||
[{ required: true, message: "请正确输入赛区" }],
|
||||
<Select placeholder="请选择赛区" onBlur={()=>{verify("zone")}}>
|
||||
{qzDetail && qzDetail.zones.map((item,i)=> {return <Option value={item} key={i}>{item}</Option>})}
|
||||
</Select>
|
||||
)}
|
||||
{helper('赛项',
|
||||
'sub_competition',
|
||||
[{ required: true, message: "请正确输入赛项" }],
|
||||
<Select placeholder="请选择赛项" onBlur={()=>{verify("sub_competition")}}>
|
||||
{qzDetail && qzDetail.sub_competitions.map((item,i)=> {return <Option value={item} key={i}>{item}</Option>})}
|
||||
</Select>
|
||||
)}
|
||||
{qzDetail && qzDetail.is_local && <div className="class_from">
|
||||
<Radio.Group onChange={(e)=>{setSourceBy(e.target.value)}} value={sourceBy} defaultValue={1}>
|
||||
<Radio value={1}>计划支持</Radio>
|
||||
<Radio value={0}>自主提报</Radio>
|
||||
</Radio.Group>
|
||||
{helper('课题来源',
|
||||
'subject_source_name',
|
||||
[{ required: true, message: "请正确输入课题来源" },
|
||||
{ max: 32, message: '超出限制长度32位字符,请重新编辑' }],
|
||||
<Input placeholder="请输入项目名称" onBlur={()=>{verify("subject_source_name")}} disabled={sourceBy === 0}/>
|
||||
)}
|
||||
</div>}
|
||||
{helper('电话',
|
||||
'phone',
|
||||
[{ required: true, message: "请正确输入电话" },
|
||||
{pattern: /(\d{11})|^((\d{7,8})|(\d{4}|\d{3})-(\d{7,8})|(\d{4}|\d{3})-(\d{7,8})-(\d{4}|\d{3}|\d{2}|\d{1})|(\d{7,8})-(\d{4}|\d{3}|\d{2}|\d{1}))$/, message: "请输入正确的手机号"}],
|
||||
<Input placeholder="请输入电话" onBlur={()=>{verify("phone")}}/>
|
||||
)}
|
||||
<div>
|
||||
<p className="mt10">成员 : </p>
|
||||
<p className="error_message">{errorMessage}</p>
|
||||
{/* */}
|
||||
<EditTable setMembers={setMembers} isLocal = {qzDetail && qzDetail.is_local}/>
|
||||
</div>
|
||||
</Form>}
|
||||
{/* 已报名,报名信息 */}
|
||||
{enrollStatus && enrollStatus.enroll_status && <div className="info">
|
||||
<div><span>参赛单位 : </span>{enrollStatus && enrollStatus.enroll_info.org_name}</div>
|
||||
<div className="info-right"><span>参赛团队负责人姓名 : </span>{enrollStatus && enrollStatus.enroll_info.leader}</div>
|
||||
<div><span>职务 : </span>{enrollStatus && enrollStatus.enroll_info.org_job}</div>
|
||||
<div className="info-right"><span>JXJXJX : </span>{enrollStatus && enrollStatus.enroll_info.org_rank}</div>
|
||||
<div><span>赛区 : </span>{enrollStatus && enrollStatus.enroll_info.zone}</div>
|
||||
<div className="info-right"><span>赛项 : </span>{enrollStatus && enrollStatus.enroll_info.sub_competition}</div>
|
||||
<div><span>课题来源 : </span>{enrollStatus && enrollStatus.enroll_info.subject_source_type === 0 ? "自主提报" : enrollStatus.enroll_info.subject_source_name || '--'}</div>
|
||||
<div><span>电话 : </span>{enrollStatus && enrollStatus.enroll_info.phone}</div>
|
||||
<div className="info-right ellipsis_div"><span>成员 : </span>{enrollStatus && enrollStatus.enroll_info.members && enrollStatus.enroll_info.members.map(item=>{return item.real_name + ' '})}</div>
|
||||
</div>}
|
||||
</div>
|
||||
{!(enrollStatus && enrollStatus.enroll_status) && <div className="apply_but">
|
||||
<Button type="primary" className="submit_info" onClick={applySubmit}>
|
||||
提交资料
|
||||
</Button>
|
||||
<a href={httpUrl+'/busiAttachments/download/391'}><Button className="add_member download ml20">
|
||||
下载报名表
|
||||
</Button></a>
|
||||
</div>}
|
||||
</div>
|
||||
)
|
||||
})
|
|
@ -0,0 +1,141 @@
|
|||
.step{
|
||||
display: flex;
|
||||
align-items: center;
|
||||
margin: 30px 0 40px;
|
||||
.left_tit{
|
||||
height: 20px;
|
||||
line-height: 19px;
|
||||
margin-right: 120px;
|
||||
border-left: 4px solid #2e5bfe;
|
||||
}
|
||||
.step_icon{
|
||||
width: 34px;
|
||||
}
|
||||
.border_dashed{
|
||||
width: 225px;
|
||||
margin: 0 12px;
|
||||
border-bottom: 1px dashed #bac1c9;
|
||||
}
|
||||
.img_span{
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
align-items: center;
|
||||
margin-top: 25px;
|
||||
}
|
||||
}
|
||||
.apply_tip{
|
||||
background-color:#fff5eb;
|
||||
border:1px solid #ffa13a;
|
||||
padding: 10px 0 10px 20px;
|
||||
color:#ffa13a;
|
||||
margin-bottom: 20px;
|
||||
.apply_notice{
|
||||
width: 16px;
|
||||
margin-right: 10px;
|
||||
}
|
||||
}
|
||||
.apply_information{
|
||||
background-color:#ffffff;
|
||||
border-radius:4px;
|
||||
box-shadow:0px 3px 12px #ecf0ff;
|
||||
padding-bottom: 1px;
|
||||
.info_head{
|
||||
border-bottom: 1px solid #eee;
|
||||
padding: 12px 30px;
|
||||
}
|
||||
.info_form{
|
||||
padding: 8px 0 30px 30px;
|
||||
.ant-form-item{
|
||||
display: inline-block;
|
||||
width: 33%;
|
||||
margin-right: 160px;
|
||||
margin-bottom: 0px;
|
||||
.ant-input:hover{border-color:#2e5bfe;}
|
||||
}
|
||||
.class_from{
|
||||
position: relative;
|
||||
display: inline-block;
|
||||
width: 46.5%;
|
||||
}
|
||||
.class_from .ant-form-item{
|
||||
width: 71%;
|
||||
}
|
||||
.class_from>.ant-radio-group{
|
||||
position: absolute;
|
||||
left: 36%;
|
||||
top: 10px;
|
||||
}
|
||||
}
|
||||
.info{
|
||||
border: 0.5px solid rgba(153, 153, 153, 0.3);
|
||||
margin: 20px 70px 30px 25px;
|
||||
div{
|
||||
display: inline-block;
|
||||
width: 50%;
|
||||
border-right: 1px solid rgba(153, 153, 153, 0.3);
|
||||
border-bottom: 1px solid rgba(153, 153, 153, 0.3);
|
||||
height: 44px;
|
||||
padding-left: 40px;
|
||||
line-height: 44px;
|
||||
}
|
||||
.ellipsis_div{
|
||||
width: 100%;
|
||||
}
|
||||
.info-right{
|
||||
border-right: none;
|
||||
}
|
||||
& div:last-child{
|
||||
border-right: none;
|
||||
border-bottom: none;
|
||||
}
|
||||
}
|
||||
.apply_team{
|
||||
color: red;
|
||||
.add_member{
|
||||
padding: 0 12px;
|
||||
margin: 10px 0 20px;
|
||||
border-radius:4px;
|
||||
}
|
||||
.member_info{
|
||||
padding-right: 240px;
|
||||
}
|
||||
.member_info .ant-table{
|
||||
margin-top: 20px;
|
||||
.ant-form-item{
|
||||
width: 76%;
|
||||
margin: 0 0 10px 0;
|
||||
position: relative;
|
||||
}
|
||||
.ant-form-item .has-error .ant-form-explain{
|
||||
font-size: 12px;
|
||||
position: absolute;
|
||||
}
|
||||
}
|
||||
.ant-table-thead > tr > th, .ant-table-tbody > tr > td{
|
||||
padding: 12px 16px;
|
||||
text-align: left;
|
||||
}
|
||||
.ant-table-thead > tr > th:first-child, .ant-table-tbody > tr > td:first-child{
|
||||
padding-left: 55px;
|
||||
}
|
||||
.apply_delete{
|
||||
width: 16px;
|
||||
margin-bottom: 12px;
|
||||
&:hover{cursor: pointer;}
|
||||
}
|
||||
}
|
||||
.error_message{
|
||||
color: #f5222d;
|
||||
}
|
||||
}
|
||||
.apply_but{
|
||||
padding-bottom: 60px;
|
||||
text-align: center;
|
||||
.download, .submit_info{
|
||||
padding: 0 18px;
|
||||
height: 36px;
|
||||
}
|
||||
.download{
|
||||
padding: 0 10px;
|
||||
}
|
||||
}
|
|
@ -0,0 +1,36 @@
|
|||
import React from "react";
|
||||
// import chatSvg from "../image/chat.svg";
|
||||
import chatBanner from '../image/chat_banner.png';
|
||||
import btn from "../image/btn-right.png";
|
||||
import './index.scss';
|
||||
import '../../index.scss';
|
||||
|
||||
function Chat({ form, showNotification, match, history }) {
|
||||
|
||||
|
||||
return (
|
||||
<div className="chat-bg">
|
||||
<div className="chat qz_main clearfix">
|
||||
<img className="chat-left" src={chatBanner} ></img>
|
||||
<div className="chat-words">
|
||||
<div className="chat-tit">交流互动</div>
|
||||
<div className="chat-content">
|
||||
<p>集萃群智体会</p>
|
||||
<p>与论坛成员交流比赛经验,分享参赛心得</p>
|
||||
<p>汇聚赛事资讯</p>
|
||||
<p>助您第一时间解读竞赛动态,把握赛事脉搏</p>
|
||||
</div>
|
||||
<div className="chat-btn" onClick={() => { window.open('https://fc.osredm.com/forums/theme/105') }}>
|
||||
<span className="detail1">了解详情</span>
|
||||
<img
|
||||
className="iconPlay1"
|
||||
src={btn}
|
||||
/>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
</div>
|
||||
</div>
|
||||
)
|
||||
}
|
||||
export default Chat;
|
|
@ -0,0 +1,68 @@
|
|||
.chat-bg{
|
||||
padding:9rem 0 5rem 0;
|
||||
background-image: url('../image/chat-bg.png');
|
||||
background-size: 100% 100%;
|
||||
}
|
||||
.chat {
|
||||
margin: 0 auto;
|
||||
padding: 0 1.5rem;
|
||||
background: #fff;
|
||||
|
||||
.chat-left {
|
||||
float: left;
|
||||
position: relative;
|
||||
top: -5rem;
|
||||
width: 56.6%;
|
||||
box-shadow: 0px 3px 8px rgba(219, 227, 255, 0.7) inset;
|
||||
margin-bottom: -3.5rem;
|
||||
padding: 1.25rem;
|
||||
}
|
||||
|
||||
.chat-words {
|
||||
display: inline-block;
|
||||
padding: 1.5rem;
|
||||
}
|
||||
.chat-tit {
|
||||
display: inline-block;
|
||||
font-weight: 700;
|
||||
color: #2e3341;
|
||||
font-size: 1.25rem;
|
||||
line-height: 1rem;
|
||||
|
||||
&::after {
|
||||
content: "";
|
||||
display: inline-block;
|
||||
width: 100%;
|
||||
height: 1px;
|
||||
background-color: #2e5bfe;
|
||||
}
|
||||
}
|
||||
.chat-conten {
|
||||
font-size: 1rem;
|
||||
line-height: 1.625rem;
|
||||
}
|
||||
|
||||
.chat-btn {
|
||||
margin-top:1.5rem;
|
||||
width: 9.5rem;
|
||||
height: 2.5rem;
|
||||
display: flex;
|
||||
justify-content: space-between;
|
||||
align-items: center;
|
||||
border: 2px solid #2e5bfe;
|
||||
background-color: #2e5bfe;
|
||||
cursor: pointer;
|
||||
}
|
||||
|
||||
.detail1 {
|
||||
white-space: nowrap;
|
||||
color: #ffffff;
|
||||
font-size: 1rem;
|
||||
font-weight: 400;
|
||||
margin-left:1em;
|
||||
}
|
||||
|
||||
.iconPlay1 {
|
||||
height: 100%;
|
||||
}
|
||||
}
|
|
@ -0,0 +1,25 @@
|
|||
import React from "react";
|
||||
import contactPng from "../image/contact.png";
|
||||
// import btn from "../image/btn-right.png";
|
||||
import './index.scss';
|
||||
import '../../index.scss';
|
||||
|
||||
function Contact({ aboutUs }) {
|
||||
|
||||
|
||||
return (
|
||||
<div className="contact-bg">
|
||||
<div className="contact qz_main">
|
||||
<div className="contact-words">
|
||||
<div className="contact-content" dangerouslySetInnerHTML={{ __html: aboutUs }}>
|
||||
</div>
|
||||
</div>
|
||||
<div className="contact-png">
|
||||
<img src={contactPng} ></img>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
)
|
||||
}
|
||||
export default Contact;
|
|
@ -0,0 +1,41 @@
|
|||
.contact-bg{
|
||||
padding:3rem 0;
|
||||
background-image: url('../image/chat-bg.png');
|
||||
background-size:100% 100%;
|
||||
}
|
||||
.contact {
|
||||
margin: 0 auto;
|
||||
padding: 3rem;
|
||||
background: #fff;
|
||||
display: flex;
|
||||
justify-content: space-between;
|
||||
|
||||
|
||||
.contact-png{
|
||||
width: 55%;
|
||||
margin-left:1rem;
|
||||
img{
|
||||
width: 100%;
|
||||
}
|
||||
}
|
||||
|
||||
.contact-tit{
|
||||
position: absolute;
|
||||
top:40%;
|
||||
width: 100%;
|
||||
text-align: center;
|
||||
color: #fff;
|
||||
font-size: 1.25rem;
|
||||
font-weight: 700;
|
||||
}
|
||||
.contact-words {
|
||||
max-width: 45%;
|
||||
}
|
||||
|
||||
.contact-content {
|
||||
text-align: center;
|
||||
font-size: 1rem;
|
||||
line-height: 2rem;
|
||||
margin-bottom: 1rem;
|
||||
}
|
||||
}
|
|
@ -0,0 +1,207 @@
|
|||
import React, { useState, useCallback, useMemo, useEffect } from "react";
|
||||
import { Table, Input, Button, Popconfirm, Form } from 'antd';
|
||||
import './index.scss';
|
||||
import apply_delete from "../image/apply_delete.png";
|
||||
|
||||
const EditableContext = React.createContext();
|
||||
|
||||
const EditableRow = ({ form, index, ...props }) => (
|
||||
<EditableContext.Provider value={form}>
|
||||
<tr {...props} />
|
||||
</EditableContext.Provider>
|
||||
);
|
||||
|
||||
const EditableFormRow = Form.create()(EditableRow);
|
||||
|
||||
class EditableCell extends React.Component {
|
||||
|
||||
save = (dataIndex, e) => {
|
||||
const { record, handleSave } = this.props;
|
||||
this.form.validateFields([dataIndex],(error, values) => {
|
||||
if (error && error[e.currentTarget.id]) {
|
||||
return;
|
||||
}
|
||||
handleSave({ ...record, ...values });
|
||||
});
|
||||
};
|
||||
|
||||
renderCell = form => {
|
||||
this.form = form;
|
||||
const {dataIndex, title } = this.props;
|
||||
return <Form.Item >
|
||||
{form.getFieldDecorator(dataIndex, {
|
||||
rules: [
|
||||
{required: true,message: `${title}不能为空.`,},
|
||||
{max: 32, message: '超出限制长度32位字符,请重新编辑' }
|
||||
],
|
||||
validateFirst: true,
|
||||
})(<Input onPressEnter={(e)=>{this.save(dataIndex,e)}} onBlur={(e)=>{this.save(dataIndex,e)}} placeholder="请输入"/>)}
|
||||
</Form.Item>
|
||||
};
|
||||
|
||||
render() {
|
||||
const {
|
||||
editable,
|
||||
dataIndex,
|
||||
title,
|
||||
record,
|
||||
index,
|
||||
handleSave,
|
||||
children,
|
||||
...restProps
|
||||
} = this.props;
|
||||
return (
|
||||
<td {...restProps}>
|
||||
{editable ? (
|
||||
<EditableContext.Consumer>{this.renderCell}</EditableContext.Consumer>
|
||||
) : (
|
||||
children
|
||||
)}
|
||||
</td>
|
||||
);
|
||||
}
|
||||
}
|
||||
|
||||
class EditableTable extends React.Component {
|
||||
constructor(props) {
|
||||
super(props);
|
||||
this.columns = [
|
||||
{
|
||||
title: '姓名',
|
||||
dataIndex: 'real_name',
|
||||
editable: true,
|
||||
width: "40%"
|
||||
},
|
||||
{
|
||||
title: '单位',
|
||||
dataIndex: 'org_name',
|
||||
editable: true,
|
||||
width: '50%',
|
||||
},
|
||||
{
|
||||
title: '操作',
|
||||
dataIndex: 'operation',
|
||||
width: '10%',
|
||||
render: (text, record) =>
|
||||
this.state.dataSource.length >= 1 ? (
|
||||
<Popconfirm title="确定删除此成员?" onConfirm={() => this.handleDelete(record.key)}>
|
||||
<img src={apply_delete} className="apply_delete"/>
|
||||
</Popconfirm>
|
||||
) : null,
|
||||
},
|
||||
];
|
||||
if(props.isLocal){
|
||||
this.columns = [{
|
||||
title: '姓名',
|
||||
dataIndex: 'real_name',
|
||||
editable: true,
|
||||
},
|
||||
{
|
||||
title: '单位',
|
||||
dataIndex: 'org_name',
|
||||
editable: true,
|
||||
width: '30%',
|
||||
},{
|
||||
title: '职务',
|
||||
dataIndex: 'org_job',
|
||||
editable: true,
|
||||
},
|
||||
{
|
||||
title: 'JXJXJX',
|
||||
dataIndex: 'org_rank',
|
||||
editable: true,
|
||||
},
|
||||
{
|
||||
title: '操作',
|
||||
dataIndex: 'operation',
|
||||
width: '10%',
|
||||
render: (text, record) =>
|
||||
this.state.dataSource.length >= 1 ? (
|
||||
<Popconfirm title="确定删除此成员?" onConfirm={() => this.handleDelete(record.key)}>
|
||||
<img src={apply_delete} className="apply_delete"/>
|
||||
</Popconfirm>
|
||||
) : null,
|
||||
},];
|
||||
}
|
||||
this.state = {
|
||||
dataSource: [
|
||||
{
|
||||
key: '0',
|
||||
}
|
||||
],
|
||||
count: 1,
|
||||
};
|
||||
}
|
||||
|
||||
handleDelete = key => {
|
||||
const dataSource = [...this.state.dataSource];
|
||||
const newData = dataSource.filter(item => item.key !== key);
|
||||
this.setState({ dataSource: newData });
|
||||
this.props.setMembers(newData);
|
||||
};
|
||||
|
||||
handleAdd = () => {
|
||||
const { count, dataSource } = this.state;
|
||||
const newData = {
|
||||
key: count,
|
||||
};
|
||||
this.setState({
|
||||
dataSource: [...dataSource, newData],
|
||||
count: count + 1,
|
||||
});
|
||||
};
|
||||
|
||||
handleSave = row => {
|
||||
const newData = [...this.state.dataSource];
|
||||
const index = newData.findIndex(item => row.key === item.key);
|
||||
const item = newData[index];
|
||||
newData.splice(index, 1, {
|
||||
...item,
|
||||
...row,
|
||||
});
|
||||
this.setState({ dataSource: newData });
|
||||
this.props.setMembers(newData);
|
||||
};
|
||||
|
||||
render() {
|
||||
const { dataSource } = this.state;
|
||||
const components = {
|
||||
body: {
|
||||
row: EditableFormRow,
|
||||
cell: EditableCell,
|
||||
},
|
||||
};
|
||||
const columns = this.columns.map(col => {
|
||||
if (!col.editable) {
|
||||
return col;
|
||||
}
|
||||
return {
|
||||
...col,
|
||||
onCell: record => ({
|
||||
record,
|
||||
editable: col.editable,
|
||||
dataIndex: col.dataIndex,
|
||||
title: col.title,
|
||||
handleSave: this.handleSave,
|
||||
}),
|
||||
};
|
||||
});
|
||||
return (
|
||||
<div className="apply_team">
|
||||
<Button onClick={this.handleAdd} type="primary" className="add_member">
|
||||
添加成员
|
||||
</Button>
|
||||
<div className="member_info">
|
||||
<Table
|
||||
components={components}
|
||||
rowClassName={() => 'editable-row'}
|
||||
dataSource={dataSource}
|
||||
columns={columns}
|
||||
/>
|
||||
</div>
|
||||
</div>
|
||||
);
|
||||
}
|
||||
}
|
||||
|
||||
export default EditableTable;
|