@pisell/private-materials 3.4.96 → 3.4.98

package/es/plus/saasDevice/deviceProfile/components/ProfileSetting/index.less

@@ -0,0 +1,94 @@
+.saas-device-profile-setting {
+  display: flex;
+  flex-direction: column;
+  height: 100%;
+  background: #f5f6f8;
+
+  &__btn-link {
+    padding: 0;
+  }
+
+  &__drawer-footer {
+    display: flex;
+    justify-content: flex-end;
+  }
+
+  &__header {
+    padding: 16px 24px;
+    background: #fff;
+    border-bottom: 1px solid #f0f0f0;
+  }
+
+  &__header-left {
+    display: flex;
+    align-items: center;
+    gap: 12px;
+  }
+
+  &__title {
+    font-size: 18px;
+    font-weight: 600;
+  }
+
+  &__subtitle {
+    color: #8c8c8c;
+    font-size: 12px;
+    margin-top: 4px;
+  }
+
+  &__alert-wrap {
+    padding: 12px 16px 0;
+  }
+
+  &__main {
+    flex: 1;
+    display: flex;
+    gap: 16px;
+    padding: 16px;
+    overflow: hidden;
+  }
+
+  &__menu-card {
+    width: 240px;
+    background: #fff;
+    border-radius: 12px;
+    padding: 12px;
+    box-shadow: 0 1px 2px rgba(16, 24, 40, 0.04);
+    overflow: auto;
+
+    .ant-menu {
+      border-inline-end: none;
+      background: transparent;
+    }
+  }
+
+  &__content-card {
+    flex: 1;
+    background: #fff;
+    border-radius: 12px;
+    overflow: auto;
+    box-shadow: 0 1px 2px rgba(16, 24, 40, 0.04);
+  }
+
+  &__loading-wrap {
+    display: flex;
+    align-items: center;
+    justify-content: center;
+    min-height: 240px;
+  }
+
+  &__section {
+    margin-bottom: 16px;
+  }
+
+  &__section-title {
+    font-size: 16px;
+    font-weight: 600;
+  }
+
+  &__save-actions {
+    display: flex;
+    justify-content: center;
+    margin-top: 24px;
+  }
+}

package/es/plus/saasDevice/deviceProfile/components/ProfileSetting/utils.d.ts

@@ -0,0 +1 @@
+export declare const toUpdatePayload: (basic: any) => any;

package/es/plus/saasDevice/deviceProfile/components/ProfileSetting/utils.js

@@ -0,0 +1,25 @@
+function _typeof(o) { "@babel/helpers - typeof"; return _typeof = "function" == typeof Symbol && "symbol" == typeof Symbol.iterator ? function (o) { return typeof o; } : function (o) { return o && "function" == typeof Symbol && o.constructor === Symbol && o !== Symbol.prototype ? "symbol" : typeof o; }, _typeof(o); }
+function ownKeys(e, r) { var t = Object.keys(e); if (Object.getOwnPropertySymbols) { var o = Object.getOwnPropertySymbols(e); r && (o = o.filter(function (r) { return Object.getOwnPropertyDescriptor(e, r).enumerable; })), t.push.apply(t, o); } return t; }
+function _objectSpread(e) { for (var r = 1; r < arguments.length; r++) { var t = null != arguments[r] ? arguments[r] : {}; r % 2 ? ownKeys(Object(t), !0).forEach(function (r) { _defineProperty(e, r, t[r]); }) : Object.getOwnPropertyDescriptors ? Object.defineProperties(e, Object.getOwnPropertyDescriptors(t)) : ownKeys(Object(t)).forEach(function (r) { Object.defineProperty(e, r, Object.getOwnPropertyDescriptor(t, r)); }); } return e; }
+function _defineProperty(obj, key, value) { key = _toPropertyKey(key); if (key in obj) { Object.defineProperty(obj, key, { value: value, enumerable: true, configurable: true, writable: true }); } else { obj[key] = value; } return obj; }
+function _toPropertyKey(t) { var i = _toPrimitive(t, "string"); return "symbol" == _typeof(i) ? i : String(i); }
+function _toPrimitive(t, r) { if ("object" != _typeof(t) || !t) return t; var e = t[Symbol.toPrimitive]; if (void 0 !== e) { var i = e.call(t, r || "default"); if ("object" != _typeof(i)) return i; throw new TypeError("@@toPrimitive must return a primitive value."); } return ("string" === r ? String : Number)(t); }
+var EMPTY_I18N = {
+  original: '',
+  'zh-CN': '',
+  'zh-HK': '',
+  en: '',
+  pt: '',
+  ja: ''
+};
+export var toUpdatePayload = function toUpdatePayload(basic) {
+  var _basic$icon, _basic$description, _basic$sort;
+  return {
+    icon: (_basic$icon = basic === null || basic === void 0 ? void 0 : basic.icon) !== null && _basic$icon !== void 0 ? _basic$icon : '',
+    name: basic === null || basic === void 0 ? void 0 : basic.name,
+    description: (_basic$description = basic === null || basic === void 0 ? void 0 : basic.description) !== null && _basic$description !== void 0 ? _basic$description : _objectSpread({}, EMPTY_I18N),
+    status: basic === null || basic === void 0 ? void 0 : basic.status,
+    sort: (_basic$sort = basic === null || basic === void 0 ? void 0 : basic.sort) !== null && _basic$sort !== void 0 ? _basic$sort : 0,
+    data: {}
+  };
+};

package/es/plus/saasDevice/deviceProfile/components/SiderMenuPanel/index.d.ts

@@ -0,0 +1,15 @@
+import React from "react";
+import type { MenuProps } from "antd";
+import './index.less';
+export interface SiderMenuPanelProps {
+    title?: React.ReactNode;
+    searchable?: boolean;
+    searchPlaceholder?: string;
+    onSearch?: (value: string) => void;
+    items: MenuProps["items"];
+    selectedKey: string;
+    onSelect: (key: string) => void;
+    emptyText?: React.ReactNode;
+}
+declare const SiderMenuPanel: React.FC<SiderMenuPanelProps>;
+export default SiderMenuPanel;

package/es/plus/saasDevice/deviceProfile/components/SiderMenuPanel/index.js

@@ -0,0 +1,56 @@
+import React, { useMemo } from "react";
+import { Empty, Input, PisellMenu } from "@pisell/materials";
+import { SearchOutlined } from "@ant-design/icons";
+import "./index.less";
+var hasAnyLeaf = function hasAnyLeaf(items) {
+  if (!items || !items.length) return false;
+  return items.some(function (it) {
+    if (!it) return false;
+    if (it.type === 'group') {
+      return hasAnyLeaf(it.children);
+    }
+    return true;
+  });
+};
+var SiderMenuPanel = function SiderMenuPanel(_ref) {
+  var title = _ref.title,
+    searchable = _ref.searchable,
+    searchPlaceholder = _ref.searchPlaceholder,
+    onSearch = _ref.onSearch,
+    items = _ref.items,
+    selectedKey = _ref.selectedKey,
+    _onSelect = _ref.onSelect,
+    emptyText = _ref.emptyText;
+  var isEmpty = useMemo(function () {
+    return !hasAnyLeaf(items);
+  }, [items]);
+  return /*#__PURE__*/React.createElement("div", {
+    className: "saas-device-profile-panel"
+  }, title && /*#__PURE__*/React.createElement("div", {
+    className: "saas-device-profile-title"
+  }, title), searchable && /*#__PURE__*/React.createElement(Input, {
+    allowClear: true,
+    prefix: /*#__PURE__*/React.createElement(SearchOutlined, {
+      className: "saas-device-profile-search-icon"
+    }),
+    placeholder: searchPlaceholder !== null && searchPlaceholder !== void 0 ? searchPlaceholder : "Search...",
+    onChange: function onChange(e) {
+      return onSearch === null || onSearch === void 0 ? void 0 : onSearch(e.target.value);
+    }
+  }), /*#__PURE__*/React.createElement("div", {
+    className: "saas-device-profile-menu-scroll"
+  }, isEmpty ? /*#__PURE__*/React.createElement(Empty, {
+    image: Empty.PRESENTED_IMAGE_SIMPLE,
+    description: emptyText !== null && emptyText !== void 0 ? emptyText : null
+  }) : /*#__PURE__*/React.createElement(PisellMenu, {
+    mode: "inline",
+    theme: "light",
+    dataSource: items,
+    selectedKeys: [selectedKey],
+    onSelect: function onSelect(_ref2) {
+      var key = _ref2.key;
+      return _onSelect(String(key));
+    }
+  })));
+};
+export default SiderMenuPanel;

package/es/plus/saasDevice/deviceProfile/components/SiderMenuPanel/index.less

@@ -0,0 +1,28 @@
+.saas-device-profile-panel {
+  height: 100%;
+  display: flex;
+  flex-direction: column;
+  gap: 12px;
+}
+
+.saas-device-profile-title {
+  font-size: 14px;
+  font-weight: 600;
+  color: #1f2937;
+  padding-left: 4px;
+}
+
+.saas-device-profile-menu-scroll {
+  flex: 1;
+  min-height: 0;
+  overflow-y: auto;
+
+  :global(.ant-menu) {
+    border-inline-end: none;
+    background: transparent;
+  }
+}
+
+.saas-device-profile-search-icon {
+  color: #9ca3af;
+}

package/es/plus/saasDevice/deviceProfile/components/TwoColumnPageLayout/index.d.ts

@@ -0,0 +1,11 @@
+import React from 'react';
+import './index.less';
+export interface TwoColumnPageLayoutProps {
+    title: React.ReactNode;
+    subTitle?: React.ReactNode;
+    sider: React.ReactNode;
+    children: React.ReactNode;
+    siderWidth?: number;
+}
+declare const TwoColumnPageLayout: React.FC<TwoColumnPageLayoutProps>;
+export default TwoColumnPageLayout;

package/es/plus/saasDevice/deviceProfile/components/TwoColumnPageLayout/index.js

@@ -0,0 +1,33 @@
+import React from 'react';
+import { PageHeader, PisellLayouts } from '@pisell/materials';
+import "./index.less";
+var Layout = PisellLayouts.Layout,
+  Sider = PisellLayouts.Sider,
+  Content = PisellLayouts.Content;
+var TwoColumnPageLayout = function TwoColumnPageLayout(_ref) {
+  var title = _ref.title,
+    subTitle = _ref.subTitle,
+    sider = _ref.sider,
+    children = _ref.children,
+    _ref$siderWidth = _ref.siderWidth,
+    siderWidth = _ref$siderWidth === void 0 ? 240 : _ref$siderWidth;
+  return /*#__PURE__*/React.createElement("div", {
+    className: "saas-device-profile-two-column-page-root"
+  }, /*#__PURE__*/React.createElement(PageHeader, {
+    title: title,
+    subTitle: subTitle,
+    showTitle: true,
+    showSubTitle: Boolean(subTitle),
+    showDivider: false
+  }), /*#__PURE__*/React.createElement(Layout, {
+    className: "saas-device-profile-two-column-page-root-layout",
+    hasSider: true
+  }, /*#__PURE__*/React.createElement(Sider, {
+    width: siderWidth,
+    theme: "light",
+    className: "saas-device-profile-two-column-page-root-sider"
+  }, sider), /*#__PURE__*/React.createElement(Content, {
+    className: "saas-device-profile-two-column-page-root-content"
+  }, children)));
+};
+export default TwoColumnPageLayout;

package/es/plus/saasDevice/deviceProfile/components/TwoColumnPageLayout/index.less

@@ -0,0 +1,40 @@
+.saas-device-profile-two-column-page-root {
+  height: 100%;
+  display: flex;
+  flex-direction: column;
+  padding: 24px;
+  background: #f5f6f8;
+  overflow: hidden;
+
+  &-layout {
+    flex: 1;
+    min-height: 0;
+    margin-top: 16px;
+    background: transparent;
+    gap: 16px;
+  }
+
+  &-sider {
+    background: #fff;
+    border-radius: 12px;
+    padding: 16px;
+    box-shadow: 0 1px 2px rgba(16, 24, 40, 0.04);
+    height: 100%;
+    overflow: hidden;
+
+    :global(.ant-layout-sider-children) {
+      display: flex;
+      flex-direction: column;
+      height: 100%;
+    }
+  }
+
+  &-content {
+    background: #fff;
+    border-radius: 12px;
+    padding: 16px;
+    box-shadow: 0 1px 2px rgba(16, 24, 40, 0.04);
+    height: 100%;
+    overflow: auto;
+  }
+}

package/es/plus/saasDevice/deviceProfile/components/UnsavedConfirmModal/index.d.ts

@@ -0,0 +1,2 @@
+import './index.less';
+export declare const unsavedChangesConfirm: (callback: () => void) => void;

package/es/plus/saasDevice/deviceProfile/components/UnsavedConfirmModal/index.js

@@ -0,0 +1,18 @@
+import { Modal } from 'antd';
+import { locales } from '@pisell/utils';
+import "./index.less";
+export var unsavedChangesConfirm = function unsavedChangesConfirm(callback) {
+  Modal.confirm({
+    title: locales.getText('pisell2.saas.unsaved-changes'),
+    content: locales.getText('pisell2.saas.unsaved-changes-content'),
+    okText: locales.getText('pisell2.saas.leave'),
+    cancelText: locales.getText('pisell2.saas.stay'),
+    okButtonProps: {
+      className: 'unsaved-changes-modal-ok-btn'
+    },
+    wrapClassName: 'unsaved-changes-modal',
+    onOk: function onOk() {
+      callback();
+    }
+  });
+};

package/es/plus/saasDevice/deviceProfile/components/UnsavedConfirmModal/index.less

@@ -0,0 +1,14 @@
+.unsaved-changes-modal {
+  .ant-modal-confirm-btns {
+    display: flex;
+    justify-content: center;
+    gap: 2%;
+    .ant-btn {
+      width: 48%;
+    }
+  }
+}
+.unsaved-changes-modal-ok-btn {
+  background-color: var(--theme-color);
+  color: #fff;
+}

package/es/plus/saasDevice/deviceProfile/hooks.d.ts

@@ -0,0 +1 @@
+export declare const useTranslation: () => any;

package/es/plus/saasDevice/deviceProfile/hooks.js

@@ -0,0 +1,8 @@
+import useEngineContext from "../../../hooks/useEngineContext";
+export var useTranslation = function useTranslation() {
+  var _context$appHelper;
+  var context = useEngineContext();
+  return (context === null || context === void 0 || (_context$appHelper = context.appHelper) === null || _context$appHelper === void 0 || (_context$appHelper = _context$appHelper.utils) === null || _context$appHelper === void 0 ? void 0 : _context$appHelper.translation) || function (val) {
+    return val === null || val === void 0 ? void 0 : val.original;
+  };
+};

package/es/plus/saasDevice/deviceProfile/index.d.ts

@@ -0,0 +1,5 @@
+import React from 'react';
+import type { SaasDeviceProfileProps } from './types';
+import './index.less';
+declare const SaasDeviceProfile: React.FC<SaasDeviceProfileProps>;
+export default SaasDeviceProfile;