@kmkf-fe-packages/basic-components 0.24.1-alpha.6 → 0.24.1-alpha.7

package/dist/index.esm.js

@@ -1,11 +1,11 @@
 import React, { useRef, useState, useEffect, forwardRef, useImperativeHandle, useMemo } from 'react';
 import { Cascader, DatePicker, InputNumber, Input, Select, Upload, Image, message, Radio, Space, Spin, Modal, Button, Checkbox, Row, Col, Slider, Rate, Form, Tabs, ConfigProvider, Pagination, Popover, Table } from 'antd';
-import { EyeOutlined, DeleteOutlined } from '@ant-design/icons';
+import { EyeOutlined, DeleteOutlined, CaretUpOutlined } from '@ant-design/icons';
 import request, { extend as extend$1 } from 'umi-request';
 import { CopyToClipboard } from 'react-copy-to-clipboard';
 import { AddressData, BsAddressData, toTree, request as request$1, ExpressData, uuid, LogisticsAddressData } from '@kmkf-fe-packages/kmkf-utils';
 import zhCN from 'antd/lib/locale/zh_CN';
-import { cloneDeep } from 'lodash';
+import { cloneDeep, difference, differenceWith } from 'lodash';
 import { useDebounceEffect } from 'ahooks';
 import pubsub from 'pubsub-js';
 
@@ -10606,7 +10606,6 @@ var columns = [{
   dataIndex: 'code',
   title: '商品编码',
   with: 200,
-  // ellipsis: true,
   render: function render(val) {
     return /*#__PURE__*/React.createElement("div", {
       style: {
@@ -10617,8 +10616,6 @@ var columns = [{
 }, {
   dataIndex: 'marketPrice',
   title: '市场价',
-  // with: 200,
-  // ellipsis: true,
   render: function render(val) {
     return /*#__PURE__*/React.createElement("div", {
       style: {
@@ -10753,9 +10750,42 @@ var GoodsModal$1 = function GoodsModal(props, ref) {
   var rowSelection = {
     selectedRowKeys: selectIds,
     fixed: true,
-    onChange: function onChange(selectedRowKeys, selectedRows, info) {
-      setSelectIds(selectedRowKeys);
-      setSelect(_toConsumableArray(selectedRows));
+    // onChange: (
+    //   selectedRowKeys: React.SetStateAction<string[]>,
+    //   selectedRows: any[],
+    //   info: any,
+    // ) => {
+    //   setSelectIds(selectedRowKeys);
+    //   setSelect([...selectedRows]);
+    // },
+    onSelect: function onSelect(record, selected) {
+      if (selected) {
+        setSelectIds([].concat(_toConsumableArray(selectIds), [record.skuCode]));
+        setSelect([].concat(_toConsumableArray(selectList), [record]));
+      } else {
+        setSelectIds(selectIds.filter(function (t) {
+          return t !== record.skuCode;
+        }));
+        setSelect(selectList.filter(function (t) {
+          return t.skuCode !== record.skuCode;
+        }));
+      }
+    },
+    onSelectAll: function onSelectAll(selected, selectedRows, changeRows) {
+      if (selected) {
+        setSelectIds([].concat(_toConsumableArray(selectIds), _toConsumableArray(changeRows.map(function (t) {
+          return t.skuCode;
+        }))));
+        setSelect([].concat(_toConsumableArray(selectList), _toConsumableArray(changeRows)));
+      } else {
+        setSelectIds(difference(selectIds, changeRows.map(function (t) {
+          return t.skuCode;
+        })));
+        var list = differenceWith(selectList, changeRows, function (arrVal, othVal) {
+          return arrVal.skuCode !== othVal.skuCode;
+        });
+        setSelect(list);
+      }
     }
   };
   var initData = function initData(list) {
@@ -10843,6 +10873,86 @@ var GoodsModal$1 = function GoodsModal(props, ref) {
       });
     }
   };
+  var showTable = function showTable() {
+    var handleDelete = function handleDelete(record) {
+      setSelectIds(selectIds.filter(function (t) {
+        return t !== record.skuCode;
+      }));
+      setSelect(selectList.filter(function (t) {
+        return t.skuCode !== record.skuCode;
+      }));
+    };
+    var showColumns = [{
+      dataIndex: '',
+      title: "\u64CD\u4F5C",
+      ellipsis: true,
+      width: 100,
+      render: function render(val, record) {
+        return /*#__PURE__*/React.createElement(Button, {
+          type: "link",
+          onClick: function onClick() {
+            return handleDelete(record);
+          }
+        }, "\u5220\u9664");
+      }
+    }, {
+      dataIndex: 'skuName',
+      title: '商品sku名称',
+      with: 200,
+      ellipsis: true
+    }, {
+      dataIndex: 'skuCode',
+      title: '商品sku编码',
+      with: 200,
+      ellipsis: true
+    }, {
+      dataIndex: 'name',
+      title: '商品名称',
+      with: 200,
+      ellipsis: true
+    }, {
+      dataIndex: 'goodsId',
+      title: '商品id',
+      with: 200,
+      ellipsis: true
+    }, {
+      dataIndex: 'code',
+      title: '商品编码',
+      with: 200,
+      render: function render(val) {
+        return /*#__PURE__*/React.createElement("div", {
+          style: {
+            width: '100px'
+          }
+        }, val);
+      }
+    }, {
+      dataIndex: 'marketPrice',
+      title: '市场价',
+      render: function render(val) {
+        return /*#__PURE__*/React.createElement("div", {
+          style: {
+            width: '70px'
+          }
+        }, val);
+      }
+    }];
+    return selectList.length ? /*#__PURE__*/React.createElement(Table, {
+      columns: showColumns,
+      rowKey: 'skuCode',
+      dataSource: selectList,
+      scroll: {
+        x: true,
+        y: 250
+      },
+      pagination: {
+        size: 'small',
+        total: selectIds.length,
+        pageSize: pageSize,
+        showSizeChanger: false
+      }
+    }) : null;
+  };
   return /*#__PURE__*/React.createElement(Modal, {
     title: '选择商品',
     okText: '确认',
@@ -10924,10 +11034,17 @@ var GoodsModal$1 = function GoodsModal(props, ref) {
       total: total,
       current: pageNo,
       pageSize: pageSize,
-      pageSizeOptions: [],
+      showSizeChanger: false,
+      showQuickJumper: true,
       onChange: pageChange
     }
-  })));
+  }), /*#__PURE__*/React.createElement(Popover, {
+    content: showTable(),
+    title: "\u5DF2\u9009\u62E9".concat(selectIds.length, "\u4E2A\u5546\u54C1")
+  }, /*#__PURE__*/React.createElement(Button, {
+    danger: true,
+    type: "text"
+  }, "\u5DF2\u9009".concat(selectIds.length > 99 ? '99+' : selectIds.length, "\u4E2A\u5546\u54C1"), /*#__PURE__*/React.createElement(CaretUpOutlined, null)))));
 };
 var GoodsModal$2 = /*#__PURE__*/forwardRef(GoodsModal$1);
 

package/dist/index.js

@@ -10617,7 +10617,6 @@ var columns = [{
   dataIndex: 'code',
   title: '商品编码',
   with: 200,
-  // ellipsis: true,
   render: function render(val) {
     return /*#__PURE__*/React__default['default'].createElement("div", {
       style: {
@@ -10628,8 +10627,6 @@ var columns = [{
 }, {
   dataIndex: 'marketPrice',
   title: '市场价',
-  // with: 200,
-  // ellipsis: true,
   render: function render(val) {
     return /*#__PURE__*/React__default['default'].createElement("div", {
       style: {
@@ -10764,9 +10761,42 @@ var GoodsModal$1 = function GoodsModal(props, ref) {
   var rowSelection = {
     selectedRowKeys: selectIds,
     fixed: true,
-    onChange: function onChange(selectedRowKeys, selectedRows, info) {
-      setSelectIds(selectedRowKeys);
-      setSelect(_toConsumableArray(selectedRows));
+    // onChange: (
+    //   selectedRowKeys: React.SetStateAction<string[]>,
+    //   selectedRows: any[],
+    //   info: any,
+    // ) => {
+    //   setSelectIds(selectedRowKeys);
+    //   setSelect([...selectedRows]);
+    // },
+    onSelect: function onSelect(record, selected) {
+      if (selected) {
+        setSelectIds([].concat(_toConsumableArray(selectIds), [record.skuCode]));
+        setSelect([].concat(_toConsumableArray(selectList), [record]));
+      } else {
+        setSelectIds(selectIds.filter(function (t) {
+          return t !== record.skuCode;
+        }));
+        setSelect(selectList.filter(function (t) {
+          return t.skuCode !== record.skuCode;
+        }));
+      }
+    },
+    onSelectAll: function onSelectAll(selected, selectedRows, changeRows) {
+      if (selected) {
+        setSelectIds([].concat(_toConsumableArray(selectIds), _toConsumableArray(changeRows.map(function (t) {
+          return t.skuCode;
+        }))));
+        setSelect([].concat(_toConsumableArray(selectList), _toConsumableArray(changeRows)));
+      } else {
+        setSelectIds(lodash.difference(selectIds, changeRows.map(function (t) {
+          return t.skuCode;
+        })));
+        var list = lodash.differenceWith(selectList, changeRows, function (arrVal, othVal) {
+          return arrVal.skuCode !== othVal.skuCode;
+        });
+        setSelect(list);
+      }
     }
   };
   var initData = function initData(list) {
@@ -10854,6 +10884,86 @@ var GoodsModal$1 = function GoodsModal(props, ref) {
       });
     }
   };
+  var showTable = function showTable() {
+    var handleDelete = function handleDelete(record) {
+      setSelectIds(selectIds.filter(function (t) {
+        return t !== record.skuCode;
+      }));
+      setSelect(selectList.filter(function (t) {
+        return t.skuCode !== record.skuCode;
+      }));
+    };
+    var showColumns = [{
+      dataIndex: '',
+      title: "\u64CD\u4F5C",
+      ellipsis: true,
+      width: 100,
+      render: function render(val, record) {
+        return /*#__PURE__*/React__default['default'].createElement(antd.Button, {
+          type: "link",
+          onClick: function onClick() {
+            return handleDelete(record);
+          }
+        }, "\u5220\u9664");
+      }
+    }, {
+      dataIndex: 'skuName',
+      title: '商品sku名称',
+      with: 200,
+      ellipsis: true
+    }, {
+      dataIndex: 'skuCode',
+      title: '商品sku编码',
+      with: 200,
+      ellipsis: true
+    }, {
+      dataIndex: 'name',
+      title: '商品名称',
+      with: 200,
+      ellipsis: true
+    }, {
+      dataIndex: 'goodsId',
+      title: '商品id',
+      with: 200,
+      ellipsis: true
+    }, {
+      dataIndex: 'code',
+      title: '商品编码',
+      with: 200,
+      render: function render(val) {
+        return /*#__PURE__*/React__default['default'].createElement("div", {
+          style: {
+            width: '100px'
+          }
+        }, val);
+      }
+    }, {
+      dataIndex: 'marketPrice',
+      title: '市场价',
+      render: function render(val) {
+        return /*#__PURE__*/React__default['default'].createElement("div", {
+          style: {
+            width: '70px'
+          }
+        }, val);
+      }
+    }];
+    return selectList.length ? /*#__PURE__*/React__default['default'].createElement(antd.Table, {
+      columns: showColumns,
+      rowKey: 'skuCode',
+      dataSource: selectList,
+      scroll: {
+        x: true,
+        y: 250
+      },
+      pagination: {
+        size: 'small',
+        total: selectIds.length,
+        pageSize: pageSize,
+        showSizeChanger: false
+      }
+    }) : null;
+  };
   return /*#__PURE__*/React__default['default'].createElement(antd.Modal, {
     title: '选择商品',
     okText: '确认',
@@ -10935,10 +11045,17 @@ var GoodsModal$1 = function GoodsModal(props, ref) {
       total: total,
       current: pageNo,
       pageSize: pageSize,
-      pageSizeOptions: [],
+      showSizeChanger: false,
+      showQuickJumper: true,
       onChange: pageChange
     }
-  })));
+  }), /*#__PURE__*/React__default['default'].createElement(antd.Popover, {
+    content: showTable(),
+    title: "\u5DF2\u9009\u62E9".concat(selectIds.length, "\u4E2A\u5546\u54C1")
+  }, /*#__PURE__*/React__default['default'].createElement(antd.Button, {
+    danger: true,
+    type: "text"
+  }, "\u5DF2\u9009".concat(selectIds.length > 99 ? '99+' : selectIds.length, "\u4E2A\u5546\u54C1"), /*#__PURE__*/React__default['default'].createElement(icons.CaretUpOutlined, null)))));
 };
 var GoodsModal$2 = /*#__PURE__*/React.forwardRef(GoodsModal$1);
 

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@kmkf-fe-packages/basic-components",
-  "version": "0.24.1-alpha.6",
+  "version": "0.24.1-alpha.7",
   "description": "> TODO: description",
   "homepage": "",
   "license": "ISC",
@@ -64,5 +64,5 @@
   "publishConfig": {
     "access": "public"
   },
-  "gitHead": "705084b024bbf29506d25c40c6c259244b22602a"
+  "gitHead": "6fb04fd0aca000a0687ac81b8d6c7f2baa04a10d"
 }