@lemon-fe/components 1.1.3-alpha.1 → 1.1.4

package/es/filter/index.js

@@ -18,6 +18,7 @@ function _iterableToArray(iter) { if (typeof Symbol !== "undefined" && iter[Symb
 function _arrayWithoutHoles(arr) { if (Array.isArray(arr)) return _arrayLikeToArray(arr); }
 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 _extends() { _extends = Object.assign ? Object.assign.bind() : function (target) { for (var i = 1; i < arguments.length; i++) { var source = arguments[i]; for (var key in source) { if (Object.prototype.hasOwnProperty.call(source, key)) { target[key] = source[key]; } } } return target; }; return _extends.apply(this, arguments); }
+import { Button, Checkbox, Form, Input, Popover, Space, Modal, message, Select, Empty } from 'antd';
 import React, { useEffect, useMemo, useState, useContext } from 'react';
 import { ComponentConfigureContext } from "../component-configure";
 import Dropdown from "../dropdown";
@@ -26,9 +27,8 @@ import FormLayout from "../form-layout";
 import Icons from "../icons";
 import InputNumber from "../input-number";
 import TabBar from "../tab-bar";
-import { prefixClassName } from "../utils";
-import { useDebounce, useRequest } from '@lemon-fe/hooks';
-import { Button, Checkbox, Form, Input, Popover, Space, Modal, message, Select, Empty } from 'antd';
+import { mergeProp, prefixClassName } from "../utils";
+import { useDebounce, useRequest, useUpdateEffect } from '@lemon-fe/hooks';
 import classNames from 'classnames';
 import ResizeObserver from 'rc-resize-observer';
 var components = [{
@@ -107,7 +107,10 @@ function Filter(props) {
     _props$preserveFields = props.preserveFields,
     preserveFields = _props$preserveFields === void 0 ? true : _props$preserveFields,
     legacyReset = props.legacyReset,
-    componentOptions = props.componentOptions;
+    componentOptions = props.componentOptions,
+    _props$filterDependen = props.filterDependencies,
+    filterDependencies = _props$filterDependen === void 0 ? [] : _props$filterDependen,
+    formProp = props.form;
   var prefix = prefixClassName('filter');
   var emptyValue = useMemo(function () {
     return Object.fromEntries(data.map(function (item) {
@@ -160,9 +163,7 @@ function Filter(props) {
   var _Form$useForm = Form.useForm(),
     _Form$useForm2 = _slicedToArray(_Form$useForm, 1),
     modalForm = _Form$useForm2[0];
-  var _Form$useForm3 = Form.useForm(),
-    _Form$useForm4 = _slicedToArray(_Form$useForm3, 1),
-    form = _Form$useForm4[0];
+  var form = mergeProp(Form.useForm()[0], formProp);
   var _useState11 = useState(0),
     _useState12 = _slicedToArray(_useState11, 2),
     width = _useState12[0],
@@ -191,6 +192,9 @@ function Filter(props) {
       form.setFieldsValue(value);
     }
   }, [value]);
+  useUpdateEffect(function () {
+    form.submit();
+  }, filterDependencies);
   var handleChangeKeywords = useDebounce(setKeywords, 300);
   var toggleModal = function toggleModal() {
     setShowModal(function (prev) {

package/es/filter/typings.d.ts

@@ -1,5 +1,5 @@
-import type { CSSProperties, ReactElement, ReactNode } from 'react';
 import type { FormInstance } from 'antd';
+import type { CSSProperties, ReactElement, ReactNode, DependencyList } from 'react';
 
 export interface FilterItemType<T = any> {
   key: string;
@@ -61,6 +61,14 @@ export interface FilterProps<T extends Record<string, any> = Record<string, any>
    */
   legacyReset?: true;
   componentOptions?: ComponentOption[];
+  /**
+   * @description 自动触发过滤的依赖
+   */
+  filterDependencies?: DependencyList;
+  /**
+   * @description Form表单的实例，默认会由内部生成，一般情况不需要处理
+   */
+  form?: FormInstance<T>;
 }
 
 export interface ComponentOption {

package/es/select-view/index.js

@@ -15,11 +15,11 @@ function _unsupportedIterableToArray(o, minLen) { if (!o) return; if (typeof o =
 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(r, l) { var t = null == r ? null : "undefined" != typeof Symbol && r[Symbol.iterator] || r["@@iterator"]; if (null != t) { var e, n, i, u, a = [], f = !0, o = !1; try { if (i = (t = t.call(r)).next, 0 === l) { if (Object(t) !== t) return; f = !1; } else for (; !(f = (e = i.call(t)).done) && (a.push(e.value), a.length !== l); f = !0); } catch (r) { o = !0, n = r; } finally { try { if (!f && null != t.return && (u = t.return(), Object(u) !== u)) return; } finally { if (o) throw n; } } return a; } }
 function _arrayWithHoles(arr) { if (Array.isArray(arr)) return arr; }
-import { Spin, Tabs } from 'antd';
+import { Form, Spin, Tabs } from 'antd';
 import React, { useEffect, useMemo, useRef, useState } from 'react';
 import DataGrid from "../data-grid";
 import Filter from "../filter";
-import { prefixClassName } from "../utils";
+import { mergeProp, prefixClassName } from "../utils";
 import { get } from 'lodash';
 export default function SelectView(props) {
   var emptyValue = useMemo(function () {
@@ -70,6 +70,7 @@ export default function SelectView(props) {
     _useState10 = _slicedToArray(_useState9, 2),
     loading = _useState10[0],
     setLoading = _useState10[1];
+  var filterForm = mergeProp(Form.useForm()[0], filter === null || filter === void 0 ? void 0 : filter.form);
   var cParams = (filter === null || filter === void 0 ? void 0 : filter.value) || params;
   var getRowKey = function getRowKey(item) {
     var _get;
@@ -145,7 +146,8 @@ export default function SelectView(props) {
     if (filter.data) {
       headerNode = /*#__PURE__*/React.createElement(Filter, _extends({
         simple: true,
-        autoPlaceholder: true
+        autoPlaceholder: true,
+        form: filterForm
       }, filter, {
         value: cParams,
         onChange: function onChange(val) {
@@ -155,9 +157,12 @@ export default function SelectView(props) {
     }
     if (filter.sider) {
       siderNode = filter.sider({
+        /**
+         * 原则上这里使用cParams也会有问题，不排除Filter中的条件可能会影响Sider的渲染，但此种情况先忽略，尽可能避免这个情况
+         */
         value: cParams,
         onChange: function onChange(val) {
-          return handleChangeParams(_objectSpread(_objectSpread({}, cParams), val));
+          handleChangeParams(_objectSpread(_objectSpread(_objectSpread({}, cParams), filterForm.getFieldsValue()), val));
         }
       });
     }
@@ -176,6 +181,7 @@ export default function SelectView(props) {
     return result;
   }, [selectedColumns, readOnly]);
   var content;
+  console.log(cParams);
   var renderList = function renderList() {
     return /*#__PURE__*/React.createElement("div", {
       className: prefix('layout')

package/es/styles/overrides.less

@@ -76,6 +76,7 @@ a[title='站长统计'] {
 @modal-border-radius: 8px;
 @modal-footer-border-width: 0;
 @modal-confirm-body-padding: 0;
+@modal-mask-bg: fade(@black, 30%);
 
 .@{ant-prefix}-modal-content {
   padding: @padding-md;

package/es/utils.d.ts

@@ -1,3 +1,4 @@
 import type { ReactNode } from 'react';
 export declare function mapChildren<T>(children: ReactNode, cb: (node: ReactNode, index: number) => T): T[];
 export declare function prefixClassName(prefix: string): (val?: string) => string;
+export declare function mergeProp<T>(internal: T, prop: T | undefined): T;

package/es/utils.js

@@ -17,4 +17,7 @@ export function prefixClassName(prefix) {
   return function (val) {
     return "".concat(PREFIX_CLS, "-").concat(prefix) + (val ? "-".concat(val) : '');
   };
+}
+export function mergeProp(internal, prop) {
+  return prop || internal;
 }

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@lemon-fe/components",
-  "version": "1.1.3-alpha.1",
+  "version": "1.1.4",
   "description": "> TODO: description",
   "homepage": "",
   "license": "ISC",
@@ -62,5 +62,5 @@
   "publishConfig": {
     "registry": "https://registry.npmjs.org"
   },
-  "gitHead": "9f776b18500b0819aa7008b18c580aaf8748b4d8"
+  "gitHead": "03ab34dbecd7dc7d99e2006900d33e725681305f"
 }