@hzab/form-render 1.6.13 → 1.6.14

package/CHANGELOG.md

@@ -1,3 +1,7 @@
+# @hzab/form-render@1.6.14
+
+fix: 修复 TreeCheckbox 隐藏不能点击问题。
+
 # @hzab/form-render@1.6.13
 
 feat:locationListPicker在已有元素范围内可新增地址标记

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@hzab/form-render",
-  "version": "1.6.13",
+  "version": "1.6.14",
   "description": "",
   "main": "src",
   "scripts": {

package/src/components/TreeCheckbox/components/CheckboxTable/index.tsx

@@ -1,7 +1,7 @@
 import { Checkbox } from "antd";
 
 export const CheckboxTable = (props) => {
-  const { data } = props;
+  const { data, onChange } = props;
   return (
     <table className="tree-checkbox-table">
       <tbody>
@@ -27,7 +27,7 @@ export const CheckboxTable = (props) => {
                           const itKey = it?.value;
                           return (
                             it && (
-                              <Checkbox value={itKey} key={itKey}>
+                              <Checkbox onChange={onChange} value={itKey} key={itKey}>
                                 {it.label}
                               </Checkbox>
                             )
@@ -36,7 +36,7 @@ export const CheckboxTable = (props) => {
                       </>
                     ) : (
                       col && (
-                        <Checkbox value={colKey} key={colKey}>
+                        <Checkbox onChange={onChange} value={colKey} key={colKey}>
                           {col.label}
                         </Checkbox>
                       )

package/src/components/TreeCheckbox/components/TabsRender/index.tsx

@@ -36,7 +36,12 @@ export const TabRender = (props) => {
             forceRender
             tab={
               <>
-                <Checkbox value={it[valueKey]} key={it[valueKey]} onClick={onStopPropagation}></Checkbox>
+                <Checkbox
+                  value={it[valueKey]}
+                  onChange={props?.onChange}
+                  key={it[valueKey]}
+                  onClick={onStopPropagation}
+                ></Checkbox>
                 &nbsp;&nbsp;{it[labelKey]}
               </>
             }

package/src/components/TreeCheckbox/index.less

@@ -1,4 +1,5 @@
 .tree-checkbox {
+  width: 100%;
   .tree-checkbox-table {
     table-layout: fixed;
     .tree-checkbox-row {

package/src/components/TreeCheckbox/index.tsx

@@ -1,12 +1,10 @@
 import { useMemo } from "react";
-import { Checkbox, Tabs } from "antd";
+import { Checkbox } from "antd";
 import { useField } from "@formily/react";
 
 import Render from "./components/Render";
 import { getTabTableData } from "./common/utils";
 
-const { TabPane } = Tabs;
-
 import "./index.less";
 
 export const TreeCheckbox = (props) => {
@@ -30,7 +28,6 @@ export const TreeCheckbox = (props) => {
     // tab 配置列表
     tabConfList,
   } = props;
-
   const tabLevel = tabBox === true ? 1 : tabConfList?.length ?? props.tabLevel;
 
   const showDataSource = useMemo(() => {
@@ -45,8 +42,20 @@ export const TreeCheckbox = (props) => {
     // 内部数据
   };
   return (
-    <Checkbox.Group className="tree-checkbox" disabled={disabled || readOnly} value={value} onChange={onChange}>
-      <Render {..._props} list={showDataSource} />
+    <Checkbox.Group className="tree-checkbox" disabled={disabled || readOnly} value={value}>
+      <Render
+        {..._props}
+        onChange={(e) => {
+          let selectedValues = value && Array.isArray(value) ? value : [];
+          if (e.target.checked) {
+            selectedValues = [...selectedValues.filter((v) => v != e.target.value), e.target.value];
+          } else {
+            selectedValues = [...selectedValues.filter((v) => v != e.target.value)];
+          }
+          onChange(selectedValues);
+        }}
+        list={showDataSource}
+      />
     </Checkbox.Group>
   );
 };