feat: 添加 card布局容器

src/components/NiceForm/public/index.tsx

@@ -4,6 +4,7 @@ import { registerVirtualBox, SchemaField } from "@formily/antd"
 import { Col, Row, Space } from 'antd'
 import cx from 'classnames'
 import styled from 'styled-components'
+import themeConfig from '../../../../config/lingxi.theme.config';
 
 const RowLayout = styled(props => <Row justify='end' {...props}/>)`
   .mega-layout-item {
@@ -14,6 +15,17 @@ const RowLayout = styled(props => <Row justify='end' {...props}/>)`
   }
 `
 
+const CardBox = styled(props => <div {...props}/>)`
+  .card-box-title {
+    padding-left: ${themeConfig['@padding-xs']};
+    margin-bottom: ${themeConfig['@margin-lg']};
+    line-height: ${themeConfig['@font-size-lg']};
+    font-size: ${themeConfig['@font-size-lg']};
+    font-weight: 500;
+    border-left: 2px solid ${themeConfig['@primary-color']};
+  }
+`
+
 const renderCol = (schema, isLast) => {
   const { flexcol = {} } = schema['x-component-props']
   return <Col style={isLast ? {} : {marginRight: 24}} {...flexcol} key={schema.path}>
@@ -92,4 +104,23 @@ registerVirtualBox('LeftRightLayout', (_props) => {
       ))}
     </Row>
   )
+})
+
+// card容器
+registerVirtualBox('CardBox', (_props) => {
+  const { children, props } = _props;
+  const title = props['x-component-props'] ? props['x-component-props'].title : '';
+  const wrapProps = props['x-component-props'] ? props['x-component-props'].wrapProps : {};
+  return (
+    <CardBox
+      {...wrapProps}
+    >
+      <div className="card-box-title">
+        {title}
+      </div>
+      <div>
+        {children}
+      </div>
+    </CardBox>
+  )
 })
\ No newline at end of file