@beisen-cmps/cooperation/lib/reply.js

import "core-js/modules/es7.object.get-own-property-descriptors";
import "core-js/modules/es6.symbol";
import "core-js/modules/web.dom.iterable";
import "core-js/modules/es6.array.iterator";
import "core-js/modules/es6.object.to-string";
import "core-js/modules/es6.object.keys";
import "core-js/modules/es6.object.assign";
import "core-js/modules/es6.function.name";
import _defineProperty from "@babel/runtime/helpers/defineProperty";
import _regeneratorRuntime from "@babel/runtime/regenerator";
import "regenerator-runtime/runtime";
import _slicedToArray from "@babel/runtime/helpers/slicedToArray";

function ownKeys(object, enumerableOnly) { var keys = Object.keys(object); if (Object.getOwnPropertySymbols) { var symbols = Object.getOwnPropertySymbols(object); if (enumerableOnly) symbols = symbols.filter(function (sym) { return Object.getOwnPropertyDescriptor(object, sym).enumerable; }); keys.push.apply(keys, symbols); } return keys; }

function _objectSpread(target) { for (var i = 1; i < arguments.length; i++) { var source = arguments[i] != null ? arguments[i] : {}; if (i % 2) { ownKeys(source, true).forEach(function (key) { _defineProperty(target, key, source[key]); }); } else if (Object.getOwnPropertyDescriptors) { Object.defineProperties(target, Object.getOwnPropertyDescriptors(source)); } else { ownKeys(source).forEach(function (key) { Object.defineProperty(target, key, Object.getOwnPropertyDescriptor(source, key)); }); } } return target; }

import * as React from 'react';
import Reply from '@beisen-cmps/italent-reply';
import { ShowPopConfirm } from '@beisen-cmps/italent-feedmix-components';
import { deleteCommentById, addComment, getAllComment } from './helper/require';
import { handleReward, isI18NZH } from './helper/index';
import EmptyPage from './components/emptyPage/index';
import CommentorCooperation from './commentor-cooperation';
import ImgPreview from '@beisen-phoenix/img-preview';
import { isTop, getTenantId, getUserId, getApiPath, imgPreviewTop, getUserUrl } from './helper';
import { LIMITNUM } from './helper/const';
import '@beisen-cmps/italent-icon';
var useCallback = React.useCallback,
    useState = React.useState,
    useRef = React.useRef;

var CooReplyUser = function CooReplyUser(props) {
  return React.createElement("div", {
    className: "rp-container"
  }, props.translation.replyTo, React.createElement("span", {
    className: "rp-container-name"
  }, props.commentUser, React.createElement("span", {
    className: "_italent-font-close close",
    onClick: props.handleclearCommentUser
  })));
};

var CooReply = function CooReply(props) {
  var _props$feedComments = props.feedComments,
      feedComments = _props$feedComments === void 0 ? {
    total: 0,
    comments: []
  } : _props$feedComments,
      id = props.id,
      _props$isShowReward = props.isShowReward,
      isShowReward = _props$isShowReward === void 0 ? false : _props$isShowReward,
      _props$isShowMentionA = props.isShowMentionAllBtn,
      isShowMentionAllBtn = _props$isShowMentionA === void 0 ? true : _props$isShowMentionA,
      _props$userAdvanceMod = props.userAdvanceMode,
      userAdvanceMode = _props$userAdvanceMod === void 0 ? false : _props$userAdvanceMod,
      _props$isShowMentionB = props.isShowMentionBtn,
      isShowMentionBtn = _props$isShowMentionB === void 0 ? true : _props$isShowMentionB,
      _props$isShowEmojyBtn = props.isShowEmojyBtn,
      isShowEmojyBtn = _props$isShowEmojyBtn === void 0 ? true : _props$isShowEmojyBtn,
      _props$isShowVisible = props.isShowVisible,
      isShowVisible = _props$isShowVisible === void 0 ? false : _props$isShowVisible,
      _props$isShowModal = props.isShowModal,
      isShowModal = _props$isShowModal === void 0 ? false : _props$isShowModal,
      _props$isShowUploadBt = props.isShowUploadBtn,
      isShowUploadBtn = _props$isShowUploadBt === void 0 ? true : _props$isShowUploadBt,
      operationBtnExternal = props.operationBtnExternal,
      translation = props.translation;

  var _ref = feedComments || {},
      _ref$total = _ref.total,
      total = _ref$total === void 0 ? 0 : _ref$total,
      _ref$comments = _ref.comments,
      comments = _ref$comments === void 0 ? [] : _ref$comments;

  var textareaRef = useRef(); //是否显示图片预览

  var _useState = useState(false),
      _useState2 = _slicedToArray(_useState, 2),
      showImgPreview = _useState2[0],
      setShowImgPreview = _useState2[1]; //预览图片files


  var _useState3 = useState(),
      _useState4 = _slicedToArray(_useState3, 2),
      previewFiles = _useState4[0],
      setPreviewFiles = _useState4[1]; //默认展示的图片


  var _useState5 = useState(0),
      _useState6 = _slicedToArray(_useState5, 2),
      previewIndex = _useState6[0],
      setPreviewIndex = _useState6[1]; //所有的条数


  var _useState7 = useState(total),
      _useState8 = _slicedToArray(_useState7, 2),
      allTotal = _useState8[0],
      setAllTotal = _useState8[1]; //用于存储当前点击是不是回复的别人的回复


  var _useState9 = useState(0),
      _useState10 = _slicedToArray(_useState9, 2),
      commentId = _useState10[0],
      setCommentId = _useState10[1]; // 回复具体的某人


  var _useState11 = useState(''),
      _useState12 = _slicedToArray(_useState11, 2),
      commentUser = _useState12[0],
      setCommentUser = _useState12[1]; //所有的回复


  var _useState13 = useState(comments),
      _useState14 = _slicedToArray(_useState13, 2),
      allComments = _useState14[0],
      setComments = _useState14[1];

  var handleDeleteReply = useCallback(function (commentId, target, hoverCallback) {
    ShowPopConfirm({
      message: translation.deleteMsg,
      targetNode: target,
      isShowTriangle: false,
      align: 'right',
      handleOk: function handleOk() {
        var _ref2, Code, newComments;

        return _regeneratorRuntime.async(function handleOk$(_context) {
          while (1) {
            switch (_context.prev = _context.next) {
              case 0:
                _context.next = 2;
                return _regeneratorRuntime.awrap(deleteCommentById({
                  feed_id: id,
                  comment_id: commentId
                }));

              case 2:
                _ref2 = _context.sent;
                Code = _ref2.Code;

                if (Code == 1) {
                  // callback(commentId)
                  newComments = allComments.filter(function (item) {
                    return item.commentId != commentId;
                  });
                  setComments(newComments);
                  setAllTotal(allTotal - 1);
                } //用于控制单条feed的状态


                hoverCallback(true);

              case 6:
              case "end":
                return _context.stop();
            }
          }
        });
      },
      handleClose: function handleClose() {
        hoverCallback(true);
      },
      cancelText: translation.cancelText,
      confirmText: translation.confirmText,
      size: {
        height: isI18NZH() ? 80 : 100,
        width: 260
      }
    });
  }, [allTotal, allComments]);
  var handleAddComment = useCallback(function (obj) {
    addComment(_objectSpread({}, obj, {
      FeedId: id,
      CommentId: commentId
    })).then(function (data) {
      var Code = data.Code,
          Data = data.Data;

      if (Code === 1) {
        var newComments;

        if (allComments && allComments.length > 0) {
          newComments = [].concat(allComments, [Data]);
        } else {
          newComments = [Data];
        }

        setCommentId(0);
        setCommentUser('');
        setComments(newComments);
        setAllTotal(allTotal + 1);
      }
    });
  }, [id, allComments, allTotal, commentId, commentUser]);
  var handleReplyClick = useCallback(function (commentId, target, hoverCallback) {
    setCommentId(commentId);
    setCommentUser(target.name); //点击回复自动获取焦点

    textareaRef.current && textareaRef.current.focus();
  }, [commentId, commentUser]); //显示全部沟通

  var handleShowAllReply = useCallback(function (flag) {
    if (flag) {
      getAllComment({
        feed_id: id
      }).then(function (data) {
        var Code = data.Code,
            Data = data.Data;

        if (Code === 1 && Data) {
          setAllTotal(Data.total);
          setComments(Data.comments);
        }
      });
    } else {
      var cLength = allComments.length;

      if (cLength > LIMITNUM) {
        setComments(allComments.slice(cLength - LIMITNUM));
      }
    }
  }, [allComments, id]); //图片预览

  var handleImgPreview = useCallback(function (files, index) {
    if (isTop()) {
      setPreviewFiles(files);
      setPreviewIndex(index);
      setShowImgPreview(true);
    } else {
      imgPreviewTop(files, index);
    }
  }, []); //关闭图片预览

  var handleImgPreviewClose = useCallback(function () {
    setShowImgPreview(false);
  }, []); //图片下载

  var handleImgDownload = useCallback(function (file) {
    if (file && file.downloadUrl) {
      window.open(file.downloadUrl, '_self');
    }
  }, []); //清除选择的回复人

  var handleclearCommentUser = useCallback(function () {
    setCommentUser('');
    setCommentId(0);
  }, []);
  var getTextRef = useCallback(function (ref) {
    textareaRef.current = ref;
  }, []); // 处理打赏

  var handleRewardFunc = useCallback(function (val) {
    handleReward(val, id);
  }, [id]);
  var replyProps = {
    total: allTotal,
    comments: allComments,
    isShowAllReply: total > LIMITNUM,
    isShowReward: isShowReward,
    onReward: handleRewardFunc,
    onReplyDelete: handleDeleteReply,
    onShowAllReply: handleShowAllReply,
    onImgPreview: handleImgPreview,
    onReply: handleReplyClick,
    isShowModal: isShowModal,
    getUserUrl: getUserUrl,
    isBgColor: false
  };
  return React.createElement(React.Fragment, null, allTotal > 0 ? React.createElement(Reply, Object.assign({}, replyProps)) : React.createElement(EmptyPage, {
    translation: translation
  }), React.createElement("div", {
    className: "rp-body"
  }, commentUser && React.createElement(CooReplyUser, {
    commentUser: commentUser,
    handleclearCommentUser: handleclearCommentUser,
    translation: translation
  }), React.createElement(CommentorCooperation, {
    tenantId: getTenantId(),
    apiPath: getApiPath(),
    userId: getUserId(),
    onAddComment: handleAddComment,
    getTextRef: getTextRef,
    isShowRewardBtn: isShowReward,
    feedId: id,
    userAdvanceMode: userAdvanceMode,
    isShowMentionAllBtn: isShowMentionAllBtn,
    isShowVisible: isShowVisible,
    isShowMentionBtn: isShowMentionBtn,
    isShowEmojyBtn: isShowEmojyBtn,
    isShowUploadBtn: isShowUploadBtn,
    isShowModal: isShowModal,
    operationBtnExternal: operationBtnExternal,
    translation: translation
  })), showImgPreview && React.createElement(ImgPreview, {
    files: previewFiles,
    onClose: handleImgPreviewClose,
    onDownload: handleImgDownload,
    defaultSelected: previewIndex
  }));
};

export default CooReply;