linkmore-design 1.0.33 → 1.0.36

package/lib/CustomTableOption/index.js

@@ -21,16 +21,25 @@ var _filterSort = _interopRequireDefault(require("./filterSort"));
 
 var _classnames = _interopRequireDefault(require("classnames"));
 
+var SmallImg = require('./assets/option1.png');
+
+var DefaultImg = require('./assets/option2.png');
+
+var MiddleImg = require('./assets/option3.png');
+
 var TabPane = _linkmoreDesign.Tabs.TabPane;
 var optionsWithDisabled = [{
   label: '紧凑型',
-  value: 'small'
+  value: 'small',
+  imgUrl: SmallImg
 }, {
   label: '默认',
-  value: 'default'
+  value: 'default',
+  imgUrl: DefaultImg
 }, {
   label: '中等',
-  value: 'middle'
+  value: 'middle',
+  imgUrl: MiddleImg
 }];
 var prefixCls = 'lm_custom-table-option';
 var LMCustomTableOption = /*#__PURE__*/(0, _react.forwardRef)(function (props, ref) {
@@ -42,15 +51,22 @@ var LMCustomTableOption = /*#__PURE__*/(0, _react.forwardRef)(function (props, r
       _useState2 = (0, _slicedToArray2.default)(_useState, 2),
       visible = _useState2[0],
       setVisible = _useState2[1];
+  /** 是否记住页面使用状态 */
+
 
-  var _useState3 = (0, _react.useState)({
+  var _useState3 = (0, _react.useState)(false),
+      _useState4 = (0, _slicedToArray2.default)(_useState3, 2),
+      saveSetting = _useState4[0],
+      setSaveSetting = _useState4[1];
+
+  var _useState5 = (0, _react.useState)({
     filter: [],
     columns: [],
     size: 'small'
   }),
-      _useState4 = (0, _slicedToArray2.default)(_useState3, 2),
-      lmOptions = _useState4[0],
-      setLmOptions = _useState4[1];
+      _useState6 = (0, _slicedToArray2.default)(_useState5, 2),
+      lmOptions = _useState6[0],
+      setLmOptions = _useState6[1];
 
   var openSetting = function openSetting() {
     setVisible(true);
@@ -60,9 +76,9 @@ var LMCustomTableOption = /*#__PURE__*/(0, _react.forwardRef)(function (props, r
     setLmOptions({
       filter: props.filter,
       columns: props.columns,
-      size: props.size
+      size: props.size || 'small'
     });
-  }, []);
+  }, [props.filter, props.columns, props.size]);
   /** 提交按钮 */
 
   var onOk = function onOk() {
@@ -82,8 +98,10 @@ var LMCustomTableOption = /*#__PURE__*/(0, _react.forwardRef)(function (props, r
       ColStateValue: ColStateValue,
       filterData: filterData,
       filterStateValue: filterStateValue,
-      size: lmOptions.size
+      size: lmOptions.size,
+      saveSetting: saveSetting
     });
+    setVisible(false);
   };
 
   return /*#__PURE__*/_react.default.createElement(_react.default.Fragment, null, /*#__PURE__*/_react.default.createElement(_linkmoreDesign.IconFont, {
@@ -110,31 +128,54 @@ var LMCustomTableOption = /*#__PURE__*/(0, _react.forwardRef)(function (props, r
       return setVisible(false);
     }
   }, /*#__PURE__*/_react.default.createElement(_linkmoreDesign.Tabs, {
-    defaultActiveKey: "1"
+    defaultActiveKey: "1",
+    destroyInactiveTabPane: true
   }, /*#__PURE__*/_react.default.createElement(TabPane, {
     tab: "\u4E2A\u6027\u5316\u7B5B\u9009",
-    key: "1"
+    key: "1",
+    forceRender: true
   }, /*#__PURE__*/_react.default.createElement(_filterSort.default, {
     ref: filterRef,
     filter: lmOptions.filter
   })), /*#__PURE__*/_react.default.createElement(TabPane, {
     tab: "\u5217\u5B57\u6BB5\u8BBE\u7F6E",
-    key: "2"
+    key: "2",
+    forceRender: true
   }, /*#__PURE__*/_react.default.createElement(_columnsSort.default, {
     ref: columnsRef,
     columns: lmOptions.columns
   })), /*#__PURE__*/_react.default.createElement(TabPane, {
     tab: "\u5176\u4ED6",
-    key: "3"
+    key: "3",
+    forceRender: true
   }, /*#__PURE__*/_react.default.createElement("div", null, "\u5217\u8868\u6837\u5F0F"), /*#__PURE__*/_react.default.createElement(_linkmoreDesign.Radio.Group, {
-    options: optionsWithDisabled,
     onChange: function onChange(e) {
       return setLmOptions(Object.assign(Object.assign({}, lmOptions), {
         size: e.target.value
       }));
     },
+    className: 'lm_size_radio_group',
     value: lmOptions.size
-  })))));
+  }, optionsWithDisabled.map(function (item) {
+    return /*#__PURE__*/_react.default.createElement("div", {
+      className: 'lm_custom_size_warp',
+      key: item.value
+    }, /*#__PURE__*/_react.default.createElement("img", {
+      onClick: function onClick() {
+        return setLmOptions(Object.assign(Object.assign({}, lmOptions), {
+          size: item.value
+        }));
+      },
+      src: item.imgUrl
+    }), /*#__PURE__*/_react.default.createElement(_linkmoreDesign.Radio, {
+      value: item.value
+    }, item.label));
+  })), /*#__PURE__*/_react.default.createElement("div", {
+    className: 'save_setting'
+  }, /*#__PURE__*/_react.default.createElement("span", null, "\u662F\u5426\u8BB0\u4F4F\u9875\u9762\u4F7F\u7528\u72B6\u6001"), /*#__PURE__*/_react.default.createElement(_linkmoreDesign.Switch, {
+    checked: saveSetting,
+    onChange: setSaveSetting
+  }))))));
 });
 var _default = LMCustomTableOption;
 exports.default = _default;

package/lib/CustomTableOption/style/index.css

@@ -503,6 +503,15 @@ html {
 .card_cell_content:hover .card_cell_body .card_cell_checkbox {
   opacity: 1;
 }
+.lm_custom-table-option.lm_drawer .ant-drawer-body {
+  padding: 0 0 24px 0;
+}
+.lm_custom-table-option.lm_drawer .ant-drawer-body .ant-tabs-nav-wrap {
+  padding: 0 24px;
+}
+.lm_custom-table-option.lm_drawer .ant-drawer-body .ant-tabs-content-holder {
+  padding: 0 24px;
+}
 .lm_custom_option_columns .global_setting {
   height: 44px;
   background-color: var(--color-4);
@@ -516,6 +525,10 @@ html {
 .lm_custom_option_columns .global_setting .lm-checkbox > span {
   font-size: 12px;
 }
+.lm_custom_option_columns .global_setting > span {
+  color: var(--primary-color);
+  cursor: pointer;
+}
 .lm_custom_option_columns .fixed_title {
   color: var(--color-45);
   font-size: 12px;
@@ -546,3 +559,35 @@ html {
 .lm_custom_option_columns .lm_custom_icon.hover_show {
   color: var(--primary-color);
 }
+.lm_custom_size_warp {
+  display: flex;
+  flex-direction: column;
+  align-items: center;
+  justify-content: center;
+  cursor: pointer;
+}
+.lm_custom_size_warp > img {
+  width: 100px;
+  height: 100px;
+  margin: 8px 0;
+}
+.lm_size_radio_group {
+  width: 100%;
+  display: flex;
+  flex-direction: row;
+  align-items: center;
+  justify-content: space-between;
+}
+.save_setting {
+  height: 68px;
+  margin-top: 24px;
+  border-top: 1px solid var(--color-6);
+  border-bottom: 1px solid var(--color-6);
+  display: flex;
+  align-items: center;
+  justify-content: space-between;
+  font-size: 12px;
+}
+.global_search {
+  margin-bottom: 16px;
+}

package/lib/Descriptions/index.d.ts

@@ -0,0 +1,9 @@
+import React from 'react';
+export interface IDescriptionsProps {
+    className?: string;
+    style?: React.CSSProperties;
+    children: React.ReactChildren;
+    containerType: 'default' | 'drawer' | 'modal';
+}
+declare const LMDescriptions: React.FC<IDescriptionsProps>;
+export default LMDescriptions;

package/lib/Descriptions/index.js

@@ -0,0 +1,53 @@
+"use strict";
+
+var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault").default;
+
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+exports.default = void 0;
+
+require("antd/es/descriptions/style");
+
+var _descriptions = _interopRequireDefault(require("antd/es/descriptions"));
+
+var _defineProperty2 = _interopRequireDefault(require("@babel/runtime/helpers/defineProperty"));
+
+var _react = _interopRequireDefault(require("react"));
+
+var _classnames = _interopRequireDefault(require("classnames"));
+
+var __rest = void 0 && (void 0).__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;
+};
+
+var prefixCls = 'lm_descriptions';
+
+var LMDescriptions = function LMDescriptions(props) {
+  var _cx;
+
+  var children = props.children,
+      className = props.className,
+      _props$containerType = props.containerType,
+      containerType = _props$containerType === void 0 ? 'default' : _props$containerType,
+      others = __rest(props, ["children", "className", "containerType"]);
+
+  var classNames = (0, _classnames.default)(className, prefixCls, (_cx = {}, (0, _defineProperty2.default)(_cx, "".concat(prefixCls, "_default"), containerType === 'default'), (0, _defineProperty2.default)(_cx, "".concat(prefixCls, "_drawer"), containerType === 'drawer'), (0, _defineProperty2.default)(_cx, "".concat(prefixCls, "_modal"), containerType === 'modal'), _cx));
+  return /*#__PURE__*/_react.default.createElement(_descriptions.default, Object.assign({
+    className: classNames
+  }, others, {
+    size: "default"
+  }), children);
+};
+
+var _default = LMDescriptions;
+exports.default = _default;