@bit-sun/business-component 2.2.49 → 2.3.1

package/dist/utils/index.d.ts

@@ -1,3 +1,4 @@
 import './requestUtils';
 import './checkUtils';
 import './LocalstorageUtils';
+import './utils';

package/dist/utils/utils.d.ts

@@ -14,3 +14,10 @@ export declare const handleBssulaColumnsSpecialParams: (col: any) => void;
 export declare const handleAntdColumnsSpecialParams: (col: any) => void;
 export declare const getDictionarySource: (dicCode: string, needConvertInterger?: boolean) => any;
 export declare function uuid(): string;
+export declare const judgeIsEmpty: (value: any) => boolean;
+/**
+ * 处理错误请求
+ * @param {*} response         返回结果
+ * @param {*} needBackError    是否需要将错误回传到页面单独处理
+ */
+export declare function handleError(response: object, needBackError?: boolean): boolean;

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@bit-sun/business-component",
-  "version": "2.2.49",
+  "version": "2.3.1",
   "scripts": {
     "start": "dumi dev",
     "docs:build": "dumi build",
@@ -46,6 +46,7 @@
     "axios": "^0.24.0",
     "classnames": "^2.3.1",
     "lodash": "^4.17.21",
+    "moment": "^2.25.3",
     "querystring": "^0.2.1",
     "react": "^16.12.0",
     "react-beautiful-dnd": "10.0.0",

package/src/common/ENUM.ts

@@ -0,0 +1,41 @@
+const ENUM = {
+  /**
+   * 事件动作类型枚举
+   */
+  VALUE_TYPE: {
+    STATUS: 1, // 流转状态
+    TAG: 2, // 添加标签
+    TIMING: 3, // 定时器
+    EDIT_FIELD: 4, // 字段变更
+  },
+  /**
+   * 执行动作枚举
+   */
+  EXCUSE_ACTION: {
+    SEND_MESSAGE: 1, // 发送消息
+    PUSH_TODO_TASK: 2, // 推送任务
+  },
+  EXCUSE_ACTION_TEXT: {
+    SEND_MESSAGE: '发送一条消息',
+    PUSH_TODO_TASK: '推送一条待办任务',
+  },
+  /**
+   * 消息接收人分组类型枚举
+   */
+  RECEIVER_GROUP_TYPE: {
+    EMPLOYEES: 1, // 指定员工
+    ORGANIZATION: 2, // 指定组织
+    ROLE: 3, // 指定角色
+    PERSON_IN_DOCUMENT: 4, // 单据内人员
+    SEND_ALL: 5, // 所有人
+  },
+  /**
+   * 消息发送类型枚举
+   */
+  MESSAGE_SENDTIME_TYPE: {
+    IMMEDIATELY_SEND: 1, // 立即发送
+    REGULARLY_SEND: 2, // 定时发送
+  },
+};
+
+export default ENUM;

package/src/components/Business/JsonQueryTable/components/FieldsSettingsTable.tsx

@@ -12,6 +12,7 @@ export default (props:any)=>{
     codeProps='', 
     moduleType, 
     moduleRelationId, 
+    tableFlag = false
   } = props;
   
   const ref = useRef(null);
@@ -108,6 +109,9 @@ export default (props:any)=>{
         key: 'codeSnippet',
         title: '代码片段',
         render: ({text,record}:any) => {
+          if(tableFlag){
+            return <div> 列表：{`{"key": "extensionFields,${record.code}","dataIndex": "extensionFields,${record.code}","title": "${record.name}"},`}</div>
+          }
           if (!codeProps.columns) {
             return <div>表单：{`{"name": "extensionFields,${record.code}","label": "${record.name}"},`}</div>
           }

package/src/components/Business/JsonQueryTable/index.tsx

@@ -1,6 +1,6 @@
 // @ts-nocheck
-import React, { useState, useRef, useEffect } from 'react';
-import { message, Button, Table } from 'antd';
+import React, { useState, useRef, useEffect, Fragment } from 'react';
+import { message, Button, Table, Tabs } from 'antd';
 import Drawer from './drawer';
 import ConfigButton from './configButton';
 import Editor from './jsonEditor';
@@ -76,13 +76,28 @@ function convertFileds (fields, falltValue, faltFieldRange, containerName) {
       field.fields.forEach(item => {
         const targetValue = convertFileds(item, falltValue, faltFieldRange, field?.container?.name);
         if(targetValue){
+          if(item.dependency) {
+            targetValue.dependency = {
+              visible: {
+                ...item.dependency.visible,
+                type: (new Function('axios','ctx', item.dependency.visible.type)).bind(null, axios)
+              }
+            }
+          }
           filedsValue.push(targetValue)
         }
       })
     } else  {
       const returnField = field.isStaticCode ? falltValue[containerName ? (containerName + field.name) : field.name] : faltFieldRange[field.name];
       if (returnField) {
-        returnField.label = field?.label;
+        returnField.label = field?.label; 
+        if(field?.disabled){ // 字段设置只读属性
+          returnField.field.props.disabled = true;
+        }
+        if(field?.invisible){ // 字段设置不可见属性
+          returnField.initialVisible = false;
+        }
+        
         if(Array.isArray(returnField.name)&&returnField.name?.includes("extensionFields")){
           returnField.notShowLabel = true;
         }
@@ -120,16 +135,45 @@ function faltCustomerFieldRange(fileds) {
   return columnsValue;
 }
 
-function hanleCallbackValue(codeProps, value, customerFields) {
-  const faltFieldRange = faltCustomerFieldRange(customerFields)
-  const falltValue = flatFileds({fields: codeProps.fields})
+//form存在新加container属性分组得情况 组合操作
+function combineContainer(originFields, currentFields){
+  let newCurrentFields = [...originFields];
+  currentFields.map((item: any) => {
+    if(!originFields.find((i: any) => i?.container?.props?.name == item?.container?.name)){
+      newCurrentFields = [...newCurrentFields, {
+        container: {
+          type: 'card',
+          props: {
+            title: item?.container?.title,
+            level: 1,
+            id: Math.random(),
+            isWhiteCard: true,
+            bordered: false,
+            name: item?.container?.name,
+          },
+        },
+        fields: item?.fields || []
+      }];
+    }
+  })
+  return newCurrentFields;
+}
+
+function hanleCallbackValue(codeProps, value, customerFields, cacheColumns = []) {
+  const faltFieldRange = faltCustomerFieldRange(customerFields);
+  // const falltValue = flatFileds({fields: codeProps.fields})
+  const falltValue = flatFileds({fields: combineContainer(codeProps.fields, value?.fields)})
   let newCodeProps = {...codeProps};
   newCodeProps.fields = convertFileds({fields: value.fields}, falltValue, faltFieldRange).fields;
   if (codeProps.columns) {
     const faltColumnsValue = faltColumns(codeProps.columns)
     newCodeProps.columns = value.columns.map(item => {
       if (item.isStaticCode) {
-        return faltColumnsValue[item.key]
+        const cacheFieldProperty = cacheColumns.find(k => (k.key||k.dataIndex) == (item.key||item.dataIndex));
+        return {
+          ...faltColumnsValue[item.key],
+          ...cacheFieldProperty
+        }
       } else {
         //自定义字段-列字段
         if(item?.key&&item?.key.includes('extensionFields')&&item?.key.includes(',')){
@@ -137,10 +181,19 @@ function hanleCallbackValue(codeProps, value, customerFields) {
             ...item,
             render: ({ record }: any) => {
               try{
-                const lastName1= item?.key.split(',')[1]; //兼容没有fieldName的情况
-                const lastName2 = `${lastName1}Name`;
-                const target = record?.extensionFields || {};
-                return target[lastName2] || target[lastName1] ||  '';
+                const { extensionFields = {} } = record;
+                const fieldName1= item?.key.split(',')[1]; //兼容没有fieldName的情况
+                const fieldName2 = `${fieldName1}Name`;
+                if(customerFields.length){
+                  const targetField = customerFields.find(k => k.name.includes(fieldName1));
+                  if(targetField){
+                    const { initialSource = [] } = targetField
+                    if(initialSource.length){
+                      return initialSource.find((d => d.value == extensionFields[fieldName1]))?.text || extensionFields[fieldName1];
+                    }
+                  }
+                }
+                return extensionFields[fieldName2] || extensionFields[fieldName1] ||  '';
               }catch(e){
                 console.log('e',e);
               }
@@ -205,11 +258,13 @@ const tableStyleList = [
 ];
 const JsonQueryTable = React.memo(props => {
   const {
-    callBack,
-    codeProps,
-    customerFields,
-    initialSetting,
-    pageType
+    callBack, // 主保存函数回调
+    codeProps, // 整体的配置数据
+    customerFields, //可选的配置字段
+    initialSetting, //上一次添加自定义字段后保存的数据
+    pageType, //页面权限code
+    detailTablesSetting = [], //详情明细表格列配置数据
+    saveTableCallBack, //详情明细保存函数回调
   } = props;
 
   let codeFilter = {};
@@ -229,7 +284,6 @@ const JsonQueryTable = React.memo(props => {
   }  else {
     codeFilter.fields = iterFileds({fields: codeProps.fields}).fields
   }
-  console.log('codeFilter',codeFilter)
 
   const styleRef = useRef(null);
 
@@ -238,6 +292,9 @@ const JsonQueryTable = React.memo(props => {
   const [init, setInit] = useState(true);
   const [jsonEditorVal, setJsonEditorVal] = useState(initialSetting || codeFilter);
   const [moduleParams, setModuleParams] = useState({});
+  const [activeKey, setActiveKey] = useState('main'); //默认详情页配置
+  const [tablesConfigParams, setTablesConfigParams] = useState({});
+  const [tableJsonEditorValsArr, setTableJsonEditorValsArr] = useState([]);
 
   useEffect(()=>{
     Promise.all([
@@ -258,6 +315,69 @@ const JsonQueryTable = React.memo(props => {
     })
   },[]);
 
+  useEffect(()=>{
+    //明细表的配置数据
+    const axiosArr = detailTablesSetting.map((item:any) => axios.get(`/basic/flow/businessFieldGroup/one?moduleType=2&layoutPoint=${item.tableCode}`));
+    Promise.all(axiosArr).then(([...resArr])=> {
+      let configParams = {};
+      detailTablesSetting.map((item:any, index:number)=>{
+        const { code, data } = resArr[index]?.data || {};
+        if(data){
+          const { businessType, code:fieldGroup, moduleType } = data;
+          configParams [item.tableCode] = {
+            businessType,
+            fieldGroup,
+            moduleType,
+            tableFlag: true
+          }
+        }
+      })
+      setTablesConfigParams({
+        ...configParams,
+      });
+    })
+
+    const detailTableCodeFilter = detailTablesSetting.map(item => {
+      if(item?.initialSetting && item?.initialSetting.length){
+        return {
+          ...item,
+          columns: item?.initialSetting
+        }
+      }
+      return {
+        ...item,
+        columns: item?.columns.map(childItem => ({
+          key: childItem.key || childItem.dataIndex,
+          dataIndex: childItem.dataIndex || childItem.key,
+          isStaticCode: true,
+          title: childItem.title
+        }))
+      }
+    });
+    setTableJsonEditorValsArr([...detailTableCodeFilter]);
+    const lastRes = detailTableCodeFilter.map(item => {
+      if(item?.initialSetting && item?.initialSetting.length){
+        const codeProps = {
+          fields: [],
+          columns: item?.columns,
+        };
+        const newValue = {
+          fields: [],
+          columns: item.initialSetting
+        };
+        const result = hanleCallbackValue(codeProps, newValue, item?.customerFields, item?.cacheColumns);
+        return {
+          ...item,
+          columns: result?.columns
+        }
+      }
+      return item;
+    });
+    if(lastRes.length){
+      saveTableCallBack(lastRes, false);
+    }
+  },[detailTablesSetting.length]);
+  
   const onClickRun = (value, isSave) => {
     setJsonEditorVal(value);
 
@@ -269,6 +389,38 @@ const JsonQueryTable = React.memo(props => {
     }
   };
 
+  //明细表保存
+  const onClickRunDetailTables = (value, isSave, tableCode, tableSouce) =>{
+    const targetCode = tableCode || activeKey;
+    const targetTableSource = tableSouce || tableJsonEditorValsArr;
+    const newArr = targetTableSource.map(item => {
+      if(item.tableCode == targetCode){
+        return {
+          ...item,
+          columns: value
+        }
+      }
+      return item
+    });
+    setTableJsonEditorValsArr([...newArr]);
+
+    try {
+      const target = targetTableSource.find(item=>item.tableCode == targetCode);
+      const codeProps = {
+        fields: [],
+        columns: target?.columns,
+      };
+      const newValue = {
+        fields: [],
+        columns: value
+      };
+      const result = hanleCallbackValue(codeProps, newValue, target?.customerFields, target?.cacheColumns);
+      saveTableCallBack({ columns: result.columns, tableCode: targetCode }, isSave, value);
+    } catch (e) {
+      message.error(e);
+    }
+  }
+  
   React.useEffect(() => {
     localStorage.setItem('jsonEditorVal',JSON.stringify(jsonEditorVal||{}))
   }, [jsonEditorVal]);
@@ -291,25 +443,88 @@ const JsonQueryTable = React.memo(props => {
 
   return (
     <div>
-      <Drawer visible={visible} width={800} onClose={() => setVisible(false)} className={'customFieldsDrawer'}>
-        <div ref={styleRef}>
-
-        </div>
-        {
-          isEmpty(moduleParams)?(
-            <div style={{padding:"10px 0", fontSize:"16px", fontWeight:"bolder"}}>
-              提示：业务对象未维护，请在通用单据对应业务类型下维护业务对象
+      <Drawer visible={visible} width={1400} onClose={() => setVisible(false)} className={'customFieldsDrawer'}>
+      {
+          detailTablesSetting.length == 0 &&(
+            <div style={{display: 'flex'}}>
+              <div style={{flex: 1, width: 500}}>
+                {
+                  isEmpty(moduleParams)?(
+                    <div style={{padding:"10px 0", fontSize:"16px", fontWeight:"bolder"}}>
+                      提示：业务对象未维护，请在通用单据对应业务类型下维护业务对象
+                    </div>
+                  ):(
+                    <FieldsSettingsTable {...tableParams}/>
+                  )
+                }
+              </div>
+              <div style={{flex: 1}}>
+                <Editor
+                  type="table"
+                  onRun={onClickRun}
+                  value={jsonEditorVal}
+                  shallowHeight={height}
+                />
+              </div>
             </div>
-          ):(
-            <FieldsSettingsTable {...tableParams}/>
           )
         }
-        <Editor
-          type="table"
-          onRun={onClickRun}
-          value={jsonEditorVal}
-          shallowHeight={height}
-        />
+        {
+          detailTablesSetting.length > 0 && (
+            <Tabs defaultActiveKey={activeKey} onChange={(v: any) => setActiveKey(v)}>
+              <Tabs.TabPane tab="详情页配置" key="main">
+              <div style={{display: 'flex'}}>
+                <div style={{flex: 1, width: 500}}>
+                  {
+                    isEmpty(moduleParams)?(
+                      <div style={{padding:"10px 0", fontSize:"16px", fontWeight:"bolder"}}>
+                        提示：业务对象未维护，请在通用单据对应业务类型下维护业务对象
+                      </div>
+                    ):(
+                      <FieldsSettingsTable {...tableParams}/>
+                    )
+                  }
+                </div>
+                <div style={{flex: 1}}>
+                  <Editor
+                    type="table"
+                    onRun={onClickRun}
+                    value={jsonEditorVal}
+                    shallowHeight={height}
+                  />
+                </div>
+              </div>
+              </Tabs.TabPane>
+              {
+                tableJsonEditorValsArr.map((k:any)=>(
+                  <Tabs.TabPane tab={k.title} key={k.tableCode}>
+                    <div style={{display: 'flex'}}>
+                      <div style={{flex: 1, width: 500}}>
+                        {
+                          !tablesConfigParams[k.tableCode]?(
+                            <div style={{padding:"10px 0", fontSize:"16px", fontWeight:"bolder"}}>
+                              提示：业务对象未维护，请在通用单据对应业务类型下维护业务对象
+                            </div>
+                          ):(
+                            <FieldsSettingsTable {...tablesConfigParams[k.tableCode]}/>
+                          )
+                        }
+                      </div>
+                      <div style={{flex: 1}}>
+                        <Editor
+                          type="table"
+                          onRun={onClickRunDetailTables}
+                          value={k.columns}
+                          shallowHeight={height}
+                        />
+                      </div>
+                    </div>
+                  </Tabs.TabPane>
+                ))
+              }
+            </Tabs>
+          )
+        }
       </Drawer>
 
       {!visible && isAdmin() && <ConfigButton type='primary' onClick={() => setVisible(true)}>setting</ConfigButton>}

package/src/components/Functional/BsAntdSula/BsCascader/index.md

@@ -0,0 +1,62 @@
+---
+nav:
+  title: '组件'
+  order: 1
+group:
+  path: /components/functional
+  title: 功能组件
+  order: 0
+title: 级联选择
+order: 7
+---
+
+## BsCascader
+
+Demo:
+
+```tsx
+import React, { useState } from 'react';
+import { BsCascader } from '../../../../index';
+import { request } from 'bssula';
+
+export default () => {
+  const [value, setValue] = useState()
+  
+  return (
+    <div>
+      <BsCascader
+        isAll={true}
+        needNameAndCode={true}
+        notChangeOnSelect={true}
+        initRequestSource={async () => {
+          return await request({
+            url: '/basic/bscArea/getBscAreaList?qp-level-eq=1&qp-pid-eq=100000',
+            method: 'get',
+            converter: ({ data }) => {
+              const handleData =
+                data && data[0]
+                  ? data?.map((item) => {
+                    return {
+                      text: item.name,
+                      value: item.id,
+                      level: item.level,
+                      id: item.id,
+                    };
+                  })
+                  : [];
+              return handleData;
+            },
+          });
+        }}
+        value={value}
+        onChange={(value) => {
+          setValue(value);
+        }}
+        getPopupContainer={() => document.body}
+      />
+    </div>
+  );
+};
+```
+
+More skills for writing demo: https://d.umijs.org/guide/demo-principle

package/src/components/Functional/BsAntdSula/BsCascader/index.tsx

@@ -0,0 +1,178 @@
+// @ts-nocheck
+
+import React, { useEffect, useState } from 'react';
+import { Cascader, message } from 'antd';
+import type { CascaderProps as ACascaderProps } from 'antd/lib/cascader';
+import { request } from 'bssula';
+
+export type CascaderSourceItem = {
+  text: any;
+  value: any;
+};
+
+export interface CascaderSource {
+  text: any;
+  value: any;
+  children: CascaderSourceItem[];
+}
+
+export interface CascaderProps extends ACascaderProps {
+  source: CascaderSource[];
+}
+
+const BsCascader = ({
+  source,
+  onChange,
+  value,
+  disabled,
+  needNameAndCode,
+  onlyCode,
+  requiredLength,
+  isAll,
+  notChangeOnSelect,
+  isFirstOnly,
+  initRequestSource,
+  style,
+}: {
+  source: any;
+  onChange: Function;
+}) => {
+  if (!source && !initRequestSource) return null;
+
+  const [handSource, setHandSource] = useState(
+    source?.map((item) => ({ ...item, label: item.text, isLeaf: false })) || [],
+  );
+  useEffect(async () => {
+    if (!source && initRequestSource) {
+      const resData = await initRequestSource();
+      const data =
+        resData?.map((item) => ({
+          ...item,
+          label: item.text,
+          isLeaf: false,
+        })) || [];
+      setHandSource(data);
+    }
+  }, []);
+
+  useEffect(() => {
+    setHandSource(
+      source?.map((item) => ({ ...item, label: item.text, isLeaf: false })) ||
+        [],
+    );
+  }, [source]);
+
+  const [valueSource, setValueSource] = useState([]);
+  const [options, setOptions] = React.useState(handSource);
+  if (options && handSource && options.length != handSource.length) {
+    setOptions(handSource);
+  }
+
+  useEffect(() => {
+    if (value && onlyCode) {
+      if (value?.length) {
+        request({
+          url: `/basic/bscArea/getBscAreaList?qp-code-in=${value}`,
+          method: 'get',
+        }).then((res) => {
+          res = res.sort((a, b) => {
+            return a.level - b.level;
+          });
+          setValueSource(res);
+        });
+      } else {
+        setValueSource([]);
+      }
+    }
+  }, [value]);
+
+  const onChangeInner = (value: string, selectedOptions: any[]) => {
+    if (requiredLength && value.length !== requiredLength) return;
+    if (needNameAndCode) {
+      onChange({
+        PCDName: selectedOptions
+          ? selectedOptions.map((item) => item.text)
+          : [],
+        PCDCode: selectedOptions
+          ? selectedOptions.map((item) => item.value)
+          : [],
+      });
+    } else if (onlyCode) {
+      onChange(
+        selectedOptions ? selectedOptions.map((item) => item.value) : [],
+      );
+    } else {
+      onChange(selectedOptions ? selectedOptions.map((item) => item.text) : []);
+    }
+  };
+
+  const loadData = (selectedOptions) => {
+    const targetOption = selectedOptions[selectedOptions.length - 1];
+    targetOption.loading = true;
+    request({
+      url: `/basic/bscArea/getBscAreaList?qp-pid-eq=${targetOption.id}`,
+      method: 'get',
+      converter: ({ data }) => {
+        const initialVal = data
+          ? data.map((item) => {
+              return {
+                text: item.name,
+                value: item.id,
+                label: item.name,
+                level: item.level,
+                isLeaf: item.level > (isAll ? 2 : 1),
+                id: item.id,
+              };
+            })
+          : [];
+        return initialVal;
+      },
+    })
+      .then((res) => {
+        targetOption.loading = false;
+        if (res.length) {
+          targetOption.children = res;
+        } else {
+          targetOption.children = undefined;
+        }
+        setOptions([...options]);
+      })
+      .catch((err: any) => {
+        message.error('网络错误');
+      });
+  };
+
+  const filter = (inputValue, path) => {
+    return path.some(
+      (option) =>
+        option.label.toLowerCase().indexOf(inputValue.toLowerCase()) > -1,
+    );
+  };
+
+  let CascaderVal = value;
+  if (needNameAndCode) {
+    CascaderVal = value ? value.PCDName : value;
+  } else if (onlyCode) {
+    CascaderVal = valueSource?.map((item) => item.name)?.join() || [];
+  }
+
+  const showSearch = !!(options.length && options.length > 5);
+
+  if (disabled) return CascaderVal;
+
+  return (
+    <Cascader
+      key={1}
+      style={style}
+      disabled={disabled}
+      value={CascaderVal}
+      options={options}
+      loadData={loadData}
+      onChange={onChangeInner}
+      showSearch={showSearch ? filter : false}
+      changeOnSelect={!notChangeOnSelect}
+    />
+  );
+};
+
+export default BsCascader;