amis-theme-editor
Version:
amis主题编辑器
215 lines (208 loc) • 8.42 kB
JavaScript
/**
* amis-theme-editor v2.0.22-beta.2
* Copyright 2018-2023 @fex
*/
'use strict';
var React = require('react');
var amisCore = require('amis-core');
var tpl = require('../tpl.js');
var cx = require('classnames');
var index = require('./index.js');
var i18nRuntime = require('i18n-runtime');
function _interopDefaultLegacy (e) { return e && typeof e === 'object' && 'default' in e ? e : { 'default': e }; }
var React__default = /*#__PURE__*/_interopDefaultLegacy(React);
var cx__default = /*#__PURE__*/_interopDefaultLegacy(cx);
var ThemeWizardCommon = function (props) {
var title = props.title,
edit = props.edit,
body = props.body,
activeId = props.activeId,
refreshToken = props.refreshToken;
function handleEdit() {
props.onEdit(edit);
}
return React__default["default"].createElement(React__default["default"].Fragment, null, React__default["default"].createElement("div", {
className: "theme-component"
}, React__default["default"].createElement("div", {
className: "theme-component-title"
}, title), React__default["default"].createElement("div", {
className: cx__default["default"]('theme-component-content', 'theme-component-content-steps', activeId === edit.path && 'theme-component-content--active'),
onClick: function () {
handleEdit();
}
}, refreshToken === edit.path ? null : body)));
};
var ThemeWizard = function (props) {
return {
title: i18nRuntime.i18n("5a267ddca74be823927a80ea84b76efb"),
body: [{
title: 'Wizard',
body: [{
title: i18nRuntime.i18n("d19f2c10a4724688ff6be34e2c4d8343"),
body: function (onEdit) {
return React__default["default"].createElement(ThemeWizardCommon, {
activeId: props.activeId,
onEdit: onEdit,
title: i18nRuntime.i18n("4af1215ffa45b8245f055eb676fd6970"),
edit: {
title: i18nRuntime.i18n("2f1448085b4bec952ffdb627d136cf78"),
path: 'component.wizard.base',
body: tpl.getSchemaTpl('collapseGroup', [{
title: i18nRuntime.i18n("61a0f15d97d17d595dc75dd8b53eca10"),
body: [{
type: 'amis-theme-wrapper',
label: false,
title: i18nRuntime.i18n("841d77223f0ec8cd0b530ed8e0775b20"),
body: [{
type: 'amis-theme-padding-and-margin',
label: false,
hideMargin: true,
name: "step.body.padding"
}]
}, {
type: 'amis-theme-wrapper',
label: false,
title: i18nRuntime.i18n("f0496f26c805a20c5fcc6fc1cfddc9b7"),
body: [{
type: 'amis-theme-select',
name: 'badge.body.size',
options: '${sizesOptions}',
label: i18nRuntime.i18n("c8339fd2a85af4ba66084d28df808de4")
}, {
type: 'amis-theme-select',
name: 'badge.body.text-margin',
label: i18nRuntime.i18n("31e3752986d64c8b36897c8641c8628d"),
options: '${sizesOptions}'
}, {
type: 'amis-theme-select',
name: 'badge.body.border-width',
label: i18nRuntime.i18n("5babfafd769570de3bba47605753361a"),
options: '${borderWidthOptions}'
}, {
type: 'amis-theme-color-picker',
name: 'badge.body.border-color',
label: i18nRuntime.i18n("9b4bae5d8251de0b6f00b704936b00d3"),
labelMode: 'input'
}, {
type: 'amis-theme-color-picker',
name: 'badge.body.bg-color',
label: i18nRuntime.i18n("4573a75803e7724664b158582b7ed243"),
labelMode: 'input'
}]
}, {
type: 'amis-theme-font-editor',
title: i18nRuntime.i18n("eb22fddae8e458ea48368db22ae6ba73"),
label: false,
hasSenior: false,
hideFontFamily: true,
hideLineHeight: true,
hideFontWeight: true,
name: "badge.body.font"
}, {
type: 'amis-theme-font-editor',
title: i18nRuntime.i18n("eded9ed93a453c3f790126e30b776a22"),
label: false,
hasSenior: false,
hideFontFamily: true,
hideLineHeight: true,
hideFontWeight: true,
name: "step.body.font"
}, {
type: 'amis-theme-wrapper',
label: false,
title: i18nRuntime.i18n("b5a15cf44a9b3fd7efaf276c6738cda9"),
body: [{
type: 'amis-theme-color-picker',
name: 'after.body.color',
label: i18nRuntime.i18n("6b36c6f7ec834692ec6c8e3816349fdd"),
labelMode: 'input'
}]
}]
}, {
title: i18nRuntime.i18n("95eb4869cd31db47c51b62167a794b62"),
body: [{
type: 'amis-theme-wrapper',
label: false,
title: false,
body: [{
type: 'amis-theme-color-picker',
name: 'badge.body.onActive-color',
label: i18nRuntime.i18n("7905c0b8616905b9625e0924b6bab154"),
labelMode: 'input'
}, {
type: 'amis-theme-color-picker',
name: 'badge.body.onActive-bg-color',
label: i18nRuntime.i18n("0670e0f6db743d25b73e9d3c18dbe355"),
labelMode: 'input'
}, {
type: 'amis-theme-color-picker',
name: 'step.body.li-onActive-color',
label: i18nRuntime.i18n("eded9ed93a453c3f790126e30b776a22"),
labelMode: 'input'
}, {
type: 'amis-theme-color-picker',
name: 'after.body.onActive-color',
label: i18nRuntime.i18n("731ae15762357825abe4257e5d4f5509"),
labelMode: 'input'
}]
}]
}, {
title: i18nRuntime.i18n("132a78bdf68d6d17bde00aa807bbf032"),
body: [{
type: 'amis-theme-wrapper',
label: false,
title: i18nRuntime.i18n("841d77223f0ec8cd0b530ed8e0775b20"),
body: [{
type: 'amis-theme-padding-and-margin',
label: false,
hideMargin: true,
name: "stepContent.body.padding"
}]
}]
}])
},
body: amisCore.render({
type: 'wizard',
mode: 'horizontal',
steps: [{
title: i18nRuntime.i18n("863a8583132d087e57aebb7d89e18a50"),
body: [{
name: 'website',
label: i18nRuntime.i18n("b3b91f771617e69bdeb3610dcd28e766"),
type: 'input-url',
required: true
}]
}, {
title: i18nRuntime.i18n("9757f2c59c17e9aea46e0c8adb69597e"),
body: [{
name: 'email2',
label: i18nRuntime.i18n("3bc5e602b2d4c7fffe79258e2ac6952e"),
type: 'input-email',
required: true
}]
}, {
title: i18nRuntime.i18n("207e30c0e7318027d521dd7c6fab6a99"),
body: [i18nRuntime.i18n("bdefe31b3805f826bce721882336e335")]
}]
})
});
}
}]
}
// {
// title: '不同的状态',
// body: onEdit => {
// return <ThemeStatusColor {...props} onEdit={onEdit} />;
// }
// }
]
};
};
index.registerComponent('wizard', {
type: 'data-show',
label: i18nRuntime.i18n("5acec91385a3b9093e3c803f6b0d869a"),
key: 'wizard',
component: function () {
return ThemeWizard;
}
});