@titaui/pc 1.15.43 → 1.15.44-beta.1

package/lib/pages/new-okr-list/header/index.js

@@ -5,7 +5,7 @@ function _typeof(obj) { "@babel/helpers - typeof"; return _typeof = "function" =
 Object.defineProperty(exports, "__esModule", {
   value: true
 });
-exports["default"] = void 0;
+exports["default"] = exports.ViewType = void 0;
 
 var _react = _interopRequireWildcard(require("react"));
 
@@ -37,6 +37,8 @@ var _requestApi = require("../request-api");
 
 var _getLocale = require("../../../utils/getLocale");
 
+var _popupSelect = _interopRequireDefault(require("../../../components/popup-select"));
+
 require("./index.css");
 
 function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { "default": obj }; }
@@ -57,6 +59,38 @@ function _iterableToArrayLimit(arr, i) { var _i = arr == null ? null : typeof Sy
 
 function _arrayWithHoles(arr) { if (Array.isArray(arr)) return arr; }
 
+var ViewType;
+exports.ViewType = ViewType;
+
+(function (ViewType) {
+  ViewType["Card"] = "card";
+  ViewType["Table"] = "table";
+  ViewType["Map"] = "map";
+})(ViewType || (exports.ViewType = ViewType = {}));
+
+var viewConfig = function viewConfig() {
+  return {
+    table: {
+      icon: 'tu-icon-pc-table-s',
+      title: (0, _getLocale.getLocale)('OKR_MyO_KRP_Table')
+    },
+    card: {
+      icon: 'tu-icon-pc-card-s',
+      title: (0, _getLocale.getLocale)('Pro_Butt_Card')
+    },
+    map: {
+      icon: 'tu-icon-yangshi-ditu',
+      title: (0, _getLocale.getLocale)('OKR_MyO_Text_Alignment')
+    }
+  };
+};
+
+var isSelfTenant = function isSelfTenant() {
+  return ['352728', '564003', '511477', // 正式环境
+  '500019', '500017', '500011', '500036' // 测试环境
+  ].includes(String((0, _bsGlobal.getBSGlobal)('tenantInfo').Id));
+};
+
 function Header(props, ref) {
   var _useContext = (0, _react.useContext)(_context.Context),
       departmentName = _useContext.departmentName,
@@ -69,22 +103,69 @@ function Header(props, ref) {
 
   var relationShip = parseInt(relation, 10);
   var onSearch = props.onSearch,
-      onFrontAddOKR = props.onFrontAddOKR;
+      onFrontAddOKR = props.onFrontAddOKR,
+      _props$viewType = props.viewType,
+      defaultViewType = _props$viewType === void 0 ? ViewType.Card : _props$viewType,
+      onChangeViewType = props.onChangeViewType;
 
   var _useState = (0, _react.useState)(false),
       _useState2 = _slicedToArray(_useState, 2),
       onlyThisDept = _useState2[0],
       setOnlyThisDept = _useState2[1];
 
-  var _useState3 = (0, _react.useState)(false),
+  var _useState3 = (0, _react.useState)(defaultViewType),
       _useState4 = _slicedToArray(_useState3, 2),
-      init = _useState4[0],
-      setInit = _useState4[1];
-
-  var _useState5 = (0, _react.useState)(),
-      _useState6 = _slicedToArray(_useState5, 2),
-      userInfo = _useState6[0],
-      setUserInfo = _useState6[1];
+      viewType = _useState4[0],
+      setViewType = _useState4[1];
+
+  var _useState5 = (0, _react.useState)(isSelfTenant() ? [{
+    label: /*#__PURE__*/_react["default"].createElement("p", {
+      className: "".concat(_precls.precls, "__view-tyoe-list-item")
+    }, /*#__PURE__*/_react["default"].createElement("span", {
+      className: "tu-icon-pc-card-s"
+    }), /*#__PURE__*/_react["default"].createElement("span", null, (0, _getLocale.getLocale)('Pro_Butt_Card'))),
+    value: 'card'
+  }, {
+    label: /*#__PURE__*/_react["default"].createElement("p", {
+      className: "".concat(_precls.precls, "__view-tyoe-list-item")
+    }, /*#__PURE__*/_react["default"].createElement("span", {
+      className: "tu-icon-pc-table-s"
+    }), /*#__PURE__*/_react["default"].createElement("span", null, (0, _getLocale.getLocale)('OKR_MyO_KRP_Table'))),
+    value: 'table'
+  }, {
+    label: /*#__PURE__*/_react["default"].createElement("p", {
+      className: "".concat(_precls.precls, "__view-tyoe-list-item")
+    }, /*#__PURE__*/_react["default"].createElement("span", {
+      className: "tu-icon-yangshi-ditu"
+    }), /*#__PURE__*/_react["default"].createElement("span", null, (0, _getLocale.getLocale)('OKR_MyO_Text_Alignment'))),
+    value: 'map'
+  }] : [{
+    label: /*#__PURE__*/_react["default"].createElement("p", {
+      className: "".concat(_precls.precls, "__view-tyoe-list-item")
+    }, /*#__PURE__*/_react["default"].createElement("span", {
+      className: "tu-icon-pc-card-s"
+    }), /*#__PURE__*/_react["default"].createElement("span", null, (0, _getLocale.getLocale)('Pro_Butt_Card'))),
+    value: 'card'
+  }, {
+    label: /*#__PURE__*/_react["default"].createElement("p", {
+      className: "".concat(_precls.precls, "__view-tyoe-list-item")
+    }, /*#__PURE__*/_react["default"].createElement("span", {
+      className: "tu-icon-yangshi-ditu"
+    }), /*#__PURE__*/_react["default"].createElement("span", null, (0, _getLocale.getLocale)('OKR_MyO_Text_Alignment'))),
+    value: 'map'
+  }]),
+      _useState6 = _slicedToArray(_useState5, 1),
+      viewTypeMenuData = _useState6[0];
+
+  var _useState7 = (0, _react.useState)(false),
+      _useState8 = _slicedToArray(_useState7, 2),
+      init = _useState8[0],
+      setInit = _useState8[1];
+
+  var _useState9 = (0, _react.useState)(),
+      _useState10 = _slicedToArray(_useState9, 2),
+      userInfo = _useState10[0],
+      setUserInfo = _useState10[1];
 
   (0, _react.useEffect)(function () {
     if (toUserId !== undefined || relationShip === 1) {
@@ -197,6 +278,16 @@ function Header(props, ref) {
     return null;
   };
 
+  var onChangeViewTypeHandler = (0, _react.useCallback)(function (type) {
+    if (type === ViewType.Map) {
+      gotoOkrMap();
+      return;
+    }
+
+    setViewType(type);
+    if (onChangeViewType) onChangeViewType(type);
+  }, [onChangeViewType]);
+  var viewInfo = viewConfig()[viewType];
   return /*#__PURE__*/_react["default"].createElement("div", {
     className: "".concat(_precls.precls, "__header")
   }, /*#__PURE__*/_react["default"].createElement("div", {
@@ -218,16 +309,22 @@ function Header(props, ref) {
     ref: createOkrRef,
     onFrontAddOKR: onFrontAddOKR
   })), /*#__PURE__*/_react["default"].createElement("div", {
-    className: "".concat(_precls.precls, "__header-item"),
-    onClick: gotoOkrMap
+    className: "".concat(_precls.precls, "__header-item")
+  }, /*#__PURE__*/_react["default"].createElement(_popupSelect["default"], {
+    menuData: viewTypeMenuData,
+    popupPlacement: "bottom",
+    action: "click",
+    onChange: onChangeViewTypeHandler
   }, /*#__PURE__*/_react["default"].createElement(_tooltip["default"], {
-    overlay: (0, _getLocale.getLocale)('OKR_MyO_Text_Alignment'),
+    overlay: viewInfo.title,
     placement: "top"
   }, /*#__PURE__*/_react["default"].createElement("span", {
-    className: "".concat(_precls.precls, "__header-icon")
+    className: "".concat(_precls.precls, "__header-icon--view-type")
   }, /*#__PURE__*/_react["default"].createElement("span", {
-    className: "tu-icon-yangshi-ditu"
-  }))))), /*#__PURE__*/_react["default"].createElement(_comments["default"], {
+    className: viewInfo.icon
+  }), /*#__PURE__*/_react["default"].createElement("span", {
+    className: "tu-icon-caret-down ".concat(_precls.precls, "__header-down-icon")
+  })))))), /*#__PURE__*/_react["default"].createElement(_comments["default"], {
     toUserId: toUserId,
     relation: relationShip,
     userInfo: userInfo

package/lib/pages/new-okr-list/index.js

@@ -19,9 +19,11 @@ var _pagination = _interopRequireDefault(require("../../components/pagination"))
 
 var _dialog = _interopRequireDefault(require("../../components/dialog"));
 
+var _okrExcel = _interopRequireDefault(require("../../components/okr-excel"));
+
 var _errorBoundary = _interopRequireDefault(require("../../components/error-boundary"));
 
-var _header = _interopRequireDefault(require("./header"));
+var _header = _interopRequireWildcard(require("./header"));
 
 var _list = _interopRequireDefault(require("./list"));
 
@@ -61,12 +63,6 @@ function _iterableToArray(iter) { if (typeof Symbol !== "undefined" && iter[Symb
 
 function _arrayWithoutHoles(arr) { if (Array.isArray(arr)) return _arrayLikeToArray(arr); }
 
-function ownKeys(object, enumerableOnly) { var keys = Object.keys(object); if (Object.getOwnPropertySymbols) { var symbols = Object.getOwnPropertySymbols(object); 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 = null != arguments[i] ? arguments[i] : {}; i % 2 ? ownKeys(Object(source), !0).forEach(function (key) { _defineProperty(target, key, source[key]); }) : Object.getOwnPropertyDescriptors ? Object.defineProperties(target, Object.getOwnPropertyDescriptors(source)) : ownKeys(Object(source)).forEach(function (key) { Object.defineProperty(target, key, Object.getOwnPropertyDescriptor(source, key)); }); } return target; }
-
-function _defineProperty(obj, key, value) { if (key in obj) { Object.defineProperty(obj, key, { value: value, enumerable: true, configurable: true, writable: true }); } else { obj[key] = value; } return obj; }
-
 function _slicedToArray(arr, i) { return _arrayWithHoles(arr) || _iterableToArrayLimit(arr, i) || _unsupportedIterableToArray(arr, i) || _nonIterableRest(); }
 
 function _nonIterableRest() { throw new TypeError("Invalid attempt to destructure non-iterable instance.\nIn order to be iterable, non-array objects must have a [Symbol.iterator]() method."); }
@@ -79,6 +75,32 @@ function _iterableToArrayLimit(arr, i) { var _i = arr == null ? null : typeof Sy
 
 function _arrayWithHoles(arr) { if (Array.isArray(arr)) return arr; }
 
+function ownKeys(object, enumerableOnly) { var keys = Object.keys(object); if (Object.getOwnPropertySymbols) { var symbols = Object.getOwnPropertySymbols(object); 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 = null != arguments[i] ? arguments[i] : {}; i % 2 ? ownKeys(Object(source), !0).forEach(function (key) { _defineProperty(target, key, source[key]); }) : Object.getOwnPropertyDescriptors ? Object.defineProperties(target, Object.getOwnPropertyDescriptors(source)) : ownKeys(Object(source)).forEach(function (key) { Object.defineProperty(target, key, Object.getOwnPropertyDescriptor(source, key)); }); } return target; }
+
+function _defineProperty(obj, key, value) { if (key in obj) { Object.defineProperty(obj, key, { value: value, enumerable: true, configurable: true, writable: true }); } else { obj[key] = value; } return obj; }
+
+var cacheViewType = localStorage.getItem('cacheViewType');
+
+function getOkrExcelData(okrData) {
+  var okrExcelData = [];
+  okrData.forEach(function (okrInfo) {
+    okrInfo.Krs.forEach(function (kr, i) {
+      var data = _objectSpread(_objectSpread({}, i === 0 ? okrInfo : {}), {}, {
+        feedId: okrInfo.feedId,
+        Kr: _objectSpread(_objectSpread({}, kr), {}, {
+          index: i
+        })
+      });
+
+      if (i === 0) data.rowSpan = okrInfo.Krs.length;
+      okrExcelData.push(data);
+    });
+  });
+  return okrExcelData;
+}
+
 var NewOkrList = function NewOkrList(props) {
   var OkrListCmp = props.OkrListCmp,
       OkrCommunicationPush = props.OkrCommunicationPush,
@@ -89,7 +111,10 @@ var NewOkrList = function NewOkrList(props) {
   var formFieldValues = useLocalStorage.getItem("okr-filter-values") || {
     targetType: "",
     targetCategory: "",
-    targetSort: ""
+    targetSort: "",
+    okrType: "",
+    okrClassify: "",
+    orderType: 0
   };
 
   var filterCycle = function () {
@@ -161,12 +186,17 @@ var NewOkrList = function NewOkrList(props) {
       isInit = _useState14[0],
       setIsInit = _useState14[1];
 
+  var _useState15 = (0, _react.useState)(cacheViewType || _header.ViewType.Card),
+      _useState16 = _slicedToArray(_useState15, 2),
+      viewType = _useState16[0],
+      setViewType = _useState16[1];
+
   var headerRef = (0, _react.useRef)();
 
-  var _useState15 = (0, _react.useState)(false),
-      _useState16 = _slicedToArray(_useState15, 2),
-      casesVisible = _useState16[0],
-      setCasesVisible = _useState16[1];
+  var _useState17 = (0, _react.useState)(false),
+      _useState18 = _slicedToArray(_useState17, 2),
+      casesVisible = _useState18[0],
+      setCasesVisible = _useState18[1];
 
   var routerData = (0, _tools.getQueryString)();
   var departmentName = routerData.departmentName,
@@ -233,8 +263,8 @@ var NewOkrList = function NewOkrList(props) {
     setLoading(true);
     recordVisitUser();
     (0, _requestApi.okrSearch)(params).then(function (res) {
-      setOkrs(res.works || []);
-      setTotal(res.total);
+      setOkrs(res && res.works || []);
+      setTotal(res && res.total || 0);
       setLoading(false);
     });
   };
@@ -312,6 +342,13 @@ var NewOkrList = function NewOkrList(props) {
   (0, _react.useEffect)(function () {
     getOkrs();
   }, [pageNum, pageSize, query]);
+  var onChangeViewTypeHandler = (0, _react.useCallback)(function (type) {
+    localStorage.setItem('cacheViewType', type);
+    setViewType(type);
+  }, []);
+  var okrExcelData = (0, _react.useMemo)(function () {
+    return getOkrExcelData(okrs);
+  }, [okrs]);
   return /*#__PURE__*/_react["default"].createElement(_context.Context.Provider, {
     value: _objectSpread({
       OkrCommunicationPush: OkrCommunicationPush,
@@ -326,10 +363,12 @@ var NewOkrList = function NewOkrList(props) {
   }, /*#__PURE__*/_react["default"].createElement(_header["default"], {
     onSearch: handleOnSearch,
     ref: headerRef,
-    onFrontAddOKR: onFrontAddOKR
+    onFrontAddOKR: onFrontAddOKR,
+    onChangeViewType: onChangeViewTypeHandler,
+    viewType: viewType
   }), /*#__PURE__*/_react["default"].createElement(_loading["default"], {
     loading: loading
-  }, okrs.length > 0 && /*#__PURE__*/_react["default"].createElement(_react["default"].Fragment, null, /*#__PURE__*/_react["default"].createElement(_list["default"], {
+  }, okrs.length > 0 && viewType === _header.ViewType.Card && /*#__PURE__*/_react["default"].createElement(_react["default"].Fragment, null, /*#__PURE__*/_react["default"].createElement(_list["default"], {
     OkrListCmp: OkrListCmp,
     okrs: okrs,
     setOkrs: setOkrs,
@@ -349,6 +388,18 @@ var NewOkrList = function NewOkrList(props) {
     pageSize: pageSize,
     current: pageNum,
     size: "sm"
+  }))), okrs.length > 0 && viewType === _header.ViewType.Table && /*#__PURE__*/_react["default"].createElement(_react["default"].Fragment, null, /*#__PURE__*/_react["default"].createElement(_okrExcel["default"], {
+    showCycle: query.cycleType === '-1',
+    data: okrExcelData,
+    onRefresh: getOkrs
+  }), /*#__PURE__*/_react["default"].createElement("div", {
+    className: "".concat(_precls.precls, "__pagination")
+  }, /*#__PURE__*/_react["default"].createElement(_pagination["default"], {
+    total: total,
+    onChange: handlePageChange,
+    pageSize: pageSize,
+    current: pageNum,
+    size: "sm"
   }))), okrs.length === 0 && /*#__PURE__*/_react["default"].createElement(Empty, {
     openCreate: function openCreate() {
       return openCreateModal();

package/lib/pages/new-okr-list/list/index.js

@@ -41,11 +41,15 @@ function List(props) {
   var _useContext = (0, _react.useContext)(_context.Context),
       annualNum = _useContext.annualNum,
       cycleType = _useContext.cycleType,
-      yqmNum = _useContext.yqmNum;
+      yqmNum = _useContext.yqmNum,
+      orderType = _useContext.orderType,
+      relation = _useContext.relation;
 
   return /*#__PURE__*/_react["default"].createElement("div", null, /*#__PURE__*/_react["default"].createElement(OkrListCmp, {
+    orderType: orderType,
     okrData: okrs,
     setData: setOkrs,
+    relation: relation,
     cycle: {
       annualNum: annualNum,
       cycleType: cycleType,

package/lib/utils/hooks.js

@@ -5,10 +5,16 @@ Object.defineProperty(exports, "__esModule", {
 });
 exports["default"] = useQuery;
 exports.parseUrl = parseUrl;
+exports.useDebounce = useDebounce;
+exports.useDebounceFn = useDebounceFn;
 exports.useDebouncedEffect = useDebouncedEffect;
 
 var _react = require("react");
 
+var _debounce = _interopRequireDefault(require("lodash/debounce"));
+
+function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { "default": obj }; }
+
 function _slicedToArray(arr, i) { return _arrayWithHoles(arr) || _iterableToArrayLimit(arr, i) || _unsupportedIterableToArray(arr, i) || _nonIterableRest(); }
 
 function _nonIterableRest() { throw new TypeError("Invalid attempt to destructure non-iterable instance.\nIn order to be iterable, non-array objects must have a [Symbol.iterator]() method."); }
@@ -72,6 +78,58 @@ function useQuery(name) {
   return state;
 }
 
+function useLatest(value) {
+  var ref = (0, _react.useRef)(value);
+  ref.current = value;
+  return ref;
+}
+
+var useUnmount = function useUnmount(fn) {
+  var fnRef = useLatest(fn);
+  (0, _react.useEffect)(function () {
+    return function () {
+      fnRef.current();
+    };
+  }, []);
+};
+
+function useDebounceFn(fn, options) {
+  var _options$wait;
+
+  var fnRef = useLatest(fn);
+  var wait = (_options$wait = options === null || options === void 0 ? void 0 : options.wait) !== null && _options$wait !== void 0 ? _options$wait : 1000;
+  var debounced = (0, _react.useMemo)(function () {
+    return (0, _debounce["default"])(function () {
+      return fnRef.current.apply(fnRef, arguments);
+    }, wait, options);
+  }, []);
+  useUnmount(function () {
+    debounced.cancel();
+  });
+  return {
+    run: debounced,
+    cancel: debounced.cancel,
+    flush: debounced.flush
+  };
+}
+
+function useDebounce(value, options) {
+  var _useState3 = (0, _react.useState)(value),
+      _useState4 = _slicedToArray(_useState3, 2),
+      debounced = _useState4[0],
+      setDebounced = _useState4[1];
+
+  var _useDebounceFn = useDebounceFn(function () {
+    setDebounced(value);
+  }, options),
+      run = _useDebounceFn.run;
+
+  (0, _react.useEffect)(function () {
+    run();
+  }, [value]);
+  return debounced;
+}
+
 function useDebouncedEffect(fn, ms, deps) {
   (0, _react.useEffect)(function () {
     var clean = null;

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@titaui/pc",
-  "version": "1.15.43",
+  "version": "1.15.44-beta.1",
   "nameCN": "",
   "description": "",
   "main": "lib/index.js",
@@ -75,6 +75,7 @@
   },
   "dependencies": {
     "@antv/g2plot": "2.4.8",
+    "@handsontable/react": "^12.1.2",
     "@juggle/resize-observer": "3.3.1",
     "@titaui/dagre": "0.8.8-pre",
     "@titaui/rc-tree2": "4.1.23",
@@ -86,6 +87,9 @@
     "@types/color": "3.0.3",
     "@types/prosemirror-commands": "1.0.4",
     "@types/prosemirror-schema-basic": "1.0.2",
+    "ag-grid-community": "^28.0.2",
+    "ag-grid-enterprise": "^28.0.2",
+    "ag-grid-react": "^28.0.0",
     "axios": "0.21.1",
     "bowser": "2.11.0",
     "can-use-dom": "0.1.0",
@@ -95,6 +99,7 @@
     "cos-js-sdk-v5": "1.3.3",
     "dayjs": "1.10.4",
     "easy-bem": "^1.1.1",
+    "handsontable": "^12.1.2",
     "html2canvas": "1.3.2",
     "less": "4.1.2",
     "less-loader": "6.0.0",