@titaui/pc 1.11.47 → 1.12.0-beta.1

package/lib/components/okr-detail/detail-header/delete-confirm/delete-confirm.js

@@ -9,15 +9,13 @@ exports["default"] = void 0;
 
 var _react = _interopRequireWildcard(require("react"));
 
-var _getLocale = require("../../../../utils/getLocale");
+var _titaUi = require("tita-ui");
 
-var _dialogConfirm = _interopRequireDefault(require("../../../dialog-confirm"));
+var _style = require("./style");
 
 var _tooltip = _interopRequireDefault(require("../../../tooltip"));
 
-var _form = _interopRequireDefault(require("../../../form"));
-
-require("./index.css");
+var _getLocale = require("../../../../utils/getLocale");
 
 function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { "default": obj }; }
 
@@ -37,116 +35,61 @@ function _iterableToArrayLimit(arr, i) { var _i = arr == null ? null : typeof Sy
 
 function _arrayWithHoles(arr) { if (Array.isArray(arr)) return arr; }
 
-var prefix = "okr-detail-delete-confirm";
-var Radios = _form["default"].Fields.Radios;
-var radios = [{
-  label: /*#__PURE__*/_react["default"].createElement("span", {
-    className: "".concat(prefix, "__option-text")
-  }, (0, _getLocale.getLocale)("OKR_MyO_Text_OdeletionNTask")),
-  value: 0
-}, {
-  label: /*#__PURE__*/_react["default"].createElement("span", {
-    className: "".concat(prefix, "__option-text")
-  }, (0, _getLocale.getLocale)("OKR_MyO_Text_OdeletionTask"), /*#__PURE__*/_react["default"].createElement(_tooltip["default"], {
-    overlay: (0, _getLocale.getLocale)("Pro_detail_Tasksapproval"),
-    placement: "top",
-    zIndex: 15000
-  }, /*#__PURE__*/_react["default"].createElement("span", {
-    className: "".concat(prefix, "__icon tu-icon-wiki")
-  }))),
-  value: 1
-}, {
-  label: /*#__PURE__*/_react["default"].createElement("span", {
-    className: "".concat(prefix, "__option-text")
-  }, (0, _getLocale.getLocale)("Pro_detail_Attheametime"), /*#__PURE__*/_react["default"].createElement(_tooltip["default"], {
-    overlay: (0, _getLocale.getLocale)("Pro_detail_Tasksapproval"),
-    placement: "top",
-    zIndex: 15000
-  }, /*#__PURE__*/_react["default"].createElement("span", {
-    className: "".concat(prefix, "__icon tu-icon-wiki")
-  }))),
-  value: 2
-}];
-var OkrDeletePop = /*#__PURE__*/(0, _react.forwardRef)(function (_ref, ref) {
-  var onCancel = _ref.onCancel,
-      onConfirm = _ref.onConfirm,
-      approvalSetting = _ref.approvalSetting,
-      okrInfo = _ref.okrInfo;
-
-  var _useState = (0, _react.useState)(false),
-      _useState2 = _slicedToArray(_useState, 2),
-      showConfirmPop = _useState2[0],
-      setShowConfirmPop = _useState2[1];
+var getDeleteOptions = function getDeleteOptions() {
+  return [{
+    id: 0,
+    text: "不删除目标下的任务",
+    tips: ""
+  }, {
+    id: 1,
+    text: "同时删除目标下所有任务",
+    tips: (0, _getLocale.getLocale)("Pro_detail_Tasksapproval")
+  }, {
+    id: 2,
+    text: (0, _getLocale.getLocale)("Pro_detail_Attheametime"),
+    tips: (0, _getLocale.getLocale)("Pro_detail_Tasksapproval")
+  }];
+};
+
+function OkrDeleteConfirm(_ref) {
+  var onConfirm = _ref.onConfirm,
+      onCancel = _ref.onCancel;
 
-  var _useState3 = (0, _react.useState)(0),
-      _useState4 = _slicedToArray(_useState3, 2),
-      selected = _useState4[0],
-      setSelected = _useState4[1];
+  var _useState = (0, _react.useState)(0),
+      _useState2 = _slicedToArray(_useState, 2),
+      selected = _useState2[0],
+      setSelected = _useState2[1];
 
-  var handleCancelClick = function handleCancelClick() {
-    if (onCancel) {
+  return /*#__PURE__*/_react["default"].createElement(_style.DeleteWrapper, {
+    onClick: function onClick(e) {
+      return e.stopPropagation();
+    }
+  }, /*#__PURE__*/_react["default"].createElement(_style.DeleteTitle, null, "\u76EE\u6807\u5220\u9664\u64CD\u4F5C\u4E0D\u53EF\u6062\u590D\uFF01\u8BF7\u8C28\u614E\u64CD\u4F5C"), /*#__PURE__*/_react["default"].createElement("div", null, getDeleteOptions().map(function (option) {
+    return /*#__PURE__*/_react["default"].createElement(_style.Options, {
+      key: option.id,
+      onClick: function onClick() {
+        return setSelected(option.id);
+      }
+    }, /*#__PURE__*/_react["default"].createElement(_style.Icon, {
+      className: selected == option.id ? "tu-icon-singlebox-avtive" : "tu-icon-singlebox-have"
+    }), /*#__PURE__*/_react["default"].createElement("p", null, option.text), option.tips && /*#__PURE__*/_react["default"].createElement(_tooltip["default"], {
+      overlay: option.tips,
+      placement: "top",
+      zIndex: 15000
+    }, /*#__PURE__*/_react["default"].createElement(_style.Icon, {
+      className: "tu-icon-warning"
+    })));
+  })), /*#__PURE__*/_react["default"].createElement(_style.ButtonGroup, null, /*#__PURE__*/_react["default"].createElement(_titaUi.Button, {
+    onClick: function onClick() {
       onCancel();
     }
-
-    setShowConfirmPop(false);
-  };
-
-  var handleConfirmClick = function handleConfirmClick() {
-    if (onConfirm) {
-      onConfirm(selected);
+  }, (0, _getLocale.getLocale)("Mod_Cancel")), /*#__PURE__*/_react["default"].createElement(_titaUi.Button, {
+    type: "primary",
+    onClick: function onClick() {
+      return onConfirm(selected);
     }
+  }, (0, _getLocale.getLocale)("Pro_detail_Submission"))));
+}
 
-    setShowConfirmPop(false);
-  };
-
-  var show = function show() {
-    setShowConfirmPop(true);
-  };
-
-  var hide = function hide() {
-    setShowConfirmPop(false);
-  };
-
-  var showApprovalCmp = (0, _react.useMemo)(function () {
-    return approvalSetting.isOpen && approvalSetting.deleteOkr && !okrInfo.OkrAndKrApprovalTypes.includes(53);
-  }, [approvalSetting, okrInfo]);
-
-  var handleChangeDeleteRadios = function handleChangeDeleteRadios(value) {
-    setSelected(value);
-  };
-
-  (0, _react.useImperativeHandle)(ref, function () {
-    return {
-      show: show,
-      hide: hide
-    };
-  });
-  var renderDialogConfirm = (0, _react.useMemo)(function () {
-    return /*#__PURE__*/_react["default"].createElement(_dialogConfirm["default"], {
-      zIndex: 1200,
-      visible: showConfirmPop,
-      type: "warning",
-      className: prefix
-    }, /*#__PURE__*/_react["default"].createElement("span", {
-      type: "title"
-    }, showApprovalCmp ? (0, _getLocale.getLocale)("OKR_MyO_Deleteoapproval") : (0, _getLocale.getLocale)("OKR_MyO_Determinedeletiono")), /*#__PURE__*/_react["default"].createElement("span", {
-      type: "content"
-    }, !showApprovalCmp && (0, _getLocale.getLocale)("OKR_MyO_Text_Odeletion"), /*#__PURE__*/_react["default"].createElement("div", null, /*#__PURE__*/_react["default"].createElement(Radios, {
-      radios: radios,
-      value: 0,
-      onChange: handleChangeDeleteRadios
-    }))), /*#__PURE__*/_react["default"].createElement(_dialogConfirm["default"].CancelButton, {
-      type: "button",
-      onClick: handleCancelClick
-    }, (0, _getLocale.getLocale)("Mod_Cancel")), /*#__PURE__*/_react["default"].createElement(_dialogConfirm["default"].SureButton, {
-      type: "button",
-      onClick: handleConfirmClick
-    }, showApprovalCmp ? (0, _getLocale.getLocale)("OKR_MyO_Submittedapproval") : (0, _getLocale.getLocale)("Pro_detail_Submission")));
-  }, [showConfirmPop, selected]);
-  return renderDialogConfirm;
-});
-OkrDeletePop.defaultProps = {
-  onCancel: function onCancel() {}
-};
-var _default = OkrDeletePop;
+var _default = OkrDeleteConfirm;
 exports["default"] = _default;

package/lib/components/okr-detail/detail-header/delete-confirm/style.js

@@ -0,0 +1,38 @@
+"use strict";
+
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+exports.Options = exports.Icon = exports.DeleteWrapper = exports.DeleteTitle = exports.ButtonGroup = void 0;
+
+var _styledComponents = _interopRequireDefault(require("styled-components"));
+
+var _templateObject, _templateObject2, _templateObject3, _templateObject4, _templateObject5;
+
+function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { "default": obj }; }
+
+function _taggedTemplateLiteral(strings, raw) { if (!raw) { raw = strings.slice(0); } return Object.freeze(Object.defineProperties(strings, { raw: { value: Object.freeze(raw) } })); }
+
+var DeleteWrapper = _styledComponents["default"].div(_templateObject || (_templateObject = _taggedTemplateLiteral(["\n    width: 300px;\n\n    .tu-icon-warning {\n        transition: all .3s ease-in;\n\n        &:hover {\n            color: #2879ff;\n        }\n    }\n"])));
+
+exports.DeleteWrapper = DeleteWrapper;
+
+var DeleteTitle = _styledComponents["default"].h2(_templateObject2 || (_templateObject2 = _taggedTemplateLiteral(["\n    font-size: 14px;\n    color: #1F2329;\n"])));
+
+exports.DeleteTitle = DeleteTitle;
+
+var Options = _styledComponents["default"].div(_templateObject3 || (_templateObject3 = _taggedTemplateLiteral(["\n    cursor: pointer;\n    display: flex;\n    align-items: center;\n\n    p {\n        margin: 6px;\n        font-size: 12px;\n        transition: all .3s ease-in;\n        color: #3e4e59;\n\n        &:hover {\n            color: #2879ff;\n        }\n    }\n"])));
+
+exports.Options = Options;
+
+var ButtonGroup = _styledComponents["default"].div(_templateObject4 || (_templateObject4 = _taggedTemplateLiteral(["\n    margin-top: 5px;\n    display: flex;\n    align-items: center;\n    justify-content: flex-end;\n\n    button {\n        min-width: 58px !important;\n        height: 30px !important;\n        margin-left: 10px;\n        white-space: nowrap;\n    }\n"])));
+
+exports.ButtonGroup = ButtonGroup;
+
+var Icon = _styledComponents["default"].span(_templateObject5 || (_templateObject5 = _taggedTemplateLiteral(["\n  font-size: 12px;\n  color: ", ";\n\n  &.tu-icon-diot {\n    color: #a4acb9;\n  }\n\n  // &.okr-type {\n  //   font-size: 16px;\n  //   color: #7f91b4;\n  //   position: relative;\n  //   top: ", ";\n  // }\n\n  // &.tu-icon-bianji2 {\n  //   margin-left: 6px;\n  //   font-size: 14px;\n  //   color: #2879ff;\n  //   cursor: pointer;\n  // }\n\n  // &.tu-icon-heart-solid {\n  //   margin-right: 6px;\n  //   color: #ff8c00;\n  // }\n\n  &.execute-icon {\n    font-size: 14px;\n    cursor: pointer;\n    position: relative;\n    top: 2px;\n  }\n\n  &.tu-icon-singlebox-have,\n  &.tu-icon-singlebox-avtive {\n    font-size: 14px;\n    color: #2879ff;\n  }\n\n  &.tu-icon-warning {\n    font-size: 14px;\n    color: #acb7bf;\n  }\n\n  &.tu-icon-more-diji {\n      position: relative;\n\n      &::after {\n          content: '';\n          \n      }\n  }\n"])), function (p) {
+  return p.color || "#89919F";
+}, function (p) {
+  return p.top;
+});
+
+exports.Icon = Icon;

package/lib/components/okr-detail/detail-header/index.css

@@ -25,14 +25,3 @@
 .okr-detail-head-parent > span:hover {
   color: #2879ff;
 }
-
-.okr-detail-header-status {
-  display: inline-flex;
-  align-items: center;
-  justify-content: center;
-  border-radius: 16px;
-  width: 68px;
-  height: 28px;
-  margin-right: 18px;
-  font-size: 12px;
-}