diff --git a/src/App.js b/src/App.js index d3cb936..d21eb53 100644 --- a/src/App.js +++ b/src/App.js @@ -1,30 +1,46 @@ -import React from "react"; +import React, { Component } from 'react'; + import { HashRouter, Route, Switch, Link } from "react-router-dom"; -import LearnMore from "./components/LearnMore"; -import History from "./components/History"; -import Entry from "./"; -import Main from "./components/Main"; +import { enquireScreen } from 'enquire-js'; +import LearnMore from "./LearnMore"; +import Home from './Home/main'; +import Page2 from "./Home/history"; + + +import Entry from "./Entry"; import Login from "./components/Login"; -function App() { - return ( -
-
-
- - - - - - - - - -
+let isMobile; +enquireScreen((b) => { + isMobile = b; +}); - -
+class App extends Component { + constructor(props) { + super(props); + this.state = { + isMobile, + }; + } + componentDidMount() { + enquireScreen((b) => { + this.setState({ isMobile: !!b }); + }); + } + render() { + return (
+ + + + + + + + +
- ); + + ); + } } export default App; diff --git a/src/Entry.js b/src/Entry.js index 6f0388b..b9a999b 100644 --- a/src/Entry.js +++ b/src/Entry.js @@ -1,27 +1,27 @@ import React from 'react'; -import Sheet from './Component/Sheet'; -import { Upload, Button, Icon,BackTop } from 'antd'; +import Sheet from './components/Sheet'; +import { Upload, Button, Icon, BackTop } from 'antd'; function Entry() { return ( -
-

- 浙江大学学生E志者协会2020年纳新报名表 +
+

+ 浙江大学学生E志者协会2020年纳新报名表

-
- - - -
- - -

- 浙江大学学生E志者协会©2020 Created by EVATech + + + + +

+ 浙江大学学生E志者协会©2020 Created by EVATech

- + ) } diff --git a/src/Home/Banner3.jsx b/src/Home/Banner3.jsx new file mode 100644 index 0000000..53e2af0 --- /dev/null +++ b/src/Home/Banner3.jsx @@ -0,0 +1,47 @@ +import React from 'react'; +import { Button } from 'antd'; +import QueueAnim from 'rc-queue-anim'; +import Texty from 'rc-texty'; +import 'rc-texty/assets/index.css'; + +class Banner extends React.PureComponent { + render() { + const { ...currentProps } = this.props; + const { dataSource } = currentProps; + delete currentProps.dataSource; + delete currentProps.isMobile; + const children = dataSource.textWrapper.children.map((item) => { + const { name, texty, ...$item } = item; + if (name.match('button')) { + return ( + + ); + } + + return ( +
+ {texty ? ( + {item.children} + ) : ( + item.children + )} +
+ ); + }); + return ( +
+ + {children} + +
+ ); + } +} +export default Banner; diff --git a/src/Home/Content11.jsx b/src/Home/Content11.jsx new file mode 100644 index 0000000..fd44471 --- /dev/null +++ b/src/Home/Content11.jsx @@ -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 ( + + + {dataSource.titleWrapper.children.map(getChildrenToRender)} + + + + + + ); + } +} + +export default Content11; diff --git a/src/Home/Content3.jsx b/src/Home/Content3.jsx new file mode 100644 index 0000000..49fe071 --- /dev/null +++ b/src/Home/Content3.jsx @@ -0,0 +1,94 @@ +import React from 'react'; +import QueueAnim from 'rc-queue-anim'; +import TweenOne from 'rc-tween-one'; +import { Row, Col } from 'antd'; +import OverPack from 'rc-scroll-anim/lib/ScrollOverPack'; +import { getChildrenToRender } from './utils'; + +class Content3 extends React.PureComponent { + getDelay = (e, b) => (e % b) * 100 + Math.floor(e / b) * 100 + b * 100; + + render() { + const { ...props } = this.props; + const { dataSource, isMobile } = props; + delete props.dataSource; + delete props.isMobile; + let clearFloatNum = 0; + const children = dataSource.block.children.map((item, i) => { + const childObj = item.children; + const delay = isMobile ? i * 50 : this.getDelay(i, 24 / item.md); + const liAnim = { + opacity: 0, + type: 'from', + ease: 'easeOutQuad', + delay, + }; + const childrenAnim = { ...liAnim, x: '+=10', delay: delay + 100 }; + clearFloatNum += item.md; + clearFloatNum = clearFloatNum > 24 ? 0 : clearFloatNum; + return ( + + + img + +
+ + {childObj.title.children} + + + {childObj.content.children} + +
+ + ); + }); + return ( +
+
+
+ {dataSource.titleWrapper.children.map(getChildrenToRender)} +
+ + + + {children} + + + +
+
+ ); + } +} + +export default Content3; diff --git a/src/Home/Content5.jsx b/src/Home/Content5.jsx new file mode 100644 index 0000000..bc717be --- /dev/null +++ b/src/Home/Content5.jsx @@ -0,0 +1,61 @@ +import React from 'react'; +import { Row, Col } from 'antd'; +import { TweenOneGroup } from 'rc-tween-one'; +import OverPack from 'rc-scroll-anim/lib/ScrollOverPack'; +import { getChildrenToRender } from './utils'; + +class Content5 extends React.PureComponent { + getChildrenToRender = (data) => + data.map((item) => { + return ( + +
+ + img + +

{item.children.content.children}

+
+ + ); + }); + + render() { + const { ...props } = this.props; + const { dataSource } = props; + delete props.dataSource; + delete props.isMobile; + const childrenToRender = this.getChildrenToRender( + dataSource.block.children + ); + return ( +
+
+
+ {dataSource.titleWrapper.children.map(getChildrenToRender)} +
+ + + {childrenToRender} + + +
+
+ ); + } +} + +export default Content5; diff --git a/src/Home/Content9.jsx b/src/Home/Content9.jsx new file mode 100644 index 0000000..1804863 --- /dev/null +++ b/src/Home/Content9.jsx @@ -0,0 +1,79 @@ +import React from 'react'; +import OverPack from 'rc-scroll-anim/lib/ScrollOverPack'; +import QueueAnim from 'rc-queue-anim'; +import { getChildrenToRender } from './utils'; + +class Content9 extends React.PureComponent { + getBlockChildren = (block, i) => { + const { isMobile } = this.props; + const item = block.children; + const textWrapper = ( + +
+ {item.time.children} +
+

+ + img + + {item.title.children} +

+
+ {item.content.children} +
+ + ); + return ( + + {isMobile && textWrapper} + +
+ img +
+
+
+ {item.name.children} +
+
+ {item.post.children} +
+
+ + + {!isMobile && textWrapper} + + ); + }; + + render() { + const { ...props } = this.props; + const { dataSource } = props; + delete props.dataSource; + delete props.isMobile; + const children = dataSource.block.children.map(this.getBlockChildren); + return ( +
+
+
+ {dataSource.titleWrapper.children.map(getChildrenToRender)} +
+
{children}
+
+
+ ); + } +} + +export default Content9; diff --git a/src/Home/Feature1.jsx b/src/Home/Feature1.jsx new file mode 100644 index 0000000..66e6425 --- /dev/null +++ b/src/Home/Feature1.jsx @@ -0,0 +1,70 @@ +import React from 'react'; +import QueueAnim from 'rc-queue-anim'; +import TweenOne from 'rc-tween-one'; +import { Row, Col } from 'antd'; +import OverPack from 'rc-scroll-anim/lib/ScrollOverPack'; + +function Content1(props) { + const { ...tagProps } = props; + const { dataSource, isMobile } = tagProps; + delete tagProps.dataSource; + delete tagProps.isMobile; + const animType = { + queue: isMobile ? 'bottom' : 'right', + one: isMobile + ? { + scaleY: '+=0.3', + opacity: 0, + type: 'from', + ease: 'easeOutQuad', + } + : { + x: '-=30', + opacity: 0, + type: 'from', + ease: 'easeOutQuad', + }, + }; + return ( +
+ + + + img + + + +

+ {dataSource.title.children} +

+
+ {dataSource.content.children} +
+ + +
+ ); +} + +export default Content1; diff --git a/src/Home/Feature2.jsx b/src/Home/Feature2.jsx new file mode 100644 index 0000000..07e9272 --- /dev/null +++ b/src/Home/Feature2.jsx @@ -0,0 +1,74 @@ +import React from 'react'; +import QueueAnim from 'rc-queue-anim'; +import TweenOne from 'rc-tween-one'; +import { Row, Col } from 'antd'; +import OverPack from 'rc-scroll-anim/lib/ScrollOverPack'; + +function Content2(props) { + const { ...tagProps } = props; + const { dataSource, isMobile } = tagProps; + delete tagProps.dataSource; + delete tagProps.isMobile; + const animType = { + queue: isMobile ? 'bottom' : 'left', + one: isMobile + ? { + scaleY: '+=0.3', + opacity: 0, + type: 'from', + ease: 'easeOutQuad', + } + : { + x: '+=30', + opacity: 0, + type: 'from', + ease: 'easeOutQuad', + }, + }; + const img = ( + + + img + + + ); + return ( +
+ + {isMobile && img} + +

+ {dataSource.title.children} +

+
+ {dataSource.content.children} +
+ + {!isMobile && img} + +
+ ); +} + +export default Content2; diff --git a/src/Home/Feature6.jsx b/src/Home/Feature6.jsx new file mode 100644 index 0000000..1a19105 --- /dev/null +++ b/src/Home/Feature6.jsx @@ -0,0 +1,156 @@ +import React from 'react'; +import OverPack from 'rc-scroll-anim/lib/ScrollOverPack'; +import QueueAnim from 'rc-queue-anim'; +import { Carousel as AntCarousel, Row, Col } from 'antd'; +import TweenOne from 'rc-tween-one'; +import Children from 'rc-tween-one/lib/plugin/ChildrenPlugin'; + +TweenOne.plugins.push(Children); + +class Feature6 extends React.PureComponent { + constructor(props) { + super(props); + this.carouselRef = React.createRef(); + this.state = { + current: 0, + }; + } + + onTitleClick = (_, i) => { + const carouselRef = this.carouselRef.current.childRefs.carousel; + carouselRef.goTo(i); + }; + + onBeforeChange = (_, newIndex) => { + this.setState({ + current: newIndex, + }); + }; + + getChildrenToRender = (dataSource) => { + const { current } = this.state; + const { Carousel } = dataSource; + const { + titleWrapper, + children: childWrapper, + wrapper, + ...carouselProps + } = Carousel; + + const { + barWrapper, + title: titleChild, + ...titleWrapperProps + } = titleWrapper; + const titleToRender = []; + + const childrenToRender = childWrapper.map((item, ii) => { + const { title, children, ...itemProps } = item; + titleToRender.push( +
{ + this.onTitleClick(e, ii); + }} + className={ + ii === current ? `${title.className || ''} active` : title.className + } + > + {title.children} +
+ ); + const childrenItem = children.map(($item, i) => { + const { number, children: child, ...childProps } = $item; + const numberChild = number.children.replace(/[^0-9.-]/g, ''); + const { unit, toText, ...numberProps } = number; + return ( + + + 0 + ? 2 + : 0, + formatMoney: true, + }, + duration: 1000, + delay: 300, + ease: 'easeInOutCirc', + }} + component="span" + > + 0 + + {unit && {unit.children}} +

{child.children}

+ + ); + }); + return ( + + {childrenItem} + + ); + }); + + const width = 100 / childrenToRender.length; + return ( + +
+
+ {titleToRender} +
+ +
+
+
+ + {childrenToRender} + + + ); + }; + + render() { + const { dataSource, isMobile, ...props } = this.props; + return ( +
+
+ + {this.getChildrenToRender(dataSource)} + +
+
+ ); + } +} +export default Feature6; diff --git a/src/Home/Feature8.jsx b/src/Home/Feature8.jsx new file mode 100644 index 0000000..1b2ead6 --- /dev/null +++ b/src/Home/Feature8.jsx @@ -0,0 +1,139 @@ +import React from 'react'; +import OverPack from 'rc-scroll-anim/lib/ScrollOverPack'; +import QueueAnim from 'rc-queue-anim'; +import { Carousel as AntCarousel, Row, Col } from 'antd'; +import { getChildrenToRender } from './utils'; + +class Feature8 extends React.PureComponent { + constructor(props) { + super(props); + this.carouselRef = React.createRef(); + this.state = { + current: 0, + }; + } + + onTitleClick = (_, i) => { + const carouselRef = this.carouselRef.current.childRefs.carousel; + carouselRef.goTo(i); + }; + + onBeforeChange = (_, newIndex) => { + this.setState({ + current: newIndex, + }); + }; + + getChildrenToRender = (dataSource) => { + const { current } = this.state; + const { Carousel, childWrapper: buttonWrapper } = dataSource; + const { children: carouselChild, wrapper, ...carouselProps } = Carousel; + const { + titleWrapper, + children: childWrapper, + ...childrenProps + } = carouselChild; + + const { + barWrapper, + title: titleChild, + ...titleWrapperProps + } = titleWrapper; + const titleToRender = []; + + const childrenToRender = childWrapper.map((item, ii) => { + const { title, children: childRow, ...rowProps } = item; + if (childWrapper.length > 1) { + titleToRender.push( +
{ + this.onTitleClick(e, ii); + }} + className={ + ii === current + ? `${title.className || ''} active` + : title.className + } + > + {title.children} +
+ ); + } + const childrenItem = childRow.map(($item, i) => { + const { children: colChild, arrow, ...colProps } = $item; + const { ...childProps } = colChild; + return ( + +
+ {colChild.children.map(getChildrenToRender)} +
+ {arrow && ( +
+ img +
+ )} + + ); + }); + + return ( +
+ + {childrenItem} + +
+ ); + }); + + return ( + + {childWrapper.length > 1 && ( +
+
{titleToRender}
+
+ )} + + {childrenToRender} + +
+ {buttonWrapper.children.map(getChildrenToRender)} +
+ + ); + }; + + render() { + const { dataSource, isMobile, ...props } = this.props; + const { titleWrapper } = dataSource; + return ( +
+
+
+ {titleWrapper.children.map(getChildrenToRender)} +
+ + {this.getChildrenToRender(dataSource)} + +
+
+ ); + } +} +export default Feature8; diff --git a/src/Home/Footer0.jsx b/src/Home/Footer0.jsx new file mode 100644 index 0000000..f974e33 --- /dev/null +++ b/src/Home/Footer0.jsx @@ -0,0 +1,27 @@ +import React from 'react'; +import TweenOne from 'rc-tween-one'; +import OverPack from 'rc-scroll-anim/lib/ScrollOverPack'; + +class Footer extends React.PureComponent { + render() { + const { ...props } = this.props; + const { dataSource } = props; + delete props.dataSource; + delete props.isMobile; + return ( +
+ + + {dataSource.copyright.children} + + +
+ ); + } +} + +export default Footer; diff --git a/src/Home/Nav3.jsx b/src/Home/Nav3.jsx new file mode 100644 index 0000000..b4f33c4 --- /dev/null +++ b/src/Home/Nav3.jsx @@ -0,0 +1,136 @@ +import React from 'react'; +import TweenOne from 'rc-tween-one'; +import { Menu } from 'antd'; +import { getChildrenToRender } from './utils'; + +const { Item, SubMenu } = Menu; + +class Header3 extends React.Component { + constructor(props) { + super(props); + this.state = { + phoneOpen: undefined, + }; + } + + phoneClick = () => { + const phoneOpen = !this.state.phoneOpen; + this.setState({ + phoneOpen, + }); + }; + + render() { + const { dataSource, isMobile, ...props } = this.props; + const { phoneOpen } = this.state; + const navData = dataSource.Menu.children; + const navChildren = navData.map((item) => { + const { children: a, subItem, ...itemProps } = item; + if (subItem) { + return ( + + {a.children.map(getChildrenToRender)} +
+ } + popupClassName="header3-item-child" + > + {subItem.map(($item, ii) => { + const { children: childItem } = $item; + const child = childItem.href ? ( + + {childItem.children.map(getChildrenToRender)} + + ) : ( +
+ {childItem.children.map(getChildrenToRender)} +
+ ); + return ( + + {child} + + ); + })} + + ); + } + return ( + + + {a.children.map(getChildrenToRender)} + + + ); + }); + const moment = phoneOpen === undefined ? 300 : null; + return ( + +
+ + img + + {isMobile && ( +
{ + this.phoneClick(); + }} + > + + + +
+ )} + { + if (this.state.phoneOpen) { + e.target.style.height = 'auto'; + } + }, + ease: 'easeInOutQuad', + } + : null + } + moment={moment} + reverse={!!phoneOpen} + > + + {navChildren} + + +
+ + ); + } +} + +export default Header3; diff --git a/src/Home/Point.jsx b/src/Home/Point.jsx new file mode 100644 index 0000000..1daf619 --- /dev/null +++ b/src/Home/Point.jsx @@ -0,0 +1,37 @@ +import React from 'react'; +import Link from 'rc-scroll-anim/lib/ScrollLink'; + +export default function Point(props) { + const { data, size, position, type, stroke } = props; + const children = data.map((item) => { + if (item.match('nav') || item.match('footer')) { + return null; + } + const className = `point ${type} ${stroke} ${size}`.trim(); + return ( + + ); + }).filter((item) => item); + const wrapperClass = `point-wrapper ${position} ${size}`.trim(); + return ( +
+
+ {children} +
+
+ ); +} + +Point.defaultProps = { + size: '', + position: '', + type: '', + stroke: '', +}; diff --git a/src/Home/data.source.js b/src/Home/data.source.js index 365ba36..b8f058e 100644 --- a/src/Home/data.source.js +++ b/src/Home/data.source.js @@ -1,4 +1,1405 @@ import React from 'react'; +import history from "../picture/history.jpg"; +import back1 from "../picture/back1.jpg"; +import xueyuan1 from "../picture/xueyuan1.jpg"; +import shequ1 from "../picture/shequ1.jpg"; +import richang1 from "../picture/richang1.jpg"; +import richang2 from "../picture/richang2.jpg"; +import jingpin1 from "../picture/jingpin1.jpg"; +import xueshengjie1 from "../picture/xueshengjie1.jpg"; +import luntan1 from "../picture/luntan1.jpg"; +import background from "../picture/background.jpg"; +export const Nav30DataSource = { + wrapper: { className: 'header3 home-page-wrapper' }, + page: { className: 'home-page' }, + logo: { + className: 'header3-logo', + children: background + , + }, + Menu: { + className: 'header3-menu', + children: [ + { + name: 'item1', + className: 'header3-item', + children: { + href: '/#/learnmore', + children: [{ children: '了解更多 ', name: 'text' }], + }, + }, + { + name: 'item2', + className: 'header3-item', + children: { + href: '/#/history', + children: [ + { + children: ( + <> + + + ), + name: 'text', + }, + { + name: 'content~k6byeg17g6u', + className: '', + children: '协会历史 ', + }, + ], + }, + }, + { + name: 'item~k6byeb33em', + className: 'header3-item', + children: { + href: '/#/ticket', + children: [ + { + children: ( + <> +
报名链接
+ + ), + name: 'text', + }, + ], + }, + }, + { + name: 'item~k6byhi1zqeh', + className: 'header3-item', + children: { + href: '/#/login', + children: [{ children: '登陆 ', name: 'text' }], + }, + }, + ], + }, + mobileMenu: { className: 'header3-mobile-menu' }, +}; +export const Banner31DataSource = { + wrapper: { className: 'banner3' }, + textWrapper: { + className: 'banner3-text-wrapper k6bxcwa6wb-editor_css', + children: [ + { + name: 'nameEn', + className: 'banner3-name-en', + children: ( + <> +

+ {' '} + Electrical Volunteer Association of ZJU +

+ + ), + }, + { + name: 'slogan', + className: 'banner3-slogan k6bx9bxsgw-editor_css', + children: '浙江大学学生E志者协会', + texty: true, + }, + { + name: 'name', + className: 'banner3-name k6bx9qqmas-editor_css', + children: ( + <> +

E我志者，？我人生

+ + ), + }, + { + name: 'button', + className: 'banner3-button ant-btn k6bxcnb8hlg-editor_css', + href: '/#/ticket', + children: ( + <> +
加入我们
+ + ), + }, + { + name: 'time~k6bxdqq7sz', + className: 'banner3-time', + children: ( + <> + + 2020秋季纳新/中国·杭州 + + + ), + }, + ], + }, +}; +export const Feature20DataSource = { + wrapper: { className: 'home-page-wrapper content2-wrapper' }, + OverPack: { className: 'home-page content2', playScale: 0.3 }, + imgWrapper: { className: 'content2-img', md: 10, xs: 24 }, + img: { + children: 'https://zos.alipayobjects.com/rmsportal/tvQTfCupGUFKSfQ.png', + }, + textWrapper: { className: 'content2-text', md: 14, xs: 24 }, + title: { + className: 'content2-title k6bz79j5xeo-editor_css', + children: '五星级社团 ', + }, + content: { + className: 'content2-content k6bzcb3z43g-editor_css', + children: ( + <> +

+      + 协会历史最早可追溯到1984年，前身为陈强先生创办的电器工程学院电气维修小组，是浙江大学创办最早的志愿维修服务集体，2008年创立学生E志者协会，于2016年升为5星级社团，更多获奖详情请点击上方 + 了解更多 + +

+ + ), + }, +}; +export const Feature10DataSource = { + wrapper: { className: 'home-page-wrapper content1-wrapper' }, + OverPack: { className: 'home-page content1', playScale: 0.3 }, + imgWrapper: { className: 'content1-img', md: 10, xs: 24 }, + img: { + children: 'https://zos.alipayobjects.com/rmsportal/nLzbeGQLPyBJoli.png', + }, + textWrapper: { className: 'content1-text', md: 14, xs: 24 }, + title: { className: 'content1-title', children: '公益型社团 ' }, + content: { + className: 'content1-content', + children: ( + <> +

+ + + +              +    世界在变，E志者精神永远不变 + + + +

+

+ +

+

+ 自社团成立以来，协会秉承“以服务社会为己任，搭建电器维修爱好者交流平台”的宗旨，致力于做安全用电和节约用电的实践者和宣传者，研究电力电气热点问题，为建设社会主义和谐社会贡献力量 +

+ + ), + }, +}; +export const Content30DataSource = { + wrapper: { className: 'home-page-wrapper content3-wrapper' }, + page: { className: 'home-page content3 k6c2jyfzwv-editor_css' }, + OverPack: { playScale: 0.3 }, + titleWrapper: { + className: 'title-wrapper', + children: [ + { + name: 'title', + children: '协会主要架构 ', + className: 'title-h1 k6byq9vtkee-editor_css', + }, + { + name: 'content', + className: 'title-content k6bz1fy4zto-editor_css', + children: ( + <> +
五大部门职能简介
+ + ), + }, + ], + }, + block: { + className: 'content3-block-wrapper', + children: [ + { + name: 'block2', + className: 'content3-block k6c2kk8agk-editor_css', + md: 8, + xs: 24, + children: { + icon: { + className: 'content3-icon k6byp0r4zad-editor_css', + children: + 'https://zos.alipayobjects.com/rmsportal/xMSBjgxBhKfyMWX.png', + }, + textWrapper: { className: 'content3-text' }, + title: { + className: 'content3-title k6bypeippkr-editor_css', + children: ( + <> +
财外部
+ + ), + }, + content: { + className: 'content3-content', + children: ( + <> +

+ 协会年度财务预算和结算的制定，规范协会各项财务手续，为协会争取更多的资金支持等 +

+ + ), + }, + }, + }, + { + name: 'block3', + className: 'content3-block', + md: 8, + xs: 24, + children: { + icon: { + className: 'content3-icon k6bz0rscbc6-editor_css', + children: + 'https://zos.alipayobjects.com/rmsportal/MNdlBNhmDBLuzqp.png', + }, + textWrapper: { className: 'content3-text' }, + title: { className: 'content3-title', children: '文宣部 ' }, + content: { + className: 'content3-content', + children: ( + <> +

+ 协会形象的塑造和宣传，制定和执行每次活动前的宣传方案，活动现场的摄影和记录，活动后新闻稿的撰写和投出等 +

+ + ), + }, + }, + }, + { + name: 'block~k6bwjb9sg9', + className: 'content3-block', + md: 8, + xs: 24, + children: { + icon: { + className: 'content3-icon k6byxtosuua-editor_css', + children: + 'https://zos.alipayobjects.com/rmsportal/MNdlBNhmDBLuzqp.png', + }, + textWrapper: { className: 'content3-text' }, + title: { + className: 'content3-title', + children: ( + <> +

人资部

+ + ), + }, + content: { + className: 'content3-content', + children: ( + <> +

+ 协会活动的现场执行以及普通会员的管理，活动现场的安排和布置，普通会员志愿服务小时数的统计等 +

+ + ), + }, + }, + }, + { + name: 'block~k6bwjfif6o', + className: 'content3-block', + md: 8, + xs: 24, + children: { + icon: { + className: 'content3-icon k6byzxwmha-editor_css', + children: + 'https://zos.alipayobjects.com/rmsportal/MNdlBNhmDBLuzqp.png', + }, + textWrapper: { className: 'content3-text' }, + title: { className: 'content3-title', children: '电脑部 ' }, + content: { + className: 'content3-content', + children: ( + <> +

+ 协会日常电脑维修服务，同时会负责开展若干次培训活动，面向全体会员旨在提高大家的维修水平 +

+ + ), + }, + }, + }, + { + name: 'block~k6byox4k63', + className: 'content3-block', + md: 8, + xs: 24, + children: { + icon: { + className: 'content3-icon k6bz0x5q5u-editor_css', + children: + 'https://zos.alipayobjects.com/rmsportal/MNdlBNhmDBLuzqp.png', + }, + textWrapper: { className: 'content3-text' }, + title: { className: 'content3-title', children: '电器部 ' }, + content: { + className: 'content3-content', + children: ( + <> +

+ 协会的电器维修与内部资料编篡，也会定期向会员科普一些电器的保养维修常识以及工具的使用方法 +

+ + ), + }, + }, + }, + ], + }, +}; +export const Feature80DataSource = { + wrapper: { className: 'home-page-wrapper feature8-wrapper' }, + page: { className: 'home-page feature8' }, + OverPack: { playScale: 0.3 }, + titleWrapper: { + className: 'feature8-title-wrapper', + children: [ + { + name: 'title', + className: 'feature8-title-h1', + children: ( + <> +

+ 协会主要活动 +

+ + ), + }, + { + name: 'content', + className: 'feature8-title-content', + children: ( + <> +

+ +                                                            +                   +                   +                   +                   +                +     + 以服务社会为己任，为建设社会主义和谐社会贡献力量。 + + +

+ + ), + }, + ], + }, + childWrapper: { + className: 'feature8-button-wrapper', + children: [ + { + name: 'button', + className: 'feature8-button', + children: { href: '/#/ticket', children: '立即加入 ' }, + }, + ], + }, + Carousel: { + dots: false, + className: 'feature8-carousel', + wrapper: { className: 'feature8-block-wrapper' }, + children: { + className: 'feature8-block', + titleWrapper: { + className: 'feature8-carousel-title-wrapper', + title: { className: 'feature8-carousel-title' }, + }, + children: [ + { + name: 'block0', + className: 'feature8-block-row', + gutter: 120, + title: { + className: 'feature8-carousel-title-block', + children: '公益活动 ', + }, + children: [ + { + className: 'feature8-block-col', + md: 6, + xs: 24, + name: 'child0', + arrow: { + className: 'feature8-block-arrow', + children: + 'https://gw.alipayobjects.com/zos/basement_prod/167bee48-fbc0-436a-ba9e-c116b4044293.svg', + }, + children: { + className: 'feature8-block-child', + children: [ + { + name: 'image', + className: 'feature8-block-image', + children: + 'https://gw.alipayobjects.com/zos/basement_prod/d8933673-1463-438a-ac43-1a8f193ebf34.svg', + }, + { + name: 'title', + className: 'feature8-block-title k6c0huzztn9-editor_css', + children: ( + <> +

日常值班：

+ + ), + }, + { + name: 'content', + className: 'feature8-block-content', + children: ( + <> +

+ 每天固定值班时间超过6小时，为同学们提供免费维修电脑电器的服务 +

+ + ), + }, + ], + }, + }, + { + className: 'feature8-block-col', + md: 6, + xs: 24, + name: 'child1', + arrow: { + className: 'feature8-block-arrow', + children: + 'https://gw.alipayobjects.com/zos/basement_prod/167bee48-fbc0-436a-ba9e-c116b4044293.svg', + }, + children: { + className: 'feature8-block-child', + children: [ + { + name: 'image', + className: 'feature8-block-image', + children: + 'https://gw.alipayobjects.com/zos/basement_prod/d8933673-1463-438a-ac43-1a8f193ebf34.svg', + }, + { + name: 'title', + className: 'feature8-block-title k6c169bqlul-editor_css', + children: ( + <> +

线上交流：

+ + ), + }, + { + name: 'content', + className: 'feature8-block-content', + children: ( + <> +

为全校师生提供电脑基础知识普及以及免费的购机咨询

+ + ), + }, + ], + }, + }, + { + className: 'feature8-block-col', + md: 6, + xs: 24, + name: 'child2', + arrow: { + className: 'feature8-block-arrow', + children: + 'https://gw.alipayobjects.com/zos/basement_prod/167bee48-fbc0-436a-ba9e-c116b4044293.svg', + }, + children: { + className: 'feature8-block-child', + children: [ + { + name: 'image', + className: 'feature8-block-image', + children: + 'https://gw.alipayobjects.com/zos/basement_prod/d8933673-1463-438a-ac43-1a8f193ebf34.svg', + }, + { + name: 'title', + className: 'feature8-block-title k6c16ctkdmf-editor_css', + children: ( + <> +

公益进社会：

+ + ), + }, + { + name: 'content', + className: 'feature8-block-content', + children: ( + <> +

+ 开展社区维修服务，积极拓展校外公益活动，积极与在杭其他高校拓展合作关系 +

+ + ), + }, + ], + }, + }, + { + className: 'feature8-block-col', + md: 6, + xs: 24, + name: 'child~k6c0s1iqr6c', + arrow: { + className: 'feature8-block-arrow', + children: + 'https://gw.alipayobjects.com/zos/basement_prod/167bee48-fbc0-436a-ba9e-c116b4044293.svg', + }, + children: { + className: 'feature8-block-child', + children: [ + { + name: 'image', + className: 'feature8-block-image k6c0vx6j656-editor_css', + children: + 'https://gw.alipayobjects.com/zos/basement_prod/d8933673-1463-438a-ac43-1a8f193ebf34.svg', + }, + { + name: 'title', + className: 'feature8-block-title k6c0s334dxi-editor_css', + children: ( + <> + + + ), + }, + { + name: 'content', + className: 'feature8-block-content k6c0s91863l-editor_css', + children: ( + <> +

+ 志愿服务30年来，E志者协会始终立足于志愿维修服务，坚持为全校师生与社会群体提供公益服务 +

+ + ), + }, + ], + }, + }, + ], + }, + { + name: 'block1', + className: 'feature8-block-row', + gutter: 120, + title: { + children: ( + <> + + 社团活动 + + + ), + className: 'feature8-carousel-title-block', + }, + children: [ + { + className: 'feature8-block-col', + md: 6, + xs: 24, + name: 'child0', + arrow: { + className: 'feature8-block-arrow', + children: + 'https://gw.alipayobjects.com/zos/basement_prod/167bee48-fbc0-436a-ba9e-c116b4044293.svg', + }, + children: { + className: 'feature8-block-child', + children: [ + { + name: 'image', + className: 'feature8-block-image k6c0x19mrup-editor_css', + children: + 'https://gw.alipayobjects.com/zos/basement_prod/d8933673-1463-438a-ac43-1a8f193ebf34.svg', + }, + { + name: 'title', + className: 'feature8-block-title k6c17cdd2tk-editor_css', + children: ( + <> +

校园维修&社区维修

+ + ), + }, + { + name: 'content', + className: 'feature8-block-content k6c0x9xg18b-editor_css', + children: ( + <> +

+ 协会日常值班维修，每月一次的学园义务维修和不定期开展的社区义务维修 +

+ + ), + }, + ], + }, + }, + { + className: 'feature8-block-col', + md: 6, + xs: 24, + name: 'child1', + arrow: { + className: 'feature8-block-arrow', + children: + 'https://gw.alipayobjects.com/zos/basement_prod/167bee48-fbc0-436a-ba9e-c116b4044293.svg', + }, + children: { + className: 'feature8-block-child', + children: [ + { + name: 'image', + className: 'feature8-block-image k6c0y0a2yx-editor_css', + children: + 'https://gw.alipayobjects.com/zos/basement_prod/d8933673-1463-438a-ac43-1a8f193ebf34.svg', + }, + { + name: 'title', + className: 'feature8-block-title k6c17hbe4aq-editor_css', + children: ( + <> +

社团精品活动

+ + ), + }, + { + name: 'content', + className: 'feature8-block-content', + children: + '每学年各部门都会开展相应的精品活动，优秀者会有第二课堂的加分 ', + }, + ], + }, + }, + { + className: 'feature8-block-col', + md: 6, + xs: 24, + name: 'child2', + arrow: { + className: 'feature8-block-arrow', + children: + 'https://gw.alipayobjects.com/zos/basement_prod/167bee48-fbc0-436a-ba9e-c116b4044293.svg', + }, + children: { + className: 'feature8-block-child', + children: [ + { + name: 'image', + className: 'feature8-block-image k6c10o2f0x-editor_css', + children: + 'https://gw.alipayobjects.com/zos/basement_prod/d8933673-1463-438a-ac43-1a8f193ebf34.svg', + }, + { + name: 'title', + className: 'feature8-block-title k6c17kho4rt-editor_css', + children: ( + <> +

维修知识课堂

+ + ), + }, + { + name: 'content', + className: 'feature8-block-content', + children: ( + <> +

+ 协会每个长学期都会开办电脑电器维修知识精品课程，旨在传授相关的知识并交流经验 +

+ + ), + }, + ], + }, + }, + { + className: 'feature8-block-col', + md: 6, + xs: 24, + name: 'child3', + arrow: { + className: 'feature8-block-arrow', + children: + 'https://gw.alipayobjects.com/zos/basement_prod/167bee48-fbc0-436a-ba9e-c116b4044293.svg', + }, + children: { + className: 'feature8-block-child', + children: [ + { + name: 'image', + className: 'feature8-block-image k6c12xz3kb-editor_css', + children: + 'https://gw.alipayobjects.com/zos/basement_prod/d8933673-1463-438a-ac43-1a8f193ebf34.svg', + }, + { + name: 'title', + className: 'feature8-block-title k6c17nnk41k-editor_css', + children: ( + <> +

学生节活动

+ + ), + }, + { + name: 'content', + className: 'feature8-block-content', + children: + '在每年的12月末学校举办的学生节中，协会会开展一系列活动向外界展示 ', + }, + ], + }, + }, + ], + }, + { + name: 'elem~k6c0cvcnhnc', + className: 'feature8-block-row', + gutter: 120, + title: { + children: ( + <> +

创新创E

+ + ), + className: 'feature8-carousel-title-block', + }, + children: [ + { + className: 'feature8-block-col', + md: 6, + xs: 24, + name: 'child0', + arrow: { + className: 'feature8-block-arrow', + children: + 'https://gw.alipayobjects.com/zos/basement_prod/167bee48-fbc0-436a-ba9e-c116b4044293.svg', + }, + children: { + className: 'feature8-block-child', + children: [ + { + name: 'image', + className: 'feature8-block-image k6c18wg896n-editor_css', + children: + 'https://gw.alipayobjects.com/zos/basement_prod/d8933673-1463-438a-ac43-1a8f193ebf34.svg', + }, + { + name: 'title', + className: 'feature8-block-title k6c18yxsvf-editor_css', + children: '需求沟通', + }, + { + name: 'content', + className: 'feature8-block-content k6c1crpbwn-editor_css', + children: ( + <> +

积极追求参与竞赛等创新实践活动

+ + ), + }, + ], + }, + }, + { + className: 'feature8-block-col', + md: 6, + xs: 24, + name: 'child1', + arrow: { + className: 'feature8-block-arrow', + children: + 'https://gw.alipayobjects.com/zos/basement_prod/167bee48-fbc0-436a-ba9e-c116b4044293.svg', + }, + children: { + className: 'feature8-block-child', + children: [ + { + name: 'image', + className: 'feature8-block-image k6c1dfyt0he-editor_css', + children: + 'https://gw.alipayobjects.com/zos/basement_prod/d8933673-1463-438a-ac43-1a8f193ebf34.svg', + }, + { + name: 'title', + className: 'feature8-block-title k6c1dj5lecd-editor_css', + children: '需求沟通', + }, + { + name: 'content', + className: 'feature8-block-content k6c1dlcixg-editor_css', + children: '“中控杯”参赛经验分享 ', + }, + ], + }, + }, + { + className: 'feature8-block-col', + md: 6, + xs: 24, + name: 'child2', + arrow: { + className: 'feature8-block-arrow', + children: + 'https://gw.alipayobjects.com/zos/basement_prod/167bee48-fbc0-436a-ba9e-c116b4044293.svg', + }, + children: { + className: 'feature8-block-child', + children: [ + { + name: 'image', + className: 'feature8-block-image k6c2haip0st-editor_css', + children: + 'https://gw.alipayobjects.com/zos/basement_prod/d8933673-1463-438a-ac43-1a8f193ebf34.svg', + }, + { + name: 'title', + className: 'feature8-block-title k6c2h8wti1-editor_css', + children: '需求沟通', + }, + { + name: 'content', + className: 'feature8-block-content k6c2hgg3bfc-editor_css', + children: ( + <> +

智能车竞赛经验分享

+ + ), + }, + ], + }, + }, + { + className: 'feature8-block-col', + md: 6, + xs: 24, + name: 'child3', + arrow: { + className: 'feature8-block-arrow', + children: + 'https://gw.alipayobjects.com/zos/basement_prod/167bee48-fbc0-436a-ba9e-c116b4044293.svg', + }, + children: { + className: 'feature8-block-child', + children: [ + { + name: 'image', + className: 'feature8-block-image k6c2ibp6dfh-editor_css', + children: + 'https://gw.alipayobjects.com/zos/basement_prod/d8933673-1463-438a-ac43-1a8f193ebf34.svg', + }, + { + name: 'title', + className: 'feature8-block-title k6c2ijput1f-editor_css', + children: '需求沟通', + }, + { + name: 'content', + className: 'feature8-block-content k6c2imvlib-editor_css', + children: ( + <> +

废旧电子元件创意DIY大赛

+ + ), + }, + ], + }, + }, + ], + }, + ], + }, + }, +}; +export const Feature60DataSource = { + wrapper: { className: 'home-page-wrapper feature6-wrapper' }, + OverPack: { className: 'home-page feature6', playScale: 0.3 }, + Carousel: { + className: 'feature6-content', + dots: false, + wrapper: { className: 'feature6-content-wrapper' }, + titleWrapper: { + className: 'feature6-title-wrapper', + barWrapper: { + className: 'feature6-title-bar-wrapper', + children: { className: 'feature6-title-bar' }, + }, + title: { className: 'feature6-title' }, + }, + children: [ + { + title: { className: 'feature6-title-text', children: '电脑 ' }, + className: 'feature6-item', + name: 'block0', + children: [ + { + md: 8, + xs: 24, + className: 'feature6-number-wrapper', + name: 'child0', + number: { + className: 'feature6-number', + unit: { className: 'feature6-unit', children: '件/次 ' }, + toText: true, + children: '1562', + }, + children: { + className: 'feature6-text', + children: '年均维修件数 ', + }, + }, + { + md: 8, + xs: 24, + className: 'feature6-number-wrapper', + name: 'child1', + number: { + className: 'feature6-number', + unit: { className: 'feature6-unit', children: '% ' }, + toText: true, + children: '90.7', + }, + children: { + className: 'feature6-text', + children: '维修成功率 ', + }, + }, + { + md: 8, + xs: 24, + className: 'feature6-number-wrapper', + name: 'child2', + number: { + className: 'feature6-number', + unit: { className: 'feature6-unit', children: '时 ' }, + toText: true, + children: '8', + }, + children: { + className: 'feature6-text', + children: '值班时间 ', + }, + }, + ], + }, + { + title: { + className: 'feature6-title-text', + children: ( + <> +

电器

+ + ), + }, + className: 'feature6-item', + name: 'block1', + children: [ + { + md: 8, + xs: 24, + name: 'child0', + className: 'feature6-number-wrapper', + number: { + className: 'feature6-number', + unit: { className: 'feature6-unit', children: '件 ' }, + toText: true, + children: '218', + }, + children: { + className: 'feature6-text', + children: ( + <> +

+ 年均维修量 +

+ + ), + }, + }, + { + md: 8, + xs: 24, + name: 'child1', + className: 'feature6-number-wrapper', + number: { + className: 'feature6-number', + unit: { className: 'feature6-unit', children: '% ' }, + toText: true, + children: '81.3', + }, + children: { + className: 'feature6-text', + children: '维修成功率 ', + }, + }, + { + md: 8, + xs: 24, + name: 'child2', + className: 'feature6-number-wrapper', + number: { + className: 'feature6-number', + unit: { className: 'feature6-unit', children: '时 ' }, + toText: true, + children: '8', + }, + children: { + className: 'feature6-text', + children: '值班时间 ', + }, + }, + ], + }, + ], + }, +}; +export const Content50DataSource = { + wrapper: { className: 'home-page-wrapper content5-wrapper' }, + page: { className: 'home-page content5' }, + OverPack: { playScale: 0.3, className: '' }, + titleWrapper: { + className: 'title-wrapper', + children: [ + { name: 'title', children: '精彩瞬间回放 ', className: 'title-h1' }, + { + name: 'content', + className: 'title-content', + children: '协会有关照片欣赏 ', + }, + ], + }, + block: { + className: 'content5-img-wrapper', + gutter: 16, + children: [ + { + name: 'block0', + className: 'block', + md: 6, + xs: 24, + children: { + + wrapper: { className: 'content5-block-content' }, + img: { + children: + back1, + + }, + content: { children: 'E志新晚' }, + }, + }, + { + name: 'block1', + className: 'block', + md: 6, + xs: 24, + children: { + wrapper: { className: 'content5-block-content' }, + + img: { + children: + richang1, + }, + content: { children: '日常值班(1)' }, + }, + }, + { + name: 'block2', + className: 'block', + md: 6, + xs: 24, + children: { + wrapper: { className: 'content5-block-content' }, + img: { + children: + richang2, + }, + content: { children: '日常值班(2)' }, + }, + }, + { + name: 'block3', + className: 'block', + md: 6, + xs: 24, + children: { + wrapper: { className: 'content5-block-content' }, + img: { + children: + xueyuan1, + }, + content: { children: '学院维修' }, + }, + }, + { + name: 'block4', + className: 'block', + md: 6, + xs: 24, + children: { + wrapper: { className: 'content5-block-content' }, + img: { + children: + shequ1, + }, + content: { children: '社区维修' }, + }, + }, + { + name: 'block5', + className: 'block', + md: 6, + xs: 24, + children: { + wrapper: { className: 'content5-block-content' }, + img: { + children: + jingpin1, + }, + content: { children: '精品活动' }, + }, + }, + { + name: 'block6', + className: 'block', + md: 6, + xs: 24, + children: { + wrapper: { className: 'content5-block-content' }, + img: { + children: + xueshengjie1, + }, + content: { children: '学生节' }, + }, + }, + { + name: 'block7', + className: 'block', + md: 6, + xs: 24, + children: { + wrapper: { className: 'content5-block-content' }, + img: { + children: + luntan1, + }, + content: { children: '公益论坛' }, + }, + }, + ], + }, +}; +export const Content90DataSource = { + wrapper: { className: 'home-page-wrapper content9-wrapper' }, + page: { className: 'home-page content9' }, + titleWrapper: { + className: 'title-wrapper', + children: [ + { + name: 'image', + children: + 'https://gw.alipayobjects.com/zos/rmsportal/PiqyziYmvbgAudYfhuBr.svg', + className: 'title-image', + }, + { name: 'title', children: '协会荣誉 ', className: 'title-h1' }, + ], + }, + block: { + className: 'timeline', + children: [ + { + name: 'block0', + className: 'block-wrapper', + playScale: 0.3, + children: { + imgWrapper: { className: 'image-wrapper' }, + textWrapper: { className: 'text-wrapper k6c37bgt0io-editor_css' }, + img: { + className: 'block-img k6c3b63w63l-editor_css', + children: + 'https://gw.alipayobjects.com/zos/rmsportal/SlFgHDtOTLzccvFrQHLg.png', + }, + icon: { + className: 'block-icon', + children: + 'https://gw.alipayobjects.com/zos/rmsportal/qJnGrvjXPxdKETlVSrbe.svg', + }, + name: { + className: 'block-name k6c3bgi5wr-editor_css', + children: '2008-2009年 ', + }, + post: { + className: 'block-post k6c3bvphdf-editor_css', + children: '公司 职位', + }, + time: { + className: 'block-time', + children: ( + <> + + + ), + }, + title: { + className: 'block-title', + children: ( + <> +

+ 2009年浙江大学学生E志者协会获“浙江省优秀志愿者服务队伍”荣誉称号 +

+

+ +

+

+ 2009年浙江大学学生E志者协会获“浙江大学十大优秀志愿者服务集体”荣誉称号 +

+

+ +

+

+ 2009年浙江大学学生E志者协会被评为“2009-2010年度浙江大学校级优秀社团” +

+ + ), + }, + content: { className: 'block-content', children: '' }, + }, + }, + { + name: 'block~k6c3e920hz', + className: 'block-wrapper', + playScale: 0.3, + children: { + imgWrapper: { className: 'image-wrapper' }, + textWrapper: { className: 'text-wrapper k6c37bgt0io-editor_css' }, + img: { + className: 'block-img k6c3b63w63l-editor_css', + children: + 'https://gw.alipayobjects.com/zos/rmsportal/SlFgHDtOTLzccvFrQHLg.png', + }, + icon: { + className: 'block-icon', + children: + 'https://gw.alipayobjects.com/zos/rmsportal/qJnGrvjXPxdKETlVSrbe.svg', + }, + name: { + className: 'block-name k6c3bgi5wr-editor_css', + children: '2010-2014年 ', + }, + post: { + className: 'block-post k6c3bvphdf-editor_css', + children: '公司 职位', + }, + time: { + className: 'block-time', + children: ( + <> + + + ), + }, + title: { + className: 'block-title', + children: ( + <> +

2010年末浙江大学学生E志者协会由一星级社团跃升为三星级社团

+

+ +

+

+ 2010——2012年连续三年浙江大学学生E志者协会获评“浙江大学学生十佳社团” +

+

+ +

+

2014年浙江大学学生E志者协会荣升为浙江大学四星级社团

+ + ), + }, + content: { className: 'block-content', children: '' }, + }, + }, + { + name: 'block~k6c3e9yqitf', + className: 'block-wrapper', + playScale: 0.3, + children: { + imgWrapper: { className: 'image-wrapper' }, + textWrapper: { className: 'text-wrapper k6c37bgt0io-editor_css' }, + img: { + className: 'block-img k6c3b63w63l-editor_css', + children: + 'https://gw.alipayobjects.com/zos/rmsportal/SlFgHDtOTLzccvFrQHLg.png', + }, + icon: { + className: 'block-icon', + children: + 'https://gw.alipayobjects.com/zos/rmsportal/qJnGrvjXPxdKETlVSrbe.svg', + }, + name: { + className: 'block-name k6c3bgi5wr-editor_css', + children: '2015-2018年 ', + }, + post: { + className: 'block-post k6c3bvphdf-editor_css', + children: '公司 职位', + }, + time: { + className: 'block-time', + children: ( + <> + + + ), + }, + title: { + className: 'block-title', + children: ( + <> +

2015年浙江大学学生E志者协会入选浙江大学最美公益服务集体

+

+ +

+

2016年浙江大学学生E志者协会荣升为浙江大学五星级社团

+

+ +

+

2017年浙江大学学生E志者协会获社团精品课程一等奖

+ + ), + }, + content: { className: 'block-content', children: '' }, + }, + }, + ], + }, +}; export const Teams10DataSource = { wrapper: { className: 'home-page-wrapper teams1-wrapper' }, page: { className: 'home-page teams1' }, @@ -31,25 +1432,18 @@ export const Teams10DataSource = { { name: 'image', className: 'teams1-image k6d84n0pi88-editor_css', - children: - 'https://gw.alipayobjects.com/mdn/rms_ae7ad9/afts/img/A*--rVR4hclJYAAAAAAAAAAABjARQnAQ', - }, - { - name: 'title', - className: 'teams1-title k6d8cd2spqg-editor_css', - children: '叶秀英', - }, - { - name: 'content', - className: 'teams1-job k6d8cjs331-editor_css', - children: '公司+职位 信息暂缺', + img: { + children: back1, + }, }, + + { name: 'content1', className: 'teams1-content k6d8cnw0kx-editor_css', children: ( <> -

cxz

+

cxz666

), }, @@ -234,3 +1628,236 @@ export const Teams10DataSource = { ], }, }; + +export const Footer00DataSource = { + wrapper: { className: 'home-page-wrapper footer0-wrapper' }, + OverPack: { className: 'home-page footer0', playScale: 0.05 }, + copyright: { + className: 'copyright', + children: ( + <> +

+ ©2020 浙江大学学生E志者协会 All Rights Reserved +

+ + ), + }, +}; +export const Content110DataSource = { + OverPack: { + className: 'home-page-wrapper content11-wrapper k6lxojfwiy-editor_css', + 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: ( + <> +

悠久的协会历史

+ + ), + className: 'title-h1', + }, + { + name: 'content', + children: ( + <> +

+ +                   +                   +                   +         ——1984-2020 + +

+ + ), + className: 'title-content', + }, + { + name: 'title~k6lxiecs7mc', + className: 'k6lxlv638d8-editor_css', + children: ( + <> +

+                 + 浙江大学学生E志者协会的前身是1984年陈强先生创办的电器工程学院电气维修小组。
+

+ + ), + }, + { + name: 'title~k6lxii52wgt', + className: 'k6lxnkyb05e-editor_css', + children: ( + <> +

+               +  步入21世纪，为适应新时期学校教育体制的改革和管理模式的创新，在电气工程学院团委的大力支持和推动下，电器维修小组终于在2008年 + 9月正式成为校级学生社团，面向全校吸纳志愿维修的志愿者，在全校范围内搭建以志愿维修为主体的服务平台，做志愿维修的践行者，做安全用电 + + + 和节约用电的实践者和宣传者，做电力热点问题及电器电脑新尖问题 + +

+ + ), + }, + { + name: 'title~k6lxiiz6njn', + className: 'k6lxrmle9fu-editor_css', + children: ( + <> +

+               +  在此后，协会抓紧机遇，在做好本职工作的同时，积极开拓其他公益志愿活动，服务广大师生与社会群众。多年来，协会还在组织架构、运行管理机制、文化建设、对外宣传等方面展开了积极的探索，开展了多项校级精品活动，提高了协会在校园文化中的知名度和影响力。
+

+ + ), + }, + { + name: 'title~k6lxsl0gn1', + className: 'k6lxsmos5a-editor_css', + children: ( + <> +

+               +  近五年来，浙江大学学生E志者协会凭借出色的表现，屡次获得“浙江大学校级优秀社团”、“校级十佳社团”、“青年志愿服务优秀集体”等荣誉称号。2015年4月，浙江大学E志者协会荣升为校四星级社团。2016年6月，浙江大学学生E志者协会获评“浙江大学学生示范性社团”，该奖项是浙江大学社团最高荣誉。
+

+ + ), + }, + { + name: 'image~k6ly196ivdl', + className: 'k6ly1aw82ke-editor_css', + children: history, + + }, + { + name: 'image~k6ly6iq7hge', + className: 'k6ly6kbgb-editor_css', + children: 'https://zos.alipayobjects.com/rmsportal/HzvPfCGNCtvGrdk.png', + }, + { + name: 'title~k6n8yao5dk8', + className: 'k6n8yboe41-editor_css', + children: ( + <> +

丰富的社团活动

+ + ), + }, + ], + }, + button: { + className: 'k6n8x5ig5jn-editor_css', + children: { a: { className: 'button', href: '/#/ticket', children: '立即报名' } }, + }, +}; + + +export const Feature13DataSource = { + wrapper: { className: 'home-page-wrapper content1-wrapper' }, + OverPack: { className: 'home-page content1', playScale: 0.3 }, + imgWrapper: { className: 'content1-img', md: 10, xs: 24 }, + img: { + children: shequ1, + }, + textWrapper: { className: 'content1-text', md: 14, xs: 24 }, + title: { + className: 'content1-title', + children: ( + <> +

+ 校园维修&社区维修
+

+ + ), + }, + content: { + className: 'content1-content k6lymhkssyk-editor_css', + children: ( + <> +

+ 协会日常值班维修，每月一次的学园义务维修和不定期开展的社区义务维修为同学们和社区居民的生活带来了极大的便利。
+

+

+
+

+

+
+

+ + ), + }, +}; +export const Feature11DataSource = { + wrapper: { className: 'home-page-wrapper content1-wrapper' }, + OverPack: { className: 'home-page content1', playScale: 0.3 }, + imgWrapper: { className: 'content1-img', md: 10, xs: 24 }, + img: { + children: jingpin1, + }, + textWrapper: { className: 'content1-text', md: 14, xs: 24 }, + title: { + className: 'content1-title', + children: ( + <> +

+ 电脑电器维修知识课堂（社联精品课程）
+

+ + ), + }, + content: { + className: jingpin1, + children: ( + <> +

+ 协会每个长学期都会开办电脑电器维修知识精品课程，旨在传授对于电脑电器维修感兴趣的同学相关的知识并交流经验，方便同学们自主解决生活中遇到的简单的电脑电器故障。2015年秋冬学期精品课程荣获浙江大学学生社团精品课程评比一等奖。 +

+ + ), + }, +}; +export const Feature12DataSource = { + wrapper: { className: 'home-page-wrapper content1-wrapper' }, + OverPack: { className: 'home-page content1', playScale: 0.3 }, + imgWrapper: { className: 'content1-img', md: 10, xs: 24 }, + img: { + children: xueshengjie1, + }, + textWrapper: { className: 'content1-text', md: 14, xs: 24 }, + title: { + className: 'content1-title', + children: ( + <> +

+ 学生节活动/社团精品活动
+

+ + ), + }, + content: { + className: 'content1-content k6lyqr8k4ri-editor_css', + children: ( + <> +
+ 在每年的12月末浙江大学学生节期间，协会应邀参与举办学生节社团体验日，协会会在文化广场举办有趣的互动活动和电路DIY活动，鼓励大家自己动手体验LED简单电路的制作。 +
+

+
+

+ + ), + }, +}; diff --git a/src/Home/history.jsx b/src/Home/history.jsx new file mode 100644 index 0000000..f415196 --- /dev/null +++ b/src/Home/history.jsx @@ -0,0 +1,105 @@ +/* eslint no-undef: 0 */ +/* eslint arrow-parens: 0 */ +import React from 'react'; +import { enquireScreen } from 'enquire-js'; + +import Content11 from './Content11'; +import Feature1 from './Feature1'; +import Nav3 from './Nav3'; +import { + Nav30DataSource, + Content110DataSource, + Feature13DataSource, + Feature11DataSource, + Feature12DataSource, + Footer00DataSource, +} from './data.source'; +import './less/antMotionStyle.less'; +import Footer0 from './Footer0'; +let isMobile; +enquireScreen((b) => { + isMobile = b; +}); + +const { location } = window; + +export default class Page2 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 = [ + , + , + , + , + , + , + ]; + return ( +
{ + this.dom = d; + }} + > + {/* 如果不是 dva 2.0 替换成 {children} start */} + {this.state.show && children} + {/* 如果不是 dva 2.0 替换成 {children} end */} +
+ ); + } +} diff --git a/src/Home/less/antMotionStyle.less b/src/Home/less/antMotionStyle.less index b328b3d..56ac6a9 100644 --- a/src/Home/less/antMotionStyle.less +++ b/src/Home/less/antMotionStyle.less @@ -1,5 +1,17 @@ @import './common.less'; @import './custom.less'; +@import './point.less'; @import './content.less'; -@import './teams1.less'; -@import './edit.less'; \ No newline at end of file +@import './nav3.less'; +@import './banner3.less'; +@import './feature2.less'; +@import './feature1.less'; +@import './content3.less'; +@import './feature8.less'; +@import './feature6.less'; +@import './content5.less'; +@import './content9.less'; +@import './footer0.less'; +@import './edit.less'; +@import'./teams1.less'; +@import './content11.less'; \ No newline at end of file diff --git a/src/Home/less/banner3.less b/src/Home/less/banner3.less new file mode 100644 index 0000000..bb9955d --- /dev/null +++ b/src/Home/less/banner3.less @@ -0,0 +1,91 @@ +@banner3: banner3; +.@{banner3} { + // 如果在第一屏且导航位置为 relative, 一屏为 height: calc(~"100vh - 64px"); + width: 100%; + height: 100vh; + position: relative; + text-align: center; + border-color: #666; + background-image: url("https://gw.alipayobjects.com/zos/rmsportal/xTPkCNNLOnTEbGgVZOpE.jpg"); + background-size: cover; + background-attachment: fixed; + background-position: center; + & &-text-wrapper { + display: inline-block; + position: absolute; + top: 0; + bottom: 0; + margin: auto; + left: 0; + right: 0; + color: @template-text-color-light; + max-width: 845px; + height: 500px; + width: 80%; + font-size: 20px; + line-height: 28px; + font-weight: 400; + >.queue-anim-leaving { + position: relative !important; + } + } + & &-slogan { + font-size: 68px; + line-height: 80px; + text-indent: 2px; + font-weight: 600; + margin: 26px auto 38px; + overflow: hidden; + } + & &-name-en { + display: block; + font-size: 14px; + line-height: 32px; + font-weight: 400; + } + & &-name { + font-size: 24px; + overflow: hidden; + opacity: 0.8; + } + & &-button { + display: block; + margin: 72px auto 0; + background: rgb(3, 67, 101); + background: -moz-linear-gradient(left, rgba(3, 67, 101, 1) 0%, rgba(0, 27, 51, 1) 100%); + background: linear-gradient(to right, rgba(3, 67, 101, 1) 0%, rgba(0, 27, 51, 1) 100%); + box-shadow: 0 8px 16px #0a52ab; + border: none; + transition: background .45s @ease-out; + width: 132px; + line-height: 42px; + height: 42px; + border-radius: 42px; + } + & &-time { + font-size: 14px; + line-height: 24px; + margin-top: 24px; + } +} + +@media screen and (max-width: 767px) { + .@{banner3} { + background-attachment: inherit; + & &-text-wrapper { + width: 90%; + height: 50%; + } + & &-name-en { + font-size: 12px; + } + & &-slogan { + font-size: 24px; + line-height: 1.5; + margin: 12px 0; + } + & &-name { + font-size: 14px; + } + } +} diff --git a/src/Home/less/content11.less b/src/Home/less/content11.less new file mode 100644 index 0000000..70cf997 --- /dev/null +++ b/src/Home/less/content11.less @@ -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; + } +} diff --git a/src/Home/less/content3.less b/src/Home/less/content3.less new file mode 100644 index 0000000..24ee0e4 --- /dev/null +++ b/src/Home/less/content3.less @@ -0,0 +1,52 @@ +@content3: content3; +.@{content3}-wrapper { + min-height: 764px; + .@{content3} { + height: 100%; + overflow: hidden; + & .title-content { + text-align: center; + } + &-block-wrapper { + position: relative; + .@{content3}-block { + display: inline-block; + padding: 48px 24px; + vertical-align: top; + .@{content3}-icon { + display: inline-block; + width: 15%; + vertical-align: top; + } + .@{content3}-text { + width: 85%; + display: inline-block; + padding-left: 8%; + } + &.clear-both { + clear: both; + } + } + } + } +} + +@media screen and (max-width: 767px) { + .@{content3}-wrapper { + min-height: 1080px; + .@{content3} { + &-block-wrapper { + margin: 20px auto; + height: auto; + .@{content3}-block { + .@{content3}-title { + font-size: 20px; + } + &.queue-anim-leaving { + position: relative !important; + } + } + } + } + } +} diff --git a/src/Home/less/content5.less b/src/Home/less/content5.less new file mode 100644 index 0000000..4b3c190 --- /dev/null +++ b/src/Home/less/content5.less @@ -0,0 +1,69 @@ +@content5: content5; +.@{content5}-wrapper { + background-color: #fafafa; + min-height: 720px; + .@{content5} { + >p { + text-align: center; + } + &-img-wrapper { + margin: 0 auto; + left: 0; + right: 0; + .block { + margin-bottom: 24px; + .content5-block-content { + display: block; + background: #fff; + border-radius: 4px; + padding: 10px; + text-align: center; + position: relative; + overflow: hidden; + .page-pro(); + border: none; + transition: box-shadow .3s @ease-out, transform .3s @ease-out; + & > span { + width: 100%; + height: 200px; + display: block; + background: @line-color; + padding: 0px; + } + & p { + width: 100%; + line-height: 30px; + } + &:hover { + & p { + bottom: 0; + } + } + } + } + } + } +} + +@media screen and (max-width: 767px) { + .@{content5}-wrapper { + height: 2000px; + overflow: hidden; + .@{content5} { + ul { + li { + display: block; + width: 100%; + padding: 2%; + span { + height: 168px; + } + p { + position: relative; + bottom: 0; + } + } + } + } + } +} diff --git a/src/Home/less/content9.less b/src/Home/less/content9.less new file mode 100644 index 0000000..9b08986 --- /dev/null +++ b/src/Home/less/content9.less @@ -0,0 +1,145 @@ +@content9: content9; +@text-color: rgba(0, 0, 0, 0.85); +@text-color2: #697b8c; +.@{content9}-wrapper { + padding-bottom: 64px; + &.home-page-wrapper { + overflow: initial; + } + .@{content9} { + min-height: 800px; + padding: 64px 0 0; + } + .timeline { + position: relative; + &:before { + display: block; + content: ''; + position: absolute; + left: 50%; + top: 0; + width: 0; + height: ~"calc(100% - 108px)"; + margin: 34px 0; + border-left: 2px #ebedf0 dashed; + } + } + .block-wrapper { + color: @text-color; + display: flex; + position: relative; + margin-bottom: 70px; + min-height: 160px; + &:last-child { + margin-bottom: 0; + } + } + .image-wrapper, + .text-wrapper { + width: 50%; + } + .image-wrapper { + text-align: center; + .block-img, + .name-wrapper { + float: right; + clear: both; + width: 262px; + margin: auto; + } + .block-img { + height: 98px; + img { + height: 100%; + } + } + .name-wrapper { + margin: 16px 0 0; + .block-name { + font-size: 14px; + margin-bottom: 4px; + } + .block-post { + font-size: 12px; + color: @text-color2; + } + } + } + .text-wrapper { + padding-left: 40px; + .block-time { + font-size: 12px; + color: @text-color2; + line-height: 18px; + min-height: 18px; + } + .block-title { + margin: 8px 0 12px; + font-size: 14px; + position: relative; + min-height: 18px; + } + .block-icon { + position: absolute; + left: -40px; + transform: translateX(~"calc(-50% + 1px)"); + } + .block-content { + width: 300px; + color: #314659; + font-size: 12px; + min-height: 18px; + } + } +} + +@media screen and (max-width: 767px) { + .@{content9}-wrapper { + padding-bottom: 0; + .@{content9} { + padding: 64px 24px; + } + .timeline { + &:before { + left: 0; + height: 100%; + margin: 0; + } + } + .block-wrapper { + display: block; + min-height: 100px; + margin-bottom: 54px; + } + .image-wrapper, + .text-wrapper { + width: 100%; + } + .image-wrapper { + .block-img { + display: none; + } + .name-wrapper { + text-align: left; + float: left; + width: 100%; + padding-left: 40px; + margin: auto; + } + .block-name, .block-post { + display: inline-block; + } + .block-name { + margin-right: 8px; + } + } + .text-wrapper { + .block-content { + display: none; + } + .block-title { + font-size: 16px; + } + } + } +} diff --git a/src/Home/less/edit.less b/src/Home/less/edit.less index cbe18d8..f76f640 100644 --- a/src/Home/less/edit.less +++ b/src/Home/less/edit.less @@ -1,5 +1,253 @@ +#Content3_0 .ant-col > .content3-text > .k6bwga0pdy-editor_css { + display: flex; + align-items: flex-start; + opacity: 0.35; + border-top-color: rgba(150, 79, 79, 0); + border-right-color: rgba(134, 55, 55, 0); + border-bottom-color: rgba(134, 55, 55, 0); + border-left-color: rgba(211, 57, 57, 0); +} +#Content3_0 .ant-row > .ant-col > .k6bwkyqmmk8-editor_css { + background-color: rgba(202, 36, 36, 0); + background-image: url('https://zos.alipayobjects.com/rmsportal/gGlUMYGEIvjDOOw.jpg'); + background-attachment: scroll; + background-blend-mode: normal; + background-position: 0% 0%; + background-repeat: repeat; + background-size: auto; + background-clip: padding-box; +} +#Content3_0 div > .ant-row > .k6bwib6y3rr-editor_css { + display: block; + font-size: 20px; + font-weight: 400; + color: rgb(42, 128, 202); + text-decoration: line-through; + background-color: rgba(195, 67, 67, 0); + background-image: url('https://zos.alipayobjects.com/rmsportal/gGlUMYGEIvjDOOw.jpg'); + background-attachment: scroll; + background-blend-mode: normal; + background-position: 0% 0%; + background-repeat: repeat; + background-size: auto; + background-clip: padding-box; + border-top-style: dashed; +} +#Banner3_1 .banner3-text-wrapper > .ant-btn { + background-color: #cf2892; + background-image: linear-gradient( + 0rad, + rgb(255, 0, 0) 10%, + rgb(255, 0, 0) 29.71153846153846%, + #da2626 45.4223076923077%, + white 100% + ); + background-attachment: scroll; + background-blend-mode: normal; + background-position: 0% 0%; + background-repeat: repeat; + background-size: auto; + background-clip: padding-box; +} +#Banner3_1 .k6bxcwa6wb-editor_css { + box-shadow: 5px 5px 5px #108ee9; +} +#Banner3_1 .banner3-text-wrapper > .k6bx9bxsgw-editor_css { + background-clip: padding-box; + text-decoration: underline; + text-shadow: 5px 5px 5px rgba(0, 0, 0, 0.35); +} +#Banner3_1 .banner3-text-wrapper > .k6bx9qqmas-editor_css { + color: rgb(255, 0, 0); + margin: 100px 100px; +} +#Banner3_1 .banner3-text-wrapper > .k6bxcnb8hlg-editor_css { + font-family: Tahoma; + font-size: 23px; + font-weight: bold; + color: #e9e9e9; + background-color: rgb(251, 251, 251); + background-image: linear-gradient( + 225deg, + #f04134 12.5%, + #00a854 25%, + #108ee9 37.5%, + #f5317f 50%, + #f56a00 62.5%, + #7265e6 75%, + #ffbf00 87.5%, + #00a2ae 99.54%, + #00a2ae 100%, + rgb(0, 27, 51) 100%, + black 100%, + black 100%, + black 100%, + black 100%, + black 100%, + black 100%, + black 100%, + black 100%, + #f04134 100%, + #108ee9 100%, + black 100% + ); + background-blend-mode: normal; + background-clip: padding-box; + box-shadow: 0px 8px 16px rgb(171, 21, 10); +} +#Content3_0 .ant-col > .content3-text > .k6bypeippkr-editor_css { + margin: 0px; +} +#Content3_0 .ant-row > .ant-col > .k6byzxwmha-editor_css { + display: none; +} +#Content3_0 .ant-row > .ant-col > .k6byp0r4zad-editor_css { + display: none; +} +#Content3_0 .ant-row > .ant-col > .k6bz0rscbc6-editor_css { + display: none; +} +#Content3_0 .ant-row > .ant-col > .k6byxtosuua-editor_css { + display: none; +} +#Content3_0 .ant-row > .ant-col > .k6bz0x5q5u-editor_css { + display: none; +} +#Content3_0 .home-page > .title-wrapper > .k6byq9vtkee-editor_css { + margin: 0px 0 16px; +} +#Feature2_0 .ant-row > .ant-col > .k6bz79j5xeo-editor_css { + text-align: center; +} +#Feature2_0 .ant-row > .ant-col > .k6bzcb3z43g-editor_css { +} +#Content3_0 .home-page > .title-wrapper > .k6bz1fy4zto-editor_css { + font-size: 15px; +} +#Feature8_0 .ant-col > .feature8-block-child > .k6c0oc6qv0m-editor_css { + font-size: 16px; + padding: 30px; +} +#Feature8_0 div > .ant-row-flex > .k6c0r7negkf-editor_css { + margin: 36px 0px; + padding: 0 60px; +} +#Feature8_0 .ant-col > .feature8-block-child > .k6c0s91863l-editor_css { + margin: 0px; + padding: 20px; +} +#Feature8_0 .ant-col > .feature8-block-child > .k6c0vx6j656-editor_css { + display: none; +} +#Feature8_0 .ant-col > .feature8-block-child > .k6c0s334dxi-editor_css { + display: none; +} +#Feature8_0 .ant-col > .feature8-block-child > .k6c0x19mrup-editor_css { + display: none; +} +#Feature8_0 .ant-col > .feature8-block-child > .k6c0y0a2yx-editor_css { + display: none; +} +#Feature8_0 .ant-col > .feature8-block-child > .k6c0x9xg18b-editor_css { + font-weight: 300; + color: #404040; +} +#Feature8_0 .ant-col > .feature8-block-child > .k6c10o2f0x-editor_css { + display: none; +} +#Feature8_0 .ant-col > .feature8-block-child > .k6c12xz3kb-editor_css { + display: none; +} +#Feature8_0 .ant-col > .feature8-block-child > .k6c0huzztn9-editor_css { + font-size: 20px; + font-weight: 500; +} +#Feature8_0 .ant-col > .feature8-block-child > .k6c169bqlul-editor_css { + font-size: 20px; +} +#Feature8_0 .ant-col > .feature8-block-child > .k6c16ctkdmf-editor_css { + font-size: 20px; +} +#Feature8_0 .ant-col > .feature8-block-child > .k6c17cdd2tk-editor_css { + font-size: 20px; +} +#Feature8_0 .ant-col > .feature8-block-child > .k6c17hbe4aq-editor_css { + font-size: 20px; +} +#Feature8_0 .ant-col > .feature8-block-child > .k6c17kho4rt-editor_css { + font-size: 20px; +} +#Feature8_0 .ant-col > .feature8-block-child > .k6c17nnk41k-editor_css { + font-size: 20px; +} +#Feature8_0 .ant-col > .feature8-block-child > .k6c18wg896n-editor_css { + display: none; +} +#Feature8_0 .ant-col > .feature8-block-child > .k6c18yxsvf-editor_css { + display: none; +} +#Feature8_0 .ant-col > .feature8-block-child > .k6c1dfyt0he-editor_css { + display: none; +} +#Feature8_0 .ant-col > .feature8-block-child > .k6c1dj5lecd-editor_css { + display: none; +} +#Feature8_0 .ant-col > .feature8-block-child > .k6c1crpbwn-editor_css { + font-size: 20px; + text-align: center; +} +#Feature8_0 .ant-col > .feature8-block-child > .k6c1dlcixg-editor_css { + font-size: 20px; + text-align: center; +} +#Feature8_0 .ant-col > .feature8-block-child > .k6c2haip0st-editor_css { + display: none; +} +#Feature8_0 .ant-col > .feature8-block-child > .k6c2h8wti1-editor_css { + display: none; +} +#Feature8_0 .ant-col > .feature8-block-child > .k6c2hgg3bfc-editor_css { + font-size: 20px; + text-align: center; +} +#Feature8_0 .ant-col > .feature8-block-child > .k6c2ijput1f-editor_css { + display: none; +} +#Feature8_0 .ant-col > .feature8-block-child > .k6c2ibp6dfh-editor_css { + display: none; +} +#Feature8_0 .ant-col > .feature8-block-child > .k6c2imvlib-editor_css { + font-size: 20px; + text-align: center; +} +#Content3_0 .k6c2jyfzwv-editor_css { + border-top-width: 1px; +} +#Content3_0 div > .ant-row > .k6c2kk8agk-editor_css { + border-top-style: dashed; + border-right-style: dashed; + border-bottom-style: dashed; + border-left-style: dashed; + border-color: rgba(189, 25, 25, 0); + border-top-width: 1px; + border-right-width: 1px; + border-bottom-width: 1px; + border-left-width: 1px; +} +#Content9_0 .timeline > .block-wrapper > .k6c37bgt0io-editor_css { + width: 100%; +} +#Content9_0 .block-wrapper > .image-wrapper > .k6c3b63w63l-editor_css { + display: none; +} +#Content9_0 .image-wrapper > .name-wrapper > .k6c3bvphdf-editor_css { + display: none; +} +#Content9_0 .image-wrapper > .name-wrapper > .k6c3bgi5wr-editor_css { + font-size: 20px; +} #Teams1_0 .ant-row > .ant-col > .k6d84n0pi88-editor_css { - width: 20px; + width: 320px; clear: both; } #Teams1_0 .ant-row > .ant-col > .k6d8cd2spqg-editor_css { @@ -11,3 +259,53 @@ #Teams1_0 .ant-row > .ant-col > .k6d8cnw0kx-editor_css { font-size: 20px; } +#Content11_0 .title-wrapper > .k6lxsmos5a-editor_css { + font-size: 18px; + text-align: left; + padding: 0 30px 0 10px; +} +#Content11_0 .title-wrapper > .k6lxlv638d8-editor_css { + font-size: 18px; + text-align: left; + padding: 0 10px; +} +#Content11_0 .title-wrapper > .k6lxnkyb05e-editor_css { + font-size: 18px; + text-align: left; + padding: 0 30px 0 10px; +} +#Content11_0 .title-wrapper > .k6lxrmle9fu-editor_css { + font-size: 18px; + text-align: left; + padding: 0 30px 0 10px; +} +#Content11_0 .title-wrapper > .k6ly1aw82ke-editor_css { + width: 300px; + height: 300px; + position: sticky; + top: 200px; + left: 800px; +} +#Content11_0 .title-wrapper > .k6ly6kbgb-editor_css { + width: 300px; + height: 300px; + position: relative; + left: 100px; +} +#Content11_0 .title-wrapper > .k6lycb5l8ia-editor_css { + height: 120px; + padding: 50px 0px 0px; +} +#Content11_0.k6lxojfwiy-editor_css { + height: 1300px; + padding: 96px 30px 0px 10px; +} +#Feature1_0 .ant-row > .ant-col > .k6lymhkssyk-editor_css { + font-size: 16px; +} +#Feature1_1 .ant-row > .ant-col > .k6lypevq23b-editor_css { + font-size: 16px; +} +#Feature1_2 .ant-row > .ant-col > .k6lyqr8k4ri-editor_css { + font-size: 16px; +} \ No newline at end of file diff --git a/src/Home/less/feature1.less b/src/Home/less/feature1.less new file mode 100644 index 0000000..4d03ff3 --- /dev/null +++ b/src/Home/less/feature1.less @@ -0,0 +1,76 @@ +@content1: content1; +.@{content1}-wrapper { + height: 360px; + .@{content1} { + height: 100%; + padding: 0 24px; + &-img { + height: 100%; + transform-origin: top; + padding: 0 32px; + display: flex; + align-items: center; + justify-content: center; + span { + display: block; + width: 250px; + img { + display: block; + } + } + } + &-text { + padding: 0 32px; + height: 100%; + .@{content1}-content, + .@{content1}-title { + position: relative !important; + } + .@{content1}-title { + font-size: 32px; + font-weight: normal; + color: #404040; + margin-top: 120px; + } + .content { + margin-top: 20px; + } + } + } +} + +@media screen and (max-width: 767px) { + .@{content1}-wrapper { + height: 600px; + .@{content1} { + &-img { + height: 200px; + padding: 0; + text-align: center; + margin-top: 64px; + span { + display: inline-block; + width: 180px; + height: 200px; + line-height: 200px; + margin: auto; + } + } + &-text { + height: auto; + margin-bottom: 20px; + text-align: center; + padding: 0; + .@{content1}-content, + .@{content1}-title { + width: 100%; + top: auto; + } + .@{content1}-title { + margin: 32px auto 16px; + font-size: 24px; + } + } + } + } +} diff --git a/src/Home/less/feature2.less b/src/Home/less/feature2.less new file mode 100644 index 0000000..0274842 --- /dev/null +++ b/src/Home/less/feature2.less @@ -0,0 +1,76 @@ +@content2: content2; +.@{content2}-wrapper { + height: 360px; + .@{content2} { + height: 100%; + padding: 0 24px; + &-img { + height: 100%; + transform-origin: top; + padding: 0 32px; + display: flex; + align-items: center; + justify-content: center; + span { + display: block; + width: 250px; + img { + display: block; + } + } + } + &-text { + padding: 0 32px; + height: 100%; + .@{content2}-content, + .@{content2}-title { + position: relative !important; + } + .@{content2}-title { + font-size: 32px; + font-weight: normal; + color: #404040; + margin-top: 120px; + } + .@{content2}-content { + margin-top: 20px; + } + } + } +} + +@media screen and (max-width: 767px) { + .@{content2}-wrapper { + height: 600px; + .@{content2} { + &-img { + height: 200px; + padding: 0; + text-align: center; + margin-top: 64px; + span { + display: inline-block; + width: 180px; + height: 200px; + line-height: 200px; + margin: auto; + } + } + &-text { + height: auto; + margin-bottom: 20px; + text-align: center; + padding: 0; + .@{content2}-content, + .@{content2}-title { + width: 100%; + top: auto; + } + .@{content2}-title { + margin: 32px auto 16px; + font-size: 24px; + } + } + } + } +} diff --git a/src/Home/less/feature6.less b/src/Home/less/feature6.less new file mode 100644 index 0000000..01b2e77 --- /dev/null +++ b/src/Home/less/feature6.less @@ -0,0 +1,118 @@ +@feature6: feature6; + +.@{feature6} { + &-wrapper { + min-height: 360px; + margin: 0 auto; + overflow: hidden; + + &.home-page-wrapper { + .home-page { + padding: 64px 24px; + } + } + } + + &-title { + display: inline-block; + + &-wrapper { + text-align: center; + margin-bottom: 48px; + } + + &-text { + display: inline-block; + margin: 0 72px; + font-size: 24px; + color: @text-color; + transition: color .45s @ease-in-out; + cursor: pointer; + + &.active { + color: @primary-color; + } + } + + &-bar { + height: 6px; + background: @primary-color; + width: 20%; + margin: auto; + display: block; + + &-wrapper { + position: relative; + margin-top: 8px; + transition: left .45s @ease-in-out; + } + } + } + + &-number, + &-text { + text-align: center; + } + + &-number { + font-size: 48px; + color: @primary-color; + font-weight: 600; + + &-wrapper { + text-align: center; + } + } + + &-text { + font-size: 20px; + } + + &-unit { + font-size: 16px; + color: @primary-color; + } + + .ant-carousel { + .slick-dots-bottom { + bottom: -24px; + } + + .slick-dots li { + button { + background: fade(@primary-color, 30); + } + + &.slick-active button { + background: @primary-color; + } + } + } +} + +@media screen and (max-width: 767px) { + .@{feature6}-wrapper { + padding-bottom: 0; + min-height: 580px; + + &.home-page-wrapper { + .home-page { + padding: 56px 24px 64px; + } + } + } + + .@{feature6}-title { + &-text { + margin: 0 14px; + } + + &-bar { + width: 40%; + } + } + + .@{feature6}-number-wrapper { + margin-bottom: 16px; + } +} diff --git a/src/Home/less/feature8.less b/src/Home/less/feature8.less new file mode 100644 index 0000000..4f65fa9 --- /dev/null +++ b/src/Home/less/feature8.less @@ -0,0 +1,217 @@ +@feature8: feature8; + +.@{feature8} { + &-wrapper { + min-height: 680px; + margin: 0 auto; + overflow: hidden; + background-color: fade(#fdfdfd, 30); + background-image: linear-gradient(360deg, fade(#c1daff, 30) 0%, fade(#fdfdfd, 30) 80%); + + &.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; + } + } + + &-carousel { + width: ~"calc(100% + 72px)"; + margin-left: -36px; + } + + &-carousel-title { + font-size: 20px; + text-align: center; + + &-block { + display: inline-block; + color: fade(@text-color, 45); + transition: color .45s; + padding: 0 40px; + position: relative; + cursor: pointer; + + &.active { + color: @text-color; + cursor: auto; + } + + &::before { + display: block; + content: ''; + width: 1px; + height: 70%; + position: absolute; + top: 0; + right: 0; + bottom: 0; + margin: auto; + background: #d8d8d8; + } + + &:last-child { + &::before { + display: none; + } + } + } + } + + &-block { + margin-top: 48px; + + &-wrapper { + margin-top: 32px; + } + + &-row { + padding: 0 36px; + } + + &-col { + text-align: center; + margin: 36px 0; + position: relative; + + &:last-child { + .@{feature8}-block-arrow { + display: none; + } + } + } + + &-child { + padding: 36px 24px 24px; + border-radius: 6px; + + height: 100%; + transition: box-shadow @animate-duration @ease-in-out, background @animate-duration @ease-in-out; + + &:hover { + background-color: #f6f9ff; + box-shadow: 0 12px 36px fade(#646488, 15); + + .@{feature8}-block-content { + opacity: 1; + } + } + } + + &-image { + display: inline-block; + } + + &-title { + font-size: 16px; + font-weight: 400; + color: @text-color; + margin-top: 16px; + } + + &-content { + opacity: 1; + font-size: 14px; + line-height: 22px; + color: fade(@text-color, 65); + margin-top: 36px; + text-align: left; + transition: opacity @animate-duration @ease-in-out; + } + + &-arrow { + position: absolute; + right: 0; + width: 16px; + top: 80px; + } + } + + &-button { + text-align: center; + + &-wrapper { + margin-top: 16px; + } + + .ant-btn { + padding: 8px 40px; + border-radius: 20px; + line-height: 1.5; + height: 40px; + border: none; + color: #fff; + background-color: #3c89f6; + background-image: linear-gradient(135deg, #82b5ff 0%, #3c89f6 100%); + box-shadow: 0 9px 22px fade(#5f9bf1, 35); + transition: color .45s @ease-in-out, box-shadow .45s @ease-in-out, transform .45s @ease-in-out; + will-change: transform, box-shadow; + &:hover { + transform: translateY(-5px); + box-shadow: 0 14px 26px fade(#5f9bf1, 40); + } + } + } +} + +@media screen and (max-width: 767px) { + .@{feature8} { + &-wrapper { + padding-bottom: 0; + min-height: 1540px; + + &.home-page-wrapper { + .home-page { + padding: 56px 24px 64px; + } + } + } + + &-carousel-title { + font-size: 16px; + + &-block { + padding: 0 8px; + } + } + + &-block { + &-child { + width: 80%; + margin: auto; + background-color: #f6f9ff; + box-shadow: 0 12px 36px fade(#646488, 15); + } + + &-content { + text-align: center; + } + + &-arrow { + bottom: -40px; + top: auto; + left: 0; + right: 0; + margin: auto; + transform: rotate(90deg); + } + } + } +} diff --git a/src/Home/less/footer0.less b/src/Home/less/footer0.less new file mode 100644 index 0000000..8ee8c53 --- /dev/null +++ b/src/Home/less/footer0.less @@ -0,0 +1,28 @@ +.footer0-wrapper { + background-color: @template-bg-color; + height: 80px; + overflow: hidden; + .footer0 { + height: 100%; + padding: 0 24px; + line-height: 80px; + text-align: center; + color: @template-footer-text-color; + position: relative; + } +} + +@media screen and (max-width: 767px) { + .footer0-wrapper { + .footer0 { + font-size: 12px; + &.home-page { + padding: 0; + } + >div { + width: 90%; + margin: auto; + } + } + } +} diff --git a/src/Home/less/nav3.less b/src/Home/less/nav3.less new file mode 100644 index 0000000..e017931 --- /dev/null +++ b/src/Home/less/nav3.less @@ -0,0 +1,192 @@ +@header3: header3; + +.@{header3} { + background: #fff; + width: 100%; + z-index: 1; + box-shadow: 0 4px 6px fade(#000, 5); + position: relative; + top: 0; + + .home-page { + padding: 0 0px; + } + + &-logo { + display: inline-block; + position: relative; + width: 50px; + + line-height: 60px; + + & img { + vertical-align: middle; + display: inline-block; + } + + & a { + display: block; + } + } + + &-menu { + float: right; + .ant-menu-horizontal { + border-bottom: none; + } + .ant-menu { + line-height: 62px; + height: 64px; + background: transparent; + + a { + display: block; + } + } + } + + &-item { + &-block { + padding: 0 8px; + + >* { + display: inline-block; + } + } + } + + &-item, + &-item-child, + &-menu { + + .ant-menu-sub .ant-menu-item, + .ant-menu-inline .ant-menu-item { + height: auto; + line-height: 1.5; + } + + .item { + &-sub-item { + display: block; + padding: 8px 24px; + } + + &-image { + float: left; + margin-right: 16px; + margin-top: 4px; + position: relative; + z-index: 1; + } + + &-title { + font-size: 14px; + color: @text-color; + margin-left: 46px; + } + + &-content { + font-size: 12px; + color: fade(@text-color, 75); + margin-left: 46px; + } + } + } +} + +@media screen and (max-width: 767px) { + .@{header3} { + &-logo { + z-index: 101; + } + + &.home-page-wrapper .home-page { + padding: 0 24px; + } + + &-menu { + height: auto; + float: inherit; + position: relative; + left: -24px; + width: ~"calc(100% + 48px)"; + opacity: 0; + transition: opacity .3s @ease-in-out; + background: #fff; + + & li { + padding: 0 24px; + + &.ant-menu-submenu { + padding: 0; + } + } + .item { + &-sub-item { + padding: 8px 0; + } + } + } + + &-mobile-menu { + width: 16px; + height: 14px; + cursor: pointer; + position: absolute; + top: 24px; + right: 24px; + z-index: 100; + + em { + display: block; + width: 100%; + height: 2px; + background: @template-nav-bg-color; + margin-top: 4px; + transition: transform .3s @ease-in-out, opacity .3s @ease-in-out; + } + + :first-child { + margin-top: 0; + } + } + + .ant-menu { + height: auto; + overflow: hidden; + + .ant-menu-item-selected { + border: none; + } + } + + & .open { + height: auto; + + .@{header3}-mobile-menu { + em { + &:nth-child(1) { + transform: translateY(6px) rotate(45deg); + } + + &:nth-child(2) { + opacity: 0; + } + + &:nth-child(3) { + transform: translateY(-6px) rotate(-45deg); + } + } + } + + >.@{header3}-menu { + opacity: 1; + pointer-events: auto; + } + } + &-item-block { + height: 40px; + line-height: 40px; + } + } +} diff --git a/src/Home/less/point.less b/src/Home/less/point.less new file mode 100644 index 0000000..93d24e7 --- /dev/null +++ b/src/Home/less/point.less @@ -0,0 +1,61 @@ +@import './custom.less'; +@point: point; +.@{point} { + float: left; + width: 8px; + height: 8px; + opacity: .5; + cursor: pointer; + pointer-events: auto; + transition: opacity .3s @ease-out, background .3s @ease-out; + margin: 6px auto; + background: @primary-color; + border-radius: 100%; + &.active { + opacity: 1; + background: @primary-color; + } + &-wrapper { + position: fixed; + z-index: 9998; + top: 0; + right: 16px; + width: 10px; + display: flex; + height: 100%; + align-items: center; + pointer-events: none; + } + &-left { + left: 16px; + } + &-rect { + border-radius: 0; + } + &-prismatic { + border-radius: 0; + transform: rotate(45deg); + } + &-stroke { + border: 2px solid @primary-color; + background: transparent; + } + &-small { + width: 6px; + &.point { + height: 6px; + } + } + &-large { + width: 10px; + &.point { + height: 10px; + } + } +} + +@media screen and (max-width: 767px) { + .@{point}-wrapper { + display: none; + } +} diff --git a/src/Home/less/teams1.less b/src/Home/less/teams1.less index 494b6b9..836c10f 100644 --- a/src/Home/less/teams1.less +++ b/src/Home/less/teams1.less @@ -3,7 +3,7 @@ min-height: 446px; overflow: hidden; .@{teams1} { - overflow: hidden; + overflow: visible; height: 100%; padding: 64px 24px; > .title-wrapper { diff --git a/src/Home/main.jsx b/src/Home/main.jsx new file mode 100644 index 0000000..fa99aa2 --- /dev/null +++ b/src/Home/main.jsx @@ -0,0 +1,161 @@ +/* eslint no-undef: 0 */ +/* eslint arrow-parens: 0 */ +import React from 'react'; +import { enquireScreen } from 'enquire-js'; + +import Nav3 from './Nav3'; +import Banner3 from './Banner3'; +import Feature2 from './Feature2'; +import Feature1 from './Feature1'; +import Content3 from './Content3'; +import Feature8 from './Feature8'; +import Feature6 from './Feature6'; +import Content5 from './Content5'; +import Content9 from './Content9'; +import Footer0 from './Footer0'; +import Point from './Point'; + +import { + Nav30DataSource, + Banner31DataSource, + Feature20DataSource, + Feature10DataSource, + Content30DataSource, + Feature80DataSource, + Feature60DataSource, + Content50DataSource, + Content90DataSource, + Footer00DataSource, + + +} from './data.source'; +import './less/antMotionStyle.less'; + +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 = [ + , + , + , + , + , + , + , + , + , + + , // 导航和页尾不进入锚点区，如果需要，自行添加; + , + ]; + return ( +
{ + this.dom = d; + }} + > + {/* 如果不是 dva 2.0 替换成 {children} start */} + {this.state.show && children} + {/* 如果不是 dva 2.0 替换成 {children} end */} +
+ ); + } +} diff --git a/src/LearnMore/Content11.jsx b/src/LearnMore/Content11.jsx new file mode 100644 index 0000000..fd44471 --- /dev/null +++ b/src/LearnMore/Content11.jsx @@ -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 ( + + + {dataSource.titleWrapper.children.map(getChildrenToRender)} + + + + + + ); + } +} + +export default Content11; diff --git a/src/LearnMore/Feature7.jsx b/src/LearnMore/Feature7.jsx new file mode 100644 index 0000000..4cadfe7 --- /dev/null +++ b/src/LearnMore/Feature7.jsx @@ -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) => ( + + + {item.children.children.map(getChildrenToRender)} + + + )); + return ( +
+
+
+ {titleWrapper.children.map(getChildrenToRender)} +
+ + + {childrenToRender} + + +
+
+ ); +} + +export default Feature7; diff --git a/src/LearnMore/Pricing1.jsx b/src/LearnMore/Pricing1.jsx new file mode 100644 index 0000000..3efea08 --- /dev/null +++ b/src/LearnMore/Pricing1.jsx @@ -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 ( + + +
+
+ {name.children} +
+

+ {money.children} +

+
+
+ {content.children} +
+ +
+
+ + + ); + }; + + 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 ( +
+
+
+ {dataSource.titleWrapper.children.map(getChildrenToRender)} +
+ + + {childrenToRender} + + +
+
+ ); + } +} + +export default Pricing1; diff --git a/src/LearnMore/data.source.js b/src/LearnMore/data.source.js new file mode 100644 index 0000000..da7df0c --- /dev/null +++ b/src/LearnMore/data.source.js @@ -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: ( + <> +

协会规划

+ + ), + 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: ( + <> +

+
+

+ + ), + }, + money: { + className: 'pricing1-money k6niku34c3-editor_css', + children: ( + <> +

公益组织

+ + ), + }, + 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: ( + <> +

从

+ + ), + }, + }, + }, + }, + }, + { + 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: ( + <> +

+
+

+ + ), + }, + money: { + className: 'pricing1-money k6ninis0ok-editor_css', + children: ( + <> +

校内校外

+ + ), + }, + 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: ( + <> +

浙里

+ + ), + }, + }, + }, + }, + }, + { + 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: ( + <> +

+
+

+ + ), + }, + money: { + className: 'pricing1-money k6nip1p7ezh-editor_css', + children: ( + <> +

初心不忘

+ + ), + }, + 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: ( + <> +

出发

+ + ), + }, + }, + }, + }, + }, + ], + }, +}; +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: ( + <> +

+ 协会荣誉
+

+ + ), + }, + { + name: 'content', + className: 'feature7-title-content', + children: ( + <> +

+                   +                   +   ——仅摘取部分展示 +

+ + ), + }, + ], + }, + 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: ( + <> +

+ 2009年
+

+ + ), + }, + { + name: 'content', + className: 'feature7-block-content k6nj3s0akal-editor_css', + children: ( + <> +

+        协会获“ + 浙江省优秀志愿者服务队伍 + ”荣誉称号
+

+ + ), + }, + ], + }, + }, + { + 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: ( + <> +

+ 2009年
+

+ + ), + }, + { + name: 'content', + className: 'feature7-block-content k6nj3s0akal-editor_css', + children: ( + <> +

+ 协会获“浙江大学十大优秀志愿者服务集体”荣誉称号
+

+ + ), + }, + ], + }, + }, + { + 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: ( + <> +

+ 2009年
+

+ + ), + }, + { + name: 'content', + className: 'feature7-block-content k6nj3s0akal-editor_css', + children: ( + <> +

+ 荣获“ 2009年度浙江大学优秀青年志愿者服务项目”荣誉称号
+

+ + ), + }, + ], + }, + }, + { + 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: ( + <> +

+ 2010年
+

+ + ), + }, + { + name: 'content', + className: 'feature7-block-content k6nj3s0akal-editor_css', + children: ( + <> +

+ 协会由一星级社团跃升为三星级社团 +
+

+ + ), + }, + ], + }, + }, + { + 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: ( + <> +

2012年

+ + ), + }, + { + name: 'content', + className: 'feature7-block-content k6nj3s0akal-editor_css', + children: ( + <> +

+ 连续三年协会获评“浙江大学学生十佳社团” +
+

+ + ), + }, + ], + }, + }, + { + 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: ( + <> +

+ 2014年
+

+ + ), + }, + { + name: 'content', + className: 'feature7-block-content k6nj3s0akal-editor_css', + children: ( + <> +

+ 协会荣升为浙江大学四星级社团 +
+

+ + ), + }, + ], + }, + }, + { + 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: ( + <> +

2015年

+ + ), + }, + { + name: 'content', + className: 'feature7-block-content k6nj3s0akal-editor_css', + children: ( + <> +

+ 协会入选浙江大学最美公益服务集体 +
+

+ + ), + }, + ], + }, + }, + { + 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: ( + <> +

+ 2015年
+

+ + ), + }, + { + name: 'content', + className: 'feature7-block-content k6nj3s0akal-editor_css', + children: ( + <> +

+ 协会获社团文化节精品活动二等奖 +
+

+ + ), + }, + ], + }, + }, + { + 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: ( + <> +

+ 2015年
+

+ + ), + }, + { + name: 'content', + className: 'feature7-block-content k6nj3s0akal-editor_css', + children: ( + <> +

+ 协会获社团精品课程一等奖 +
+

+

+ +
+ +

+ + ), + }, + ], + }, + }, + { + 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: ( + <> +

+ 2015年
+

+ + ), + }, + { + name: 'content', + className: 'feature7-block-content k6nj3s0akal-editor_css', + children: ( + <> +

+ 协会暑期社会实践入选为校级重点社会实践项目 +
+

+ + ), + }, + ], + }, + }, + { + 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: ( + <> +

+ 2016年
+

+ + ), + }, + { + name: 'content', + className: 'feature7-block-content k6nj3s0akal-editor_css', + children: ( + <> +

+ 协会荣升为浙江大学五星级社团 +
+

+ + ), + }, + ], + }, + }, + { + 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: ( + <> +

2016年

+ + ), + }, + { + name: 'content', + className: 'feature7-block-content k6nj3s0akal-editor_css', + children: ( + <> +

+ 协会荣获“ 2015年-2016年浙江大学学生示范性社团”
+

+ + ), + }, + ], + }, + }, + ], + }, +}; +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: ( + <> +

+
+

+ + ), + className: 'title-h1', + }, + { + name: 'content', + children: ( + <> +

+ 每年协会成员都有多人进入竺可桢学院工高班和爱迪生班等荣誉班级就读 +

+ + ), + className: 'title-content k6njo4yb7gb-editor_css', + }, + { + name: 'content2', + children: ( + <> +

+ 此外在”中控杯“、”大学生数学建模竞赛“、”电路板焊接大赛“中多人获得优异奖项 +

+ + ), + className: 'title-content k6njr5kxpn-editor_css', + }, + ], + }, + button: { + className: '', + children: { a: { className: 'button', href: '/#/ticket', children: '立即报名' } }, + }, +}; diff --git a/src/LearnMore/documentation.md b/src/LearnMore/documentation.md new file mode 100644 index 0000000..ad58ffc --- /dev/null +++ b/src/LearnMore/documentation.md @@ -0,0 +1,4 @@ +# 如何使用： + +- umi 里如何使用[请查看](https://landing.ant.design/docs/use/umi)。 +- 其它脚手架使用[请查看](https://landing.ant.design/docs/use/getting-started)。 diff --git a/src/Home/index.jsx b/src/LearnMore/index.jsx similarity index 55% rename from src/Home/index.jsx rename to src/LearnMore/index.jsx index 355f138..23c9616 100644 --- a/src/Home/index.jsx +++ b/src/LearnMore/index.jsx @@ -2,12 +2,25 @@ /* eslint arrow-parens: 0 */ import React from 'react'; import { enquireScreen } from 'enquire-js'; - -import Teams1 from './Teams1'; - -import { Teams10DataSource } from './data.source'; +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; @@ -43,11 +56,36 @@ export default class Home extends React.Component { } render() { + const children = [ - , + , + , + , + , ]; diff --git a/src/LearnMore/less/antMotionStyle.less b/src/LearnMore/less/antMotionStyle.less new file mode 100644 index 0000000..def35ca --- /dev/null +++ b/src/LearnMore/less/antMotionStyle.less @@ -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'; \ No newline at end of file diff --git a/src/LearnMore/less/common.less b/src/LearnMore/less/common.less new file mode 100644 index 0000000..5cd8d98 --- /dev/null +++ b/src/LearnMore/less/common.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; +} diff --git a/src/LearnMore/less/content.less b/src/LearnMore/less/content.less new file mode 100644 index 0000000..c5ebf36 --- /dev/null +++ b/src/LearnMore/less/content.less @@ -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; + } + } + } +} diff --git a/src/LearnMore/less/content11.less b/src/LearnMore/less/content11.less new file mode 100644 index 0000000..70cf997 --- /dev/null +++ b/src/LearnMore/less/content11.less @@ -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; + } +} diff --git a/src/LearnMore/less/custom.less b/src/LearnMore/less/custom.less new file mode 100644 index 0000000..710e47c --- /dev/null +++ b/src/LearnMore/less/custom.less @@ -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); + } +} diff --git a/src/LearnMore/less/edit.less b/src/LearnMore/less/edit.less new file mode 100644 index 0000000..eff2888 --- /dev/null +++ b/src/LearnMore/less/edit.less @@ -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; +} diff --git a/src/LearnMore/less/feature7.less b/src/LearnMore/less/feature7.less new file mode 100644 index 0000000..f8f41b7 --- /dev/null +++ b/src/LearnMore/less/feature7.less @@ -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; + } + } + } +} diff --git a/src/LearnMore/less/pricing1.less b/src/LearnMore/less/pricing1.less new file mode 100644 index 0000000..ef73635 --- /dev/null +++ b/src/LearnMore/less/pricing1.less @@ -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; + } +} diff --git a/src/LearnMore/utils.js b/src/LearnMore/utils.js new file mode 100644 index 0000000..57cf9cb --- /dev/null +++ b/src/LearnMore/utils.js @@ -0,0 +1,18 @@ + +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'; + tag = item.href ? 'a' : tag; + let children = typeof item.children === 'string' && item.children.match(isImg) + ? React.createElement('img', { src: item.children, alt: 'img' }) + : 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); +}; diff --git a/src/components/History.js b/src/components/History.js new file mode 100644 index 0000000..1b32e25 --- /dev/null +++ b/src/components/History.js @@ -0,0 +1,93 @@ +import React from 'react'; +import { Button } from "antd"; +import { HashRouter, Route, Switch, Link } from "react-router-dom"; +class History extends React.Component { + render() { + return ( + +
+
+

+ 协会历史 +

+
浙江大学学生E志者协会的前身是1984年陈强先生创办的电器工程学院电气维修小组。
+
步入21世纪，为适应新时期学校教育体制的改革和管理模式的创新，在电气工程学院团委的大力支持和推动下，电器维修小组终于在2008年9月正式成为校级学生社团，面向全校吸纳志愿维修的志愿者，在全校范围内搭建以志愿维修为主体的服务平台，做志愿维修的践行者，做安全用电和节约用电的实践者和宣传者，做电力热点问题及电器电脑新尖问题的引领者。
+
在此后，协会抓紧机遇，在做好本职工作的同时，积极开拓其他公益志愿活动，服务广大师生与社会群众。多年来，协会还在组织架构、运行管理机制、文化建设、对外宣传等方面展开了积极的探索，开展了多项校级精品活动，提高了协会在校园文化中的知名度和影响力。
+
近五年来，浙江大学学生E志者协会凭借出色的表现，屡次获得“浙江大学校级优秀社团”、“校级十佳社团”、“青年志愿服务优秀集体”等荣誉称号。2015年4月，浙江大学E志者协会荣升为校四星级社团。2016年6月，浙江大学学生E志者协会获评“浙江大学学生示范性社团”，该奖项是浙江大学社团最高荣誉。
+
浙江大学学生E志者协会是浙江大学位数不多的拥有自己办公室的社团之一，为社团活动提供了良好载体，办公室位于紫金港校区东三教学楼200室，供社团日常值班维修和社团活动使用。
+
+ + +
+

+ 活动回顾 +

+ + +
校园维修&社区维修
+
协会日常值班维修，每月一次的学园义务维修和不定期开展的社区义务维修为同学们和社区居民的生活带来了极大的便利。
+
电脑电器维修知识课堂（社联精品课程）
+
协会每个长学期都会开办电脑电器维修知识精品课程，旨在传授对于电脑电器维修感兴趣的同学相关的知识并交流经验，方便同学们自主解决生活中遇到的简单的电脑电器故障。2015年秋冬学期精品课程荣获浙江大学学生社团精品课程评比一等奖。
+
浙江大学学生E志者协会30周年庆典暨电气工程学院公益论坛
+
协会向全校师生展示30年来E志者们在公益实践中取得的成果，同时也邀请到了校内大型公益组织的代表们分享他们的公益之路。活动一经举办，即在全校范围内掀起了热心公益实践
+
的巨大浪潮，激发了广大青年学子的投身公益事业的热情，点亮了大学生心中公益实践的明灯。
+
+
+

+ 协会日常 +

+
+ 浙江大学E志者协会，其宗旨为“以服务社会为己任，搭建电器维修爱好者交流平台，做安全用电和节约用电的实践者和宣传者，研究电力电气热点问题，为建设社会主义和谐社会贡献力量。”
+
+ 在过去的三十年里，协会一如既往的做好自己的最本职工作——免费电器维修，服务于广大的师生；并在各方面展开了积极的探索，开展了多项校级精品活动。 + 协会活动主要分为以下三大部分： + 
+
+
+

+ 一、公益活动 +

+ 
+
+
+
日常值班：协会在日常服务中，为满足校内师生日常维修需求、提高志愿维修质量与效率，特设立了值班制度，每天固定值班时间超过6小时，为同学们提供免费维修电脑电器的服务。在刚刚过去的2014-2015学年，协会在校内共进行电脑清灰247次，维修电脑硬件软件问题共计794次，维修大小电器共计145件，电脑维修成功率达到90.7%，电器维修成功率达到81.3%。
+
+ 线上交流：近三年，协会始终坚持通过各类平台发布指导购买笔记本的帖子，为广大新生以及全校师生提供购机基础知识普及以及免费的购机咨询。协会官方微信平台每周推送有关电脑电器及前沿科技的推文，在及时为全校师生解决电脑电器疑惑的过程中承担起普及科学技术知识的任务。 +
+
+ 社会实践：在80年代，我们就已经开展社区维修服务，也深入少年宫、社区夏令营等场所向青少年讲解相关知识。此外，我们还积极参加诸如长三角高校公益论坛等社会性的公益活动，并积极与在杭其他高校拓展合作关系，曾作为代表受邀奔赴浙江工商大学参加电脑维修交流峰会，并发表重要讲话。 +
+ 
+
+
+

+ 二、社团活动

+ 
+
+
+
浙江大学学生E志者协会努力追求发展成一家展现大学生风貌，发扬电气特色的优秀公益社团，开展如电路板焊接、全息投影等内容详实、寓教于乐的实践类活动。
+
协会每年推陈出新，举办了形式内容各异、特点鲜明的精品活动，如“电路的特技”，鼓励同学自行设计新奇的电路并进行自主焊接；“功放传心声”DIY大赛让同学现场焊接可传声的电路并传达自己的心声；“地球一小时”：向全校师生传播正确用电、合理节电小常识；“全息投影DIY烙铁画”：利用自制全息投影技术让同学体验用烙铁作画的乐趣……这一系列形式多样、独具协会特色的精品活动，吸引了一大批同学的参与，获得了同学们的一致好评。
+ 
+
+
+

三：创新创意

+ 
+
+
+
在日常维修中，我们基于网络、创新方法，通过理论和实践的结合提升自己的能力，如通过自主实践编写命令提示符批处理文件解决一些系统问题、通过沙箱模拟研究校园流行病毒攻击原理并找出源头。同时关注切合当代大学生实际的前沿技术，曾撰写《windows10测评报告》、《office2016评测》、《2016年暑假购机指南》文件，将所学前沿科技知识应用于日常维修实践。
+
同时每年，协会均会组织中高年级成员组队参加智能车竞赛，与智能车基地保持联系，在技术难题上交换经验。协会还举办废旧电子元件（电器）创意DIY大赛，面向全校同学征集创意，充分发挥动手实践能力，在校内推广电器创意创新的理念。协会还曾受邀参加中国大学生创意节（杭州赛区）活动，荣获“创意装饰奖”。
+
+
+ + + + +
+ + + + + ) + } +} +export default History \ No newline at end of file diff --git a/src/components/LearnMore.js b/src/components/LearnMore.js new file mode 100644 index 0000000..1609162 --- /dev/null +++ b/src/components/LearnMore.js @@ -0,0 +1,42 @@ +import React from "react"; +class LearnMore extends React.Component { + render() { + return ( + +
+

浙江大学学生E志者协会协会规划

+ +
+
三十年间，E志者协会作为一个公益组织，着眼实际，立足于电脑电器维修；开拓创新，积极学习应用前沿知识；扎根实践，广泛开展校内外志愿服务活动。
+
三十年间，E志者协会的公益之路渐行渐宽，从校内到校外，从服务师生到服务社会群众，从一个电器维修小组发展到如今如此规模的志愿者团队。
+
三十年间，E志者协会不忘初心，在E志者三十年志愿服务精神的传承中开拓进取，汲取课堂及课外前沿科学技术之精华，以服务社会为己任，传播先进公益文化为己责，致力于创建更为优秀的、能展现浙江大学青年学生风貌的公益服务团体。
+
我们在2015年提出了引领社团发展的E愿计划，核心是提高服务质量、开展合作交流和传播公益理念。在三十年发展的基础上，我们除了打算完善已有服务制度外，还规划着在紧密跟进时代步伐、 结合学校社团建设制度的情况下，推进与其他组织的合作交流，结合新技术大力建设协会网络平台以及专属APP，借助这些通道以及精品课程，完成我们协会从授人以鱼到授人以渔的关键过渡，同时也通过我们的身体力行以及新媒体的影响力传播公益理念，让公益理念的种子在每个人的心里萌发。
+ + + +
+

浙江大学学生E志者协会协会荣誉

+ +
+
2009年浙江大学学生E志者协会获“浙江省优秀志愿者服务队伍”荣誉称号
+
2009年浙江大学学生E志者协会获“浙江大学十大优秀志愿者服务集体”荣誉称号
+
2009年浙江大学学生E志者协会成为“浙江大学素质拓展基地候补基地”
+
2009年浙江大学学生E志者协会荣获“2009年度浙江大学优秀青年志愿者服务项目”荣誉称号
+
2010年浙江大学学生E志者协会被评为“2009-2010年度浙江大学校级优秀社团”
+
2010年末浙江大学学生E志者协会由一星级社团跃升为三星级社团
+
2010——2012年连续三年浙江大学学生E志者协会获评“浙江大学学生十佳社团”
+
2014年浙江大学学生E志者协会荣升为浙江大学四星级社团
+
2015年浙江大学学生E志者协会入选浙江大学最美公益服务集体
+
2015年浙江大学学生E志者协会获社团文化节精品活动二等奖
+
2015年浙江大学学生E志者协会获社团精品课程一等奖
+
2015年浙江大学学生E志者协会“小手共大手，点亮求知之光”暑期社会实践入选为校级重点社会实践项目
+
2016年浙江大学学生E志者协会荣获“2015——2016年度浙江大学学生示范性社团”（浙江大学社团最高荣誉），指导老师赵梓衫老师获“浙江大学十佳社团指导老师”，副会长田畅获“浙江大学优秀学生社团干部”
+
2016年浙江大学电路板焊接大赛中协会成员范俊崇、童丹妮同学获低年级组一等奖（第一名），汤继祥、田畅同学获高年级组一等奖（第一名）
+
2016年浙江大学第十一届“中控杯”机器人竞赛机器人竞赛购物挑战赛项目中协会电器部副部长王溯恺获一等奖
+
2016年美国大学生数学建模竞赛（MCM/ICM）中协会成员贺自怡等同学获M奖
+
另每年协会成员都有多人进入竺可桢学院工高班和爱迪生班等荣誉班级就读
+ + ) + } +} +export default LearnMore; \ No newline at end of file diff --git a/src/components/Login.js b/src/components/Login.js new file mode 100644 index 0000000..0634479 --- /dev/null +++ b/src/components/Login.js @@ -0,0 +1,45 @@ +import React, { useEffect, useState } from "react"; +import axios from "axios"; + + +function Login() { + + const [items, setItems] = useState([]); + useEffect(() => { + const fetchItems = async () => { + let fetchItems = []; + for (let i = 1; i <= 7; i++) { + let result = await axios( + 'api/info/' + i, + { + method: 'GET', + } + ); + console.log("2312"); + fetchItems.push({ + id: result.id + }) + + } + setItems(fetchItems); + } + }) + return ( +

+ { + items.map((item, i) => { + return ( +

+ + + {item.id} + + +
+ ); + }) + } +

+ ) +} +export default Login; \ No newline at end of file diff --git a/src/components/Sheet.js b/src/components/Sheet.js new file mode 100644 index 0000000..1215436 --- /dev/null +++ b/src/components/Sheet.js @@ -0,0 +1,377 @@ +import React from 'react' +import axios from 'axios' +import { Button, Form, Input,Icon, Radio, message } from 'antd' +import 'antd/dist/antd.css' +import { confirmAlert } from 'react-confirm-alert' +import 'react-confirm-alert/src/react-confirm-alert.css'; +import qs from 'qs'; + +class NewForm extends React.Component { + componentDidMount() { + this.loadLocalStorage(); + } + loadLocalStorage = () => { + const values = JSON.parse(localStorage.getItem('formCache') || '{}'); + this.props.form.setFieldsValue(values); + } + saveLocalStorage = () => { + const values = this.props.form.getFieldsValue(); + localStorage.setItem('formCache', JSON.stringify(values)); + } + handleSubmit = e => { + e.preventDefault(); + const validateFieldsAndScroll = this.props.form.validateFieldsAndScroll + confirmAlert({ + title: '提交报名表', + message: '您填写的表格已经保存在浏览器中，以后可以修改后覆盖提交。点击 OK 进行提交。', + buttons: [ + { + label: 'Yes', + onClick: () => { + validateFieldsAndScroll( + (err, values) => { + if (err) { + message.error('填写不正确，请按照提示修改'); + } + else { + console.log(values); + let addForm = async () => { + let result = await axios( + 'api/submit', + { + headers:{'Content-Type': 'application/x-www-form-urlencoded'}, + method: "POST", + data: qs.stringify({"dto":JSON.stringify(values)}) + } + ) + if (result.data.success) { + message.success("提交成功！后续的面试时间会以短信形式通知，期待你的加入！") + } + else { + message.error("提交失败！可能是网络问题。") + } + } + addForm(); + } + } + ) + } + }, + { + label: 'No', + onClick: () => {} + } + ] + }); + } + + render() { + const formItemLayout = { + labelCol: { + xs: { span: 24 }, + sm: { span: 8 }, + }, + wrapperCol: { + xs: { span: 24 }, + sm: { span: 12 }, + }, + }; + + const tailFormItemLayout = { + wrapperCol: { + xs: { + span: 24, + offset: 0, + }, + sm: { + span: 16, + offset: 8, + }, + }, + }; + + const { getFieldDecorator } = this.props.form; + + return ( +
+ + { + getFieldDecorator('name', { + rules: [ + { + required: true, + message: "请在此处填入你的姓名" + } + ] + })( + + ) + } + + + + {getFieldDecorator('id', { + rules: [ + { + required: true, + message: '请在此处填入你的学号', + }, + { pattern: /^[0-9]+$/, message: "混进去了数字以外的东西呀" } + + ], + })()} + + + + { + getFieldDecorator('sex', { + rules: [ + { + required: true, + message: '请选择你的性别' + } + ] + } + ) + ( + +
男
 +
女
 + + ) + } + + + + { + getFieldDecorator('grade', { + rules: [ + { + required: true, + message: '请选择你的年级' + + } + ] + } + ) + ( + + 大一 + 大二 + 大三 + 大四 + + ) + } + + + + { + getFieldDecorator('major', { + rules: [ + { + required: true, + message: '请在这里填入你的专业' + + } + ] + } + )( + + ) + } + + + + {getFieldDecorator('email', { + rules: [ + { + required: true, + message: '请在此处填入你的E-mail' + }, { type: 'email', message: "邮箱格式不正确" } + ], + })()} + + + + {getFieldDecorator('phone', { + rules: [ + { + required: true, + message: '请在此处填入你的电话号码', + }, + { pattern: /^1[345678]\d{9}$/, message: "手机号不太对呀" } + ], + })()} + + + + { + getFieldDecorator('firstWish', {rules: [ + { + required: true, + message: '请选择第一志愿' + } + ]})( + + 电脑部 + 电器部 + 文宣部 + 人资部 + 财务部 + + ) + } + + + + { + getFieldDecorator('secondWish', {rules: [ + { + required: true, + message: '请选择第二志愿' + } + ]})( + + 电脑部 + 电器部 + 文宣部 + 人资部 + 财务部 + + ) + } + + + + { + getFieldDecorator('adjustment', { + rules: [ + { + required: true, + message: '请选择是否服从调剂' + } + ] + } + )( + + 是 + 否 + + ) + } + + + + { + getFieldDecorator('firstReason', { + rules: [ + { + required: true, + message: '请填入你选择志愿的原因' + } + ] + } + )( + + ) + } + + + + { + getFieldDecorator('secondReason', { + rules: [ + { + required: true, + message: '请填入你选择志愿的原因' + } + ] + } + ) + ( + + ) + } + + + + { + getFieldDecorator('question1', { + rules: [ + { + required: true, + message: '请简单介绍一下你的特长' + } + ] + } + ) + ( + + ) + } + + + + { + getFieldDecorator('question2', { + rules: [ + { + required: true, + message: '请填入问题的回答' + } + ] + } + ) + ( + + ) + } + + + { + getFieldDecorator('time1', {initialValue:0,rules: [{required:true}]}) + } + + + { + getFieldDecorator('time2', {initialValue:0,rules: [{required:true}]}) + } + + + { + getFieldDecorator('time3', {initialValue:0,rules: [{required:true}]}) + } + + + { + getFieldDecorator('time4', {initialValue:0,rules: [{required:true}]}) + } + + + { + getFieldDecorator('time5', {initialValue:0,rules: [{required:true}]}) + } + + + { + getFieldDecorator('time6', {initialValue:0,rules: [{required:true}]}) + } + + + { + getFieldDecorator('time7', {initialValue:0,rules: [{required:true}]}) + } + + + + + +
+ ) + } + +} + +const Sheet = Form.create({})(NewForm); +export default Sheet; \ No newline at end of file diff --git a/src/index.css b/src/index.css index fe0f50b..ec2585e 100644 --- a/src/index.css +++ b/src/index.css @@ -11,225 +11,3 @@ code { font-family: source-code-pro, Menlo, Monaco, Consolas, 'Courier New', monospace; } -.titleh3 { - font-size: 20px; - font-weight: 400; - margin: 0; -} -.para{ - font-size: 14px; - word-wrap: break-word; - color: #333; - - margin-bottom: 15px; - margin-left: 10px; - text-indent: 2em; - line-height: 24px; - zoom: 1; - width: 1500px; -} -.tmp1{ - font-size: 30px; - background-image: -webkit-linear-gradient(left,blue,rgb(235, 168, 14) 20%,rgb(85, 171, 182) 30%, rgb(207, 55, 149) 40%, rgb(18, 224, 97) 50%,rgb(255, 204, 204) 60%,rgb(218, 12, 156) 70%,#66CCCC 80%,rgb(230, 54, 30) 90%,red 100%); - -webkit-text-fill-color: transparent;/* 将字体设置成透明色 */ - -webkit-background-clip: text;/* 裁剪背景图，使文字作为裁剪区域向外裁剪 */ - - -webkit-animation: masked-animation 4s linear infinite; - - - word-break: break-all; -} -.Button1{ - - text-align: center; - - font-size: 22px -} -.Button2{ - margin: 10px; - font-size: 18px -} -.Button3{ - margin: 10px; - font-size: 18px -} -.basicInfo-item.name { - width: 100px; - padding: 0 5px 1px 12px; - font-weight: 700; - overflow: hidden; - text-overflow: ellipsis; - white-space: nowrap; - word-wrap: normal; - color: #999; - background-color: gold -} -.bg{ - background-color: #E8E8FF; -} -.bg1{ - background-color: #D7FFF0; -} -.bg2{ - - background-color: #DDF3FF; - -} - .basicInfo-item.value { - zoom: 1; - font-size: 18px; - color: rgb(0, 0, 0); - width: 500px; - float: left; - position: relative; - word-break: break-all; - font-family: 'Franklin Gothic Medium', 'Arial Narrow', Arial, sans-serif -} -.background { - width: 100%; - height: 100vh; /* 重点一 */ - margin: auto; - background-image: url(./components/background.jpg); - background-repeat: no-repeat; - /* 重点二 */ - overflow: auto; - background-position:50% 50%; -} -.header { - overflow: hidden; - font-family: "黑体"; - color: black; -background-color : black; -text-shadow : rgba(255,255,255,0.5) 0 5px 6px, rgba(255,255,255,0.2) 1px 3px 3px; --webkit-background-clip : text; - padding: 13px 0px 8px 0px; - -} -.header_r_t { - - color:rgb(0, 0, 0); - - position: absolute; - right: 20px; - top:25px; - - border-radius: 5px; - - *float: right; - font-size: 17px -} -.row-one { - overflow: hidden; -} -.row-one-cont li { - position: relative; - float: left; - list-style: none; - width: 260px; - margin-right: 16px; -} -.row-one-cont .arc-tit { - margin: 15px 0; - height: 46px; -font-size: 22px; -background-image: -webkit-linear-gradient(left,blue,#66ffff 10%,rgb(204, 162, 63) 20%,rgb(85, 171, 182) 30%, rgb(207, 55, 149) 40%, #00FFFF 50%,rgb(255, 204, 204) 60%,rgb(218, 12, 156) 70%,#66CCCC 80%,rgb(230, 54, 30) 90%,rgb(201, 28, 15) 100%); - -webkit-text-fill-color: transparent;/* 将字体设置成透明色 */ - -webkit-background-clip: text;/* 裁剪背景图，使文字作为裁剪区域向外裁剪 */ - - -webkit-animation: masked-animation 4s linear infinite; - - line-height: 23px; - word-break: break-all; -} -.row-one-cont .are-cont { - font-size: 15px; - background-color: rgb(248, 250, 250); - color: rgb(0, 0, 0); - line-height: 28px; - padding-right: 15px; - padding-left: 15px; - word-break: break-all; - border : 1px solid ; - border-top: none; -} -.type1{ - font-size: 30px; -} -.footer .ft-bot { - clear: both; - *margin-top: 15px; -} -.footer p { - color: rgb(255, 255, 255); -} -.ft-bot { - text-align: center; - line-height: 20px; - border-top: 1px solid #3c6ba5; -} -.ft-info { - margin: 0px 0 0 80px; -} - -.ft-info span { - position: absolute ; - left: 200px; - top:630px; - white-space: nowrap; - - color: crimson -} -.ft-info1 span{ - position: absolute ; - left: 1200px; - top:630px; - white-space: nowrap; - color: blue - -} -.ft-info2 span{ - position: absolute ; - left: 200px; - top:680px; - white-space: nowrap; - color:green -} -.ft-info3 span{ - position: absolute ; - left: 1200px; - top:680px; - white-space: nowrap; - color: blueviolet -} -.title-prefix { - display: none; -} -.para-title.level-2 .title-text { - float: left; - display: block; - padding: 0 8px 0 18px; - line-height: 24px; - font-size: 22px; - font-weight: 400; - color: #000; - background: #fff; -} -.para-title.level-2 { - display: block; - clear: both; - zoom: 1; - overflow: hidden; - font-size: 20px; - border-left: 12px solid #4F9CEE; - line-height: 24px; - font-size: 22px; - font-weight: 400; - font-family: Microsoft YaHei,SimHei,Verdana; - position: relative; - margin: 35px 0 15px -30px; -} -.picture1{ - float: right; - width: 200px ; - height: 50px; -} \ No newline at end of file diff --git a/src/index.js b/src/index.js index db4c351..e310187 100644 --- a/src/index.js +++ b/src/index.js @@ -2,6 +2,7 @@ import React from 'react'; import ReactDOM from 'react-dom'; import './index.css'; import * as serviceWorker from './serviceWorker'; -import Entry from './Entry'; -ReactDOM.render(, document.getElementById('root')); + +import App from './App'; +ReactDOM.render(, document.getElementById('root')); serviceWorker.register(); diff --git a/src/picture/back1.jpg b/src/picture/back1.jpg new file mode 100644 index 0000000..902d172 Binary files /dev/null and b/src/picture/back1.jpg differ diff --git a/src/picture/background.jpg b/src/picture/background.jpg new file mode 100644 index 0000000..4568844 Binary files /dev/null and b/src/picture/background.jpg differ diff --git a/src/picture/history.jpg b/src/picture/history.jpg new file mode 100644 index 0000000..17d9a5c Binary files /dev/null and b/src/picture/history.jpg differ diff --git a/src/picture/jingpin1.jpg b/src/picture/jingpin1.jpg new file mode 100644 index 0000000..96a22ae Binary files /dev/null and b/src/picture/jingpin1.jpg differ diff --git a/src/picture/luntan1.jpg b/src/picture/luntan1.jpg new file mode 100644 index 0000000..8a6f004 Binary files /dev/null and b/src/picture/luntan1.jpg differ diff --git a/src/picture/richang1.jpg b/src/picture/richang1.jpg new file mode 100644 index 0000000..1e3fcc4 Binary files /dev/null and b/src/picture/richang1.jpg differ diff --git a/src/picture/richang2.jpg b/src/picture/richang2.jpg new file mode 100644 index 0000000..325cd27 Binary files /dev/null and b/src/picture/richang2.jpg differ diff --git a/src/picture/shequ1.jpg b/src/picture/shequ1.jpg new file mode 100644 index 0000000..488fdf9 Binary files /dev/null and b/src/picture/shequ1.jpg differ diff --git a/src/picture/xueshengjie1.jpg b/src/picture/xueshengjie1.jpg new file mode 100644 index 0000000..0b57d49 Binary files /dev/null and b/src/picture/xueshengjie1.jpg differ diff --git a/src/picture/xueyuan1.jpg b/src/picture/xueyuan1.jpg new file mode 100644 index 0000000..63b5995 Binary files /dev/null and b/src/picture/xueyuan1.jpg differ