@titaui/pc 1.9.66 → 1.9.67

package/lib/components/part-notice/index.css

@@ -0,0 +1,40 @@
+.part-notice {
+  margin-left: 16px;
+  height: 36px;
+  background: #fcedd4;
+  display: flex;
+  align-items: center;
+  font-size: 12px;
+  font-weight: 400;
+  color: #3f4755;
+  line-height: 18px;
+  position: relative;
+  padding: 0 12px;
+  margin-bottom: 10px;
+  margin-top: 16px;
+  border-radius: 12px;
+}
+
+.part-notice > .tu-icon-tishi {
+  color: #f0a326;
+  margin-right: 8px;
+}
+
+.part-notice__link {
+  color: #f6bd16;
+  cursor: pointer;
+}
+
+.part-notice__close {
+  color: #f6bd16;
+  cursor: pointer;
+  font-size: 16px;
+  position: absolute;
+  right: 12px;
+}
+
+.part-notice__image {
+  width: 16px;
+  height: 16px;
+  margin-right: 8px;
+}

package/lib/components/part-notice/index.js

@@ -0,0 +1,90 @@
+"use strict";
+
+function _typeof(obj) { "@babel/helpers - typeof"; if (typeof Symbol === "function" && typeof Symbol.iterator === "symbol") { _typeof = function _typeof(obj) { return typeof obj; }; } else { _typeof = function _typeof(obj) { return obj && typeof Symbol === "function" && obj.constructor === Symbol && obj !== Symbol.prototype ? "symbol" : typeof obj; }; } return _typeof(obj); }
+
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+exports["default"] = void 0;
+
+var _react = _interopRequireWildcard(require("react"));
+
+var _localStorage = require("../../utils/local-storage");
+
+require("./index.css");
+
+function _getRequireWildcardCache(nodeInterop) { if (typeof WeakMap !== "function") return null; var cacheBabelInterop = new WeakMap(); var cacheNodeInterop = new WeakMap(); return (_getRequireWildcardCache = function _getRequireWildcardCache(nodeInterop) { return nodeInterop ? cacheNodeInterop : cacheBabelInterop; })(nodeInterop); }
+
+function _interopRequireWildcard(obj, nodeInterop) { if (!nodeInterop && obj && obj.__esModule) { return obj; } if (obj === null || _typeof(obj) !== "object" && typeof obj !== "function") { return { "default": obj }; } var cache = _getRequireWildcardCache(nodeInterop); if (cache && cache.has(obj)) { return cache.get(obj); } var newObj = {}; var hasPropertyDescriptor = Object.defineProperty && Object.getOwnPropertyDescriptor; for (var key in obj) { if (key !== "default" && Object.prototype.hasOwnProperty.call(obj, key)) { var desc = hasPropertyDescriptor ? Object.getOwnPropertyDescriptor(obj, key) : null; if (desc && (desc.get || desc.set)) { Object.defineProperty(newObj, key, desc); } else { newObj[key] = obj[key]; } } } newObj["default"] = obj; if (cache) { cache.set(obj, newObj); } return newObj; }
+
+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."); }
+
+function _unsupportedIterableToArray(o, minLen) { if (!o) return; if (typeof o === "string") return _arrayLikeToArray(o, minLen); var n = Object.prototype.toString.call(o).slice(8, -1); if (n === "Object" && o.constructor) n = o.constructor.name; if (n === "Map" || n === "Set") return Array.from(o); if (n === "Arguments" || /^(?:Ui|I)nt(?:8|16|32)(?:Clamped)?Array$/.test(n)) return _arrayLikeToArray(o, minLen); }
+
+function _arrayLikeToArray(arr, len) { if (len == null || len > arr.length) len = arr.length; for (var i = 0, arr2 = new Array(len); i < len; i++) { arr2[i] = arr[i]; } return arr2; }
+
+function _iterableToArrayLimit(arr, i) { var _i = arr == null ? null : typeof Symbol !== "undefined" && arr[Symbol.iterator] || arr["@@iterator"]; if (_i == null) return; var _arr = []; var _n = true; var _d = false; var _s, _e; try { for (_i = _i.call(arr); !(_n = (_s = _i.next()).done); _n = true) { _arr.push(_s.value); if (i && _arr.length === i) break; } } catch (err) { _d = true; _e = err; } finally { try { if (!_n && _i["return"] != null) _i["return"](); } finally { if (_d) throw _e; } } return _arr; }
+
+function _arrayWithHoles(arr) { if (Array.isArray(arr)) return arr; }
+
+var preCls = "part-notice";
+var storage = new _localStorage.LocalStorage();
+
+var PartNotice = function PartNotice(_ref) {
+  var storageName = _ref.storageName,
+      text = _ref.text,
+      link = _ref.link;
+
+  var _useState = (0, _react.useState)(function () {
+    var stopTaking = storage.getItem(storageName);
+
+    if (stopTaking !== null && stopTaking !== void 0 && stopTaking.date) {
+      var oldDate = new Date(stopTaking === null || stopTaking === void 0 ? void 0 : stopTaking.date).getDate();
+      var newDate = new Date().getDate();
+
+      if (newDate > oldDate) {
+        return true;
+      }
+
+      return false;
+    }
+
+    return true;
+  }),
+      _useState2 = _slicedToArray(_useState, 2),
+      visible = _useState2[0],
+      setVisible = _useState2[1];
+
+  var handleClose = (0, _react.useCallback)(function () {
+    setVisible(false);
+    storage.setItem(storageName, {
+      bol: false,
+      date: new Date()
+    });
+  }, []);
+
+  var handleOpenLink = function handleOpenLink() {
+    window.open(link, "_target");
+  };
+
+  if (!visible) return /*#__PURE__*/_react["default"].createElement("span", null);
+  return /*#__PURE__*/_react["default"].createElement("div", {
+    className: "".concat(preCls)
+  }, /*#__PURE__*/_react["default"].createElement("span", {
+    className: "tu-icon-tishi"
+  }), text, /*#__PURE__*/_react["default"].createElement("span", {
+    className: "".concat(preCls, "__link"),
+    onClick: handleOpenLink
+  }, "\u4E86\u89E3\u8BE6\u60C5"), /*#__PURE__*/_react["default"].createElement("span", {
+    className: "tu-icon-close  ".concat(preCls, "__close"),
+    onClick: handleClose
+  }));
+};
+
+PartNotice.defaultProps = {
+  storageName: "partNotice"
+};
+var _default = PartNotice;
+exports["default"] = _default;

package/lib/index.js

@@ -303,6 +303,12 @@ Object.defineProperty(exports, "Pagination", {
     return _pagination["default"];
   }
 });
+Object.defineProperty(exports, "PartNotice", {
+  enumerable: true,
+  get: function get() {
+    return _partNotice["default"];
+  }
+});
 Object.defineProperty(exports, "PasswordInput", {
   enumerable: true,
   get: function get() {
@@ -528,8 +534,6 @@ Object.defineProperty(exports, "upload", {
 
 require("./index.css");
 
-var _stopTakingModal = _interopRequireDefault(require("./components/stop-taking-modal"));
-
 var _dialog = _interopRequireDefault(require("./components/dialog"));
 
 var _switch = _interopRequireDefault(require("./components/switch"));
@@ -644,6 +648,8 @@ var _okrcaseLibraryCard = _interopRequireDefault(require("./components/okrcase-l
 
 var _operationRecords = _interopRequireDefault(require("./components/operation-records"));
 
+var _partNotice = _interopRequireDefault(require("./components/part-notice"));
+
 var _pagination = _interopRequireDefault(require("./components/pagination"));
 
 var _passwordInput = _interopRequireDefault(require("./components/password-input"));

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@titaui/pc",
-  "version": "1.9.66",
+  "version": "1.9.67",
   "nameCN": "",
   "description": "",
   "main": "src/index.js",

package/src/components/part-notice/index.scss

@@ -0,0 +1,37 @@
+.part-notice {
+  margin-left: 16px;
+  height: 36px;
+  background: #fcedd4;
+  display: flex;
+  align-items: center;
+  font-size: 12px;
+  font-weight: 400;
+  color: #3f4755;
+  line-height: 18px;
+  position: relative;
+  padding: 0 12px;
+  margin-bottom: 10px;
+  margin-top: 16px;
+  border-radius: 12px;
+
+  > .tu-icon-tishi {
+    color: #f0a326;
+    margin-right: 8px;
+  }
+  &__link {
+    color: #f6bd16;
+    cursor: pointer;
+  }
+  &__close {
+    color: #f6bd16;
+    cursor: pointer;
+    font-size: 16px;
+    position: absolute;
+    right: 12px;
+  }
+  &__image {
+    width: 16px;
+    height: 16px;
+    margin-right: 8px;
+  }
+}

package/src/components/part-notice/index.tsx

@@ -0,0 +1,50 @@
+import React, { FC, useState, useCallback } from "react";
+import { LocalStorage } from "../../utils/local-storage";
+import "./index.scss";
+
+interface Props {
+  text: any;
+  link: string;
+  storageName?: string;
+}
+
+const preCls = "part-notice";
+const storage = new LocalStorage();
+
+const PartNotice: FC<Props> = ({ storageName, text, link }) => {
+  const [visible, setVisible] = useState(() => {
+    const stopTaking: any = storage.getItem(storageName);
+    if (stopTaking?.date) {
+      const oldDate = new Date(stopTaking?.date).getDate();
+      const newDate = new Date().getDate();
+      if (newDate > oldDate) {
+        return true;
+      }
+      return false;
+    }
+    return true;
+  });
+
+  const handleClose = useCallback(() => {
+    setVisible(false);
+    storage.setItem(storageName, { bol: false, date: new Date() });
+  }, []);
+
+  const handleOpenLink = () => {
+    window.open(link, "_target");
+  };
+  if (!visible) return <span />;
+  return (
+    <div className={`${preCls}`}>
+      <span className="tu-icon-tishi" />
+      {text}
+      <span className={`${preCls}__link`} onClick={handleOpenLink}>了解详情</span>
+      <span className={`tu-icon-close  ${preCls}__close`} onClick={handleClose} />
+    </div>
+  );
+};
+PartNotice.defaultProps = {
+  storageName: "partNotice",
+};
+
+export default PartNotice;

package/src/index.js

@@ -1,5 +1,4 @@
 import "./index.scss";
-import { default as StopTakingModal } from "./components/stop-taking-modal";
 
 export { default as Dialog } from "./components/dialog";
 export { default as Switch } from "./components/switch";
@@ -58,6 +57,7 @@ export { default as OkrShare } from "./components/okr-share";
 export { default as OkrcaseLibrary } from "./components/okrcase-library";
 export { default as OkrcaseLibraryCard } from "./components/okrcase-library-card";
 export { default as OperationRecords } from "./components/operation-records";
+export { default as PartNotice } from "./components/part-notice";
 export { default as Pagination } from "./components/pagination";
 export { default as PasswordInput } from "./components/password-input";
 export { default as PhotoCard } from "./components/photo-card";