linkmore-design 1.1.20 → 1.1.22

package/es/Approval/handle.js

@@ -0,0 +1,138 @@
+import _slicedToArray from "@babel/runtime/helpers/esm/slicedToArray";
+import { ApprovalType, StatusType } from "./type";
+/**
+ * 获取现在到之前的时间差
+ * @param time
+ * @returns
+ */
+
+export function getDistanceTime(time) {
+  if (typeof time === 'string' || typeof time === 'number') {
+    time = new Date(time);
+  }
+
+  var result = '';
+  var dis = Date.now() - time.getTime();
+  var second = parseInt(dis / 1000 + '');
+  var day = parseInt(second / 3600 / 24 + '');
+  var hour = parseInt(second / 3600 % 24 + '');
+  var minute = parseInt(second / 60 % 60 + '');
+
+  if (day > 0) {
+    result += day + '天' + hour + '小时' + minute + '分钟';
+  } else {
+    if (hour > 0) {
+      result += hour + '小时' + minute + '分钟';
+    } else {
+      result += minute + '分钟';
+    }
+  }
+
+  return result;
+}
+export function getCurrentTime() {
+  var _Date$toLocaleString$ = new Date().toLocaleString().split(' '),
+      _Date$toLocaleString$2 = _slicedToArray(_Date$toLocaleString$, 2),
+      t1 = _Date$toLocaleString$2[0],
+      t2 = _Date$toLocaleString$2[1];
+
+  var _t1$split = t1.split('/'),
+      _t1$split2 = _slicedToArray(_t1$split, 3),
+      y = _t1$split2[0],
+      m = _t1$split2[1],
+      d = _t1$split2[2];
+
+  var _t2$split = t2.split(':'),
+      _t2$split2 = _slicedToArray(_t2$split, 2),
+      h = _t2$split2[0],
+      minute = _t2$split2[1];
+
+  if (m.length === 1) {
+    m = 0 + m;
+  }
+
+  if (d.length === 1) {
+    d = 0 + d;
+  }
+
+  return y + '-' + m + '-' + d + ' ' + h + ':' + minute;
+}
+export var wrapperComment = function wrapperComment(user, steps, update, setUpdate) {
+  return function (value) {
+    var index = steps.findIndex(function (step) {
+      return ApprovalType.isPending(step.type, step.approvalStatus);
+    });
+    steps.splice(index, 0, {
+      name: user,
+      time: getCurrentTime(),
+      type: ApprovalType.ONLY_COMMENT,
+      comment: value
+    });
+    setUpdate(!update);
+  };
+};
+export var wrapperAgree = function wrapperAgree(user, steps, update, setUpdate) {
+  return function (value) {
+    var currentTime = getCurrentTime();
+    var index = steps.findIndex(function (step) {
+      return ApprovalType.isPending(step.type, step.approvalStatus);
+    });
+
+    if (index < 0) {
+      return;
+    }
+
+    var step = steps[index];
+
+    if (step.agreeList.length >= step.approverList.length) {
+      return;
+    }
+
+    step.agreeList.push(user);
+
+    if (step.everyoneAgree) {
+      if (step.agreeList.length === step.approverList.length) {
+        step.approvalStatus = StatusType.AGREE;
+        step.name = user;
+        step.comment = value;
+        step.time = currentTime;
+      } else {
+        // 新增一条记录
+        steps.splice(index, 0, {
+          name: user,
+          time: currentTime,
+          type: ApprovalType.APPROVAL,
+          approvalStatus: StatusType.AGREE,
+          comment: value
+        });
+      }
+    } else {
+      step.approvalStatus = StatusType.AGREE;
+      step.name = user;
+      step.comment = value;
+      step.time = currentTime;
+    }
+
+    var nextNode = steps.find(function (step) {
+      return ApprovalType.isPending(step.type, step.approvalStatus);
+    });
+
+    if (nextNode) {
+      nextNode.time = currentTime;
+    }
+
+    setUpdate(!update);
+  };
+};
+export var wrapperRefuse = function wrapperRefuse(user, steps, update, setUpdate) {
+  return function (value) {
+    var step = steps.find(function (step) {
+      return ApprovalType.isPending(step.type, step.approvalStatus);
+    });
+    step.refuse = user;
+    step.approvalStatus = StatusType.REFUSE;
+    step.comment = value;
+    step.time = getCurrentTime();
+    setUpdate(!update);
+  };
+};

package/es/Approval/index.d.ts

@@ -0,0 +1,5 @@
+import React from 'react';
+import { IApprovalProps } from './type';
+declare const LMApproval: React.FC<IApprovalProps>;
+export default LMApproval;
+export type { ApprovalType, StatusType, IApprovalItemProps, IApprovalProps } from './type';

package/es/Approval/index.js

@@ -0,0 +1,461 @@
+import _slicedToArray from "@babel/runtime/helpers/esm/slicedToArray";
+
+var __rest = this && this.__rest || function (s, e) {
+  var t = {};
+
+  for (var p in s) {
+    if (Object.prototype.hasOwnProperty.call(s, p) && e.indexOf(p) < 0) t[p] = s[p];
+  }
+
+  if (s != null && typeof Object.getOwnPropertySymbols === "function") for (var i = 0, p = Object.getOwnPropertySymbols(s); i < p.length; i++) {
+    if (e.indexOf(p[i]) < 0 && Object.prototype.propertyIsEnumerable.call(s, p[i])) t[p[i]] = s[p[i]];
+  }
+  return t;
+};
+
+import React, { forwardRef, useImperativeHandle, useState } from 'react';
+import classNames from 'classnames';
+import { Button, Drawer, IconFont, Space } from '..';
+import { ApprovalType } from './type';
+import { currentUserIsApprover, currentUserIsProposer, getStatus } from './util';
+import { wrapperAgree, wrapperComment, wrapperRefuse, getCurrentTime, getDistanceTime } from './handle';
+var prefixCls = 'lm_approval';
+var colors = ['#36BCF1', '#AE86DC', '#8BD248', '#F5A173'];
+var cacheColorMap = new Map();
+
+var getColorWithCache = function getColorWithCache(key) {
+  var color;
+
+  if (cacheColorMap.has(key)) {
+    color = cacheColorMap.get(key);
+  } else {
+    color = colors[parseInt(Math.random() * 4 + '')];
+    cacheColorMap.set(key, color);
+  }
+
+  return color;
+};
+
+var getLastChar = function getLastChar(name) {
+  return name.substring(name.length - 1, name.length);
+};
+
+var LMDrawer = function LMDrawer(props) {
+  var _props$visible = props.visible,
+      visible = _props$visible === void 0 ? false : _props$visible,
+      _props$title = props.title,
+      title = _props$title === void 0 ? '' : _props$title,
+      user = props.user,
+      onClose = props.onClose,
+      children = props.children,
+      _props$steps = props.steps,
+      steps = _props$steps === void 0 ? [] : _props$steps,
+      _props$onComment = props.onComment,
+      onComment = _props$onComment === void 0 ? function () {} : _props$onComment,
+      _props$onRefuse = props.onRefuse,
+      onRefuse = _props$onRefuse === void 0 ? function () {} : _props$onRefuse,
+      _props$onAgree = props.onAgree,
+      onAgree = _props$onAgree === void 0 ? function () {} : _props$onAgree;
+  var status = getStatus(steps);
+  var currentStatusCls = classNames(prefixCls + '_title_status');
+  var drawerCls = classNames(prefixCls + '_drawer');
+  var statusText = ApprovalType.toText(ApprovalType.APPROVAL, status);
+
+  var handleClose = function handleClose() {
+    visible = false;
+    onClose();
+  };
+
+  return /*#__PURE__*/React.createElement(Drawer, {
+    className: drawerCls,
+    visible: visible,
+    title: title,
+    onClose: handleClose,
+    extra: /*#__PURE__*/React.createElement(React.Fragment, null, /*#__PURE__*/React.createElement("div", {
+      className: currentStatusCls
+    }, ApprovalType.isPending(ApprovalType.APPROVAL, status) && /*#__PURE__*/React.createElement(IconFont, {
+      className: 'icon blue',
+      type: "lmweb-yuanxing-gengduo"
+    }), ApprovalType.isAgree(ApprovalType.APPROVAL, status) && /*#__PURE__*/React.createElement(IconFont, {
+      className: 'icon green',
+      type: "lmweb-check-circle-fill"
+    }), ApprovalType.isRefuse(ApprovalType.APPROVAL, status) && /*#__PURE__*/React.createElement(IconFont, {
+      className: 'icon grey',
+      type: "lmweb-stop"
+    }), /*#__PURE__*/React.createElement("span", null, statusText)), ApprovalType.isPending(ApprovalType.APPROVAL, status) && currentUserIsApprover(steps, user) && /*#__PURE__*/React.createElement(Space, null, /*#__PURE__*/React.createElement(Button, {
+      size: "small",
+      onClick: onComment
+    }, "\u4EC5\u8BC4\u8BBA"), /*#__PURE__*/React.createElement(Button, {
+      size: "small",
+      onClick: onRefuse,
+      style: {
+        borderColor: '#FA4F53',
+        color: '#FA4F53'
+      }
+    }, "\u62D2\u7EDD"), /*#__PURE__*/React.createElement(Button, {
+      size: "small",
+      onClick: onAgree,
+      type: "primary"
+    }, "\u540C\u610F")))
+  }, children);
+};
+
+var ApprovalItem = function ApprovalItem(props) {
+  var _props$avator = props.avator,
+      avator = _props$avator === void 0 ? '' : _props$avator,
+      _props$name = props.name,
+      name = _props$name === void 0 ? '' : _props$name,
+      _props$time = props.time,
+      time = _props$time === void 0 ? '' : _props$time,
+      type = props.type,
+      _props$agreeList = props.agreeList,
+      agreeList = _props$agreeList === void 0 ? [] : _props$agreeList,
+      _props$approverList = props.approverList,
+      approverList = _props$approverList === void 0 ? [] : _props$approverList,
+      _props$everyoneAgree = props.everyoneAgree,
+      everyoneAgree = _props$everyoneAgree === void 0 ? false : _props$everyoneAgree,
+      _props$comment = props.comment,
+      comment = _props$comment === void 0 ? null : _props$comment,
+      _props$carbonCopyList = props.carbonCopyList,
+      carbonCopyList = _props$carbonCopyList === void 0 ? [] : _props$carbonCopyList,
+      _props$urge = props.urge,
+      urge = _props$urge === void 0 ? false : _props$urge,
+      approvalStatus = props.approvalStatus,
+      _isSelf = props._isSelf,
+      _user = props._user,
+      onUrge = props.onUrge,
+      onDeleteComment = props.onDeleteComment;
+  var itemCls = classNames(prefixCls + '_item');
+  var itemHeaderCls = classNames(itemCls + '_header');
+  var itemBodyCls = classNames(itemCls + '_body', ApprovalType.isPending(type, approvalStatus) ? 'small' : '');
+
+  var getIcon = function getIcon() {
+    if (ApprovalType.isRefuse(type, approvalStatus)) {
+      return /*#__PURE__*/React.createElement(IconFont, {
+        className: 'icon red',
+        type: "lmweb-close-circle-fill"
+      });
+    }
+
+    if (ApprovalType.isPending(type, approvalStatus)) {
+      return /*#__PURE__*/React.createElement(IconFont, {
+        className: 'icon blue',
+        type: "lmweb-yuanxing-gengduo"
+      });
+    }
+
+    return /*#__PURE__*/React.createElement(IconFont, {
+      className: 'icon green',
+      type: "lmweb-check-circle-fill"
+    });
+  };
+
+  var getApprovalText = function getApprovalText() {
+    if (ApprovalType.isPending(type, approvalStatus)) {
+      return /*#__PURE__*/React.createElement("div", {
+        className: 'desc blue'
+      }, "\u5BA1\u6838\u4E2D");
+    } else if (ApprovalType.isAgree(type, approvalStatus)) {
+      return /*#__PURE__*/React.createElement("div", {
+        className: 'desc green'
+      }, "\u5DF2\u540C\u610F");
+    } else if (ApprovalType.isRefuse(type, approvalStatus)) {
+      return /*#__PURE__*/React.createElement("div", {
+        className: 'desc red'
+      }, "\u62D2\u7EDD");
+    } else if (type === ApprovalType.START) {
+      return /*#__PURE__*/React.createElement("div", {
+        className: 'desc green'
+      }, "\u53D1\u8D77\u5BA1\u6279");
+    } else if (type === ApprovalType.ONLY_COMMENT) {
+      return /*#__PURE__*/React.createElement("div", {
+        className: 'desc grey'
+      }, "\u4EC5\u8BC4\u8BBA");
+    } else if (type === ApprovalType.CARBON_COPY) {
+      return /*#__PURE__*/React.createElement("div", {
+        className: 'desc grey'
+      }, "\u5DF2\u6284\u9001", carbonCopyList.length, "\u4EBA");
+    }
+
+    return null;
+  };
+
+  var renderTip = function renderTip() {
+    if (ApprovalType.isPending(type, approvalStatus)) {
+      if (everyoneAgree) {
+        return /*#__PURE__*/React.createElement("div", {
+          className: "agree-tip"
+        }, "\u9700\u8981\u6240\u6709\u5BA1\u6279\u4EBA\u90FD\u540C\u610F");
+      }
+
+      return /*#__PURE__*/React.createElement("div", {
+        className: "agree-tip"
+      }, "\u81F3\u5C11\u4E00\u4E2A\u5BA1\u6279\u4EBA\u540C\u610F\u5373\u53EF");
+    }
+
+    return null;
+  };
+
+  var renderComment = function renderComment() {
+    if (comment) {
+      return /*#__PURE__*/React.createElement(React.Fragment, null, /*#__PURE__*/React.createElement("div", {
+        className: 'comment'
+      }, "\u201C", comment, "\u201D", ApprovalType.isOnlyComment(type) && currentUserIsProposer(_user, name) && /*#__PURE__*/React.createElement("div", {
+        className: 'comment-delete',
+        onClick: onDeleteComment
+      }, /*#__PURE__*/React.createElement(IconFont, {
+        className: "icon",
+        type: "lmweb-delete"
+      }), " \u5220\u9664")));
+    }
+
+    return null;
+  };
+
+  var renderUrge = function renderUrge() {
+    // 当前用户是提议发起者 && 审核中
+    if (_isSelf && ApprovalType.isPending(type, approvalStatus)) {
+      return /*#__PURE__*/React.createElement(Button, {
+        className: "urge",
+        disabled: urge,
+        size: "small",
+        onClick: onUrge
+      }, urge ? '已催办' : '催一下');
+    }
+
+    return null;
+  };
+
+  var renderList = function renderList() {
+    var list = [];
+
+    if (ApprovalType.isCC(type)) {
+      list = carbonCopyList;
+    } else if (ApprovalType.isApproval(type)) {
+      list = approverList.slice(agreeList.length);
+    }
+
+    var separate = type === ApprovalType.APPROVAL && everyoneAgree; // 审批拒绝
+
+    if (ApprovalType.isRefuse(type, approvalStatus)) {
+      return null;
+    } // 审批通过
+
+
+    if (ApprovalType.isAgree(type, approvalStatus)) {
+      return null;
+    }
+
+    if (list.length) {
+      return /*#__PURE__*/React.createElement("div", {
+        className: 'lm-approver-wrapper'
+      }, /*#__PURE__*/React.createElement("div", {
+        className: 'lm-approver-box'
+      }, list.map(function (item, i) {
+        return /*#__PURE__*/React.createElement(React.Fragment, {
+          key: item + i
+        }, /*#__PURE__*/React.createElement("div", {
+          className: 'lm-approver-cell'
+        }, /*#__PURE__*/React.createElement("div", {
+          className: 'lm-approver-circle',
+          style: {
+            backgroundColor: getColorWithCache(item)
+          }
+        }, getLastChar(item)), /*#__PURE__*/React.createElement("span", null, item)), separate && i != list.length - 1 && /*#__PURE__*/React.createElement(IconFont, {
+          className: 'icon',
+          type: "lmweb-icon_m_put_away"
+        }));
+      })), renderUrge());
+    }
+
+    return null;
+  };
+
+  var renderTime = function renderTime() {
+    // 审核中
+    if (ApprovalType.isPending(type, approvalStatus)) {
+      return /*#__PURE__*/React.createElement("span", {
+        className: 'yellow'
+      }, "\u5DF2\u7B49\u5F85".concat(getDistanceTime(time)));
+    }
+
+    return /*#__PURE__*/React.createElement("span", null, time);
+  };
+
+  var renderAvator = function renderAvator() {
+    if (ApprovalType.isCC(type)) {
+      return /*#__PURE__*/React.createElement(React.Fragment, null, /*#__PURE__*/React.createElement("div", {
+        className: 'cc-box'
+      }, /*#__PURE__*/React.createElement(IconFont, {
+        className: 'cc',
+        type: "lmweb-a-chaosongrenchaosongyonghu-02"
+      })), getIcon());
+    }
+
+    if (ApprovalType.isPending(type, approvalStatus)) {
+      return /*#__PURE__*/React.createElement(React.Fragment, null, /*#__PURE__*/React.createElement("div", {
+        className: 'cc-box'
+      }, /*#__PURE__*/React.createElement(IconFont, {
+        className: 'cc',
+        type: "lmweb-audit"
+      })), getIcon());
+    }
+
+    if (avator) {
+      return /*#__PURE__*/React.createElement(React.Fragment, null, /*#__PURE__*/React.createElement("img", {
+        className: 'picture',
+        src: avator,
+        alt: ""
+      }), getIcon());
+    }
+
+    return /*#__PURE__*/React.createElement(React.Fragment, null, /*#__PURE__*/React.createElement("div", {
+      className: 'subname',
+      style: {
+        backgroundColor: getColorWithCache(name)
+      }
+    }, getLastChar(name)), getIcon());
+  };
+
+  return /*#__PURE__*/React.createElement("div", {
+    className: itemCls
+  }, /*#__PURE__*/React.createElement("div", {
+    className: itemHeaderCls
+  }, /*#__PURE__*/React.createElement("div", {
+    className: "avator"
+  }, renderAvator()), /*#__PURE__*/React.createElement("div", {
+    className: "content"
+  }, /*#__PURE__*/React.createElement("div", {
+    className: 'name'
+  }, name), getApprovalText()), /*#__PURE__*/React.createElement("div", {
+    className: "right"
+  }, renderTime())), type !== ApprovalType.START && /*#__PURE__*/React.createElement("div", {
+    className: itemBodyCls
+  }, renderTip(), renderComment(), renderList()));
+};
+
+var Approval = /*#__PURE__*/forwardRef(function (props, ref) {
+  var _props$proposer = props.proposer,
+      proposer = _props$proposer === void 0 ? '' : _props$proposer,
+      _props$user = props.user,
+      user = _props$user === void 0 ? '' : _props$user,
+      _props$steps2 = props.steps,
+      steps = _props$steps2 === void 0 ? [] : _props$steps2,
+      _onUrge2 = props.onUrge,
+      _props$onCarbonCopy = props.onCarbonCopy,
+      onCarbonCopy = _props$onCarbonCopy === void 0 ? function () {} : _props$onCarbonCopy,
+      _props$onDeleteCommen = props.onDeleteComment,
+      _onDeleteComment = _props$onDeleteCommen === void 0 ? function () {} : _props$onDeleteCommen;
+
+  var weakmap = new WeakMap();
+
+  var _isSelf = currentUserIsProposer(proposer, user);
+
+  var mark = false;
+  steps.forEach(function (step) {
+    if (ApprovalType.isPending(step.type, step.approvalStatus) && !step.name) {
+      step.name = '审批';
+    }
+
+    if (ApprovalType.isCC(step.type) && !step.name) {
+      step.name = '抄送人';
+    }
+
+    if (step.refuse) {
+      step.name = step.refuse;
+    }
+
+    if (!step.name) {
+      step.name = 'unkonwn';
+    }
+
+    if (mark) {
+      weakmap.set(step, {
+        hidden: true
+      });
+    } // 拒绝|审核中，后面的不展示
+
+
+    if (ApprovalType.isPending(step.type, step.approvalStatus) || ApprovalType.isRefuse(step.type, step.approvalStatus)) {
+      mark = true;
+    }
+  });
+  var list = []; // 210 012
+
+  var _loop = function _loop(i) {
+    var step = steps[i];
+    var obj = weakmap.get(step);
+
+    if (obj && obj.hidden) {
+      return "continue";
+    } // 抄送
+
+
+    if (ApprovalType.isCC(step.type) && !step.isCarbonCopy) {
+      onCarbonCopy(step, i, steps);
+      step.time = getCurrentTime();
+      step.isCarbonCopy = true;
+    }
+
+    var element = /*#__PURE__*/React.createElement(ApprovalItem, Object.assign({
+      key: step.name + i,
+      _isSelf: _isSelf,
+      _user: user
+    }, step, {
+      onUrge: function onUrge() {
+        _onUrge2(step, i, steps);
+      },
+      onDeleteComment: function onDeleteComment() {
+        _onDeleteComment(step, i, steps);
+      }
+    }));
+    list.push(element);
+  };
+
+  for (var i = steps.length - 1; i >= 0; i--) {
+    var _ret = _loop(i);
+
+    if (_ret === "continue") continue;
+  }
+
+  return /*#__PURE__*/React.createElement(React.Fragment, null, list);
+});
+var LMApproval = /*#__PURE__*/forwardRef(function (props, ref) {
+  var className = props.className,
+      _props$onUrge = props.onUrge,
+      onUrge = _props$onUrge === void 0 ? function () {} : _props$onUrge,
+      _props$onDeleteCommen2 = props.onDeleteComment,
+      onDeleteComment = _props$onDeleteCommen2 === void 0 ? function () {} : _props$onDeleteCommen2,
+      others = __rest(props, ["className", "onUrge", "onDeleteComment"]);
+
+  var _useState = useState(false),
+      _useState2 = _slicedToArray(_useState, 2),
+      update = _useState2[0],
+      setUpdate = _useState2[1];
+
+  var comment = wrapperComment(others.user, others.steps, update, setUpdate);
+  var agree = wrapperAgree(others.user, others.steps, update, setUpdate);
+  var refuse = wrapperRefuse(others.user, others.steps, update, setUpdate);
+  useImperativeHandle(ref, function () {
+    return {
+      comment: comment,
+      agree: agree,
+      refuse: refuse
+    };
+  });
+
+  var _onUrge = function _onUrge(step, i, steps) {
+    step.urge = true;
+    onUrge(step, i, steps);
+    setUpdate(!update);
+  };
+
+  return /*#__PURE__*/React.createElement(LMDrawer, Object.assign({
+    className: classNames(className, prefixCls)
+  }, others), /*#__PURE__*/React.createElement(Approval, Object.assign({}, others, {
+    onUrge: _onUrge,
+    onDeleteComment: onDeleteComment,
+    __update: update
+  })));
+});
+export default LMApproval;