lu-lowcode-package-form 0.11.54 → 0.11.56

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "lu-lowcode-package-form",
-  "version": "0.11.54",
+  "version": "0.11.56",
   "dependencies": {
     "@ant-design/icons": "^4.8.1",
     "@dnd-kit/core": "^6.1.0",

package/src/components/field/table/drag-head.jsx

@@ -3,7 +3,7 @@ import { eventEmitter } from "../../../utils/events"
 import { createPortal } from "react-dom"
 import { Resizable } from "react-resizable"
 
-const DragHead = ({ children, changeWidth, ...props }) => {
+const DragHead = ({ children, changeWidth, showAction, showLabel = false, ...props }) => {
     const [headWidths, setHeadWidths] = useState([])
     const headWidthsRef = useRef([])
     const [isDragging, setIsDragging] = useState(false)
@@ -48,7 +48,6 @@ const DragHead = ({ children, changeWidth, ...props }) => {
             headWidthsRef.current = newHeadWidths
             setHeadWidths(newHeadWidths)
             typeof changeWidth === 'function' && changeWidth(newHeadWidths)
-            eventEmitter.emit('changeSubTableColumnWidth', newHeadWidths)
             // 重置拖动状态
             setIsDragging(false)
             setResizingColumn(null)
@@ -98,7 +97,7 @@ const DragHead = ({ children, changeWidth, ...props }) => {
                                         height: '100%',
                                         width: '8px',
                                         cursor: 'col-resize',
-                                        zIndex: 1
+                                        zIndex: 9999
                                     }}
                                 />
                             }
@@ -108,12 +107,12 @@ const DragHead = ({ children, changeWidth, ...props }) => {
                                 className="fflex-1 fh-12 fflex fitems-center fpx-1 frelative" 
                                 style={{minWidth: width}}
                             >
-                                 
+                                {showLabel?<>{child?.props?.label}</>:<>&nbsp;</>}
                             </div>
                         </Resizable>
                     )
                 })}
-                <div className="fsticky fright-0 fborder-b" style={{ boxShadow: "rgba(50, 50, 50, 0.15) -6px 0px 6px -6px", flex: "0 0 50px", width: "50px" }}></div>
+                {showAction && <div className="fsticky fright-0 fborder-b" style={{ boxShadow: "rgba(50, 50, 50, 0.15) -6px 0px 6px -6px", flex: "0 0 50px", width: "50px" }}></div>}
             </div>
         <DragIndicator /></>
 }

package/src/components/field/table/index.jsx

@@ -51,7 +51,15 @@ const Table = ({ children, onTableAddRow, disabled, readonly, onTableRemoveRow,
     useEffect(() => {
         console.log("Table props", props)
     }, [props])
-    
+
+    useEffect(()=>{
+        const childrenDesc = React.Children.map(children, (child) => {
+            return {id:child.props.componentId || child.props.__id,label:child.props.label}
+        })
+        console.log("Emit Table childrenDesc", childrenDesc)
+        eventEmitter.emit("tableChildrenDesc", childrenDesc)
+    },[children])
+
     const [headWidths, setHeadWidths] = useState([])
     const tableComponentId = props.componentId || props.__id
     const newidRefs = useRef(React.Children.map(children, () => nanoid()));
@@ -132,7 +140,7 @@ const Table = ({ children, onTableAddRow, disabled, readonly, onTableRemoveRow,
                 return <div className="fw-full ">
 
                     <div className="fw-full frelative fmin-h-20 foverflow-x-auto" style={{ position: 'relative' }}>
-                        <DragHead changeWidth={handleChangeWidth}>{children}</DragHead>
+                        <DragHead changeWidth={handleChangeWidth} showAction={disabled != true && readonly != true}>{children}</DragHead>
                         {fields.length === 0 && <div key={`tableHead`} className="fborder-b fflex flex-nowrap fmin-w-full ">
                             {React.Children.map(children, (child, childIndex) => {
                                 const hidden = (child?.props?.calcHidden || !getDependencyMapShow(child?.props?.componentId || child?.props?.__id)) && mode != "desgin";
@@ -280,4 +288,5 @@ TableWrapper.displayName = "Table"
 export default TableWrapper;
 export { TableCol, TableAction };
 
-export { WithTable } from "./with-table"    
+export { WithTable } from "./with-table"    
+export  { DragHead }

package/src/components/index.jsx

@@ -9,7 +9,7 @@ import { default as RadioGroup } from './field/radio/index.jsx'
 import { UploadFile,UploadImage } from './field/upload'
 import  {default as Switch} from './field/switch'
 import {default as DatePicker } from './field/date-picker'
-import { default as Table , TableCol, WithTable } from './field/table'
+import { default as Table , TableCol, WithTable, DragHead } from './field/table'
 const Field = {
     Input,
     TextArea,
@@ -37,7 +37,8 @@ const Field = {
     Custom,
     UserSelect,
     DeptSelect,
-    PostSelect
+    PostSelect,
+    DragHead
 }
 Object.keys(Field).forEach(key => {
     Field[key].displayName = `Field.${key}`;