ls-pro-common 3.0.57 → 3.0.59

package/dist/common.min.js.LICENSE.txt

@@ -30,16 +30,6 @@ PERFORMANCE OF THIS SOFTWARE.
  * Copyright Jeremy Ashkenas, DocumentCloud and Investigative Reporters & Editors
  */
 
-/**
- * @license React
- * react-is.production.min.js
- *
- * Copyright (c) Facebook, Inc. and its affiliates.
- *
- * This source code is licensed under the MIT license found in the
- * LICENSE file in the root directory of this source tree.
- */
-
 /** @license React v16.13.1
  * react-is.production.min.js
  *

package/es/components/ImageSelector.d.ts

@@ -2,7 +2,7 @@
 import type { InputProps, ModalProps } from 'antd';
 import type { ProFormItemProps } from 'ls-pro-form';
 export declare type ImageSelectorProps = ProFormItemProps<InputProps> & {
-    /**对应后端的类，默认为RETAIL */
+    /** 对应后端的类，默认为RETAIL */
     code?: string;
     /** @name 分类(文件夹,eg:mdm,pms...) */
     type: string;
@@ -12,20 +12,20 @@ export declare type ImageSelectorProps = ProFormItemProps<InputProps> & {
     title?: string;
     /** @name 弹框宽度 */
     modalWidth?: string;
-    /**
-     * @name 最大值, 默认2M
-     */
+    /** @name 最大值, 默认2M */
     maxSize?: number;
-    /**弹框的属性 */
+    /** 弹框的属性 */
     modalProps?: ModalProps;
-    /**是否输入框模式 */
+    /** 是否输入框模式 */
     isInput?: boolean;
-    /**非输入框模式上传提示语 默认为：支持 png | jpg | gif 格式图片 */
+    /** 非输入框模式上传提示语 默认为：支持 png | jpg | gif 格式图片 */
     desc?: string;
     /** 非输入框模式下 展示图片class */
     imageClass?: string;
     /** 一次最多选择多少张图片 默认为 1 */
     maxCount?: number;
+    uploadRender?: (currentImgUrl: any) => any;
+    afterSelect?: (imgUrl: string) => void;
 };
 declare function ImageSelector(prop: ImageSelectorProps): JSX.Element;
 export default ImageSelector;

package/es/components/ImageSelector.js

@@ -59,7 +59,7 @@ function ImageSelector(prop) {
     _prop$allowClear = prop.allowClear,
     allowClear = _prop$allowClear === void 0 ? true : _prop$allowClear,
     _prop$title = prop.title,
-    title = _prop$title === void 0 ? "选择图标" : _prop$title,
+    title = _prop$title === void 0 ? '选择图标' : _prop$title,
     _prop$modalWidth = prop.modalWidth,
     modalWidth = _prop$modalWidth === void 0 ? '600px' : _prop$modalWidth,
     name = prop.name,
@@ -71,7 +71,7 @@ function ImageSelector(prop) {
     _prop$isInput = prop.isInput,
     isInput = _prop$isInput === void 0 ? true : _prop$isInput,
     _prop$desc = prop.desc,
-    desc = _prop$desc === void 0 ? '支持 png | jpg | gif 格式图片' : _prop$desc,
+    desc = _prop$desc === void 0 ? '支持 png | jpg | gif | svg 格式图片' : _prop$desc,
     _prop$imageClass = prop.imageClass,
     imageClass = _prop$imageClass === void 0 ? '' : _prop$imageClass,
     _prop$maxCount = prop.maxCount,
@@ -151,7 +151,7 @@ function ImageSelector(prop) {
     var _formRef$current, _formRef$current$getF;
     var val = (formRef === null || formRef === void 0 ? void 0 : (_formRef$current = formRef.current) === null || _formRef$current === void 0 ? void 0 : (_formRef$current$getF = _formRef$current.getFieldsValue) === null || _formRef$current$getF === void 0 ? void 0 : _formRef$current$getF.call(_formRef$current)) || {};
     var url = val === null || val === void 0 ? void 0 : val[name];
-    if (!url) {
+    if (!url && (formRef === null || formRef === void 0 ? void 0 : formRef.current) && name) {
       var _formRef$current2, _formRef$current2$get;
       url = formRef === null || formRef === void 0 ? void 0 : (_formRef$current2 = formRef.current) === null || _formRef$current2 === void 0 ? void 0 : (_formRef$current2$get = _formRef$current2.getFieldValue) === null || _formRef$current2$get === void 0 ? void 0 : _formRef$current2$get.call(_formRef$current2, name);
     }
@@ -187,6 +187,9 @@ function ImageSelector(prop) {
           //@ts-ignore
           val[name] = img;
           formRef === null || formRef === void 0 ? void 0 : (_formRef$current4 = formRef.current) === null || _formRef$current4 === void 0 ? void 0 : (_formRef$current4$set = _formRef$current4.setFieldsValue) === null || _formRef$current4$set === void 0 ? void 0 : _formRef$current4$set.call(_formRef$current4, val);
+          if (prop.afterSelect) {
+            prop.afterSelect(img);
+          }
         }
       } else {
         var _result$flag2;
@@ -244,6 +247,9 @@ function ImageSelector(prop) {
     formRef.current.setFieldsValue(val);
     setImgUrl(selectedUrl.join(','));
     setVisible(false);
+    if (prop.afterSelect) {
+      prop.afterSelect(selectedUrl.join(','));
+    }
   };
   var clearValue = function clearValue(e) {
     if (!e || !e.target.value) {
@@ -252,6 +258,9 @@ function ImageSelector(prop) {
       var formValue = (formRef === null || formRef === void 0 ? void 0 : (_formRef$current6 = formRef.current) === null || _formRef$current6 === void 0 ? void 0 : (_formRef$current6$get = _formRef$current6.getFieldsValue) === null || _formRef$current6$get === void 0 ? void 0 : _formRef$current6$get.call(_formRef$current6)) || {};
       formValue[name] = '';
       formRef.current.setFieldsValue(_objectSpread({}, formValue));
+      if (prop.afterSelect) {
+        prop.afterSelect('');
+      }
     }
   };
   var win = top || window;
@@ -281,7 +290,21 @@ function ImageSelector(prop) {
     allowClear: allowClear,
     ref: inputRef,
     onChange: clearValue
-  })) : /*#__PURE__*/React.createElement("div", {
+  })) : prop.uploadRender ? /*#__PURE__*/React.createElement(_Upload, {
+    beforeUpload: beforeUpload,
+    onChange: function onChange(info) {
+      return onUpload(info, true);
+    },
+    action: uploadImgApi,
+    showUploadList: false,
+    name: "file",
+    maxCount: 1,
+    multiple: false,
+    headers: {
+      token: localStorage.getItem('token') || ''
+    },
+    accept: ".png,.gif,.jpg,.jpeg,.bmp,.svg"
+  }, prop.uploadRender(imgUrl)) : /*#__PURE__*/React.createElement("div", {
     className: "image-selector"
   }, /*#__PURE__*/React.createElement(_Upload, {
     beforeUpload: beforeUpload,
@@ -296,7 +319,7 @@ function ImageSelector(prop) {
     headers: {
       token: localStorage.getItem('token') || ''
     },
-    accept: ".png,.gif,.jpg,.jpeg,.bmp"
+    accept: ".png,.gif,.jpg,.jpeg,.bmp,.svg"
   }, imgUrl ? /*#__PURE__*/React.createElement("div", {
     className: "img-wrapper"
   }, /*#__PURE__*/React.createElement("img", {
@@ -365,7 +388,7 @@ function ImageSelector(prop) {
       headers: {
         token: localStorage.getItem('token') || ''
       },
-      accept: ".png,.gif,.jpg,.jpeg,.bmp"
+      accept: ".png,.gif,.jpg,.jpeg,.bmp,.svg"
     }, /*#__PURE__*/React.createElement(_Button, {
       icon: /*#__PURE__*/React.createElement(UploadOutlined, null)
     }, "\u4E0A\u4F20\u65B0\u56FE"))), /*#__PURE__*/React.createElement(_Button, {
@@ -412,6 +435,9 @@ function ImageSelector(prop) {
         setImgUrl(o.url);
         setSelectedUrl([o.url]);
         setVisible(false);
+        if (prop.afterSelect) {
+          prop.afterSelect(o.url);
+        }
       },
       onClick: function onClick() {
         toggleSelectImage(o.url);

package/es/components/antd-custom.less

@@ -14,8 +14,6 @@
   max-width: min-content !important;
 }
 
-
-
 .ant-input-has-value:hover {
   .ant-input-clear-icon {
     visibility: visible;
@@ -61,16 +59,15 @@
   }
 }
 
-
 .ant-btn {
   height: 32px;
+  color: var(--ant-primary-color);
   background-color: var(--ant-primary-1);
   border-color: transparent;
-  color: var(--ant-primary-color);
   border-radius: 4px;
 
   &.ant-btn-lg {
-    height: 40px
+    height: 40px;
   }
 
   &.ant-btn-sm {
@@ -79,114 +76,113 @@
 
   &:hover,
   &:focus {
+    color: var(--ant-primary-color);
     background-color: var(--ant-primary-2);
     border-color: transparent;
-    color: var(--ant-primary-color);
   }
 
   &:active {
+    color: var(--ant-primary-color);
     background-color: var(--ant-primary-3);
     border-color: transparent;
-    color: var(--ant-primary-color);
   }
 
   &[disabled],
   &[disabled]:hover,
   &[disabled]:focus,
   &[disabled]:active {
-    background-color: #EAEEF2;
+    color: #d9d9d9;
+    background-color: #eaeef2;
     border-color: transparent;
-    color: #D9D9D9;
   }
 }
 
 .ant-btn-primary {
+  color: #fff;
   background-color: var(--ant-primary-color);
   border-color: transparent;
-  color: #fff;
 
   &:hover,
   &:focus {
+    color: #fff;
     background-color: var(--ant-primary-color-hover);
     border-color: transparent;
-    color: #fff;
   }
 
   &:active {
+    color: #fff;
     background-color: var(--ant-primary-color-active);
     border-color: transparent;
-    color: #fff;
   }
 
   &[disabled],
   &[disabled]:hover,
   &[disabled]:focus,
   &[disabled]:active {
+    color: #fff;
     background-color: var(--ant-primary-color-outline);
     border-color: transparent;
-    color: #fff;
   }
 }
 
 .ant-btn-dashed,
 .ant-btn-gray {
-  background-color: #F1F4F6;
-  color: #1B1F2A;
+  color: #1b1f2a;
+  background-color: #f1f4f6;
 
   &:hover,
   &:focus {
-    background-color: #D2D6DD;
-    color: #1B1F2A;
+    color: #1b1f2a;
+    background-color: #d2d6dd;
   }
 
   &:active {
-    background-color: #B5BBC5;
-    color: #1B1F2A;
+    color: #1b1f2a;
+    background-color: #b5bbc5;
   }
 
   &[disabled],
   &[disabled]:hover,
   &[disabled]:focus,
   &[disabled]:active {
-    background-color: #F1F4F6;
     color: #818999;
+    background-color: #f1f4f6;
   }
 }
 
-
 .ant-btn-dangerous {
-  background-color: #FFCCC7;
+  color: #f5222d;
+  background-color: #ffccc7;
   border-color: transparent;
-  color: #F5222D;
 
   &:hover,
   &:focus {
-    background-color: #FFF1F0;
+    color: #f5222d;
+    background-color: #fff1f0;
     border-color: transparent;
-    color: #F5222D;
   }
 
   &:active {
-    background-color: #FFA39E;
+    color: #f5222d;
+    background-color: #ffa39e;
     border-color: transparent;
-    color: #F5222D;
   }
 
   &[disabled],
   &[disabled]:hover,
   &[disabled]:focus,
   &[disabled]:active {
-    background-color: #FFCCC7;
+    color: #ffa39e;
+    background-color: #ffccc7;
     border-color: transparent;
-    color: #FFA39E;
   }
 }
 
 .ant-btn-link {
+  padding: 4px 8px;
+  color: var(--ant-primary-color);
   background-color: transparent;
   border-color: transparent;
-  color: var(--ant-primary-color);
-  padding: 4px 8px;
 
   &[disabled],
   &[disabled]:hover,
@@ -212,15 +208,15 @@
   &[disabled]:hover,
   &[disabled]:focus,
   &[disabled]:active {
-    color: #A7B5CC;
+    color: #a7b5cc;
   }
 }
 
 .ant-btn-text {
+  padding: 4px 8px;
+  color: #8c8c8c;
   background-color: transparent;
   border-color: transparent;
-  color: #8C8C8C;
-  padding: 4px 8px;
 
   &[disabled],
   &[disabled]:hover,
@@ -231,7 +227,6 @@
   &:active {
     background-color: transparent;
     border-color: transparent;
-
   }
 
   &:hover,
@@ -253,7 +248,6 @@
   animation-fill-mode: none !important;
 }
 
-
 .ant-descriptions-item-label {
   color: #8c8c8c !important;
 
@@ -283,18 +277,18 @@
   }
 }
 
-.ant-table-filter-dropdown .ant-checkbox-wrapper+span,
-.ant-table-filter-dropdown-submenu .ant-checkbox-wrapper+span {
+.ant-table-filter-dropdown .ant-checkbox-wrapper + span,
+.ant-table-filter-dropdown-submenu .ant-checkbox-wrapper + span {
   display: inline-block;
+  width: 200px;
   overflow: hidden;
   text-overflow: ellipsis;
-  width: 200px;
 }
 
 // 以下为调整字体大小及行高
 
 .ant-picker:not(.ant-picker-large, .ant-picker-sm),
-.ant-input:not(.ant-input-lg, .ant-input-sm) .ant-form-item-label>label,
+.ant-input:not(.ant-input-lg, .ant-input-sm) .ant-form-item-label > label,
 .ant-form:not(.ant-form-large, .ant-form-sm) .ant-form-item,
 .ant-input:not(.ant-input-lg, .ant-input-sm),
 .ant-input-number:not(.ant-input-number-lg, .ant-input-number-sm),
@@ -306,7 +300,7 @@
 
 .ant-btn:not(.ant-btn-lg, .ant-btn-sm),
 .ant-select-single:not(.ant-select-customize-input) .ant-select-selector,
-.ant-input:not(.ant-input-lg, .ant-input-sm) .ant-form-item-label>label {
+.ant-input:not(.ant-input-lg, .ant-input-sm) .ant-form-item-label > label {
   height: 28px !important;
   min-height: 28px !important;
 }
@@ -319,8 +313,12 @@
   margin-bottom: 12px !important;
 }
 
-.ant-select-single:not(.ant-select-lg, .ant-select-sm) .ant-select-selector .ant-select-selection-item,
-.ant-select-single:not(.ant-select-lg, .ant-select-sm) .ant-select-selector .ant-select-selection-placeholder {
+.ant-select-single:not(.ant-select-lg, .ant-select-sm)
+  .ant-select-selector
+  .ant-select-selection-item,
+.ant-select-single:not(.ant-select-lg, .ant-select-sm)
+  .ant-select-selector
+  .ant-select-selection-placeholder {
   line-height: 26px !important;
 }
 
@@ -340,7 +338,6 @@
   padding-bottom: 2px !important;
 }
 
-
 .ant-picker-range:not(.ant-picker-large, .ant-picker-sm) {
   padding: 2px 4px !important;
 
@@ -356,12 +353,12 @@
     right: 3px !important;
   }
 
-  .ant-picker-input>input {
+  .ant-picker-input > input {
     letter-spacing: -0.8px !important;
   }
 }
 
-.ant-table-filter-dropdown .ant-dropdown-menu-item .ant-checkbox+span {
+.ant-table-filter-dropdown .ant-dropdown-menu-item .ant-checkbox + span {
   width: 230px;
 }
 
@@ -379,31 +376,31 @@
     max-width: 200px;
 
     ul {
-      height: 0;
       flex: auto;
-      list-style: none;
-      overflow: auto;
+      height: 0;
       margin: 0;
       padding: 8px;
+      overflow: auto;
+      list-style: none;
       border-inline-end: 1px solid rgba(5, 5, 5, 0.06);
 
       li {
+        margin-top: 8px;
         overflow: hidden;
         white-space: nowrap;
         text-overflow: ellipsis;
         border-radius: 4px;
-        padding-inline: 8px;
-        padding-block: 1px;
         cursor: pointer;
         transition: all 0.3s;
-        margin-top: 8px;
+        padding-inline: 8px;
+        padding-block: 1px;
       }
     }
   }
 }
 
 .ant-table td.ant-table-cell {
-  color: #5b5b5b
+  color: #5b5b5b;
 }
 
 .ant-pro-form-query-filter.ant-form-vertical {
@@ -417,26 +414,27 @@
     height: 28px;
   }
 
-  .ant-input-group.ant-input-group-compact>*:first-child {
+  .ant-input-group.ant-input-group-compact > *:first-child {
     border-radius: 0 !important;
     border-top-left-radius: 4px !important;
     border-bottom-left-radius: 4px !important;
   }
 
-  .ant-input-group.ant-input-group-compact>*:last-child {
+  .ant-input-group.ant-input-group-compact > *:last-child {
     border-radius: 0 !important;
-    border-top-left-radius: 4px !important;
-    border-bottom-left-radius: 4px !important;
+    border-top-right-radius: 4px !important;
+    border-bottom-right-radius: 4px !important;
+  }
+  .ant-input-group > .ant-input:not(:first-child):not(:last-child) {
+    line-height: 1.5;
   }
-
 }
 
-.ant-input-number-group>.ant-input-number:not(:first-child):not(:last-child) {
+.ant-input-number-group > .ant-input-number:not(:first-child):not(:last-child) {
   border-radius: 0 !important;
 }
 
 .ant-pro-table {
-
   .ant-table:not(.ant-table-has-fix-right),
   .ant-table.ant-table-empty {
     .ant-table-container {
@@ -453,4 +451,4 @@
       }
     }
   }
-}
+}

package/es/hooks/useGetState.d.ts

@@ -1 +1,2 @@
+/** 用于在useEffect, useCallback, useMemo等hooks中不传依赖时获取最新的值 */
 export default function (initVal: any): any[];

package/es/hooks/useGetState.js

@@ -1,17 +1,18 @@
 import _slicedToArray from "@babel/runtime/helpers/esm/slicedToArray";
-import { useState, useRef } from "react";
+import { useState, useRef } from 'react';
+/** 用于在useEffect, useCallback, useMemo等hooks中不传依赖时获取最新的值 */
 export default function (initVal) {
   var _useState = useState(initVal),
     _useState2 = _slicedToArray(_useState, 2),
     state = _useState2[0],
     setState = _useState2[1];
   var ref = useRef(initVal);
-  var shangeState = function shangeState(newVal) {
+  var changeState = function changeState(newVal) {
     ref.current = newVal;
     setState(newVal);
   };
   var getState = function getState() {
     return ref.current;
   };
-  return [state, shangeState, getState];
+  return [state, changeState, getState];
 }