<repo_name>zuoshangjiaoyu/jqkt<file_sep>/README.md
# jinqiuzhiku
金秋课堂APP
<file_sep>/src/components/tabBar/tabBar.js
import React, { Component } from 'react';
import {View, Button, Text} from 'react-native';

<file_sep>/src/components/search/searchInput.js
import React, { Component } from 'react';
import {View, Text, Image, TextInput, StyleSheet, TouchableHighlight, TouchableOpacity} from "react-native";
import {scaleHeight, setSpText2, scaleSize } from "../../lib/styleAdaptation";
import PropTypes from 'prop-types';
// import searchStyle from './searchStyle'

class SearchInput extends Component {
    static propTypes = {
        whereToGo: PropTypes.func,
        canNavigate: PropTypes.bool,
        placeholderTxt: PropTypes.string,
        inputStyle: PropTypes.object,
        searchContainer: PropTypes.object
    };
    constructor (props){
        super(props)
    }
    renderNavigationToSearch() {
        if (this.props.whereToGo === undefined) return;
        return this.props.whereToGo();
    }
    render(): React.ReactNode {
        return (
            <View style={[inputStyle.inputContainer,this.props.searchContainer]}>
                <Image style={inputStyle.searchIcon} source={require('../../images/search_icon.png')} resizeMode={'stretch'}/>
                {this.props.canNavigate &&
                    <TouchableOpacity onPress={()=>{this.renderNavigationToSearch()}} >
                        <Text>{this.props.placeholderTxt}</Text>
                    </TouchableOpacity>
                }
                {!this.props.canNavigate &&
                    <TextInput
                        placeholder={this.props.placeholderTxt}
                        style={[inputStyle.placeholderFontStyle]}
                    />
                }
            </View>
        );
    }
}

const inputStyle = StyleSheet.create({
    inputContainer: {
        height: scaleHeight(32),
        justifyContent: 'center',
        flexDirection: 'row',
        alignItems: 'center',
        backgroundColor: '#F0F1F2FF',
        borderRadius: scaleSize(16),
    },
    searchIcon: {
        width: scaleSize(15),
        height: scaleHeight(16),
        marginRight: scaleSize(6)
    },
    placeholderFontStyle: {
        fontSize: setSpText2(14),
        fontFamily: 'PingFang-SC-Medium',
        fontWeight: '500',
        color:'rgba(136,136,136,1)',
        margin: 0,
        padding: 0
    },
})
export default SearchInput;
<file_sep>/src/components/search/searchStyle.js
import { StyleSheet } from 'react-native';
import {scaleHeight, setSpText2, scaleSize } from "../../lib/styleAdaptation";

const searchStyle = StyleSheet.create({

})

export default searchStyle;
<file_sep>/src/containers/thinking/thinkScreen.js
import React, { Component } from 'react';
import { View, Text, StyleSheet, Image, ScrollView, Alert, TouchableOpacity, Button, TouchableHighlight} from 'react-native';
import thinkStyle from './thinkStyle';
import TopScreen from "../../components/topScreen/topScreen";

class ThinkScreen extends  Component {


    render(){
        return (
            <View>
                <TopScreen title={'思维课'} leftItem={() => this.props.navigation.goBack()} rightTxt={'课程介绍'} rightItem={() => {this.props.navigation.navigate('ThinkIntroduction')}} />
                <ScrollView
                    style={thinkStyle.container}
                >
                    <View style={thinkStyle.banner}>
                        <Image style={[thinkStyle.image]} resizeMode='stretch'  source={require('../../images/testOne.png')}  />
                    </View>
                    <View style={[thinkStyle.itemList]}>
                        <View style={[thinkStyle.item]} >
                            <TouchableOpacity activeOpacity={1}  onPress={()=>{this.props.navigation.navigate('Think')}}>
                                <Image style={[thinkStyle.itemImage]} resizeMode='stretch'  source={require('../../images/testOne.png')} />
                                <Text style={[thinkStyle.itemSee]}>580人观看</Text>
                                <View style={[thinkStyle.itemContent]}>
                                    <Text style={[thinkStyle.itemTitle]}>变现商学院的价值</Text>
                                    <Text style={[thinkStyle.itemName]}>李攀 | 变现商学院创始人</Text>
                                    <View style={[thinkStyle.itemSign]}>
                                        <Text style={[thinkStyle.itemSignText]}>供应链</Text>
                                        <Text style={[thinkStyle.itemSignText]}>资源优化</Text>
                                    </View>
                                </View>
                            </TouchableOpacity>
                        </View>
                        <View style={[thinkStyle.item]}>
                            <Image style={[thinkStyle.itemImage]} resizeMode='stretch'  source={require('../../images/testOne.png')} />
                            <Text style={[thinkStyle.itemSee]}>2万人观看</Text>
                            <View style={[thinkStyle.itemContent]}>
                                <Text style={[thinkStyle.itemTitle]}>变现商学院的价值</Text>
                                <Text style={[thinkStyle.itemName]}>李攀 | 变现商学院创始人</Text>
                                <View style={[thinkStyle.itemSign]}>
                                    <Text style={[thinkStyle.itemSignText]}>供应链</Text>
                                    <Text style={[thinkStyle.itemSignText]}>资源优化</Text>
                                </View>
                            </View>
                        </View>
                        <View style={[thinkStyle.item]}>
                            <Image style={[thinkStyle.itemImage]} resizeMode='stretch'  source={require('../../images/testOne.png')} />
                            <Text style={[thinkStyle.itemSee]}>2千人观看</Text>
                            <View style={[thinkStyle.itemContent]}>
                                <Text style={[thinkStyle.itemTitle]}>变现商学院的价值</Text>
                                <Text style={[thinkStyle.itemName]}>李攀 | 变现商学院创始人</Text>
                                <View style={[thinkStyle.itemSign]}>
                                    <Text style={[thinkStyle.itemSignText]}>供应链</Text>
                                    <Text style={[thinkStyle.itemSignText]}>资源优化</Text>
                                </View>
                            </View>
                        </View>
                    </View>
                </ScrollView>
            </View>


        );
    }
}
export default ThinkScreen;

<file_sep>/src/containers/home/indexScreen.js
import React, { Component } from 'react';
import  indexStyle from './indexStyle';
import BannerComponent from '../../components/banner/bannerComponent';
import FileUpload from "../../components/upload/fileUpload";
import MapScreen from '../../components/map/mapScreen';
import AliPay from '../../components/payment/aliPay'
import {
    Text,
    View,
    Alert,
    ScrollView,
    TouchableOpacity,
    Modal,
    Button
} from 'react-native';
import ShowToast from "../../components/showToast/showToast";

class IndexScreen extends  Component {
    constructor(props) {
        super(props);
        this.state = {
            text: 'Useless Placeholder',
            searchIcon: require('../../images/search_icon.png'),
            isShow: false,
            modal: false
        };
    }
    changeShowToast (){
        this.setState({
            isShow: false
        })
    }
    _aliPay() {
        let data = '1234';
        AliPay.pay(data)
    }
    render(): React.ReactNode {
        console.log(['indexScreen',this.state.isShow])
        return (
            <View>
                <ScrollView
                >
                    <ShowToast isShow={this.state.isShow} changeToast={this.changeShowToast.bind(this)}/>

                    <TouchableOpacity onPress={()=> this.setState({
                        isShow: true
                    })}>
                        <Text >调用showToast</Text>
                    </TouchableOpacity>

                    <TouchableOpacity onPress={this._aliPay}>
                        <Text >调用支付宝支付</Text>
                    </TouchableOpacity>
                </ScrollView>
            </View>

        );
    }
}

export default IndexScreen;

<file_sep>/src/components/map/mapScreen.js
import React, { Component } from 'react';
import ActionSheet from 'react-native-general-actionsheet';
import {
    Platform,
    StyleSheet,
    Text,
    View,
    TouchableOpacity,
    NativeModules,
    Alert,
    ScrollView,
    ActionSheetIOS
} from 'react-native';
let lon = '121.2477511168';  // ---经度 121.248078
let lat = '31.0913734181';   // ---纬度 31.091769
let name = '上海松江王家厍路55弄';//
let UtilMapManager = NativeModules.UtilMap;
class MapScreen extends  Component {
    constructor(props) {
        super(props);
        this.state = {
            text: 'Useless Placeholder',
            searchIcon: require('../../images/search_icon.png')
        };
    }
    iosmap() {
        // console.error(Platform);
        let array = [];
        UtilMapManager.findEvents(lon, lat, name, (events) => {
            events.map((index, item) => {
                array.push(index.title);
            })
            if(Platform.OS === 'ios'){
                if (array.length > 2) {
                    ActionSheetIOS.showActionSheetWithOptions({
                            options: array,
                            cancelButtonIndex: array.length - 1,
                            maskClosable: true,
                        },
                        (buttonIndex) => {
                            //跳到原生方法对应的app地图导航内
                            UtilMapManager.addEvent(events[buttonIndex].title, events[buttonIndex].url, lon, lat, name);//lon是经度，，，log是维度
                        });
                } else if (array.length == 2) {
                    if (events.length == 2 && events[0].url == 'ios') {
                        //只针对ios平台
                        UtilMapManager.addEvent(events[0].title, events[0].url, lon, lat, name);
                    } else {
                        console.log(['android',array])
                        ActionSheetIOS.showActionSheetWithOptions({
                                options: array,
                                cancelButtonIndex: array.length - 1,
                                maskClosable: true,
                            },
                            (buttonIndex) => {
                                //跳到原生方法对应的app地图导航内
                                UtilMapManager.addEvent(events[buttonIndex].title, events[buttonIndex].url, lon, lat, name);//lon是经度，log是维度
                            });
                    }
                } else {//只适用于android平台
                    Alert.alert('没有可用的地图软件！');
                }
            }else {
                ActionSheet.useActionSheetIOS = false;
                ActionSheet.showActionSheetWithOptions({
                    options: array,
                    cancelButtonIndex: array.length - 1,
                    maskClosable: true,
                },(buttonIndex) => {
                    console.log(['buttonIndex',buttonIndex,lon,lat,name])
                    //跳到原生方法对应的app地图导航内
                    UtilMapManager.addEvent(events[buttonIndex].title, events[buttonIndex].url, lon, lat, name);//lon是经度，log是维度
                });
            }

        })

    }
    render(): React.ReactNode {
        return (
            <View style={styles.container}>
                <TouchableOpacity style={{ marginTop: 50 }} onPress={this.iosmap.bind(this)}>
                    <Text>打开导航软件</Text>
                </TouchableOpacity>
            </View>
        );
    }
}
const styles = StyleSheet.create({
    container: {
        flex: 1,
        justifyContent: 'center',
        alignItems: 'center',
        backgroundColor: '#F5FCFF',
    },
    welcome: {
        fontSize: 20,
        textAlign: 'center',
        margin: 10,
    },
    instructions: {
        textAlign: 'center',
        color: '#333333',
        marginBottom: 5,
    },
});
export default MapScreen;

<file_sep>/src/containers/login/loginStyle.js
import {scaleHeight, scaleSize, setSpText2} from "../../lib/styleAdaptation";
import { StyleSheet } from 'react-native';
import BaseStyle from '../../lib/baseStyle';
const LoginStyle = StyleSheet.create({
    container: {
        flex: 1,
        backgroundColor: BaseStyle.themeColor,
    },
    logoContainer: {
        alignSelf: 'center',
        marginTop: scaleHeight(40)
    },
    logoImgStyle: {
        width: scaleSize(70),
        height: scaleSize(70),
        marginBottom: scaleHeight(13),
        backgroundColor: '#fff',
        borderRadius: scaleSize(70),
    },
    logoTxt: {
        fontSize: setSpText2(20),
        fontFamily: 'PingFang-SC-Bold',
        fontWeight: 'bold',
        color: 'rgba(52,57,78,1)',
        lineHeight: scaleHeight(36)
    },
    testStyle: {
        width: scaleSize(70),
        height: scaleSize(70),
        backgroundColor: '#fff',
        borderRadius: scaleSize(70)
    }
})

export default LoginStyle;
<file_sep>/src/lib/baseStyle.js
import {StyleSheet} from "react-native";
import Dimen from './dimen';
import {Platform} from 'react-native';
import deviceInfo from './deviceInfo';
const BaseStyle = {
    /** color **/
    clear: 'transparent',

    /** 主题色 **/
    themeColor: '#f2f5f7',

    // 默认文本主色调 (黄)
    textMainColor: '#F0B95BFF',
    // 默认背景颜色
    bgColor: '#f2f3f5ff',
    // 默认背景辅颜色 (HOT)
    bgFuColor: '#F54E36FF',
    // 默认标题第一级颜色 （黑）
    textTitleColor: '#333333FF',
    // 默认标题第一级半颜色
    textFirstTitleColor: '#3A3A3AFF',
    //  默认标题第二级颜色
    textSecTitleColor: '#666666FF',
    //  默认标题第二级颜色
    textThirdTitleColor: '#999999FF',
    // 默认红色颜色
    redColor: '#F54E36FF',
    // 默认分割线颜色
    lineColor: 'rgba(0,0,0,0.1)',
    // 默认placeholder颜色
    placeholderTextColor: '#c8c8cd',


    /** space **/
    // 上边距
    marginTop: 10,
    // 左边距
    marginLeft: 10,
    // 下边距
    marginBotton: 10,
    // 右边距
    marginRight: 10,
    // 内边距
    padding: 10,
    // 左padding
    paddingLeft: 15,
    // 导航的leftItem的左间距
    navMarginLeft: 15,
    // 导航的rightItem的右间距
    navMarginRight: 15,

    /** width **/
    // 导航栏左右按钮image宽度
    navImageWidth: 25,
    // 边框线宽度
    borderWidth: 1,
    // 分割线高度
    lineWidth: 0.8,

    /** height **/
    // 导航栏的高度
    navHeight: Platform.OS === 'ios' ? (deviceInfo.isIphoneX ? 88 : 64) : 56,
    // 导航栏顶部的状态栏高度
    navStatusBarHeight: Platform.OS === 'ios' ? (deviceInfo.isIphoneX ? 44 : 20) : 0,
    // 导航栏除掉状态栏的高度
    navContentHeight: Platform.OS === 'ios' ? 44 : 56,
    // tabBar的高度
    tabBarHeight: Platform.OS === 'ios' ? (deviceInfo.isIphoneX ? 83 : 49) : 49,
    // 底部按钮高度
    bottonBtnHeight: 44,
    // 通用列表cell高度
    cellHeight: 44,
    // 导航栏左右按钮image高度
    navImageHeight: 25,

    /** font **/
    // 默认文字字体
    textFont: 14,
    // 默认按钮文字字体
    btnFont: 15,
    btnFontSmall: 13,
    // 导航title字体
    navTitleFont: 17,
    // tabBar文字字体
    barBarTitleFont: 12,
    // 占位符的默认字体大小
    placeholderFont: 13,
    // 导航左按钮的字体
    navRightTitleFont: 15,
    // 导航右按钮字体
    navLeftTitleFont: 15,

    /** opacity **/
    // mask
    modalOpacity: 0.3,
    // touchableOpacity
    taOpacity: 0.1,

    /** 定位 **/
    absolute: 'absolute',

    /** flex **/
    around: 'space-around',
    between: 'space-between',
    center: 'center',
    row: 'row',
};

export default BaseStyle;
<file_sep>/src/components/topScreen/topScreen.js
import React, { Component } from 'react';
import PropTypes from 'prop-types'
import {
    Platform,
    StyleSheet,
    TouchableOpacity,
    View,
    Text,
    Image,
} from 'react-native';
import {scaleSize, setSpText2, ifIphoneX, scaleHeight} from "../../lib/styleAdaptation"; //公共类

export default class TopScreen extends Component {
    static propTypes = {
        leftItem: PropTypes.func,
        title: PropTypes.string,
        rightTxt: PropTypes.string,
        rightItem: PropTypes.func,
    };
    constructor(props){
        super(props);
    }
    renderLeftItem(){
        if (this.props.leftItem === undefined) return;
        return this.props.leftItem();
    }
    renderRightItem(){
        if (this.props.rightItem === undefined) return;
        return this.props.rightItem();
    }
    render() {
        let statusBar = Platform.select({
            ios: ifIphoneX() ? 44 : 20,
            android: 0,
        });
        return (
            <View style={[ styles.header, {margin: 0, paddingTop: statusBar, height: statusBar + 44}]}>
                <TouchableOpacity activeOpacity={1} onPress={()=>{this.renderLeftItem()}}>
                    <View style={styles.headerReturnIcon}>
                        <Text> { '<' } </Text>
                    </View>
                </TouchableOpacity>
                <Text style={this.props.rightTxt ? styles.title : styles.centerTitle}>
                    {this.props.title}
                </Text>
                {this.props.rightTxt &&
                    <TouchableOpacity onPress={()=>{this.renderRightItem()}}>
                        <View style={styles.doneText}>
                            <Text>{this.props.rightTxt}</Text>
                        </View>
                    </TouchableOpacity>
                }

            </View>
        )
    }
}

const styles = StyleSheet.create({

    header:  {
        flexDirection: 'row',
        paddingHorizontal: scaleHeight(15),
        justifyContent: 'space-between',
        alignItems: 'center',
        backgroundColor: '#FFFFFFFF'
    },
    headerNoRight: {
        flexDirection: 'row',
        paddingHorizontal: scaleHeight(15),
    },
    headerReturnIcon: {
        justifyContent: 'flex-start',
        textAlign: 'left'
    },
    title: {
        justifyContent: 'center',
        textAlign: 'center',
        fontSize: setSpText2(18),
        fontFamily: 'PingFang-SC-Bold',
        fontWeight: 'bold',
        color: '#333333FF'
    },
    centerTitle: {
        width:scaleSize(335),
        textAlign: 'center',
        fontSize: setSpText2(18),
        fontFamily: 'PingFang-SC-Bold',
        fontWeight: 'bold',
        color: '#333333FF'
    },
    doneText: {
        justifyContent: 'flex-end',
        textAlign: 'right',
        fontSize: setSpText2(17),
        fontFamily: 'PingFang-SC-Medium',
        fontWeight: '500',
        color: '#333333FF'
    }
});
<file_sep>/src/containers/login/loginScreen.js
import React, { Component } from 'react';
import { View, Text, TextInput, Image, StyleSheet } from "react-native";
import loginStyle from './loginStyle';

class LoginScreen extends Component {
    render(): React.ReactNode {
        return (
            <View style={loginStyle.container}>
                <View style={loginStyle.logoContainer}>
                    <Image roundAsCircle={true} style={loginStyle.logoImgStyle}  source={require('../../images/logo.png')}/>
                    <Text style={loginStyle.logoTxt}>佐商学院</Text>
                </View>
            </View>
        );
    }
}

export default LoginScreen;
<file_sep>/src/components/banner/bannerStyle.js
import { StyleSheet } from 'react-native';
import {scaleHeight, setSpText2, scaleSize } from "../../lib/styleAdaptation";


const bannerStyle = StyleSheet.create({
    bannerSize: {
        height: scaleHeight(155),
    },
    imageSize: {
        width: scaleSize(375),
        height: scaleHeight(155),
    },
    bulletOneStyle: {
        width: 5,
        height: 5,
        borderRadius: 5,
        borderColor: '#dddddd',
        backgroundColor: '#dddddd',
    },
    chooseBulletStyle: {
        width: 11,
        height: 5,
        borderRadius: 2,
        backgroundColor: '#ffffff'
    }
})

export default bannerStyle;
<file_sep>/android/app/src/main/java/com/jinqiuzhiku/alipay/AlipayModule.java
package com.jinqiuzhiku.alipay;

import com.alipay.sdk.app.EnvUtils;
import com.alipay.sdk.app.PayTask;
import com.facebook.react.bridge.Arguments;
import com.facebook.react.bridge.Promise;
import com.facebook.react.bridge.ReactApplicationContext;
import com.facebook.react.bridge.ReactContextBaseJavaModule;
import com.facebook.react.bridge.ReactMethod;
import com.facebook.react.bridge.WritableMap;
import com.squareup.okhttp.OkHttpClient;
import com.squareup.okhttp.Request;
import com.squareup.okhttp.Response;


import java.io.IOException;
import java.util.Map;

public class AlipayModule extends ReactContextBaseJavaModule {

    public AlipayModule(ReactApplicationContext reactContext) {
        super(reactContext);
    }

    @Override
    public String getName() {
        return "Alipay";
    }

    @ReactMethod
    public void pay(final String orderInfo, final Promise promise) {
        EnvUtils.setEnv(EnvUtils.EnvEnum.SANDBOX);
        Runnable payRunnable = new Runnable() {
            @Override
            public void run() {

                OkHttpClient client = new OkHttpClient();
                Request request = new Request.Builder()
                        .url("http://www.zxqc2019.cn:7777/pay-php-sdk/index.php")
                        .header("User-Agent", "OkHttp Headers.java")
                        .addHeader("Accept", "application/json; q=0.5")
                        .addHeader("Accept", "application/vnd.github.v3+json")
                        .build();
                String result1 = "";
                try {
                    Response response = client.newCall(request).execute();
                    result1 = response.body().string();
                    System.out.println(result1);
                } catch (IOException e) {
                    e.printStackTrace();
                }

                WritableMap map = Arguments.createMap();
                PayTask alipay = new PayTask(getCurrentActivity());
                Map<String, String> result = alipay.payV2(result1, true);
                for (Map.Entry<String, String> entry : result.entrySet())
                    map.putString(entry.getKey(), entry.getValue());
                promise.resolve(map);
            }
        };
        // 必须异步调用
        Thread payThread = new Thread(payRunnable);
        payThread.start();
    }

}
<file_sep>/src/containers/search/searchScreen.js
import React, { Component } from 'react';
import { View, Text, StyleSheet, TouchableOpacity} from 'react-native';
import SearchInput from '../../components/search/searchInput'
import {scaleHeight, scaleSize} from "../../lib/styleAdaptation";


class SearchScreen extends Component {
    render(): React.ReactNode {
        return(
            <View>
                <View style={searchStyle.searchStyle}>
                    <SearchInput searchContainer={searchStyle.searchContainer} placeholderTxt={'搜索课程、讲师'} />
                    <TouchableOpacity activeOpacity={1} onPress={()=>{this.props.navigation.goBack()}}>
                        <Text>取消</Text>
                    </TouchableOpacity>
                </View>
                <Text>this is search</Text>
            </View>
        );
    }
}
const searchStyle = StyleSheet.create({
    searchStyle: {
        flexDirection: 'row',
        paddingHorizontal: scaleSize(15),
        paddingVertical: scaleHeight(8),
        width: scaleSize(375),
        alignItems: 'center',
    },
    searchContainer: {
        width: scaleSize(300),
        justifyContent: 'flex-start',
        marginRight: scaleSize(13),
        paddingLeft: scaleSize(16)
    }
})

export default  SearchScreen;
<file_sep>/src/containers/homeScreen.js
import React, { Component } from 'react';
import { View, Text, Alert, TouchableOpacity} from 'react-native';
import fetchRequest from '../lib/request'


class HomeScreen extends  Component {
    constructor () {
        super()
        this.state =  {
            test: ''
        }
    }
    _pressButton() {
        // fetch('http://192.168.1.187:8181/wxapi/courses/',)
        //     .then((responseJson) =>{
        //         console.log(responseJson);
        //     })
        //     .catch((error) => {
        //         console.log(error);
        //     })
        fetchRequest('appApi/test','POST').then((res) =>{
            console.error(['res homeScreen',123])
            // this.setState({
            //     test: res.data.baseUrl
            // })
        })

    }
    render(): React.ReactNode {
        return (
            <View>
                <TouchableOpacity onPress={this._pressButton.bind(this,1)} >
                    <Text>{this.state.test? this.state.test : 'this is home'}</Text>
                </TouchableOpacity>

                <Text>{this.state.test}</Text>
            </View>
        );

    }
}
export default HomeScreen;
