Skip to content

GitLab

I
ios-ipad学生端
Commit c380b669 authored by zhangkaixuan11's avatar zhangkaixuan11
Browse files
Options

先提交一版

parent ba14a91c
Hide whitespace changes
Inline Side-by-side
Showing with 1163 additions and 10060 deletions
App.tsx
View file @ c380b669
...@@ -18,15 +18,18 @@ import NavHeader from './src/components/NavHeader'; ...@@ -18,15 +18,18 @@ import NavHeader from './src/components/NavHeader';
import Login from './src/components/Login'; import Login from './src/components/Login';
import Reset from './src/components/Reset'; import Reset from './src/components/Reset';
// 业务逻辑组件 [首页] // // 业务逻辑组件 [首页]
import HomeIndex from './src/home/Index'; // import HomeIndex from './src/home/Index';
// 业务逻辑组件 [班级] // // 业务逻辑组件 [班级]
import CourseIndex from './src/course/Index'; // import CourseIndex from './src/course/Index';
import Comment from './src/course/Comment'; // import Comment from './src/course/Comment';
// 业务逻辑组件 [我的] // // 业务逻辑组件 [我的]
import MineIndex from './src/mine/Index'; // import MineIndex from './src/mine/Index';
// 改版首页
import HomeIndex from './src/home202201/Index';
// 业务逻辑组件 [直播] // 业务逻辑组件 [直播]
import LiveIndex from './src/live/Index'; import LiveIndex from './src/live/Index';
...@@ -186,7 +189,7 @@ export default class App extends Component { ...@@ -186,7 +189,7 @@ export default class App extends Component {
// Orientation.lockToLandscape(); // Orientation.lockToLandscape();
// setTimeout(this.getMemberInfo, 2000); // setTimeout(this.getMemberInfo, 2000);
IdleTimerManager.setIdleTimerDisabled(true); IdleTimerManager.setIdleTimerDisabled(true);
this.checkUserInfo(); // this.checkUserInfo();
DeviceEventEmitter.addListener('showLogin', (data) => { DeviceEventEmitter.addListener('showLogin', (data) => {
this.setState(data); this.setState(data);
}) })
...@@ -274,18 +277,20 @@ export default class App extends Component { ...@@ -274,18 +277,20 @@ export default class App extends Component {
render () { render () {
return ( return (
<SafeAreaProvider> <SafeAreaProvider>
<StatusBar <StatusBar backgroundColor='rgba(0,0,0,0)' translucent={true} hidden={true}/>
translucent={true}
backgroundColor={"rgba(0,0,0,0)"}
/>
<NavigationContainer theme={customTheme} ref={(navigationRef) => { <NavigationContainer theme={customTheme} ref={(navigationRef) => {
this.navigationRef = navigationRef; this.navigationRef = navigationRef;
}}> }}>
<Root.Navigator mode="modal" initialRouteName="Main"> <Root.Navigator mode="modal" initialRouteName="Main">
<Root.Screen {/* <Root.Screen
name="Main" name="Main"
component={MainStack} component={MainStack}
options={{ headerShown: false }} options={{ headerShown: false }}
/> */}
<Root.Screen
name="HomeIndex"
component={HomeIndex}
options={{ headerShown: false }}
/> />
<Root.Screen <Root.Screen
name="Login" name="Login"
......
Constants.js
View file @ c380b669
...@@ -3,266 +3,284 @@ import {Dimensions, StatusBar, Platform} from 'react-native'; ...@@ -3,266 +3,284 @@ import {Dimensions, StatusBar, Platform} from 'react-native';
const designWidth = 1024; const designWidth = 1024;
const screenWidth = Dimensions.get('window').height; const screenWidth = Dimensions.get('window').height;
const screenHeight = Dimensions.get('window').width; const screenHeight = Dimensions.get('window').width;
const unitWidth = screenHeight / designWidth; const unitWidth = screenHeight / designWidth;
import {
StyleSheet as RnStyleSheet,
ViewStyle,
TextStyle,
ImageStyle,
} from 'react-native';
type StyleProps = Partial<ViewStyle | TextStyle | ImageStyle>;
const StyleSheet = {
create(styles: {[className: string]: StyleProps}) {
return RnStyleSheet.create(styles);
},
};
console.log(screenWidth, screenHeight, unitWidth, 'unitWidth');
export default { export default {
// apiPath: 'http://121.36.221.250:3001/mock/11', // apiPath: 'http://121.36.221.250:3001/mock/11',
apiPath: 'http://education-tst.sinocanada.cn', apiPath: 'http://education-tst.sinocanada.cn',
imgPath: '', imgPath: '',
StyleSheet,
token: '', token: '',
numOfPage: 10, numOfPage: 10,
baseFontSize: 15, baseFontSize: 15,
width: screenWidth,
width: screenWidth, height: screenHeight,
height: screenHeight, unitWidth: unitWidth,
unitWidth: unitWidth, statusBarHeight: getStatusBarHeight(),
statusBarHeight: getStatusBarHeight(), safeAreaBottomHeight: isIphoneX() ? 34 : 0,
safeAreaBottomHeight: isIphoneX() ? 34 : 0,
homeCates: [ homeCates: [
{ {
title: '推荐', title: '推荐',
},
{
title: '政声',
},
{
title: '民生',
},
{
title: '发现',
},
{
title: '专题',
},
],
storeData: async (key, value) => {
try {
return await AsyncStorage.setItem(key, value);
} catch (e) {
// saving error
}
},
readData: async (key) => {
try {
return await AsyncStorage.getItem(key);
} catch(e) {
// error reading value
}
},
removeData: async (key) => {
try {
await AsyncStorage.removeItem(key);
} catch (error) {
// Error saving data
}
},
getParam: function (json) {
if (!json) return ''
return cleanArray(Object.keys(json).map(key => {
if (json[key] === undefined) return ''
return encodeURIComponent(key) + '=' +
encodeURIComponent(json[key])
})).join('&')
},
get: function (request) {
let url = request.host;
let keys = Object.keys(request.params);
let params = [];
keys.map((key, index) => {
params.push(key + '=' + request.params[key]);
});
url += '?' + params.join('&');
// console.log(url, request);
return fetch(url, {
mode: "cors",
credentials: 'include',
headers: {
'token': this.token,
},
});
},
getWithBodyParams: function (request) {
let url = request.host;
let keys = Object.keys(request.params);
let params = [];
keys.map((key, index) => {
params.push(key + '=' + request.params[key]);
});
url += '?' + params.join('&');
// console.log(url, request);
return fetch(url, {
mode: "cors",
credentials: 'include',
method:'GET',
headers: {
'token': this.token,
},
});
},
post: function (request) {
let url = request.host;
let data = request.params;
return fetch(url, {
method:'POST',
mode: "cors",
credentials: 'include',
headers: {
'Content-Type': 'application/x-www-form-urlencoded',
},
body: this.getParam(data),
});
}, },
postJSON: function (request) { {
let url = request.host; title: '政声',
let data = request.params;
return fetch(url, {
method:'POST',
mode: "cors",
credentials: 'include',
headers: {
'Content-Type': 'application/json',
'apptype': "ipad"
},
body: JSON.stringify(data),
});
}, },
putJSON: function (request) { {
let url = request.host; title: '民生',
let data = request.params;
return fetch(url, {
method:'PUT',
mode: "cors",
credentials: 'include',
headers: {
'Content-Type': 'application/json',
'apptype': "ipad"
},
body: JSON.stringify(data),
});
}, },
postWithToken: function (request) { {
let url = request.host; title: '发现',
let data = request.params;
// console.log(url, this.token, data);
return fetch(url, {
method:'POST',
mode: "cors",
credentials: 'include',
headers: {
'token': this.token,
},
body: this.getParam(data),
});
}, },
postJSONWithToken: function (request) { {
let url = request.host; title: '专题',
let data = request.params;
return fetch(url, {
method:'POST',
mode: "cors",
credentials: 'include',
headers: {
'token': this.token,
'Content-Type': 'application/json',
},
body: JSON.stringify(data),
});
}, },
putJSONWithToken: function (request) { ],
let url = request.host;
let data = request.params; storeData: async (key, value) => {
console.log(url, this.token, data); try {
return fetch(url, { return await AsyncStorage.setItem(key, value);
method:'PUT', } catch (e) {
mode: "cors", // saving error
credentials: 'include',
headers: {
'token': this.token,
'Content-Type': 'application/json',
},
body: JSON.stringify(data),
});
},
patchJSONWithToken: function (request) {
let url = request.host;
let data = request.params;
console.log(url, this.token, data, JSON.stringify(data));
return fetch(url, {
method:'PATCH',
mode: "cors",
credentials: 'include',
headers: {
'token': this.token,
'Content-Type': 'application/json',
},
body: JSON.stringify(data),
});
},
deleteJSONWithToken: function (request) {
let url = request.host;
let data = request.params;
return fetch(url, {
method:'delete',
mode: "cors",
credentials: 'include',
headers: {
'token': this.token,
'Content-Type': 'application/json',
},
body: JSON.stringify(data),
});
},
uploadFile: function (request) {
let url = request.host;
let formData = new FormData();
let file = {uri: request.params.file, type: 'multipart/form-data', name: 'jpg'};
formData.append("files", file);
if (request.params.params) {
formData.append("params", request.params.params);
}
// console.log(formData);
return fetch(url, {
method:'POST',
mode: "cors",
credentials: 'include',
headers:{
'token': this.token,
'Content-Type':'multipart/form-data',
},
body: formData,
});
} }
} },
readData: async (key) => {
try {
return await AsyncStorage.getItem(key);
} catch (e) {
// error reading value
}
},
removeData: async (key) => {
try {
await AsyncStorage.removeItem(key);
} catch (error) {
// Error saving data
}
},
getParam: function (json) {
if (!json) return '';
return cleanArray(
Object.keys(json).map((key) => {
if (json[key] === undefined) return '';
return encodeURIComponent(key) + '=' + encodeURIComponent(json[key]);
}),
).join('&');
},
get: function (request) {
let url = request.host;
let keys = Object.keys(request.params);
let params = [];
keys.map((key, index) => {
params.push(key + '=' + request.params[key]);
});
url += '?' + params.join('&');
// console.log(url, request);
return fetch(url, {
mode: 'cors',
credentials: 'include',
headers: {
token: this.token,
},
});
},
getWithBodyParams: function (request) {
let url = request.host;
let keys = Object.keys(request.params);
let params = [];
keys.map((key, index) => {
params.push(key + '=' + request.params[key]);
});
url += '?' + params.join('&');
// console.log(url, request);
return fetch(url, {
mode: 'cors',
credentials: 'include',
method: 'GET',
headers: {
token: this.token,
},
});
},
post: function (request) {
let url = request.host;
let data = request.params;
return fetch(url, {
method: 'POST',
mode: 'cors',
credentials: 'include',
headers: {
'Content-Type': 'application/x-www-form-urlencoded',
},
body: this.getParam(data),
});
},
postJSON: function (request) {
let url = request.host;
let data = request.params;
return fetch(url, {
method: 'POST',
mode: 'cors',
credentials: 'include',
headers: {
'Content-Type': 'application/json',
apptype: 'ipad',
},
body: JSON.stringify(data),
});
},
putJSON: function (request) {
let url = request.host;
let data = request.params;
return fetch(url, {
method: 'PUT',
mode: 'cors',
credentials: 'include',
headers: {
'Content-Type': 'application/json',
apptype: 'ipad',
},
body: JSON.stringify(data),
});
},
postWithToken: function (request) {
let url = request.host;
let data = request.params;
// console.log(url, this.token, data);
return fetch(url, {
method: 'POST',
mode: 'cors',
credentials: 'include',
headers: {
token: this.token,
},
body: this.getParam(data),
});
},
postJSONWithToken: function (request) {
let url = request.host;
let data = request.params;
return fetch(url, {
method: 'POST',
mode: 'cors',
credentials: 'include',
headers: {
token: this.token,
'Content-Type': 'application/json',
},
body: JSON.stringify(data),
});
},
putJSONWithToken: function (request) {
let url = request.host;
let data = request.params;
console.log(url, this.token, data);
return fetch(url, {
method: 'PUT',
mode: 'cors',
credentials: 'include',
headers: {
token: this.token,
'Content-Type': 'application/json',
},
body: JSON.stringify(data),
});
},
patchJSONWithToken: function (request) {
let url = request.host;
let data = request.params;
console.log(url, this.token, data, JSON.stringify(data));
return fetch(url, {
method: 'PATCH',
mode: 'cors',
credentials: 'include',
headers: {
token: this.token,
'Content-Type': 'application/json',
},
body: JSON.stringify(data),
});
},
deleteJSONWithToken: function (request) {
let url = request.host;
let data = request.params;
return fetch(url, {
method: 'delete',
mode: 'cors',
credentials: 'include',
headers: {
token: this.token,
'Content-Type': 'application/json',
},
body: JSON.stringify(data),
});
},
uploadFile: function (request) {
let url = request.host;
let formData = new FormData();
let file = {
uri: request.params.file,
type: 'multipart/form-data',
name: 'jpg',
};
formData.append('files', file);
if (request.params.params) {
formData.append('params', request.params.params);
}
// console.log(formData);
return fetch(url, {
method: 'POST',
mode: 'cors',
credentials: 'include',
headers: {
token: this.token,
'Content-Type': 'multipart/form-data',
},
body: formData,
});
},
};
/** /**
* 判断是否为iphoneX * 判断是否为iphoneX
* @returns {boolean} * @returns {boolean}
*/ */
export function isIphoneX() { export function isIphoneX() {
return Platform.OS === 'ios' && ( return (
(screenHeight == 812 && screenWidth == 375) Platform.OS === 'ios' &&
|| (screenHeight == 896 && screenWidth == 414)) ((screenHeight == 812 && screenWidth == 375) ||
(screenHeight == 896 && screenWidth == 414))
);
} }
//状态栏的高度 //状态栏的高度
export function getStatusBarHeight() { export function getStatusBarHeight() {
if (Platform.OS === 'android') return StatusBar.currentHeight; if (Platform.OS === 'android') return StatusBar.currentHeight;
if (isIphoneX()) { if (isIphoneX()) {
return 44; return 44;
} }
return 20; return 20;
} }
export function cleanArray(actual) { export function cleanArray(actual) {
const newArray = [] const newArray = [];
for (let i = 0; i < actual.length; i++) { for (let i = 0; i < actual.length; i++) {
if (actual[i]) { if (actual[i]) {
newArray.push(actual[i]) newArray.push(actual[i]);
}
} }
return newArray }
return newArray;
} }
package-lock.json deleted 100755 → 0
View file @ ba14a91c
This source diff could not be displayed because it is too large. You can view the blob instead.
src/home202201/Index.tsx 0 → 100644
View file @ c380b669
import React, { Component, useRef } from 'react';
import {
Image, View, Text, StatusBar, TextInput, Keyboard, FlatList,
DeviceEventEmitter, ScrollView, Animated, Platform
} from 'react-native';
var RNFS = require('react-native-fs');
import HomeStyle from './home.css';
import LinearGradient from 'react-native-linear-gradient';
import Button from 'react-native-button';
import Constants from '../../Constants';
import Api from '../../Api';
import PublicCSS from '../../css/Public.css';
import HomeCSS from '../../css/Home.css';
import Random from '../components/Random';
import { Calendar, LocaleConfig } from 'react-native-calendars';
LocaleConfig.locales['zh-Hans'] = {
monthNames: ['一月', '二月', '三月', '四月', '五月', '六月', '七月', '八月', '九月', '十月', '十一月', '十二月'],
monthNamesShort: ['一', '二', '三', '四', '五', '六', '七', '八', '九', '十', '十一', '十二'],
dayNames: ['星期天', '星期一', '星期二', '星期三', '星期四', '星期五', '星期六'],
dayNamesShort: ['日', '一', '二', '三', '四', '五', '六'],
amDesignator: '上午',
pmDesignator: '下午',
};
LocaleConfig.defaultLocale = 'zh-Hans';
import { captureScreen } from "react-native-view-shot";
import PhotoEditor from 'react-native-photo-editor';
import CameraRoll from "@react-native-community/cameraroll";
import AddNote from '../../src/components/AddNote';
import Confirm from "../components/Confirm";
export default class Index extends Component {
constructor(props) {
super(props);
this.state = {
userICon: false,
mainHeight:0,
classList: [],
reportList: [],
calendar: null,
startDate: this.getMonthFirstDay(new Date()),
endDate: this.getMonthLastDay(new Date()),
today: this.getFormattedDate(new Date()),
list: [],
currentDate: this.getFormattedDate(new Date()),
lessonStat: [],
viewShot: '',
showViewShot: false,
showReport: false
}
this.props.navigation.addListener(
'focus', this.componentWillShow
);
}
componentDidMount() {
// this.componentWillShow();
// DeviceEventEmitter.addListener('inited', () => {
// this.componentWillShow();
// });
// this.checkStartTime();
}
checkStartTime = () => {
let list = this.state.list;
this.state.list.map((item, index) => {
let _date = new Date();
//开始时间小于24小时， 并且大于15分钟 要不停的倒计时
if (item.startDate.getTime() > _date.getTime() && (item.startDate.getTime() - _date.getTime()) < 86400000 && (item.startDate.getTime() - _date.getTime()) >= 900000 - 10) {
list[index] = this.setButton(item);
}
})
let classList = this.state.classList;
this.state.classList.map((item, index) => {
let _date = new Date();
//开始时间小于24小时， 并且大于15分钟 要不停的倒计时
if (item.startDate.getTime() > _date.getTime() && (item.startDate.getTime() - _date.getTime()) < 86400000 && (item.startDate.getTime() - _date.getTime()) >= 900000 - 10) {
classList[index] = this.setButton(item);
}
})
this.setState({
list: list,
classList: classList
})
setTimeout(this.checkStartTime, 1000);
}
componentWillShow = () => {
// StatusBar.setBarStyle('dark-content');
// this.getCurrentLessons();
// this.getLessonsByDate();
// this.setMarkDates();
// this.getLessonStat();
// this.getStudentReport();
}
setDate = (item) => {
let timeString = item.lessonDate.split('.000')[0].split('T').join(' ').replace(/\-/g, '/') + ' GMT';
let _date = new Date(timeString);
let _time = item.startTime.split(':');
if (_time.length === 2) {
_date.setHours(_time[0]);
_date.setMinutes(_time[1]);
}
item.startDate = _date;
return item;
}
setButton = (item) => {
let _date = new Date();
// item.status = 20;
if (item.startDate.getTime() > _date.getTime() && (item.startDate.getDate() === _date.getDate())) {
if (item.startDate.getTime() - _date.getTime() > 900000) {
let totalSecs = (item.startDate.getTime() - _date.getTime()) / 1000;
let hours = Math.floor(totalSecs / 3600);
let minutes = Math.floor((totalSecs % 3600) / 60);
let secs = Math.floor((totalSecs % 3600) % 60);
item.button = <View style={[{
flex: 1,
flexDirection: 'column'
}, PublicCSS.centerAll]}>
<View style={{
flexDirection: 'row',
height: Constants.unitWidth * 20,
alignItems: 'center',
}}>
<Image source={require('../../images/common/timer.png')} style={{
width: Constants.unitWidth * 21,
height: Constants.unitWidth * 20,
}} />
<Text allowFontScaling={false} style={[HomeCSS.courseSubTitle, {
marginTop: 0
}]}>距离上课</Text>
</View>
<Text allowFontScaling={false} style={{
color: '#333333',
fontSize: Constants.baseFontSize * 0.933
}}>
<Text allowFontScaling={false} style={HomeCSS.timeTxt}> {hours} </Text>时
<Text allowFontScaling={false} style={HomeCSS.timeTxt}> {String(minutes).padStart(2, '0')} </Text>分
<Text allowFontScaling={false} style={HomeCSS.timeTxt}> {String(secs).padStart(2, '0')} </Text>秒
</Text>
</View>;
} else {
// item.status = '20';
item.button = item.button = <View style={[{
flex: 1,
flexDirection: 'column'
}, PublicCSS.centerAll]}>
<Button onPress={() => {
if (item.status === '10') {
if (item.startDate.getTime() - _date.getTime() < 900000) {
this.props.navigation.navigate('LiveIndex', {
liveRoomUid: item.liveRoomUid,
channelId: item.channelId,
netlessUuid: item.netlessUuid,
students: item.clazzStudentList,
teachers: item.clazzTeacherList,
courseName: item.courseScheduleName,
studentName: item.studentName,
classId: item.classId,
classScheduleId: item.classScheduleId,
startTime: item.startTime,
endTime: item.endTime,
lessonDate: item.lessonDate,
});
}
return;
} else if (item.status === '20') {
this.props.navigation.navigate('LiveIndex', {
liveRoomUid: item.liveRoomUid,
channelId: item.channelId,
netlessUuid: item.netlessUuid,
students: item.clazzStudentList,
teachers: item.clazzTeacherList,
courseName: item.courseScheduleName,
studentName: item.studentName,
classId: item.classId,
classScheduleId: item.classScheduleId,
startTime: item.startTime,
endTime: item.endTime,
lessonDate: item.lessonDate,
});
} else {
if (item.videoUrl) {
this.props.navigation.navigate('MyVideo', {
url: item.videoUrl
})
}
}
}}>
<View style={[PublicCSS.centerAll, PublicCSS.mainBtn, {
backgroundColor: item.status === '30' ? (!item.videoUrl ? '#F5F5F5' : '#ffffff') : (item.status === '20' ? '#F9AE2B' : '#FFF2DC'),
borderColor: '#F9AE2B',
borderWidth: (item.status === '30' && item.videoUrl) ? Constants.unitWidth * 1 : 0
}]}>
<Text allowFontScaling={false} style={[HomeCSS.enterBtnTxt, {
color: item.status === '30' ? (!item.videoUrl ? '#C1C1C1' : '#F9AE2B') : (item.status === '20' ? '#FFFFFF' : '#F9AE2B'),
}]}>{item.status === '10' ? ((item.startDate.getTime() - _date.getTime() > 900000) ? '未开始' : '进教室') : (item.status === '20' ? '进教室' : (item.videoUrl ? '直播回放' : '已结束'))}</Text>
</View>
</Button>
<Text allowFontScaling={false} style={{
marginTop: Constants.unitWidth * 5,
fontFamily: 'PingFang SC',
fontSize: Constants.baseFontSize * 0.6,
color: '#999999'
}}>{this.getLessonTime2(item)}</Text>
</View>;
}
} else {
item.button = <View style={[{
flex: 1,
flexDirection: 'column'
}, PublicCSS.centerAll]}>
<Button onPress={() => {
this.props.navigation.navigate('LiveIndex', {
liveRoomUid: item.liveRoomUid,
channelId: item.channelId,
netlessUuid: item.netlessUuid,
students: item.clazzStudentList,
teachers: item.clazzTeacherList,
courseName: item.courseScheduleName,
studentName: item.studentName,
classId: item.classId,
classScheduleId: item.classScheduleId,
startTime: item.startTime,
endTime: item.endTime,
lessonDate: item.lessonDate,
})
return
if (item.status === '10') {
if (item.startDate.getTime() - _date.getTime() < 900000) {
this.props.navigation.navigate('LiveIndex', {
liveRoomUid: item.liveRoomUid,
channelId: item.channelId,
netlessUuid: item.netlessUuid,
students: item.clazzStudentList,
teachers: item.clazzTeacherList,
courseName: item.courseScheduleName,
studentName: item.studentName,
classId: item.classId,
classScheduleId: item.classScheduleId,
startTime: item.startTime,
endTime: item.endTime,
lessonDate: item.lessonDate,
});
}
return;
} else if (item.status === '20') {
this.props.navigation.navigate('LiveIndex', {
liveRoomUid: item.liveRoomUid,
channelId: item.channelId,
netlessUuid: item.netlessUuid,
students: item.clazzStudentList,
teachers: item.clazzTeacherList,
courseName: item.courseScheduleName,
studentName: item.studentName,
classId: item.classId,
classScheduleId: item.classScheduleId,
startTime: item.startTime,
endTime: item.endTime,
lessonDate: item.lessonDate,
});
} else {
if (item.videoUrl) {
this.props.navigation.navigate('MyVideo', {
url: item.videoUrl
})
}
}
}}>
<View style={[PublicCSS.centerAll, PublicCSS.mainBtn, {
backgroundColor: item.status === '30' ? (!item.videoUrl ? '#F5F5F5' : '#ffffff') : (item.status === '20' ? '#F9AE2B' : '#FFF2DC'),
borderColor: '#F9AE2B',
borderWidth: (item.status === '30' && item.videoUrl) ? Constants.unitWidth * 1 : 0
}]}>
<Text allowFontScaling={false} style={[HomeCSS.enterBtnTxt, {
color: item.status === '30' ? (!item.videoUrl ? '#C1C1C1' : '#F9AE2B') : (item.status === '20' ? '#FFFFFF' : '#F9AE2B'),
}]}>{item.status === '10' ? ((item.startDate.getTime() - _date.getTime() < 900000) ? '进教室' : '未开始') : (item.status === '20' ? '进教室' : (item.videoUrl ? '直播回放' : '已结束'))}</Text>
</View>
</Button>
<Text allowFontScaling={false} style={{
marginTop: Constants.unitWidth * 5,
fontFamily: 'PingFang SC',
fontSize: Constants.baseFontSize * 0.6,
color: '#999999'
}}>{this.getLessonTime2(item)}</Text>
</View>;
}
return item;
}
getLessonTime = (item) => {
let timeString = item.lessonDate.split('.000')[0].split('T').join(' ').replace(/\-/g, '/') + ' GMT';
let _date = new Date(timeString);
let _dateNow = new Date();
let dateString = ''
if (_date.getFullYear() === _dateNow.getFullYear()
&& _date.getMonth() === _dateNow.getMonth()
&& _date.getDate() === _dateNow.getDate()
) {
dateString = '今日';
} else {
dateString = _date.getFullYear() + '.' + String(_date.getMonth() + 1).padStart(2, '0') + '.' + String(_date.getDate()).padStart(2, '0');
}
return dateString + ' ' + item.startTime + '-' + item.endTime;
}
getLessonTime2 = (item) => {
let _date = item.startDate;
let _dateNow = new Date();
let dateString = ''
if (_date.getFullYear() === _dateNow.getFullYear()
&& _date.getMonth() === _dateNow.getMonth()
&& _date.getDate() === _dateNow.getDate()
) {
dateString = '今日';
} else {
dateString = _date.getFullYear() + '.' + String(_date.getMonth() + 1).padStart(2, '0') + '.' + String(_date.getDate()).padStart(2, '0');
}
return dateString + ' ' + item.startTime + '-' + item.endTime;
}
getStudentReport = () => {
Constants.get(Api.getReportStat)
.then((response) => {
// console.log(response);
return response.json()
})
.then(data => {
// console.log('getStudentReport', data);
if (data.success) {
if (parseInt(data.data.total) > 0) {
this.setState({
showReport: true
})
}
}
})
.catch(error => {
console.log('error getStudentReport', error)
});
}
getLessonsByDate = () => {
this.setMarkDates();
Constants.getWithBodyParams(Api.getLessonSchule({
lessonDate: this.state.currentDate
}))
.then((response) => {
// console.log(response);
return response.json()
})
.then(data => {
console.log('getLessonsByDate22333', data, Api.getLessonSchule({
lessonDate: this.state.currentDate
}));
if (data.success) {
let list = [];
data.data.results.map((item) => {
item = this.setDate(item);
item = this.setButton(item);
list.push(item);
});
this.setState({
list: list
});
setTimeout(this.setMarkDates, 100);
}
})
.catch(error => {
console.log('error getLessonsByDate', error)
});
}
getCurrentLessons = () => {
Constants.get(Api.getCurrentLessons)
.then((response) => {
// console.log(response);
return response.json()
})
.then(data => {
console.log('getCurrentLessons', data.data);
if (data.success) {
let classList = [];
data.data.map((item) => {
item = this.setDate(item);
// item.startDate = new Date('2021-05-25 00:10');
item = this.setButton(item);
classList.push(item);
});
this.setState({
classList: classList
})
}
})
.catch(error => {
console.log('error', error)
});
}
getStudents = (students) => {
let names = [];
students.map((item) => {
names.push(item.studentName);
})
return names.join('/')
}
emptyLesson = () => {
return <View style={[{
width: Constants.unitWidth * 433,
height: Constants.unitWidth * 440,
}, PublicCSS.centerAll]}>
<Image source={require('../../images/course/no-lesson.png')} style={{
width: Constants.unitWidth * 75,
height: Constants.unitWidth * 75,
}} />
<Text allowFontScaling={false} style={{
fontFamily: 'PingFang SC',
fontSize: Constants.baseFontSize * 1,
color: '#B9BCBF',
marginTop: Constants.unitWidth * 25,
}}>当前日期暂无课程哦</Text>
</View>
}
setMarkDates = () => {
let markedDates = {};
this.state.lessonStat.map((item) => {
markedDates[item.lessonDate] = { marked: true, dotColor: '#0FB359' };
});
if (this.state.currentDate === this.state.today) {
if (markedDates[this.state.today]) {
markedDates[this.state.today] = {
customStyles: {
container: {
backgroundColor: '#0FB359',
borderRadius: Constants.unitWidth * 4,
},
text: {
color: '#ffffff',
},
},
marked: true, dotColor: '#ffffff',
};
} else {
markedDates[this.state.today] = {
customStyles: {
container: {
backgroundColor: '#0FB359',
borderRadius: Constants.unitWidth * 4,
},
text: {
color: '#ffffff',
},
}
};
}
} else {
if (markedDates[this.state.today]) {
markedDates[this.state.today] = {
customStyles: {
container: {
backgroundColor: '#ffffff',
elevation: 2,
borderRadius: Constants.unitWidth * 4,
borderStyle: 'solid',
borderWidth: Constants.unitWidth * 1,
borderColor: '#0FB359',
},
text: {
color: '#333333'
}
},
marked: true, dotColor: '#0FB359',
};
} else {
markedDates[this.state.today] = {
customStyles: {
container: {
backgroundColor: '#ffffff',
elevation: 2,
borderRadius: Constants.unitWidth * 4,
borderStyle: 'solid',
borderWidth: Constants.unitWidth * 1,
borderColor: '#0FB359',
},
text: {
color: '#333333'
}
}
};
}
if (markedDates[this.state.currentDate]) {
markedDates[this.state.currentDate] = {
customStyles: {
container: {
backgroundColor: '#0FB359',
borderRadius: Constants.unitWidth * 4,
},
text: {
color: '#ffffff',
},
},
marked: true, dotColor: '#ffffff',
};
} else {
markedDates[this.state.currentDate] = {
customStyles: {
container: {
backgroundColor: '#0FB359',
borderRadius: Constants.unitWidth * 4,
},
text: {
color: '#ffffff',
},
}
};
}
}
this.setState({
markedDates: markedDates
});
// markedDates = {
// '2021-01-15': {textColor: '#ffffff', color: '#dddddd'}
// };
console.log('set Calendar');
// this.setState({
// calendar:
// });
}
getLessonStat = () => {
this.setMarkDates();
Constants.get(Api.getLessonStat({
startDate: this.state.startDate,
endDate: this.state.endDate,
}))
.then((response) => {
// console.log(response);
return response.json()
})
.then(data => {
if (data.success) {
this.setState({
lessonStat: data.data
});
setTimeout(this.setMarkDates, 100);
}
})
.catch(error => {
});
}
getMonthFirstDay = (date) => {
let year = date.getFullYear();
let month = String(date.getMonth() + 1).padStart(2, '0');
return [year, month, '01'].join('-');
}
getMonthLastDay = (date) => {
date.setMonth(date.getMonth() + 1);
date.setDate(0);
let year = date.getFullYear();
let month = String(date.getMonth() + 1).padStart(2, '0');
let day = String(date.getDate()).padStart(2, '0');
return [year, month, day].join('-');
}
getFormattedDate = (date) => {
let year = date.getFullYear();
let month = String(date.getMonth() + 1).padStart(2, '0');
let day = String(date.getDate()).padStart(2, '0');
return [year, month, day].join('-');
}
dayPress = (day) => {
this.setState({
currentDate: day.dateString
});
// setTimeout(this.setMarkDates, 100);
setTimeout(this.getLessonsByDate, 100);
}
getTeachers = (teachers) => {
let names = [];
if (teachers instanceof Array) {
teachers.map((item) => {
names.push(item.teacherName);
})
return names.join('/');
} else {
return '';
}
}
renderItem = ({ item, index }) => {
// item.status = '20';
// item.videoUrl = '---';
return <View style={[HomeCSS.classCell, {
marginTop: index === 0 ? Constants.unitWidth * 10 : 0
}]}>
<View style={[HomeCSS.classCellLeft, {
backgroundColor: '#F58331',
}]}></View>
<View style={{
flex: 1,
position: 'relative',
flexDirection: 'row'
}}>
<View style={HomeCSS.classCellInfo}>
<Text allowFontScaling={false} style={[HomeCSS.courseTitle, {
width: Constants.unitWidth * 300
}]} numberOfLines={1} ellipsizeMode="tail">{item.courseName}</Text>
<Text allowFontScaling={false} style={[HomeCSS.courseSubTitle, {
width: Constants.unitWidth * 300
}]} numberOfLines={1} ellipsizeMode="tail">{item.courseScheduleName}</Text>
<Text allowFontScaling={false} style={[HomeCSS.courseSubTitle, {
width: Constants.unitWidth * 300
}]} numberOfLines={1} ellipsizeMode="tail">{this.getTeachers(item.clazzTeacherList)}</Text>
</View>
{item.button}
</View>
</View>;
}
onLayoutfun = (event) => {
const { width, height } = event.nativeEvent.layout
this.setState({
mainHeight: height - (Constants.unitWidth * 35)
});
}
render() {
return (
<View style={HomeStyle.warp}>
<Image resizeMode='cover' source={require('../../images/common2201/homBag.png')} style={HomeStyle.containerImg} />
<View style={HomeStyle.container}>
<View style={HomeStyle.top}>
<View style={HomeStyle.topLeft}>
<View style={HomeStyle.topLeftIcon}>
{
this.state.userICon &&
<Image style={{ 'width': '100%', 'height': '100%' }} source={this.state.userICon} />
}
{
!this.state.userICon &&
<View style={{ 'width': '100%', 'height': '100%', backgroundColor: '#999', borderRadius: 50 }}></View>
}
</View>
<View style={HomeStyle.topLeftName}>
<View style={{ marginBottom: Constants.unitWidth * 12 }}><Text style={{ color: '#fff', fontSize: Constants.unitWidth * 20 }}>某某某</Text></View>
<View style={{ display: 'flex', flexDirection: 'row' }}>
<Text style={{ color: '#fff', fontSize: Constants.unitWidth * 14 }}>班级：</Text>
<Text style={{ color: '#fff', fontSize: Constants.unitWidth * 14 }}>枫华一班</Text>
</View>
</View>
<View style={HomeStyle.topLeftSelClass}>
<Text style={{ color: '#C44706', fontSize: Constants.unitWidth * 18 }}>枫华一班</Text>
<Image source={require('../../images/common2201/d.png')} style={{ width: Constants.unitWidth * 16, height: Constants.unitWidth * 16, }} />
</View>
</View>
<View style={HomeStyle.topRight}>
<Image resizeMode='cover' style={{ width: '100%', height: '100%' }} source={require('../../images/common2201/icon.png')} />
</View>
</View>
<View style={HomeStyle.mainView}>
<View onLayout={(event) => this.onLayoutfun(event)} style={HomeStyle.mainViewTop}>
{
<View style={[HomeStyle.mainViewTopBtmView,{height:this.state.mainHeight}]}>
<View style={[HomeStyle.mainViewTopBtmListView,{flex:0.655, "flexDirection":'row',}]}>
<View style={{height:'100%',flex:45,display:'flex',justifyContent:'center',paddingLeft:Constants.unitWidth * 44}}>
<View style={{flex:40,display:'flex',justifyContent:'flex-end',}}>
<Text style={{fontSize:Constants.unitWidth * 24,color: '#C44706',fontWeight:'bold',}}>智慧课堂</Text>
</View>
<View style={{flex:30,display:'flex',justifyContent:'center',}}>
<Text style={{fontSize:Constants.unitWidth * 16,color: '#444444'}}>数据实证 智能互动 即时反馈</Text>
</View>
<View style={{ width :Constants.unitWidth * 160, flex:48, }}>
<Image resizeMode='contain' style={{ maxWidth : '100%' , maxHeight : '100%'}} source={require('../../images/common2201/btn.png')} />
</View>
</View>
<View style={{height:'100%',flex:55,display:'flex',justifyContent:'center',alignItems:'center'}}>
<Image resizeMode='contain' style={{ width: '75%', }} source={require('../../images/common2201/ban.png')} />
</View>
</View>
<View style={HomeStyle.mainViewTopBtmListView}>
<Image style={HomeStyle.ListViewImg} source={require('../../images/common2201/icon1.png')} />
<Text style={HomeStyle.ListViewText}>课后作业</Text>
</View>
</View>
}
</View>
<View style={HomeStyle.mainViewBtm}>
<View style={[HomeStyle.mainViewTopBtmView,{height:this.state.mainHeight}]}>
<View style={HomeStyle.mainViewTopBtmListView}>
<Image style={HomeStyle.ListViewImg} source={require('../../images/common2201/icon2.png')} />
<Text style={HomeStyle.ListViewText}>在线测试</Text>
</View>
<View style={HomeStyle.mainViewTopBtmListView}>
<Image style={HomeStyle.ListViewImg} source={require('../../images/common2201/icon3.png')} />
<Text style={HomeStyle.ListViewText}>学情分析</Text>
</View>
<View style={HomeStyle.mainViewTopBtmListView}>
<Image style={HomeStyle.ListViewImg} source={require('../../images/common2201/icon4.png')} />
<Text style={HomeStyle.ListViewText}>错题攻坚</Text>
</View>
</View>
</View>
</View>
<View></View>
</View>
</View>
)
}
}
src/home202201/home.css.ts 0 → 100644
View file @ c380b669
import {
StyleSheet
} from 'react-native';
import Constants from '../../Constants';
let HomeCSS = StyleSheet.create({
warp: {
"width": '100%',
"height": '100%',
},
containerImg: {
position: 'absolute',
left: 0,
right: 0,
top: 0,
bottom: 0,
height: null,
width: null,
zIndex: -1
},
container: {
"width": '100%',
"height": '100%',
// position: 'absolute',
// zIndex:2,
'display':'flex',
"paddingLeft": Constants.unitWidth * 50,
"paddingRight": Constants.unitWidth * 50
},
top: {
"height": 100,
// "backgroundColor":'red',
"width": '100%',
"display":'flex',
"justifyContent":'space-between',
"flexDirection":'row',
"alignItems":'center',
},
topLeft:{
"display":'flex',
"justifyContent":'space-between',
"flexDirection":'row',
"alignItems":'center',
},
topLeftIcon:{
'width':Constants.unitWidth * 48,
'height':Constants.unitWidth * 48,
},
topLeftName:{
'width':Constants.unitWidth * 140,
'height':Constants.unitWidth * 52,
"paddingLeft": Constants.unitWidth * 18,
"paddingRight": Constants.unitWidth * 18,
'color':'#fff'
},
topLeftSelClass:{
'width':Constants.unitWidth * 118,
'height':Constants.unitWidth * 40,
'borderRadius':20,
'backgroundColor':'#FFEFD8',
"display":'flex',
"justifyContent":'center',
"flexDirection":'row',
"alignItems":'center',
},
topRight:{
"width":128,
"height":40,
},
mainView:{
display:'flex',
height:Constants.width - 100,
width:'100%',
},
mainViewTop:{
flex:1,
},
mainViewBtm:{
flex:1,
},
mainViewTopBtmView:{
'width':'100%',
"display":'flex',
"justifyContent":'space-between',
"flexDirection":'row',
"alignItems":'center',
},
mainViewTopBtmListView:{
flex:0.31,
height:'100%',
"backgroundColor":'#FFEFD8',
'borderRadius':15,
display:'flex',
"justifyContent":'center',
"alignItems":'center',
},
ListViewImg:{
"width":85 * Constants.unitWidth,
"height":85 * Constants.unitWidth,
"marginBottom": 18
},
ListViewText:{
fontSize: 16 * Constants.unitWidth,
color: '#C44706',
}
});
module.exports = HomeCSS;
yarn.lock
View file @ c380b669
...@@ -1569,6 +1569,32 @@ ...@@ -1569,6 +1569,32 @@
resolved "https://registry.npm.taobao.org/@types/prettier/download/@types/prettier-1.19.1.tgz#33509849f8e679e4add158959fdb086440e9553f" resolved "https://registry.npm.taobao.org/@types/prettier/download/@types/prettier-1.19.1.tgz#33509849f8e679e4add158959fdb086440e9553f"
integrity sha1-M1CYSfjmeeSt0ViVn9sIZEDpVT8= integrity sha1-M1CYSfjmeeSt0ViVn9sIZEDpVT8=
"@types/prop-types@*":
version "15.7.4"
resolved "https://registry.npmmirror.com/@types/prop-types/download/@types/prop-types-15.7.4.tgz#fcf7205c25dff795ee79af1e30da2c9790808f11"
integrity sha1-/PcgXCXf95Xuea8eMNosl5CAjxE=
"@types/react-native@^0.66.11":
version "0.66.11"
resolved "https://registry.npmmirror.com/@types/react-native/download/@types/react-native-0.66.11.tgz#3d138275fe9cca3b8efad990b1bee08078c3ff4d"
integrity sha512-DFuNMhRuyKMbJrI/s3rIuM5io+tIOK4Iq9oMzatWX5bIgfjZM86X1aA/epE0ipw1aFaoHKermK3fLG1bqFzzDQ==
dependencies:
"@types/react" "*"
"@types/react@*":
version "17.0.38"
resolved "https://registry.npmmirror.com/@types/react/download/@types/react-17.0.38.tgz#f24249fefd89357d5fa71f739a686b8d7c7202bd"
integrity sha512-SI92X1IA+FMnP3qM5m4QReluXzhcmovhZnLNm3pyeQlooi02qI7sLiepEYqT678uNiyc25XfCqxREFpy3W7YhQ==
dependencies:
"@types/prop-types" "*"
"@types/scheduler" "*"
csstype "^3.0.2"
"@types/scheduler@*":
version "0.16.2"
resolved "https://registry.npmmirror.com/@types/scheduler/download/@types/scheduler-0.16.2.tgz#1a62f89525723dde24ba1b01b092bf5df8ad4d39"
integrity sha1-GmL4lSVyPd4kuhsBsJK/XfitTTk=
"@types/stack-utils@^1.0.1": "@types/stack-utils@^1.0.1":
version "1.0.1" version "1.0.1"
resolved "https://registry.npm.taobao.org/@types/stack-utils/download/@types/stack-utils-1.0.1.tgz?cache=0&sync_timestamp=1605057912895&other_urls=https%3A%2F%2Fregistry.npm.taobao.org%2F%40types%2Fstack-utils%2Fdownload%2F%40types%2Fstack-utils-1.0.1.tgz#0a851d3bd96498fa25c33ab7278ed3bd65f06c3e" resolved "https://registry.npm.taobao.org/@types/stack-utils/download/@types/stack-utils-1.0.1.tgz?cache=0&sync_timestamp=1605057912895&other_urls=https%3A%2F%2Fregistry.npm.taobao.org%2F%40types%2Fstack-utils%2Fdownload%2F%40types%2Fstack-utils-1.0.1.tgz#0a851d3bd96498fa25c33ab7278ed3bd65f06c3e"
...@@ -2535,6 +2561,11 @@ cssstyle@^2.0.0: ...@@ -2535,6 +2561,11 @@ cssstyle@^2.0.0:
dependencies: dependencies:
cssom "~0.3.6" cssom "~0.3.6"
csstype@^3.0.2:
version "3.0.10"
resolved "https://registry.npmmirror.com/csstype/download/csstype-3.0.10.tgz?cache=0&sync_timestamp=1637224514674&other_urls=https%3A%2F%2Fregistry.npmmirror.com%2Fcsstype%2Fdownload%2Fcsstype-3.0.10.tgz#2ad3a7bed70f35b965707c092e5f30b327c290e5"
integrity sha512-2u44ZG2OcNUO9HDp/Jl8C07x6pU/eTR3ncV91SiK3dhG9TWvRVsCoJw14Ckx5DgWkzGA3waZWO3d7pgqpUI/XA==
dashdash@^1.12.0: dashdash@^1.12.0:
version "1.14.1" version "1.14.1"
resolved "https://registry.npm.taobao.org/dashdash/download/dashdash-1.14.1.tgz#853cfa0f7cbe2fed5de20326b8dd581035f6e2f0" resolved "https://registry.npm.taobao.org/dashdash/download/dashdash-1.14.1.tgz#853cfa0f7cbe2fed5de20326b8dd581035f6e2f0"
......
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