@wufengteam/inputs
Version:
平台提供的右侧属性编辑器，需要在主工程中注册
666 lines • 26.6 kB
JavaScript
function _typeof(o) { "@babel/helpers - typeof"; return _typeof = "function" == typeof Symbol && "symbol" == typeof Symbol.iterator ? function (o) { return typeof o; } : function (o) { return o && "function" == typeof Symbol && o.constructor === Symbol && o !== Symbol.prototype ? "symbol" : typeof o; }, _typeof(o); }
function _defineProperty(obj, key, value) { key = _toPropertyKey(key); if (key in obj) { Object.defineProperty(obj, key, { value: value, enumerable: true, configurable: true, writable: true }); } else { obj[key] = value; } return obj; }
function _toPropertyKey(t) { var i = _toPrimitive(t, "string"); return "symbol" == _typeof(i) ? i : i + ""; }
function _toPrimitive(t, r) { if ("object" != _typeof(t) || !t) return t; var e = t[Symbol.toPrimitive]; if (void 0 !== e) { var i = e.call(t, r || "default"); if ("object" != _typeof(i)) return i; throw new TypeError("@@toPrimitive must return a primitive value."); } return ("string" === r ? String : Number)(t); }
function _toConsumableArray(arr) { return _arrayWithoutHoles(arr) || _iterableToArray(arr) || _unsupportedIterableToArray(arr) || _nonIterableSpread(); }
function _nonIterableSpread() { throw new TypeError("Invalid attempt to spread non-iterable instance.\nIn order to be iterable, non-array objects must have a [Symbol.iterator]() method."); }
function _iterableToArray(iter) { if (typeof Symbol !== "undefined" && iter[Symbol.iterator] != null || iter["@@iterator"] != null) return Array.from(iter); }
function _arrayWithoutHoles(arr) { if (Array.isArray(arr)) return _arrayLikeToArray(arr); }
function _slicedToArray(arr, i) { return _arrayWithHoles(arr) || _iterableToArrayLimit(arr, i) || _unsupportedIterableToArray(arr, i) || _nonIterableRest(); }
function _nonIterableRest() { throw new TypeError("Invalid attempt to destructure non-iterable instance.\nIn order to be iterable, non-array objects must have a [Symbol.iterator]() method."); }
function _unsupportedIterableToArray(o, minLen) { if (!o) return; if (typeof o === "string") return _arrayLikeToArray(o, minLen); var n = Object.prototype.toString.call(o).slice(8, -1); if (n === "Object" && o.constructor) n = o.constructor.name; if (n === "Map" || n === "Set") return Array.from(o); if (n === "Arguments" || /^(?:Ui|I)nt(?:8|16|32)(?:Clamped)?Array$/.test(n)) return _arrayLikeToArray(o, minLen); }
function _arrayLikeToArray(arr, len) { if (len == null || len > arr.length) len = arr.length; for (var i = 0, arr2 = new Array(len); i < len; i++) arr2[i] = arr[i]; return arr2; }
function _iterableToArrayLimit(r, l) { var t = null == r ? null : "undefined" != typeof Symbol && r[Symbol.iterator] || r["@@iterator"]; if (null != t) { var e, n, i, u, a = [], f = !0, o = !1; try { if (i = (t = t.call(r)).next, 0 === l) { if (Object(t) !== t) return; f = !1; } else for (; !(f = (e = i.call(t)).done) && (a.push(e.value), a.length !== l); f = !0); } catch (r) { o = !0, n = r; } finally { try { if (!f && null != t.return && (u = t.return(), Object(u) !== u)) return; } finally { if (o) throw n; } } return a; } }
function _arrayWithHoles(arr) { if (Array.isArray(arr)) return arr; }
var __rest = this && this.__rest || function (s, e) {
var t = {};
for (var p in s) if (Object.prototype.hasOwnProperty.call(s, p) && e.indexOf(p) < 0) t[p] = s[p];
if (s != null && typeof Object.getOwnPropertySymbols === "function") for (var i = 0, p = Object.getOwnPropertySymbols(s); i < p.length; i++) {
if (e.indexOf(p[i]) < 0 && Object.prototype.propertyIsEnumerable.call(s, p[i])) t[p[i]] = s[p[i]];
}
return t;
};
import Icon, { PlusOutlined, EyeOutlined, QuestionCircleOutlined } from '@ant-design/icons';
import { Form, Button, Checkbox, Dropdown, Input, InputNumber, Menu, message, Modal, Popover, Select, Table, Tooltip } from 'antd';
import classnames from 'classnames';
import moment from 'moment';
import React, { useCallback, useEffect, useMemo, useRef, useState } from 'react';
import { DndProvider, useDrag, useDrop } from 'react-dnd';
import { HTML5Backend } from 'react-dnd-html5-backend';
import { DeleteIcon } from '../assets/svg/delete';
import { DropIcon } from '../assets/svg/drop';
import "./index.css";
import { createIntId } from '../utils/createId';
import { BUSI_CODE_RESET_CYCLE, BUSI_CODE_RULE, SUPPORT_COMPS } from './constants';
import { cssPrefixCls } from '../utils';
var Option = Select.Option;
var TableRow = function TableRow(_a) {
var index = _a.index,
moveRow = _a.moveRow,
className = _a.className,
record = _a.record,
keyName = _a.keyName,
restProps = __rest(_a, ["index", "moveRow", "className", "record", "keyName"]);
var ref = useRef();
var _useDrop = useDrop({
accept: 'ROW',
drop: function drop(item) {
moveRow(item.index, index);
},
collect: function collect(monitor) {
var _ref = monitor.getItem() || {},
dragIndex = _ref.index;
if (dragIndex === index) {
return {};
}
return {
isOver: monitor.isOver(),
dropClassName: dragIndex < index ? 'dropOverDownward' : 'dropOverUpward'
};
}
}),
_useDrop2 = _slicedToArray(_useDrop, 2),
_useDrop2$ = _useDrop2[0],
isOver = _useDrop2$.isOver,
dropClassName = _useDrop2$.dropClassName,
drop = _useDrop2[1];
var _useDrag = useDrag({
item: Object.assign(Object.assign({}, JSON.parse(JSON.stringify(record || {}))), {
type: 'ROW',
index: index
})
}),
_useDrag2 = _slicedToArray(_useDrag, 2),
drag = _useDrag2[1];
drop(drag(ref));
return /*#__PURE__*/React.createElement("tr", Object.assign({
ref: ref
}, restProps, {
className: "".concat(className, " ").concat(isOver ? dropClassName : '')
}));
};
var SerialNumberModal = function SerialNumberModal(props) {
var value = props.value,
onChange = props.onChange,
DSLCore = props.DSLCore;
var _Form$useForm = Form.useForm(),
_Form$useForm2 = _slicedToArray(_Form$useForm, 1),
form = _Form$useForm2[0];
var _useState = useState(false),
_useState2 = _slicedToArray(_useState, 2),
modalVisible = _useState2[0],
setModalVisible = _useState2[1];
var _useState3 = useState([]),
_useState4 = _slicedToArray(_useState3, 2),
attrs = _useState4[0],
setAttrs = _useState4[1];
useEffect(function () {
if (modalVisible) {
var allComps = DSLCore.querySelectAll('[compType=2]') || [];
var filterList = allComps.filter(function (item) {
var _a;
return SUPPORT_COMPS.includes((_a = item === null || item === void 0 ? void 0 : item.attribute) === null || _a === void 0 ? void 0 : _a.compName);
}); // 过滤可以引用的组件
var attrsTemp = [];
filterList === null || filterList === void 0 ? void 0 : filterList.map(function (item) {
var _a, _b, _c, _d;
var attrCode = (_b = (_a = item === null || item === void 0 ? void 0 : item.attribute) === null || _a === void 0 ? void 0 : _a.props) === null || _b === void 0 ? void 0 : _b.fieldName;
var attrName = (_d = (_c = item === null || item === void 0 ? void 0 : item.attribute) === null || _c === void 0 ? void 0 : _c.props) === null || _d === void 0 ? void 0 : _d.name;
attrsTemp.push({
attrCode: attrCode,
attrName: attrName
});
});
setAttrs(attrsTemp);
}
}, [modalVisible]);
// useEffect(() => {
// setRuleDatas(value || []);
// }, [value, modalVisible]);
var setFieldsValue = form.setFieldsValue;
var formItemLayout = {
labelCol: {
xs: {
span: 24
},
sm: {
span: 7
}
},
wrapperCol: {
xs: {
span: 24
},
sm: {
span: 17
}
}
};
var formItemPopover = {
labelCol: {
xs: {
span: 24
},
sm: {
span: 8
}
},
wrapperCol: {
xs: {
span: 24
},
sm: {
span: 16
}
}
};
// const systemTimeformItemPopover = {
// labelCol: {
// xs: { span: 24 },
// sm: { span: 8 },
// },
// wrapperCol: {
// xs: { span: 24 },
// sm: { span: 24 },
// },
// };
var _useState5 = useState([]),
_useState6 = _slicedToArray(_useState5, 2),
ruleDatas = _useState6[0],
setRuleDatas = _useState6[1];
var _useState7 = useState(),
_useState8 = _slicedToArray(_useState7, 2),
focusRow = _useState8[0],
setFocusRow = _useState8[1];
var _useState9 = useState(false),
_useState10 = _slicedToArray(_useState9, 2),
popoverVisible = _useState10[0],
setPopoverVisible = _useState10[1];
// 系统时间自定义浮框
// const [systemTimePopoverVisible, setSystemTimePopoverVisible] = useState(false);
var _useState11 = useState({}),
_useState12 = _slicedToArray(_useState11, 2),
popoverValues = _useState12[0],
setPopoverValues = _useState12[1]; // 气泡框自定义表单值
// const [systemTimepopoverValues, setSystemTimePopoverValues] = useState<any>({}); // 气泡框自定义表单值
var BUSI_CODE_RESET_CYCLE_OBJ = useMemo(function () {
var obj = {};
(BUSI_CODE_RESET_CYCLE || []).forEach(function (o) {
obj[o.attrValue] = o.attrValueName;
});
return obj;
}, [BUSI_CODE_RESET_CYCLE]);
useEffect(function () {
if (BUSI_CODE_RULE === null || BUSI_CODE_RULE === void 0 ? void 0 : BUSI_CODE_RULE.length) {
var _datas = [];
var ruleValues = {};
var _attrs = (value === null || value === void 0 ? void 0 : value.assignmentRuleObj) && (value === null || value === void 0 ? void 0 : value.assignmentRuleObj.split('|')[0].split(';'));
(_attrs || ['FIXED', 'SYSTIME', 'AUTOINCR']).forEach(function (attr) {
var _attr$split = attr.split('='),
_attr$split2 = _slicedToArray(_attr$split, 2),
_key = _attr$split2[0],
_val = _attr$split2[1];
var curRule = BUSI_CODE_RULE.find(function (r) {
return r.attrValue === _key;
});
var params = Object.assign(Object.assign({}, curRule || {}), {
keyId: createIntId()
});
if (_val) {
var ruleVal = _val;
if (_key === 'AUTOINCR') {
var valObj = _val && JSON.parse(_val);
ruleVal = "".concat(valObj.length || 0, "\u4F4D\u6570\u5B57\uFF0C").concat(BUSI_CODE_RESET_CYCLE_OBJ[valObj.resetCycle] || '');
setPopoverValues(valObj);
params.ruleValLength = valObj.length;
}
ruleValues["".concat(params.keyId, "-").concat(params.attrValue)] = ruleVal;
params.ruleVal = ruleVal;
}
_datas.push(params);
});
setRuleDatas(_datas);
}
}, [BUSI_CODE_RULE, value]);
// 样例
var ruleDemo = useMemo(function () {
if (ruleDatas.length) {
var valueString = [];
ruleDatas.forEach(function (at) {
var attrValue = at.attrValue,
ruleVal = at.ruleVal,
ruleValLength = at.ruleValLength;
var ruleValTemp = ruleVal;
if (!ruleVal) {
ruleValTemp = '-';
} else {
if (attrValue === 'SYSTIME') {
ruleValTemp = moment().format(ruleVal);
}
if (attrValue === 'RELATTR') {
ruleValTemp = 'XX';
}
if (attrValue === 'AUTOINCR') {
ruleValTemp = ruleValLength < 1 ? [] : new Array(ruleValLength).fill(0).fill(1, ruleValLength - 1);
ruleValTemp = Array.isArray(ruleValTemp) && ruleValTemp.join('');
}
}
valueString.push(ruleValTemp);
});
return valueString;
}
return ['-', '-', '-'];
}, [value, JSON.stringify(ruleDatas)]);
var components = {
body: {
row: TableRow
}
};
// 拖拽移动
var moveRow = useCallback(function (dragIndex, hoverIndex) {
var datas = _toConsumableArray(ruleDatas);
// eslint-disable-next-line prefer-destructuring
datas[hoverIndex] = datas.splice(dragIndex, 1, datas[hoverIndex])[0];
if (dragIndex !== hoverIndex) {
setRuleDatas(datas);
}
}, [ruleDatas]);
// 删除规则, 至少保留一个规则
var handleDelete = function handleDelete(_, index) {
if ((ruleDatas === null || ruleDatas === void 0 ? void 0 : ruleDatas.length) < 2) {
message.warning('至少保留一个规则');
return;
}
if (index === focusRow) {
setFocusRow({});
}
// eslint-disable-next-line no-shadow
var _datas = ruleDatas.filter(function (_, ind) {
return ind !== index;
});
setRuleDatas(_datas);
};
// 自定义气泡框确定
var handlePopoverSure = function handlePopoverSure(key, index) {
form.validateFields(['length', 'keepIncrement', 'resetCycle']).then(function (data) {
var _value = "".concat(data.length || 0, "\u4F4D\u6570\u5B57\uFF0C").concat(BUSI_CODE_RESET_CYCLE_OBJ[data.resetCycle] || '');
setFieldsValue(_defineProperty({}, key, _value));
setRuleDatas(function (pre) {
return pre.map(function (p, idx) {
if (index === idx) {
p.ruleVal = _value;
p.ruleValLength = data.length;
}
return p;
});
});
setPopoverValues(data);
setPopoverVisible(false);
});
};
var FormClassRender = function FormClassRender(row, index) {
var updateRuleDatas = function updateRuleDatas(_value) {
setRuleDatas(function (pre) {
return pre.map(function (p, idx) {
if (index === idx) {
p.ruleVal = _value;
}
return p;
});
});
};
switch (row.attrValue) {
case 'SYSTIME':
return /*#__PURE__*/React.createElement(Select, {
onChange: updateRuleDatas
}, ['YYYYMMDD', 'YYYYMM', 'YYMMDD', 'MMDD', 'YYYY'].map(function (y) {
return /*#__PURE__*/React.createElement(Option, {
value: y,
key: y
}, y);
}));
case 'AUTOINCR':
return /*#__PURE__*/React.createElement(Input, {
readOnly: true
});
// 低代码暂不支持自定义事件 故屏蔽
// case 'SYSTIME':
// return <Input readOnly />;
case 'RELATTR':
return /*#__PURE__*/React.createElement(Select, {
onChange: updateRuleDatas
}, (attrs || []).map(function (attr) {
return /*#__PURE__*/React.createElement(Option, {
value: attr.attrCode,
key: attr.attrCode
}, attr.attrName);
}));
default:
return /*#__PURE__*/React.createElement(Input, {
onChange: function onChange(e) {
return updateRuleDatas(e.target.value);
}
});
}
};
// 自增长数字自定义
var content = function content(key, index) {
return /*#__PURE__*/React.createElement(React.Fragment, null, /*#__PURE__*/React.createElement("div", {
className: "content"
}, /*#__PURE__*/React.createElement(Form.Item, Object.assign({}, formItemPopover, {
label: "\u6570\u5B57\u957F\u5EA6",
labelAlign: "left",
name: "length",
initialValue: popoverValues.length || 5,
rules: [{
required: true,
message: '数字长度不能为空'
}]
}), /*#__PURE__*/React.createElement(InputNumber, {
min: 1,
max: 10
})), /*#__PURE__*/React.createElement(Form.Item, Object.assign({}, formItemPopover, {
label: " ",
colon: false,
labelAlign: "left",
className: "item",
name: "keepIncrement",
valuePropName: "checked",
initialValue: popoverValues.keepIncrement || true
}), /*#__PURE__*/React.createElement(Checkbox, null, "\u8D85\u51FA\u957F\u5EA6\u540E\u7EE7\u7EED\u9012\u589E", /*#__PURE__*/React.createElement(Tooltip, {
title: "\u5982\u679C\u4E0D\u52FE\u9009\uFF0C\u8D85\u51FA\u957F\u5EA6\u540E\u81EA\u52A8\u91CD\u7F6E"
}, /*#__PURE__*/React.createElement("span", {
className: "icons"
}, /*#__PURE__*/React.createElement(QuestionCircleOutlined, {
width: 16,
height: 16,
className: "icon"
}))))), /*#__PURE__*/React.createElement(Form.Item, Object.assign({}, formItemPopover, {
label: "\u91CD\u7F6E\u5468\u671F",
labelAlign: "left",
name: "resetCycle",
rules: [{
required: true,
message: '重置周期不能为空'
}],
initialValue: popoverValues.resetCycle
}), /*#__PURE__*/React.createElement(Select, null, (BUSI_CODE_RESET_CYCLE || []).map(function (attr) {
return /*#__PURE__*/React.createElement(Option, {
value: attr.attrValue,
key: attr.attrValue
}, attr.attrValueName);
})))), /*#__PURE__*/React.createElement("div", {
className: "footer"
}, /*#__PURE__*/React.createElement(Button, {
size: "small",
type: "primary",
onClick: function onClick() {
return handlePopoverSure(key, index);
}
}, "\u786E\u5B9A")));
};
// const handleSystemTimePopoverSure = (key, index) => {
// const _value = systemTimepopoverValues?.type === 1 ? systemTimepopoverValues?.defaultValue : systemTimepopoverValues?.customValue;
// setFieldsValue({
// [key]: _value,
// });
// setRuleDatas((pre: any) =>
// pre.map((p: any, idx) => {
// if (index === idx) {
// p.ruleVal = _value;
// }
// return p;
// }),
// );
// setSystemTimePopoverVisible(false);
// };
// const systemTimeTypeChange = (v: any) => {
// setSystemTimePopoverValues({
// ...systemTimepopoverValues,
// type: v.target.value,
// });
// };
// const timeFormat = format => {
// return moment().format(format);
// };
// const systemTimeInputChange = v => {
// setSystemTimePopoverValues({
// ...systemTimepopoverValues,
// customValue: v.target.value,
// });
// };
// const onSelectChange = v => {
// setSystemTimePopoverValues({
// ...systemTimepopoverValues,
// defaultValue: v,
// });
// };
// const systemTimeContent = (key, index) => (
// <>
// <div className="content">
// <Radio.Group name="type" onChange={systemTimeTypeChange} value={systemTimepopoverValues.type}>
// <Radio value={1} className="radioGropWrap">
// 预定义格式
// </Radio>
// <Select
// onChange={onSelectChange}
// disabled={systemTimepopoverValues?.type === 2}
// value={systemTimepopoverValues?.defaultValue}
// options={TIME_FORMAT}
// />
// <Radio value={2} className="radioGropWrap" style={{ marginTop: 7 }}>
// 自定义格式
// </Radio>
// <Input
// className="customWrap"
// value={systemTimepopoverValues?.customValue}
// onChange={systemTimeInputChange}
// disabled={systemTimepopoverValues?.type === 1}
// />
// <span className="hintWrap">格式预览{timeFormat(systemTimepopoverValues?.customValue)}</span>
// </Radio.Group>
// </div>
// <div className="footer">
// <Button size="small" type="primary" onClick={() => handleSystemTimePopoverSure(key, index)}>
// 确定
// </Button>
// </div>
// </>
// );
var tableColumns = function tableColumns() {
return [{
title: '',
dataIndex: 'attrValueName',
key: 'attrValueName',
render: function render(_, row, index) {
return (
/*#__PURE__*/
// eslint-disable-next-line jsx-a11y/mouse-events-have-key-events
React.createElement("div", {
className: classnames('line', index === focusRow ? 'activeLine' : ''),
onMouseOver: function onMouseOver() {
return setFocusRow(index);
}
}, /*#__PURE__*/React.createElement("div", {
className: "seq"
}, index === focusRow && /*#__PURE__*/React.createElement(Icon, {
component: DropIcon,
width: 16,
height: 16
}), index === focusRow ? "\u7B2C".concat(index + 1, "\u6761") : ''), /*#__PURE__*/React.createElement(Form.Item, {
label: row.attrValueName,
labelAlign: "left",
name: "".concat(row.keyId, "-").concat(row.attrValue),
rules: [{
required: true,
message: "".concat(row.attrValueName, "\u4E0D\u80FD\u4E3A\u7A7A")
}],
initialValue: row.ruleVal
}, FormClassRender(row, index)), /*#__PURE__*/React.createElement("span", {
className: "delete",
onClick: function onClick() {
return handleDelete(row, index);
}
}, /*#__PURE__*/React.createElement(Icon, {
component: DeleteIcon,
width: 16,
height: 16
})), row.attrValue === 'AUTOINCR' && ( /*#__PURE__*/React.createElement(Popover, {
placement: "right",
content: content("".concat(row.keyId, "-").concat(row.attrValue), index),
overlayClassName: "".concat(cssPrefixCls, "-popover"),
visible: popoverVisible,
trigger: "click",
onVisibleChange: function onVisibleChange(vis) {
return setPopoverVisible(vis);
}
}, /*#__PURE__*/React.createElement("span", {
className: "cust",
onClick: function onClick() {
setPopoverVisible(true);
}
}, "\u81EA\u5B9A\u4E49"))))
);
}
}];
};
// 添加规则
var handleAdd = function handleAdd(row) {
var rowTemp = JSON.parse(JSON.stringify(row));
rowTemp.keyId = createIntId();
(ruleDatas || []).push(rowTemp);
setRuleDatas(_toConsumableArray(ruleDatas));
};
// 设置规则完成确认
var handleOk = function handleOk(values) {
setModalVisible(false);
var paramsString = '';
ruleDatas.forEach(function (rule) {
var _key = "".concat(rule.keyId, "-").concat(rule.attrValue);
var _val = rule.attrValue === 'AUTOINCR' ? JSON.stringify(popoverValues) : values[_key];
paramsString += "".concat(paramsString ? ';' : '').concat(rule.attrValue, "=").concat(_val || '');
});
if (paramsString && onChange instanceof Function) {
var obj = {
assignmentRuleCode: 'business',
assignmentRuleObj: paramsString.includes('RELATTR=') ? "".concat(paramsString, "|businessRelAttr}") : "".concat(paramsString, "|").concat(new Date().getTime())
};
onChange(obj);
}
};
var selectRules = useMemo(function () {
return ruleDatas.map(function (ru) {
return ru.attrValue;
}) || [];
}, [ruleDatas]);
// 规则下拉
var menu = useMemo(function () {
return /*#__PURE__*/React.createElement(Menu, null, (BUSI_CODE_RULE || []).map(function (lable, index) {
var _disabled = false;
// 固定字符和引用字段可以重复添加，各种最多添加2个。超过2个，禁用。其他的则添加一次
if (['FIXED', 'RELATTR'].includes(lable.attrValue)) {
_disabled = (selectRules.filter(function (r) {
return r === lable.attrValue;
}) || []).length >= 5;
} else {
_disabled = selectRules.includes(lable.attrValue);
}
return /*#__PURE__*/React.createElement(Menu.Item, {
key: index,
disabled: _disabled
}, /*#__PURE__*/React.createElement("a", {
onClick: function onClick() {
return handleAdd(lable);
}
}, lable.attrValueName));
}));
}, [selectRules]);
var getReleContent = function getReleContent() {
if (ruleDemo && (ruleDemo === null || ruleDemo === void 0 ? void 0 : ruleDemo.join('')) !== '---') {
return ruleDemo;
}
return '请设置';
};
return /*#__PURE__*/React.createElement("div", {
className: "".concat(cssPrefixCls, "-serialNumberWrap")
}, /*#__PURE__*/React.createElement("div", {
className: "rulesWrap",
title: getReleContent()
}, getReleContent()), /*#__PURE__*/React.createElement("div", {
className: "setBtn",
onClick: function onClick() {
setModalVisible(!modalVisible);
}
}, "\u8BBE\u7F6E"), /*#__PURE__*/React.createElement(Modal, {
visible: modalVisible,
title: "\u6D41\u6C34\u53F7\u89C4\u5219\u8BBE\u7F6E",
width: 720,
// height={560}
// zIndex={900}
maskClosable: false,
wrapClassName: "".concat(cssPrefixCls, "-modal"),
// getContainer={MainRef?.current}
onCancel: function onCancel() {
setModalVisible(false);
},
onOk: function onOk() {
form.submit();
}
}, /*#__PURE__*/React.createElement("div", {
className: "container"
}, /*#__PURE__*/React.createElement("div", {
className: "demo"
}, /*#__PURE__*/React.createElement(EyeOutlined, {
className: "icon",
width: 12,
height: 12
}), /*#__PURE__*/React.createElement("span", null, "\u9884\u89C8"), ruleDemo.map(function (lab, index) {
return /*#__PURE__*/React.createElement("span", {
key: index,
className: "label"
}, lab);
})), /*#__PURE__*/React.createElement("div", {
className: "title"
}, /*#__PURE__*/React.createElement("div", null, "\u6D41\u6C34\u53F7\u89C4\u5219"), /*#__PURE__*/React.createElement(Dropdown, {
overlay: menu,
placement: "bottomLeft",
overlayClassName: "".concat(cssPrefixCls, "-menu")
}, /*#__PURE__*/React.createElement(Button, {
icon: /*#__PURE__*/React.createElement(PlusOutlined, null),
type: "ghost",
size: "small"
}, "\u65B0\u589E\u89C4\u5219"))), /*#__PURE__*/React.createElement(DndProvider, {
backend: HTML5Backend
}, /*#__PURE__*/React.createElement(Form, Object.assign({}, formItemLayout, {
form: form,
onFinish: handleOk,
autoComplete: "off"
}), ruleDatas.length > 0 && ( /*#__PURE__*/React.createElement(Table, {
columns: tableColumns(),
dataSource: ruleDatas,
components: components,
pagination: false,
className: "table",
rowKey: "keyId",
onRow: function onRow(_, index) {
return {
index: index,
moveRow: moveRow
};
}
})))))));
};
var Test = function Test(props) {
var name = props.name,
rules = props.rules,
label = props.label,
DSLCore = props.DSLCore;
return /*#__PURE__*/React.createElement(Form.Item, {
label: label,
name: name,
rules: rules
}, /*#__PURE__*/React.createElement(SerialNumberModal, {
DSLCore: DSLCore
}));
};
export default Test;