@hzab/list-render 1.7.0 → 1.8.2

package/CHANGELOG.md

@@ -1,3 +1,8 @@
+# @hzab/list-render@1.8.2
+
+fix: query schema props scope 模式问题修复
+fix: query allowClear 允许外部配置
+
 # @hzab/list-render@1.6.2
 
 fix: 监听 model query 更改

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@hzab/list-render",
-  "version": "1.7.0",
+  "version": "1.8.2",
   "description": "",
   "main": "src",
   "scripts": {

package/src/common/handleQuerySchema.ts

@@ -1,7 +1,8 @@
+import _ from "lodash";
 import { getFieldMap } from "./utils";
 
 export const handleQuerySchema = (opt) => {
-  const { schema, search, filters, onSearch, replaceComList } = opt || {};
+  const { schema, search, filters, onSearch, replaceComList, schemaScope } = opt || {};
   const queryProperties = {};
   let index = 0;
   if (search) {
@@ -10,13 +11,13 @@ export const handleQuerySchema = (opt) => {
     index += 1;
   }
 
-  const fieldMap = getFieldMap(schema);
+  const fieldMap = getFieldMap(_.cloneDeep(schema));
   filters?.forEach((key) => {
     const item = fieldMap[key];
     if (item) {
       const xComponent = item["x-component"];
       const replaceItem = replaceComList?.find((it) => it.name === key || (!it.name && it.component === xComponent));
-      // TODO: 优化
+
       const itemConf = {
         ...item,
         ...replaceItem,
@@ -25,11 +26,17 @@ export const handleQuerySchema = (opt) => {
         "x-display": "visible",
       };
 
-      if (!itemConf["x-component-props"]) {
+      // 处理 props 不存在、从 scope 中获取的情况
+      const comProps = itemConf["x-component-props"];
+      if (!comProps) {
         itemConf["x-component-props"] = {};
+      } else if (isScopeKey(comProps)) {
+        itemConf["x-component-props"] = getValByScope(comProps, schemaScope) || {};
       }
 
-      itemConf["x-component-props"].allowClear = true;
+      if (typeof itemConf["x-component-props"].allowClear !== "boolean") {
+        itemConf["x-component-props"].allowClear = true;
+      }
 
       handleInput(itemConf, opt);
       handleSelect(itemConf, opt);
@@ -173,7 +180,7 @@ export const handleShortcutSubmit = (conf, opt) => {
 
   // 输入框
   if (isEnterSubmit && xComponent === "Input") {
-    const onPressEnter = xComponentProps?.onPressEnter;
+    const onPressEnter = getSchemaVal(xComponentProps?.onPressEnter, opt);
     conf["x-component-props"].onPressEnter = function (e, ...args) {
       e?.preventDefault && e?.preventDefault();
       // 阻止默认事件，解决单个 input 提交问题
@@ -184,12 +191,12 @@ export const handleShortcutSubmit = (conf, opt) => {
     // 清除事件
     handleInputClear(conf, opt);
   } else if (isChangeSubmit && onChangeList.includes(xComponent)) {
-    conf["x-component-props"].onChange = handleHoc(xComponentProps?.onChange, onSearch);
+    conf["x-component-props"].onChange = handleHoc(xComponentProps?.onChange, onSearch, opt);
   }
   // 处理自定义组件快捷提交逻辑
   const item = customSubmitList?.find((it) => it.component === xComponent);
   if (item) {
-    conf["x-component-props"][item.event] = handleHoc(xComponentProps[item.event], onSearch);
+    conf["x-component-props"][item.event] = handleHoc(xComponentProps[item.event], onSearch, opt);
   }
 };
 
@@ -199,11 +206,14 @@ export const handleShortcutSubmit = (conf, opt) => {
  * @param cb
  * @returns
  */
-export const handleHoc = (source, cb) => {
+export const handleHoc = (source, cb, opt) => {
   return async function (...args) {
+    const { schemaScope } = opt;
+    let _source = getSchemaVal(source, schemaScope);
+
     let res = null;
-    if (source) {
-      res = await source(...args);
+    if (_source) {
+      res = await _source(...args);
     }
     cb && cb(...args);
     return res;
@@ -217,8 +227,8 @@ export const handleHoc = (source, cb) => {
  * @returns
  */
 export const handleInputClear = (conf, opt) => {
-  const { onSearch } = opt || {};
-  const onChange = conf["x-component-props"]?.onChange;
+  const { onSearch, schemaScope } = opt || {};
+  const onChange = getSchemaVal(conf["x-component-props"]?.onChange, schemaScope);
   conf["x-component-props"].onChange = function (e, ...args) {
     const res = onChange && onChange(e, ...args);
     if (e.type === "click" && e.target?.value === "") {
@@ -229,4 +239,56 @@ export const handleInputClear = (conf, opt) => {
   return conf;
 };
 
+/**
+ * 是否是 scope key
+ * @param strKey
+ * @returns
+ */
+export const isScopeKey = (strKey) => {
+  if (typeof strKey !== "string") {
+    return false;
+  }
+  const key = strKey.trim();
+  return key.startsWith("{{") && key.endsWith("}}");
+};
+
+/**
+ * 获取 scope key
+ * @param strKey
+ * @returns
+ */
+export const getScopeKey = (strKey) => {
+  if (!isScopeKey(strKey)) {
+    return "";
+  }
+  const key = strKey.trim();
+  return key.replace(/^\{\{/, "").replace(/\}\}$/, "");
+};
+
+/**
+ * 通过字符串获取 schemaScope 中的数据
+ * @param strKey
+ * @param schemaScope
+ * @returns
+ */
+export const getSchemaVal = (strKey, schemaScope = {}) => {
+  const val = getValByScope(strKey, schemaScope);
+  if (!_.isNil(val) && val !== "") {
+    return val;
+  }
+  return strKey;
+};
+
+/**
+ * 通过字符串获取 schemaScope 中的数据
+ * @param strKey
+ * @param schemaScope
+ * @returns
+ */
+export const getValByScope = (strKey, schemaScope = {}) => {
+  if (isScopeKey(strKey)) {
+    return schemaScope && schemaScope[getScopeKey(strKey)];
+  }
+};
+
 export default handleQuerySchema;

package/src/list-render.jsx

@@ -69,7 +69,6 @@ const ListRender = forwardRef(function (props, parentRef) {
       model.query = {};
     }
     modelQueryRef.current = model?.query;
-
   }, [model?.query]);
 
   useEffect(() => {
@@ -110,7 +109,7 @@ const ListRender = forwardRef(function (props, parentRef) {
       ..._q,
       ..._q1,
       ..._q2,
-      ..._q3
+      ..._q3,
     };
 
     if (mergedQueries.$timerange !== undefined) {
@@ -119,7 +118,6 @@ const ListRender = forwardRef(function (props, parentRef) {
 
     model.query = mergedQueries;
 
-
     model
       ?.getList(mergedQueries)
       .then((res) => {
@@ -145,8 +143,8 @@ const ListRender = forwardRef(function (props, parentRef) {
     getList();
   }
 
-  function onSearch(quer,source) {
-    const query = source === "queryRender" ? {...quer} :{...formQueryRef.current, ...quer};
+  function onSearch(quer, source) {
+    const query = source === "queryRender" ? { ...quer } : { ...formQueryRef.current, ...quer };
     if (model && !model.query) {
       model.query = {};
     }
@@ -302,9 +300,9 @@ const ListRender = forwardRef(function (props, parentRef) {
             queryFormInitialValues={
               queryFormIsExtendModelQuery
                 ? {
-                  ...queryFormInitialValues,
-                  ...model.query,
-                }
+                    ...queryFormInitialValues,
+                    ...model.query,
+                  }
                 : queryFormInitialValues
             }
             onSearch={onSearch}
@@ -329,9 +327,7 @@ const ListRender = forwardRef(function (props, parentRef) {
           )}
         </div>
       </div>
-      {Slots.HeaderOthersSuffix && (
-        <Slots.HeaderOthersSuffix onSearch={onSearch} getList={getList} />
-      )}
+      {Slots.HeaderOthersSuffix && <Slots.HeaderOthersSuffix onSearch={onSearch} getList={getList} />}
       <TableRender
         idKey={idKey}
         schema={schema?.schema}

package/src/query-render/index.jsx

@@ -18,6 +18,7 @@ function QueryRender(props, parentRef) {
     setSchema(
       handleQuerySchema({
         ...props?.config,
+        schemaScope: props.schemaScope,
         schema: _.cloneDeep(props.schema),
         search: props.search,
         filters: _.cloneDeep(props.filters),
@@ -48,12 +49,12 @@ function QueryRender(props, parentRef) {
 
       if (!beforeQuerySearchResult) return;
     }
-    return props.onSearch && props.onSearch(query, 'queryRender');
+    return props.onSearch && props.onSearch(query, "queryRender");
   }
 
   function onReset() {
     formRef.current?.formRender?.reset();
-    props.onSearch && props.onSearch(_.cloneDeep(formRef?.current?.formRender?.values), 'queryRender');
+    props.onSearch && props.onSearch(_.cloneDeep(formRef?.current?.formRender?.values), "queryRender");
   }
 
   return (

package/src/table-render/index.jsx

@@ -54,7 +54,7 @@ function TableRender(props) {
       scope: props.schemaScope,
       formilyRef,
     });
-    _fieldList.forEach((field) => {
+    _fieldList.forEach((field, colIndex) => {
       const fieldSchemas = formilyRef.current?.fields;
       if (field.inTable !== false) {
         const { name, title } = field;
@@ -121,6 +121,7 @@ function TableRender(props) {
 
         columns.push({
           ..._colConf,
+          onCell: (record, rowIndex) => (_colConf?.onCell?.({...record, _field: { ...field, ...(fieldSchemas?.[name] || {}) }}, rowIndex) || {}),
           title: _title,
           key: name,
           dataIndex: name,