From 5c33978e9e3e934378d8f2153a2cd919b1cb6ddd Mon Sep 17 00:00:00 2001
From: zhengyiming <540361168@qq.com>
Date: 星期四, 10 七月 2025 18:05:41 +0800
Subject: [PATCH] init
---
dist.zip | 0
src/Home/less/custom.less | 5
.umirc.ts | 32 +
src/assets/home/tab2.png | 0
src/Home/Feature5.jsx | 10
src/assets/home/jiang1.png | 0
src/components/Title/Title.less | 36 ++
src/utils/typings.ts | 12
src/assets/home/step4.png | 0
src/utils/common.ts | 11
pnpm-lock.yaml | 19 +
src/Home/less/content13.less | 109 +++++++
src/assets/home/jiang2.png | 0
.eslintrc.js | 3
src/Home/less/feature5.less | 16
src/Home/less/pricing2.less | 12
src/assets/home/step3.png | 0
src/assets/home/tab3.png | 0
src/assets/home/page-bg-mobile.png | 0
src/Home/less/content.less | 9
src/Home/index.jsx | 9
src/Home/less/content9.less | 10
src/assets/home/enroll-02.png | 0
src/assets/icon-qrcode.jpg | 0
src/assets/home/jiang3.png | 0
src/Home/Footer.jsx | 113 ++++++++
src/components/Title/Title.tsx | 31 ++
src/assets/home/step2.png | 0
src/assets/common/icon-title-bg.png | 0
src/assets/home/enroll-01.png | 0
src/Home/Feature4.jsx | 15
src/Home/data.source.js | 326 ++++++++++------------
src/assets/home/jiang4.png | 0
src/assets/home/tab1.png | 0
src/Home/less/feature4.less | 10
src/assets/home/page-bg.png | 0
.prettierrc | 6
src/Home/less/common.less | 8
package.json | 10
src/assets/home/step1.png | 0
40 files changed, 577 insertions(+), 235 deletions(-)
diff --git a/.eslintrc.js b/.eslintrc.js
index 85ba500..75bd18e 100644
--- a/.eslintrc.js
+++ b/.eslintrc.js
@@ -1,3 +1,6 @@
module.exports = {
extends: require.resolve('@umijs/max/eslint'),
+ rules: {
+ '@typescript-eslint/no-unused-vars': 0,
+ },
};
diff --git a/.prettierrc b/.prettierrc
index 70767cd..f3bcc49 100644
--- a/.prettierrc
+++ b/.prettierrc
@@ -4,5 +4,9 @@
"trailingComma": "all",
"proseWrap": "never",
"overrides": [{ "files": ".prettierrc", "options": { "parser": "json" } }],
- "plugins": ["prettier-plugin-organize-imports", "prettier-plugin-packagejson"]
+ "plugins": [
+ "prettier-plugin-organize-imports",
+ "prettier-plugin-packagejson"
+ ],
+ "organizeImportsSkipDestructiveCodeActions": true
}
diff --git a/.umirc.ts b/.umirc.ts
index 3d4c594..cabc224 100644
--- a/.umirc.ts
+++ b/.umirc.ts
@@ -6,29 +6,35 @@
model: {},
initialState: {},
request: {},
+ mfsu: false,
+ qiankun: {
+ slave: {},
+ },
+ base: '/v2/',
+ publicPath: '/v2/',
// layout: {
// title: '@umijs/max',
// },
routes: [
{
path: '/',
- redirect: '/home',
+ redirect: '/about',
},
{
- name: '棣栭〉',
- path: '/home',
+ name: '鍏充簬澶ц禌',
+ path: '/about',
component: './Home',
},
- {
- name: '鏉冮檺婕旂ず',
- path: '/access',
- component: './Access',
- },
- {
- name: ' CRUD 绀轰緥',
- path: '/table',
- component: './Table',
- },
+ // {
+ // name: '鏉冮檺婕旂ず',
+ // path: '/access',
+ // component: './Access',
+ // },
+ // {
+ // name: ' CRUD 绀轰緥',
+ // path: '/table',
+ // component: './Table',
+ // },
],
npmClient: 'pnpm',
});
diff --git a/dist.zip b/dist.zip
new file mode 100644
index 0000000..40824b0
--- /dev/null
+++ b/dist.zip
Binary files differ
diff --git a/package.json b/package.json
index 06399d5..87ec41d 100644
--- a/package.json
+++ b/package.json
@@ -1,22 +1,25 @@
{
+ "name": "v2",
"private": true,
"author": "",
"scripts": {
- "dev": "max dev",
"build": "max build",
+ "dev": "max dev",
"format": "prettier --cache --write .",
- "prepare": "husky",
"postinstall": "max setup",
+ "prepare": "husky",
"setup": "max setup",
"start": "npm run dev"
},
"dependencies": {
"@ant-design/compatible": "^1.1.2",
- "@ant-design/icons": "^5.0.1",
+ "@ant-design/icons": "^5.6.1",
"@ant-design/pro-components": "^2.4.4",
"@umijs/max": "^4.4.11",
"antd": "^4.24.16",
+ "classnames": "^2.5.1",
"enquire-js": "^0.2.1",
+ "file-saver": "^2.0.5",
"rc-banner-anim": "^2.4.5",
"rc-queue-anim": "^2.0.0",
"rc-scroll-anim": "^2.7.6",
@@ -24,6 +27,7 @@
"rc-tween-one": "^2.7.3"
},
"devDependencies": {
+ "@types/file-saver": "^2.0.7",
"@types/react": "^18.0.33",
"@types/react-dom": "^18.0.11",
"husky": "^9",
diff --git a/pnpm-lock.yaml b/pnpm-lock.yaml
index 5627af4..72effd5 100644
--- a/pnpm-lock.yaml
+++ b/pnpm-lock.yaml
@@ -9,7 +9,7 @@
specifier: ^1.1.2
version: 1.1.2(antd@4.24.16)(prop-types@15.8.1)(react-dom@18.3.1)(react@18.3.1)
'@ant-design/icons':
- specifier: ^5.0.1
+ specifier: ^5.6.1
version: 5.6.1(react-dom@18.3.1)(react@18.3.1)
'@ant-design/pro-components':
specifier: ^2.4.4
@@ -20,9 +20,15 @@
antd:
specifier: ^4.24.16
version: 4.24.16(react-dom@18.3.1)(react@18.3.1)
+ classnames:
+ specifier: ^2.5.1
+ version: 2.5.1
enquire-js:
specifier: ^0.2.1
version: 0.2.1
+ file-saver:
+ specifier: ^2.0.5
+ version: 2.0.5
rc-banner-anim:
specifier: ^2.4.5
version: 2.4.5
@@ -40,6 +46,9 @@
version: 2.7.3
devDependencies:
+ '@types/file-saver':
+ specifier: ^2.0.7
+ version: 2.0.7
'@types/react':
specifier: ^18.0.33
version: 18.3.23
@@ -2343,6 +2352,10 @@
/@types/estree@1.0.8:
resolution: {integrity: sha512-dWHzHa2WqEXI/O1E9OjrocMTKJl2mSrEolh1Iomrv6U+JuNwaHXsXx9bLu5gG7BUWFIN0skIQJQ/L1rIex4X6w==}
dev: false
+
+ /@types/file-saver@2.0.7:
+ resolution: {integrity: sha512-dNKVfHd/jk0SkR/exKGj2ggkB45MAkzvWCaqLUUgkyjITkGNzH8H+yUwr+BLJUBjZOe9w8X3wgmXhZDRg1ED6A==}
+ dev: true
/@types/graceful-fs@4.1.9:
resolution: {integrity: sha512-olP3sd1qOEe5dXTSaFvQG+02VdRXcdytWLAZsAq1PecU8uqQAhkrnbli7DagjtXKW/Bl7YJbUsa8MPcuc8LHEQ==}
@@ -5969,6 +5982,10 @@
flat-cache: 3.2.0
dev: false
+ /file-saver@2.0.5:
+ resolution: {integrity: sha512-P9bmyZ3h/PRG+Nzga+rbdI4OEpNDzAVyy74uVO9ATgzLK6VtAsYybF/+TOCvrc0MO793d6+42lLyZTw7/ArVzA==}
+ dev: false
+
/fill-range@7.1.1:
resolution: {integrity: sha512-YsGpe3WHLK8ZYi4tWDg2Jy3ebRz2rXowDxnld4bkQB00cc/1Zw9AWnC0i9ztDJitivtQvaI9KaLyKrc+hBW0yg==}
engines: {node: '>=8'}
diff --git a/src/Home/Feature4.jsx b/src/Home/Feature4.jsx
index 0052f53..9ac60a3 100644
--- a/src/Home/Feature4.jsx
+++ b/src/Home/Feature4.jsx
@@ -45,6 +45,17 @@
};
return (
<div {...props} {...dataSource.wrapper}>
+ <OverPack>
+ <QueueAnim
+ type="bottom"
+ leaveReverse
+ key="page"
+ delay={[0, 100]}
+ {...dataSource.titleWrapper}
+ >
+ {dataSource.titleWrapper.children.map(getChildrenToRender)}
+ </QueueAnim>
+ </OverPack>
<OverPack {...dataSource.OverPack} component={Row}>
<QueueAnim
key="text"
@@ -54,9 +65,9 @@
{...dataSource.textWrapper}
component={Col}
>
- <div key="title" {...dataSource.titleWrapper}>
+ {/* <div key="title" {...dataSource.titleWrapper}>
{dataSource.titleWrapper.children.map(getChildrenToRender)}
- </div>
+ </div> */}
<QueueAnim
component="ul"
key="ul"
diff --git a/src/Home/Feature5.jsx b/src/Home/Feature5.jsx
index 658b5c5..51c178e 100644
--- a/src/Home/Feature5.jsx
+++ b/src/Home/Feature5.jsx
@@ -1,8 +1,8 @@
-import React from 'react';
-import TweenOne from 'rc-tween-one';
-import OverPack from 'rc-scroll-anim/lib/ScrollOverPack';
-import { Tabs, Row, Col } from 'antd';
import { Icon } from '@ant-design/compatible';
+import { Col, Row, Tabs } from 'antd';
+import OverPack from 'rc-scroll-anim/lib/ScrollOverPack';
+import TweenOne from 'rc-tween-one';
+import React from 'react';
import { getChildrenToRender } from './utils';
const TabPane = Tabs.TabPane;
@@ -31,7 +31,7 @@
key={i + 1}
tab={
<div className={tag.className}>
- <Icon type={iconChildren} className={icon.className} />
+ <img src={iconChildren} className={icon.className} />
<div {...tagText}>{tagText.children}</div>
</div>
}
diff --git a/src/Home/Footer.jsx b/src/Home/Footer.jsx
new file mode 100644
index 0000000..a603526
--- /dev/null
+++ b/src/Home/Footer.jsx
@@ -0,0 +1,113 @@
+import Icon, {
+ GlobalOutlined,
+ IconProvider,
+ MailOutlined,
+ PhoneOutlined,
+} from '@ant-design/icons';
+import { Button, Card, Col, Divider, Row, Typography } from 'antd';
+// import QRCode from 'qrcode.react';
+import EnrollImage1 from '@/assets/home/enroll-01.png';
+import EnrollImage2 from '@/assets/home/enroll-02.png';
+import IconQrcode from '@/assets/icon-qrcode.jpg';
+import { downloadFileByUrl } from '@/utils/common';
+import { useCallback } from 'react';
+
+const { Title, Paragraph, Text } = Typography;
+
+export const HomeEnrollFileList2025 = [
+ {
+ name: '2025骞村ぇ璧涙姤鍚嶈〃',
+ icon: EnrollImage1,
+ fileUrl:
+ 'https://waterdroptest2.oss-cn-hangzhou.aliyuncs.com/NBHRXH/Assets/2025%E5%B9%B4%E5%A4%A7%E8%B5%9B%E6%8A%A5%E5%90%8D%E8%A1%A8.doc',
+ },
+ {
+ name: '2025骞村ぇ璧涘晢涓氳鍒掍功妯℃澘',
+ icon: EnrollImage2,
+ fileUrl:
+ 'https://waterdroptest2.oss-cn-hangzhou.aliyuncs.com/NBHRXH/Assets/2025%E5%B9%B4%E5%A4%A7%E8%B5%9B%E5%95%86%E4%B8%9A%E8%AE%A1%E5%88%92%E4%B9%A6%E6%A8%A1%E6%9D%BF.docx',
+ },
+];
+
+const FooterComponent = () => {
+ return (
+ <Row gutter={48} justify="center" style={{ paddingTop: 64 }}>
+ {/* 鑱旂郴淇℃伅 */}
+ <Col xs={24} sm={12} md={8} lg={6}>
+ <Title level={4} style={{ marginBottom: 24 }}>
+ 鑱旂郴鎴戜滑
+ </Title>
+ <div className="contact-item">
+ <PhoneOutlined style={{ fontSize: 18, marginRight: 12 }} />
+ <Text style={{ fontSize: 16 }}>400-123-4567</Text>
+ </div>
+ <div className="contact-item">
+ <MailOutlined style={{ fontSize: 18, marginRight: 12 }} />
+ <Text style={{ fontSize: 16 }}>contact@example.com</Text>
+ </div>
+ <div className="contact-item">
+ <GlobalOutlined style={{ fontSize: 18, marginRight: 12 }} />
+ <Text style={{ fontSize: 16 }}>www.example.com</Text>
+ </div>
+ </Col>
+
+ {/* 浜岀淮鐮� */}
+ <Col xs={24} sm={12} md={8} lg={6}>
+ <Title level={4} style={{ marginBottom: 24 }}>
+ 鎵爜鍏虫敞
+ </Title>
+ <Card
+ style={{
+ width: 160,
+ height: 160,
+ textAlign: 'center',
+ boxShadow: '0 2px 8px rgba(0, 0, 0, 0.09)',
+ margin: '0 auto',
+ }}
+ bodyStyle={{
+ padding: 0,
+ }}
+ >
+ {/* <QRCode value="https://www.example.com" size={120} /> */}
+ <img src={IconQrcode} style={{ width: '100%', height: '100%' }} />
+ </Card>
+ </Col>
+ </Row>
+ );
+};
+
+export function FooterApply() {
+ const handleDownload = useCallback((fileUrl) => {
+ downloadFileByUrl(fileUrl);
+ });
+
+ return (
+ <Row
+ gutter={48}
+ justify="center"
+ style={{ paddingTop: 64, maxWidth: 1200, margin: '0 auto' }}
+ >
+ {HomeEnrollFileList2025.map((item, index) => (
+ <Col xs={24} sm={12} md={12} lg={12} key={item.fileUrl}>
+ <div className="enroll-item">
+ <div className="enroll-icon">
+ <img src={item.icon} />
+ </div>
+ <div className="enroll-info">
+ <h4 className="enroll-title ellipsis">{item.name}</h4>
+ <Button
+ type="primary"
+ class="download-btn"
+ onClick={() => handleDownload(item.fileUrl, item.name)}
+ >
+ 鐐瑰嚮涓嬭浇
+ </Button>
+ </div>
+ </div>
+ </Col>
+ ))}
+ </Row>
+ );
+}
+
+export default FooterComponent;
diff --git a/src/Home/data.source.js b/src/Home/data.source.js
index 0d5470d..813c39f 100644
--- a/src/Home/data.source.js
+++ b/src/Home/data.source.js
@@ -1,3 +1,17 @@
+import Jiang1 from '@/assets/home/jiang1.png';
+import Jiang2 from '@/assets/home/jiang2.png';
+import Jiang3 from '@/assets/home/jiang3.png';
+import Jiang4 from '@/assets/home/jiang4.png';
+import Step1 from '@/assets/home/step1.png';
+import Step2 from '@/assets/home/step2.png';
+import Step3 from '@/assets/home/step3.png';
+import Step4 from '@/assets/home/step4.png';
+import Tab1 from '@/assets/home/tab1.png';
+import Tab2 from '@/assets/home/tab2.png';
+import Tab3 from '@/assets/home/tab3.png';
+import Title from '@/components/Title/Title';
+import FooterComponent, { FooterApply } from './Footer';
+
export const Nav30DataSource = {
wrapper: { className: 'header3 home-page-wrapper' },
page: { className: 'home-page' },
@@ -102,22 +116,22 @@
textWrapper: {
className: 'banner3-text-wrapper',
children: [
- {
- name: 'slogan',
- className: 'banner3-slogan mcvci2cuar-editor_css',
- children: '绗崄灞婁汉鍔涜祫婧愭湇鍔″垱鏂板垱涓氬ぇ璧�',
- texty: true,
- },
- { name: 'button', className: 'banner3-button', children: '绔嬪嵆鎶ュ悕' },
- {
- name: 'time',
- className: 'banner3-time mcvcibrmazu-editor_css',
- children: (
- <span>
- <p>涓浗路瀹佹尝</p>
- </span>
- ),
- },
+ // {
+ // name: 'slogan',
+ // className: 'banner3-slogan mcvci2cuar-editor_css',
+ // children: '绗崄灞婁汉鍔涜祫婧愭湇鍔″垱鏂板垱涓氬ぇ璧�',
+ // texty: true,
+ // },
+ // { name: 'button', className: 'banner3-button', children: '绔嬪嵆鎶ュ悕' },
+ // {
+ // name: 'time',
+ // className: 'banner3-time mcvcibrmazu-editor_css',
+ // children: (
+ // <span>
+ // <p>涓浗路瀹佹尝</p>
+ // </span>
+ // ),
+ // },
],
},
};
@@ -130,19 +144,9 @@
className: 'title-wrapper',
children: [
{
- name: 'image',
- children:
- 'https://gw.alipayobjects.com/zos/rmsportal/PiqyziYmvbgAudYfhuBr.svg',
- className: 'title-image',
- },
- {
name: 'title',
- children: (
- <span>
- <p>鍏充簬澶ц禌</p>
- </span>
- ),
- className: 'title-h1',
+ children: <Title title="鍏充簬澶ц禌" />,
+ // className: 'title-h1',
},
{
name: 'content',
@@ -203,19 +207,9 @@
className: 'title-wrapper',
children: [
{
- name: 'image',
- children:
- 'https://gw.alipayobjects.com/zos/rmsportal/PiqyziYmvbgAudYfhuBr.svg',
- className: 'title-image',
- },
- {
name: 'title',
- children: (
- <span>
- <p>鍙傝禌鎸囧崡</p>
- </span>
- ),
- className: 'title-h1',
+ children: <Title title="鍙傝禌鎸囧崡" />,
+ // className: 'title-h1',
},
],
},
@@ -231,8 +225,7 @@
textWrapper: { className: 'text-wrapper' },
img: {
className: 'block-img',
- children:
- 'https://gw.alipayobjects.com/zos/rmsportal/SlFgHDtOTLzccvFrQHLg.png',
+ children: Step1,
},
icon: {
className: 'block-icon',
@@ -287,8 +280,7 @@
textWrapper: { className: 'text-wrapper' },
img: {
className: 'block-img',
- children:
- 'https://gw.alipayobjects.com/zos/rmsportal/SlFgHDtOTLzccvFrQHLg.png',
+ children: Step2,
},
icon: {
className: 'block-icon',
@@ -329,8 +321,7 @@
textWrapper: { className: 'text-wrapper' },
img: {
className: 'block-img',
- children:
- 'https://gw.alipayobjects.com/zos/rmsportal/SlFgHDtOTLzccvFrQHLg.png',
+ children: Step3,
},
icon: {
className: 'block-icon',
@@ -371,8 +362,7 @@
textWrapper: { className: 'text-wrapper' },
img: {
className: 'block-img',
- children:
- 'https://gw.alipayobjects.com/zos/rmsportal/SlFgHDtOTLzccvFrQHLg.png',
+ children: Step4,
},
icon: {
className: 'block-icon',
@@ -426,12 +416,8 @@
children: [
{
name: 'title',
- children: (
- <span>
- <p>鍙傝禌璧勬牸涓庢潯浠�</p>
- </span>
- ),
- className: 'title-h1',
+ children: <Title title="鍙傝禌璧勬牸涓庢潯浠�"></Title>,
+ // className: 'title-h1',
},
],
},
@@ -508,12 +494,8 @@
children: [
{
name: 'title',
- children: (
- <span>
- <p>鍙傝禌鑼冨洿</p>
- </span>
- ),
- className: 'title-h1',
+ children: <Title title="鍙傝禌鑼冨洿" />,
+ // className: 'title-h1',
},
],
},
@@ -533,7 +515,7 @@
),
className: 'content7-tag-name',
},
- icon: { children: 'mobile' },
+ icon: { children: Tab1 },
},
content: {
className: 'content7-content',
@@ -572,7 +554,7 @@
name: 'block1',
tag: {
className: 'content7-tag',
- icon: { children: 'tablet' },
+ icon: { children: Tab2 },
text: {
className: 'content7-tag-name',
children: (
@@ -629,7 +611,7 @@
),
className: 'content7-tag-name',
},
- icon: { children: 'laptop' },
+ icon: { children: Tab3 },
},
content: {
className: 'content7-content',
@@ -672,14 +654,9 @@
children: [
{
name: 'title',
- children: (
- <span>
- <span>
- <p>濂栭」璁剧疆</p>
- </span>
- </span>
- ),
- className: 'pricing2-title-h1',
+ children: <Title title="濂栭」璁剧疆" />,
+
+ // className: 'pricing2-title-h1',
},
],
},
@@ -695,8 +672,8 @@
name: 'empty',
childWrapper: {
children: [
- { name: 'name', children: '12' },
- { name: 'content', children: '34' },
+ { name: 'name', children: ' ' },
+ { name: 'content', children: ' ' },
],
},
},
@@ -709,15 +686,14 @@
children: [
{
name: 'name',
- className: 'pricing2-table-name',
- children: 'Free',
+ className: 'pricing2-table-name-icon',
+ children: <img src={Jiang1} />,
},
{
- name: 'content',
- className: 'pricing2-table-money',
- children: '楼0',
+ name: 'name',
+ className: 'pricing2-table-name',
+ children: '涓�绛夊',
},
- { name: 'button', children: { href: '#', children: '鍏嶈垂璇曠敤' } },
],
},
},
@@ -730,15 +706,14 @@
children: [
{
name: 'name',
- className: 'pricing2-table-name',
- children: 'Basic',
+ className: 'pricing2-table-name-icon',
+ children: <img src={Jiang2} />,
},
{
- name: 'content',
- className: 'pricing2-table-money',
- children: '楼550',
+ name: 'name',
+ className: 'pricing2-table-name',
+ children: '浜岀瓑濂�',
},
- { name: 'button', children: { href: '#', children: '绔嬪嵆璐拱' } },
],
},
},
@@ -751,17 +726,13 @@
children: [
{
name: 'name',
+ className: 'pricing2-table-name-icon',
+ children: <img src={Jiang3} />,
+ },
+ {
+ name: 'name',
className: 'pricing2-table-name',
- children: 'Pro',
- },
- {
- name: 'content',
- className: 'pricing2-table-money',
- children: '楼2,200',
- },
- {
- name: 'button',
- children: { href: '#', type: 'primary', children: '绔嬪嵆璐拱' },
+ children: '涓夌瓑濂�',
},
],
},
@@ -775,15 +746,14 @@
children: [
{
name: 'name',
- className: 'pricing2-table-name',
- children: 'Unlimited',
+ className: 'pricing2-table-name-icon',
+ children: <img src={Jiang4} />,
},
{
- name: 'content',
- className: 'pricing2-table-money',
- children: '楼5,600',
+ name: 'name',
+ className: 'pricing2-table-name',
+ children: '浼樿儨濂�',
},
- { name: 'button', children: { href: '#', children: '绔嬪嵆璐拱' } },
],
},
},
@@ -797,21 +767,46 @@
{
className: 'pricing2-table-content-name',
name: 'name',
- children: '涓�绛夊',
+ children: '缁煎悎璧涢亾',
},
{
- children: '浜岀瓑濂�',
+ children: (
+ <span>
+ <p>1鍚�</p>
+ <p>濂栭噾80000鍏�</p>
+ </span>
+ ),
name: 'content0',
className: 'pricing2-table-content',
},
{
- children: '涓夌瓑濂�',
+ children: (
+ <span>
+ <p>2鍚�</p>
+ <p>濂栭噾30000鍏�</p>
+ </span>
+ ),
name: 'content1',
className: 'pricing2-table-content',
},
{
- children: '浼樿儨濂�',
+ children: (
+ <span>
+ <p>3鍚�</p>
+ <p>濂栭噾20000鍏�</p>
+ </span>
+ ),
name: 'content2',
+ className: 'pricing2-table-content',
+ },
+ {
+ children: (
+ <span>
+ <p>9鍚�</p>
+ <p>鑽ｈ獕璇佷功</p>
+ </span>
+ ),
+ name: 'content3',
className: 'pricing2-table-content',
},
],
@@ -822,18 +817,13 @@
{
className: 'pricing2-table-content-name',
name: 'name',
- children: (
- <span>
- <p>1鍚�</p>
- <p>濂栭噾80000鍏�</p>
- </span>
- ),
+ children: '浜哄姏璧勬簮鏈嶅姟涓氫笌鍒堕�犱篃铻嶅悎鍙戝睍涓撻」璧涢亾',
},
{
children: (
<span>
- <p>2鍚�</p>
- <p>濂栭噾30000鍏�</p>
+ <p>1鍚�</p>
+ <p>濂栭噾80000鍏�</p>
</span>
),
name: 'content0',
@@ -842,8 +832,8 @@
{
children: (
<span>
- <p>3鍚�</p>
- <p>濂栭噾20000鍏�</p>
+ <p>2鍚�</p>
+ <p>濂栭噾30000鍏�</p>
</span>
),
name: 'content1',
@@ -852,11 +842,21 @@
{
children: (
<span>
- <p>9鍚�</p>
- <p>鑽ｈ獕璇佷功</p>
+ <p>2鍚�</p>
+ <p>濂栭噾20000鍏�</p>
</span>
),
name: 'content2',
+ className: 'pricing2-table-content',
+ },
+ {
+ children: (
+ <span>
+ <p>5鍚�</p>
+ <p>鑽ｈ獕璇佷功</p>
+ </span>
+ ),
+ name: 'content3',
className: 'pricing2-table-content',
},
],
@@ -867,19 +867,14 @@
{
className: 'pricing2-table-content-name',
name: 'name',
- children: (
- <span>
- <p>1鍚�</p>
- <p>濂栭噾80000鍏�</p>
- </span>
- ),
+ children: '鏂板氨涓氬舰鎬佷笓椤硅禌閬�',
},
{
name: 'content0',
children: (
<span>
- <p>2鍚�</p>
- <p>濂栭噾30000鍏�</p>
+ <p>1鍚�</p>
+ <p>濂栭噾80000鍏�</p>
</span>
),
className: 'pricing2-table-content',
@@ -889,48 +884,13 @@
children: (
<span>
<p>2鍚�</p>
- <p>濂栭噾20000鍏�</p>
- </span>
- ),
- className: 'pricing2-table-content',
- },
- {
- name: 'content2',
- children: (
- <span>
- <p>5鍚�</p>
- <p>鑽ｈ獕璇佷功</p>
- </span>
- ),
- className: 'pricing2-table-content',
- },
- ],
- },
- {
- name: 'list3',
- children: [
- {
- className: 'pricing2-table-content-name',
- name: 'name',
- children: (
- <span>
- <p>1鍚�</p>
- <p>濂栭噾80000鍏�</p>
- </span>
- ),
- },
- {
- children: (
- <span>
- <p>2鍚�</p>
<p>濂栭噾30000鍏�</p>
</span>
),
- name: 'content0',
className: 'pricing2-table-content',
},
{
- name: 'content1',
+ name: 'content2',
children: (
<span>
<p>2鍚�</p>
@@ -940,7 +900,7 @@
className: 'pricing2-table-content',
},
{
- name: 'content2',
+ name: 'content3',
children: (
<span>
<p>5鍚�</p>
@@ -957,38 +917,42 @@
};
export const Content131DataSource = {
OverPack: {
- className: 'home-page-wrapper content13-wrapper',
+ className: 'home-page-wrapper content13-wrapper content131-wrapper',
playScale: 0.3,
},
titleWrapper: {
className: 'title-wrapper',
children: [
{
- name: 'image',
- children:
- 'https://gw.alipayobjects.com/zos/rmsportal/PiqyziYmvbgAudYfhuBr.svg',
- className: 'title-image',
- },
- {
name: 'title',
- children: (
- <span>
- <span>
- <p>鑱旂郴鏂瑰紡</p>
- </span>
- </span>
- ),
- className: 'title-h1',
+ children: <Title title="鑱旂郴鏂瑰紡" />,
+ // className: 'title-h1',
},
{
name: 'content',
- children:
- '鐗硅壊灞曞彴鍖呮嫭 Ant Design 銆丄ntV銆丄ntG銆丒gg 绛夋槑鏄熶骇鍝侊紝鏇存湁浜у搧涓撳',
+ children: <FooterComponent />,
className: 'title-content',
},
+ ],
+ },
+};
+
+export const Content132DataSource = {
+ OverPack: {
+ className: 'home-page-wrapper content13-wrapper content132-wrapper',
+ playScale: 0.3,
+ },
+ titleWrapper: {
+ className: 'title-wrapper',
+ children: [
{
- name: 'content2',
- children: '鐜板満闂瘖锛屼负浣犵瓟鐤戣В闅�',
+ name: 'title',
+ children: <Title title="澶ц禌鎶ュ悕" />,
+ // className: 'title-h1',
+ },
+ {
+ name: 'content',
+ children: <FooterApply />,
className: 'title-content',
},
],
diff --git a/src/Home/index.jsx b/src/Home/index.jsx
index 0c04f5b..54e823d 100644
--- a/src/Home/index.jsx
+++ b/src/Home/index.jsx
@@ -8,12 +8,14 @@
import Content9 from './Content9';
import Feature4 from './Feature4';
import Feature5 from './Feature5';
+import FooterComponent from './Footer';
import Pricing2 from './Pricing2';
import {
Banner31DataSource,
Content130DataSource,
Content131DataSource,
+ Content132DataSource,
Content90DataSource,
Feature40DataSource,
Feature50DataSource,
@@ -105,6 +107,13 @@
dataSource={Content131DataSource}
isMobile={this.state.isMobile}
/>,
+ <Content13
+ id="Content13_2"
+ key="Content13_2"
+ dataSource={Content132DataSource}
+ isMobile={this.state.isMobile}
+ />,
+ // <FooterComponent key="FooterComponent" />,
];
return (
<div
diff --git a/src/Home/less/common.less b/src/Home/less/common.less
index a0ca2a0..307afc0 100644
--- a/src/Home/less/common.less
+++ b/src/Home/less/common.less
@@ -1,4 +1,3 @@
-
// @import "~antd/lib/style/v2-compatible-reset.less";
body {
@@ -40,3 +39,10 @@
padding: 0;
margin: 0;
}
+
+.home-page-wrapper {
+ &:nth-child(odd) {
+ background: url('@/assets/home/page-bg.png') no-repeat;
+ background-size: cover;
+ }
+}
diff --git a/src/Home/less/content.less b/src/Home/less/content.less
index c5ebf36..5d6a48f 100644
--- a/src/Home/less/content.less
+++ b/src/Home/less/content.less
@@ -10,7 +10,8 @@
margin: auto;
will-change: transform;
}
- .title-wrapper > h1, > h1 {
+ .title-wrapper > h1,
+ > h1 {
font-size: 32px;
color: @text-color;
margin-bottom: 16px;
@@ -22,21 +23,21 @@
}
.@{homepage} {
- padding: 128px 24px;
+ padding: 64px 24px;
}
@media screen and (max-width: 767px) {
.@{homepage}-wrapper {
.@{homepage} {
padding: 56px 24px;
- >h1 {
+ > h1 {
font-size: 24px;
margin: 0 auto 32px;
&.title-h1 {
margin-bottom: 8px;
}
}
- >p {
+ > p {
margin-bottom: 32px;
}
}
diff --git a/src/Home/less/content13.less b/src/Home/less/content13.less
index c14e943..5366b05 100644
--- a/src/Home/less/content13.less
+++ b/src/Home/less/content13.less
@@ -1,16 +1,16 @@
@content13: content13;
.@{content13}-wrapper {
- height: 664px;
- background: url('https://gw.alipayobjects.com/zos/rmsportal/ZsWYzLOItgeaWDSsXdZd.svg')
- no-repeat bottom;
+ height: 654px;
+ // background: url('https://gw.alipayobjects.com/zos/rmsportal/ZsWYzLOItgeaWDSsXdZd.svg')
+ // no-repeat bottom;
background-size: cover;
background-size: 100%;
margin: 0 auto;
overflow: hidden;
- padding: 96px 0;
+ padding: 64px 0;
&.home-page-wrapper {
.title-wrapper {
- margin-bottom: 32px;
+ margin-bottom: 0;
}
}
.title-content {
@@ -18,8 +18,105 @@
}
}
+.content131-wrapper {
+ height: 578px;
+
+ .contact-item {
+ display: flex;
+ align-items: center;
+ padding-left: 64px;
+ margin-bottom: 16px;
+
+ &:last-child {
+ margin-bottom: 0;
+ }
+ }
+}
+
+.content132-wrapper {
+ height: 528px;
+ .enroll-item {
+ display: flex;
+ padding: 26px 36px;
+ min-width: 0;
+ border: #4564ff solid 1px;
+ border-radius: 8px;
+ flex: 1;
+ flex-direction: row;
+ .enroll-icon {
+ margin-right: 36px;
+ img {
+ width: 94px;
+ height: auto;
+ }
+ }
+ .enroll-info {
+ display: flex;
+ justify-content: space-around;
+ min-width: 0;
+ flex: 1;
+ flex-direction: column;
+ .enroll-title {
+ font-size: 20px;
+ font-weight: 400;
+ color: #1f6cdd;
+ &::after {
+ display: block;
+ margin-top: 18px;
+ width: 50px;
+ height: 2px;
+ border-radius: 1.5px;
+ background: #1f6cdd;
+ content: ' ';
+ transition-duration: 0.5s;
+ }
+ }
+ .download-btn {
+ box-sizing: content-box;
+ // padding: 0 2em;
+ width: 50%;
+ font-size: 14px;
+ line-height: 2;
+ border: 1px solid #73c6f4;
+ border-radius: 6px;
+ text-align: center;
+ color: #ffffff;
+ background: #4564ff;
+ cursor: pointer;
+ }
+ &:hover {
+ .enroll-title {
+ &::after {
+ width: 96px;
+ }
+ }
+ }
+ }
+ }
+}
+
@media screen and (max-width: 767px) {
.@{content13}-wrapper {
- padding-bottom: 0;
+ padding-bottom: 64px;
+ }
+
+ .content131-wrapper {
+ height: 776px;
+ }
+
+ .content132-wrapper {
+ height: 744px;
+ }
+
+ .content131-wrapper,
+ .content132-wrapper {
+ .ant-col + .ant-col {
+ margin-top: 36px;
+ }
+
+ .contact-item {
+ padding-left: 0;
+ justify-content: center;
+ }
}
}
diff --git a/src/Home/less/content9.less b/src/Home/less/content9.less
index b1b0126..8d5f64e 100644
--- a/src/Home/less/content9.less
+++ b/src/Home/less/content9.less
@@ -7,7 +7,9 @@
overflow: initial;
}
.@{content9} {
- min-height: 800px;
+ // min-height: 800px;
+ height: 1110px;
+ box-sizing: content-box;
padding: 64px 0 0;
}
.timeline {
@@ -21,7 +23,7 @@
width: 0;
height: ~'calc(100% - 108px)';
margin: 34px 0;
- border-left: 2px #ebedf0 dashed;
+ border-left: 2px #1890ff dashed;
}
}
.block-wrapper {
@@ -78,6 +80,7 @@
font-size: 14px;
position: relative;
min-height: 18px;
+ font-weight: bold;
}
.block-icon {
position: absolute;
@@ -87,7 +90,7 @@
.block-content {
width: 300px;
color: #314659;
- font-size: 12px;
+ font-size: 14px;
min-height: 18px;
word-break: break-all;
}
@@ -98,6 +101,7 @@
.@{content9}-wrapper {
padding-bottom: 0;
.@{content9} {
+ height: 722px;
padding: 64px 24px;
}
.timeline {
diff --git a/src/Home/less/custom.less b/src/Home/less/custom.less
index b7ffa40..d1764a3 100644
--- a/src/Home/less/custom.less
+++ b/src/Home/less/custom.less
@@ -1,7 +1,10 @@
// @import '~antd/lib/style/themes/default.less';
-@import '~antd/lib/style/index.less';
+// @import '~antd/lib/style/index.less';
+@import '~antd/es/style/themes/default.less';
+@import '~antd/dist/antd.less';
@line-color: #e9e9e9;
+@primary-color: #3a71ff;
@shadow-color: rgba(0, 0, 0, 0.15);
diff --git a/src/Home/less/feature4.less b/src/Home/less/feature4.less
index 8ccb090..b745eb1 100644
--- a/src/Home/less/feature4.less
+++ b/src/Home/less/feature4.less
@@ -1,14 +1,16 @@
@content6: content6;
.@{content6}-wrapper {
min-height: 720px;
+ padding-top: 64px;
.@{content6} {
height: 100%;
display: flex;
align-items: center;
+ padding-top: 0;
&-text {
min-height: 424px;
- >*.queue-anim-leaving {
+ > *.queue-anim-leaving {
position: relative !important;
}
.title-h1 {
@@ -49,7 +51,7 @@
@media screen and (max-width: 767px) {
.@{content6}-wrapper {
- height: 860px;
+ height: 1114px;
overflow: hidden;
.@{content6} {
display: block;
@@ -59,8 +61,8 @@
width: 100%;
}
&-text {
- >h1,
- >p {
+ > h1,
+ > p {
text-align: center;
}
> h1 {
diff --git a/src/Home/less/feature5.less b/src/Home/less/feature5.less
index aa2678d..bddc4c3 100644
--- a/src/Home/less/feature5.less
+++ b/src/Home/less/feature5.less
@@ -1,17 +1,19 @@
@content7: content7;
.@{content7}-wrapper {
- min-height: 720px;
+ height: 802px;
.@{content7} {
- >h1,
- >p {
+ > h1,
+ > p {
text-align: center;
}
&-tag {
- & i {
+ display: flex;
+ align-items: center;
+ & i,
+ & img {
width: 12px;
height: 14px;
- display: inline-block;
- vertical-align: middle;
+ display: block;
margin-right: 5px;
}
&-name {
@@ -49,7 +51,7 @@
@media screen and (max-width: 767px) {
.@{content7}-wrapper {
- min-height: 980px;
+ min-height: 1000px;
overflow: hidden;
.@{content7} {
max-width: 100%;
diff --git a/src/Home/less/pricing2.less b/src/Home/less/pricing2.less
index 69b193e..ef5fc84 100644
--- a/src/Home/less/pricing2.less
+++ b/src/Home/less/pricing2.less
@@ -1,15 +1,15 @@
@pricing2: pricing2;
.@{pricing2}-wrapper {
- min-height: 760px;
+ min-height: 500px;
.@{pricing2} {
- >p {
+ > p {
text-align: center;
}
&-content-wrapper {
- min-height: 400px;
+ // min-height: 400px;
}
&-table-name-block {
@@ -22,6 +22,12 @@
font-size: 24px;
}
+ &-table-name-icon {
+ img {
+ width: 48px;
+ }
+ }
+
&-table-money {
font-size: 16px;
margin: 8px 0 16px;
diff --git a/src/assets/common/icon-title-bg.png b/src/assets/common/icon-title-bg.png
new file mode 100644
index 0000000..a367950
--- /dev/null
+++ b/src/assets/common/icon-title-bg.png
Binary files differ
diff --git a/src/assets/home/enroll-01.png b/src/assets/home/enroll-01.png
new file mode 100644
index 0000000..6665af5
--- /dev/null
+++ b/src/assets/home/enroll-01.png
Binary files differ
diff --git a/src/assets/home/enroll-02.png b/src/assets/home/enroll-02.png
new file mode 100644
index 0000000..35cf9d0
--- /dev/null
+++ b/src/assets/home/enroll-02.png
Binary files differ
diff --git a/src/assets/home/jiang1.png b/src/assets/home/jiang1.png
new file mode 100644
index 0000000..848b75b
--- /dev/null
+++ b/src/assets/home/jiang1.png
Binary files differ
diff --git a/src/assets/home/jiang2.png b/src/assets/home/jiang2.png
new file mode 100644
index 0000000..6dc1f4d
--- /dev/null
+++ b/src/assets/home/jiang2.png
Binary files differ
diff --git a/src/assets/home/jiang3.png b/src/assets/home/jiang3.png
new file mode 100644
index 0000000..7cdd88e
--- /dev/null
+++ b/src/assets/home/jiang3.png
Binary files differ
diff --git a/src/assets/home/jiang4.png b/src/assets/home/jiang4.png
new file mode 100644
index 0000000..7b846c1
--- /dev/null
+++ b/src/assets/home/jiang4.png
Binary files differ
diff --git a/src/assets/home/page-bg-mobile.png b/src/assets/home/page-bg-mobile.png
new file mode 100644
index 0000000..d3c567d
--- /dev/null
+++ b/src/assets/home/page-bg-mobile.png
Binary files differ
diff --git a/src/assets/home/page-bg.png b/src/assets/home/page-bg.png
new file mode 100644
index 0000000..00b80dd
--- /dev/null
+++ b/src/assets/home/page-bg.png
Binary files differ
diff --git a/src/assets/home/step1.png b/src/assets/home/step1.png
new file mode 100644
index 0000000..eec9102
--- /dev/null
+++ b/src/assets/home/step1.png
Binary files differ
diff --git a/src/assets/home/step2.png b/src/assets/home/step2.png
new file mode 100644
index 0000000..f38a891
--- /dev/null
+++ b/src/assets/home/step2.png
Binary files differ
diff --git a/src/assets/home/step3.png b/src/assets/home/step3.png
new file mode 100644
index 0000000..5ee4360
--- /dev/null
+++ b/src/assets/home/step3.png
Binary files differ
diff --git a/src/assets/home/step4.png b/src/assets/home/step4.png
new file mode 100644
index 0000000..725300a
--- /dev/null
+++ b/src/assets/home/step4.png
Binary files differ
diff --git a/src/assets/home/tab1.png b/src/assets/home/tab1.png
new file mode 100644
index 0000000..345c0a7
--- /dev/null
+++ b/src/assets/home/tab1.png
Binary files differ
diff --git a/src/assets/home/tab2.png b/src/assets/home/tab2.png
new file mode 100644
index 0000000..4e51f36
--- /dev/null
+++ b/src/assets/home/tab2.png
Binary files differ
diff --git a/src/assets/home/tab3.png b/src/assets/home/tab3.png
new file mode 100644
index 0000000..15d9393
--- /dev/null
+++ b/src/assets/home/tab3.png
Binary files differ
diff --git a/src/assets/icon-qrcode.jpg b/src/assets/icon-qrcode.jpg
new file mode 100644
index 0000000..a675347
--- /dev/null
+++ b/src/assets/icon-qrcode.jpg
Binary files differ
diff --git a/src/components/Title/Title.less b/src/components/Title/Title.less
new file mode 100644
index 0000000..1025ef0
--- /dev/null
+++ b/src/components/Title/Title.less
@@ -0,0 +1,36 @@
+.title-card-wrapper {
+ margin: 0 auto 60px;
+ width: 537px;
+ height: 114px;
+ text-align: center;
+ background-position: center center;
+ background-size: cover;
+ .title-card-title {
+ padding-top: 8px;
+ font-size: 42px;
+ font-weight: 500;
+ color: #00116e;
+ line-height: 60px;
+ }
+}
+
+@media (max-width: 767px) {
+ .title-card-wrapper {
+ width: 320px;
+ height: 96px;
+ // .title-card-title {
+ // padding-top: 8px;
+ // font-size: 94px;
+ // line-height: 130px;
+ // }
+ // &.large {
+ // width: 1546px;
+ // height: 328px;
+ // .title-card-title {
+ // padding-top: 26px;
+ // font-size: 123px;
+ // line-height: 174px;
+ // }
+ // }
+ }
+}
diff --git a/src/components/Title/Title.tsx b/src/components/Title/Title.tsx
new file mode 100644
index 0000000..8f7935b
--- /dev/null
+++ b/src/components/Title/Title.tsx
@@ -0,0 +1,31 @@
+import IconTitleBg from '@/assets/common/icon-title-bg.png';
+import { BasicComponent, ComponentDefaults } from '@/utils/typings';
+import classNames from 'classnames';
+import * as React from 'react';
+
+import './Title.less';
+
+export type TitleProps = {
+ title?: string;
+ large?: boolean;
+} & BasicComponent;
+
+const defaultProps = {
+ ...ComponentDefaults,
+};
+
+function Title(props: TitleProps) {
+ const { className, children, large, title, ...rest } = props;
+ return (
+ <div
+ className={classNames('title-card-wrapper', className, { large })}
+ style={{ backgroundImage: `url(${IconTitleBg})` }}
+ >
+ <div className="title-card-title">{title}</div>
+ </div>
+ );
+}
+
+Title.defaultProps = defaultProps;
+
+export default Title;
diff --git a/src/utils/common.ts b/src/utils/common.ts
new file mode 100644
index 0000000..159e325
--- /dev/null
+++ b/src/utils/common.ts
@@ -0,0 +1,11 @@
+import { saveAs } from 'file-saver';
+
+const regFileName = /(.*\/)*([^.]+).*/gi;
+export function downloadFileByUrl(fileUrl: string, fileName?: string) {
+ //const suffix = /\.([0-9a-z]+)(?:[\?#]|$)/i.exec(fileUrl)[1];
+ const suffix = /\.([0-9a-z]+)(?:[#]|$)/i.exec(fileUrl)?.[1];
+ let name = fileName ? fileName : fileUrl.replace(regFileName, '$2');
+ name += `.${suffix}`;
+ saveAs(`${fileUrl}?timestamp=${new Date().getTime()}`, name);
+ return;
+}
diff --git a/src/utils/typings.ts b/src/utils/typings.ts
new file mode 100644
index 0000000..60e6251
--- /dev/null
+++ b/src/utils/typings.ts
@@ -0,0 +1,12 @@
+import type { CSSProperties, ReactNode } from 'react';
+
+export interface BasicComponent {
+ className?: string;
+ style?: CSSProperties;
+ children?: ReactNode;
+}
+
+export const ComponentDefaults = {
+ className: '',
+ style: {},
+};
--
Gitblit v1.9.1