@wufengteam/inputs
Version:
平台提供的右侧属性编辑器，需要在主工程中注册
282 lines • 12.7 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; }
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;
};
/* eslint-disable no-console */
import React, { useState, useEffect, useCallback } from 'react';
import { Button, Drawer, Form, Space, Select, Tooltip } from 'antd';
import { Page, Footer, Content, Header } from '@alita/flow';
import { QuestionCircleOutlined } from '@ant-design/icons';
import { wufengController } from '@wufengteam/core';
import AttrFilterForm from '@wufengteam/attrfilter';
import { DATA_MANAGE_FILTER_CONDITION, DATA_MANAGE_FILTER_FIELD_TYPE, ignoreComps } from './constants';
import { cssPrefixCls } from '../utils';
import "./index.css";
var useForm = Form.useForm;
var prefix = "".concat(cssPrefixCls, "-filter-attr");
/**
* 下拉 关联其他表单 -数据过滤
* @param param0
* @returns
*/
var AttrFilter = function AttrFilter(_ref) {
var value = _ref.value,
DSLCore = _ref.DSLCore,
tooltipText = _ref.tooltipText,
onChange = _ref.onChange;
var _a;
// selectAttr默认给[]，否则未选择显示字段的时候会报错
var _ref2 = ((_a = DSLCore === null || DSLCore === void 0 ? void 0 : DSLCore.current) === null || _a === void 0 ? void 0 : _a.props) || {},
otherForm = _ref2.otherForm;
var _useState = useState(otherForm),
_useState2 = _slicedToArray(_useState, 2),
selfBindForm = _useState2[0],
setSelfBindForm = _useState2[1];
var _useState3 = useState(value),
_useState4 = _slicedToArray(_useState3, 2),
options = _useState4[0],
setOptions = _useState4[1];
var _useState5 = useState('AND'),
_useState6 = _slicedToArray(_useState5, 2),
queryLogic = _useState6[0],
setQueryLogic = _useState6[1];
var components = DSLCore.querySelectAll('[compType=2]') || [];
var formOptions = components.filter(function (item) {
var _a;
return !ignoreComps.includes((_a = item === null || item === void 0 ? void 0 : item.attribute) === null || _a === void 0 ? void 0 : _a.compName);
}).map(function (i) {
var _a, _b;
return {
label: ((_a = i === null || i === void 0 ? void 0 : i.props) === null || _a === void 0 ? void 0 : _a.name) || ((_b = i === null || i === void 0 ? void 0 : i.attribute) === null || _b === void 0 ? void 0 : _b.label),
value: i === null || i === void 0 ? void 0 : i.id
};
});
var _useState7 = useState(false),
_useState8 = _slicedToArray(_useState7, 2),
visible = _useState8[0],
setVisible = _useState8[1];
var _useState9 = useState([]),
_useState10 = _slicedToArray(_useState9, 2),
selfValue = _useState10[0],
setSelfValue = _useState10[1];
var _useState11 = useState([]),
_useState12 = _slicedToArray(_useState11, 2),
variableList = _useState12[0],
setVariableList = _useState12[1];
var _useForm = useForm(),
_useForm2 = _slicedToArray(_useForm, 1),
form = _useForm2[0];
var confirm = function confirm() {
form.submit();
};
var onFinish = useCallback(function (values) {
// const newValue = values.map(({ attrCode = '', screenCondition = '', screenInput = '', screenConnection = 'and' }: any) => {
// return {
// targetAttrCode: screenInput,
// sourceAttrCode: attrCode,
// operator: screenCondition,
// or: screenConnection === 'or',
// }
// });
// #10685681 表单关联关系-后端需要关联组件中增加attrName和attrId两个属性
var newValue = values.map(function (it) {
var attrCode = it === null || it === void 0 ? void 0 : it.attrCode;
var filter = options === null || options === void 0 ? void 0 : options.find(function (opt) {
return (opt === null || opt === void 0 ? void 0 : opt.attrCode) === attrCode;
});
return Object.assign(Object.assign({}, it), {
attrName: filter === null || filter === void 0 ? void 0 : filter.attrName,
attrId: filter === null || filter === void 0 ? void 0 : filter.attrId,
queryLogic: queryLogic
});
});
setVisible(false);
onChange === null || onChange === void 0 ? void 0 : onChange(newValue);
}, [queryLogic]);
var onClose = function onClose() {
setVisible(false);
};
/**
* 查询表单的字段
*/
var queryFormFiledById = function queryFormFiledById(id, appId) {
if (!id || !appId) return;
wufengController.getAction('queryFormFiledById', {
catalogItemId: id,
appId: appId
}).then(function (res) {
var _ref3 = res || {},
resultObject = _ref3.resultObject,
resultCode = _ref3.resultCode;
if (res && resultCode === '0') {
if (Array.isArray(resultObject)) {
var optionsTemp = [];
// eslint-disable-next-line array-callback-return
resultObject.map(function (item) {
if (item.attrCode.includes('obj_') || (item === null || item === void 0 ? void 0 : item.queryFormFiledById) === 'flow') {
return;
}
optionsTemp.push({
attrCode: item.attrCode,
attrName: item.attrName,
busiObjectId: item.busiObjectId,
// children:item.children
compType: item.compType,
key: item.attrCode,
label: item.attrName,
staticCode: item.staticCode,
value: item.attrCode,
attrId: item.busiObjectAttrId
});
});
setOptions(optionsTemp);
}
}
});
};
var queryAllVariable = function queryAllVariable() {
wufengController.getAction('getAllVariable').then(function (res) {
if (res && Array.isArray(res) && (res === null || res === void 0 ? void 0 : res.length) > 0) {
setVariableList(res === null || res === void 0 ? void 0 : res.map(function (item) {
return {
label: item === null || item === void 0 ? void 0 : item.name,
value: item === null || item === void 0 ? void 0 : item.code
};
}));
}
});
};
useEffect(function () {
var _a;
if (Array.isArray(value) && value.length > 0) {
setQueryLogic(((_a = value[0]) === null || _a === void 0 ? void 0 : _a.queryLogic) || 'AND');
}
setSelfValue(value);
form === null || form === void 0 ? void 0 : form.setFieldsValue({
formShowColumnsList: value || []
});
}, [JSON.stringify(value)]);
useEffect(function () {
if (otherForm && selfBindForm && (otherForm === null || otherForm === void 0 ? void 0 : otherForm.catalogItemId) !== (selfBindForm === null || selfBindForm === void 0 ? void 0 : selfBindForm.catalogItemId)) {
form === null || form === void 0 ? void 0 : form.setFieldsValue({
formShowColumnsList: []
});
setSelfValue([]);
onChange === null || onChange === void 0 ? void 0 : onChange([]);
}
setSelfBindForm(otherForm);
queryFormFiledById(otherForm === null || otherForm === void 0 ? void 0 : otherForm.catalogItemId, otherForm === null || otherForm === void 0 ? void 0 : otherForm.appId);
queryAllVariable();
}, [JSON.stringify(otherForm)]);
return /*#__PURE__*/React.createElement(React.Fragment, null, /*#__PURE__*/React.createElement("div", {
onClick: function onClick(e) {
e.stopPropagation();
setVisible(!visible);
},
className: prefix
}, /*#__PURE__*/React.createElement("div", {
className: "".concat(prefix, "-select")
}, /*#__PURE__*/React.createElement(Select, {
value: (selfValue === null || selfValue === void 0 ? void 0 : selfValue.length) > 0 ? '已设置过滤条件' : '请设置',
dropdownStyle: {
display: 'none'
},
style: {
width: '100%'
}
})), tooltipText && ( /*#__PURE__*/React.createElement("div", {
className: "".concat(prefix, "-ques")
}, /*#__PURE__*/React.createElement(Tooltip, {
title: tooltipText
}, /*#__PURE__*/React.createElement(QuestionCircleOutlined, {
style: {
color: '#9E9E9E'
}
}))))), /*#__PURE__*/React.createElement(Drawer, {
closable: false,
title: "\u6570\u636E\u8FC7\u6EE4",
placement: "right",
width: 830,
onClose: onClose,
visible: visible
}, /*#__PURE__*/React.createElement(Page, null, /*#__PURE__*/React.createElement(Header, null, /*#__PURE__*/React.createElement("div", {
style: {
height: '50px'
}
})), /*#__PURE__*/React.createElement(Content, null, /*#__PURE__*/React.createElement("div", {
className: "".concat(prefix, "-header")
}, /*#__PURE__*/React.createElement("div", null, "\u7B26\u5408\u4EE5\u4E0B"), /*#__PURE__*/React.createElement(Select, {
value: queryLogic,
style: {
width: 65,
fontSize: 14
},
bordered: false,
size: "small",
options: [{
value: 'OR',
label: '任一'
}, {
value: 'AND',
label: '所有'
}],
onChange: function onChange(e) {
setQueryLogic(e);
}
}), /*#__PURE__*/React.createElement("div", null, "\u6761\u4EF6\u7684\u6570\u636E")), /*#__PURE__*/React.createElement("div", {
className: "".concat(prefix, "-AttrFilterForm")
}, /*#__PURE__*/React.createElement(AttrFilterForm, {
form: form,
addTitle: "\u589E\u52A0\u6761\u4EF6",
value: selfValue,
onChange: onFinish,
targetOptions: formOptions,
options: options,
variableList: variableList,
showOr: false,
showRelated: false,
ignoreKeyList: ['updator_id', 'created_name', 'creator_id', 'created_time', 'updated_name', 'updated_time', 'creator_org_name', 'creator_org_id', 'flow_status'],
filterCondition: DATA_MANAGE_FILTER_CONDITION,
filterFieldType: DATA_MANAGE_FILTER_FIELD_TYPE,
isShowValueType: true,
ignoreCompList: [
// 不需要展示的组件
'Attachments', 'Divider', 'DataLinkage', 'BindTable', 'Api', 'Text', 'RichTextEditor', 'WFView', 'WFTabs', 'SubForm'],
typeList: ['constant', 'variable']
}))), /*#__PURE__*/React.createElement(Footer, null, /*#__PURE__*/React.createElement(Space, {
size: "small",
style: {
padding: '11px 20px',
display: 'flex',
borderTop: '1px solid #EBEBF0',
flexDirection: 'row-reverse'
}
}, /*#__PURE__*/React.createElement(Button, {
type: "primary",
onClick: confirm
}, "\u786E\u8BA4"), /*#__PURE__*/React.createElement(Button, {
onClick: onClose
}, "\u53D6\u6D88"))))));
};
var SubFormFilterAttrOtherForm = function SubFormFilterAttrOtherForm(_a) {
var name = _a.name,
rules = _a.rules,
label = _a.label,
other = __rest(_a, ["name", "rules", "label"]);
return /*#__PURE__*/React.createElement(Form.Item, {
label: label,
name: name,
rules: rules
}, /*#__PURE__*/React.createElement(AttrFilter, Object.assign({}, other)));
};
export default SubFormFilterAttrOtherForm;