@bit-sun/business-component 4.0.12-alpha.3 → 4.0.12-alpha.30

package/src/components/Business/PropertyModal/mockData.ts

@@ -0,0 +1,160 @@
+export const MockPropertyList = [
+    {
+        propertyCode: 'year',
+        propertyName: '年份',
+        isCommonUse: true,
+        detailList: [
+            {
+                name: '2022',
+                value: '2022',
+                isCommonUse: true,
+            },
+            {
+                name: '2023',
+                value: '2023',
+                isCommonUse: true,
+            },
+            {
+                name: '2024',
+                value: '2024',
+                isCommonUse: true,
+            },
+        ]
+    },
+    {
+        propertyCode: 'season',
+        propertyName: '季节',
+        isCommonUse: true,
+        detailList: [
+            {
+                name: '春',
+                value: '1',
+                isCommonUse: true,
+            },
+            {
+                name: '夏',
+                value: '2',
+                isCommonUse: true,
+            },
+            {
+                name: '秋',
+                value: '3',
+                isCommonUse: true,
+            },
+            {
+                name: '冬',
+                value: '4',
+                isCommonUse: true,
+            },
+        ]
+    },
+    {
+        propertyCode: 'color',
+        propertyName: '色号',
+        isCommonUse: true,
+        detailList: [
+            {
+                name: '赤',
+                value: '1',
+                isCommonUse: true,
+            },
+            {
+                name: '橙',
+                value: '2',
+                isCommonUse: true,
+            },
+            {
+                name: '红',
+                value: '3',
+                isCommonUse: true,
+            },
+            {
+                name: '绿',
+                value: '4',
+                isCommonUse: true,
+            },
+            {
+                name: '青',
+                value: '5',
+                isCommonUse: true,
+            },
+            {
+                name: '蓝',
+                value: '6',
+                isCommonUse: true,
+            },
+            {
+                name: '紫',
+                value: '7',
+                isCommonUse: true,
+            },
+            {
+                name: '橘红',
+                value: '8',
+                isCommonUse: false,
+            },
+            {
+                name: '天蓝',
+                value: '9',
+                isCommonUse: false,
+            },
+            {
+                name: '银白',
+                value: '10',
+                isCommonUse: false,
+            },
+            {
+                name: '紫',
+                value: '11',
+                isCommonUse: false,
+            },
+        ]
+    },
+    {
+        propertyCode: 'brandCode',
+        propertyName: '品牌',
+        isCommonUse: false,
+        detailList: [
+            {
+                name: '品牌2',
+                value: '2',
+                isCommonUse: true,
+            },
+            {
+                name: '品牌3',
+                value: '3',
+                isCommonUse: true,
+            },
+            {
+                name: '品牌4',
+                value: '4',
+                isCommonUse: true,
+            },
+           
+        ]
+    },
+    {
+        propertyCode: 'size',
+        propertyName: '尺码',
+        isCommonUse: false,
+        detailList: [
+            {
+                name: 'M',
+                value: '2',
+                isCommonUse: true,
+            },
+            {
+                name: 'L',
+                value: '3',
+                isCommonUse: true,
+            },
+            {
+                name: 'XL',
+                value: '4',
+                isCommonUse: true,
+            },
+           
+        ]
+    },
+
+]

package/src/components/Business/PropertyModal/propertyGroup.tsx

@@ -0,0 +1,205 @@
+import React, { useEffect, useState } from "react";
+import { Checkbox } from 'antd';
+import { CaretUpOutlined, CaretDownOutlined } from '@ant-design/icons';
+import './index.less';
+import { set } from "lodash";
+
+interface PropertyItem {
+    name: string;
+    value: string;
+    isChecked: boolean;
+    isCommonUse: boolean;
+}
+
+interface propertyInfoProps {
+    propertyName: string;
+    propertyCode: string;
+    detailList: Array<PropertyItem>;
+}
+
+const PropertyGroup = (props: any) => {
+
+    const { 
+        propertyData, 
+        handleProperyItemChange, 
+        modalVisilbe,
+        itemValue,
+    } = props;
+    const [commonUseProperty, setCommonUseProperty] = useState<Array<PropertyItem> | any>([]); // 常用属性值
+    const [notCommonUseProperty, setNotCommonUseProperty] = useState<Array<PropertyItem> | any>([]); // 非常用属性值
+    const [indeterminate, setIndeterminate] = useState(false);
+    const [showNotCommon, setShowNotCommon] = useState(false);
+
+    useEffect(() => {
+        const proItemValue = (itemValue.propertyList || []).find((item: any) => item.propertyCode === propertyData.propertyCode);
+        const checkedList = proItemValue?.detailList || [];
+
+        const proDetailList = JSON.parse(JSON.stringify( propertyData?.detailList || []));
+        proDetailList.forEach((item: any) => {
+            if (checkedList.some((checkItem: any) => checkItem.value === item.value)){
+                item.isChecked = true;
+            }
+        });
+        const commonUseProperty = (proDetailList).filter((item: any) => item.isCommonUse);
+        
+        const notCommonUseProperty = (proDetailList).filter((item: any) => !item.isCommonUse);
+        if (checkedList.some((item: any) => !item.isCommonUse)) {
+            setShowNotCommon(true)
+        }
+        setCommonUseProperty(commonUseProperty);
+        setNotCommonUseProperty(notCommonUseProperty);
+    }, [modalVisilbe])
+
+    const parseDataToParent = (comUse: any[], notComUse: any[]) => {
+        let choosedPropertyList = (comUse|| []).filter(item => item.isChecked);
+        if (showNotCommon) {
+            choosedPropertyList = [...choosedPropertyList, ...((notComUse|| []).filter(item => item.isChecked))]
+        }
+        handleProperyItemChange({
+            propertyCode: propertyData?.propertyCode,
+            propertyName: propertyData?.propertyName,
+            propertyId: propertyData?.propertyId,
+            isCommonUse: propertyData?.isCommonUse,
+            detailList: choosedPropertyList
+        });
+    }
+
+
+    const handleChangeAll = (e: any) => {
+        if (showNotCommon) {
+            notCommonUseProperty.map((item: any) => item.isChecked = e.target.checked);
+            setNotCommonUseProperty([...notCommonUseProperty])
+        }
+        commonUseProperty.map((item: any) => item.isChecked = e.target.checked);
+        parseDataToParent(commonUseProperty, notCommonUseProperty)
+        setCommonUseProperty([...commonUseProperty])
+        setIndeterminate(false)
+    }
+
+    const handleIndeterminate = (commonUseProperty: any[], notCommonUseProperty: any[]) => {
+        let checkList = [...commonUseProperty];
+        if (showNotCommon) {
+            checkList = [...checkList, ...notCommonUseProperty]
+        }
+        const indeterminate = !!checkList.filter(item => item.isChecked).length && checkList.filter(item => item.isChecked).length !== checkList.length;
+        setIndeterminate(indeterminate);
+    }
+
+    const handleItemChecked = (e: any, item: any, type: number) => {
+        if (type === 1) { // 常用属性
+            (commonUseProperty || []).forEach((info: any) => {
+                if (info.value === item.value) {
+                    info.isChecked = e.target.checked;
+                }
+            })
+            handleIndeterminate(commonUseProperty, notCommonUseProperty)
+            parseDataToParent(commonUseProperty, notCommonUseProperty)
+            setCommonUseProperty([...commonUseProperty])
+        }
+
+        if (type === 2) { // 非常用属性
+            (notCommonUseProperty || []).forEach((info: any) => {
+                if (info.value === item.value) {
+                    info.isChecked = e.target.checked;
+                }
+            })
+            handleIndeterminate(commonUseProperty, notCommonUseProperty)
+            parseDataToParent(commonUseProperty, notCommonUseProperty)
+            setNotCommonUseProperty([...notCommonUseProperty])
+        }
+    }
+
+    const checkAllChecked = () => {
+        const checkData = showNotCommon ? [...commonUseProperty, ...notCommonUseProperty] : [...commonUseProperty];
+        return checkData.length && checkData.every(item => item.isChecked) ? true : false;
+    }
+
+
+    return (
+        <div className={'propertyGroup_container'}>
+            <div className={'propertyGroup_container_left'}>
+                <Checkbox
+                    checked={checkAllChecked()}
+                    indeterminate={indeterminate}
+                    onChange={handleChangeAll}
+                >
+                    <div title={propertyData.name} className="propertyGroup_checkbox_container">{propertyData.propertyName}</div>
+                </Checkbox>
+            </div>
+            <div className={'propertyGroup_container_right'}>
+                {
+                    (commonUseProperty || []).map((item: any) => (
+                        <Checkbox
+                            checked={item.isChecked}
+                            key={item.value}
+                            onChange={(e) => {
+                                handleItemChecked(e, item, 1)
+                            }}
+                        >
+                            <div title={item.name} className="propertyGroup_checkbox_container">
+                                {item.name}
+                            </div>
+                        </Checkbox>
+                    ))
+
+                }
+                {
+                    showNotCommon && (notCommonUseProperty || []).map((item: any) => (
+                        <Checkbox
+                            checked={item.isChecked}
+                            key={item.value}
+                            onChange={(e) => {
+                                handleItemChecked(e, item, 2)
+                            }}
+                        >
+                            <div title={item.name} className="propertyGroup_checkbox_container">
+                                {item.name}
+                            </div>
+                        </Checkbox>
+                    ))
+
+                }
+                {
+                    !!notCommonUseProperty.length && (
+                        <div 
+                            style={{
+                                width: '50px', 
+                                cursor: 'pointer', 
+                                color: '#005cff', 
+                                fontSize: '10px',
+                                display: 'flex',
+                                alignItems: 'center',
+                            }}
+                            onClick={() => {
+                                setShowNotCommon(!showNotCommon);
+                                handleIndeterminate(commonUseProperty, notCommonUseProperty)
+                            }}
+                        >
+                            {
+                                showNotCommon && (
+                                    <>
+                                        <CaretUpOutlined />
+                                        收起
+                                    </>
+                                )
+                            }
+                            {
+                                !showNotCommon && (
+                                    <>
+                                        <CaretDownOutlined />
+                                        展开
+                                    </>
+                                )
+                            }
+                        </div>
+                    )
+                }
+            </div>
+        </div>
+    );
+};
+
+export default React.memo(PropertyGroup, (props, nextProps) => {
+    if (props.modalVisilbe !== nextProps.modalVisilbe) return false;
+    return true;
+});

package/src/components/Business/SearchSelect/BusinessUtils.tsx

@@ -15,6 +15,7 @@ export function commonFun (type?: string, prefixUrl: any, parentProps?:any) {
   
   // 默认type === 'supplier' 供应商选择器
   let requestConfig = {
+    init: true,
     url: `${prefixUrl.selectPrefix}/supplier`,
     filter: 'qp-name,code-orGroup,like', // 过滤参数
     otherParams: {
@@ -295,7 +296,8 @@ export function commonFun (type?: string, prefixUrl: any, parentProps?:any) {
   // 商品选择器sku
   if(type === 'skuCommodity') {
     requestConfig = {
-      url: `${prefixUrl.selectPrefix}/sku/doPageBySelect/v3`,
+      url: `${prefixUrl.selectPrefix}/sku/doPageBySelect/v4`,
+      method: 'post',
       filter: 'skuCodeAndSkuName', // 过滤参数
       searchStartLength: 4,
       mappingTextField: 'name',
@@ -324,9 +326,43 @@ export function commonFun (type?: string, prefixUrl: any, parentProps?:any) {
       ...selectConfigProps,
     }
     tableSearchForm =  [
-      { name: 'qp-skuCode-in', label: 'SKU编码',type:'multipleQueryInput' },
+      { name: 'qp-skuCode-in', label: 'SKU编码', field: {
+        type:'multipleQuerySearchSelect', 
+        props: {
+          selectProps: {
+            mode: "multiple",
+            placeholder: '请输入SKU编码查询'
+          },
+          requestConfig: {
+            url: '/items/sku//listNoPage/Simple',
+            filter: 'qp-skuCode,name-orGroup,like',
+            mappingTextField: 'name',
+            mappingValueField: 'skuCode',
+            sourceName: 'qp-skuCode-in',
+            specialBracket: true,
+            otherParams: {
+              'ownOrgSign': getCurrentTargetBgId(),
+            }, // 默认参数
+          },
+        }
+      } },
       { name: 'qp-skuName-like', label: 'SKU名称' },
-      { name: 'qp-itemCode-like', label: '外部SPU编码' },
+      { name: 'qp-itemCode-in', label: 'SPU编码', field: {
+        type:'multipleQuerySearchSelect', 
+        props: {
+          selectProps: {
+            placeholder: '请输入SPU编码查询'
+          },
+          requestConfig: {
+            url: '/items/item/listNoPage/Simple',
+            filter: 'qp-itemCode,name-orGroup,like',
+            mappingTextField: 'name',
+            mappingValueField: 'itemCode',
+            sourceName: 'qp-itemCode-in',
+            specialBracket: true,
+          },
+        }
+      } },
       { name: 'qp-eancode-in', label: '商品条码', field: {
         type: 'multipleQueryInput',
         props: {
@@ -365,6 +401,9 @@ export function commonFun (type?: string, prefixUrl: any, parentProps?:any) {
             dropdownStyle: { maxHeight: 400, maxWidth: 100, overflow: 'auto' }
           },
         } },
+      { name: 'UNIQUE_SPEC', label: '属性', field: {
+          type: 'proppertySelector',
+        } },
     ]
     Promise.all([
       loadSelectSource(`${prefixUrl.formSelectFix}/brand/queryBrandList`, {
@@ -784,6 +823,7 @@ export function commonFun (type?: string, prefixUrl: any, parentProps?:any) {
       ...selectConfigProps,
     }
     requestConfig = {
+      init: true,
       url: `${prefixUrl.selectPrefix}/skuPropertyValue/list`,
       filter: 'qp-value-like', // 过滤参数
       mappingTextField: 'value',
@@ -1694,6 +1734,7 @@ export function commonFun (type?: string, prefixUrl: any, parentProps?:any) {
       ...selectConfigProps,
     }
     requestConfig = {
+      init: true,
       url: `${prefixUrl.selectPrefix}/inventoryOrg`,
       filter: 'qp-name,code-orGroup,like', // 过滤参数
       mappingTextField: 'name',
@@ -1726,6 +1767,7 @@ export function commonFun (type?: string, prefixUrl: any, parentProps?:any) {
       ...selectConfigProps,
     }
     requestConfig = {
+      init: true,
       url: `${prefixUrl.selectPrefix}/company`,
       filter: 'qp-name,code-orGroup,like', // 过滤参数
       mappingTextField: 'name',
@@ -1758,6 +1800,7 @@ export function commonFun (type?: string, prefixUrl: any, parentProps?:any) {
       ...selectConfigProps,
     }
     requestConfig = {
+      init: true,
       url: `${prefixUrl.selectPrefix}/platCompany`,
       filter: 'qp-name,socialCreditCode-orGroup,like', // 过滤参数
       mappingTextField: 'name',
@@ -1790,6 +1833,7 @@ export function commonFun (type?: string, prefixUrl: any, parentProps?:any) {
       ...selectConfigProps,
     }
     requestConfig = {
+      init: true,
       url: `${prefixUrl.selectPrefix}/employee/v2`,
       filter: 'qp-employeeNumber,name-orGroup,like', // 过滤参数
       mappingTextField: 'name',
@@ -1887,6 +1931,7 @@ export function commonFun (type?: string, prefixUrl: any, parentProps?:any) {
       ...selectConfigProps,
     }
     requestConfig = {
+      init: true,
       url: `${prefixUrl.selectPrefix}/employee/pageList/v2`,
       filter: 'qp-username,name-orGroup,like', // 过滤参数
       mappingTextField: 'name',
@@ -2008,6 +2053,7 @@ export function commonFun (type?: string, prefixUrl: any, parentProps?:any) {
     const isLogisCompanyCodeSingleSearch = requestConfigProp?.fixedparameter?.some((i: any) => i == 'qp-logisCompanyCode-eq');
     const logisCompanyCodeSingleSearchName = isLogisCompanyCodeSingleSearch ? 'qp-logisCompanyCode-eq' : 'qp-logisCompanyCode-in';
     requestConfig = {
+      init: true,
       url: `${prefixUrl.selectPrefix}/deliveryMode`,
       filter: 'qp-name,code-orGroup,like', // 过滤参数
       mappingTextField: 'name',
@@ -2135,6 +2181,7 @@ export function commonFun (type?: string, prefixUrl: any, parentProps?:any) {
       ...selectConfigProps,
     }
     requestConfig = {
+      init: true,
       url: `${prefixUrl.selectPrefix}/ruleTemplate`,
       filter: 'qp-name,code-orGroup,like', // 过滤参数
       mappingTextField: 'name',
@@ -2210,6 +2257,7 @@ export function commonFun (type?: string, prefixUrl: any, parentProps?:any) {
       ...selectConfigProps,
     }
     requestConfig = {
+      init: true,
       url: `${prefixUrl.selectPrefix}/role`,
       filter: 'qp-name,code-orGroup,like', // 过滤参数
       mappingTextField: 'name',
@@ -2308,6 +2356,7 @@ export function commonFun (type?: string, prefixUrl: any, parentProps?:any) {
       ...selectConfigProps,
     }
     requestConfig = {
+      init: true,
       url: `${prefixUrl.selectPrefix}/channelInfo`,
       filter: 'qp-name,code-orGroup,like', // 过滤参数
       mappingTextField: 'name',
@@ -2398,6 +2447,7 @@ export function commonFun (type?: string, prefixUrl: any, parentProps?:any) {
       ...selectConfigProps,
     }
     requestConfig = {
+      init: true,
       url: `${prefixUrl.selectPrefix}/orgViewNode/common/pageList`,
       filter: 'qp-name-like', // 过滤参数
       mappingTextField: 'name',
@@ -2531,6 +2581,7 @@ export function commonFun (type?: string, prefixUrl: any, parentProps?:any) {
       ...selectConfigProps,
     }
     requestConfig = {
+      init: true,
       url: `${prefixUrl.selectPrefix}/person`,
       filter: 'qp-code,name-orGroup,like', // 过滤参数
       mappingTextField: 'name',
@@ -2687,6 +2738,7 @@ export function commonFun (type?: string, prefixUrl: any, parentProps?:any) {
       ...selectConfigProps,
     }
     requestConfig = {
+      init: true,
       url: `${prefixUrl.selectPrefix}/priceType`,
       filter: 'qp-code,name-orGroup,like', // 过滤参数
       mappingTextField: 'name',

package/src/components/Business/SearchSelect/index.md

@@ -426,7 +426,7 @@ export default () => {
   
   useEffect(() => {
     if(tabKey === 'multiple') {
-      setValue(['1540295745870573570', '1540173160826613762'])
+      setValue([])
     }
   },[tabKey])
   
@@ -448,7 +448,7 @@ export default () => {
     // },
     // prefixUrl: { selectPrefix: '/bop/api', formSelectFix: '/bop/api' },
     selectProps,
-    // labelInValue: true,
+    labelInValue: true,
     selectBusinessType: 'physicalWarehouse',
   };
 
@@ -520,7 +520,7 @@ export default () => {
     //   needStatusSearch: true
     // },
     selectProps,
-    selectBusinessType: 'realWarehouse',
+    selectBusinessType: 'brand',
   };
 
   const onTabChange = (key) => {
@@ -1707,7 +1707,6 @@ export default () => {
   }
   const selectPropsMultiple = {
     mode: 'multiple',
-    maxTagCount: 1,
   }
 
   const [ tabKey, setTabKey ] = useState('single')

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

@@ -26,7 +26,7 @@ const BusinessSearchSelect = forwardRef((props: any, ref: any) => {
       needModalTable,
       modalTableProps
     }
-  }, [props?.value, props.disabled, props.selectBusinessType]);
+  }, [props?.value, props.disabled, props.selectBusinessType,props.requestConfig?.noOperate]);
 
   useImperativeHandle(ref, () => ({
     getRef: () => innerRef,
@@ -52,5 +52,8 @@ export default React.memo(BusinessSearchSelect, (props, nextProps) => {
   if (props && props.selectBusinessType !== nextProps.selectBusinessType) {
     return false
   }
+  if (props && props.requestConfig && typeof props.requestConfig.noOperate === 'boolean' && props.requestConfig.noOperate !== nextProps.requestConfig.noOperate) {
+    return false
+  }
   return true
 });

package/src/components/Business/columnSettingTable/components/TableSumComponent.tsx

@@ -0,0 +1,25 @@
+import React, { Fragment } from "react";
+import { Typography } from 'antd';
+import './style.less';
+
+//表格底部 金额总计
+export default ({
+  summary
+}: any) => {
+  const { Text } = Typography;
+  
+  return (
+    <Fragment>
+      <div className="table_sum_wrapper">
+        <div className='table-bssula-summary'>
+          {summary.map((item: any) => (
+            <Text type='danger'>
+              {item.label}: <span className='table-bssula-summary-count'>{item.count || 0}</span>
+            </Text>
+          ))}
+        </div>
+      </div>
+      <div className="sum_right_line"></div>
+    </Fragment>
+  )
+}

package/src/components/Business/columnSettingTable/components/style.less

@@ -0,0 +1,25 @@
+
+.table_sum_wrapper{
+  position: absolute;
+  overflow: hidden;
+  width: 80%;
+  height: 26px;
+  bottom: 0;
+  .table-bssula-summary{
+    height: 40px;
+    right: 0;
+    bottom: -20px;
+    white-space: nowrap;
+    overflow-x: auto;
+  }
+}
+.sum_right_line {
+  position: absolute;
+  right: 20%;
+  bottom: 0;
+  width: 16px;
+  height: 26px;
+  opacity: 0.32;
+  transform: scaleX(-1);
+  background-image: linear-gradient(270deg, #ffffff00 0%, #A4A4A4 100%);
+}

package/src/components/Business/columnSettingTable/index.md

@@ -111,7 +111,7 @@ export default () => {
       x: '100%',
     },
     rowKey: 'id',
-    dataSource: [{}, {}],
+    dataSource: [{},{},{},{},{},{},{},{},{},{},{},{},{},{},{},{},{},{},{},{},{},{},{},{},{},{},{},{},{},{},{},{},{},{},{},{}],
     pagination: {
       showTotal: (total: any) => `共 ${total} 条`,
       showQuickJumper: true,
@@ -291,17 +291,14 @@ export default () => {
     ]
   const config = {
     modeType: 'view',
-    scroll: {
-      x: '100%',
-    },
     rowKey: 'id',
     // initialDataSource: [{}, {}],
     remoteDataSource: {
       url: 'xxxxxx',
       converter: ({ data }: any) => {
         return {
-          list: [{},{}],
-          total: 2
+          list: [{},{},{},{},{},{},{},{},{},{},{},{},{},{},{},{},{},{},{},{},{},{},{},{},{},{},{},{},{},{},{},{},{},{},{},{}],
+          total: 40
         };
       },
     },
@@ -310,8 +307,8 @@ export default () => {
       showQuickJumper: true,
       hideOnSinglePage: true,
       current: 1,
-      pageSize: 10,
-      total: 10,
+      pageSize: 30,
+      total: 40,
       size: 'small'
     },
     rowSelection: {