ItemBottomOperate.js 10.1 KB
import React, { Component } from "react";
import {
  DeviceEventEmitter,
  Image,
  StyleSheet,
  Text,
  TouchableOpacity,
  View
} from "react-native";
import { zoomH, zoomW } from "../../../utils/getSize";
import { xnToast, NoDoublePress } from "../../../utils/utils";
import AppService from "../../../service/AppService";
//图片资源
const forwarding = require("../../../img/zf.png");
const comment = require("../../../img/pingLun.png");
const share = require("../../../img/share.png");
const prise = require("../../../img/dz.png");
const prised = require("../../../img/prised.png");

/**
 * 图集列表item 中底部操作栏  评论、转发、点赞
 *
 */
export default class ItemBottomOperate extends Component {
  // 构造
  constructor(props) {
    super(props);
    // 初始状态
    this.state = {};
  }

  //点击事件,跳到个人详情
  _onPress() {}

  //点赞
  _starClick(isLike) {
    if (!global.isConnected) {
      xnToast("暂无网络连接,请稍后重试!");
      return;
    }
    let data = this.props.itemList;
    //点赞
    if (isLike) {
      let params = {
        forumId: data.forumId, //社区id
        boardId: data.boardId, //版块ID
        targetType: 0, //点赞类型: 点赞对象的类型 0:帖子点赞 1:回复点赞 2:评论点 3:转发点赞
        targetId: data.id, //点赞对象ID
        likeUserId: global.userId, //点赞用户ID
        likeUserName: global.userName //点赞用户名字
      };
      console.log(params);

      AppService.like(params)
          .then(data => {
            console.log(data);
            if (data.message) {
              xnToast(data.message);
              return;
            }
            if (data.errors.length > 0) {
              xnToast(data.errors[0].message);
            } else {
              //通知列表刷新
              DeviceEventEmitter.emit("refreshConcernList", {
                index: this.props.index ? this.props.index : 0,
                isLike: true,
                id: data.id
              });
              xnToast("点赞成功");
            }
          })
          .catch(error => {
            xnToast(error);
          });
    } else {
      //取消点赞
      let params = {
        id: data.threadLike.id //点赞id
      };

      AppService.cancelLike(params)
          .then(data => {
            if (data.message) {
              xnToast(data.message);
              return;
            }
            if (data.errors.length > 0) {
              xnToast(data.errors[0].message);
            } else {
              //通知列表刷新
              DeviceEventEmitter.emit("refreshConcernList", {
                index: this.props.index ? this.props.index : 0,
                isLike: false
              });
              xnToast("已取消点赞");
            }
          })
          .catch(error => {
            xnToast(error);
          });
    }
  }

  //转发
  _forwardingClick = () => {
    NoDoublePress.onPress(() => {
      let firstFileUrl = !!this.props.itemList.user.headFileUrl
          ? this.props.itemList.user.headFileUrl
          : ""; //用户头像
      let content = "";
      let placeHolderContent = "";
      let atList = [];
      if (
          !!this.props.itemList.originThread &&
          this.props.itemList.originThread.threadDetail
      ) {
        //多次转发,有原贴内容
        firstFileUrl =
            this.props.itemList.originThread.threadDetail.firstFileUrl ||
            this.props.itemList.originThread.threadUserHeadFileUrl;
        let richContent =
            this.props.itemList.originThread.threadType == "4"
                ? this.props.itemList.originThread.title
                : this.props.itemList.originThread.threadDetail.content;
        content =
            this.props.itemList.originThread.threadUserName + " : " + richContent;
        placeHolderContent =
            "//@" +
            this.props.itemList.threadUserName +
            " : " +
            (this.props.itemList.threadDetail.content || "");
        let user = {
          id: this.props.itemList.threadUserId,
          name: this.props.itemList.threadUserName
        };
        atList.push(user);
        if (
            !!this.props.itemList.atHistoryList &&
            this.props.itemList.atHistoryList.length > 0
        ) {
          for (let i = 0; i < this.props.itemList.atHistoryList.length; i++) {
            atList.push(this.props.itemList.atHistoryList[i]);
          }
        }
      } else {
        //原贴,没有转发过
        firstFileUrl =
            !!this.props.itemList.threadDetail &&
            !!this.props.itemList.threadDetail.firstFileUrl
                ? this.props.itemList.threadDetail.firstFileUrl || firstFileUrl
                : firstFileUrl; //封面图,原贴的第一张图,如果没有,传用户头像
        let richContent =
            this.props.itemList.threadType == "4"
                ? this.props.itemList.title
                : !!this.props.itemList.threadDetail
                ? this.props.itemList.threadDetail.content
                : "";
        content = this.props.itemList.threadUserName + " : " + richContent;
      }

      let data = {
        forumId: this.props.itemList.forumId, //社区id
        boardId: this.props.itemList.boardId, //版块ID,
        threadId: this.props.itemList.id, //帖子id
        firstFileUrl: firstFileUrl,
        atList: atList, //帖子@的人列表
        placeHolderContent: placeHolderContent, //转发的转发,别人转发的内容
        content: content //帖子内容,需要自己拼接为 username:content 的格式
      };
      this.props.nav.navigate("Forwarding", {
        from: "HomeList",
        data: data,
        title: "123",
        isVideo: this.props.isVideo
      });
    });
  };
  //评论
  _commentClick = () => {
    NoDoublePress.onPress(() => {
      if (this.props.isVideo) {
        if (!!this.props.itemList.originThread) {
          this.props.nav.navigate("TransferVideoDetail", {
            name: "TransferVideoDetail",
            from: "comment",
            id: this.props.itemList.id
          });
        } else {
          this.props.nav.navigate("VideoDetail", {
            name: "VideoDetail",
            from: "comment",
            id: this.props.itemList.id
          });
        }
      } else {
        this.props.nav.navigate("HomeListDetail", {
          from: "comment",
          id: this.props.itemList.id
        });
      }
    });
  };
  //分享
  _shareClick=()=>{
    DeviceEventEmitter.emit('shareClick',this.props.itemList);

  };
  //评论转发点赞操作栏
  render() {
    return (
        <View
            style={{
              height: 38 / zoomH,
              flexDirection: "row",
              justifyContent: "space-between",
              alignItems: "center"
            }}
        >
          {(!!!this.props.hideForward || !this.props.hideForward) && (
              <TouchableOpacity
                  activeOpacity={0.8}
                  style={styles.starItem}
                  onPress={this._forwardingClick}
              >
                <Image
                    style={styles.itemImg}
                    source={forwarding}
                    resizeMode="contain"
                />
                <Text style={styles.itemText}>
                  {!!this.props.itemList.threadStatistics &&
                  this.props.itemList.threadStatistics.forwardNum > 0
                      ? this.props.itemList.threadStatistics.forwardNum
                      : "转发"}
                </Text>
              </TouchableOpacity>
          )}
          <TouchableOpacity
              activeOpacity={0.8}
              style={styles.starItem}
              onPress={this._shareClick}
          >
            <Image style={styles.itemImg} source={share} resizeMode="contain" />
            <Text style={styles.itemText}>
              {'分享'}
            </Text>
          </TouchableOpacity>
          <TouchableOpacity
              activeOpacity={0.8}
              style={styles.starItem}
              onPress={this._commentClick}
          >
            <Image style={styles.itemImg} source={comment} resizeMode="contain" />
            <Text style={styles.itemText}>
              {!!this.props.itemList.threadStatistics &&
              this.props.itemList.threadStatistics.commentNum > 0
                  ? this.props.itemList.threadStatistics.commentNum
                  : "评论"}
            </Text>
          </TouchableOpacity>
          <TouchableOpacity
              activeOpacity={0.8}
              style={styles.starItem}
              onPress={() => {
                this._starClick(
                    !!this.props.itemList.threadLike &&
                    !!this.props.itemList.threadLike.isActive
                        ? false
                        : true
                );
              }}
          >
            <Image
                style={styles.itemImg}
                source={
                  !!this.props.itemList.threadLike &&
                  !!this.props.itemList.threadLike.isActive
                      ? prised
                      : prise
                }
                resizeMode="contain"
            />
            <Text
                style={
                  !!this.props.itemList.threadLike &&
                  !!this.props.itemList.threadLike.isActive
                      ? styles.itemTextPrised
                      : styles.itemText
                }
            >
              {!!this.props.itemList.threadStatistics &&
              this.props.itemList.threadStatistics.likeNum > 0
                  ? this.props.itemList.threadStatistics.likeNum
                  : "赞"}
            </Text>
          </TouchableOpacity>
        </View>
    );
  }
}

const styles = StyleSheet.create({
  starItem: {
    flex: 1,
    justifyContent: "center",
    flexDirection: "row",
    alignItems: "center"
  },
  forwardingBg: {
    borderWidth: 1,
    borderColor: "#eeeeee"
  },

  itemText: {
    fontSize: 13,
    color: "rgba(0,0,0,0.65)",
    marginLeft: 10 / zoomW
  },

  itemTextPrised: {
    fontSize: 13,
    color: "#EF524C",
    marginLeft: 10 / zoomW
  },

  itemImg: {
    width: 15 / zoomW,
    height: 15 / zoomW
  },

  commonBg: {}
});