@lingxiteam/ebe-utils 0.2.22 → 0.2.23

package/lib/pcpublic/src/components/pcfactory/src/utils/formUtils/WrapperContainer.tsx

@@ -1,6 +1,7 @@
+import React, { CSSProperties, FC } from 'react';
 import { Col } from 'antd';
-import { CSSProperties, FC } from 'react';
 import { getTestHelperProps } from '../hooks/useTestHelper';
+import classNames from 'classnames';
 
 export interface WrapperContainerProps {
   labelAlign: any;
@@ -15,26 +16,74 @@ export interface WrapperContainerProps {
   colProps: any;
   fieldName: string;
   disabled: boolean;
+  labelWrap?: boolean;
+  lineHeight: string;
 }
 
 const WrapperContainer: FC<WrapperContainerProps> = props => {
-  const { labelAlign, colon, wrapperStyle, children, required, labelCol, showWrapperContainer, isFormRootChild, fieldName, disabled } = props;
+  const {
+    labelAlign,
+    colon,
+    wrapperStyle,
+    children,
+    required,
+    labelCol,
+    showWrapperContainer,
+    isFormRootChild,
+    fieldName,
+    disabled,
+    labelWrap,
+    lineHeight,
+  } = props;
 
   // 配合测试的属性
   const testProps = getTestHelperProps({ fieldName, disabled });
 
+
   if (!showWrapperContainer && !isFormRootChild) {
     return <>{children}</>;
   }
 
   if (!showWrapperContainer && isFormRootChild) {
-    return (
-      <Col {...testProps} {...props.colProps}>
-        {children}
-      </Col>
-    );
+    return <Col {...testProps} {...props.colProps}>{children}</Col>;
   }
 
+  const content = (
+    <div
+      style={{
+        width: labelCol,
+        flexShrink: 0,
+        lineHeight,
+        height: lineHeight,
+      }}
+    >
+      {props.label && (
+        <span
+          style={{
+            justifyContent: labelAlign === 'right' ? 'flex-end' : 'flex-start',
+          }}
+          className={classNames(
+            'formLabel-item-label',
+            {
+              'formLabel-item-label-no-colon': !colon,
+            }
+          )}
+        >
+          {required && <span className="formLabel-required">*</span>}
+          <span className={classNames(
+            'formLabel-item-label-title',
+            {
+              'formLabel-item-label-title-label-wrap': labelWrap,
+            }
+          )}
+          >
+            {props.label}
+          </span>
+        </span>
+      )}
+    </div>
+  );
+
   if (isFormRootChild) {
     return (
       <Col {...testProps} {...props.colProps}>
@@ -46,21 +95,7 @@ const WrapperContainer: FC<WrapperContainerProps> = props => {
             alignItems: 'center',
           }}
         >
-          <div
-            style={{
-              width: labelCol,
-              textAlign: labelAlign,
-              flexShrink: 0,
-            }}
-          >
-            {props.label && (
-              <span>
-                {required && <span style={{ fontSize: 12, marginRight: 4, color: '#ff4d4f' }}>*</span>}
-                {props.label}
-                <span style={{ marginLeft: 2, marginRight: 8 }}>{colon ? ':' : ''}</span>
-              </span>
-            )}
-          </div>
+          {content}
           <div style={wrapperStyle}>{children}</div>
         </div>
       </Col>
@@ -77,21 +112,7 @@ const WrapperContainer: FC<WrapperContainerProps> = props => {
       }}
       {...testProps}
     >
-      <div
-        style={{
-          width: labelCol,
-          textAlign: labelAlign,
-          flexShrink: 0,
-        }}
-      >
-        {props.label && (
-          <span>
-            {required && <span style={{ fontSize: 12, marginRight: 4, color: '#ff4d4f' }}>*</span>}
-            {props.label}
-            <span style={{ marginLeft: 2, marginRight: 8 }}>{colon ? ':' : ''}</span>
-          </span>
-        )}
-      </div>
+      {content}
       <div style={wrapperStyle}>{children}</div>
     </div>
   );

package/lib/pcpublic/src/components/pcfactory/src/utils/formUtils/cmdHelper.ts

@@ -13,7 +13,7 @@ const getFormsIdByUid = (uid: string, refs: RefsType) => {
   if (!Array.isArray(list)) {
     return list;
   }
-  return list.map(it => it.replace(/(@@@)|(&&&)/g, ''));
+  return list.map((it) => it.replace(/(@@@)|(&&&)/g, ''));
 };
 
 /**
@@ -45,7 +45,7 @@ export const getFormOfInLoopByLoopId = (options: {
     const result = uid
       .split('---')
       .filter(Boolean)
-      .find(id => {
+      .find((id) => {
         const [compId] = id.split('@@@');
         return compId === loopId;
       });
@@ -64,6 +64,7 @@ export const getFormOfInLoopByLoopId = (options: {
       });
     }
 
+
     // 不是表单 或者不在循环容器内
     if (refs[uid].compName !== 'Form' || !/[@@@|&&&]/.test(uid)) {
       continue;
@@ -120,7 +121,7 @@ export const getFormByCompId = (compId: string, refs: RefsType) => {
   if (form) {
     return form;
   }
-  const uidArr = Object.keys(refs).filter(uid => {
+  const uidArr = Object.keys(refs).filter((uid) => {
     const ids = getFormsIdByUid(uid, refs);
     if (!ids) {
       return false;
@@ -132,17 +133,20 @@ export const getFormByCompId = (compId: string, refs: RefsType) => {
     return null;
   }
 
-  return uidArr.map(uid => refs[uid]);
+  return uidArr.map((uid) => refs[uid]);
 };
 
-export const getFieldsValue = async (forms: RefsType | RefsType[], getFieldsValue: (form: any) => void) => {
+export const getFieldsValue = async (
+  forms: RefsType | RefsType[],
+  getFieldsValue: (form: any) => void,
+) => {
   // 当表单不存在时，应该获取的是undefined
   if (!forms) {
     return undefined;
   }
 
   if (Array.isArray(forms)) {
-    return Promise.all(forms.map(form => getFieldsValue(form)));
+    return Promise.all(forms.map((form) => getFieldsValue(form)));
   }
   return getFieldsValue(forms);
 };
@@ -174,13 +178,8 @@ interface FirstErrorInfoType {
  * @param getFieldsValue
  */
 export const getOwnFormValues = async (
-  options: {
-    currentRefs: RefsType;
-    engineRelation: EngineRelationMethods;
-    routerId: string;
-    compId?: string;
-  },
-  getFieldsValue: (form: any) => void
+  options: { currentRefs: RefsType; engineRelation: EngineRelationMethods; routerId: string, compId?: string },
+  getFieldsValue: (form: any) => void,
 ) => {
   const { currentRefs, engineRelation, routerId, compId } = options;
 
@@ -201,7 +200,7 @@ export const getOwnFormValues = async (
       if (!compId || compId === uid) {
         const ref = refs[uid];
         if (!['Form', 'DynamicDataContainer'].includes(ref.compName)) {
-          // 需要处理BOFramer和PageView这种渲染逻辑
+        // 需要处理BOFramer和PageView这种渲染逻辑
           const uidRefs = engineRelation.getEngineRefsByUid(uid, routerId);
           if (uidRefs) {
             await getRenderRefsFormValues(uidRefs.refs);
@@ -220,7 +219,7 @@ export const getOwnFormValues = async (
           try {
             const value = await getFieldsValue(ref);
             if (type === 'default') {
-              // 1. 首次赋值， 包含循环容器内逻辑
+            // 1. 首次赋值， 包含循环容器内逻辑
               if (!values[formCode]) {
                 values[formCode] = value;
                 formCodeTypes[formCode] = 'default';
@@ -228,17 +227,17 @@ export const getOwnFormValues = async (
               }
               // 2. 存在编码相同时，切换成数组类型
               if (formCodeTypes[formCode] === 'default') {
-                // 处理页面中存在多个相同的表单，但是表单编码一样。这时候表现为数组形式
+              // 处理页面中存在多个相同的表单，但是表单编码一样。这时候表现为数组形式
                 values[formCode] = [values[formCode]];
                 formCodeTypes[formCode] = 'array';
               }
 
               // 3. 给数组添加当前值
-              if (formCodeTypes[formCode] === 'array') {
+              if ((formCodeTypes[formCode] === 'array')) {
                 values[formCode].push(value);
               }
             } else if (type === 'inLoop') {
-              // 1. 或许存在一个没包含在循环容器内表单，并且该表单和循环容器下的表单编码相同，
+            // 1. 或许存在一个没包含在循环容器内表单，并且该表单和循环容器下的表单编码相同，
               if (formCodeTypes[formCode] === 'default') {
                 values[formCode] = [values[formCode]];
               }
@@ -274,7 +273,11 @@ export const getOwnFormValues = async (
   return Promise.resolve(values);
 };
 
-export const getAllFormValues = (options: { currentRefs: RefsType; engineRelation: EngineRelationMethods; routerId: string }) => {
+export const getAllFormValues = (options: {
+  currentRefs: RefsType;
+  engineRelation: EngineRelationMethods;
+  routerId: string,
+}) => {
   const { currentRefs, engineRelation, routerId } = options;
   const forms: RefsType[] = [];
   const getRenderRefsFormValues = (refs: RefsType = {}) => {
@@ -320,15 +323,12 @@ export const getBOFramers = (compId: string, refs: RefsType = {}) => {
   return boframerRefs;
 };
 
-export const getBOFramerOwnFormValues = async (
-  options: {
-    refs: RefsType;
-    engineRelation: EngineRelationMethods;
-    routerId: string;
-    compId: string;
-  },
-  getFieldsValue: (form: any) => void
-) => {
+export const getBOFramerOwnFormValues = async (options: {
+  refs: RefsType;
+  engineRelation: EngineRelationMethods;
+  routerId: string,
+  compId: string
+}, getFieldsValue: (form: any) => void,) => {
   const { engineRelation, routerId, refs, compId } = options;
 
   // 2种情况 1只有单个业务组件 2 业务组件放在循环容器下
@@ -336,7 +336,10 @@ export const getBOFramerOwnFormValues = async (
 
   let values = {};
   if (boframerRefs) {
-    values = await getOwnFormValues({ currentRefs: boframerRefs, engineRelation, routerId }, getFieldsValue);
+    values = await getOwnFormValues(
+      { currentRefs: boframerRefs, engineRelation, routerId },
+      getFieldsValue,
+    );
   }
 
   // 理论上获取业务组件 应该都带有表单编码，但是由于需要兼容旧数据 需要把值展开
@@ -350,7 +353,7 @@ export const getBOFramerOwnFormValues = async (
 };
 
 // 获取BOFramer下所有表单
-export const getBoframerOwnForms = (options: { currentRefs: RefsType; engineRelation: EngineRelationMethods; routerId: string; compId: string }) => {
+export const getBoframerOwnForms = (options: { currentRefs: RefsType; engineRelation: EngineRelationMethods; routerId: string, compId: string }) => {
   const { compId, currentRefs, engineRelation, routerId } = options;
   const boframers = getBOFramers(compId, currentRefs);
 

package/lib/pcpublic/src/components/pcfactory/src/utils/formUtils/common.ts

@@ -1,3 +1,4 @@
+
 export type mode = 'grid' | 'pixel' | 'percentage' | '';
 
 /**
@@ -27,6 +28,7 @@ export const getFormItemClassName = (fieldName: string) => {
   return `formItem-error-${fieldName}`;
 };
 
+
 /**
  * 过滤html里面的危险标签
  * @param str