@lingxiteam/ebe-utils 0.2.4 → 0.2.5

package/lib/h5public/src/components/factory/src/SearchView/index.tsx

@@ -1,8 +1,4 @@
-import {
-  Calendar,
-  SearchView,
-  SearchViewType,
-} from '@lingxiteam/antd-mobile-plus';
+import { Calendar, SearchView, SearchViewType } from '@lingxiteam/antd-mobile-plus';
 import { LingxiForwardRef } from '@lingxiteam/types';
 import classNames from 'classnames';
 import moment from 'moment';
@@ -28,246 +24,215 @@ export interface MySearchViewProps extends SearchViewType {
 
 const prefixWrap = 'alita-search-view-wrap';
 
-const MySearchView = LingxiForwardRef<unknown, MySearchViewProps>(
-  (props, ref) => {
-    const {
-      children,
-      _component,
-      filterData,
-      filterValue,
-      style = {},
-      searchViewType = 'text',
-      onFilterChange = () => {},
-      onChange,
-      showDateRange,
-      minStartDate,
-      value,
-      visible = true,
-      labelAlias: IlabelAlias = 'label',
-      valueAlias: VvalueAlias = 'value',
-      $$componentItem,
-      className,
-      getEngineApis,
-      ...restProps
-    } = props;
-    const { getLocale } = getEngineApis?.() || {};
-    const { inputStyle = {}, ...restStyle } = style;
-    const [showCalendar, setShowCalendar] = useState(false);
-    const [startDate, setStartDate] = useState('开始时间');
-    const [endDate, setEndDate] = useState('结束时间');
-    const [myFilterValue, setMyFilterValue] = useState(filterValue);
-    const [minDate, setMinDate] = useState(new Date('2016/01/01'));
-    const [filterObject, setFilterObject] = useState<any>({});
-    const [myFilterData, setFilterData] = useState(filterData);
-    const [labelAlias, setLabelAlias] = useState(IlabelAlias);
-    const [valueAlias, setValueAlias] = useState(VvalueAlias);
+const MySearchView = LingxiForwardRef<unknown, MySearchViewProps>((props, ref) => {
+  const {
+    children,
+    _component,
+    filterData,
+    filterValue,
+    style = {},
+    searchViewType = 'text',
+    onFilterChange = () => {},
+    onChange,
+    showDateRange,
+    minStartDate,
+    value,
+    visible = true,
+    labelAlias: IlabelAlias = 'label',
+    valueAlias: VvalueAlias = 'value',
+    $$componentItem,
+    className,
+    getEngineApis,
+    ...restProps
+  } = props;
+  const { getLocale } = getEngineApis?.() || {};
+  const { inputStyle = {}, ...restStyle } = style;
+  const [showCalendar, setShowCalendar] = useState(false);
+  const [startDate, setStartDate] = useState('开始时间');
+  const [endDate, setEndDate] = useState('结束时间');
+  const [myFilterValue, setMyFilterValue] = useState(filterValue);
+  const [minDate, setMinDate] = useState(new Date('2016/01/01'));
+  const [filterObject, setFilterObject] = useState<any>({});
+  const [myFilterData, setFilterData] = useState(filterData);
+  const [labelAlias, setLabelAlias] = useState(IlabelAlias);
+  const [valueAlias, setValueAlias] = useState(VvalueAlias);
 
-    useEffect(() => {
-      setFilterData(filterData);
-    }, [JSON.stringify(filterData)]);
+  useEffect(() => {
+    setFilterData(filterData);
+  }, [JSON.stringify(filterData)]);
 
-    const myOnChange = (e: any) => {
-      if (onChange) {
-        onChange({ inputValue: e, filterValue: filterObject });
-      }
-    };
-    useImperativeHandle(ref, () => ({
-      setDataWithLabelAndValue: (params: reloadSelectDataType) => {
-        const {
-          labelKey = 'label',
-          valueKey = 'value',
-          childrenKey,
-          dataSource = [],
-        } = params || {};
-        if (dataSource.length === 0 || !valueKey || !labelKey) return;
-        let isFindItem;
-        const data = dataSource?.map((item) => {
-          if (item[valueKey] === childrenKey) {
-            isFindItem = item;
-          }
-          return {
-            ...item,
-            [labelKey]: item[labelKey],
-            [valueKey]: item[valueKey],
-          };
-        });
-        setLabelAlias(labelKey);
-        setValueAlias(valueKey);
-        if (isFindItem) {
-          setFilterObject(isFindItem);
-          // @ts-ignore
-          setMyFilterValue(isFindItem.value);
-        } else if (data.length > 0) {
-          setFilterObject(data[0]);
-          // @ts-ignore
-          setMyFilterValue(data[0]?.value);
-        }
-        setFilterData(data);
-        if (onChange) {
-          // @ts-ignore
-          onChange({
-            inputValue: typeof value === 'object' ? value?.inputValue : value,
-            filterObject,
-          });
-        }
-        // setData(initData(params.dataSource, params.labelKey, params.valueKey, params.childrenKey));
-      },
-      clearValue: () => {
-        if (onChange) {
-          onChange({ inputValue: '', filterValue });
-        }
-      },
-      setValue(value: Object | string) {
-        if (typeof value === 'object') {
-          if (onChange) {
-            onChange(value);
-          }
-        } else {
-          myOnChange(value);
+  const myOnChange = (e: any) => {
+    if (onChange) {
+      onChange({ inputValue: e, filterValue: filterObject });
+    }
+  };
+  useImperativeHandle(ref, () => ({
+    setDataWithLabelAndValue: (params: reloadSelectDataType) => {
+      const { labelKey = 'label', valueKey = 'value', childrenKey, dataSource = [] } = params || {};
+      if (dataSource.length === 0 || !valueKey || !labelKey) return;
+      let isFindItem;
+      const data = dataSource?.map(item => {
+        if (item[valueKey] === childrenKey) {
+          isFindItem = item;
         }
-      },
-      get value() {
-        // @ts-ignore
-        return {
-          inputValue: typeof value === 'object' ? value?.inputValue : value,
-          filterObject,
-        };
-      },
-    }));
-
-    // 获取默认
-    const filterItemWithValue = (
-      data: any[] = [],
-      value = '',
-      labelAlias: string,
-      valueAlias: string,
-    ) => {
-      if (data.length === 0) {
         return {
-          [labelAlias]: '',
-          [valueAlias]: '',
+          ...item,
+          [labelKey]: item[labelKey],
+          [valueKey]: item[valueKey],
         };
+      });
+      setLabelAlias(labelKey);
+      setValueAlias(valueKey);
+      if (isFindItem) {
+        setFilterObject(isFindItem);
+        // @ts-ignore
+        setMyFilterValue(isFindItem.value);
+      } else if (data.length > 0) {
+        setFilterObject(data[0]);
+        // @ts-ignore
+        setMyFilterValue(data[0]?.value);
       }
-      const resultList = data.filter((item: any) => item[valueAlias] === value);
-      if (resultList.length > 0) {
-        return resultList[0];
-      }
-      return data[0];
-    };
-
-    // 重写onFilterChange,修复搜索栏左侧数据选择新值后展示数据未修改的问题。
-    const myOnFilterChange = (e: any) => {
-      const object: any = { ...filterObject };
-      if (e[valueAlias]) {
-        object[valueAlias] = e[valueAlias];
-        object[labelAlias] = e[labelAlias];
-        setMyFilterValue(e[valueAlias]);
-      }
-      if (e.startDate) {
-        object.startDate = e.startDate;
-        object.endDate = e.endDate;
+      setFilterData(data);
+      if (onChange) {
+        // @ts-ignore
+        onChange({
+          inputValue: typeof value === 'object' ? value?.inputValue : value,
+          filterObject,
+        });
       }
-      setFilterObject({ ...object });
-      if (onFilterChange) {
-        onFilterChange(object);
+      // setData(initData(params.dataSource, params.labelKey, params.valueKey, params.childrenKey));
+    },
+    clearValue: () => {
+      if (onChange) {
+        onChange({ inputValue: '', filterValue });
       }
-    };
-
-    useEffect(() => {
-      if (minStartDate) {
-        if (minStartDate.includes('new Date')) {
-          setMinDate(new Date());
-        } else {
-          setMinDate(new Date(minStartDate));
+    },
+    setValue(value: Object | string) {
+      if (typeof value === 'object') {
+        if (onChange) {
+          onChange(value);
         }
+      } else {
+        myOnChange(value);
       }
-    }, [minStartDate]);
-    useEffect(() => {
-      const object = filterItemWithValue(
-        filterData,
+    },
+    get value() {
+      // @ts-ignore
+      return {
+        inputValue: typeof value === 'object' ? value?.inputValue : value,
         filterObject,
-        labelAlias,
-        valueAlias,
-      );
-      setFilterObject({ ...object });
-      setMyFilterValue(filterValue);
-    }, [filterValue]);
+      };
+    },
+  }));
 
-    if (!visible) {
-      return <></>;
+  // 获取默认
+  const filterItemWithValue = (data: any[] = [], value = '', labelAlias: string, valueAlias: string) => {
+    if (data.length === 0) {
+      return {
+        [labelAlias]: '',
+        [valueAlias]: '',
+      };
     }
-    return (
-      <div
-        id={$$componentItem.id}
-        className={classNames(prefixWrap, className)}
-      >
-        <SearchView
-          {...restProps}
-          // @ts-ignore
-          value={typeof value === 'object' ? value?.inputValue : value}
-          filterData={myFilterData}
-          type={searchViewType}
-          filterValue={myFilterValue}
-          PopViewPanel={children}
-          onFilterChange={myOnFilterChange}
-          onChange={myOnChange}
-          style={{ ...restStyle }}
-          inputStyle={inputStyle}
-          labelAlias={labelAlias}
-          valueAlias={valueAlias}
-          cancelText={getLocale('cancelText')}
-          // @ts-ignore
-          autoComplete="off"
-        />
-        {showDateRange && (
-          <div
-            className={`${prefixWrap}-date-range`}
-            onClick={() => setShowCalendar(true)}
-          >
-            <div className="range-content">
-              <span className="date">
-                {startDate === '开始时间'
-                  ? getLocale('DformRangePicker.selectStart', '开始时间')
-                  : startDate}
-              </span>
-              <span className="date-space">——</span>
-              <span className="date">
-                {endDate === '结束时间'
-                  ? getLocale('DformRangePicker.selectEnd', '结束时间')
-                  : endDate}
-              </span>
-            </div>
+    const resultList = data.filter((item: any) => item[valueAlias] === value);
+    if (resultList.length > 0) {
+      return resultList[0];
+    }
+    return data[0];
+  };
+
+  // 重写onFilterChange,修复搜索栏左侧数据选择新值后展示数据未修改的问题。
+  const myOnFilterChange = (e: any) => {
+    const object: any = { ...filterObject };
+    if (e[valueAlias]) {
+      object[valueAlias] = e[valueAlias];
+      object[labelAlias] = e[labelAlias];
+      setMyFilterValue(e[valueAlias]);
+    }
+    if (e.startDate) {
+      object.startDate = e.startDate;
+      object.endDate = e.endDate;
+    }
+    setFilterObject({ ...object });
+    if (onFilterChange) {
+      onFilterChange(object);
+    }
+  };
+
+  useEffect(() => {
+    if (minStartDate) {
+      if (minStartDate.includes('new Date')) {
+        setMinDate(new Date());
+      } else {
+        setMinDate(new Date(minStartDate));
+      }
+    }
+  }, [minStartDate]);
+  useEffect(() => {
+    const object = filterItemWithValue(filterData, filterObject, labelAlias, valueAlias);
+    setFilterObject({ ...object });
+    setMyFilterValue(filterValue);
+  }, [filterValue]);
+
+  if (!visible) {
+    return <></>;
+  }
+  return (
+    <div id={$$componentItem.id} className={classNames(prefixWrap, className)}>
+      <SearchView
+        {...restProps}
+        // @ts-ignore
+        value={typeof value === 'object' ? value?.inputValue : value}
+        filterData={myFilterData}
+        type={searchViewType}
+        filterValue={myFilterValue}
+        PopViewPanel={children}
+        onFilterChange={myOnFilterChange}
+        onChange={myOnChange}
+        style={{ ...restStyle }}
+        inputStyle={inputStyle}
+        labelAlias={labelAlias}
+        valueAlias={valueAlias}
+        cancelText={getLocale('cancelText')}
+        // @ts-ignore
+        autoComplete="off"
+      />
+      {showDateRange && (
+        <div className={`${prefixWrap}-date-range`} onClick={() => setShowCalendar(true)}>
+          <div className="range-content">
+            <span className="date">{startDate === '开始时间' ? getLocale('DformRangePicker.selectStart', '开始时间') : startDate}</span>
+            <span className="date-space">——</span>
+            <span className="date">{endDate === '结束时间' ? getLocale('DformRangePicker.selectEnd', '结束时间') : endDate}</span>
           </div>
-        )}
-        <Calendar
-          show={showCalendar}
-          type="range"
-          allowSameDay
-          minDate={minDate}
-          maxDate={new Date()}
-          onClose={() => {
-            setShowCalendar(false);
-          }}
-          onConfirm={(e: any) => {
-            setShowCalendar(false);
-            if (Array.isArray(e) && e.length > 1) {
-              const start = moment(e[0]).format('yyyy/MM/DD');
-              const end = moment(e[1]).format('yyyy/MM/DD');
-              setStartDate(start);
-              setEndDate(end);
-              myOnFilterChange({ startDate: start, endDate: end });
-            }
-          }}
-          title={getLocale('SearchView.title')}
-          confirmText={getLocale('confirm')}
-          confirmDisabledText={getLocale('confirm')}
-          getLocale={(t, tempValue) => {
-            return getCalendarLocale(getLocale, t, tempValue);
-          }}
-        />
-      </div>
-    );
-  },
-);
+        </div>
+      )}
+      <Calendar
+        show={showCalendar}
+        type="range"
+        allowSameDay
+        minDate={minDate}
+        maxDate={new Date()}
+        onClose={() => {
+          setShowCalendar(false);
+        }}
+        onConfirm={(e: any) => {
+          setShowCalendar(false);
+          if (Array.isArray(e) && e.length > 1) {
+            const start = moment(e[0]).format('yyyy/MM/DD');
+            const end = moment(e[1]).format('yyyy/MM/DD');
+            setStartDate(start);
+            setEndDate(end);
+            myOnFilterChange({ startDate: start, endDate: end });
+          }
+        }}
+        title={getLocale('SearchView.title')}
+        confirmText={getLocale('confirm')}
+        confirmDisabledText={getLocale('confirm')}
+        getLocale={(t, tempValue) => {
+          return getCalendarLocale(getLocale, t, tempValue);
+        }}
+      />
+    </div>
+  );
+});
 
 export default MySearchView;

package/lib/h5public/src/components/factory/src/Selector/LxSelector.tsx

@@ -84,22 +84,10 @@ const LxSelector = LingxiForwardRef<any, SelectorProps>((props, ref) => {
         return targetValue;
       }
     },
-    setSelectorOptions: (params: {
-      dataSource: any[];
-      labelKey?: string;
-      valueKey?: string;
-      descriptionKey?: string;
-      disabledKey?: string;
-    }) => {
-      const {
-        labelKey = '',
-        valueKey = '',
-        descriptionKey,
-        disabledKey,
-        dataSource,
-      } = params;
+    setSelectorOptions: (params: { dataSource: any[]; labelKey?: string; valueKey?: string; descriptionKey?: string; disabledKey?: string }) => {
+      const { labelKey = '', valueKey = '', descriptionKey, disabledKey, dataSource } = params;
       if (dataSource && Array.isArray(dataSource)) {
-        const temDataSoure = (dataSource || [])?.map((item) => {
+        const temDataSoure = (dataSource || [])?.map(item => {
           if (labelKey && valueKey) {
             if (item[labelKey]) {
               return {
@@ -134,8 +122,7 @@ const LxSelector = LingxiForwardRef<any, SelectorProps>((props, ref) => {
 
   const { getAppFileUrlByFileCode } = getEngineApis();
 
-  const { isForm, form, disabled, onInputChange, visible, getRules } =
-    useFormItem(ref, props as any, imperativeHandle);
+  const { isForm, form, disabled, onInputChange, visible, getRules } = useFormItem(ref, props as any, imperativeHandle);
   const myColumns: any = () => {
     switch (columns) {
       case 'customize':
@@ -156,7 +143,7 @@ const LxSelector = LingxiForwardRef<any, SelectorProps>((props, ref) => {
       ...props,
       src: imgSrc,
     },
-    viewRef,
+    viewRef
   );
   useEffect(() => {
     if (options && Array.isArray(options)) {
@@ -169,17 +156,7 @@ const LxSelector = LingxiForwardRef<any, SelectorProps>((props, ref) => {
     }
   }, [backgroundType, src, fileCode]);
   const myStyle = () => {
-    const {
-      defaultBg,
-      defaultColor,
-      defaultBorder,
-      checkedBColor,
-      checkedColor,
-      checkedBorder,
-      itemBorderRadius,
-      itemGap,
-      ...restProps
-    } = style;
+    const { defaultBg, defaultColor, defaultBorder, checkedBColor, checkedColor, checkedBorder, itemBorderRadius, itemGap, ...restProps } = style;
     let itemBorder = null;
     let cBorder = null;
     if (defaultBorder && defaultBorder.includes('border ')) {
@@ -268,7 +245,7 @@ const LxSelector = LingxiForwardRef<any, SelectorProps>((props, ref) => {
           columns={myColumns()}
           disabled={disabled}
           value={curValue}
-          onChange={(value) => {
+          onChange={value => {
             let _curValue = value;
             if (max && value.length > max) {
               // 超过最大值则取后面选的

package/lib/h5public/src/components/factory/src/Selector/index.tsx

@@ -39,12 +39,7 @@ const MySelector = LingxiForwardRef<any, SelectorProps>((props, ref) => {
   }
   return (
     <FormItem>
-      <Field
-        required={false}
-        title={name}
-        name={fieldProps}
-        params={{ formFlag: true, hidden: true }}
-      >
+      <Field required={false} title={name} name={fieldProps} params={{ formFlag: true, hidden: true }}>
         <LxSelector {...props} ref={ref} />
       </Field>
     </FormItem>

package/lib/h5public/src/components/factory/src/SideBar/TabPage.tsx

@@ -12,16 +12,8 @@ interface TabPageProps {
   reloadPageKey?: string;
 }
 
-const TabPage: React.FC<TabPageProps> = (props) => {
-  const {
-    getEngineApis,
-    $$componentItem,
-    activeKey,
-    lcdpParentRenderId,
-    item,
-    index,
-    reloadPageKey,
-  } = props;
+const TabPage: React.FC<TabPageProps> = props => {
+  const { getEngineApis, $$componentItem, activeKey, lcdpParentRenderId, item, index, reloadPageKey } = props;
   const { PageView } = getEngineApis();
   const [load, setLoad] = useState(false);
 

package/lib/h5public/src/components/factory/src/SideBar/index.tsx

@@ -8,16 +8,7 @@ import TabPage from './TabPage';
 
 const prefixCls = 'appSideBar';
 const MySideBar = LingxiForwardRef<any, SideBarProps>((props, ref) => {
-  const {
-    className,
-    tabs,
-    style,
-    getEngineApis,
-    $$componentItem,
-    lcdpParentRenderId,
-    defaultSideBarActiviteKey,
-    onChange,
-  } = props;
+  const { className, tabs, style, getEngineApis, $$componentItem, lcdpParentRenderId, defaultSideBarActiviteKey, onChange } = props;
   const {
     tabBarWidth,
     tabBarHeight,
@@ -36,13 +27,10 @@ const MySideBar = LingxiForwardRef<any, SideBarProps>((props, ref) => {
 
   const customTitle = useCallback(
     (item: { key: string | number; title: string }) => {
-      const textColor =
-        item.key === activeKey
-          ? tabBarActiveTextColor
-          : tabBarInactiveTextColor;
+      const textColor = item.key === activeKey ? tabBarActiveTextColor : tabBarInactiveTextColor;
       return <div style={{ color: textColor }}>{item?.title || item.key}</div>;
     },
-    [tabBarActiveTextColor, tabBarInactiveTextColor, activeKey],
+    [tabBarActiveTextColor, tabBarInactiveTextColor, activeKey]
   );
 
   const onSideBarChange = (key: string) => {
@@ -84,12 +72,9 @@ const MySideBar = LingxiForwardRef<any, SideBarProps>((props, ref) => {
         <div
           className="my-side-container"
           style={px2rem({
-            '--my-side-bar-pointer-color':
-              tabPointerColor || 'var(--adm-color-primary)',
-            '--my-side-bar-active-bg-color':
-              tabBarActiveBackgroundColor || 'var(--adm-color-background)',
-            '--my-side-bar-font-size':
-              `${tabBarTextFont}px` || 'var(--adm-font-size-main)',
+            '--my-side-bar-pointer-color': tabPointerColor || 'var(--adm-color-primary)',
+            '--my-side-bar-active-bg-color': tabBarActiveBackgroundColor || 'var(--adm-color-background)',
+            '--my-side-bar-font-size': `${tabBarTextFont}px` || 'var(--adm-font-size-main)',
           })}
         >
           <div className="side">
@@ -115,12 +100,7 @@ const MySideBar = LingxiForwardRef<any, SideBarProps>((props, ref) => {
           </div>
           <div className="main">
             {tabs.map((item: SideBarTabsProps, index: number) => (
-              <div
-                className={classNames(
-                  'content',
-                  activeKey === item.key && 'active',
-                )}
-              >
+              <div className={classNames('content', activeKey === item.key && 'active')}>
                 <TabPage
                   getEngineApis={getEngineApis}
                   $$componentItem={$$componentItem}
@@ -135,13 +115,7 @@ const MySideBar = LingxiForwardRef<any, SideBarProps>((props, ref) => {
           </div>
         </div>
       ) : (
-        <div className="my-side-bar-body">
-          {Array.isArray(tabs) ? (
-            <span>组件未配置页面</span>
-          ) : (
-            <span>组件面板设置数据格式错误</span>
-          )}
-        </div>
+        <div className="my-side-bar-body">{Array.isArray(tabs) ? <span>组件未配置页面</span> : <span>组件面板设置数据格式错误</span>}</div>
       )}
     </div>
   );