app-base-react
Version:
react development common base package.
356 lines (306 loc) • 10.8 kB
JavaScript
"use strict";
Object.defineProperty(exports, "__esModule", {
value: true
});
var _modal = require("antd/lib/modal");
var _modal2 = _interopRequireDefault(_modal);
var _button = require("antd/lib/button");
var _button2 = _interopRequireDefault(_button);
var _message2 = require("antd/lib/message");
var _message3 = _interopRequireDefault(_message2);
var _form = require("antd/lib/form");
var _form2 = _interopRequireDefault(_form);
var _input = require("antd/lib/input");
var _input2 = _interopRequireDefault(_input);
var _extends = Object.assign || 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; };
var _slicedToArray = function () { function sliceIterator(arr, i) { var _arr = []; var _n = true; var _d = false; var _e = undefined; try { for (var _i = arr[Symbol.iterator](), _s; !(_n = (_s = _i.next()).done); _n = true) { _arr.push(_s.value); if (i && _arr.length === i) break; } } catch (err) { _d = true; _e = err; } finally { try { if (!_n && _i["return"]) _i["return"](); } finally { if (_d) throw _e; } } return _arr; } return function (arr, i) { if (Array.isArray(arr)) { return arr; } else if (Symbol.iterator in Object(arr)) { return sliceIterator(arr, i); } else { throw new TypeError("Invalid attempt to destructure non-iterable instance"); } }; }();
require("antd/lib/modal/style/css");
require("antd/lib/button/style/css");
require("antd/lib/message/style/css");
require("antd/lib/form/style/css");
require("antd/lib/input/style/css");
var _copyTextToClipboard = require("copy-text-to-clipboard");
var _copyTextToClipboard2 = _interopRequireDefault(_copyTextToClipboard);
var _react = require("react");
var _react2 = _interopRequireDefault(_react);
var _reactI18next = require("react-i18next");
var _dic = require("../../../../library/dic");
var _dic2 = _interopRequireDefault(_dic);
var _utils = require("../../utils");
var _hooks = require("../../utils/hooks");
var _core = require("./core");
var _core2 = _interopRequireDefault(_core);
function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
var TextArea = _input2.default.TextArea;
var defaultForm = function defaultForm() {
return _react2.default.createElement(
_form2.default,
{
name: "basic",
initialValues: {
remember: true
},
autoComplete: "off"
},
_react2.default.createElement(
_form2.default.Item,
{
name: "declarationUnit",
label: "\u7533\u62A5\u5355\u4F4D",
rules: [{
required: true,
message: '请填写申报单位!'
}]
},
_react2.default.createElement(_input2.default, null)
),
_react2.default.createElement(
_form2.default.Item,
{
name: "credit",
label: "\u7EDF\u4E00\u793E\u4F1A\u4FE1\u7528\u4EE3\u7801",
rules: [{
required: true,
message: '请输入统一社会信用代码!'
}]
},
_react2.default.createElement(_input2.default, null)
),
_react2.default.createElement(
_form2.default.Item,
{
name: "unitType",
label: "\u5355\u4F4D\u4E3B\u4F53\u7C7B\u578B",
rules: [{
required: true,
message: '请输入单位主体类型!'
}]
},
_react2.default.createElement(_dic2.default, { params: { app: 'project', type: '单位类型' } })
),
_react2.default.createElement(
_form2.default.Item,
{
name: "address",
label: "\u5355\u4F4D\u9A7B\u5730",
rules: [{
required: true,
message: '请输入单位驻地!'
}]
},
_react2.default.createElement(_input2.default, null)
),
_react2.default.createElement(
_form2.default.Item,
{
name: "contactName",
label: "\u8054\u7CFB\u4EBA",
rules: [{
required: true,
message: '请输入联系人!'
}]
},
_react2.default.createElement(_input2.default, null)
),
_react2.default.createElement(
_form2.default.Item,
{
name: "phone",
label: "\u8054\u7CFB\u7535\u8BDD",
rules: [{
required: true,
message: '请输入联系电话!'
}]
},
_react2.default.createElement(_input2.default, null)
),
_react2.default.createElement(
_form2.default.Item,
{
name: "email",
label: "\u8054\u7CFB\u90AE\u7BB1",
rules: [{
required: true,
message: '请输入联系邮箱!'
}]
},
_react2.default.createElement(_input2.default, null)
)
);
};
var Canvas = function Canvas(_ref) {
var onSelect = _ref.onSelect,
disabled = _ref.disabled;
var _useTranslation = (0, _reactI18next.useTranslation)(),
t = _useTranslation.t;
var setGlobal = (0, _hooks.useGlobal)();
var _useStore = (0, _hooks.useStore)(),
userProps = _useStore.userProps,
displaySchema = _useStore.displaySchema,
displaySchemaString = _useStore.displaySchemaString,
preview = _useStore.preview,
selected = _useStore.selected,
flatten = _useStore.flatten,
onChange = _useStore.onChange,
onSchemaChange = _useStore.onSchemaChange;
var _useSet = (0, _hooks.useSet)({
showModal: false,
showModal2: false,
schemaForImport: ""
}),
_useSet2 = _slicedToArray(_useSet, 2),
local = _useSet2[0],
setState = _useSet2[1];
var transformer = userProps.transformer,
_userProps$extraButto = userProps.extraButtons,
extraButtons = _userProps$extraButto === undefined ? [] : _userProps$extraButto,
showDefaultForm = userProps.showDefaultForm;
var toggleModal = function toggleModal() {
return setState({ showModal: !local.showModal });
};
var toggleModal2 = function toggleModal2() {
return setState({ showModal2: !local.showModal2 });
};
var onTextareaChange = function onTextareaChange(e) {
setState({ schemaForImport: e.target.value });
};
var importSchema = function importSchema() {
try {
var value = transformer.from((0, _utils.looseJsonParse)(local.schemaForImport));
setGlobal(function () {
return _extends({
selected: undefined
}, (0, _utils.schemaToState)(value));
});
onChange(value.formData || {});
onSchemaChange(value);
} catch (error) {
console.error(error, "catch");
_message3.default.info(t("格式不对哦，请重新尝试")); // 可以加个格式哪里不对的提示
}
toggleModal2();
};
var copySchema = function copySchema() {
(0, _copyTextToClipboard2.default)(displaySchemaString);
_message3.default.info(t("复制成功"));
toggleModal();
};
var clearSchema = function clearSchema() {
var schema = {
type: "object",
properties: {}
};
setGlobal({
schema: schema,
formData: {},
selected: undefined
});
onChange({});
onSchemaChange(schema);
};
(0, _react.useEffect)(function () {
if (!onSelect) return;
onSelect((0, _utils.idToSchema)(flatten, selected));
}, [selected]);
var _extraButtons = Array.isArray(extraButtons) ? extraButtons : [];
var _showDefaultBtns = _extraButtons.filter(function (item) {
return !(0, _utils.isObject)(item);
});
var _extraBtns = _extraButtons.filter(function (item) {
return (0, _utils.isObject)(item);
});
var getDefaultBtnText = function getDefaultBtnText(text, defaultText, index) {
if (typeof index === "number") {
if (Array.isArray(text)) return text[index];
return defaultText[index];
}
if (typeof text === "string") return text;
return defaultText;
};
return _react2.default.createElement(
"div",
{ className: "mid-layout pr2" },
disabled ? _react2.default.createElement(
"div",
{ style: { overflow: 'scroll' } },
showDefaultForm ? defaultForm() : '',
_react2.default.createElement(_core2.default, { preview: true, displaySchema: displaySchema })
) : _react2.default.createElement(
_react.Fragment,
null,
_react2.default.createElement(
"div",
{ className: "mv2 mh1" },
_showDefaultBtns[0] !== false && _react2.default.createElement(
_button2.default,
{
className: "mr2 mb1",
onClick: function onClick() {
setGlobal({ selected: "#", preview: !preview });
}
},
getDefaultBtnText(_showDefaultBtns[0], [t("开始编辑"), t("预览")], Number(!preview))
),
_extraBtns.map(function (item, idx) {
return _react2.default.createElement(
_button2.default,
_extends({
type: "primary",
key: idx.toString(),
className: "mr2"
}, item),
item.text || item.children
);
})
),
_react2.default.createElement(
"div",
{ className: "dnd-container " + (preview ? "preview" : "edit") },
_react2.default.createElement("div", { style: { height: preview ? 33 : 0 } }),
showDefaultForm ? defaultForm() : '',
_react2.default.createElement(_core2.default, { preview: preview, displaySchema: displaySchema })
),
_react2.default.createElement(
_modal2.default,
{
visible: local.showModal,
onOk: copySchema,
onCancel: toggleModal,
okText: t("复制"),
cancelText: t("取消")
},
_react2.default.createElement(
"div",
{ className: "mt3" },
_react2.default.createElement(TextArea, {
style: { fontSize: 12 },
value: displaySchemaString,
autoSize: { minRows: 10, maxRows: 30 }
})
)
),
_react2.default.createElement(
_modal2.default,
{
visible: local.showModal2,
okText: t("导入"),
cancelText: t("取消"),
onOk: importSchema,
onCancel: toggleModal2
},
_react2.default.createElement(
"div",
{ className: "mt3" },
_react2.default.createElement(TextArea, {
style: { fontSize: 12 },
value: local.schemaForImport,
placeholder: t("贴入需要导入的schema，模样可点击导出schema参考"),
onChange: onTextareaChange,
autoSize: { minRows: 10, maxRows: 30 }
})
)
)
)
);
};
exports.default = Canvas;