@bit-sun/business-component 2.2.0-alpha.4 → 2.2.0-alpha.6

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

@@ -8,11 +8,13 @@ import {
   authFn,
   queryParams,
 } from './utils';
-import { Menu, Tooltip, } from 'antd';
+import { Menu, Tooltip, Dropdown } from 'antd';
 import SortableTable from './setting';
+import SearchItemTable from "./SearchItemSetting";
 import { Resizable } from 'react-resizable';
 import quanping from '../../../assets/icon-quanping.svg';
 import scanning from '../../../assets/scanning.svg';
+import shezhi from '../../../assets/icon-shezhi.svg';
 import { debounce } from 'lodash';
 import ExportIcon from '@/components/Functional/ExportFunctions/ExportIcon';
 import ENUM from '@/utils/enumConfig';
@@ -52,8 +54,8 @@ export default (props: any) => {
   const [isFullScreen, setIsFnllScreen]: any = useState(false);
   // @ts-nocheck
   const [value, setValue]: any = useState(props);
-  const [showColumn, setShowColumns] = useState([]);
-
+  const [showColumn, setShowColumns] = useState([]); // 列字段
+  const [showSearchFields, setShowSearchFields] = useState(props.fields || []); //搜索项字段
   const { isPage = true, pagination, tableCode } = props;
 
   const [height, setHeight]: any = useState('100vh');
@@ -96,8 +98,8 @@ export default (props: any) => {
     return isFull;
   }
 
-  const getConfigFromlocalstorage = () => {
-    let config = localStorage.getItem(ENUM.BROWSER_CACHE.COLUMN_CONDITION) || '[]';
+  const getConfigFromlocalstorage = (type: string) => {
+    let config = localStorage.getItem(type) || '[]';
     let configArray = JSON.parse(config);
     let configSetting = configArray.filter(
       (item) => item.code === bsTableCode,
@@ -157,7 +159,7 @@ export default (props: any) => {
       columns: [...props.columns],
     });
     const { columns } = props;
-    let columnConfig = getConfigFromlocalstorage();
+    let columnConfig = getConfigFromlocalstorage(ENUM.BROWSER_CACHE.COLUMN_CONDITION);
     let showColumns = columnConfig.length ? columnConfig.map((item) => {
       let inner = columns.filter(
         (inneritem) => {
@@ -191,12 +193,35 @@ export default (props: any) => {
       });
     });
     setShowColumns([...showColumns]);
+
+  }
+
+  const setInitialSearchFieldsInfo = () =>{
+    //获取搜索字段的缓存配置
+    const { fields = [] } = props;
+    let searchFieldsConfig = getConfigFromlocalstorage(ENUM.BROWSER_CACHE.SEARCH_FIELDS_CONDITION);
+    let showSearchFields = searchFieldsConfig.length ? searchFieldsConfig.map((item) => {
+      let inner = fields.filter(
+        (inneritem) => {
+          let innerKey = Array.isArray(inneritem.name) ? JSON.stringify(inneritem.name) : inneritem.name;
+          let itemKey = Array.isArray(item.name) ? JSON.stringify(item.name) : item.name;
+          return innerKey && innerKey === itemKey;
+        }
+      )[0];
+
+      return {
+        ...inner,
+        ...item,
+      };
+    }) : fields;
+    setShowSearchFields([...showSearchFields])
   }
 
   //组件初始挂载
   useEffect(() => {
     getTableHeight();
     setInitialTableInfo();
+    setInitialSearchFieldsInfo();
     window.addEventListener('resize', (e) => {
       watchWinResize();
     });
@@ -212,6 +237,14 @@ export default (props: any) => {
     }
   }, [props?.columns])
 
+  useEffect(() => {
+    if (props?.fields && value?.fields) {
+      let newKeys = props.fields.map((d: any) => Array.isArray(d.name) ? JSON.stringify(d.name) : (d.name));
+      let oldKeys = value.fields.map((d: any) => Array.isArray(d.name) ? JSON.stringify(d.name) : (d.name));
+      JSON.stringify(newKeys) !== JSON.stringify(oldKeys) && setInitialSearchFieldsInfo();
+    }
+  },[props?.fields])
+
   useEffect(() => {
     setInitialTableInfo();
   }, [props?.refreshColumns]);
@@ -326,19 +359,34 @@ export default (props: any) => {
         type: 'text',
         props: {
           children: (
-            <>
-              <Tooltip title="列设置">
-                <span className="ant-dropdown-link">
-                  <SortableTable
-                    ref={sortTableRef}
-                    setShowColumns={setShowColumns}
-                    showColumn={showColumn}
-                    datasource={value?.columns || []}
-                    bsTableCode={bsTableCode}
-                  />
-                </span>
-              </Tooltip>
-            </>
+            <span className="ant-dropdown-link">
+                <Dropdown overlay={ 
+                  <Menu >
+                    <Menu.Item>
+                      <SortableTable
+                        ref={sortTableRef}
+                        setShowColumns={setShowColumns}
+                        showColumn={showColumn}
+                        datasource={value?.columns || []}
+                        bsTableCode={bsTableCode}
+                      />
+                    </Menu.Item>
+                    <Menu.Item>
+                      <SearchItemTable
+                        ref={sortTableRef}
+                        setShowSearchFields={setShowSearchFields}
+                        showSearchFields={showSearchFields}
+                        datasource={value?.fields || []}
+                        bsTableCode={bsTableCode}
+                      />
+                    </Menu.Item>
+                  </Menu> 
+                } placement="bottom" >
+                  <span className="ant-dropdown-link">
+                    <img width={32}  src={shezhi} />
+                  </span>
+                </Dropdown>
+              </span>
           ),
         },
       },
@@ -441,6 +489,7 @@ export default (props: any) => {
     ...handleTimeValue(),
     tableProps: setTableProps(),
     columns: [...showColumn],
+    fields: [...showSearchFields],
     ref: props.forwardedRef || refs,
     isFullScreen,
   };
@@ -465,7 +514,7 @@ export default (props: any) => {
       summary: props.summary,
       statusMapping: props.statusMapping,
     }),
-    [value, checkedList, showColumn, props.statusMapping],
+    [value, checkedList, showColumn, props.statusMapping, showSearchFields],
   );
   return <MemoQueryTable {...memoConfig} />;
 };

package/src/components/Business/BsSulaQueryTable/setting.tsx

@@ -793,7 +793,7 @@ class SortableTable extends React.Component {
             </div>
           </Modal>
         )}
-        <img width={32} onClick={this.showModal} src={shezhi} />
+        <div onClick={this.showModal} style={{fontSize:14}}>列设置</div>
       </div>
     );
   }

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);
@@ -95,7 +96,7 @@ export default (props:any)=>{
         width: 100
       },
       {
-        key: 'code',
+        key: 'isUse',
         title: '是否使用',
         width: 70,
         render: ({text}:any) => {
@@ -105,9 +106,12 @@ export default (props:any)=>{
         }
       },
       {
-        key: 'code',
+        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';
@@ -205,11 +205,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 +231,6 @@ const JsonQueryTable = React.memo(props => {
   }  else {
     codeFilter.fields = iterFileds({fields: codeProps.fields}).fields
   }
-  console.log('codeFilter',codeFilter)
 
   const styleRef = useRef(null);
 
@@ -238,6 +239,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 +262,52 @@ 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])=> {
+      detailTablesSetting.map((item:any, index:number)=>{
+        const { code, data } = resArr[index]?.data || {};
+        if(data){
+          const { businessType, code:fieldGroup, moduleType } = data;
+          setTablesConfigParams({
+            ...tablesConfigParams,
+            [item.tableCode]: {
+              businessType,
+              fieldGroup,
+              moduleType,
+              tableFlag: true
+            }
+          });
+        }
+      })
+    })
+
+    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]);
+    detailTableCodeFilter.map(item => {
+      if(item?.initialSetting && item?.initialSetting.length){
+        onClickRunDetailTables(item.initialSetting, false, item.tableCode, detailTableCodeFilter);
+      }
+    })
+  },[detailTablesSetting.length]);
+  
   const onClickRun = (value, isSave) => {
     setJsonEditorVal(value);
 
@@ -269,6 +319,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);
+      saveTableCallBack({ columns: result.columns, tableCode: targetCode }, isSave, value);
+    } catch (e) {
+      message.error(e);
+    }
+  }
+  
   React.useEffect(() => {
     localStorage.setItem('jsonEditorVal',JSON.stringify(jsonEditorVal||{}))
   }, [jsonEditorVal]);
@@ -292,24 +374,71 @@ const JsonQueryTable = React.memo(props => {
   return (
     <div>
       <Drawer visible={visible} width={800} onClose={() => setVisible(false)} className={'customFieldsDrawer'}>
-        <div ref={styleRef}>
-        
-        </div>
+      {
+          detailTablesSetting.length == 0 &&(
+            <Fragment>
+              {
+                isEmpty(moduleParams)?(
+                  <div style={{padding:"10px 0", fontSize:"16px", fontWeight:"bolder"}}>
+                    提示：业务对象未维护，请在通用单据对应业务类型下维护业务对象
+                  </div>
+                ):(
+                  <FieldsSettingsTable {...tableParams}/>
+                )
+              }
+              <Editor
+                type="table"
+                onRun={onClickRun}
+                value={jsonEditorVal}
+                shallowHeight={height}
+              />
+            </Fragment>
+          )
+        }
         {
-          isEmpty(moduleParams)?(
-            <div style={{padding:"10px 0", fontSize:"16px", fontWeight:"bolder"}}>
-              提示：业务对象未维护，请在通用单据对应业务类型下维护业务对象
-            </div>
-          ):(
-            <FieldsSettingsTable {...tableParams}/>
+          detailTablesSetting.length > 0 && (
+            <Tabs defaultActiveKey={activeKey} onChange={(v: any) => setActiveKey(v)}>
+              <Tabs.TabPane tab="详情页配置" key="main">
+                {
+                  isEmpty(moduleParams)?(
+                    <div style={{padding:"10px 0", fontSize:"16px", fontWeight:"bolder"}}>
+                      提示：业务对象未维护，请在通用单据对应业务类型下维护业务对象
+                    </div>
+                  ):(
+                    <FieldsSettingsTable {...tableParams}/>
+                  )
+                }
+                <Editor
+                  type="table"
+                  onRun={onClickRun}
+                  value={jsonEditorVal}
+                  shallowHeight={height}
+                />
+              </Tabs.TabPane>
+              {
+                tableJsonEditorValsArr.map((k:any)=>(
+                  <Tabs.TabPane tab={k.title} key={k.tableCode}>
+                    {
+                      !tablesConfigParams[k.tableCode]?(
+                        <div style={{padding:"10px 0", fontSize:"16px", fontWeight:"bolder"}}>
+                          提示：业务对象未维护，请在通用单据对应业务类型下维护业务对象
+                        </div>
+                      ):(
+                        <FieldsSettingsTable {...tablesConfigParams[k.tableCode]}/>
+                      )
+                    }
+                    <Editor
+                      type="table"
+                      onRun={onClickRunDetailTables}
+                      value={k.columns}
+                      shallowHeight={height}
+                    />
+                  </Tabs.TabPane>
+                ))
+              }
+            </Tabs>
           )
         }
-        <Editor
-          type="table"
-          onRun={onClickRun}
-          value={jsonEditorVal}
-          shallowHeight={height}
-        />
       </Drawer>
 
       {!visible && isAdmin() && <ConfigButton type='primary' onClick={() => setVisible(true)}>setting</ConfigButton>}

package/src/components/Functional/DataImport/index.tsx

@@ -145,7 +145,7 @@ class DataImport extends React.Component {
         };
       });
     }
-    luckysheet = window.luckysheet;
+    luckysheet = window.luckysheet || window.top.luckysheet;
     this.state = {
       showErrorData: false,
       data: [],

package/src/components/Functional/DataValidation/index.tsx

@@ -131,7 +131,7 @@ class DataValidation extends React.Component {
         }
       };
     });
-    luckysheet = window.luckysheet;
+    luckysheet = window.luckysheet || window.top.luckysheet;
     this.state = {
       showErrorData: false,
       data: [],

package/src/styles/bsDefault.less

@@ -29,6 +29,12 @@
 @primary-color-hover: #8bc7ff;
 @menu-bg: #222224;
 
+html,
+body {
+  height: 100%;
+  background: #f3f3f3 !important;
+  overflow: inherit !important;
+}
 
 .colorWeak {
   filter: invert(80%);

package/src/utils/LocalstorageUtils.ts

@@ -31,3 +31,28 @@ export const getConfigTableColumns = (tableCode: string) => {
   }
   return [];
 };
+
+// 登陆租户信息存储、获取、移除
+export const saveTenantList = (data: any) => {
+  const list = data?.length && data || [];
+  localStorage.setItem('tenant_list', JSON.stringify(list));
+}
+export const getTenantList = () => {
+  const list = JSON.parse(localStorage.getItem('tenant_list') || '[]');
+  return list
+}
+export const removeTenantList = () => {
+  localStorage.removeItem('tenant_list');
+}
+
+// 当前租户存储、获取、移除
+export const saveCurrentTenantId = (item: string) => {
+  localStorage.setItem('current_tenant_id', String(item));
+}
+export const getCurrentTenantId = () => {
+  return localStorage.getItem('current_tenant_id') || '';
+}
+export const removeCurrentTenantId = () => {
+  localStorage.removeItem('current_tenant_id');
+}
+

package/src/utils/enumConfig.ts

@@ -7,5 +7,6 @@ export default {
     USER_INFO: 'userInfo', //用户信息
     DICT_CODES: 'dicData', //数据字典数据
     CHILD_APP_BACK: 'child_app_back', //标记子应用goback事件
+    SEARCH_FIELDS_CONDITION: 'searchFieldsCondition', //表格搜索项信息缓存
   }
 }

package/src/utils/requestUtils.ts

@@ -1,5 +1,6 @@
 import axios from 'axios';
 import ENUM from './enumConfig';
+import { getCurrentTenantId } from './LocalstorageUtils';
 
 const resposne = JSON.parse(localStorage.getItem(ENUM.BROWSER_CACHE.USER_INFO) || '{}');
 
@@ -19,7 +20,7 @@ export function handleRequestAuthHeader(config?: any) {
 // 处理请求头
 const handleRequestHeader = (config: any) => {
   config.headers['sso-sessionid']  = resposne?.sessionId || ''
-  config.headers['x-tenant-id']  = resposne?.tenantId || '1'
+  config.headers['x-tenant-id']  =  getCurrentTenantId() || 1
   if (localStorage.getItem('x-user-auth-context')) {
     config.headers['x-user-auth-context'] = localStorage.getItem('x-user-auth-context');
   }