cxz66666
parent
c69dcd072c
commit
4e9c78c631
|
|
@ -33,6 +33,7 @@ class App extends Component {
|
|||
<Route exact path='/ticket' component={Entry} />
|
||||
<Route exact path='/' component={Home} />
|
||||
<Route exact path='/login' component={Login} />
|
||||
|
||||
</Switch>
|
||||
</HashRouter>
|
||||
</div>
|
||||
|
|
|
|||
|
|
@ -22,16 +22,7 @@ class Content11 extends React.PureComponent {
|
|||
>
|
||||
{dataSource.titleWrapper.children.map(getChildrenToRender)}
|
||||
</QueueAnim>
|
||||
<TweenOne
|
||||
key="button"
|
||||
style={{ textAlign: 'center' }}
|
||||
{...dataSource.button}
|
||||
animation={{ y: 30, opacity: 0, type: 'from', delay: 300 }}
|
||||
>
|
||||
<Button {...dataSource.button.children.a}>
|
||||
{dataSource.button.children.a.children}
|
||||
</Button>
|
||||
</TweenOne>
|
||||
|
||||
</OverPack>
|
||||
);
|
||||
}
|
||||
|
|
|
|||
|
|
@ -45,7 +45,7 @@ export const Nav30DataSource = {
|
|||
name: 'item2',
|
||||
className: 'header3-item',
|
||||
children: {
|
||||
href: 'https://wiki.zjueva.net/',
|
||||
href: '/#/history',
|
||||
children: [
|
||||
{
|
||||
children: (
|
||||
|
|
@ -58,7 +58,7 @@ export const Nav30DataSource = {
|
|||
{
|
||||
name: 'content~k6byeg17g6u',
|
||||
className: '',
|
||||
children: '协会历史 ',
|
||||
children: '了解更多 ',
|
||||
},
|
||||
],
|
||||
},
|
||||
|
|
@ -1915,10 +1915,7 @@ export const Content110DataSource = {
|
|||
},
|
||||
],
|
||||
},
|
||||
button: {
|
||||
className: 'k6n8x5ig5jn-editor_css',
|
||||
children: { a: { className: 'button', href: '/#/ticket', children: '立即报名' } },
|
||||
},
|
||||
|
||||
};
|
||||
|
||||
|
||||
|
|
|
|||
|
|
@ -2,7 +2,7 @@
|
|||
/* eslint arrow-parens: 0 */
|
||||
import React from 'react';
|
||||
import { enquireScreen } from 'enquire-js';
|
||||
|
||||
import Learnmore from "../LearnMore";
|
||||
import Content11 from './Content11';
|
||||
import Feature1 from './Feature1';
|
||||
import Nav3 from './Nav3';
|
||||
|
|
@ -82,12 +82,8 @@ export default class Page2 extends React.Component {
|
|||
dataSource={Feature12DataSource}
|
||||
isMobile={this.state.isMobile}
|
||||
/>,
|
||||
<Footer0
|
||||
id="Footer0_0"
|
||||
key="Footer0_0"
|
||||
dataSource={Footer00DataSource}
|
||||
isMobile={this.state.isMobile}
|
||||
/>,
|
||||
|
||||
<Learnmore />
|
||||
];
|
||||
return (
|
||||
<div
|
||||
|
|
|
|||
|
|
@ -0,0 +1,40 @@
|
|||
import React from 'react';
|
||||
import OverPack from 'rc-scroll-anim/lib/ScrollOverPack';
|
||||
import QueueAnim from 'rc-queue-anim';
|
||||
import TweenOne from 'rc-tween-one';
|
||||
import { Button } from 'antd';
|
||||
import { getChildrenToRender } from './utils';
|
||||
|
||||
class Content11 extends React.PureComponent {
|
||||
render() {
|
||||
const { ...props } = this.props;
|
||||
const { dataSource } = props;
|
||||
delete props.dataSource;
|
||||
delete props.isMobile;
|
||||
return (
|
||||
<OverPack {...props} {...dataSource.OverPack}>
|
||||
<QueueAnim
|
||||
type="bottom"
|
||||
leaveReverse
|
||||
key="page"
|
||||
delay={[0, 100]}
|
||||
{...dataSource.titleWrapper}
|
||||
>
|
||||
{dataSource.titleWrapper.children.map(getChildrenToRender)}
|
||||
</QueueAnim>
|
||||
<TweenOne
|
||||
key="button"
|
||||
style={{ textAlign: 'center' }}
|
||||
{...dataSource.button}
|
||||
animation={{ y: 30, opacity: 0, type: 'from', delay: 300 }}
|
||||
>
|
||||
<Button {...dataSource.button.children.a}>
|
||||
{dataSource.button.children.a.children}
|
||||
</Button>
|
||||
</TweenOne>
|
||||
</OverPack>
|
||||
);
|
||||
}
|
||||
}
|
||||
|
||||
export default Content11;
|
||||
|
|
@ -0,0 +1,41 @@
|
|||
import React from 'react';
|
||||
import OverPack from 'rc-scroll-anim/lib/ScrollOverPack';
|
||||
import QueueAnim from 'rc-queue-anim';
|
||||
import { Row, Col } from 'antd';
|
||||
|
||||
import { getChildrenToRender } from './utils';
|
||||
|
||||
function Feature7(props) {
|
||||
const { dataSource, isMobile, ...tagProps } = props;
|
||||
const { blockWrapper, titleWrapper } = dataSource;
|
||||
const childrenToRender = blockWrapper.children.map((item, i) => (
|
||||
<Col {...item} key={i.toString()}>
|
||||
<a {...item.children}>
|
||||
{item.children.children.map(getChildrenToRender)}
|
||||
</a>
|
||||
</Col>
|
||||
));
|
||||
return (
|
||||
<div {...tagProps} {...dataSource.wrapper}>
|
||||
<div {...dataSource.page}>
|
||||
<div {...dataSource.titleWrapper}>
|
||||
{titleWrapper.children.map(getChildrenToRender)}
|
||||
</div>
|
||||
<OverPack {...dataSource.OverPack}>
|
||||
<QueueAnim
|
||||
key="queue"
|
||||
type="bottom"
|
||||
leaveReverse
|
||||
interval={50}
|
||||
component={Row}
|
||||
{...blockWrapper}
|
||||
>
|
||||
{childrenToRender}
|
||||
</QueueAnim>
|
||||
</OverPack>
|
||||
</div>
|
||||
</div>
|
||||
);
|
||||
}
|
||||
|
||||
export default Feature7;
|
||||
|
|
@ -0,0 +1,71 @@
|
|||
import React from 'react';
|
||||
import OverPack from 'rc-scroll-anim/lib/ScrollOverPack';
|
||||
import QueueAnim from 'rc-queue-anim';
|
||||
import { Row, Col, Button } from 'antd';
|
||||
import { getChildrenToRender } from './utils';
|
||||
|
||||
class Pricing1 extends React.PureComponent {
|
||||
getChildrenToRender = (item) => {
|
||||
const {
|
||||
wrapper,
|
||||
topWrapper,
|
||||
name,
|
||||
buttonWrapper,
|
||||
line,
|
||||
content,
|
||||
money,
|
||||
} = item.children;
|
||||
return (
|
||||
<Col key={item.name} {...item}>
|
||||
<QueueAnim type="bottom" {...wrapper}>
|
||||
<div {...topWrapper}>
|
||||
<div {...name} key="name">
|
||||
{name.children}
|
||||
</div>
|
||||
<h1 {...money} key="money">
|
||||
{money.children}
|
||||
</h1>
|
||||
</div>
|
||||
<div {...content} key="content">
|
||||
{content.children}
|
||||
</div>
|
||||
<i {...line} key="line" />
|
||||
<div {...buttonWrapper} key="button">
|
||||
<Button {...buttonWrapper.children.a} />
|
||||
</div>
|
||||
</QueueAnim>
|
||||
</Col>
|
||||
);
|
||||
};
|
||||
|
||||
render() {
|
||||
const { ...props } = this.props;
|
||||
const { dataSource } = props;
|
||||
delete props.dataSource;
|
||||
delete props.isMobile;
|
||||
const { block } = dataSource;
|
||||
const childrenToRender = block.children.map(this.getChildrenToRender);
|
||||
return (
|
||||
<div {...props} {...dataSource.wrapper}>
|
||||
<div {...dataSource.page}>
|
||||
<div key="title" {...dataSource.titleWrapper}>
|
||||
{dataSource.titleWrapper.children.map(getChildrenToRender)}
|
||||
</div>
|
||||
<OverPack {...dataSource.OverPack}>
|
||||
<QueueAnim
|
||||
type="bottom"
|
||||
component={Row}
|
||||
leaveReverse
|
||||
ease={['easeOutQuad', 'easeInOutQuad']}
|
||||
key="content"
|
||||
>
|
||||
{childrenToRender}
|
||||
</QueueAnim>
|
||||
</OverPack>
|
||||
</div>
|
||||
</div>
|
||||
);
|
||||
}
|
||||
}
|
||||
|
||||
export default Pricing1;
|
||||
|
|
@ -0,0 +1,668 @@
|
|||
import React from 'react';
|
||||
export const Pricing10DataSource = {
|
||||
wrapper: { className: 'home-page-wrapper pricing1-wrapper' },
|
||||
page: { className: 'home-page pricing1' },
|
||||
OverPack: { playScale: 0.3, className: 'pricing1-content-wrapper' },
|
||||
titleWrapper: {
|
||||
className: 'pricing1-title-wrapper',
|
||||
children: [
|
||||
{
|
||||
name: 'title',
|
||||
children: (
|
||||
<>
|
||||
<p>协会规划</p>
|
||||
</>
|
||||
),
|
||||
className: 'pricing1-title-h1',
|
||||
},
|
||||
],
|
||||
},
|
||||
block: {
|
||||
className: 'pricing1-block-wrapper',
|
||||
children: [
|
||||
{
|
||||
name: 'block0',
|
||||
className: 'pricing1-block',
|
||||
md: 8,
|
||||
xs: 24,
|
||||
children: {
|
||||
wrapper: { className: 'pricing1-block-box ' },
|
||||
topWrapper: { className: 'pricing1-top-wrapper' },
|
||||
name: {
|
||||
className: 'pricing1-name',
|
||||
children: (
|
||||
<>
|
||||
<p>
|
||||
<br />
|
||||
</p>
|
||||
</>
|
||||
),
|
||||
},
|
||||
money: {
|
||||
className: 'pricing1-money k6niku34c3-editor_css',
|
||||
children: (
|
||||
<>
|
||||
<p>公益组织</p>
|
||||
</>
|
||||
),
|
||||
},
|
||||
content: {
|
||||
className: 'pricing1-content k6nimnp5as-editor_css',
|
||||
children:
|
||||
'E志者协会作为一个公益组织，着眼实际，立足于电脑电器维修；开拓创新，积极学习应用前沿知识；扎根实践，广泛开展校内外志愿服务活动。',
|
||||
},
|
||||
line: { className: 'pricing1-line' },
|
||||
buttonWrapper: {
|
||||
className: 'pricing1-button-wrapper',
|
||||
children: {
|
||||
a: {
|
||||
className: 'pricing1-button',
|
||||
href: '/#/ticket',
|
||||
children: (
|
||||
<>
|
||||
<p>从</p>
|
||||
</>
|
||||
),
|
||||
},
|
||||
},
|
||||
},
|
||||
},
|
||||
},
|
||||
{
|
||||
name: 'block~k6nil20ln5q',
|
||||
className: 'pricing1-block',
|
||||
md: 8,
|
||||
xs: 24,
|
||||
children: {
|
||||
wrapper: { className: 'pricing1-block-box ' },
|
||||
topWrapper: { className: 'pricing1-top-wrapper' },
|
||||
name: {
|
||||
className: 'pricing1-name',
|
||||
children: (
|
||||
<>
|
||||
<p>
|
||||
<br />
|
||||
</p>
|
||||
</>
|
||||
),
|
||||
},
|
||||
money: {
|
||||
className: 'pricing1-money k6ninis0ok-editor_css',
|
||||
children: (
|
||||
<>
|
||||
<p>校内校外</p>
|
||||
</>
|
||||
),
|
||||
},
|
||||
content: {
|
||||
className: 'pricing1-content k6niojh3hyf-editor_css',
|
||||
children:
|
||||
'E志者协会的公益之路渐行渐宽，从校内到校外，从服务师生到服务社会群众，从一个电器维修小组发展到如今如此规模的志愿者团队。',
|
||||
},
|
||||
line: { className: 'pricing1-line' },
|
||||
buttonWrapper: {
|
||||
className: 'pricing1-button-wrapper',
|
||||
children: {
|
||||
a: {
|
||||
className: 'pricing1-button',
|
||||
href: '/#/ticket',
|
||||
children: (
|
||||
<>
|
||||
<p>浙里</p>
|
||||
</>
|
||||
),
|
||||
},
|
||||
},
|
||||
},
|
||||
},
|
||||
},
|
||||
{
|
||||
name: 'block~k6nil2ir9',
|
||||
className: 'pricing1-block',
|
||||
md: 8,
|
||||
xs: 24,
|
||||
children: {
|
||||
wrapper: { className: 'pricing1-block-box ' },
|
||||
topWrapper: { className: 'pricing1-top-wrapper' },
|
||||
name: {
|
||||
className: 'pricing1-name',
|
||||
children: (
|
||||
<>
|
||||
<p>
|
||||
<br />
|
||||
</p>
|
||||
</>
|
||||
),
|
||||
},
|
||||
money: {
|
||||
className: 'pricing1-money k6nip1p7ezh-editor_css',
|
||||
children: (
|
||||
<>
|
||||
<p>初心不忘</p>
|
||||
</>
|
||||
),
|
||||
},
|
||||
content: {
|
||||
className: 'pricing1-content k6nipheaxuh-editor_css',
|
||||
children:
|
||||
'E志者协会不忘初心，在志愿服务精神的传承中开拓进取汲取课堂及课外前沿科学技术之精华，以服务社会为己任，传播先进公益文化为己负责',
|
||||
},
|
||||
line: { className: 'pricing1-line' },
|
||||
buttonWrapper: {
|
||||
className: 'pricing1-button-wrapper',
|
||||
children: {
|
||||
a: {
|
||||
className: 'pricing1-button',
|
||||
href: '/#/ticket',
|
||||
children: (
|
||||
<>
|
||||
<p>出发</p>
|
||||
</>
|
||||
),
|
||||
},
|
||||
},
|
||||
},
|
||||
},
|
||||
},
|
||||
],
|
||||
},
|
||||
};
|
||||
export const Feature70DataSource = {
|
||||
wrapper: { className: 'home-page-wrapper feature7-wrapper' },
|
||||
page: { className: 'home-page feature7' },
|
||||
OverPack: { playScale: 0.3 },
|
||||
titleWrapper: {
|
||||
className: 'feature7-title-wrapper',
|
||||
children: [
|
||||
{
|
||||
name: 'title',
|
||||
className: 'feature7-title-h1',
|
||||
children: (
|
||||
<>
|
||||
<p>
|
||||
协会荣誉<br />
|
||||
</p>
|
||||
</>
|
||||
),
|
||||
},
|
||||
{
|
||||
name: 'content',
|
||||
className: 'feature7-title-content',
|
||||
children: (
|
||||
<>
|
||||
<p>
|
||||
|
||||
|
||||
——仅摘取部分展示
|
||||
</p>
|
||||
</>
|
||||
),
|
||||
},
|
||||
],
|
||||
},
|
||||
blockWrapper: {
|
||||
className: 'feature7-block-wrapper',
|
||||
gutter: 24,
|
||||
children: [
|
||||
{
|
||||
md: 6,
|
||||
xs: 24,
|
||||
name: 'block1',
|
||||
className: 'feature7-block',
|
||||
children: {
|
||||
className: 'feature7-block-group k6nj0rhbyb-editor_css',
|
||||
children: [
|
||||
{
|
||||
name: 'title',
|
||||
className: 'feature7-block-title k6niz26grar-editor_css',
|
||||
children: (
|
||||
<>
|
||||
<p>
|
||||
2009年<br />
|
||||
</p>
|
||||
</>
|
||||
),
|
||||
},
|
||||
{
|
||||
name: 'content',
|
||||
className: 'feature7-block-content k6nj3s0akal-editor_css',
|
||||
children: (
|
||||
<>
|
||||
<p>
|
||||
协会获“<b>
|
||||
浙江省优秀志愿者服务队伍
|
||||
</b>”荣誉称号<br />
|
||||
</p>
|
||||
</>
|
||||
),
|
||||
},
|
||||
],
|
||||
},
|
||||
},
|
||||
{
|
||||
md: 6,
|
||||
xs: 24,
|
||||
name: 'block~k6nj6uobqcl',
|
||||
className: 'feature7-block',
|
||||
children: {
|
||||
className: 'feature7-block-group k6nj0rhbyb-editor_css',
|
||||
children: [
|
||||
{
|
||||
name: 'title',
|
||||
className: 'feature7-block-title k6niz26grar-editor_css',
|
||||
children: (
|
||||
<>
|
||||
<p>
|
||||
2009年<br />
|
||||
</p>
|
||||
</>
|
||||
),
|
||||
},
|
||||
{
|
||||
name: 'content',
|
||||
className: 'feature7-block-content k6nj3s0akal-editor_css',
|
||||
children: (
|
||||
<>
|
||||
<p>
|
||||
协会获“<b>浙江大学十大优秀志愿者服务集体</b>”荣誉称号<br />
|
||||
</p>
|
||||
</>
|
||||
),
|
||||
},
|
||||
],
|
||||
},
|
||||
},
|
||||
{
|
||||
md: 6,
|
||||
xs: 24,
|
||||
name: 'block~k6nj6vxuva',
|
||||
className: 'feature7-block',
|
||||
children: {
|
||||
className: 'feature7-block-group k6nj0rhbyb-editor_css',
|
||||
children: [
|
||||
{
|
||||
name: 'title',
|
||||
className: 'feature7-block-title k6niz26grar-editor_css',
|
||||
children: (
|
||||
<>
|
||||
<p>
|
||||
2009年<br />
|
||||
</p>
|
||||
</>
|
||||
),
|
||||
},
|
||||
{
|
||||
name: 'content',
|
||||
className: 'feature7-block-content k6nj3s0akal-editor_css',
|
||||
children: (
|
||||
<>
|
||||
<p>
|
||||
荣获“ <b>2009年度浙江大学优秀青年志愿者服务项目</b>”荣誉称号<br />
|
||||
</p>
|
||||
</>
|
||||
),
|
||||
},
|
||||
],
|
||||
},
|
||||
},
|
||||
{
|
||||
md: 6,
|
||||
xs: 24,
|
||||
name: 'block~k6nj6x1h1pp',
|
||||
className: 'feature7-block',
|
||||
children: {
|
||||
className: 'feature7-block-group k6nj0rhbyb-editor_css',
|
||||
children: [
|
||||
{
|
||||
name: 'title',
|
||||
className: 'feature7-block-title k6niz26grar-editor_css',
|
||||
children: (
|
||||
<>
|
||||
<p>
|
||||
2010年<br />
|
||||
</p>
|
||||
</>
|
||||
),
|
||||
},
|
||||
{
|
||||
name: 'content',
|
||||
className: 'feature7-block-content k6nj3s0akal-editor_css',
|
||||
children: (
|
||||
<>
|
||||
<p>
|
||||
协会由<b>一星级社团跃升为三星级社团</b>
|
||||
<br />
|
||||
</p>
|
||||
</>
|
||||
),
|
||||
},
|
||||
],
|
||||
},
|
||||
},
|
||||
{
|
||||
md: 6,
|
||||
xs: 24,
|
||||
name: 'block~k6nj6xikh3',
|
||||
className: 'feature7-block',
|
||||
children: {
|
||||
className: 'feature7-block-group k6nj0rhbyb-editor_css',
|
||||
children: [
|
||||
{
|
||||
name: 'title',
|
||||
className: 'feature7-block-title k6niz26grar-editor_css',
|
||||
children: (
|
||||
<>
|
||||
<p>2012年</p>
|
||||
</>
|
||||
),
|
||||
},
|
||||
{
|
||||
name: 'content',
|
||||
className: 'feature7-block-content k6nj3s0akal-editor_css',
|
||||
children: (
|
||||
<>
|
||||
<p>
|
||||
连续三年协会获评“<b>浙江大学学生十佳社团”</b>
|
||||
<br />
|
||||
</p>
|
||||
</>
|
||||
),
|
||||
},
|
||||
],
|
||||
},
|
||||
},
|
||||
{
|
||||
md: 6,
|
||||
xs: 24,
|
||||
name: 'block~k6nj6ycl25',
|
||||
className: 'feature7-block',
|
||||
children: {
|
||||
className: 'feature7-block-group k6nj0rhbyb-editor_css',
|
||||
children: [
|
||||
{
|
||||
name: 'title',
|
||||
className: 'feature7-block-title k6niz26grar-editor_css',
|
||||
children: (
|
||||
<>
|
||||
<p>
|
||||
2014年<br />
|
||||
</p>
|
||||
</>
|
||||
),
|
||||
},
|
||||
{
|
||||
name: 'content',
|
||||
className: 'feature7-block-content k6nj3s0akal-editor_css',
|
||||
children: (
|
||||
<>
|
||||
<p>
|
||||
协会荣升为浙江大学<b>四星级社团</b>
|
||||
<br />
|
||||
</p>
|
||||
</>
|
||||
),
|
||||
},
|
||||
],
|
||||
},
|
||||
},
|
||||
{
|
||||
md: 6,
|
||||
xs: 24,
|
||||
name: 'block~k6nj6z393nb',
|
||||
className: 'feature7-block',
|
||||
children: {
|
||||
className: 'feature7-block-group k6nj0rhbyb-editor_css',
|
||||
children: [
|
||||
{
|
||||
name: 'title',
|
||||
className: 'feature7-block-title k6niz26grar-editor_css',
|
||||
children: (
|
||||
<>
|
||||
<p>2015年</p>
|
||||
</>
|
||||
),
|
||||
},
|
||||
{
|
||||
name: 'content',
|
||||
className: 'feature7-block-content k6nj3s0akal-editor_css',
|
||||
children: (
|
||||
<>
|
||||
<p>
|
||||
协会入选<b>浙江大学最美公益服务集体</b>
|
||||
<br />
|
||||
</p>
|
||||
</>
|
||||
),
|
||||
},
|
||||
],
|
||||
},
|
||||
},
|
||||
{
|
||||
md: 6,
|
||||
xs: 24,
|
||||
name: 'block~k6nj70ilku',
|
||||
className: 'feature7-block',
|
||||
children: {
|
||||
className: 'feature7-block-group k6nj0rhbyb-editor_css',
|
||||
children: [
|
||||
{
|
||||
name: 'title',
|
||||
className: 'feature7-block-title k6niz26grar-editor_css',
|
||||
children: (
|
||||
<>
|
||||
<p>
|
||||
2015年<br />
|
||||
</p>
|
||||
</>
|
||||
),
|
||||
},
|
||||
{
|
||||
name: 'content',
|
||||
className: 'feature7-block-content k6nj3s0akal-editor_css',
|
||||
children: (
|
||||
<>
|
||||
<p>
|
||||
协会获<b>社团文化节精品活动二等奖</b>
|
||||
<br />
|
||||
</p>
|
||||
</>
|
||||
),
|
||||
},
|
||||
],
|
||||
},
|
||||
},
|
||||
{
|
||||
md: 6,
|
||||
xs: 24,
|
||||
name: 'block~k6nj716t4x',
|
||||
className: 'feature7-block',
|
||||
children: {
|
||||
className: 'feature7-block-group k6nj0rhbyb-editor_css',
|
||||
children: [
|
||||
{
|
||||
name: 'title',
|
||||
className: 'feature7-block-title k6niz26grar-editor_css',
|
||||
children: (
|
||||
<>
|
||||
<p>
|
||||
2015年<br />
|
||||
</p>
|
||||
</>
|
||||
),
|
||||
},
|
||||
{
|
||||
name: 'content',
|
||||
className: 'feature7-block-content k6nj3s0akal-editor_css',
|
||||
children: (
|
||||
<>
|
||||
<p>
|
||||
协会获<b>社团精品课程一等奖</b>
|
||||
<br />
|
||||
</p>
|
||||
<p>
|
||||
<b>
|
||||
<br />
|
||||
</b>
|
||||
</p>
|
||||
</>
|
||||
),
|
||||
},
|
||||
],
|
||||
},
|
||||
},
|
||||
{
|
||||
md: 6,
|
||||
xs: 24,
|
||||
name: 'block~k6nj71z66a',
|
||||
className: 'feature7-block',
|
||||
children: {
|
||||
className: 'feature7-block-group k6nj0rhbyb-editor_css',
|
||||
children: [
|
||||
{
|
||||
name: 'title',
|
||||
className: 'feature7-block-title k6niz26grar-editor_css',
|
||||
children: (
|
||||
<>
|
||||
<p>
|
||||
2015年<br />
|
||||
</p>
|
||||
</>
|
||||
),
|
||||
},
|
||||
{
|
||||
name: 'content',
|
||||
className: 'feature7-block-content k6nj3s0akal-editor_css',
|
||||
children: (
|
||||
<>
|
||||
<p>
|
||||
协会暑期社会实践入选为<b>校级重点社会实践项目</b>
|
||||
<br />
|
||||
</p>
|
||||
</>
|
||||
),
|
||||
},
|
||||
],
|
||||
},
|
||||
},
|
||||
{
|
||||
md: 6,
|
||||
xs: 24,
|
||||
name: 'block~k6nj72nvlx',
|
||||
className: 'feature7-block',
|
||||
children: {
|
||||
className: 'feature7-block-group k6nj0rhbyb-editor_css',
|
||||
children: [
|
||||
{
|
||||
name: 'title',
|
||||
className: 'feature7-block-title k6niz26grar-editor_css',
|
||||
children: (
|
||||
<>
|
||||
<p>
|
||||
2016年<br />
|
||||
</p>
|
||||
</>
|
||||
),
|
||||
},
|
||||
{
|
||||
name: 'content',
|
||||
className: 'feature7-block-content k6nj3s0akal-editor_css',
|
||||
children: (
|
||||
<>
|
||||
<p>
|
||||
<b>协会荣升为浙江大学五星级社团</b>
|
||||
<br />
|
||||
</p>
|
||||
</>
|
||||
),
|
||||
},
|
||||
],
|
||||
},
|
||||
},
|
||||
{
|
||||
md: 6,
|
||||
xs: 24,
|
||||
name: 'block~k6nj73ckswc',
|
||||
className: 'feature7-block',
|
||||
children: {
|
||||
className: 'feature7-block-group k6nj0rhbyb-editor_css',
|
||||
children: [
|
||||
{
|
||||
name: 'title',
|
||||
className: 'feature7-block-title k6niz26grar-editor_css',
|
||||
children: (
|
||||
<>
|
||||
<p>2016年</p>
|
||||
</>
|
||||
),
|
||||
},
|
||||
{
|
||||
name: 'content',
|
||||
className: 'feature7-block-content k6nj3s0akal-editor_css',
|
||||
children: (
|
||||
<>
|
||||
<p>
|
||||
协会荣获“ <b>2015年-2016年浙江大学学生示范性社团</b>”<br />
|
||||
</p>
|
||||
</>
|
||||
),
|
||||
},
|
||||
],
|
||||
},
|
||||
},
|
||||
],
|
||||
},
|
||||
};
|
||||
export const Content110DataSource = {
|
||||
OverPack: {
|
||||
className: 'home-page-wrapper content11-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: (
|
||||
<>
|
||||
<p>
|
||||
<br />
|
||||
</p>
|
||||
</>
|
||||
),
|
||||
className: 'title-h1',
|
||||
},
|
||||
{
|
||||
name: 'content',
|
||||
children: (
|
||||
<>
|
||||
<p>
|
||||
每年协会成员都有多人进入竺可桢学院工高班和爱迪生班等荣誉班级就读
|
||||
</p>
|
||||
</>
|
||||
),
|
||||
className: 'title-content k6njo4yb7gb-editor_css',
|
||||
},
|
||||
{
|
||||
name: 'content2',
|
||||
children: (
|
||||
<>
|
||||
<p>
|
||||
此外在”中控杯“、”大学生数学建模竞赛“、”电路板焊接大赛“中多人获得优异奖项
|
||||
</p>
|
||||
</>
|
||||
),
|
||||
className: 'title-content k6njr5kxpn-editor_css',
|
||||
},
|
||||
],
|
||||
},
|
||||
button: {
|
||||
className: '',
|
||||
children: { a: { className: 'button', href: '/#/ticket', children: '立即报名' } },
|
||||
},
|
||||
};
|
||||
|
|
@ -0,0 +1,4 @@
|
|||
# 如何使用：
|
||||
|
||||
- umi 里如何使用[请查看](https://landing.ant.design/docs/use/umi)。
|
||||
- 其它脚手架使用[请查看](https://landing.ant.design/docs/use/getting-started)。
|
||||
|
|
@ -0,0 +1,100 @@
|
|||
/* eslint no-undef: 0 */
|
||||
/* eslint arrow-parens: 0 */
|
||||
import React from 'react';
|
||||
import { enquireScreen } from 'enquire-js';
|
||||
import Nav3 from "../Home/Nav3";
|
||||
import Pricing1 from './Pricing1';
|
||||
import Feature7 from './Feature7';
|
||||
import Content11 from './Content11';
|
||||
import Footer0 from '../Home/Footer0';
|
||||
import {
|
||||
Pricing10DataSource,
|
||||
Feature70DataSource,
|
||||
Content110DataSource,
|
||||
} from './data.source';
|
||||
import './less/antMotionStyle.less';
|
||||
import '../Home/less/antMotionStyle.less';
|
||||
import {
|
||||
Nav30DataSource,
|
||||
|
||||
Footer00DataSource,
|
||||
|
||||
|
||||
} from '../Home/data.source';
|
||||
let isMobile;
|
||||
enquireScreen((b) => {
|
||||
isMobile = b;
|
||||
});
|
||||
|
||||
const { location } = window;
|
||||
|
||||
export default class Home extends React.Component {
|
||||
constructor(props) {
|
||||
super(props);
|
||||
this.state = {
|
||||
isMobile,
|
||||
show: !location.port, // 如果不是 dva 2.0 请删除
|
||||
};
|
||||
}
|
||||
|
||||
componentDidMount() {
|
||||
// 适配手机屏幕;
|
||||
enquireScreen((b) => {
|
||||
this.setState({ isMobile: !!b });
|
||||
});
|
||||
// dva 2.0 样式在组件渲染之后动态加载，导致滚动组件不生效；线上不影响；
|
||||
/* 如果不是 dva 2.0 请删除 start */
|
||||
if (location.port) {
|
||||
// 样式 build 时间在 200-300ms 之间;
|
||||
setTimeout(() => {
|
||||
this.setState({
|
||||
show: true,
|
||||
});
|
||||
}, 500);
|
||||
}
|
||||
/* 如果不是 dva 2.0 请删除 end */
|
||||
}
|
||||
|
||||
render() {
|
||||
|
||||
const children = [
|
||||
|
||||
<Pricing1
|
||||
id="Pricing1_0"
|
||||
key="Pricing1_0"
|
||||
dataSource={Pricing10DataSource}
|
||||
isMobile={this.state.isMobile}
|
||||
/>,
|
||||
<Feature7
|
||||
id="Feature7_0"
|
||||
key="Feature7_0"
|
||||
dataSource={Feature70DataSource}
|
||||
isMobile={this.state.isMobile}
|
||||
/>,
|
||||
<Content11
|
||||
id="Content11_0"
|
||||
key="Content11_0"
|
||||
dataSource={Content110DataSource}
|
||||
isMobile={this.state.isMobile}
|
||||
/>,
|
||||
<Footer0
|
||||
id="Footer0_0"
|
||||
key="Footer0_0"
|
||||
dataSource={Footer00DataSource}
|
||||
isMobile={this.state.isMobile}
|
||||
/>,
|
||||
];
|
||||
return (
|
||||
<div
|
||||
className="templates-wrapper"
|
||||
ref={(d) => {
|
||||
this.dom = d;
|
||||
}}
|
||||
>
|
||||
{/* 如果不是 dva 2.0 替换成 {children} start */}
|
||||
{this.state.show && children}
|
||||
{/* 如果不是 dva 2.0 替换成 {children} end */}
|
||||
</div>
|
||||
);
|
||||
}
|
||||
}
|
||||
|
|
@ -0,0 +1,7 @@
|
|||
@import './common.less';
|
||||
@import './custom.less';
|
||||
@import './content.less';
|
||||
@import './pricing1.less';
|
||||
@import './feature7.less';
|
||||
@import './content11.less';
|
||||
@import './edit.less';
|
||||
|
|
@ -0,0 +1,24 @@
|
|||
|
||||
@import "~antd/lib/style/v2-compatible-reset.less";
|
||||
|
||||
body {
|
||||
word-wrap: break-word;
|
||||
}
|
||||
|
||||
/* .content-wrapper > .tween-one-leaving,
|
||||
.queue-anim-leaving {
|
||||
// position: absolute !important;
|
||||
// width: 100%;
|
||||
} */
|
||||
|
||||
.video {
|
||||
max-width: 800px;
|
||||
}
|
||||
|
||||
#react-content {
|
||||
min-height: 100%;
|
||||
}
|
||||
.home-page-wrapper p {
|
||||
padding: 0;
|
||||
margin: 0;
|
||||
}
|
||||
|
|
@ -0,0 +1,44 @@
|
|||
@homepage: home-page;
|
||||
.@{homepage}-wrapper {
|
||||
width: 100%;
|
||||
position: relative;
|
||||
overflow: hidden;
|
||||
.@{homepage} {
|
||||
height: 100%;
|
||||
max-width: 1200px;
|
||||
position: relative;
|
||||
margin: auto;
|
||||
will-change: transform;
|
||||
}
|
||||
.title-wrapper > h1, > h1 {
|
||||
font-size: 32px;
|
||||
color: @text-color;
|
||||
margin-bottom: 16px;
|
||||
}
|
||||
.title-wrapper {
|
||||
margin: 0 auto 64px;
|
||||
text-align: center;
|
||||
}
|
||||
}
|
||||
|
||||
.@{homepage} {
|
||||
padding: 128px 24px;
|
||||
}
|
||||
|
||||
@media screen and (max-width: 767px) {
|
||||
.@{homepage}-wrapper {
|
||||
.@{homepage} {
|
||||
padding: 56px 24px;
|
||||
>h1 {
|
||||
font-size: 24px;
|
||||
margin: 0 auto 32px;
|
||||
&.title-h1 {
|
||||
margin-bottom: 8px;
|
||||
}
|
||||
}
|
||||
>p {
|
||||
margin-bottom: 32px;
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
|
|
@ -0,0 +1,46 @@
|
|||
@content11: content11;
|
||||
.@{content11}-wrapper {
|
||||
height: 480px;
|
||||
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-top: 96px;
|
||||
&.home-page-wrapper {
|
||||
.title-wrapper {
|
||||
margin-bottom: 32px;
|
||||
}
|
||||
}
|
||||
.button {
|
||||
box-shadow: 0 8px 16px #0554b7;
|
||||
background: linear-gradient(to right, #05cbff, #1e5aff) !important;
|
||||
height: 42px;
|
||||
line-height: 42px;
|
||||
font-size: 14px;
|
||||
border: 0;
|
||||
border-radius: 21px;
|
||||
color: #fff;
|
||||
width: 128px;
|
||||
padding: 0 15px;
|
||||
display: inline-block;
|
||||
transition: transform .3s, box-shadow .3s;
|
||||
&:hover {
|
||||
transform: translateY(-4px);
|
||||
box-shadow: 0 12px 20px #0554b7;
|
||||
}
|
||||
&:active {
|
||||
transform: translateY(4px);
|
||||
box-shadow: 0 4px 8px #0554b7;
|
||||
}
|
||||
}
|
||||
.title-content {
|
||||
line-height: 32px;
|
||||
}
|
||||
}
|
||||
|
||||
@media screen and (max-width: 767px) {
|
||||
.@{content11}-wrapper {
|
||||
padding-bottom: 0;
|
||||
}
|
||||
}
|
||||
|
|
@ -0,0 +1,35 @@
|
|||
@import "~antd/lib/style/themes/default.less";
|
||||
|
||||
@line-color: #e9e9e9;
|
||||
|
||||
@shadow-color: rgba(0, 0, 0, 0.15);
|
||||
|
||||
@bottom-bar-bg-color: #262626;
|
||||
@bottom-bar-line-color: #000;
|
||||
|
||||
@template-bg-color: #001529;
|
||||
@template-bg-color-light: #ececec;
|
||||
@template-nav-bg-color: #001529;
|
||||
@template-text-color: #ccc;
|
||||
@template-text-title-color: #bcbcbc;
|
||||
@template-text-color-light: #fff;
|
||||
@template-footer-text-color: #999;
|
||||
|
||||
@animate-duration: .45s;
|
||||
|
||||
/* 详细页图片或框框的样式;
|
||||
*/
|
||||
.page-shadow() {
|
||||
box-shadow: 0 5px 8px @shadow-color;
|
||||
}
|
||||
|
||||
.page-pro() {
|
||||
border-radius: 6px;
|
||||
border: 1px solid @line-color;
|
||||
transform: translateY(0);
|
||||
transition: transform .3s @ease-out, box-shadow .3s @ease-out;
|
||||
&:hover {
|
||||
.page-shadow();
|
||||
transform: translateY(-5px);
|
||||
}
|
||||
}
|
||||
|
|
@ -0,0 +1,50 @@
|
|||
#Pricing1_0
|
||||
.pricing1-block-box
|
||||
> .pricing1-top-wrapper
|
||||
> .k6niku34c3-editor_css {
|
||||
font-size: 28px;
|
||||
}
|
||||
#Pricing1_0 .ant-col > .pricing1-block-box > .k6nimnp5as-editor_css {
|
||||
font-size: 16px;
|
||||
}
|
||||
#Pricing1_0
|
||||
.pricing1-block-box
|
||||
> .pricing1-top-wrapper
|
||||
> .k6ninis0ok-editor_css {
|
||||
font-size: 28px;
|
||||
}
|
||||
#Pricing1_0 .ant-col > .pricing1-block-box > .k6niojh3hyf-editor_css {
|
||||
font-size: 16px;
|
||||
}
|
||||
#Pricing1_0
|
||||
.pricing1-block-box
|
||||
> .pricing1-top-wrapper
|
||||
> .k6nip1p7ezh-editor_css {
|
||||
font-size: 28px;
|
||||
}
|
||||
#Pricing1_0 .ant-col > .pricing1-block-box > .k6nipheaxuh-editor_css {
|
||||
font-size: 16px;
|
||||
}
|
||||
#Feature7_0 .ant-col > .feature7-block-group > .k6niz1ixc6-editor_css {
|
||||
width: 0%;
|
||||
}
|
||||
#Feature7_0 .ant-col > .feature7-block-group > .k6nj0lolnf-editor_css {
|
||||
display: none;
|
||||
}
|
||||
#Feature7_0 .ant-row > .ant-col > .k6nj0rhbyb-editor_css {
|
||||
text-align: center;
|
||||
}
|
||||
#Feature7_0 .ant-col > .feature7-block-group > .k6niz26grar-editor_css {
|
||||
width: 50px;
|
||||
margin: 0px 0px 16px 90px;
|
||||
}
|
||||
#Feature7_0 .ant-col > .feature7-block-group > .k6nj3s0akal-editor_css {
|
||||
font-size: 16px;
|
||||
}
|
||||
#Content11_0 .title-wrapper > .k6njo4yb7gb-editor_css {
|
||||
font-size: 16px;
|
||||
}
|
||||
#Content11_0 .title-wrapper > .k6njr5kxpn-editor_css {
|
||||
font-size: 16px;
|
||||
height: 100px;
|
||||
}
|
||||
|
|
@ -0,0 +1,81 @@
|
|||
@feature7: feature7;
|
||||
|
||||
.@{feature7} {
|
||||
&-wrapper {
|
||||
min-height: 564px;
|
||||
margin: 0 auto;
|
||||
overflow: hidden;
|
||||
background-color: #f7f9fc;
|
||||
|
||||
&.home-page-wrapper {
|
||||
.home-page {
|
||||
padding: 64px 24px;
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
&-title {
|
||||
|
||||
&-wrapper {
|
||||
text-align: center;
|
||||
margin-bottom: 40px;
|
||||
}
|
||||
|
||||
&-h1 {
|
||||
font-size: 32px;
|
||||
color: @text-color;
|
||||
}
|
||||
|
||||
&-content {
|
||||
margin-top: 16px;
|
||||
}
|
||||
}
|
||||
|
||||
&-block {
|
||||
margin-top: 28px;
|
||||
|
||||
&-group {
|
||||
display: block;
|
||||
padding: 28px 24px;
|
||||
box-shadow: 0 2px 16px fade(#000, 8);
|
||||
background-image: url('https://gw.alipayobjects.com/mdn/rms_ae7ad9/afts/img/A*fMOFSpRXMxsAAAAAAAAAAABkARQnAQ');
|
||||
background-repeat: no-repeat;
|
||||
background-position: 100% 100%;
|
||||
transition: box-shadow @animate-duration @ease-in-out, transform @animate-duration @ease-in-out;
|
||||
|
||||
&:hover {
|
||||
transform: translateY(-5px);
|
||||
box-shadow: 0 6px 16px fade(#000, 12);
|
||||
}
|
||||
}
|
||||
|
||||
&-image {
|
||||
float: left;
|
||||
width: 24px;
|
||||
}
|
||||
|
||||
&-title {
|
||||
font-size: 14px;
|
||||
float: left;
|
||||
margin-left: 8px;
|
||||
margin-bottom: 16px;
|
||||
color: @text-color;
|
||||
}
|
||||
|
||||
&-content {
|
||||
clear: both;
|
||||
color: fade(@text-color, 75);
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
@media screen and (max-width: 767px) {
|
||||
.@{feature7}-wrapper {
|
||||
min-height: 1540px;
|
||||
&.home-page-wrapper {
|
||||
.home-page {
|
||||
padding: 56px 24px;
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
|
|
@ -0,0 +1,85 @@
|
|||
@pricing1: pricing1;
|
||||
.@{pricing1}-wrapper {
|
||||
min-height: 760px;
|
||||
.@{pricing1} {
|
||||
>p {
|
||||
text-align: center;
|
||||
}
|
||||
&-content-wrapper {
|
||||
min-height: 400px;
|
||||
}
|
||||
&-block-box {
|
||||
width: 260px;
|
||||
border-radius: 4px;
|
||||
background: #eef0f3;
|
||||
text-align: center;
|
||||
color: #666;
|
||||
min-height: 400px;
|
||||
margin: auto;
|
||||
border: 1px solid transparent;
|
||||
.page-pro();
|
||||
&.active {
|
||||
border-color: @primary-color;
|
||||
background: #fff;
|
||||
.@{pricing1} {
|
||||
&-top-wrapper {
|
||||
background: @primary-color;
|
||||
}
|
||||
&-name,
|
||||
&-money,
|
||||
&-button {
|
||||
color: #fff;
|
||||
}
|
||||
&-button {
|
||||
background: @primary-color;
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
&-block {
|
||||
margin-bottom: 24px;
|
||||
}
|
||||
&-top-wrapper {
|
||||
width: 100%;
|
||||
padding: 16px 24px;
|
||||
}
|
||||
&-name {
|
||||
font-size: 14px;
|
||||
}
|
||||
&-money {
|
||||
font-family: 'Helvetica Neue', sans-serif;
|
||||
font-size: 32px;
|
||||
color: #666;
|
||||
}
|
||||
&-content {
|
||||
font-size: 12px;
|
||||
line-height: 2;
|
||||
font-weight: 300;
|
||||
margin: 32px 24px 48px;
|
||||
}
|
||||
&-line {
|
||||
display: block;
|
||||
height: 1px;
|
||||
background: #d9d9d9;
|
||||
margin: 0 24px;
|
||||
}
|
||||
&-button-wrapper {
|
||||
margin: 18px 24px;
|
||||
}
|
||||
&-button {
|
||||
padding: 0 24px;
|
||||
}
|
||||
}
|
||||
&.home-page-wrapper {
|
||||
.@{pricing1}-title-wrapper {
|
||||
margin-bottom: 64px;
|
||||
text-align: center;
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
@media screen and (max-width: 767px) {
|
||||
.@{pricing1}-wrapper {
|
||||
padding-bottom: 0;
|
||||
}
|
||||
}
|
||||
|
|
@ -0,0 +1,25 @@
|
|||
|
||||
import React from 'react';
|
||||
import { Button } from 'antd';
|
||||
|
||||
export const isImg = /^http(s)?:\/\/([\w-]+\.)+[\w-]+(\/[\w-./?%&=]*)?/;
|
||||
export const getChildrenToRender = (item, i) => {
|
||||
let tag = item.name.indexOf('title') === 0 ? 'h1' : 'div';
|
||||
let children;
|
||||
switch (item.name) {
|
||||
case 'image':
|
||||
children = React.createElement('img', { src: item.children, alt: 'img' });
|
||||
break;
|
||||
case 'a':
|
||||
children = React.createElement('a', { href: item.href }, [item.children]);
|
||||
break;
|
||||
default:
|
||||
children = item.children;
|
||||
}
|
||||
if (item.name.indexOf('button') === 0 && typeof item.children === 'object') {
|
||||
children = React.createElement(Button, {
|
||||
...item.children
|
||||
});
|
||||
}
|
||||
return React.createElement(tag, { key: i.toString(), ...item }, children);
|
||||
};
|
||||
Loading…
Reference in New Issue