141 lines
6.5 KiB
JavaScript
141 lines
6.5 KiB
JavaScript
function _extends() { _extends = Object.assign ? Object.assign.bind() : function (target) { for (var i = 1; i < arguments.length; i++) { var source = arguments[i]; for (var key in source) { if (Object.prototype.hasOwnProperty.call(source, key)) { target[key] = source[key]; } } } return target; }; return _extends.apply(this, arguments); }
|
|
import React, { useRef, forwardRef, useImperativeHandle } from 'react';
|
|
import { Flex, Image } from "antd";
|
|
import theme from 'antd/es/theme';
|
|
import { BigImagePreview } from '@zhst/meta';
|
|
import { AlgorithmConfigImg, ErrorImage } from "../utils/base64Images";
|
|
import AlgorithmTable from "./components/algorithmTable";
|
|
import TimeTemplateTable from "./components/timeTemplateTable";
|
|
var useToken = theme.useToken;
|
|
var Title = function Title(props) {
|
|
return /*#__PURE__*/React.createElement("h2", {
|
|
style: {
|
|
margin: '18px 16px',
|
|
fontSize: '14px',
|
|
color: 'rgba(0, 0, 0, 0.88)'
|
|
}
|
|
}, props.children);
|
|
};
|
|
var AlgorithmConfig = /*#__PURE__*/forwardRef(function (props, ref) {
|
|
var _props$algorithmTable = props.algorithmTableDataSource,
|
|
algorithmTableDataSource = _props$algorithmTable === void 0 ? [] : _props$algorithmTable,
|
|
_props$timeTemplateDa = props.timeTemplateDataSource,
|
|
timeTemplateDataSource = _props$timeTemplateDa === void 0 ? [] : _props$timeTemplateDa,
|
|
_props$boxList = props.boxList,
|
|
boxList = _props$boxList === void 0 ? [] : _props$boxList,
|
|
drawData = props.drawData,
|
|
drawListener = props.drawListener,
|
|
algorithmTableProps = props.algorithmTableProps,
|
|
timeTemplateTableProps = props.timeTemplateTableProps,
|
|
selectedKey = props.selectedKey,
|
|
_props$type = props.type,
|
|
type = _props$type === void 0 ? 'multiple' : _props$type,
|
|
_props$rowKey = props.rowKey,
|
|
rowKey = _props$rowKey === void 0 ? 'id' : _props$rowKey,
|
|
onSelect = props.onSelect;
|
|
var drawImageRef = useRef(null);
|
|
var _useToken = useToken(),
|
|
token = _useToken.token;
|
|
useImperativeHandle(ref, function () {
|
|
return {
|
|
draw: function draw() {
|
|
var _drawImageRef$current;
|
|
(_drawImageRef$current = drawImageRef.current) === null || _drawImageRef$current === void 0 || _drawImageRef$current.setShowCrop(true);
|
|
},
|
|
cancelDraw: function cancelDraw() {
|
|
var _drawImageRef$current2;
|
|
(_drawImageRef$current2 = drawImageRef.current) === null || _drawImageRef$current2 === void 0 || _drawImageRef$current2.setShowCrop(false);
|
|
}
|
|
};
|
|
});
|
|
return /*#__PURE__*/React.createElement(Flex, {
|
|
style: {
|
|
border: "1px solid ".concat(token.colorBorder),
|
|
backgroundColor: token.colorBgBase
|
|
}
|
|
}, /*#__PURE__*/React.createElement("div", {
|
|
title: "\u76D2\u5B50\u5217\u8868",
|
|
style: {
|
|
width: '13.9%'
|
|
}
|
|
}, /*#__PURE__*/React.createElement(Title, null, "\u76D2\u5B50\u5217\u8868"), /*#__PURE__*/React.createElement("div", {
|
|
style: {
|
|
borderTop: "1px solid ".concat(token.colorBorder)
|
|
}
|
|
}, boxList.map(function (item) {
|
|
return /*#__PURE__*/React.createElement("p", {
|
|
key: item.id,
|
|
onClick: function onClick() {
|
|
return onSelect === null || onSelect === void 0 ? void 0 : onSelect(item.id, item);
|
|
},
|
|
style: {
|
|
margin: 0,
|
|
padding: "".concat(token.paddingXXS, "px ").concat(token.paddingLG, "px"),
|
|
cursor: 'pointer',
|
|
// @ts-ignore
|
|
color: selectedKey === item[rowKey] ? token.colorPrimary : token.colorText,
|
|
// @ts-ignore
|
|
backgroundColor: selectedKey === item[rowKey] ? token.blue1 : token.colorBgBase,
|
|
transition: '0.2s ease'
|
|
}
|
|
}, item.name);
|
|
}))), /*#__PURE__*/React.createElement("div", {
|
|
style: {
|
|
boxSizing: 'border-box',
|
|
width: '46.3%',
|
|
textAlign: 'center',
|
|
borderLeft: "1px solid ".concat(token.colorBorder),
|
|
borderRight: "1px solid ".concat(token.colorBorder)
|
|
}
|
|
}, type === 'single' ? /*#__PURE__*/React.createElement(BigImagePreview, {
|
|
ref: drawImageRef,
|
|
hideTypeBtns: true,
|
|
type: "CUSTOM",
|
|
screenshotButtonRender: function screenshotButtonRender() {
|
|
return /*#__PURE__*/React.createElement(React.Fragment, null);
|
|
}
|
|
// @ts-ignore
|
|
,
|
|
data: drawData,
|
|
onDraw: drawListener
|
|
}) : /*#__PURE__*/React.createElement("div", {
|
|
style: {
|
|
padding: '84px'
|
|
}
|
|
}, /*#__PURE__*/React.createElement(Image, {
|
|
width: '62.5%',
|
|
src: AlgorithmConfigImg,
|
|
preview: false,
|
|
fallback: ErrorImage
|
|
}), /*#__PURE__*/React.createElement("h2", null, "\u8BF7\u8FDB\u884C\u6279\u91CF\u914D\u7F6E"), /*#__PURE__*/React.createElement("ul", {
|
|
style: {
|
|
display: 'inline-block',
|
|
paddingLeft: 0,
|
|
width: '51.8%',
|
|
listStyle: 'none',
|
|
textAlign: 'left',
|
|
color: token.colorTextLabel
|
|
}
|
|
}, /*#__PURE__*/React.createElement("li", null, "\xB7 \u76D2\u5B50\u6279\u91CF\u914D\u7F6E\u4EC5\u652F\u6301\u540C\u578B\u53F7\u76D2\u5B50\uFF1B"), /*#__PURE__*/React.createElement("li", null, "\xB7 \u91C7\u53D6\u8986\u76D6\u5F0F\u66F4\u65B0\uFF0C\u4E0D\u4FDD\u7559\u539F\u6709\u914D\u7F6E\uFF0C\u4E14\u9884\u8B66\u68C0\u6D4B\u6846\u9ED8\u8BA4\u5168\u5C4F\u8303\u56F4\uFF1B"), /*#__PURE__*/React.createElement("li", null, "\xB7 \u4EBA\u6D41\u91CF\u7EDF\u8BA1\u9ED8\u8BA4\u68C0\u6D4B\u7EBF\u4E3A\u5C4F\u5E55\u4E2D\u592E\u6A2A\u5411\u7EBF\u6761\uFF0C\u4E14\u7BAD\u5934\u6307\u5411\u4E0B\u65B9\uFF1B"), /*#__PURE__*/React.createElement("li", null, "\xB7 \u4F18\u5148\u9009\u62E9\u62C9\u6D41\u6B63\u5E38\u7684\u6444\u50CF\u5934\u3002")))), /*#__PURE__*/React.createElement("div", {
|
|
style: {
|
|
width: '39.8%'
|
|
}
|
|
}, /*#__PURE__*/React.createElement("div", null, /*#__PURE__*/React.createElement(Title, null, "\u65F6\u95F4\u6A21\u677F"), /*#__PURE__*/React.createElement("div", {
|
|
style: {
|
|
padding: "".concat(token.paddingMD, "px ").concat(token.paddingSM, "px"),
|
|
borderTop: "1px solid ".concat(token.colorBorder),
|
|
borderBottom: "1px solid ".concat(token.colorBorder)
|
|
}
|
|
}, /*#__PURE__*/React.createElement(TimeTemplateTable, _extends({
|
|
dataSource: timeTemplateDataSource
|
|
}, timeTemplateTableProps)))), /*#__PURE__*/React.createElement("div", null, /*#__PURE__*/React.createElement(Title, null, "\u7B97\u6CD5\u5E94\u7528"), /*#__PURE__*/React.createElement("div", {
|
|
style: {
|
|
padding: "".concat(token.paddingMD, "px ").concat(token.paddingSM, "px"),
|
|
borderTop: "1px solid ".concat(token.colorBorder)
|
|
}
|
|
}, /*#__PURE__*/React.createElement(AlgorithmTable, _extends({
|
|
dataSource: algorithmTableDataSource,
|
|
tableType: type
|
|
}, algorithmTableProps))))));
|
|
});
|
|
export default AlgorithmConfig; |