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

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

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

    render() {
        let rowData = this.props.data;

        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 {width, height} = Dimensions.get('window');
        let sliceCount = width <= 320 ? 10 : 15;
        let userName = rowData.userName.length > sliceCount ? rowData.userName.slice(0,sliceCount)+'...' : rowData.userName;
        let subName = '赞了你';
        switch (rowData.businessType) {
          case 1000:
            subName = '赞了你';
            break;
          case 1001:
            subName = '收藏了你';
            break;
          case 1002:
            subName = '评论了你';
            break;
          case 1003:
            subName = '回复了你';
            break;
          case 1004:
            subName = '关注了你';
            break;
          default:
        }


        return (
          <View>
              <View style={styles.headerBackground}>
                  <TouchableOpacity activeOpacity={1} onPress={()=> this.props.jumpToPersonalGrassPage && this.props.jumpToPersonalGrassPage(rowData.optUid)}>
                      <YH_Image style={styles.headIcon} url={rowData.headIco} circle={true}/>
                  </TouchableOpacity>

                  <View style={styles.textView}>
                    <TouchableOpacity activeOpacity={1} onPress={()=> this.props.jumpToPersonalGrassPage && this.props.jumpToPersonalGrassPage(rowData.optUid)}>
                      <Text style={styles.nicknameText} numberOfLines={1}>{userName}</Text>
                    </TouchableOpacity>
                      <Text style={styles.subnameText}>{subName}</Text>
                  </View>
              </View>

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

              { rowData.isDelete === 'N' ?

                  <View style={ styles.originView} >
                    <Text style={styles.copyText}>原文</Text>
                    <YH_Image url={imageUrl} style={styles.imageStyle} />
                    {rowData.content ?
                        <Text style={styles.originText} numberOfLines={1}>{rowData.content}</Text>
                        :
                        <View style={{height: 5}} />
                    }
                  </View>

                  :

                  <View style={ styles.originView} >
                    <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_HEIGHT_RATIO = height / 667;

let styles = StyleSheet.create({
    headerBackground: {
        width: width,
        height: 70,
        backgroundColor: 'white',
        flexDirection: 'row',
    },
    headIcon: {
        width: 40,
        height: 40,
        marginLeft: 15,
        marginTop: 15,
        marginRight:10,
        overflow: 'hidden',
        borderRadius: 20,
    },
    textView: {
        flexDirection: 'column',
        justifyContent: 'space-between',
        alignItems: 'flex-start',
        marginTop: 18,
        marginBottom: 15,
    },
    nicknameText: {
        fontSize: 14,
        fontFamily: 'PingFang-SC-Medium',
        color: '#222222',
    },
    subnameText: {
        fontSize: 12,
        fontFamily: 'PingFang-SC-Regular',
        color: '#B0B0B0',
    },
    originView: {
      flex: 1,
      marginLeft: 15,
      marginRight: 15,
      marginBottom: 10,
      backgroundColor: '#f0f0f0'
    },
    copyText: {
      fontFamily: 'PingFang-SC-Regular',
      fontSize: 12,
      color: '#444444',
      marginTop: 10,
      marginLeft: 10,
    },
    imageStyle: {
      marginTop: 10,
      marginBottom: 4,
      marginLeft: 10,
      width: 50 * DEVICE_HEIGHT_RATIO,
      height: 50 * DEVICE_HEIGHT_RATIO,
    },
    originText: {
      fontFamily: 'PingFang-SC-Regular',
      fontSize: 12,
      color: '#b0b0b0',
      marginLeft: 10,
      marginRight: 15,
      marginBottom: 9,
    },
    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'
    },
    deleteText: {
      fontFamily: 'PingFang-SC-Regular',
      fontSize: 12,
      color: '#b0b0b0',
      marginLeft: 9,
      marginRight: 16,
      marginTop: 10,
      marginBottom: 10
    },
  });