@wufengteam/inputs
Version:
平台提供的右侧属性编辑器，需要在主工程中注册
194 lines • 8.73 kB
JavaScript
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; }
/* eslint-disable no-unneeded-ternary */
/* eslint-disable no-nested-ternary */
import React, { useEffect, useState, useMemo } from 'react';
import { Modal, Select, Button, Form } from 'antd';
import { cssPrefixCls } from '../utils';
import "./index.css";
import { traverseAndExtractCodes } from './util';
var RespondModal = function RespondModal(_ref) {
var apiObject = _ref.apiObject,
targetfieldName = _ref.targetfieldName,
value = _ref.value,
onChange = _ref.onChange;
var _useState = useState(false),
_useState2 = _slicedToArray(_useState, 2),
visible = _useState2[0],
setVisible = _useState2[1];
var _useState3 = useState([]),
_useState4 = _slicedToArray(_useState3, 2),
bindData = _useState4[0],
setBindData = _useState4[1]; // 绑定节点
var _useState5 = useState([]),
_useState6 = _slicedToArray(_useState5, 2),
labaleDatas = _useState6[0],
setLableDatas = _useState6[1]; // 节点下的数据
var _Form$useForm = Form.useForm(),
_Form$useForm2 = _slicedToArray(_Form$useForm, 1),
form = _Form$useForm2[0];
var busiServiceId = (apiObject === null || apiObject === void 0 ? void 0 : apiObject.busiServiceId) || '';
useEffect(function () {
if (targetfieldName === (value === null || value === void 0 ? void 0 : value.targetfieldName)) {
form.setFieldsValue(value);
}
}, [value]);
useEffect(function () {
if (targetfieldName === (value === null || value === void 0 ? void 0 : value.targetfieldName)) {
if (value === null || value === void 0 ? void 0 : value.nodes) {
var labaleDatasTemp = bindData === null || bindData === void 0 ? void 0 : bindData.find(function (item) {
return item.value === (value === null || value === void 0 ? void 0 : value.nodes);
});
setLableDatas(labaleDatasTemp === null || labaleDatasTemp === void 0 ? void 0 : labaleDatasTemp.children);
}
}
}, [value, bindData]);
useEffect(function () {
// 当服务变化
if (targetfieldName === (value === null || value === void 0 ? void 0 : value.targetfieldName)) {
if (busiServiceId !== (value === null || value === void 0 ? void 0 : value.busiServiceId)) {
// 延时防止value没有变化
setTimeout(function () {
onChange === null || onChange === void 0 ? void 0 : onChange({});
form.resetFields();
}, 50);
}
}
// 初始化 获取出参数节点为数组,并且children有数据的
var bindDataTemp = [];
if ("".concat(apiObject === null || apiObject === void 0 ? void 0 : apiObject.scriptResultType) === '3') {
// 返回类型为列表
bindDataTemp = [{
attrType: 'objectArray',
children: apiObject === null || apiObject === void 0 ? void 0 : apiObject.responseJson,
code: 'resultObject',
label: "".concat(apiObject === null || apiObject === void 0 ? void 0 : apiObject.serviceName, "(\u6570\u7EC4)"),
name: '列表',
nickCode: 'resultObject',
serviceAttrId: '92723409373',
type: '1700',
value: 'resultObject'
}];
} else {
bindDataTemp = traverseAndExtractCodes(apiObject === null || apiObject === void 0 ? void 0 : apiObject.responseJson);
}
setBindData(bindDataTemp);
}, [JSON.stringify(apiObject === null || apiObject === void 0 ? void 0 : apiObject.responseJson)]);
var onFinish = function onFinish(values) {
onChange === null || onChange === void 0 ? void 0 : onChange(Object.assign(Object.assign({}, values), {
busiServiceId: busiServiceId,
targetfieldName: targetfieldName
}));
setVisible(false);
};
// 按钮信息，包含文字和可编辑状态
var benInfo = useMemo(function () {
if (apiObject && (apiObject === null || apiObject === void 0 ? void 0 : apiObject.busiServiceId)) {
if ((bindData === null || bindData === void 0 ? void 0 : bindData.length) === 0) {
return {
text: '无需配置',
disabled: true
};
}
if (value && JSON.stringify(value) !== '{}') {
return {
text: '已配置',
disabled: false
};
}
return {
text: '配置参数',
disabled: false
};
}
return {
text: '请先选择API',
disabled: true
};
}, [JSON.stringify(apiObject === null || apiObject === void 0 ? void 0 : apiObject.responseJson), value, bindData]);
return /*#__PURE__*/React.createElement(React.Fragment, null, /*#__PURE__*/React.createElement(Button, {
disabled: benInfo === null || benInfo === void 0 ? void 0 : benInfo.disabled,
onClick: function onClick() {
setVisible(true);
},
style: {
fontSize: '12px',
lineHeight: 'unset',
height: 'unset',
padding: '0 15px'
}
}, benInfo === null || benInfo === void 0 ? void 0 : benInfo.text), visible && ( /*#__PURE__*/React.createElement(Modal, {
visible: visible,
title: "\u8F93\u51FA\u53C2\u6570\u8BBE\u7F6E",
key: apiObject === null || apiObject === void 0 ? void 0 : apiObject.busiServiceId,
wrapClassName: "".concat(cssPrefixCls, "-respond-modalWrap"),
onOk: function onOk() {
form.submit();
},
onCancel: function onCancel() {
return setVisible(false);
}
}, /*#__PURE__*/React.createElement(Form, {
form: form,
onFinish: onFinish,
autoComplete: "off"
}, /*#__PURE__*/React.createElement(Form.Item, {
label: "\u7ED1\u5B9A\u8282\u70B9",
name: "nodes",
rules: [{
required: true,
message: '请选择绑定节点'
}]
}, /*#__PURE__*/React.createElement(Select, {
placeholder: "\u8BF7\u9009\u62E9\u7ED1\u5B9A\u8282\u70B9",
// fieldNames={{ label: 'name', value: 'code' }}
options: bindData,
onChange: function onChange(e) {
bindData.forEach(function (item) {
if ((item === null || item === void 0 ? void 0 : item.value) === e) {
setLableDatas(item === null || item === void 0 ? void 0 : item.children);
}
});
form.setFieldsValue({
labelKey: undefined
});
}
})), /*#__PURE__*/React.createElement(Form.Item, {
label: "\u663E\u793A\u5B57\u6BB5",
name: "labelKey",
rules: [{
required: true,
message: '请选择显示字段'
}]
}, /*#__PURE__*/React.createElement(Select, {
fieldNames: {
label: 'name',
value: 'code'
},
placeholder: "\u8BF7\u9009\u62E9\u663E\u793A\u5B57\u6BB5",
options: labaleDatas
}))))));
};
var SelectApiBindData = function SelectApiBindData(_ref2) {
var name = _ref2.name,
rules = _ref2.rules,
label = _ref2.label,
DSLCore = _ref2.DSLCore;
var _a;
var _ref3 = ((_a = DSLCore === null || DSLCore === void 0 ? void 0 : DSLCore.current) === null || _a === void 0 ? void 0 : _a.props) || {},
apiObject = _ref3.apiObject,
fieldName = _ref3.fieldName;
return /*#__PURE__*/React.createElement(Form.Item, {
label: label,
name: name,
rules: rules
}, /*#__PURE__*/React.createElement(RespondModal, {
apiObject: apiObject,
targetfieldName: fieldName
}));
};
export default SelectApiBindData;