Skip to content

M
mr-julyedu
Commit 44fd952c by xuzhenghua
Options

组件

parent 8510ff53
Showing with 163 additions and 153 deletions
.idea/workspace.xml
...@@ -2,11 +2,14 @@ ...@@ -2,11 +2,14 @@
<project version="4"> <project version="4">
<component name="ChangeListManager"> <component name="ChangeListManager">
<list default="true" id="60bc3527-5f9e-436f-8ed9-968e6eddd66e" name="Default Changelist" comment=""> <list default="true" id="60bc3527-5f9e-436f-8ed9-968e6eddd66e" name="Default Changelist" comment="">
<change beforePath="$PROJECT_DIR$/src/common/Course/course.scss" beforeDir="false" afterPath="$PROJECT_DIR$/src/common/Course/course.scss" afterDir="false" /> <change beforePath="$PROJECT_DIR$/src/common/carousel/carousel.js" beforeDir="false" />
<change beforePath="$PROJECT_DIR$/src/common/course/course.js" beforeDir="false" afterPath="$PROJECT_DIR$/src/common/course/course.js" afterDir="false" /> <change beforePath="$PROJECT_DIR$/src/common/carousel/carousel.scss" beforeDir="false" afterPath="$PROJECT_DIR$/src/common/carousel/carousel.scss" afterDir="false" />
<change beforePath="$PROJECT_DIR$/src/common/index.js" beforeDir="false" afterPath="$PROJECT_DIR$/src/common/index.js" afterDir="false" /> <change beforePath="$PROJECT_DIR$/src/common/index.js" beforeDir="false" afterPath="$PROJECT_DIR$/src/common/index.js" afterDir="false" />
<change beforePath="$PROJECT_DIR$/src/common/scroll/scroll.js" beforeDir="false" />
<change beforePath="$PROJECT_DIR$/src/common/scroll/topscroll.js" beforeDir="false" />
<change beforePath="$PROJECT_DIR$/src/components/Index/index.js" beforeDir="false" afterPath="$PROJECT_DIR$/src/components/Index/index.js" afterDir="false" /> <change beforePath="$PROJECT_DIR$/src/components/Index/index.js" beforeDir="false" afterPath="$PROJECT_DIR$/src/components/Index/index.js" afterDir="false" />
<change beforePath="$PROJECT_DIR$/src/components/Index/index.scss" beforeDir="false" afterPath="$PROJECT_DIR$/src/components/Index/index.scss" afterDir="false" /> <change beforePath="$PROJECT_DIR$/src/components/Index/index.scss" beforeDir="false" afterPath="$PROJECT_DIR$/src/components/Index/index.scss" afterDir="false" />
<change beforePath="$PROJECT_DIR$/src/styles/variable.scss" beforeDir="false" afterPath="$PROJECT_DIR$/src/styles/variable.scss" afterDir="false" />
</list> </list>
<ignored path="$PROJECT_DIR$/node_modules/" /> <ignored path="$PROJECT_DIR$/node_modules/" />
<ignored path="$PROJECT_DIR$/.tmp/" /> <ignored path="$PROJECT_DIR$/.tmp/" />
...@@ -20,60 +23,19 @@ ...@@ -20,60 +23,19 @@
</component> </component>
<component name="FileEditorManager"> <component name="FileEditorManager">
<leaf SIDE_TABS_SIZE_LIMIT_KEY="300"> <leaf SIDE_TABS_SIZE_LIMIT_KEY="300">
<file pinned="false" current-in-tab="false"> <file pinned="false" current-in-tab="true">
<entry file="file://$PROJECT_DIR$/src/components/Index/index.js"> <entry file="file://$PROJECT_DIR$/src/components/Index/index.js">
<provider selected="true" editor-type-id="text-editor"> <provider selected="true" editor-type-id="text-editor">
<state relative-caret-position="-467"> <state relative-caret-position="334">
<caret line="166" column="66" selection-start-line="166" selection-start-column="62" selection-end-line="166" selection-end-column="66" /> <caret line="126" column="28" lean-forward="true" selection-start-line="119" selection-start-column="30" selection-end-line="126" selection-end-column="28" />
<folding> <folding>
<element signature="e#0#39#0" expanded="true" /> <element signature="e#0#39#0" expanded="true" />
<element signature="e#275#1694#0" />
<element signature="e#1713#2342#0" /> <element signature="e#1713#2342#0" />
<element signature="e#3088#4531#0" />
</folding> </folding>
</state> </state>
</provider> </provider>
</entry> </entry>
</file> </file>
<file pinned="false" current-in-tab="false">
<entry file="file://$PROJECT_DIR$/src/common/Course/index.js">
<provider selected="true" editor-type-id="text-editor">
<state relative-caret-position="231">
<caret line="11" column="26" lean-forward="true" selection-start-line="11" selection-start-column="26" selection-end-line="11" selection-end-column="26" />
<folding>
<element signature="e#1006#1032#0" expanded="true" />
</folding>
</state>
</provider>
</entry>
</file>
<file pinned="false" current-in-tab="false">
<entry file="file://$PROJECT_DIR$/src/components/Index/index.scss">
<provider selected="true" editor-type-id="text-editor">
<state relative-caret-position="1077">
<caret line="199" column="26" lean-forward="true" selection-start-line="199" selection-start-column="26" selection-end-line="200" selection-end-column="21" />
</state>
</provider>
</entry>
</file>
<file pinned="false" current-in-tab="true">
<entry file="file://$PROJECT_DIR$/src/common/Course/course.scss">
<provider selected="true" editor-type-id="text-editor">
<state relative-caret-position="399">
<caret line="19" column="4" selection-start-line="19" selection-start-column="4" selection-end-line="19" selection-end-column="4" />
</state>
</provider>
</entry>
</file>
<file pinned="false" current-in-tab="false">
<entry file="file://$PROJECT_DIR$/src/styles/variable.scss">
<provider selected="true" editor-type-id="text-editor">
<state relative-caret-position="93">
<caret line="7" column="10" selection-start-line="7" selection-end-line="7" selection-end-column="10" />
</state>
</provider>
</entry>
</file>
</leaf> </leaf>
</component> </component>
<component name="FileTemplateManagerImpl"> <component name="FileTemplateManagerImpl">
...@@ -87,7 +49,6 @@ ...@@ -87,7 +49,6 @@
<component name="FindInProjectRecents"> <component name="FindInProjectRecents">
<findStrings> <findStrings>
<find>sass</find> <find>sass</find>
<find>setState</find>
<find>constructor</find> <find>constructor</find>
<find>icoName</find> <find>icoName</find>
<find>ReactDOM</find> <find>ReactDOM</find>
...@@ -104,11 +65,13 @@ ...@@ -104,11 +65,13 @@
<find>erji</find> <find>erji</find>
<find>345</find> <find>345</find>
<find>#09f</find> <find>#09f</find>
<find>color</find>
<find>react-native</find> <find>react-native</find>
<find>GridExample</find> <find>GridExample</find>
<find>map</find> <find>map</find>
<find>course-title</find> <find>course-title</find>
<find>props</find>
<find>setState</find>
<find>color</find>
</findStrings> </findStrings>
</component> </component>
<component name="Git.Settings"> <component name="Git.Settings">
...@@ -129,11 +92,18 @@ ...@@ -129,11 +92,18 @@
<option value="$PROJECT_DIR$/src/components/Index/course.js" /> <option value="$PROJECT_DIR$/src/components/Index/course.js" />
<option value="$PROJECT_DIR$/src/common/course/course.scss" /> <option value="$PROJECT_DIR$/src/common/course/course.scss" />
<option value="$PROJECT_DIR$/src/common/course/course.js" /> <option value="$PROJECT_DIR$/src/common/course/course.js" />
<option value="$PROJECT_DIR$/src/common/index.js" />
<option value="$PROJECT_DIR$/src/common/Course/index.js" /> <option value="$PROJECT_DIR$/src/common/Course/index.js" />
<option value="$PROJECT_DIR$/src/components/Index/index.js" />
<option value="$PROJECT_DIR$/src/components/Index/index.scss" />
<option value="$PROJECT_DIR$/src/common/Course/course.scss" /> <option value="$PROJECT_DIR$/src/common/Course/course.scss" />
<option value="$PROJECT_DIR$/src/common/carousel/carousel.scss" />
<option value="$PROJECT_DIR$/src/common/carousel/carousel.js" />
<option value="$PROJECT_DIR$/src/common/Carousel/index.js" />
<option value="$PROJECT_DIR$/src/common/Topsrroll/index.js" />
<option value="$PROJECT_DIR$/src/common/Topscroll/index.js" />
<option value="$PROJECT_DIR$/src/common/Scroll/index.js" />
<option value="$PROJECT_DIR$/src/common/index.js" />
<option value="$PROJECT_DIR$/src/styles/variable.scss" />
<option value="$PROJECT_DIR$/src/components/Index/index.scss" />
<option value="$PROJECT_DIR$/src/components/Index/index.js" />
</list> </list>
</option> </option>
</component> </component>
...@@ -165,7 +135,14 @@ ...@@ -165,7 +135,14 @@
<item name="mr-julyedu" type="b2602c69:ProjectViewProjectNode" /> <item name="mr-julyedu" type="b2602c69:ProjectViewProjectNode" />
<item name="mr-julyedu" type="462c0819:PsiDirectoryNode" /> <item name="mr-julyedu" type="462c0819:PsiDirectoryNode" />
<item name="src" type="462c0819:PsiDirectoryNode" /> <item name="src" type="462c0819:PsiDirectoryNode" />
<item name="common" type="462c0819:PsiDirectoryNode" /> <item name="components" type="462c0819:PsiDirectoryNode" />
</path>
<path>
<item name="mr-julyedu" type="b2602c69:ProjectViewProjectNode" />
<item name="mr-julyedu" type="462c0819:PsiDirectoryNode" />
<item name="src" type="462c0819:PsiDirectoryNode" />
<item name="components" type="462c0819:PsiDirectoryNode" />
<item name="Index" type="462c0819:PsiDirectoryNode" />
</path> </path>
<path> <path>
<item name="mr-julyedu" type="b2602c69:ProjectViewProjectNode" /> <item name="mr-julyedu" type="b2602c69:ProjectViewProjectNode" />
...@@ -243,12 +220,12 @@ ...@@ -243,12 +220,12 @@
<workItem from="1555481509516" duration="2393000" /> <workItem from="1555481509516" duration="2393000" />
<workItem from="1555494639819" duration="2193000" /> <workItem from="1555494639819" duration="2193000" />
<workItem from="1555583161462" duration="713000" /> <workItem from="1555583161462" duration="713000" />
<workItem from="1555596885912" duration="7849000" /> <workItem from="1555596885912" duration="10544000" />
</task> </task>
<servers /> <servers />
</component> </component>
<component name="TimeTrackingManager"> <component name="TimeTrackingManager">
<option name="totallyTimeSpent" value="28525000" /> <option name="totallyTimeSpent" value="31220000" />
</component> </component>
<component name="ToolWindowManager"> <component name="ToolWindowManager">
<frame x="0" y="0" width="1440" height="900" extended-state="6" /> <frame x="0" y="0" width="1440" height="900" extended-state="6" />
...@@ -374,13 +351,6 @@ ...@@ -374,13 +351,6 @@
</state> </state>
</provider> </provider>
</entry> </entry>
<entry file="file://$PROJECT_DIR$/src/common/carousel/carousel.scss">
<provider selected="true" editor-type-id="text-editor">
<state relative-caret-position="315">
<caret line="15" lean-forward="true" selection-start-line="15" selection-end-line="15" />
</state>
</provider>
</entry>
<entry file="file://$PROJECT_DIR$/src/components/study/study.scss"> <entry file="file://$PROJECT_DIR$/src/components/study/study.scss">
<provider selected="true" editor-type-id="text-editor" /> <provider selected="true" editor-type-id="text-editor" />
</entry> </entry>
...@@ -430,107 +400,142 @@ ...@@ -430,107 +400,142 @@
</state> </state>
</provider> </provider>
</entry> </entry>
<entry file="file://$PROJECT_DIR$/src/common/scroll/scroll.js"> <entry file="file://$PROJECT_DIR$/src/common/Scroll/topscroll.js">
<provider selected="true" editor-type-id="text-editor"> <provider selected="true" editor-type-id="text-editor">
<state relative-caret-position="105"> <state relative-caret-position="31">
<caret line="6" column="25" lean-forward="true" selection-start-line="6" selection-start-column="25" selection-end-line="6" selection-end-column="25" /> <caret line="4" lean-forward="true" selection-start-line="4" selection-end-line="4" />
<folding> <folding>
<element signature="e#0#39#0" expanded="true" /> <element signature="e#0#39#0" expanded="true" />
</folding> </folding>
</state> </state>
</provider> </provider>
</entry> </entry>
<entry file="file://$PROJECT_DIR$/src/common/scroll/topscroll.js"> <entry file="file://$PROJECT_DIR$/src/components/study/my-courses/index.js">
<provider selected="true" editor-type-id="text-editor"> <provider selected="true" editor-type-id="text-editor">
<state relative-caret-position="31"> <state relative-caret-position="321">
<caret line="4" lean-forward="true" selection-start-line="4" selection-end-line="4" /> <caret line="41" column="30" lean-forward="true" selection-start-line="41" selection-start-column="30" selection-end-line="41" selection-end-column="30" />
<folding> <folding>
<element signature="e#0#39#0" expanded="true" /> <element signature="e#0#25#0" expanded="true" />
</folding>
</state>
</provider>
</entry>
<entry file="file://$PROJECT_DIR$/src/common/VList/index.js">
<provider selected="true" editor-type-id="text-editor">
<state relative-caret-position="105">
<caret line="5" column="36" lean-forward="true" selection-start-line="5" selection-start-column="36" selection-end-line="5" selection-end-column="36" />
<folding>
<element signature="e#0#26#0" expanded="true" />
</folding> </folding>
</state> </state>
</provider> </provider>
</entry> </entry>
<entry file="file://$PROJECT_DIR$/src/styles/index.scss">
<provider selected="true" editor-type-id="text-editor" />
</entry>
<entry file="file://$PROJECT_DIR$/src/common/carousel/carousel.js"> <entry file="file://$PROJECT_DIR$/src/common/carousel/carousel.js">
<provider selected="true" editor-type-id="text-editor"> <provider selected="true" editor-type-id="text-editor">
<state relative-caret-position="189"> <state relative-caret-position="126">
<caret line="9" column="20" lean-forward="true" selection-start-line="9" selection-start-column="20" selection-end-line="9" selection-end-column="20" /> <caret line="6" column="32" selection-start-line="6" selection-start-column="32" selection-end-line="6" selection-end-column="32" />
<folding> <folding>
<element signature="e#0#39#0" expanded="true" /> <element signature="e#1#27#0" expanded="true" />
</folding> </folding>
</state> </state>
</provider> </provider>
</entry> </entry>
<entry file="file://$PROJECT_DIR$/src/common/index.js"> <entry file="file://$PROJECT_DIR$/src/common/Carousel/index.js">
<provider selected="true" editor-type-id="text-editor"> <provider selected="true" editor-type-id="text-editor">
<state relative-caret-position="63"> <state relative-caret-position="231">
<caret line="3" column="44" lean-forward="true" selection-start-line="3" selection-start-column="44" selection-end-line="3" selection-end-column="44" /> <caret line="11" column="2" lean-forward="true" selection-start-line="11" selection-start-column="2" selection-end-line="11" selection-end-column="2" />
<folding>
<element signature="e#0#26#0" expanded="true" />
</folding>
</state> </state>
</provider> </provider>
</entry> </entry>
<entry file="file://$PROJECT_DIR$/src/components/study/my-courses/index.js"> <entry file="file://$PROJECT_DIR$/src/common/Scroll/scroll.js">
<provider selected="true" editor-type-id="text-editor"> <provider selected="true" editor-type-id="text-editor">
<state relative-caret-position="321"> <state relative-caret-position="210">
<caret line="41" column="30" lean-forward="true" selection-start-line="41" selection-start-column="30" selection-end-line="41" selection-end-column="30" /> <caret line="10" column="49" selection-start-line="10" selection-start-column="49" selection-end-line="10" selection-end-column="49" />
<folding> <folding>
<element signature="e#0#25#0" expanded="true" /> <element signature="e#0#39#0" expanded="true" />
</folding> </folding>
</state> </state>
</provider> </provider>
</entry> </entry>
<entry file="file://$PROJECT_DIR$/src/common/VList/index.js"> <entry file="file://$PROJECT_DIR$/src/common/Course/index.js">
<provider selected="true" editor-type-id="text-editor"> <provider selected="true" editor-type-id="text-editor">
<state relative-caret-position="105"> <state relative-caret-position="63">
<caret line="5" column="36" lean-forward="true" selection-start-line="5" selection-start-column="36" selection-end-line="5" selection-end-column="36" /> <caret line="3" selection-start-line="3" selection-end-line="18" />
<folding> <folding>
<element signature="e#0#26#0" expanded="true" /> <element signature="e#0#26#0" expanded="true" />
</folding> </folding>
</state> </state>
</provider> </provider>
</entry> </entry>
<entry file="file://$PROJECT_DIR$/src/common/Course/index.js"> <entry file="file://$PROJECT_DIR$/src/common/Scroll/index.js">
<provider selected="true" editor-type-id="text-editor"> <provider selected="true" editor-type-id="text-editor">
<state relative-caret-position="231"> <state relative-caret-position="42">
<caret line="11" column="26" lean-forward="true" selection-start-line="11" selection-start-column="26" selection-end-line="11" selection-end-column="26" /> <caret line="2" column="32" lean-forward="true" selection-start-line="2" selection-start-column="32" selection-end-line="2" selection-end-column="32" />
<folding> <folding>
<element signature="e#1006#1032#0" expanded="true" /> <element signature="e#0#26#0" expanded="true" />
</folding> </folding>
</state> </state>
</provider> </provider>
</entry> </entry>
<entry file="file://$PROJECT_DIR$/src/components/Index/index.js"> <entry file="file://$PROJECT_DIR$/src/common/Topscroll/index.js">
<provider selected="true" editor-type-id="text-editor"> <provider selected="true" editor-type-id="text-editor">
<state relative-caret-position="-467"> <state relative-caret-position="63">
<caret line="166" column="66" selection-start-line="166" selection-start-column="62" selection-end-line="166" selection-end-column="66" /> <caret line="3" column="14" lean-forward="true" selection-start-line="3" selection-start-column="14" selection-end-line="3" selection-end-column="14" />
<folding> <folding>
<element signature="e#0#39#0" expanded="true" /> <element signature="e#0#39#0" expanded="true" />
<element signature="e#275#1694#0" />
<element signature="e#1713#2342#0" />
<element signature="e#3088#4531#0" />
</folding> </folding>
</state> </state>
</provider> </provider>
</entry> </entry>
<entry file="file://$PROJECT_DIR$/src/components/Index/index.scss"> <entry file="file://$PROJECT_DIR$/src/common/index.js">
<provider selected="true" editor-type-id="text-editor"> <provider selected="true" editor-type-id="text-editor">
<state relative-caret-position="1077"> <state relative-caret-position="147">
<caret line="199" column="26" lean-forward="true" selection-start-line="199" selection-start-column="26" selection-end-line="200" selection-end-column="21" /> <caret line="7" lean-forward="true" selection-start-line="7" selection-end-line="7" />
</state> </state>
</provider> </provider>
</entry> </entry>
<entry file="file://$PROJECT_DIR$/src/styles/index.scss"> <entry file="file://$PROJECT_DIR$/src/common/Carousel/carousel.scss">
<provider selected="true" editor-type-id="text-editor" /> <provider selected="true" editor-type-id="text-editor">
<state relative-caret-position="168">
<caret line="8" column="21" lean-forward="true" selection-start-line="8" selection-start-column="21" selection-end-line="8" selection-end-column="21" />
</state>
</provider>
</entry>
<entry file="file://$PROJECT_DIR$/src/common/Course/course.scss">
<provider selected="true" editor-type-id="text-editor">
<state relative-caret-position="63">
<caret line="3" column="20" lean-forward="true" selection-start-line="3" selection-start-column="20" selection-end-line="3" selection-end-column="20" />
</state>
</provider>
</entry> </entry>
<entry file="file://$PROJECT_DIR$/src/styles/variable.scss"> <entry file="file://$PROJECT_DIR$/src/styles/variable.scss">
<provider selected="true" editor-type-id="text-editor"> <provider selected="true" editor-type-id="text-editor">
<state relative-caret-position="93"> <state relative-caret-position="-315">
<caret line="7" column="10" selection-start-line="7" selection-end-line="7" selection-end-column="10" /> <caret line="6" column="11" lean-forward="true" selection-start-line="6" selection-start-column="11" selection-end-line="6" selection-end-column="11" />
</state> </state>
</provider> </provider>
</entry> </entry>
<entry file="file://$PROJECT_DIR$/src/common/Course/course.scss"> <entry file="file://$PROJECT_DIR$/src/components/Index/index.scss">
<provider selected="true" editor-type-id="text-editor"> <provider selected="true" editor-type-id="text-editor">
<state relative-caret-position="399"> <state relative-caret-position="341">
<caret line="19" column="4" selection-start-line="19" selection-start-column="4" selection-end-line="19" selection-end-column="4" /> <caret line="190" column="11" selection-start-line="190" selection-start-column="6" selection-end-line="190" selection-end-column="11" />
</state>
</provider>
</entry>
<entry file="file://$PROJECT_DIR$/src/components/Index/index.js">
<provider selected="true" editor-type-id="text-editor">
<state relative-caret-position="334">
<caret line="126" column="28" lean-forward="true" selection-start-line="119" selection-start-column="30" selection-end-line="126" selection-end-column="28" />
<folding>
<element signature="e#0#39#0" expanded="true" />
<element signature="e#1713#2342#0" />
</folding>
</state> </state>
</provider> </provider>
</entry> </entry>
......
src/common/scroll/scroll.js → src/common/Scroll/index.js
...@@ -33,3 +33,4 @@ class Scroll extends Component { ...@@ -33,3 +33,4 @@ class Scroll extends Component {
} }
export default Scroll export default Scroll
src/common/scroll/topscroll.js → src/common/Topscroll/index.js
import React, {Component} from 'react'; import React, {Component} from 'react';
import {Carousel, WingBlank} from 'antd-mobile'; import {Carousel, WingBlank} from 'antd-mobile';
class TopScroll extends Component { class Topscroll extends Component {
state = {} state = {}
render() { render() {
...@@ -45,4 +45,4 @@ class TopScroll extends Component { ...@@ -45,4 +45,4 @@ class TopScroll extends Component {
} }
} }
export default TopScroll export default Topscroll
src/common/carousel/carousel.js deleted 100644 → 0
import React, {Component} from 'react';
import './carousel.scss';
class Carousel extends Component {
render() {
return (
<div className='scroll-box'>
<ul className='scroll-list'>
{this.props.children}
</ul>
</div>
)
}
}
export default Carousel
src/common/carousel/carousel.scss
.scroll-box { .scroll-box {
width: 100%; width: 100%;
height: 92px;
overflow: auto; overflow: auto;
position: relative; position: relative;
margin-top: 15px; margin-top: 15px;
......
src/common/carousel/index.js 0 → 100644
import React from 'react';
import './carousel.scss'
const Carousel = (props) => {
return (
<div className='scroll-box'>
<ul className='scroll-list'>
{props.children}
</ul>
</div>
)
};
export default Carousel;
src/common/index.js
// 底部路由 // 底部路由
export { default as Nav } from './Nav' export { default as Nav } from './Nav'
export { default as VList } from './VList' export { default as VList } from './VList'
export { default as Course } from './Course' export { default as Course } from './Course' // 课程状态（试听 正在直播）+封面+标题+ 详情
\ No newline at end of file export { default as Carousel } from './Carousel' // 横向滚动
export { default as Topscroll } from './Topscroll' // 首页头部轮播
export { default as Scroll } from './Scroll' // 首页正常轮播图
src/components/Index/index.js
import React, {Component} from 'react'; import React, {Component} from 'react';
import {Course, VList} from '../../common' import {Course, Carousel,Scroll,Topscroll} from '../../common'
import Scroll from '../../common/scroll/scroll.js';
import TopScroll from '../../common/scroll/topscroll.js';
import Carousel from '../../common/carousel/carousel.js';
import './index.scss'; import './index.scss';
class Index extends Component { class Index extends Component {
state = { state = {
dataList: [ dataList: [
...@@ -42,8 +38,8 @@ class Index extends Component { ...@@ -42,8 +38,8 @@ class Index extends Component {
'teacher': 'wwwwww', 'teacher': 'wwwwww',
'time': '2343234', 'time': '2343234',
'isbuy': 1, 'isbuy': 1,
'price0': 100, 'price0': 200,
'price1': 1000 'price1': 2000
} }
], ],
tabdata: [ tabdata: [
...@@ -74,7 +70,7 @@ class Index extends Component { ...@@ -74,7 +70,7 @@ class Index extends Component {
const top = <div>333</div> const top = <div>333</div>
return ( return (
<div className='indexbox'> <div className='indexbox'>
<TopScroll data={this.state.dataList} height='168px'></TopScroll> <Topscroll data={this.state.dataList} height='168px'></Topscroll>
<div className="tabbox"> <div className="tabbox">
<ul> <ul>
{ {
...@@ -121,12 +117,14 @@ class Index extends Component { ...@@ -121,12 +117,14 @@ class Index extends Component {
<h2 className="title">新上好课</h2> <h2 className="title">新上好课</h2>
<ul className='course-detail'> <ul className='course-detail'>
{this.state.dataList.map((item, index) => { {this.state.dataList.map((item, index) => {
const top = ( // const top = (
<span className='audition'> // {
<i className={'iconfont iconerji'}></i> // item.isbuy === '1' && <span className='audition'>
试听 // <i className={'iconfont iconerji'}></i>
</span> // 试听
) // </span>
// }
// )
const bottom = ( const bottom = (
<p className="course-price"> <p className="course-price">
<span className="new">¥{item.price0}</span> <span className="new">¥{item.price0}</span>
......
src/components/Index/index.scss
.indexbox { .indexbox {
overflow: hidden; overflow: hidden;
background-color: #fff; background-color: $bg_fff;
} }
.am-wingblank { .am-wingblank {
...@@ -39,7 +39,7 @@ ...@@ -39,7 +39,7 @@
} }
span { span {
color: #606060; color: $color_606;
font-size: 13px; font-size: 13px;
display: block; display: block;
margin-top: 10px; margin-top: 10px;
...@@ -57,7 +57,7 @@ ...@@ -57,7 +57,7 @@
height: 100%; height: 100%;
margin-right: 20px; margin-right: 20px;
box-shadow: 0px 0px 5px 0px rgba(0, 0, 0, 0.1); box-shadow: 0px 0px 5px 0px rgba(0, 0, 0, 0.1);
background-color: #fff; background-color: $bg_fff;
border: 1px solid rgba(0, 0, 0, .1); border: 1px solid rgba(0, 0, 0, .1);
border-radius: 5px; border-radius: 5px;
...@@ -82,18 +82,18 @@ ...@@ -82,18 +82,18 @@
.item-title { .item-title {
font-size: 15px; font-size: 15px;
color: #333; color: $color_333;
} }
.item-teacher { .item-teacher {
font-size: 13px; font-size: 13px;
color: #555; color: $color_555;
margin-top: 6px; margin-top: 6px;
} }
.item-time { .item-time {
font-size: 12px; font-size: 12px;
color: #999; color: $color_999;
margin-top: 11px; margin-top: 11px;
} }
} }
...@@ -121,12 +121,12 @@ ...@@ -121,12 +121,12 @@
.title { .title {
font-size: 15px; font-size: 15px;
color: #333; color: $color_333;
display: inline-block; display: inline-block;
} }
.more { .more {
color: #09f; color: $active;
font-size: 12px; font-size: 12px;
float: right; float: right;
} }
...@@ -141,13 +141,13 @@ ...@@ -141,13 +141,13 @@
margin-bottom: 50px; margin-bottom: 50px;
p { p {
color: #555; color: $color_555;
font-size: 15px; font-size: 15px;
margin-bottom: 10px; margin-bottom: 10px;
} }
span { span {
color: #999; color: $color_999;
font-size: 12px; font-size: 12px;
} }
} }
...@@ -165,9 +165,9 @@ ...@@ -165,9 +165,9 @@
width: 54px; width: 54px;
height: 18px; height: 18px;
line-height: 18px; line-height: 18px;
background-color: #09f; background-color: $bg_active;
font-size: 12px; font-size: 12px;
color: #fff; color: $white;
text-align: center; text-align: center;
border-radius: 1px; border-radius: 1px;
...@@ -183,12 +183,12 @@ ...@@ -183,12 +183,12 @@
margin-top: 15px; margin-top: 15px;
.new { .new {
color: #FF2121; color: $red;
font-size: 15px; font-size: 15px;
} }
.old { .old {
color: #999; color: $color_999;
font-size: 12px; font-size: 12px;
display: inline-block; display: inline-block;
margin-left: 15px; margin-left: 15px;
...@@ -201,12 +201,18 @@ ...@@ -201,12 +201,18 @@
margin-top: 15px; margin-top: 15px;
width: 61px; width: 61px;
height: 18px; height: 18px;
background-color: #09f; background-color: $bg_active;
border-radius: 9px; border-radius: 9px;
color: #fff; color: $white;
font-size: 12px; font-size: 12px;
text-align: center; text-align: center;
line-height: 18px; line-height: 18px;
} }
} }
/*
横向滚动
*/
.scroll-box {
height: 92px;
}
src/styles/variable.scss
...@@ -9,6 +9,7 @@ $color_333: #333; ...@@ -9,6 +9,7 @@ $color_333: #333;
$color_555: #555; $color_555: #555;
$color_666: #666; $color_666: #666;
$color_999: #999; $color_999: #999;
$color_606: #606060;
/* /*
......
Markdown is supported
0% or
You are about to add 0 people to the discussion. Proceed with caution.
Finish editing this message first!
Please register or to comment