/**
 * Created by zzz on 2019/3/12.
 */
'use strict';

import React, {Component} from 'react';
import {Dimensions, Image,  StyleSheet, Text, TouchableOpacity, View, NativeModules} from 'react-native';
import ListView from 'deprecated-react-native-listview'
import {Immutable} from "immutable";
import YH_Image from '../../../common/components/YH_Image';

export default class ContentMessageCell extends Component {
    constructor(props) {
        super(props);
    }

    render() {
        let {rowData} = this.props;
        let status = rowData.businessType === 1003 ? true : false;

        let resource = rowData.coverImg ? typeof rowData.coverImg === 'string' ? JSON.parse(rowData.coverImg) : rowData.coverImg : '';
        let picItem = resource ? typeof resource.data === 'string' ? JSON.parse(resource.data) : resource.data : '';

        let imageUrl = YH_Image.getSlicedUrl(picItem.src, 50 * DEVICE_HEIGHT_RATIO, 50 * DEVICE_HEIGHT_RATIO, 2);

        let userName = rowData.userName;
        let subName = rowData.businessType === 1002 ? '评论了你' : '回复了你';
        let showIcon = (rowData.authGroupId === 3 || rowData.authGroupId === 5 || rowData.authGroupId === 7 || rowData.authGroupId === 11) ? true : false;

        let source;
        switch (rowData.authGroupId) {
            case 3:
                source = require('../../images/GF_big_ic.png');
                break;
            case 5:
                source = require('../../images/PP_big_ic.png');
                break;
            case 7:
                source = require('../../images/KING_big_ic.png');
                break;
            case 11:
                source = require('../../images/DR_big_ic.png');
                break;
            default:
        }

        return (
            <View>
                <View style={styles.headerBackground}>
                    <TouchableOpacity style={{marginLeft: 15, marginRight: 10, flexDirection: 'row'}} activeOpacity={1}
                                      onPress={() => this.props.jumpToPersonalGrassPage && this.props.jumpToPersonalGrassPage(rowData)}>
                        <YH_Image style={styles.headIcon} url={rowData.headIco} circle={true}/>
                        {showIcon ? <Image style={styles.iconImage} resizeMode="contain" source={source}/> : null}
                    </TouchableOpacity>

                    <View style={styles.textView}>
                        <TouchableOpacity activeOpacity={1}
                                          onPress={() => this.props.jumpToPersonalGrassPage && this.props.jumpToPersonalGrassPage(rowData)}>
                            <Text style={styles.nicknameText} numberOfLines={1}>{userName}</Text>
                        </TouchableOpacity>
                        <Text style={styles.subnameText}>{subName}</Text>
                    </View>
                    <TouchableOpacity activeOpacity={1} style={styles.replyContainer}
                                      onPress={() => this.props.jumpToShowKeyboard && this.props.jumpToShowKeyboard(rowData)}>
                        <Image style={styles.replyImage} resizeMode="contain"
                               source={require('../../images/content_reply.png')}/>
                    </TouchableOpacity>
                </View>

                <View style={styles.replyTextView}>
                    <Text style={styles.replyText} numberOfLines={2}>{rowData.commentContent}</Text>
                </View>

                {status ?

                    <TouchableOpacity activeOpacity={1}
                                      onPress={() => this.props.jumpToGrassDetailPage && this.props.jumpToGrassDetailPage(rowData)}>
                        <View style={styles.ownerReplyView}>
                            <Text style={{paddingLeft: 10, paddingTop: 14, paddingRight: 1, paddingBottom: 12}}
                                  numberOfLines={3}>
                                <Text style={styles.replyText}>我的评论：</Text>
                                <Text style={styles.defaultReplyText}>{rowData.parentCommentContent}</Text>
                            </Text>
                        </View>
                    </TouchableOpacity>

                    :

                    <TouchableOpacity activeOpacity={1}
                                      onPress={() => this.props.jumpToGrassDetailPage && this.props.jumpToGrassDetailPage(rowData)}>

                        {rowData.isDelete === 'N' ?
                            <View style={styles.originContainerView}>
                                <Text style={styles.copyText}>原文</Text>
                                {imageUrl ? <YH_Image url={imageUrl} style={styles.imageStyle}/> : null}

                                {rowData.content ?

                                    <Text style={styles.originText} numberOfLines={1}>
                                        <Text>{rowData.content}</Text>
                                        <Text>{'...'}</Text>
                                    </Text>
                                    :
                                    <View style={{height: 5}}/>
                                }

                            </View>
                            :
                            <View style={styles.originContainerView}>
                                <Text style={styles.deleteText} numberOfLines={1}>{'原文已被作者删除'}</Text>
                            </View>

                        }


                    </TouchableOpacity>}

                <View style={styles.timeView}>
                    <Text style={styles.startTimeText}>{rowData.createTime}</Text>
                </View>

                {this.props.showLine ? <View style={styles.lineView}/> : null}

            </View>
        );
    }
}

let {width, height} = Dimensions.get('window');
const DEVICE_WIDTH_RATIO = width / 375;
const DEVICE_HEIGHT_RATIO = height / 667;

let styles = StyleSheet.create({
    headerBackground: {
        width: width,
        height: 70,
        backgroundColor: 'white',
        flexDirection: 'row',
    },
    headIcon: {
        width: 40,
        height: 40,
        marginTop: 15,
        overflow: 'hidden',
        borderRadius: 20,
    },
    iconImage: {
        width: 16,
        height: 16,
        marginLeft: -12,
        marginTop: 42,
    },
    textView: {
        flexDirection: 'column',
        justifyContent: 'space-between',
        alignItems: 'flex-start',
        marginTop: 18,
        marginBottom: 15,
    },
    nicknameText: {
        fontSize: 14,
        fontFamily: 'PingFang-SC-Medium',
        color: '#222222',
        width: width / 2,
    },
    subnameText: {
        fontSize: 12,
        fontFamily: 'PingFang-SC-Regular',
        color: '#B0B0B0',
    },
    replyContainer: {
        position: 'absolute',
        top: 23,
        right: 15,
        width: 60,
        height: 25,
    },
    replyImage: {
        width: 60,
        height: 25,
    },
    replyTextView: {
        width: width - 30,
        marginBottom: 15,
        marginLeft: 15,
    },
    replyText: {
        fontFamily: 'PingFang-SC-Regular',
        fontSize: 12,
        color: '#444444',
    },
    ownerReplyView: {
        flexDirection: 'row',
        alignItems: 'center',
        width: width - 30,
        marginLeft: 15,
        backgroundColor: '#F0F0F0',
        marginBottom: 10,
    },
    defaultReplyText: {
        fontFamily: 'PingFang-SC-Regular',
        fontSize: 12,
        color: '#a8a8a8',
    },
    originContainerView: {
        flex: 1,
        marginLeft: 15,
        marginRight: 15,
        marginBottom: 10,
        backgroundColor: '#f0f0f0'
    },
    copyText: {
        fontFamily: 'PingFang-SC-Regular',
        fontSize: 12,
        color: '#444444',
        marginTop: 10,
        marginLeft: 9,
    },
    imageStyle: {
        marginTop: 10,
        marginBottom: 4,
        marginLeft: 9,
        width: 50 * DEVICE_HEIGHT_RATIO,
        height: 50 * DEVICE_HEIGHT_RATIO,
    },
    originText: {
        fontFamily: 'PingFang-SC-Regular',
        fontSize: 12,
        color: '#b0b0b0',
        marginLeft: 9,
        marginRight: 16,
        marginBottom: 9,
    },
    deleteText: {
        fontFamily: 'PingFang-SC-Regular',
        fontSize: 12,
        color: '#b0b0b0',
        marginLeft: 9,
        marginRight: 16,
        marginTop: 10,
        marginBottom: 10
    },
    timeView: {
        alignItems: 'flex-start',
        marginBottom: 10,
        marginLeft: 15,
    },
    startTimeText: {
        fontFamily: 'PingFang-SC-Regular',
        fontSize: 12,
        color: '#B0B0B0',
        height: 17
    },
    lineView: {
        marginLeft: 15,
        marginRight: 0,
        width: width - 15,
        height: 0.5,
        backgroundColor: '#e0e0e0'
    },
});