CreateTagItem.js 3.71 KB
import React, {Component} from "react";
import {
    Image,
    StyleSheet,
    Text,
    TextInput,
    TouchableOpacity,
    View,
} from "react-native";

import {getFooterBottom} from "../utils/utils"

/**
 * 新增tag
 */
export default class CreateTagItem extends Component {

    constructor(props) {
        super(props);
        this.state = {}

        this.tagColorData = [
            {checked: true, tagColor: 'rgba(255, 141, 26, 1)'},
            {checked: false, tagColor: 'rgba(255, 195, 0, 1)'},
            {checked: false, tagColor: 'rgba(255, 87, 51, 1)'},
            {checked: false, tagColor: 'rgba(212, 48, 48, 1)'},
            {checked: false, tagColor: 'rgba(212, 48, 48, 1)'},
            {checked: false, tagColor: 'rgba(67, 207, 124, 1)'},
            {checked: false, tagColor: 'rgba(51, 153, 255, 1)'}
        ]
    }

    componentWillMount() {
        this.props.navigation.setParams({
            title:"新增", //标题文字,
            isBack:true,
        });
    }

    render() {
        return (
            <View style={{flex: 1, backgroundColor: 'rgba(245, 245, 245, 1)'}}>
                <View style={{width: '100%', marginTop: 15, backgroundColor: 'white', flexDirection: 'row', alignItems: 'center', paddingVertical: 3}}>
                    <Text style={{color: "#FF3030", marginLeft: 10, marginRight: 5}}>*</Text>
                    <Text style={{fontSize: 16, color: 'rgba(0, 0, 0, 1)'}}>标签</Text>
                    <TextInput
                        style={{
                            flex: 1,
                            fontSize: 16,
                            color: 'rgba(0, 0, 0, 1)',
                            backgroundColor: 'white',
                            textAlign: 'left',
                            marginLeft: 30,
                            paddingVertical: 6,
                            paddingHorizontal: 0
                        }}
                        maxLength={11}
                        onChangeText={text => {
                            if (this.onChangeText) {
                                this.onChangeText(text)
                            }
                        }}
                        placeholderTextColor={'#999'}
                        placeholder={'请输入'}
                        underlineColorAndroid="transparent"
                    />
                </View>
                <View style={{width: '100%', marginTop: 15, backgroundColor: 'white'}}>
                    <View style={{flexDirection: 'row', marginTop: 10}}>
                        <Text style={{color: "#FF3030", marginLeft: 10, marginRight: 5}}>*</Text>
                        <Text style={{fontSize: 16, color: 'rgba(0, 0, 0, 1)'}}>标签颜色</Text>
                    </View>
                    <View style={{
                        flexDirection: 'row', justifyContent: 'flex-start', flexWrap: 'wrap',
                        alignItems: 'flex-start', paddingHorizontal: 20, width: width
                    }}>

                    </View>
                </View>
                <TouchableOpacity
                    style={{
                        width: '100%',
                        backgroundColor: global.homeColor,
                        justifyContent: 'center',
                        alignItems: 'center',
                        position: 'absolute',
                        bottom: 0,
                        height: 46+getFooterBottom(),
                        paddingBottom: getFooterBottom()
                    }}
                    activeOpacity={0.8}
                    onPress={()=>{}}
                >
                    <Text style={{fontSize: 16, color: 'rgba(242, 244, 245, 1)'}}>确定</Text>
                </TouchableOpacity>
            </View>
        );
    }
}