Browse Source

'首页切换学龄课程表渲染修改'

Rorschach 5 years ago
parent
commit
2e7fbdab8f
3 changed files with 76 additions and 35 deletions
  1. 2 4
      pages/BasePage.js
  2. 72 31
      pages/components/MainPage.js
  3. 2 0
      pages/components/SchedulePage.js

+ 2 - 4
pages/BasePage.js

@@ -45,12 +45,10 @@ export default class BasePage extends Component<Props> {
     return width;
   }
 
-  toNextPage= (params) => {
+  toNextPage= (params,obj) => {
     //跳转之前移除当前界面的监听
     this.removeListener();
-    console.log('跳转参数',params)
-    console.log(this.props)
-    this.props.navigation.navigate(params);
+    this.props.navigation.navigate(params,obj);
   }
   Toast(params) {
     AndroidUtil.showToast(params, AndroidUtil.SHORT);

+ 72 - 31
pages/components/MainPage.js

@@ -41,7 +41,11 @@ export default class MainPage extends BasePage {
   }
 
   componentDidMount() {
-    LibraryUrl.getIndex('PRESCHOOL').success(res => {
+    this.updateRender('PRIMARY_SCHOOL')
+  }
+
+  updateRender(index) {
+    LibraryUrl.getIndex(index).success(res => {
       console.log(res)
       const monthTopicTitle = res.data.monthTopic.zone.title;
       const monthTopicScroll = res.data.monthTopic.zoneCourseVOList;
@@ -57,6 +61,7 @@ export default class MainPage extends BasePage {
       // console.log(typeof listData)
       // console.log(listData)
       // console.log(listData.length)
+      let scheduleWeek = schedule[0].featureMap ? schedule[0].featureMap.weekSeq : '1'
       this.setState({
         // listData: listData.length? listData : [],
         hotCourse,
@@ -64,9 +69,12 @@ export default class MainPage extends BasePage {
         monthTopicScroll,
         schedule,
         recommend,
-        banner
+        banner,
+        scheduleWeek
       })
       console.log(this.state.banner)
+    }).fail(() => {
+      alert(1111)
     })
   }
 
@@ -79,24 +87,28 @@ export default class MainPage extends BasePage {
     recommend: [],
     listData: [],
     banner: [],
-    currentSwitch: { title: '学前', param: 'PRESCHOOL' },
+    currentSwitch: { title: '小学', param: 'PRIMARY_SCHOOL' },
     switchList: [
-      { title: '幼儿园', param: 'KINDERGARTEN' },
+      // { title: '幼儿园', param: 'KINDERGARTEN' },
       { title: '学前', param: 'PRESCHOOL' },
       { title: '小学', param: 'PRIMARY_SCHOOL' },
       { title: '中学', param: 'MIDDLE_SCHOOL' },
-    ]
+    ],
+    scheduleWeek: '1'
   }
 
   renderBtn = (item, index) => {
     return (
-      this.state.currentSwitch.param === item.param
-        ?
-        null
-        :
-        <TouchableOpacity onPress={() => this.switchGrade(index)} key={index} style={index === 1 ? styles.gradeItemMid : styles.gradeItem}>
-          <Text style={styles.gradeText}>{item.title}</Text>
-        </TouchableOpacity>
+      // this.state.currentSwitch.param === item.param
+      //   ?
+      //   null
+      //   :
+      //   <TouchableOpacity onPress={() => this.switchGrade(index)} key={index} style={index === 1 ? styles.gradeItemMid : styles.gradeItem}>
+      //     <Text style={styles.gradeText}>{item.title}</Text>
+      //   </TouchableOpacity>
+      <TouchableOpacity onPress={() => this.switchGrade(index)} key={index} style={index === 1 ? styles.gradeItemMid : styles.gradeItem}>
+        <Text style={styles.gradeText}>{item.title}</Text>
+      </TouchableOpacity>
     )
   }
 
@@ -106,6 +118,8 @@ export default class MainPage extends BasePage {
       currentSwitch: obj
     })
     this.hideGradeMenu()
+    // if (obj.param === this.state.currentSwitch.param) return
+    this.updateRender(obj.param)
   }
 
   render() {
@@ -122,7 +136,7 @@ export default class MainPage extends BasePage {
           renderSectionHeader={this.sectionTitle}
           onScroll={this.hideGradeMenu}
         /> */}
-        <ScrollView style={{ height: Dimensions.height }} showsVerticalScrollIndicator = {false} onScroll={this.hideGradeMenu} >
+        <ScrollView style={{ height: Dimensions.height }} showsVerticalScrollIndicator={false} onScroll={this.hideGradeMenu} >
           {this.headerorfooterComponent()}
           {this.getSwiperElement()}
           {this.getScheduleElement()}
@@ -138,15 +152,6 @@ export default class MainPage extends BasePage {
                 ...styles.callUpGrade,
                 opacity: this.state.fadeAnim
               }}>
-              {/* <TouchableOpacity style={styles.gradeItem}>
-                <Text style={styles.gradeText}>小学</Text>
-              </TouchableOpacity>
-              <TouchableOpacity style={styles.gradeItemMid}>
-                <Text style={styles.gradeText}>学前</Text>
-              </TouchableOpacity>
-              <TouchableOpacity style={styles.gradeItem}>
-                <Text style={styles.gradeText}>中学</Text>
-              </TouchableOpacity> */}
               {this.state.switchList.map((item, index) => this.renderBtn(item, index))}
             </Animated.View>
           ) : (
@@ -231,6 +236,7 @@ export default class MainPage extends BasePage {
   // 渲染课程表
   getScheduleElement() {
     let renderScheduleItem = (item, index) => {
+      const id = item.boothId
       return (
         <TouchableOpacity
           style={{
@@ -238,23 +244,50 @@ export default class MainPage extends BasePage {
             height: Dimensions.getHeight(86),
             marginRight: 12
           }}
-          onPress={() => this.toNextPage('SchedulePage')}
+          onPress={() => this.toNextPage('SchedulePage',{id})}
           key={index}
           activeOpacity={1}
         >
-          <Image
+          <ImageBackground
             source={{
               uri: item.boothContent
             }}
             key={index}
             style={{
               flex: 1,
-              justifyContent: "center",
-              alignItems: "center",
+              // justifyContent: "center",
+              // alignItems: "center",
               borderRadius: 10
-
             }}
-          />
+          >
+            {
+              item.operationContent === 'KINDERGARTE'
+                ?
+                null
+                :
+                <View style={{
+                  width: Dimensions.getWidth(90),
+                  height: Dimensions.getHeight(45),
+                  marginLeft: Dimensions.getWidth(15),
+                  marginTop: Dimensions.getHeight(15),
+
+                  justifyContent: 'center',
+                  alignItems: 'center'
+                }}>
+                  <Text style={{
+                    color: '#fff',
+                    fontSize: 18,
+                  }}>{item.title}</Text>
+                  <Text
+                    style={{
+                      color: '#fff',
+                      fontSize: 18,
+                    }}
+                  >{item.summary}</Text>
+                </View>
+            }
+
+          </ImageBackground>
         </TouchableOpacity>
       )
     }
@@ -266,8 +299,8 @@ export default class MainPage extends BasePage {
           height: Dimensions.getHeight(160),
         }}
       >
-        <TopicTitle title={'课程表:第一周'} ifTubeShow={true} />
-        <View
+        <TopicTitle title={`课程表:第${this.state.scheduleWeek}周`} ifTubeShow={true} />
+        {/* <View
           style={{
             flex: 2,
             flexDirection: "row",
@@ -276,7 +309,15 @@ export default class MainPage extends BasePage {
           }}
         >
           {this.state.schedule.map((item, index) => renderScheduleItem(item, index))}
-        </View>
+        </View> */}
+        <FlatList
+          data={this.state.schedule}
+          horizontal={true}
+          style={{ paddingLeft: '3.2%' }}
+          renderItem={({ item, index }) => renderScheduleItem(item, index)}
+          keyExtractor={(item, index) => index.toString()}
+          showsHorizontalScrollIndicator={false}
+        />
       </View>
     );
   }

+ 2 - 0
pages/components/SchedulePage.js

@@ -202,6 +202,8 @@ export default class SchedulePage extends BasePage {
     BackHandler.removeEventListener("hardwareBackPress", this.onBackAndroid);
   }
   componentDidMount() {
+    const { id } = this.props.navigation.state.params;
+    alert(id)
     let colorTemp = '';
     let colorIndexTemp = 0;
     const colorList = this.state.colorList;