amis-theme-editor
Version:
amis主题编辑器
272 lines (266 loc) • 10.8 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 ThemeCollapseCommon = 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-collapse-content', activeId === edit.path && 'theme-component-content--active'),
onClick: function () {
handleEdit();
}
}, refreshToken === edit.path ? null : body)));
};
var ThemeCollapse = function (props) {
return {
title: i18nRuntime.i18n("fdf1b23f0ddfeb888519a33d71df753d"),
body: [{
title: i18nRuntime.i18n("e1371d733ff347664655629011b4130f"),
body: [{
title: i18nRuntime.i18n("18c63459a2c069022c7790430f761214"),
body: function (onEdit) {
return React__default["default"].createElement(ThemeCollapseCommon, {
activeId: props.activeId,
onEdit: onEdit,
title: i18nRuntime.i18n("18c63459a2c069022c7790430f761214"),
edit: {
title: i18nRuntime.i18n("c51efb736b7b9d54241ab06fd71e68b4"),
path: 'component.collapse.base.default.body',
body: tpl.getSchemaTpl('collapseGroup', [{
title: i18nRuntime.i18n("4092ed98e9035652d4c9ca9441701ed7"),
body: [{
type: 'amis-theme-wrapper',
label: false,
title: i18nRuntime.i18n("961534b4ea37e4e88aada736b299d063"),
body: [{
mode: 'default',
type: 'amis-theme-border',
name: 'border'
}]
}, {
type: 'amis-theme-wrapper',
label: false,
title: i18nRuntime.i18n("0103eb2d3dca70270d1a74e9ec987ac9"),
body: [{
mode: 'default',
type: 'amis-theme-radius',
disableBorder: true,
name: 'border'
}]
}]
}, {
title: i18nRuntime.i18n("030c8cb75e9707285b28c4931bfeddc5"),
body: [{
type: 'amis-theme-wrapper',
label: false,
title: i18nRuntime.i18n("841d77223f0ec8cd0b530ed8e0775b20"),
body: [{
mode: 'default',
type: 'amis-theme-padding-and-margin',
name: 'header-padding-and-margin',
hideMargin: true
}]
}, {
type: 'amis-theme-font-editor',
label: false,
hasSenior: false,
hideFontFamily: true,
name: 'header-font'
}, {
type: 'amis-theme-wrapper',
label: false,
title: i18nRuntime.i18n("6b36c6f7ec834692ec6c8e3816349fdd"),
body: [{
type: 'amis-theme-color-picker',
label: i18nRuntime.i18n("9ede71f52e1499d3968d09a97249ea6d"),
labelMode: 'input',
name: 'header-bg-color',
options: '${colorOptions}'
}, {
type: 'amis-theme-color-picker',
label: i18nRuntime.i18n("8b47539aaa82598d99b28094547418a8"),
labelMode: 'input',
name: 'header-hover-bg-color',
options: '${colorOptions}'
}, {
type: 'amis-theme-color-picker',
label: i18nRuntime.i18n("c0b513c835e841fbdbb0a117e8769161"),
labelMode: 'input',
name: 'header-hover-color',
options: '${colorOptions}'
}]
}, {
type: 'amis-theme-wrapper',
label: false,
title: i18nRuntime.i18n("710ad08b11419332713360d2750cd707"),
body: [{
type: 'amis-theme-color-picker',
label: i18nRuntime.i18n("8e1b944f4389bdaab6f11d5bc83190c8"),
labelMode: 'input',
name: 'disabled-header-bg-color',
options: '${colorOptions}'
}, {
type: 'amis-theme-color-picker',
label: i18nRuntime.i18n("7ec907e7059b758ace2f3adb9bb803ff"),
labelMode: 'input',
name: 'disabled-color',
options: '${colorOptions}'
}]
}]
}, {
title: i18nRuntime.i18n("132a78bdf68d6d17bde00aa807bbf032"),
body: [{
type: 'amis-theme-wrapper',
label: false,
title: i18nRuntime.i18n("841d77223f0ec8cd0b530ed8e0775b20"),
body: [{
mode: 'default',
type: 'amis-theme-padding-and-margin',
name: 'content-padding-and-margin',
hideMargin: true
}]
}, {
type: 'amis-theme-font-editor',
label: false,
hasSenior: false,
hideFontFamily: true,
name: 'content-font'
}, {
type: 'amis-theme-wrapper',
label: false,
title: i18nRuntime.i18n("6b36c6f7ec834692ec6c8e3816349fdd"),
body: [{
type: 'amis-theme-color-picker',
label: i18nRuntime.i18n("8e1b944f4389bdaab6f11d5bc83190c8"),
labelMode: 'input',
name: 'bg-color',
options: '${colorOptions}'
}]
}]
}])
},
body: amisCore.render({
type: 'collapse-group',
activeKey: ['1'],
body: [{
type: 'collapse',
key: '1',
header: i18nRuntime.i18n("17dcbf1f144607d4af0bb718e008682f"),
body: i18nRuntime.i18n("f7fb20f6cacd5e40c7f5732cb377d0bf")
}, {
type: 'collapse',
key: '2',
header: i18nRuntime.i18n("72d41bd9eb3882f7da6f55d0ff0a39f6"),
body: i18nRuntime.i18n("b8238063c31674ae07e69d1a22498c1d")
}, {
type: 'collapse',
key: '3',
header: i18nRuntime.i18n("5ee791c074edd8d49d78c16c20f36862"),
body: i18nRuntime.i18n("31001189cc3b5f124bc59731b3d9641f"),
disabled: true
}]
})
});
}
}, {
title: i18nRuntime.i18n("5ef69f62dc668c1a3e68b51c50a2530a"),
body: function (onEdit) {
return React__default["default"].createElement(ThemeCollapseCommon, {
activeId: props.activeId,
refreshToken: props.refreshToken,
onEdit: onEdit,
title: i18nRuntime.i18n("5ef69f62dc668c1a3e68b51c50a2530a"),
edit: {
title: i18nRuntime.i18n("774b2bcaca8a64f46c84b510cec89109"),
path: 'component.collapse.base.icon.body',
body: tpl.getSchemaTpl('normal', [{
name: 'icon',
label: i18nRuntime.i18n("598f69a9b640508d8e124fd7d33131f0"),
type: 'icon-select',
returnSvg: true,
onChange: function (svg) {
if (!svg && svg !== '') {
return;
}
setTimeout(function () {
props.handleReFreshToken('component.collapse.base.icon.body');
}, 400);
}
}, {
type: 'amis-theme-select',
name: 'size',
label: i18nRuntime.i18n("ef79da787ad206e5d5f8cf62e195c836"),
options: '${sizesOptions}'
}, {
type: 'amis-theme-color-picker',
label: i18nRuntime.i18n("988d7b545c09108379a54a1e6060f563"),
labelMode: 'input',
name: 'color',
options: '${colorOptions}'
}, {
type: 'amis-theme-select',
name: 'margin',
label: i18nRuntime.i18n("31e3752986d64c8b36897c8641c8628d"),
options: '${sizesOptions}'
}, {
type: 'input-number',
name: 'rotate',
label: i18nRuntime.i18n("76815cb6401ed99ee5d3944a9ae35015"),
unitOptions: ['deg']
}])
},
body: amisCore.render({
type: 'collapse-group',
activeKey: ['1'],
body: [{
type: 'collapse',
key: '1',
header: i18nRuntime.i18n("17dcbf1f144607d4af0bb718e008682f"),
body: i18nRuntime.i18n("f7fb20f6cacd5e40c7f5732cb377d0bf")
}, {
type: 'collapse',
key: '2',
header: i18nRuntime.i18n("72d41bd9eb3882f7da6f55d0ff0a39f6"),
body: i18nRuntime.i18n("b8238063c31674ae07e69d1a22498c1d")
}, {
type: 'collapse',
key: '3',
header: i18nRuntime.i18n("5ee791c074edd8d49d78c16c20f36862"),
body: i18nRuntime.i18n("31001189cc3b5f124bc59731b3d9641f")
}]
})
});
}
}]
}]
};
};
index.registerComponent('collapse', {
type: 'layout',
label: i18nRuntime.i18n("e90e6ff080f179215c3566a61ca62367"),
key: 'collapse',
component: function () {
return ThemeCollapse;
}
});