linkmore-design 1.0.3

package/es/ButtonTags/ButtonTags.js

@@ -0,0 +1,59 @@
+"use strict";
+
+var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault");
+
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+exports.default = void 0;
+
+var _toConsumableArray2 = _interopRequireDefault(require("@babel/runtime/helpers/esm/toConsumableArray"));
+
+var _react = _interopRequireDefault(require("react"));
+
+/*
+  options: 展示的标签项
+  type: 'radio' / 'checkbox'
+  value: 选中的值
+  onChang: 选中时触发事件
+*/
+var ButtonTags = function ButtonTags(props) {
+  var value = props.value,
+      onChange = props.onChange,
+      disabled = props.disabled,
+      _props$type = props.type,
+      type = _props$type === void 0 ? 'checkbox' : _props$type,
+      options = props.options,
+      size = props.size;
+
+  var handleClick = function handleClick(item) {
+    if (type === 'radio') {
+      var nValue = value === item.value ? '' : item.value;
+      onChange === null || onChange === void 0 ? void 0 : onChange(nValue);
+    } else {
+      var oriValue = value || [];
+      var has = oriValue === null || oriValue === void 0 ? void 0 : oriValue.includes(item.value);
+
+      var _nValue = has ? oriValue.filter(function (v) {
+        return v !== item.value;
+      }) : [].concat((0, _toConsumableArray2.default)(oriValue), [item.value]);
+
+      onChange === null || onChange === void 0 ? void 0 : onChange(_nValue);
+    }
+  };
+
+  return /*#__PURE__*/_react.default.createElement("div", {
+    className: "lm_base_button_tag_Group ".concat(size === 'small' ? 'small' : '', "  ").concat(disabled ? 'disabled' : '')
+  }, options === null || options === void 0 ? void 0 : options.map(function (item) {
+    return /*#__PURE__*/_react.default.createElement("div", {
+      key: item.value,
+      className: "button_tag_item ".concat((value === null || value === void 0 ? void 0 : value.indexOf(item.value)) > -1 ? 'active' : ''),
+      onClick: function onClick() {
+        return handleClick(item);
+      }
+    }, item.label);
+  }));
+};
+
+var _default = ButtonTags;
+exports.default = _default;

package/es/ButtonTags/index.js

@@ -0,0 +1,13 @@
+"use strict";
+
+var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault");
+
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+exports.default = void 0;
+
+var _ButtonTags = _interopRequireDefault(require("./ButtonTags"));
+
+var _default = _ButtonTags.default;
+exports.default = _default;

package/es/ButtonTags/style/index.js

@@ -0,0 +1,3 @@
+"use strict";
+
+require("./style.css");

package/es/ButtonTags/style/style.css

@@ -0,0 +1,221 @@
+.ant-layout-sider {
+  min-height: 100vh;
+  background-color: #022766;
+}
+.ant-menu-dark .ant-menu-inline.ant-menu-sub {
+  box-shadow: none;
+}
+.ant-menu-submenu-placement-rightTop {
+  display: none;
+}
+.ant-table .row-active .ant-table-cell {
+  background-color: #FEFFD3 !important;
+}
+.ant-dropdown-menu-item {
+  font-size: 12px;
+  height: 32px;
+}
+.ant-tabs .ant-tabs-nav .ant-tabs-tab {
+  font-size: 14px;
+}
+.ant-tabs.auto_tabs {
+  display: flex;
+  flex-flow: column;
+  height: 100%;
+}
+.ant-tabs.auto_tabs .ant-tabs-nav {
+  height: 48px;
+}
+.ant-tabs.auto_tabs .ant-tabs-content-holder {
+  flex: 1;
+  overflow: auto;
+}
+.ant-drawer.drawer_wrapper .ant-drawer-header {
+  padding: 0 24px;
+}
+.ant-drawer.drawer_wrapper .ant-drawer-body {
+  position: relative;
+  flex: 1;
+  padding: 0 24px;
+}
+.ant-modal-wrap.plugin_modal {
+  display: flex;
+  flex-flow: column;
+  justify-content: flex-end;
+}
+.ant-modal-wrap.plugin_modal .ant-modal {
+  left: 56px;
+  top: 0;
+  margin: 0 0 8px 8px;
+  padding: 0;
+}
+.ant-modal-wrap.lm_modal_confirm .anticon {
+  margin-top: -1px;
+  margin-right: 8px;
+}
+.ant-modal-wrap.lm_modal_confirm .ant-modal-body {
+  padding: 16px 24px;
+}
+.ant-popover.pop_img .ant-popover-inner-content {
+  line-height: 1;
+  padding: var(--gap);
+}
+@font-face {
+  font-family: 'iconfont';
+  /* Project id 2966019 */
+  src: url('//at.alicdn.com/t/font_2966019_i3eb1wwkoo.woff2?t=1641546077924') format('woff2'), url('//at.alicdn.com/t/font_2966019_i3eb1wwkoo.woff?t=1641546077924') format('woff'), url('//at.alicdn.com/t/font_2966019_i3eb1wwkoo.ttf?t=1641546077924') format('truetype');
+}
+.icon_ {
+  font-family: 'iconfont';
+  font-size: 14px;
+}
+.iconfont {
+  font-size: 12px;
+}
+.icon_home::before {
+  content: '\e7fc';
+}
+:root {
+  --them-color: #1890fc;
+  --main-color: #1890fc;
+  --primary-color: #1890fc;
+  --primary2-color: rgba(24, 144, 252, 0.08);
+  --success-color: #56C22D;
+  --warning-color: #FD9727;
+  --error-color: #FA4F53;
+  --aside-bg-color: #022766;
+  --font-color: rgba(0, 0, 0, 0.85);
+  --font2-color: rgba(0, 0, 0, 0.65);
+  --text-color: rgba(0, 0, 0, 0.45);
+  --box-shadow-color: rgba(0, 0, 0, 0.15);
+  --background-color: rgba(0, 0, 0, 0.04);
+  --background-color-hover: rgba(0, 0, 0, 0.08);
+  --border-color: #f0f0f0;
+  --stripe-color: #f5f5f5;
+  --border-hover-color: #f2f5f7;
+  --gap: 8px;
+  --basic-height: 24px;
+}
+.ant-input,
+.ant-select {
+  font-size: 12px;
+}
+.ant-select-dropdown .ant-select-item {
+  font-size: 12px;
+  align-items: center;
+}
+.react-resizable {
+  position: relative;
+  background-clip: padding-box;
+}
+.react-resizable-handle {
+  position: absolute;
+  right: 0;
+  top: 0;
+  z-index: 1;
+  width: 3px;
+  height: 40px;
+  cursor: col-resize;
+}
+.react-resizable-handle:hover {
+  background-color: var(--primary-color);
+}
+.react-resizable-handle:active {
+  background-color: var(--primary-color);
+}
+.yf_resizable_bar {
+  position: absolute;
+  left: 0;
+  top: 0;
+  z-index: 2;
+  height: 0;
+}
+.resizable_line {
+  position: absolute;
+  left: 0;
+  top: 0;
+  height: 100%;
+  width: 1px;
+  background-color: var(--primary-color);
+  z-index: 1;
+}
+.handle_resizable {
+  position: absolute;
+  right: 0;
+  top: 0;
+  height: 100%;
+  width: 5px;
+  z-index: 2;
+}
+.lm_base_button_tag_Group {
+  position: relative;
+  display: flex;
+  flex-wrap: wrap;
+  gap: 24px;
+}
+.lm_base_button_tag_Group.disabled::before {
+  content: '';
+  position: absolute;
+  left: 0;
+  top: 0;
+  right: 0;
+  bottom: 0;
+  z-index: 2;
+  cursor: not-allowed;
+}
+.lm_base_button_tag_Group.disabled .button_tag_item {
+  color: rgba(0, 0, 0, 0.25);
+  background: #f5f5f5;
+}
+.lm_base_button_tag_Group .button_tag_item {
+  position: relative;
+  display: inline-flex;
+  align-items: center;
+  justify-content: center;
+  min-width: 136px;
+  height: 32px;
+  border: 1px solid #d8d8d8;
+  padding: 0 12px;
+  cursor: pointer;
+  transition: 0.3s;
+}
+.lm_base_button_tag_Group .button_tag_item::before {
+  content: '';
+  position: absolute;
+  right: -1px;
+  bottom: 0;
+  border-width: 16px 16px 0 0;
+  border-color: transparent var(--primary-color) var(--primary-color) transparent;
+  color: #fff;
+}
+.lm_base_button_tag_Group .button_tag_item::after {
+  content: '';
+  position: absolute;
+  right: 0;
+  bottom: 0;
+  height: 8px;
+  width: 4px;
+  border-width: 1px;
+  border-color: #fff;
+  border-left: 0;
+  border-top: 0;
+  transform: translate(-2px, -2px) rotate(45deg);
+}
+.lm_base_button_tag_Group .button_tag_item:hover {
+  border-color: var(--primary-color);
+}
+.lm_base_button_tag_Group .button_tag_item.active {
+  color: var(--primary-color);
+  border-color: var(--primary-color);
+}
+.lm_base_button_tag_Group .button_tag_item.active::before,
+.lm_base_button_tag_Group .button_tag_item.active::after {
+  border-style: solid;
+}
+.lm_base_button_tag_Group.small {
+  gap: 8px;
+}
+.lm_base_button_tag_Group.small .button_tag_item {
+  height: 24px;
+  min-width: 76px;
+}

package/es/CkFilter/baseFilter/filterMenu.js

@@ -0,0 +1,177 @@
+"use strict";
+
+var _interopRequireWildcard = require("@babel/runtime/helpers/interopRequireWildcard");
+
+var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault");
+
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+exports.default = void 0;
+
+require("antd/es/dropdown/style");
+
+var _dropdown = _interopRequireDefault(require("antd/es/dropdown"));
+
+var _extends2 = _interopRequireDefault(require("@babel/runtime/helpers/esm/extends"));
+
+var _objectSpread2 = _interopRequireDefault(require("@babel/runtime/helpers/esm/objectSpread2"));
+
+var _slicedToArray2 = _interopRequireDefault(require("@babel/runtime/helpers/esm/slicedToArray"));
+
+var _classnames = _interopRequireDefault(require("classnames"));
+
+var _react = _interopRequireWildcard(require("react"));
+
+var _IconFont = _interopRequireDefault(require("../../IconFont"));
+
+var _filterTypes = _interopRequireDefault(require("../components/filterTypes"));
+
+var _context = require("../context");
+
+var _utils = require("../utils");
+
+// 过滤菜单
+var FilterMenu = function FilterMenu(props) {
+  var field = props.field,
+      title = props.title,
+      _props$type = props.type,
+      type = _props$type === void 0 ? 'checkbox' : _props$type,
+      data = props.data,
+      comProps = props.props;
+
+  var _useStore = (0, _context.useStore)(),
+      state = _useStore.state,
+      dispatch = _useStore.dispatch;
+
+  var _useState = (0, _react.useState)(false),
+      _useState2 = (0, _slicedToArray2.default)(_useState, 2),
+      visible = _useState2[0],
+      setVisible = _useState2[1]; // 当前过滤的值
+
+
+  var filterValue = (0, _react.useMemo)(function () {
+    return state.filterValues[field];
+  }, [state.filterValues]); // 判断是否正在过滤
+
+  var isFiltering = (0, _react.useMemo)(function () {
+    return (0, _utils.getIsHas)(filterValue);
+  }, [filterValue]); // 设置过滤的内容 filterType: 'single' 存在时 单个勾选时触发, 默认按钮触发
+
+  var setFilterValue = (0, _react.useCallback)(function (val, filterType) {
+    var _state$instance$onCha, _state$instance;
+
+    var nValue = (0, _objectSpread2.default)({}, state.filterValues);
+    (0, _utils.getIsHas)(val) ? nValue[field] = val : delete nValue[field];
+    dispatch({
+      type: 'changeFilterValues',
+      filterValues: nValue
+    }); // 触发外部查询, 单击时不关闭菜单
+
+    (_state$instance$onCha = (_state$instance = state.instance).onChange) === null || _state$instance$onCha === void 0 ? void 0 : _state$instance$onCha.call(_state$instance, nValue, state.customFilterValues);
+    !filterType && setVisible(false);
+  }, [dispatch, field, state.filterValues, state.instance]); // 展示的内容
+
+  var checkedValue = (0, _react.useMemo)(function () {
+    if (type === 'date') {
+      var obj = {
+        props: comProps,
+        getFilterValue: filterValue,
+        setFilterValue: setFilterValue
+      };
+      return /*#__PURE__*/_react.default.createElement(_filterTypes.default, (0, _extends2.default)({
+        type: "datePicker"
+      }, obj));
+    }
+
+    if (!isFiltering) return '全部'; // select & checkbox
+
+    if (['select', 'checkbox'].includes(type)) {
+      var findItem = data.find(function (v) {
+        return Array.isArray(filterValue) ? filterValue.includes(v.value) : filterValue === v.value;
+      });
+
+      if (!findItem) {
+        setFilterValue(type === 'checkbox' ? [] : '');
+        return '全部';
+      }
+
+      var filterLabel = findItem.label;
+
+      if (Array.isArray(filterValue)) {
+        if (filterValue.length > 1) {
+          return "".concat(filterLabel, "\u3001+").concat(filterValue.length - 1, "...");
+        }
+
+        return filterLabel;
+      }
+
+      return filterLabel;
+    }
+
+    return filterValue;
+  }, [comProps, data, isFiltering, setFilterValue, type, filterValue]); // 下拉组件渲染
+
+  var FilterControl = (0, _react.useCallback)(function () {
+    var obj = {
+      filters: data,
+      getFilterValue: filterValue,
+      setFilterValue: setFilterValue
+    };
+    return (0, _utils.render)(function () {
+      return /*#__PURE__*/_react.default.createElement(_filterTypes.default, (0, _extends2.default)({
+        type: type
+      }, obj));
+    });
+  }, [data, setFilterValue, type, filterValue]); // 清除筛选项
+
+  var handleClear = function handleClear(e) {
+    if (isFiltering) {
+      e.stopPropagation();
+      setFilterValue(type === 'checkbox' ? [] : '');
+    }
+  };
+
+  if (type === 'date') {
+    return /*#__PURE__*/_react.default.createElement(_react.default.Fragment, null, /*#__PURE__*/_react.default.createElement("div", {
+      className: (0, _classnames.default)('filter_item', {
+        isfiltering: isFiltering,
+        active: !isFiltering && visible
+      })
+    }, /*#__PURE__*/_react.default.createElement("div", {
+      className: "filter_item_label"
+    }, title, ":"), /*#__PURE__*/_react.default.createElement("div", {
+      className: "filter_item_value"
+    }, /*#__PURE__*/_react.default.createElement("div", {
+      className: "checked"
+    }, checkedValue))));
+  }
+
+  return /*#__PURE__*/_react.default.createElement(_react.default.Fragment, null, /*#__PURE__*/_react.default.createElement(_dropdown.default, {
+    trigger: ['click'],
+    visible: visible,
+    placement: "bottomLeft",
+    overlay: FilterControl,
+    onVisibleChange: function onVisibleChange(v) {
+      return setVisible(v);
+    }
+  }, /*#__PURE__*/_react.default.createElement("div", {
+    className: (0, _classnames.default)('filter_item', {
+      isfiltering: isFiltering,
+      active: !isFiltering && visible
+    })
+  }, /*#__PURE__*/_react.default.createElement("div", {
+    className: "filter_item_label"
+  }, title, ":"), /*#__PURE__*/_react.default.createElement("div", {
+    className: "filter_item_value"
+  }, /*#__PURE__*/_react.default.createElement("span", {
+    className: "checked"
+  }, checkedValue), /*#__PURE__*/_react.default.createElement(_IconFont.default, {
+    type: isFiltering ? 'lmweb-close-circle-fill' : 'lmweb-down',
+    className: "addonAfter",
+    onClick: handleClear
+  })))));
+};
+
+var _default = FilterMenu;
+exports.default = _default;

package/es/CkFilter/baseFilter/index.js

@@ -0,0 +1,91 @@
+"use strict";
+
+var _interopRequireWildcard = require("@babel/runtime/helpers/interopRequireWildcard");
+
+var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault");
+
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+exports.default = void 0;
+
+var _extends2 = _interopRequireDefault(require("@babel/runtime/helpers/esm/extends"));
+
+require("antd/es/input/style");
+
+var _input = _interopRequireDefault(require("antd/es/input"));
+
+var _objectSpread2 = _interopRequireDefault(require("@babel/runtime/helpers/esm/objectSpread2"));
+
+var _react = _interopRequireWildcard(require("react"));
+
+var _context = require("../context");
+
+var _filterMenu = _interopRequireDefault(require("./filterMenu"));
+
+var _moreFilters = _interopRequireDefault(require("./moreFilters"));
+
+var _utils = require("../utils");
+
+/* 二级筛选：基础过滤
+ * data
+ *
+ */
+var Filter = function Filter() {
+  var _data$filter, _data$filter$sort;
+
+  var inputRef = (0, _react.useRef)(null);
+
+  var _useStore = (0, _context.useStore)(),
+      _useStore$state = _useStore.state,
+      _useStore$state$insta = _useStore$state.instance,
+      data = _useStore$state$insta.data,
+      onChange = _useStore$state$insta.onChange,
+      placeholder = _useStore$state$insta.placeholder,
+      searchKey = _useStore$state$insta.searchKey,
+      search = _useStore$state$insta.search,
+      filter = _useStore$state$insta.filter,
+      isMore = _useStore$state.isMore,
+      filterValues = _useStore$state.filterValues,
+      visibleFields = _useStore$state.visibleFields,
+      orderFields = _useStore$state.orderFields,
+      customFilterValues = _useStore$state.customFilterValues,
+      dispatch = _useStore.dispatch;
+
+  var handleFilter = function handleFilter(val) {
+    var nValue = (0, _objectSpread2.default)({}, filterValues);
+
+    if (!(0, _utils.getIsHas)(val) && !(0, _utils.getIsHas)(nValue[searchKey])) {
+      return false;
+    }
+
+    (0, _utils.getIsHas)(val) ? nValue[searchKey] = val : delete nValue[searchKey];
+    dispatch({
+      type: 'changeFilterValues',
+      filterValues: nValue
+    });
+    onChange === null || onChange === void 0 ? void 0 : onChange(nValue, customFilterValues);
+    return false;
+  };
+
+  return /*#__PURE__*/_react.default.createElement(_react.default.Fragment, null, search && /*#__PURE__*/_react.default.createElement("div", {
+    className: "filter_search"
+  }, /*#__PURE__*/_react.default.createElement(_input.default.Search, {
+    ref: inputRef,
+    allowClear: true,
+    size: "small",
+    placeholder: placeholder,
+    onSearch: handleFilter
+  })), filter && /*#__PURE__*/_react.default.createElement(_react.default.Fragment, null, data === null || data === void 0 ? void 0 : (_data$filter = data.filter(function (v) {
+    return visibleFields.includes(v.field);
+  })) === null || _data$filter === void 0 ? void 0 : (_data$filter$sort = _data$filter.sort(function (a, b) {
+    return orderFields.indexOf(a.field) - orderFields.indexOf(b.field);
+  })) === null || _data$filter$sort === void 0 ? void 0 : _data$filter$sort.map(function (v) {
+    return /*#__PURE__*/_react.default.createElement(_filterMenu.default, (0, _extends2.default)({
+      key: v.field
+    }, v));
+  }), isMore && /*#__PURE__*/_react.default.createElement(_moreFilters.default, null)));
+};
+
+var _default = Filter;
+exports.default = _default;