@kmkf-fe-packages/basic-components 2.3.2 → 2.3.3

package/dist/index.esm.js

@@ -12127,7 +12127,7 @@ var ChooseBaby = function ChooseBaby(props) {
   }));
 };
 
-var css_248z$7 = "#goods-wrap.goodsBox.single-row {\n  max-height: 800px;\n  overflow-y: auto;\n  padding-top: 4px;\n  flex-basis: 100%;\n}\n#goods-wrap.goodsBox.single-row .good-item.rich-item.with-pic,\n#goods-wrap.goodsBox.single-row .good-item.rich-item.with-attr,\n#goods-wrap.goodsBox.single-row .good-item.rich-item.with-attr.with-pic {\n  flex-basis: 100%;\n}\n#goods-wrap.goodsBox.single-row .good-item.rich-item .good-attrs {\n  flex-grow: 1;\n  flex-shrink: 1;\n}\n#goods-wrap.goodsBox.single-row .good-item.rich-item .good-attrs .good-item-attr {\n  flex-grow: 1;\n  flex-shrink: 1;\n  max-width: 80px;\n  width: 20px;\n  flex-basis: 20px;\n}\n#goods-wrap.goodsBox.single-row .good-item.rich-item .good-attrs .ant-input {\n  flex-shrink: 1;\n  flex-grow: 1;\n  width: 20px;\n  flex-basis: 40px;\n}\n#goods-wrap .good-item.rich-item {\n  position: relative;\n  border: 1px solid #ccc;\n  display: flex;\n  flex-basis: 80px;\n  flex-wrap: nowrap;\n  margin: 0 10px 10px 0;\n  padding: 4px;\n}\n#goods-wrap .good-item.rich-item.with-pic {\n  flex-basis: 90px;\n}\n#goods-wrap .good-item.rich-item.with-attr {\n  flex-basis: 150px;\n}\n#goods-wrap .good-item.rich-item.with-attr.with-pic {\n  flex-basis: 238px;\n}\n#goods-wrap .good-item.rich-item.with-attr.with-pic .goods-imgBox {\n  margin-right: 8px;\n}\n#goods-wrap .good-item.rich-item .good-item-attr {\n  margin-right: 6px;\n  width: 52px;\n  flex-basis: 52px;\n}\n#goods-wrap .good-item.rich-item .good-img {\n  position: relative;\n  width: 80px;\n  height: 80px;\n  border-radius: 4px;\n  border: 1px solid #f2f3f5;\n  margin: 0 10px 0 0;\n  text-align: center;\n  background-color: #f2f3f5;\n}\n#goods-wrap .good-item.rich-item .good-attrs {\n  display: flex;\n  flex-direction: column;\n  font-size: 12px;\n}\n#goods-wrap .good-item.rich-item .good-attrs .ant-input {\n  font-size: 12px;\n  width: 80px;\n  height: 20px;\n  padding-left: 5px;\n  padding-right: 5px;\n}\n#goods-wrap .good-item.rich-item .good-attrs .ant-input.id-textarea {\n  width: 80px;\n  resize: none;\n  height: 45px;\n}\n#goods-wrap .good-item.rich-item .good-attrs div {\n  display: flex;\n}\n#goods-wrap .good-item.rich-item .good-attrs div:not(:first-child) {\n  margin-top: 4px;\n}\n";
+var css_248z$7 = "#goods-wrap.goodsBox.single-row {\n  max-height: 800px;\n  overflow-y: auto;\n  padding-top: 4px;\n  flex-basis: 100%;\n}\n#goods-wrap.goodsBox.single-row .good-item.rich-item.with-pic,\n#goods-wrap.goodsBox.single-row .good-item.rich-item.with-attr,\n#goods-wrap.goodsBox.single-row .good-item.rich-item.with-attr.with-pic {\n  flex-basis: 100%;\n}\n#goods-wrap.goodsBox.single-row .good-item.rich-item .good-attrs {\n  flex-grow: 1;\n  flex-shrink: 1;\n}\n#goods-wrap.goodsBox.single-row .good-item.rich-item .good-attrs .good-item-attr {\n  flex-grow: 1;\n  flex-shrink: 1;\n  max-width: 80px;\n  width: 20px;\n  flex-basis: 20px;\n}\n#goods-wrap.goodsBox.single-row .good-item.rich-item .good-attrs .ant-input {\n  flex-shrink: 1;\n  flex-grow: 1;\n  width: 20px;\n  flex-basis: 40px;\n}\n#goods-wrap .good-item.rich-item {\n  position: relative;\n  border: 1px solid #ccc;\n  display: flex;\n  flex-basis: 80px;\n  flex-wrap: nowrap;\n  margin: 0 10px 10px 0;\n  padding: 4px;\n}\n#goods-wrap .good-item.rich-item.with-pic {\n  flex-basis: 90px;\n}\n#goods-wrap .good-item.rich-item.with-attr {\n  flex-basis: 150px;\n}\n#goods-wrap .good-item.rich-item.with-attr.with-pic {\n  flex-basis: 238px;\n}\n#goods-wrap .good-item.rich-item.with-attr.with-pic .goods-imgBox {\n  margin-right: 8px;\n}\n#goods-wrap .good-item.rich-item .good-item-attr {\n  margin-right: 6px;\n  width: 52px;\n  flex-basis: 52px;\n}\n#goods-wrap .good-item.rich-item .good-img {\n  position: relative;\n  width: 80px;\n  height: 80px;\n  border-radius: 4px;\n  border: 1px solid #f2f3f5;\n  margin: 0 10px 0 0;\n  text-align: center;\n  background-color: #f2f3f5;\n}\n#goods-wrap .good-item.rich-item .good-attrs {\n  display: flex;\n  flex-direction: column;\n  font-size: 12px;\n}\n#goods-wrap .good-item.rich-item .good-attrs .ant-input {\n  font-size: 12px;\n  width: 80px;\n  height: 20px;\n  padding-left: 5px;\n  padding-right: 5px;\n}\n#goods-wrap .good-item.rich-item .good-attrs .ant-input.id-textarea {\n  width: 80px;\n  resize: none;\n  height: 45px;\n}\n#goods-wrap .good-item.rich-item .good-attrs div {\n  display: flex;\n}\n#goods-wrap .good-item.rich-item .good-attrs div:not(:first-child) {\n  margin-top: 4px;\n}\n.goods-uploaded-state {\n  display: flex;\n}\n.goods-uploaded-state .clear-all {\n  float: right;\n  color: #1966ff;\n  cursor: pointer;\n  margin-left: 12px;\n}\n";
 styleInject(css_248z$7);
 
 var GoodItem = function GoodItem(props) {
@@ -12456,13 +12456,22 @@ var GoodItem = function GoodItem(props) {
   var hasAttr = useMemo(function () {
     return hasPic ? headerList.length > 1 : headerList.length > 0;
   }, [hasPic, headerList]);
+  var clearAll = function clearAll() {
+    onChange === null || onChange === void 0 ? void 0 : onChange({
+      shopId: shopId,
+      imgList: []
+    });
+  };
   return /*#__PURE__*/React.createElement("div", null, imgList.length === 0 ? /*#__PURE__*/React.createElement("p", {
     className: "goods-title"
   }, "\u6700\u591A\u6DFB\u52A0", maxLength, "\u4E2A\u5B9D\u8D1D") : /*#__PURE__*/React.createElement("p", {
     className: "goods-uploaded-state"
   }, "\u5DF2\u6DFB\u52A0", /*#__PURE__*/React.createElement("span", {
     className: "goods-uploaded-count"
-  }, imgList.length), "/", maxLength, "\u4E2A\u5B9D\u8D1D"), /*#__PURE__*/React.createElement("div", {
+  }, imgList.length), "/", maxLength, /*#__PURE__*/React.createElement("span", {
+    className: 'clear-all',
+    onClick: clearAll
+  }, "\u6E05\u7A7A")), /*#__PURE__*/React.createElement("div", {
     ref: boxRef,
     id: "goods-wrap",
     className: "goodsBox goodsBox-item-horizontal--box".concat(isSingleRow ? ' single-row' : '')

package/dist/index.js

@@ -12142,7 +12142,7 @@ var ChooseBaby = function ChooseBaby(props) {
   }));
 };
 
-var css_248z$7 = "#goods-wrap.goodsBox.single-row {\n  max-height: 800px;\n  overflow-y: auto;\n  padding-top: 4px;\n  flex-basis: 100%;\n}\n#goods-wrap.goodsBox.single-row .good-item.rich-item.with-pic,\n#goods-wrap.goodsBox.single-row .good-item.rich-item.with-attr,\n#goods-wrap.goodsBox.single-row .good-item.rich-item.with-attr.with-pic {\n  flex-basis: 100%;\n}\n#goods-wrap.goodsBox.single-row .good-item.rich-item .good-attrs {\n  flex-grow: 1;\n  flex-shrink: 1;\n}\n#goods-wrap.goodsBox.single-row .good-item.rich-item .good-attrs .good-item-attr {\n  flex-grow: 1;\n  flex-shrink: 1;\n  max-width: 80px;\n  width: 20px;\n  flex-basis: 20px;\n}\n#goods-wrap.goodsBox.single-row .good-item.rich-item .good-attrs .ant-input {\n  flex-shrink: 1;\n  flex-grow: 1;\n  width: 20px;\n  flex-basis: 40px;\n}\n#goods-wrap .good-item.rich-item {\n  position: relative;\n  border: 1px solid #ccc;\n  display: flex;\n  flex-basis: 80px;\n  flex-wrap: nowrap;\n  margin: 0 10px 10px 0;\n  padding: 4px;\n}\n#goods-wrap .good-item.rich-item.with-pic {\n  flex-basis: 90px;\n}\n#goods-wrap .good-item.rich-item.with-attr {\n  flex-basis: 150px;\n}\n#goods-wrap .good-item.rich-item.with-attr.with-pic {\n  flex-basis: 238px;\n}\n#goods-wrap .good-item.rich-item.with-attr.with-pic .goods-imgBox {\n  margin-right: 8px;\n}\n#goods-wrap .good-item.rich-item .good-item-attr {\n  margin-right: 6px;\n  width: 52px;\n  flex-basis: 52px;\n}\n#goods-wrap .good-item.rich-item .good-img {\n  position: relative;\n  width: 80px;\n  height: 80px;\n  border-radius: 4px;\n  border: 1px solid #f2f3f5;\n  margin: 0 10px 0 0;\n  text-align: center;\n  background-color: #f2f3f5;\n}\n#goods-wrap .good-item.rich-item .good-attrs {\n  display: flex;\n  flex-direction: column;\n  font-size: 12px;\n}\n#goods-wrap .good-item.rich-item .good-attrs .ant-input {\n  font-size: 12px;\n  width: 80px;\n  height: 20px;\n  padding-left: 5px;\n  padding-right: 5px;\n}\n#goods-wrap .good-item.rich-item .good-attrs .ant-input.id-textarea {\n  width: 80px;\n  resize: none;\n  height: 45px;\n}\n#goods-wrap .good-item.rich-item .good-attrs div {\n  display: flex;\n}\n#goods-wrap .good-item.rich-item .good-attrs div:not(:first-child) {\n  margin-top: 4px;\n}\n";
+var css_248z$7 = "#goods-wrap.goodsBox.single-row {\n  max-height: 800px;\n  overflow-y: auto;\n  padding-top: 4px;\n  flex-basis: 100%;\n}\n#goods-wrap.goodsBox.single-row .good-item.rich-item.with-pic,\n#goods-wrap.goodsBox.single-row .good-item.rich-item.with-attr,\n#goods-wrap.goodsBox.single-row .good-item.rich-item.with-attr.with-pic {\n  flex-basis: 100%;\n}\n#goods-wrap.goodsBox.single-row .good-item.rich-item .good-attrs {\n  flex-grow: 1;\n  flex-shrink: 1;\n}\n#goods-wrap.goodsBox.single-row .good-item.rich-item .good-attrs .good-item-attr {\n  flex-grow: 1;\n  flex-shrink: 1;\n  max-width: 80px;\n  width: 20px;\n  flex-basis: 20px;\n}\n#goods-wrap.goodsBox.single-row .good-item.rich-item .good-attrs .ant-input {\n  flex-shrink: 1;\n  flex-grow: 1;\n  width: 20px;\n  flex-basis: 40px;\n}\n#goods-wrap .good-item.rich-item {\n  position: relative;\n  border: 1px solid #ccc;\n  display: flex;\n  flex-basis: 80px;\n  flex-wrap: nowrap;\n  margin: 0 10px 10px 0;\n  padding: 4px;\n}\n#goods-wrap .good-item.rich-item.with-pic {\n  flex-basis: 90px;\n}\n#goods-wrap .good-item.rich-item.with-attr {\n  flex-basis: 150px;\n}\n#goods-wrap .good-item.rich-item.with-attr.with-pic {\n  flex-basis: 238px;\n}\n#goods-wrap .good-item.rich-item.with-attr.with-pic .goods-imgBox {\n  margin-right: 8px;\n}\n#goods-wrap .good-item.rich-item .good-item-attr {\n  margin-right: 6px;\n  width: 52px;\n  flex-basis: 52px;\n}\n#goods-wrap .good-item.rich-item .good-img {\n  position: relative;\n  width: 80px;\n  height: 80px;\n  border-radius: 4px;\n  border: 1px solid #f2f3f5;\n  margin: 0 10px 0 0;\n  text-align: center;\n  background-color: #f2f3f5;\n}\n#goods-wrap .good-item.rich-item .good-attrs {\n  display: flex;\n  flex-direction: column;\n  font-size: 12px;\n}\n#goods-wrap .good-item.rich-item .good-attrs .ant-input {\n  font-size: 12px;\n  width: 80px;\n  height: 20px;\n  padding-left: 5px;\n  padding-right: 5px;\n}\n#goods-wrap .good-item.rich-item .good-attrs .ant-input.id-textarea {\n  width: 80px;\n  resize: none;\n  height: 45px;\n}\n#goods-wrap .good-item.rich-item .good-attrs div {\n  display: flex;\n}\n#goods-wrap .good-item.rich-item .good-attrs div:not(:first-child) {\n  margin-top: 4px;\n}\n.goods-uploaded-state {\n  display: flex;\n}\n.goods-uploaded-state .clear-all {\n  float: right;\n  color: #1966ff;\n  cursor: pointer;\n  margin-left: 12px;\n}\n";
 styleInject(css_248z$7);
 
 var GoodItem = function GoodItem(props) {
@@ -12471,13 +12471,22 @@ var GoodItem = function GoodItem(props) {
   var hasAttr = React.useMemo(function () {
     return hasPic ? headerList.length > 1 : headerList.length > 0;
   }, [hasPic, headerList]);
+  var clearAll = function clearAll() {
+    onChange === null || onChange === void 0 ? void 0 : onChange({
+      shopId: shopId,
+      imgList: []
+    });
+  };
   return /*#__PURE__*/React__default['default'].createElement("div", null, imgList.length === 0 ? /*#__PURE__*/React__default['default'].createElement("p", {
     className: "goods-title"
   }, "\u6700\u591A\u6DFB\u52A0", maxLength, "\u4E2A\u5B9D\u8D1D") : /*#__PURE__*/React__default['default'].createElement("p", {
     className: "goods-uploaded-state"
   }, "\u5DF2\u6DFB\u52A0", /*#__PURE__*/React__default['default'].createElement("span", {
     className: "goods-uploaded-count"
-  }, imgList.length), "/", maxLength, "\u4E2A\u5B9D\u8D1D"), /*#__PURE__*/React__default['default'].createElement("div", {
+  }, imgList.length), "/", maxLength, /*#__PURE__*/React__default['default'].createElement("span", {
+    className: 'clear-all',
+    onClick: clearAll
+  }, "\u6E05\u7A7A")), /*#__PURE__*/React__default['default'].createElement("div", {
     ref: boxRef,
     id: "goods-wrap",
     className: "goodsBox goodsBox-item-horizontal--box".concat(isSingleRow ? ' single-row' : '')

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@kmkf-fe-packages/basic-components",
-  "version": "2.3.2",
+  "version": "2.3.3",
   "description": "> TODO: description",
   "homepage": "",
   "license": "ISC",
@@ -66,5 +66,5 @@
   "publishConfig": {
     "access": "public"
   },
-  "gitHead": "6db37a878558212d358a2be5253d4d2a6aa3f7d5"
+  "gitHead": "16ac9ca794d5117821c65d6aa0c78c0ba00ce995"
 }