customer / shanghai-railway-rnapp

/**
 * 邀请回答ui
 */
import React, {Component} from "react";
import {
    DeviceEventEmitter,
    Image,
    StatusBar,
    Alert,
    StyleSheet,
    Text,
    TouchableOpacity,
    ActivityIndicator,
    View,
    Platform, InteractionManager
} from "react-native";
import {zoomH, zoomW} from "../../utils/getSize";
import CommentInput from "../detail/CommentInput"
import ImageBrowser from "../component/ImageBrowser";
import AppService from "../../service/AppService";
import {isIphoneX, xnToast,NoDoublePress,getHeaderPadding} from '../../utils/utils';
import CommentMore from  '../detail/CommentMore';
import ImageViewer from "react-native-image-zoom-viewer";

const emj = require('../../img/emoj_gray.png');
const scW = require('../../img/sc_w.png');
const plW = require('../../img/pl_w.png');
const collectMe = require('../../img/collect_me.png');
const reward = require('../../img/reward.png');
const defaultIcon = require("../../img/defaultIcon.png");
const vIcon = require("../../img/v.png");
const findImg = require("../../img/back.png");
const closeImg = require("../../img/gb.png");
const more_w = require("../../img/more_w.png");


const content = "本组件继承自PureComponent而非通常的Component";
let lastIndex = 0;//上一张图片的索引，只有当两次的值不同时刷新界面，防止无限调用

export default class AtlasDetails extends Component {
    constructor(props) {
        super(props);
        this.state = {
            data: [],
            imgList: [''],//图片列表集合
            imgAttb:[],
            fileList:[],
            index:0,//当前浏览的图片的索引
            showInfo:true,//是否显示信息
            isCollection:false,
            loading:false,
            commentNum:0,
            detailInformation: {},
            isShowCommentInput:false, // 是否显示CommentInput输入框组件
            showAdTitle:false,
        };
    }

    static navigationOptions = ({ navigation, screenProps }) => ({
        header: null
    });

    componentWillMount() {
        let _this = this;

        this.getList();
        this.getThreadStatic();
        AppService.forumActionHistory({forumId:global.forumId,actionTargetId:this.props.navigation.state.params.postID,actionType:30,actionTargetType:0,actionTargetThreadId:this.props.navigation.state.params.postID}).then((data)=>{});
    }

    componentDidMount() {
        let _this = this;
        this.refComent = DeviceEventEmitter.addListener("refComment", function() {
            _this.getList();
        });
        this.refreshCommentNum = DeviceEventEmitter.addListener("refreshCommentNum", function() {
            _this.getThreadStatic();
        });

        // 关闭CommentInput输入框组件的通知
        this.closeCommentInputIos = DeviceEventEmitter.addListener('closeCommentInputIos',function(){
            console.log("AtlasDetails:closeCommentInputIos");
            _this.setState({
                isShowCommentInput:false,
            })
        });
    }
    componentWillUnmount() {
        if(this.refComent !=null){
            this.refComent.remove();
        }
        if(this.refreshCommentNum !=null){
            this.refreshCommentNum.remove();
        }
        if (this.closeCommentInputIos != null) {
            this.closeCommentInputIos.remove();
        }
    }


    //获取帖子统计信息
    getThreadStatic(){
        let params = {
            id:this.props.navigation.state.params.postID,//帖子id
        };

        console.log('getThreadStatic' ,this.props.navigation.state.params.postID);

        AppService.queryThreadStatistic(params).then((data) => {
            console.log('getThreadStatic' ,data);
            if (data.message) {
                xnToast(data.message);
                return;
            }
            let _this = this;
            if (data.errors.length > 0) {
                xnToast(data.errors[0].message);
            } else {
                this.setState({
                    commentNum:!!data.threadStatistics?data.threadStatistics.commentNum:0,
                },function () {
                    console.log('4444',_this.state.commentNum,data);
                })


            }

        }).catch((error) => {

            xnToast(error)
        })


    }



    cancelCollect() {
        let params = {
            id:this.state.data.collectid || null,//id
        };
        this.setState({
            loading: true
        });
        console.log('sss',params);
        AppService.cancleCollect(params)
            .then(data => {
                this.setState({
                    loading: false
                });
                this.cancelCollectEnd(data);
                DeviceEventEmitter.emit('refreshAttention');
                DeviceEventEmitter.emit('refreshCollectList');

            })
            .catch(error => {
                this.setState({
                    loading: false
                });
                xnToast(error);
            });
    }

    cancelCollectEnd(data) {
        console.log('-----DATA');
        console.log(data);

        if (!!!data) {
            // xnToast("暂无数据!!!");
            return;
        }
        this.setState({

            isCollection : false
        });
        xnToast("已取消收藏");
    }

    beganCollect() {
        let params = {
            forumId:this.state.data.forumId,//社区id
            boardId:this.state.data.boardId,//板块id
            threadId:this.state.data.threadId,//帖子id
            collectUserId:global.userId,//收藏用户id
            collectUserName:global.userName,//收藏用户名字
        };
        this.setState({
            loading: true
        });
        AppService.collect(params)
            .then(data => {
                this.setState({
                    loading: false
                });
                this.beganCollectEnd(data);
                DeviceEventEmitter.emit('refreshAttention');
                DeviceEventEmitter.emit('refreshCollectList');


            })
            .catch(error => {
                this.setState({
                    loading: false
                });
                xnToast(error);
            });
    }

    beganCollectEnd(data) {
        console.log('-----DATA');

        if (!!!data) {
            // xnToast("暂无数据!!!");
            return;
        }
        let orignDats = this.state.data;
        orignDats.collectid = data.id ||0;
        this.setState({
            isCollection : true,
            data:orignDats,
        });
        xnToast("收藏成功");
        DeviceEventEmitter.emit('refreshAttention');
        DeviceEventEmitter.emit('refreshCollectList');

    }

    cancleAttention() {
        let _this = this;
        let params = {
            id:this.state.attentionID,//id
        };
        this.setState({
            loading: true
        });
        AppService.cancleAttention(params).then((data) => {
            _this.setState({
                loading: false
            });
            if (data.message) {
                xnToast(data.message);
                return;
            }
            if (!!data.errors === true && !!data.errors.length > 0) {
                xnToast(data.errors[0].message);
            } else {
                xnToast('取消关注');
                this.setState({
                    isFocusOn : false
                });
                DeviceEventEmitter.emit('refreshHomeHistory');
                DeviceEventEmitter.emit('refreshCollectList');
                DeviceEventEmitter.emit('refreshAttention');
                DeviceEventEmitter.emit('refreshHomeList');
                DeviceEventEmitter.emit("refreshAllList");
                DeviceEventEmitter.emit('reGetThreadDetailInfo');
            }
        }).catch(error => {
            this.setState({
                loading: false
            });
            xnToast(error);
        });
    }

    beganAttention() {
        let params = {
            forumId: this.state.data.forumId,
            targetUserId: this.state.data.curPerID,
            attentionUserId: global.userId,
            targetType: 1,
            isActive: true
        };
        this.setState({
            loading: true
        });
        AppService.attention(params).then((data) => {
                this.setState({
                    loading: false
                });
                if(data.message){
                    xnToast(data.message);
                    return;
                }
                if(data.errors == null || data.errors.length > 0){
                    xnToast(data.errors[0].message);
                }else{
                    xnToast('已关注');
                    this.setState({
                        isFocusOn : true,
                        attentionID: data.id
                    });
                    DeviceEventEmitter.emit('refreshHomeHistory');
                    DeviceEventEmitter.emit('refreshCollectList');
                    DeviceEventEmitter.emit('refreshAttention');
                    DeviceEventEmitter.emit('refreshHomeList');
                    DeviceEventEmitter.emit("refreshAllList");
                    DeviceEventEmitter.emit('reGetThreadDetailInfo');
                }
            })
            .catch(error => {
                this.setState({
                    loading: false
                });
                xnToast(error);
            });
    }

    getList() {
        let params = {
            id: this.props.navigation.state.params.postID,
            sourceFrom:'APP'
        };
        AppService.getDetailById(params)
            .then(data => {
                if (data.message) {
                    this.setState({
                        loading: false
                    });
                    xnToast(data.message);
                    return;
                }
                if (!!data.errors === true && !!data.errors.length > 0) {
                    if (!!data.hasBeenDeleted){
                        xnToast("帖子信息不存在或已被删除");
                        this.props.navigation.goBack();
                        return
                    }
                    this.setState({
                        loading: false
                    });
                    xnToast(data.errors[0].message);
                } else {
                    this.dataHandle(data);
                }
            })
            .catch(error => {
                this.setState({
                    loading: false
                });
                xnToast(error);
            });
    }

    /**
     * 接口返回数据处理
     * @param {*} data
     */
    dataHandle(data) {
        console.log('-----DATA');
        console.log(data);

        if (!!!data) {
            // xnToast("暂无数据!!!");
            return;
        }


        let resultStr = data.threadExtend;
        let user = resultStr.user;
        let collectData = resultStr.collect;
        let attentionData = user.attention;
        let commentData = resultStr.threadStatistics;
        let adPic = resultStr.adPictureFileUrl;
        let adLink = resultStr.adLinkUrl;
        let isAttentionD = false;
        let attentionIDD = 0;
        if (attentionData) {
            isAttentionD = attentionData.isActive;
            attentionIDD = attentionData.id;
        }
        let isCollectionD = false;
        let collectidD = null;
        if (collectData) {
            isCollectionD = collectData.isActive;
            collectidD = collectData.id;
        }
        let attaList = resultStr.attachmentList;
        let dataCon = {
            name: user.name,
            fansCount: user.beAttentionNum,
            headUrl: user.headFileUrl,
            isFocusOn: isAttentionD,
            forumId:resultStr.forumId,
            boardId:resultStr.boardId,
            threadId:resultStr.id,
            collectUserId:global.userId,//收藏用户id
            collectUserName:global.userName,//收藏用户名字
            collectid:collectidD,
            curPerID:user.id,
            adLink:adLink,
            adPic:adPic,
            commentCount:commentData.commentNum,
        };
        let imageList = [];
        let imageAttb = [];
        for (let i = 0; i < attaList.length; i++) {
            imageList.push(attaList[i].filePath);
            imageAttb.push(attaList[i].attributes);
        }
        if (adPic) {
            imageList.push(adPic);
            imageAttb.push("广告");
        }
        let fileList = [];

        for (let i = 0;i<imageList.length;i++){
            let vm = {
                url:imageList[i]+ "?x-oss-process=image/resize,w_1000"
            };
            fileList.push(vm);
        }
        this.setState({
            detailInformation: data.threadExtend || {},
            imgList: imageList,
            fileList:fileList,
            imgAttb: imageAttb,
            data:dataCon,
            isCollection:isCollectionD,
            isFocusOn:isAttentionD,
            attentionID:attentionIDD
        });

        let params = {
            id:this.state.data.threadId,//帖子id
        };

        AppService.ThreadReadRequest(params).then((data) => {

            if (data.message) {
                xnToast(data.message);
                return;
            }
            if (data.errors.length > 0) {
                xnToast(data.errors[0].message);
            } else {
                this.setState({

                });
                // 已读成功统一发送已读通知
                DeviceEventEmitter.emit('readNoti',this.state.data.threadId);
            }
        }).catch((error) => {
            xnToast(error)
        })

    }

    //回调当前浏览的图片索引
    setIndex=(data)=>{
        if(lastIndex == data){
            return;
        }

        this.setState({
            index:data,
        },function(){
            lastIndex = data;
        });
        if (data == this.state.fileList.length - 1 && this.state.data.adLink) {

            this.setState({
                showInfo:false,
                showAdTitle:true
            })
        }else {
            this.setState({
                showAdTitle:false
            })
        }

    }
    //点击图片时的回调
    onClick = (index) =>{
        this.setState({
            showInfo:!this.state.showInfo,
        })
        if (index == this.state.imgList.length - 1 && this.state.data.adLink) {
            this.setState({
                showInfo:false

            })

            NoDoublePress.onPress(()=>{

                this.props.navigation.navigate("atlasAdController",{adLink:this.state.data.adLink});
            })
        }
    }

    //评论
    /**
     *  @param inputStr:输入法人内容
     *
     */
    toComment=(data)=> {
        if (!global.isConnected){
            xnToast('暂无网络连接，请稍后重试！');
            this.setState({
                loading:false,
            });
            return;
        }
        this.setState({
            loading: true
        });

        let _this = this;

        let params = {
            forumId:this.state.data.forumId,//社区id
            boardId:this.state.data.boardId,//板块id
            threadId:this.state.data.threadId,//帖子Id
            floor:1,//楼层，评论的楼层为1，回复的楼层为父级楼层+1
            userId:global.userId,//评论/回复者ID
            userName:global.userName,//评论/回复者的名字
            content: data.content,//评论/回复内容
            richContent:data.richContent,//评论/回复富文本内容
            attachmentList:data.attachmentList,//附件集合
            topicHistoryList: data.tList,//引用的话题列表
            userList: data.aList,//引用的话题列表
            forward: data.isForward,//是否同时转发
        };
        console.log(params);

        AppService.creatCommentOrReply(params).then((data) => {

            if (data.message) {
                xnToast(data.message);
                this.setState({
                    loading:false,
                });
                return;
            }
            if (data.errors.length > 0) {
                this.setState({
                    loading:false,
                });
                xnToast(data.errors[0].message);
            } else {
                this.setState({
                    loading: false
                });
                xnToast("已评论");
                _this.getThreadStatic();
                if(this.refs.CommentInput != undefined){
                    InteractionManager.runAfterInteractions(() => {
                        this.refs.CommentInput.reset();
                    });
                }
            }
        }).catch((error) => {
            this.setState({
                loading: false
            });
            xnToast(error)
        })

    };

    //更多
    showMoreModal(){
        this.refs['CommentMore'].openModal();
    }

    delete() {
        NoDoublePress.onPress(() => this.showMoreModal());
    }

    renderAdTopView(){
        return(
            <View style={{
                flexDirection: 'row', width: '100%', justifyContent: 'space-between',marginTop:10/zoomH,
                position: 'absolute', backgroundColor: '#000'
            }}>
                <View style={{ flexDirection: 'row',width:'100%',alignItems: 'center', marginTop: 24 }}>
                    <TouchableOpacity
                        style = {{paddingLeft:15/zoomW,paddingRight:15/zoomW,paddingTop:10,paddingBottom:10}}
                        activeOpacity={0.8}
                        onPress={() => {
                            this.props.navigation.goBack();
                        }}
                    >
                        <Image style ={{height:15/zoomW,width:15/zoomW}}  resizeMode='contain' source={closeImg} />
                    </TouchableOpacity>
                    <View style = {{width:'100%',justifyContent:'center',alignItems:'center',position:'absolute'}}>
                        <Text style = {{color:'#fff'}}>广告</Text>
                    </View>

                </View>
            </View>
        )
    }
    //上面关注部分
    renderTopView() {
        let isFocusOnView;
        let isMoreView;
        let iconView;
        if (this.state.data.headUrl) {
            iconView =  ( <Image  source={{uri:this.state.data.headUrl+'?x-oss-process=image/resize,w_100'}} style={{ marginLeft: 15, width: 36, height: 36, borderRadius: 18 }} />);
        } else {
            iconView =  ( <Image  source={defaultIcon} style={{ marginLeft: 15, width: 36, height: 36, borderRadius: 18 }} />);
        }
        let isSelf = (global.userId == this.state.data.curPerID);
        if (isSelf) {
            isFocusOnView = null;
            isMoreView = <Image source={more_w} />;

        }else {
            if (this.state.isFocusOn) {
                isFocusOnView = (<Text onPress={() => {
                    this.cancleAttention()
                }} style={{ color: 'white', fontSize: 14 }}>已关注</Text>);
            }else {
                isFocusOnView = (<Text onPress={() => {
                    this.beganAttention()
                }} style={{ color: 'white',  fontSize: 14 }}>关注</Text>);
                isMoreView = null;

            }

        }
        return (
            <View style={{
                flexDirection: 'row', width: '100%', justifyContent: 'space-between',marginTop:10/zoomH,
                position: 'absolute', backgroundColor: '#00000000'
            }}>
                <View style={{ flexDirection: 'row',alignItems: 'center', marginTop: 24 }}>
                    <TouchableOpacity
                        style = {{paddingLeft:15/zoomW,paddingTop:10,paddingBottom:10}}
                        onPress={() => {
                            this.props.navigation.goBack();
                        }}
                    >
                        <Image style ={{height:15/zoomW,width:15/zoomW}}  resizeMode='contain' source={closeImg} />

                    </TouchableOpacity>
                    <TouchableOpacity
                        onPress={() => {
                            // 跳转到个人
                            let isSelf = (global.userId == this.state.data.curPerID);
                            if (isSelf) {
                                NoDoublePress.onPress(()=>{

                                    this.props.navigation.navigate('MyPage', { id: this.state.data.curPerID });
                                })

                            } else {
                                NoDoublePress.onPress(()=>{

                                    this.props.navigation.navigate('PersonalHomePage',{ 'userId': this.state.data.curPerID});
                                })
                            }
                        }}
                    >
                        {iconView}
                    </TouchableOpacity>

                    <View style={{ marginLeft: 8 }}>
                        <Text style={{ color: 'white', fontSize: 14, fontWeight: "bold" }}>{this.state.data.name}</Text>
                        <Text style={{ color: 'white', fontSize: 12 }}>{this.state.data.fansCount}粉丝</Text>
                    </View>
                </View>
                <View style={{ flexDirection: 'row', alignItems: 'center', marginRight: 15, marginTop: 24 }}>
                    {isFocusOnView}
                    <TouchableOpacity style={{ height: '100%', justifyContent: 'center' }} onPress={() => this.delete()}>
                        {isMoreView}
                    </TouchableOpacity>
                </View>
            </View>
        );
    }
    //显示评论
    commentClick (){
        if (Platform.OS == 'ios'){
            this.setState({
                isShowCommentInput:true
            });
        }
        InteractionManager.runAfterInteractions(() => {
            this.refs.CommentInput.showInputLayout();
        });

    };

    //下面评论部分
    renderBottomView() {
        let collectView = this.state.isCollection ?
            <TouchableOpacity       onPress={() => {
                // 调用取消收藏的接口
                this.cancelCollect();

            }} >
                <Image style={styles.img} source={collectMe} resizeMode="cover"  ></Image>
            </TouchableOpacity>
            :
            <TouchableOpacity       onPress={() => {
                // 调用收藏的接口
                this.beganCollect();
            }} >
                <Image style={styles.img} source={scW} resizeMode="cover"  ></Image>
            </TouchableOpacity>
        let picCount = this.state.data.adPic ? this.state.imgList.length - 1 : this.state.imgList.length ;
        let commentView = this.state.commentNum>0 ?  <View style = {{height:'100%',justifyContent:'center',marginLeft:15/zoomW,paddingLeft:10/zoomW,paddingRight:10/zoomW}}>
                <Image style={{width:20/zoomW,height:20/zoomW}} source={plW} resizeMode="cover"  >
                </Image>
                <View style={{backgroundColor:'#F4302A', height:10/zoomW,width:17/zoomW,borderRadius:5/zoomW,position:'absolute',right:2,top:10/zoomH, justifyContent:'center',alignItems:'center'}}>
                    <Text style={{fontSize:6,color:'white'}}> {this.state.commentNum} </Text>
                </View>
            </View> :
            <Image style={{width:20/zoomW,height:20/zoomW,marginLeft:25/zoomW}} source={plW} resizeMode="cover"  >
            </Image>
        return (
            <View style={{ position: 'absolute', bottom: 0 / zoomH, backgroundColor: '#00000000' ,width:'100%'}}>
                <Text style={{flex:1,opacity: 0.85,marginLeft:15/zoomW,marginRight:15/zoomW,marginBottom:12/zoomH}}>
                    <Text  style =  {{color:'white'}}>{}</Text>
                    <Text style={{ color: 'white', marginLeft: 15, marginRight: 15, marginBottom: 7, fontSize: 16 }}>{this.state.imgAttb[this.state.index]}</Text>
                </Text>
                <View>
                    <View style = {styles.inputBg} >
                        <TouchableOpacity style = {styles.greyRadiusBg}  onPress = {()=>{this.commentClick()}}>
                            <Text style = {{fontSize:14,color:'#fff',marginLeft:14/zoomW,opacity:0.85}}>写评论...</Text>
                            <Image style={{width:20/zoomW,height:20/zoomW,marginRight:8/zoomW}} source={emj} resizeMode="cover"  ></Image>
                        </TouchableOpacity>
                        {/*点赞*/}
                        <TouchableOpacity onPress={() => {
                            NoDoublePress.onPress(()=>{

                                this.props.navigation.navigate("AtlasComment", {
                                    mainData:{
                                        id:this.state.data.threadId,
                                        forumId:this.state.data.forumId,
                                        boardId:this.state.data.boardId
                                    }
                                });
                            })

                        }} >

                            {commentView}

                        </TouchableOpacity>
                        {/*转发*/}
                        {collectView}
                        {/*打赏*/}

                    </View>

                </View>
            </View>
        );
    }
    render() {

        return (

            <View style={{ flex: 1, backgroundColor: '#000' ,display: "flex",alignItems: "flex-start",justifyContent:"flex-end"}}>

                <StatusBar
                    backgroundColor={'#000000'}
                    networkActivityIndicatorVisible
                />

                <View style={{ flex: 1,width:'100%',paddingTop:Platform.OS == 'ios'?getHeaderPadding() : 50}}>

                    {this.state.fileList.length>0&&<ImageViewer
                        imageUrls={this.state.fileList} // 照片路径
                        enableImageZoom={true} // 是否开启手势缩放
                        index={this.state.index}
                        renderIndicator={
                            (currentIndex, allSize) => {
                                // 自定义指示器
                                // 判断最后一张是否是广告
                                if(this.state.data.adPic){
                                    // 有广告，展示总页数-1（广告不计入图集总数）
                                    allSize --;
                                }
                                // 创建自定义页数指示器
                                if(currentIndex > allSize && this.state.data.adPic){
                                    // 当前页数"超出"实际总数且有广告，则不显示指示器
                                    return null;
                                }else{
                                    // 其他场合按照正常页数显示逻辑展示指示器
                                    return <Text  style={[{color:'white',textAlign:'center',top:Platform.OS == 'android'?0:30,left:0,right:0,width:'100%',height:20,position:'absolute',fontSize:16}]}>{currentIndex + "/" + allSize}</Text>;
                                }
                            }
                        }
                        onChange={(index)=>{
                            this.setIndex(index)
                        }}
                        onClick={() => { // 图片单击事件
                            this.onClick(this.state.index)
                        }}
                        saveToLocalByLongPress={false}
                    />}

                    {this.state.showInfo && this.renderTopView()}
                    {this.state.showAdTitle && this.renderAdTopView()}
                    {this.state.showInfo && !this.state.isShowCommentInput && this.renderBottomView()}


                </View>
                {/*局部loading*/}
                {this.state.loading && (
                    <View style={styles.loadingBg}>
                        <View style={styles.loadingBox}>
                            <ActivityIndicator size="large" color="#fff" />
                            <Text
                                style={{ fontSize: 16, color: "#fff", marginTop: 6 / zoomH }}
                            >
                                加载中...
                            </Text>
                        </View>
                    </View>
                )}

                {/*更多操作*/}
                <CommentMore
                    ref='CommentMore'
                    detailInfo = {this.state.detailInformation}
                    collectClick = {()=>{}}
                    deleteClick = {()=>{this.props.navigation.goBack();}}
                    fromVideoDetail={true}
                    sourceFrom="PC"
                    forum={global.forum}
                />

                {Platform.OS == 'ios' && this.state.isShowCommentInput &&
                <CommentInput  ref = "CommentInput"
                               hideForward = {true}
                               uploadCallback = {(isLoading) =>{this.setState({loading:isLoading})}}
                               callback = { (data)=>{this.toComment(data)}}
                               nav = {this.props.navigation}
                               hasNavHeight = {false}
                />}
                {Platform.OS == 'android' &&
                <CommentInput  ref = "CommentInput"
                               hideForward = {true}
                               uploadCallback = {(isLoading) =>{this.setState({loading:isLoading})}}
                               callback = { (data)=>{this.toComment(data)}}
                               nav = {this.props.navigation}
                               hasNavHeight = {false}
                />}

            </View>

        );
    }
}



const styles = StyleSheet.create({
    background:{
        flex: 1,
        backgroundColor: '#fff',
    },

    itemBackground:{
        width:'100%',
        flex:1,
        padding: 15/zoomH,
        flexDirection :'row',
    },

    commonBg:{
        marginLeft:10/zoomW,
        marginRight:10/zoomW,
    },

    reading:{
        fontSize:12,color:'rgba(0,0,0,0.45)',marginLeft:15/zoomW,marginTop:10/zoomH,marginBottom:8/zoomH
    },

    commonAvatar:{
        width:36/zoomH,height:36/zoomH,borderRadius:18/zoomH
    },
    commonAvatarV:{
        width:10/zoomH,height:10/zoomH,position:'absolute',right:1/zoomW,bottom:1/zoomW
    },
    userNameBlue:{
        fontSize: 14,color:'#576B95',
    },
    userIdentity:{
        fontSize: 12,color:'#c3c3c3'
    },
    content:{
        fontSize: 16,color:'rgba(0,0,0,0.85)',marginTop:10/zoomH
    },
    time:{
        fontSize: 12,color:'rgba(0,0,0,0.45)',marginTop:8/zoomH
    },
    reply:{
        fontSize: 10,color:'black',marginTop:5/zoomH,backgroundColor:'#eeeeee',borderRadius:10,
        paddingLeft:10,paddingRight:10, paddingTop:2,paddingBottom:2
    },
    inputBg:{
        width:'100%',height:44/zoomH,flexDirection:'row',alignItems:'center',backgroundColor:'#000',
        justifyContent:'space-between',paddingLeft:20/zoomW,paddingRight:20/zoomW,marginBottom:isIphoneX()?34:0, borderColor: '#000',
        borderWidth: StyleSheet.hairlineWidth,
    },
    greyRadiusBg:{
        flex:1,flexDirection:'row',height:32/zoomH,justifyContent:'space-between',alignItems:'center',borderRadius:19/zoomW,backgroundColor:'rgba(255,255,255,0.14)',
    },

    img:{
        width:20/zoomW,height:20/zoomW,marginLeft:25/zoomW
    },
    loadingBg: {
        position: "absolute",
        top: 0,
        width: "100%",
        height: "100%",
        display: "flex",
        justifyContent: "center",
        alignItems: "center"
    },
    loadingBox: {
        width: 100 / zoomW,
        height: 120 / zoomH,
        backgroundColor: "rgba(0,0,0,.5)",
        borderRadius: 8,
        display: "flex",
        alignItems: "center",
        justifyContent: "center"
    }

});