@aliretail/cuckoo-official-retailforce-form-combo
Version:
official-retailforce-form-combo
284 lines (239 loc) • 9.7 kB
JavaScript
;
var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault");
exports.__esModule = true;
exports["default"] = void 0;
var _input = _interopRequireDefault(require("@alifd/next/lib/input"));
var _extends2 = _interopRequireDefault(require("@babel/runtime/helpers/extends"));
var _inheritsLoose2 = _interopRequireDefault(require("@babel/runtime/helpers/inheritsLoose"));
var _react = _interopRequireWildcard(require("react"));
var _reactMaterialSelector = _interopRequireDefault(require("@aliretail/react-material-selector"));
var _MediaSelector = _interopRequireDefault(require("@aliretail/react-materials-components/es/MediaSelector"));
var _reactLinkSelector = _interopRequireDefault(require("@aliretail/react-link-selector"));
var _config = require("../../config");
var _reactLinkHelper = require("@aliretail/react-link-helper");
require("./index.scss");
function _getRequireWildcardCache(nodeInterop) { if (typeof WeakMap !== "function") return null; var cacheBabelInterop = new WeakMap(); var cacheNodeInterop = new WeakMap(); return (_getRequireWildcardCache = function _getRequireWildcardCache(nodeInterop) { return nodeInterop ? cacheNodeInterop : cacheBabelInterop; })(nodeInterop); }
function _interopRequireWildcard(obj, nodeInterop) { if (!nodeInterop && obj && obj.__esModule) { return obj; } if (obj === null || typeof obj !== "object" && typeof obj !== "function") { return { "default": obj }; } var cache = _getRequireWildcardCache(nodeInterop); if (cache && cache.has(obj)) { return cache.get(obj); } var newObj = {}; var hasPropertyDescriptor = Object.defineProperty && Object.getOwnPropertyDescriptor; for (var key in obj) { if (key !== "default" && Object.prototype.hasOwnProperty.call(obj, key)) { var desc = hasPropertyDescriptor ? Object.getOwnPropertyDescriptor(obj, key) : null; if (desc && (desc.get || desc.set)) { Object.defineProperty(newObj, key, desc); } else { newObj[key] = obj[key]; } } } newObj["default"] = obj; if (cache) { cache.set(obj, newObj); } return newObj; }
var Setter = /*#__PURE__*/function (_React$Component) {
(0, _inheritsLoose2["default"])(Setter, _React$Component);
function Setter(props) {
var _this;
_this = _React$Component.call(this, props) || this;
_this.state = {
materialProps: {},
linkProps: {}
};
return _this;
}
var _proto = Setter.prototype;
_proto.clone = function clone(data) {
console.log("data", data);
if (!data) return data;
return JSON.parse(JSON.stringify(data));
};
_proto.handleChange = function handleChange(e) {
var val = e.target.value;
this.setState({
inputVal: val
});
};
_proto.handleChange = function handleChange(e, index) {
console.log("e", e);
var _this$props = this.props,
cacheItemList = _this$props.cacheItemList,
onChange = _this$props.onChange;
cacheItemList[index]["itemName"] = e;
onChange(cacheItemList);
};
_proto["delete"] = function _delete(index) {
var _this$props2 = this.props,
cacheItemList = _this$props2.cacheItemList,
onChange = _this$props2.onChange;
cacheItemList.splice(index, 1);
onChange(cacheItemList);
};
_proto.openMaterial = function openMaterial(ids) {
var _this2 = this;
var _this$props3 = this.props,
_this$props3$extensio = _this$props3.extension,
extension = _this$props3$extensio === void 0 ? {} : _this$props3$extensio,
cacheItemList = _this$props3.cacheItemList,
onChange = _this$props3.onChange;
var itemList = cacheItemList || [];
var onClose = function onClose() {
materialProps.visible = false;
_this2.setState({
materialProps: _this2.clone(materialProps)
});
};
var changeHandler = function changeHandler(val) {
console.log("result: ", val, ids, itemList);
itemList[ids]["imgUrlMeta"] = {
filePath: val
};
itemList[ids]["imgUrl"] = val;
onChange(itemList);
onClose();
};
var materialProps = {
uploadType: "image",
embed: true,
visible: true,
onChange: changeHandler,
onClose: onClose,
// requestMap: {
// queryDir: {
// url: "//rap2api.alibaba-inc.com/app/mock/6751/api/retailforce_mall/MaterialDirQuery",
// },
// queryMaterial: {
// url: "//rap2api.alibaba-inc.com/app/mock/6751/api/retailforce_mall/MaterialSearch",
// },
// ossSignature: {
// url: "//rap2api.alibaba-inc.com/app/mock/6751/api/retailforce_mall/getOssSignature",
// },
// uploadCallback: {
// url: "//rap2api.alibaba-inc.com/app/mock/6751/api/retailforce_mall/uploadCallback",
// },
// createMaterial: {
// url: "//rap2api.alibaba-inc.com/app/mock/6751/api/retailforce_mall/createMaterial",
// },
// },
requestMap: {
queryDir: {
url: _config.API.dirQueryURL
},
queryMaterial: {
url: _config.API.materialSearchURL
},
ossSignature: {
url: _config.API.getOssSignature
},
uploadCallback: {
url: _config.API.uploadCallback
},
createMaterial: {
url: _config.API.materialCreate
},
createMaterialDir: {
url: _config.API.createMaterialDir
},
deleteMaterialDir: {
url: _config.API.deleteMaterialDir
},
changeMaterialDir: {
url: _config.API.changeMaterialDir
},
updateMaterialDir: {
url: _config.API.updateMaterialDir
}
}
};
this.setState({
materialProps: materialProps
});
};
_proto.openLink = function openLink(ids) {
var _this3 = this;
var _this$props4 = this.props,
_this$props4$extensio = _this$props4.extension,
extension = _this$props4$extensio === void 0 ? {} : _this$props4$extensio,
cacheItemList = _this$props4.cacheItemList,
onChange = _this$props4.onChange;
var itemList = cacheItemList || [];
var linkClose = function linkClose() {
linkProps.visible = false;
_this3.setState({
linkProps: _this3.clone(linkProps)
});
};
var fillback = extension.fillback;
var linkSuccess = function linkSuccess(obj) {
console.log("链接对象", obj);
var result = obj.result[0] || obj.result || {}; // 没有选择直接关闭
if (!result) {
linkClose();
return;
}
var item = itemList[ids];
item = (0, _reactLinkHelper.getLink)(obj, item);
if (fillback) {
item.itemName = item.actionLinkMeta.name;
}
console.log("==itemList==", itemList);
onChange(itemList);
linkClose();
};
var item = itemList[ids] || {};
console.log("open.link.data", item);
var currentPageList = [];
try {
currentPageList = (0, _reactLinkHelper.transfer)(window.__config__.leaf.getChildren());
} catch (e) {
console.warn("error: ", e);
}
var linkProps = {
visible: true,
currentPageList: currentPageList,
data: item.actionLinkMeta ? item.actionLinkMeta.obj : {},
dialogProps: {
onOk: linkSuccess,
onClose: linkClose,
onCancel: linkClose
}
};
this.setState({
linkProps: linkProps
});
};
_proto.render = function render() {
var _this4 = this;
var _this$props5 = this.props,
cacheItemList = _this$props5.cacheItemList,
setterProps = _this$props5.setterProps,
layout = _this$props5.layout;
var _this$state = this.state,
materialProps = _this$state.materialProps,
linkProps = _this$state.linkProps;
return /*#__PURE__*/_react["default"].createElement("div", {
className: "choose-image"
}, /*#__PURE__*/_react["default"].createElement("ul", {
className: "spot-ul",
style: {
paddingTop: 0
}
}, cacheItemList.length ? cacheItemList.map(function (item, ids) {
return /*#__PURE__*/_react["default"].createElement("li", {
className: "list",
key: String(ids)
}, /*#__PURE__*/_react["default"].createElement("img", {
className: "img",
src: item.imgUrl || _config.defaultImage,
onClick: function onClick() {
_this4.openMaterial(ids);
}
}), /*#__PURE__*/_react["default"].createElement("div", null, /*#__PURE__*/_react["default"].createElement("p", {
className: "ipt"
}, /*#__PURE__*/_react["default"].createElement(_input["default"], (0, _extends2["default"])({}, setterProps, {
placeholder: "\u8BF7\u8F93\u5165",
className: "input",
value: item.itemName,
onChange: function onChange(e) {
_this4.handleChange(e, ids);
}
})), /*#__PURE__*/_react["default"].createElement("div", {
className: "delete",
onClick: function onClick() {
_this4["delete"](ids);
}
})), /*#__PURE__*/_react["default"].createElement("span", {
className: "pop-link",
onClick: function onClick() {
_this4.openLink(ids);
}
}, item.actionLinkMeta ? item.actionLinkMeta.name : item.actionLink || "链接选择")));
}) : null), materialProps.visible ? /*#__PURE__*/_react["default"].createElement(_MediaSelector["default"], materialProps) : null, linkProps.visible ? /*#__PURE__*/_react["default"].createElement(_reactLinkSelector["default"], linkProps) : null);
};
return Setter;
}(_react["default"].Component);
var _default = Setter;
exports["default"] = _default;