guoshujing/dooring
1
0
Fork 0
Code Issues Pull Requests Packages Projects Releases Wiki Activity

update 0.9.0

Browse Source
This commit is contained in:
hufeixiong
2021-08-27 16:28:19 +08:00
parent d73c14af95
commit 23d73e1597
18 changed files with 542 additions and 79 deletions
Download Patch File Download Diff File Expand all files Collapse all files

4
CHANGELOG.md
View File

@@ -1,5 +1,9 @@
## changelog
## 0.9.0
增加react-intl，修改部分样式。
## 0.8.4
增加preview的属性，可外界控制loading。

1
packages/dooringx-doc/package.json
View File

@@ -1,6 +1,7 @@
{
"name": "dooringx-doc",
"version": "0.0.1",
"private":true,
"scripts": {
"start": "svelte-kit dev",
"dev": "svelte-kit dev",

4
packages/dooringx-doc/src/changelog/1.1.md
View File

@@ -4,6 +4,10 @@ order: 1
---
## changelog
## 0.9.0
增加react-intl，修改部分样式。
## 0.8.4
增加preview的属性，可外界控制loading。

2
packages/dooringx-doc/src/docs/3.6.md
View File

@@ -1,5 +1,5 @@
---
title: 命令
title: 命令开发
sTitle: dooringx-lib插件开发
order: 14
---

27
packages/dooringx-example/src/layouts/index.tsx
View File

@@ -2,7 +2,7 @@
* @Author: yehuozhili
* @Date: 2021-07-07 14:51:17
* @LastEditors: yehuozhili
* @LastEditTime: 2021-08-12 14:37:38
* @LastEditTime: 2021-08-27 14:45:47
* @FilePath: \dooringx\packages\dooringx-example\src\layouts\index.tsx
*/
import { Button } from 'antd';
@@ -14,9 +14,12 @@ import plugin from '../plugin';
import 'antd/dist/antd.css';
import '../global.less';
import 'animate.css';
import { IntlProvider } from 'react-intl';
import { locale } from 'dooringx-lib';
import { localeKey } from '../../../dooringx-lib/dist/locale';
export const config = new UserConfig(plugin);
export const configContext = createContext<UserConfig>(config);
// 自定义右键
const contextMenuState = config.getContextMenuState();
const unmountContextMenu = contextMenuState.unmountContextMenu;
@@ -70,6 +73,22 @@ const ContextMenu = () => {
};
contextMenuState.contextMenu = <ContextMenu></ContextMenu>;
export default function Layout({ children }: IRouteComponentProps) {
return <configContext.Provider value={config}>{children}</configContext.Provider>;
interface LocaleContextType {
change: Function;
current: localeKey;
}
export const LocaleContext = createContext<LocaleContextType>({
change: () => {},
current: 'zh-CN',
});
export default function Layout({ children }: IRouteComponentProps) {
const [l, setLocale] = useState<localeKey>('zh-CN');
return (
<LocaleContext.Provider value={{ change: setLocale, current: l }}>
<IntlProvider messages={locale.localeMap[l]} locale={l} defaultLocale={l}>
<configContext.Provider value={config}>{children}</configContext.Provider>
</IntlProvider>
</LocaleContext.Provider>
);
}

16
packages/dooringx-example/src/pages/index.tsx
View File

@@ -2,7 +2,7 @@
* @Author: yehuozhili
* @Date: 2021-05-15 12:49:28
* @LastEditors: yehuozhili
* @LastEditTime: 2021-08-19 16:52:35
* @LastEditTime: 2021-08-27 16:24:39
* @FilePath: \dooringx\packages\dooringx-example\src\pages\index.tsx
*/
import {
@@ -16,10 +16,12 @@ import {
} from 'dooringx-lib';
import { InsertRowBelowOutlined } from '@ant-design/icons';
import { useContext } from 'react';
import { configContext } from '@/layouts';
import { configContext, LocaleContext } from '@/layouts';
import { useCallback } from 'react';
import { PREVIEWSTATE } from '@/constant';
import { Button, Popover } from 'antd';
import { localeKey } from '../../../dooringx-lib/dist/locale';
export const HeaderHeight = '40px';
const footerConfig = function () {
return (
@@ -33,6 +35,7 @@ const footerConfig = function () {
export default function IndexPage() {
const config = useContext(configContext);
const locale = useContext(LocaleContext);
const everyFn = () => {};
@@ -59,6 +62,15 @@ export default function IndexPage() {
>
普通预览
</Button>
<Button
onClick={() => {
locale.change((pre: localeKey) => {
return pre === 'zh-CN' ? 'en' : 'zh-CN';
});
}}
>
切换语言
</Button>
</div>
<div
style={{

3
packages/dooringx-lib/package.json
View File

@@ -1,5 +1,5 @@
{
"version": "0.8.4",
"version": "0.9.0",
"license": "MIT",
"main": "dist/index.js",
"module": "dist/dooringx-lib.esm.js",
@@ -48,6 +48,7 @@
"deepcopy": "^2.1.0",
"nanoid": "^3.1.23",
"react-color": "^2.19.3",
"react-intl": "^5.20.10",
"react-sortable-hoc": "^2.0.0"
}
}

196
packages/dooringx-lib/src/components/control.tsx
View File

@@ -10,13 +10,14 @@ import {
UnorderedListOutlined,
VideoCameraOutlined,
} from '@ant-design/icons';
import { Button, Divider, Form, Input, List, Modal, Popconfirm, Popover } from 'antd';
import { Button, Divider, Form, Input, List, message, Modal, Popconfirm, Popover } from 'antd';
import React, { CSSProperties, PropsWithChildren, useState } from 'react';
import { UserConfig } from '..';
import { IBlockType, IStoreData } from '../core/store/storetype';
import { deepCopy, arrayMove, changeItem, changeLayer, focusEle } from '../core/utils';
import { SortEnd, SortableContainer, SortableElement, SortableHandle } from 'react-sortable-hoc';
import { wrapperMoveState } from './wrapperMove/event';
import { FormattedMessage, IntlShape, useIntl } from 'react-intl';
export interface ControlProps {
config: UserConfig;
style?: CSSProperties;
@@ -24,7 +25,7 @@ export interface ControlProps {
const DragHandle = SortableHandle(() => <MenuOutlined />);
const SortableItem = SortableElement(
({ value }: { value: { value: IBlockType; config: UserConfig } }) => (
({ value }: { value: { value: IBlockType; config: UserConfig; intl: IntlShape } }) => (
<div
style={{
userSelect: 'none',
@@ -47,47 +48,84 @@ const SortableItem = SortableElement(
<Divider type="vertical"></Divider>
<div style={{ width: 200 }}>
<Popconfirm
title="确认变更为绝对定位吗？"
title={value.intl.formatMessage({
id: 'contorl.popup.absolute',
defaultMessage: '确认变更为绝对定位吗',
})}
onConfirm={() => {
changeItem(value.config.getStore(), value.value.id, 'position', 'absolute');
}}
okText={value.intl.formatMessage({ id: 'yes' })}
cancelText={value.intl.formatMessage({ id: 'no' })}
>
<Button type="link" title="切换绝对定位" icon={<FullscreenOutlined />}></Button>
<Button
type="link"
title={value.intl.formatMessage({
id: 'contorl.absolute',
defaultMessage: '切换绝对定位',
})}
icon={<FullscreenOutlined />}
></Button>
</Popconfirm>
<Popconfirm
title="确认变更为静态定位吗？"
title={value.intl.formatMessage({
id: 'contorl.popup.static',
defaultMessage: '确认变更为静态定位吗',
})}
onConfirm={() => {
changeItem(value.config.getStore(), value.value.id, 'position', 'static');
}}
okText={value.intl.formatMessage({ id: 'yes' })}
cancelText={value.intl.formatMessage({ id: 'no' })}
>
<Button type="link" title="切换静态定位" icon={<FullscreenExitOutlined />}></Button>
<Button
type="link"
title={value.intl.formatMessage({
id: 'contorl.static',
defaultMessage: '切换静态定位',
})}
icon={<FullscreenExitOutlined />}
></Button>
</Popconfirm>
<Button
type="link"
title="选中聚焦"
title={value.intl.formatMessage({ id: 'control.focus', defaultMessage: '选中聚焦' })}
icon={<CompressOutlined />}
onClick={() => {
focusEle(value.config.getStore(), value.value.id);
}}
></Button>
<Popconfirm
title="确认删除操作吗？"
title={value.intl.formatMessage({
id: 'control.popup.delete',
defaultMessage: '确认删除吗',
})}
onConfirm={() => {
changeLayer(value.config.getStore(), value.value.id, 'delete');
}}
okText={value.intl.formatMessage({ id: 'yes' })}
cancelText={value.intl.formatMessage({ id: 'no' })}
>
<Button icon={<DeleteOutlined />} title="删除" type="link"></Button>
<Button
icon={<DeleteOutlined />}
title={value.intl.formatMessage({ id: 'control.delete', defaultMessage: '删除' })}
type="link"
></Button>
</Popconfirm>
</div>
</div>
)
);
const SortableList = SortableContainer(
({ items }: { items: { data: IBlockType[]; config: UserConfig } }) => {
({ items }: { items: { data: IBlockType[]; config: UserConfig; intl: IntlShape } }) => {
return (
<div>
{items.data.map((value, index: number) => (
<SortableItem key={value.id} index={index} value={{ value, config: items.config }} />
<SortableItem
key={value.id}
index={index}
value={{ value, config: items.config, intl: items.intl }}
/>
))}
</div>
);
@@ -131,9 +169,13 @@ export function Control(props: PropsWithChildren<ControlProps>) {
store.setData(cloneData);
};
const intl = useIntl();
const content =
data.length === 0 ? (
<div>暂时没有组件</div>
<div>
<FormattedMessage id="control.no-component" defaultMessage="暂无组件"></FormattedMessage>
</div>
) : (
<div style={{ maxHeight: 300, overflow: 'auto' }}>
<SortableList
@@ -142,6 +184,7 @@ export function Control(props: PropsWithChildren<ControlProps>) {
items={{
data,
config: props.config,
intl: intl,
}}
onSortEnd={onSortEnd}
axis="y"
@@ -203,15 +246,17 @@ export function Control(props: PropsWithChildren<ControlProps>) {
onClick={() => {
setVisible(true);
}}
style={{ width: '100px', overflow: 'hidden', textOverflow: 'ellipsis' }}
>
新建弹窗
<FormattedMessage id="modal.new" defaultMessage="新建弹窗"></FormattedMessage>
</Button>
<Button
onClick={() => {
setConfigVisible(true);
}}
style={{ width: '100px', overflow: 'hidden', textOverflow: 'ellipsis' }}
>
弹窗配置
<FormattedMessage id="modal.control" defaultMessage="弹窗配置"></FormattedMessage>
</Button>
</div>
}
@@ -237,7 +282,7 @@ export function Control(props: PropsWithChildren<ControlProps>) {
</div>
<Modal
title="弹窗配置"
title={intl.formatMessage({ id: 'modal.control', defaultMessage: '弹窗配置' })}
visible={configVisible}
onOk={() => setConfigVisible(false)}
onCancel={() => setConfigVisible(false)}
@@ -245,7 +290,12 @@ export function Control(props: PropsWithChildren<ControlProps>) {
>
<List>
{props.config.getStoreChanger().getState().modalEditName !== '' && (
<div>请退出编辑弹窗后再打开该配置</div>
<div>
<FormattedMessage
id="modal.popup.exit"
defaultMessage="请退出编辑弹窗后再打开该配置"
></FormattedMessage>
</div>
)}
{props.config.getStoreChanger().getState().modalEditName === '' &&
Object.keys(props.config.getStore().getData().modalMap).map((v) => {
@@ -254,13 +304,39 @@ export function Control(props: PropsWithChildren<ControlProps>) {
key={v}
actions={[
<Popconfirm
title="是否切换至该弹窗并进行编辑?"
title={intl.formatMessage({
id: 'modal.popup.edit',
defaultMessage: '是否切换至该弹窗并进行编辑?',
})}
onConfirm={() => {
props.config.getStoreChanger().updateModal(props.config.getStore(), v);
const sign = props.config
.getStoreChanger()
.updateModal(props.config.getStore(), v);
if (!sign.success && sign.sign === 0) {
message.error(
intl.formatMessage({
id: 'modal.popup.save',
defaultMessage: '请保存弹窗后编辑其他弹窗',
})
);
}
if (!sign.success && sign.sign === 1) {
message.error(
intl.formatMessage(
{
id: 'modal.popup.notfond',
defaultMessage: '未找到该弹窗 {name}',
},
{
name: sign.param,
}
)
);
}
setConfigVisible(false);
}}
okText={'是'}
cancelText={'否'}
okText={intl.formatMessage({ id: 'yes' })}
cancelText={intl.formatMessage({ id: 'no' })}
>
<Button type="link">修改</Button>
</Popconfirm>,
@@ -268,13 +344,42 @@ export function Control(props: PropsWithChildren<ControlProps>) {
<Popconfirm
title="您确定要删除这个弹窗吗?"
onConfirm={() => {
props.config.getStoreChanger().removeModal(props.config.getStore(), v);
const sign = props.config
.getStoreChanger()
.removeModal(props.config.getStore(), v);
if (!sign.success && sign.sign === 0) {
message.error(
intl.formatMessage({
id: 'modal.popup.save',
defaultMessage: '请保存弹窗后编辑其他弹窗',
})
);
}
if (!sign.success && sign.sign === 1) {
message.error(
intl.formatMessage(
{
id: 'modal.popup.notfond',
defaultMessage: '未找到该弹窗 {name}',
},
{
name: sign.param,
}
)
);
}
setConfigVisible(false);
}}
okText={'是'}
cancelText={'否'}
okText={intl.formatMessage({ id: 'yes' })}
cancelText={intl.formatMessage({ id: 'no' })}
>
<Button type="link">删除</Button>
<Button type="link">
<FormattedMessage
id="control.delete"
defaultMessage="删除"
></FormattedMessage>
</Button>
</Popconfirm>,
]}
>
@@ -284,7 +389,9 @@ export function Control(props: PropsWithChildren<ControlProps>) {
})}
{props.config.getStoreChanger().getState().modalEditName === '' &&
Object.keys(props.config.getStore().getData().modalMap).length === 0 && (
<div style={{ textAlign: 'center' }}>暂时没有弹窗</div>
<div style={{ textAlign: 'center' }}>
<FormattedMessage id="modal.popup.nomodal"></FormattedMessage>
</div>
)}
</List>
</Modal>
@@ -295,22 +402,53 @@ export function Control(props: PropsWithChildren<ControlProps>) {
.then((values) => {
form.resetFields();
const modalName = values.modalName;
props.config.getStoreChanger().newModalMap(props.config.getStore(), modalName);
const sign = props.config
.getStoreChanger()
.newModalMap(props.config.getStore(), modalName);
if (sign.succeess && sign.sign === 0) {
message.error(
intl.formatMessage({
id: 'modal.popup.save',
defaultMessage: '请保存弹窗后编辑其他弹窗',
})
);
}
if (sign.succeess && sign.sign === 1) {
message.error(
intl.formatMessage(
{
id: 'modal.popup.repeat',
defaultMessage: '已有重名弹窗 {name}',
},
{
name: sign.param,
}
)
);
}
setVisible(false);
})
.catch((info) => {
console.log('Validate Failed:', info);
});
}}
title="新增弹窗"
title={intl.formatMessage({ id: 'modal.new', defaultMessage: '新增弹窗' })}
onCancel={() => setVisible(false)}
visible={visible}
>
<Form layout="vertical" name="basic" form={form}>
<Form.Item
label="弹窗名称"
label={intl.formatMessage({ id: 'modal.name', defaultMessage: '弹窗名称' })}
name="modalName"
rules={[{ required: true, message: '请输入弹窗名称!' }]}
rules={[
{
required: true,
message: intl.formatMessage({
id: 'modal.popup.name',
defaultMessage: '请输入弹窗名称!',
}),
},
]}
>
<Input />
</Form.Item>

1
packages/dooringx-lib/src/components/leftConfig.tsx
View File

@@ -158,7 +158,6 @@ function LeftConfig(props: LeftConfigProps) {
style={{ flex: 1 }}
defaultSelectedKeys={[menuSelect]}
mode="vertical"
inlineCollapsed={props.showName ? undefined : true}
className={`${styles.menuWidth} ${styles.menus} yh-menu`}
>
{leftMapRenderListCategory.map((v, i) => {

73
packages/dooringx-lib/src/components/rightConfig.tsx
View File

@@ -2,19 +2,25 @@
* @Author: yehuozhili
* @Date: 2021-03-14 05:42:13
* @LastEditors: yehuozhili
* @LastEditTime: 2021-08-09 14:37:24
* @LastEditTime: 2021-08-27 16:20:29
* @FilePath: \dooringx\packages\dooringx-lib\src\components\rightConfig.tsx
*/
import { CreateOptionsRes } from '../core/components/formTypes';
import { IBlockType, IStoreData } from '../core/store/storetype';
import { PropsWithChildren, useEffect, useMemo, useState } from 'react';
import { CSSProperties, PropsWithChildren, useEffect, useMemo, useState } from 'react';
import React from 'react';
import { Tabs, Input, Row, Col, Checkbox, InputNumber } from 'antd';
import UserConfig from '../config';
import { RGBColor, SketchPicker } from 'react-color';
import { rgba2Obj } from '../core/utils';
import deepcopy from 'deepcopy';
import { FormattedMessage } from 'react-intl';
const colStyle: CSSProperties = {
display: 'flex',
alignItems: 'center',
justifyContent: 'flex-end',
};
interface RightConfigProps {
state: IStoreData;
config: UserConfig;
@@ -32,7 +38,6 @@ function RightConfig(props: PropsWithChildren<RightConfigProps>) {
const rightMapRenderListCategory = useMemo(() => {
return props.config.getConfig().rightRenderListCategory;
}, [props.config]);
const store = props.config.getStore();
useEffect(() => {
@@ -79,7 +84,14 @@ function RightConfig(props: PropsWithChildren<RightConfigProps>) {
);
});
} else {
return <div>还没有配置属性</div>;
return (
<div>
<FormattedMessage
id="right.noprops"
defaultMessage="还没有配置属性"
></FormattedMessage>
</div>
);
}
}
return null;
@@ -152,13 +164,13 @@ function RightConfig(props: PropsWithChildren<RightConfigProps>) {
{!current && !isEdit && !customGlobal && (
<div style={{ padding: '20px' }}>
<Row style={{ padding: '10px 0 20px 0', fontWeight: 'bold', userSelect: 'none' }}>
全局设置
<FormattedMessage id="right.global" defaultMessage="全局设置"></FormattedMessage>
</Row>
<Row style={{ padding: '10px 0' }}>
<Col span={6} style={{ userSelect: 'none' }}>
标题
<FormattedMessage id="title" defaultMessage="标题"></FormattedMessage>
</Col>
<Col span={18}>
<Col span={18} style={colStyle}>
<Input
value={title}
onChange={(e) => {
@@ -182,9 +194,12 @@ function RightConfig(props: PropsWithChildren<RightConfigProps>) {
</Row>
<Row style={{ padding: '10px 0' }}>
<Col span={6} style={{ userSelect: 'none' }}>
容器高度
<FormattedMessage
id="right.containerheight"
defaultMessage="容器高度"
></FormattedMessage>
</Col>
<Col span={18}>
<Col span={18} style={colStyle}>
<InputNumber
min={0}
value={props.config.getStore().getData().container.height}
@@ -208,9 +223,12 @@ function RightConfig(props: PropsWithChildren<RightConfigProps>) {
</Row>
<Row style={{ padding: '10px 0' }}>
<Col span={6} style={{ userSelect: 'none' }}>
容器底色
<FormattedMessage
id="right.containerColor"
defaultMessage="容器底色"
></FormattedMessage>
</Col>
<Col span={18}>
<Col span={18} style={colStyle}>
{
<div style={{ position: 'relative' }}>
<div
@@ -236,7 +254,13 @@ function RightConfig(props: PropsWithChildren<RightConfigProps>) {
</div>
{colorPickerVisible && (
<>
<div style={{ position: 'absolute', zIndex: 2000 }}>
<div
style={{
position: 'absolute',
zIndex: 2000,
transform: `translate(-100%, 0px)`,
}}
>
<SketchPicker
color={color}
onChange={(c) => {
@@ -276,9 +300,9 @@ function RightConfig(props: PropsWithChildren<RightConfigProps>) {
</Row>
<Row style={{ padding: '10px 0' }}>
<Col span={6} style={{ userSelect: 'none' }}>
body底色
<FormattedMessage id="right.bodyColor" defaultMessage="body底色"></FormattedMessage>
</Col>
<Col span={18}>
<Col span={18} style={colStyle}>
{
<div style={{ position: 'relative' }}>
<div
@@ -304,7 +328,13 @@ function RightConfig(props: PropsWithChildren<RightConfigProps>) {
</div>
{colorPickerVisible2 && (
<>
<div style={{ position: 'absolute', zIndex: 2000 }}>
<div
style={{
position: 'absolute',
zIndex: 2000,
transform: `translate(-100%, 0px)`,
}}
>
<SketchPicker
color={color2}
onChange={(c) => {
@@ -347,10 +377,17 @@ function RightConfig(props: PropsWithChildren<RightConfigProps>) {
{!current && !isEdit && customGlobal && customGlobal(props.config)}
{!current && isEdit && (
<div style={{ padding: '20px' }} className="yh-tcsz">
<Row style={{ padding: '10 0 20px 0', fontWeight: 'bold' }}>弹窗设置</Row>
<Row style={{ padding: '10 0 20px 0', fontWeight: 'bold' }}>
<FormattedMessage id="modal.control" defaultMessage="弹窗配置"></FormattedMessage>
</Row>
<Row style={{ padding: '10px 0' }}>
<Col span={8}>取消点击删除弹窗</Col>
<Col span={16} style={{ textAlign: 'right' }}>
<Col span={8}>
<FormattedMessage
id="modal.control.remove"
defaultMessage="取消点击删除弹窗"
></FormattedMessage>
</Col>
<Col span={16} style={{ ...colStyle }}>
<Checkbox
checked={originData ? originData.modalConfig[modalName] : false}
onChange={(e) => {

5
packages/dooringx-lib/src/components/timeLine/timeline.tsx
View File

@@ -2,7 +2,7 @@
* @Author: yehuozhili
* @Date: 2021-08-09 15:15:25
* @LastEditors: yehuozhili
* @LastEditTime: 2021-08-16 20:30:03
* @LastEditTime: 2021-08-27 14:16:07
* @FilePath: \dooringx\packages\dooringx-lib\src\components\timeLine\timeline.tsx
*/
import deepcopy from 'deepcopy';
@@ -21,6 +21,7 @@ import {
iter,
} from './timelineItem';
import { specialCoList } from '../../core/utils/special';
import { FormattedMessage } from 'react-intl';
export interface TimeLineProps {
style?: CSSProperties;
@@ -181,7 +182,7 @@ export function TimeLine(props: TimeLineProps) {
height: itemHeight,
}}
>
组件名称
<FormattedMessage id="timeline.name" defaultMessage="组件名称"></FormattedMessage>
<span
title="play"
style={{

68
packages/dooringx-lib/src/core/storeChanger/index.ts
View File

@@ -2,11 +2,10 @@
* @Author: yehuozhili
* @Date: 2021-04-05 14:55:31
* @LastEditors: yehuozhili
* @LastEditTime: 2021-08-06 16:21:01
* @LastEditTime: 2021-08-27 10:38:58
* @FilePath: \dooringx\packages\dooringx-lib\src\core\storeChanger\index.ts
*/
import { message } from 'antd';
import Store from '../store';
import { IStoreData } from '../store/storetype';
import { createUid, deepCopy } from '../utils';
@@ -129,14 +128,19 @@ export class StoreChanger {
newModalMap(store: Store, name: string) {
const sign = this.isEdit();
if (sign) {
message.error('请保存弹窗后编辑其他弹窗');
return;
return {
succeess: false,
sign: 0,
};
}
//新建modal name不能重名，否则直接报错
const sign2 = this.isInModalMap(store, name);
if (sign2) {
message.error(`已有重名弹窗:${name}`);
return;
return {
succeess: false,
sign: 1,
param: name,
};
}
storeChangerState.modalEditName = name;
this.map[ORIGIN] = {
@@ -145,6 +149,10 @@ export class StoreChanger {
now: store.getStoreList()[store.getIndex()],
};
store.resetToInitData([defaultModalStore()]);
return {
succeess: true,
sign: -1,
};
}
/**
@@ -156,8 +164,10 @@ export class StoreChanger {
closeModal(store: Store) {
const sign = this.isEdit();
if (!sign) {
message.error('您并没有正在编辑弹窗');
return;
return {
success: false,
sign: 0,
};
}
const main = this.map[ORIGIN];
const tmpModalData = deepCopy(store.getData());
@@ -167,7 +177,15 @@ export class StoreChanger {
cloneData.modalMap[storeChangerState.modalEditName] = tmpModalData;
store.setData(cloneData);
storeChangerState.modalEditName = '';
return {
success: true,
sign: 0,
};
}
return {
success: false,
sign: 1,
};
}
/**
@@ -180,13 +198,18 @@ export class StoreChanger {
updateModal(store: Store, name: string) {
const sign = this.isEdit();
if (sign) {
message.error('请保存弹窗后编辑其他弹窗');
return;
return {
success: false,
sign: 0,
};
}
const sign2 = this.isInModalMap(store, name);
if (!sign2) {
message.error(`未找到该弹窗:${name}`);
return;
return {
success: false,
sign: 1,
param: name,
};
}
storeChangerState.modalEditName = name;
const modalData = store.getData().modalMap[name];
@@ -196,6 +219,10 @@ export class StoreChanger {
now: store.getStoreList()[store.getIndex()],
};
store.resetToInitData([modalData]);
return {
success: true,
sign: -1,
};
}
/**
@@ -209,16 +236,25 @@ export class StoreChanger {
removeModal(store: Store, name: string) {
const sign = this.isEdit();
if (sign) {
message.error('请保存弹窗后删除其他弹窗');
return;
return {
success: false,
sign: 0,
};
}
const sign2 = this.isInModalMap(store, name);
if (!sign2) {
message.error(`未找到该弹窗:${name}`);
return;
return {
success: false,
sign: 1,
param: name,
};
}
const cloneData: IStoreData = deepCopy(store.getData());
delete cloneData.modalMap[name];
store.setData(cloneData);
return {
success: true,
sign: -1,
};
}
}

16
packages/dooringx-lib/src/core/utils/index.ts
View File

@@ -85,7 +85,15 @@ export const focusEle = (store: Store, id: string) => {
store.setData(clonedata);
};
export const changeLayer = (store: Store, id: string, action: 'up' | 'down' | 'delete') => {
export const changeLayer = (
store: Store,
id: string,
action: 'up' | 'down' | 'delete',
msg = {
adjust: '该组件不可调整',
remove: '该组件无法删除',
}
) => {
const clonedata: IStoreData = deepCopy(store.getData());
let index = -1;
switch (action) {
@@ -93,7 +101,7 @@ export const changeLayer = (store: Store, id: string, action: 'up' | 'down' | 'd
clonedata.block.forEach((v, i) => {
if (v.id === id) {
if (specialCoList.includes(v.name)) {
message.error('该组件不可调整');
message.error(msg.adjust);
return;
} else {
index = i;
@@ -114,7 +122,7 @@ export const changeLayer = (store: Store, id: string, action: 'up' | 'down' | 'd
clonedata.block.forEach((v, i) => {
if (v.id === id) {
if (specialCoList.includes(v.name)) {
message.error('该组件不可调整');
message.error(msg.adjust);
return;
} else {
index = i;
@@ -144,7 +152,7 @@ export const changeLayer = (store: Store, id: string, action: 'up' | 'down' | 'd
if (candelete) {
store.setData(clonedata);
} else {
message.error('该组件无法删除');
message.error(msg.remove);
}
return;
}

4
packages/dooringx-lib/src/index.tsx
View File

@@ -2,7 +2,7 @@
* @Author: yehuozhili
* @Date: 2021-03-14 04:22:18
* @LastEditors: yehuozhili
* @LastEditTime: 2021-07-20 10:44:35
* @LastEditTime: 2021-08-27 14:21:09
* @FilePath: \dooringx\packages\dooringx-lib\src\index.tsx
*/
@@ -59,3 +59,5 @@ export { default as IframeContainer } from './components/iframeContainer';
export { default as IframeContainerWrapper } from './components/IframeWrapperMove';
export { useIframePostMessage, useIframeHook } from './hooks';
export { IframeTarget } from './components/iframeTarget';
//locale
export * as locale from './locale';

41
packages/dooringx-lib/src/locale/en.ts Normal file
View File

@@ -0,0 +1,41 @@
/*
* @Author: yehuozhili
* @Date: 2021-08-27 10:20:23
* @LastEditors: yehuozhili
* @LastEditTime: 2021-08-27 16:06:49
* @FilePath: \dooringx\packages\dooringx-lib\src\locale\en.ts
*/
import { zhCN } from './zh-CN';
export const en: typeof zhCN = {
'timeline.name': 'Component name',
'contorl.popup.absolute': 'Are you sure to change to absolutely positioned element',
'contorl.popup.static': 'Are you sure to change to static positioned element',
'contorl.absolute': 'Change to absolute',
'contorl.static': 'Change to static',
'control.popup.delete': 'Are you sure to delete',
'control.delete': 'Delete',
'control.focus': 'Focus',
'control.no-component': 'No components',
'modal.new': 'New modal',
'modal.control': 'Control modal',
'modal.popup.exit': 'Please exit the edit modal and open the configuration again',
'modal.popup.edit': 'Switch to this modal and edit it?',
'modal.popup.save': 'Please save the modal and edit another modal',
'modal.popup.notfond': 'Can not found {name} modal',
'modal.popup.repeat': 'Duplicate name {name} already exists',
'modal.popup.remove': 'Please save the modal before deleting',
'modal.popup.nomodal': 'No modal',
'modal.popup.name': 'Please enter modal name',
'modal.name': 'Modal name',
'modal.control.remove': 'Delete click to delete the effect of the modal',
yes: 'yes',
no: 'no',
'right.noprops': 'No properties have been configured',
'right.global': 'Global config',
'right.containerheight': 'Container height',
'right.containerColor': 'Container background color',
'right.bodyColor': 'Body background color',
title: 'title',
};

18
packages/dooringx-lib/src/locale/index.ts Normal file
View File

@@ -0,0 +1,18 @@
/*
* @Author: yehuozhili
* @Date: 2021-08-27 10:20:38
* @LastEditors: yehuozhili
* @LastEditTime: 2021-08-27 14:30:05
* @FilePath: \dooringx\packages\dooringx-lib\src\locale\index.ts
*/
import { en } from './en';
import { zhCN } from './zh-CN';
export const localeMap = {
'zh-CN': zhCN,
en,
};
export type localeKey = keyof typeof localeMap;
export { en } from './en';
export { zhCN } from './zh-CN';

38
packages/dooringx-lib/src/locale/zh-CN.ts Normal file
View File

@@ -0,0 +1,38 @@
/*
* @Author: yehuozhili
* @Date: 2021-08-27 10:20:15
* @LastEditors: yehuozhili
* @LastEditTime: 2021-08-27 16:06:45
* @FilePath: \dooringx\packages\dooringx-lib\src\locale\zh-CN.ts
*/
export const zhCN = {
'timeline.name': '组件名称',
'contorl.popup.absolute': '确认变更为绝对定位吗',
'contorl.popup.static': '确认变更为静态定位吗',
'contorl.absolute': '切换绝对定位',
'contorl.static': '切换静态定位',
'control.popup.delete': '确认删除吗',
'control.delete': '删除',
'control.focus': '选中聚焦',
'control.no-component': '暂无组件',
'modal.new': '新增弹窗',
'modal.control': '弹窗配置',
'modal.popup.exit': '请退出编辑弹窗后再打开该配置',
'modal.popup.edit': '是否切换至该弹窗并进行编辑?',
'modal.popup.save': '请保存弹窗后编辑其他弹窗',
'modal.popup.notfond': '未找到该弹窗 {name}',
'modal.popup.repeat': '已有重名弹窗 {name}',
'modal.popup.remove': '请保存弹窗后再删除',
'modal.popup.nomodal': '暂时没有弹窗',
'modal.popup.name': '请输入弹窗名称',
'modal.name': '弹窗名称',
'modal.control.remove': '取消点击删除弹窗',
yes: '是',
no: '否',
'right.noprops': '还没有配置属性',
'right.global': '全局设置',
'right.containerheight': '容器高度',
'right.containerColor': '容器底色',
'right.bodyColor': 'body底色',
title: '标题',
};

104
yarn.lock
View File

@@ -1124,6 +1124,47 @@
resolved "https://registry.yarnpkg.com/@fontsource/fira-mono/-/fira-mono-4.5.0.tgz#bea97a54b60dc269d1c78469b007835af44dfa7f"
integrity sha512-KE+d3wmgq/YKM0BqgUF7p2yeBNi805Nfof1lC1wJ7E9i2EWoC363sGdKG+MQBVm+ei3GYZu+Bo8Xha1w1pkB7g==
"@formatjs/ecma402-abstract@1.9.8":
version "1.9.8"
resolved "https://registry.yarnpkg.com/@formatjs/ecma402-abstract/-/ecma402-abstract-1.9.8.tgz#f3dad447fbc7f063f88e2a148b7a353161740e74"
integrity sha512-2U4n11bLmTij/k4ePCEFKJILPYwdMcJTdnKVBi+JMWBgu5O1N+XhCazlE6QXqVO1Agh2Doh0b/9Jf1mSmSVfhA==
dependencies:
"@formatjs/intl-localematcher" "0.2.20"
tslib "^2.1.0"
"@formatjs/fast-memoize@1.2.0":
version "1.2.0"
resolved "https://registry.yarnpkg.com/@formatjs/fast-memoize/-/fast-memoize-1.2.0.tgz#1123bfcc5d21d761f15d8b1c32d10e1b6530355d"
integrity sha512-fObitP9Tlc31SKrPHgkPgQpGo4+4yXfQQITTCNH8AZdEqB7Mq4nPrjpUL/tNGN3lEeJcFxDbi0haX8HM7QvQ8w==
dependencies:
tslib "^2.1.0"
"@formatjs/icu-messageformat-parser@2.0.11":
version "2.0.11"
resolved "https://registry.yarnpkg.com/@formatjs/icu-messageformat-parser/-/icu-messageformat-parser-2.0.11.tgz#e4ba40b9a8aefc8bccfc96be5906d3bca305b4b3"
integrity sha512-5mWb8U8aulYGwnDZWrr+vdgn5PilvtrqQYQ1pvpgzQes/osi85TwmL2GqTGLlKIvBKD2XNA61kAqXYY95w4LWg==
dependencies:
"@formatjs/ecma402-abstract" "1.9.8"
"@formatjs/icu-skeleton-parser" "1.2.12"
tslib "^2.1.0"
"@formatjs/icu-skeleton-parser@1.2.12":
version "1.2.12"
resolved "https://registry.yarnpkg.com/@formatjs/icu-skeleton-parser/-/icu-skeleton-parser-1.2.12.tgz#45426eb1448c0c08c931eb9f0672283c0e4d0062"
integrity sha512-DTFxWmEA02ZNW6fsYjGYSADvtrqqjCYF7DSgCmMfaaE0gLP4pCdAgOPE+lkXXU+jP8iCw/YhMT2Seyk/C5lBWg==
dependencies:
"@formatjs/ecma402-abstract" "1.9.8"
tslib "^2.1.0"
"@formatjs/intl-displaynames@5.2.3":
version "5.2.3"
resolved "https://registry.yarnpkg.com/@formatjs/intl-displaynames/-/intl-displaynames-5.2.3.tgz#a0cebc81e89c5414177ade71a2f2388d799ee6e8"
integrity sha512-5BmhSurLbfgdeo0OBcNPPkIS8ikMMYaHe2NclxEQZqcMvrnQzNMNnUE2dDF5vZx+mkvKq77aQYzpc8RfqVsRCQ==
dependencies:
"@formatjs/ecma402-abstract" "1.9.8"
"@formatjs/intl-localematcher" "0.2.20"
tslib "^2.1.0"
"@formatjs/intl-displaynames@^1.2.0":
version "1.2.10"
resolved "https://registry.yarnpkg.com/@formatjs/intl-displaynames/-/intl-displaynames-1.2.10.tgz#bb9625cca90b099978cd967c6a98aaf4e23fc878"
@@ -1131,6 +1172,15 @@
dependencies:
"@formatjs/intl-utils" "^2.3.0"
"@formatjs/intl-listformat@6.3.3":
version "6.3.3"
resolved "https://registry.yarnpkg.com/@formatjs/intl-listformat/-/intl-listformat-6.3.3.tgz#0cb83a012c0ae46876e30589a086695298e0fb5c"
integrity sha512-3nzAKgVS5rePDa5HiH0OwZgAhqxLtzlMc9Pg4QgajRHSP1TqFiMmQnnn52wd3+xVTb7cjZVm3JBnTv51/MhTOg==
dependencies:
"@formatjs/ecma402-abstract" "1.9.8"
"@formatjs/intl-localematcher" "0.2.20"
tslib "^2.1.0"
"@formatjs/intl-listformat@^1.4.1":
version "1.4.8"
resolved "https://registry.yarnpkg.com/@formatjs/intl-listformat/-/intl-listformat-1.4.8.tgz#70b81005e7dcf74329cb5b314a940ce5fce36cd0"
@@ -1138,6 +1188,13 @@
dependencies:
"@formatjs/intl-utils" "^2.3.0"
"@formatjs/intl-localematcher@0.2.20":
version "0.2.20"
resolved "https://registry.yarnpkg.com/@formatjs/intl-localematcher/-/intl-localematcher-0.2.20.tgz#782aef53d1c1b6112ee67468dc59f9b8d1ba7b17"
integrity sha512-/Ro85goRZnCojzxOegANFYL0LaDIpdPjAukR7xMTjOtRx+3yyjR0ifGTOW3/Kjhmab3t6GnyHBYWZSudxEOxPA==
dependencies:
tslib "^2.1.0"
"@formatjs/intl-pluralrules@^1.5.0":
version "1.5.9"
resolved "https://registry.yarnpkg.com/@formatjs/intl-pluralrules/-/intl-pluralrules-1.5.9.tgz#c363c833c0ccde11eb508de4c09d3eaa232e819a"
@@ -1164,6 +1221,19 @@
resolved "https://registry.yarnpkg.com/@formatjs/intl-utils/-/intl-utils-2.3.0.tgz#2dc8c57044de0340eb53a7ba602e59abf80dc799"
integrity sha512-KWk80UPIzPmUg+P0rKh6TqspRw0G6eux1PuJr+zz47ftMaZ9QDwbGzHZbtzWkl5hgayM/qrKRutllRC7D/vVXQ==
"@formatjs/intl@1.14.1":
version "1.14.1"
resolved "https://registry.yarnpkg.com/@formatjs/intl/-/intl-1.14.1.tgz#03e12f7e2cf557defdd1a5aeb1c143efb8cfbc7b"
integrity sha512-mtL8oBgFwTu0GHFnxaF93fk/zNzNkPzl+27Fwg5AZ88pWHWb7037dpODzoCBnaIVk4FBO5emUn/6jI9Byj8hOw==
dependencies:
"@formatjs/ecma402-abstract" "1.9.8"
"@formatjs/fast-memoize" "1.2.0"
"@formatjs/icu-messageformat-parser" "2.0.11"
"@formatjs/intl-displaynames" "5.2.3"
"@formatjs/intl-listformat" "6.3.3"
intl-messageformat "9.9.1"
tslib "^2.1.0"
"@icons/material@^0.2.4":
version "0.2.4"
resolved "https://registry.yarnpkg.com/@icons/material/-/material-0.2.4.tgz#e90c9f71768b3736e76d7dd6783fc6c2afa88bc8"
@@ -2853,6 +2923,15 @@
"@types/scheduler" "*"
csstype "^3.0.2"
"@types/react@17":
version "17.0.19"
resolved "https://registry.yarnpkg.com/@types/react/-/react-17.0.19.tgz#8f2a85e8180a43b57966b237d26a29481dacc991"
integrity sha512-sX1HisdB1/ZESixMTGnMxH9TDe8Sk709734fEQZzCV/4lSu9kJCPbo2PbTRoZM+53Pp0P10hYVyReUueGwUi4A==
dependencies:
"@types/prop-types" "*"
"@types/scheduler" "*"
csstype "^3.0.2"
"@types/react@^16", "@types/react@^16.9.43":
version "16.14.11"
resolved "https://registry.yarnpkg.com/@types/react/-/react-16.14.11.tgz#992a0cd4b66b9f27315042b5d96e976717368f04"
@@ -7698,6 +7777,15 @@ intl-messageformat-parser@^3.6.4:
dependencies:
"@formatjs/intl-unified-numberformat" "^3.2.0"
intl-messageformat@9.9.1:
version "9.9.1"
resolved "https://registry.yarnpkg.com/intl-messageformat/-/intl-messageformat-9.9.1.tgz#255d453b0656b4f7e741f31d2b4a95bf2adfe064"
integrity sha512-cuzS/XKHn//hvKka77JKU2dseiVY2dofQjIOZv6ZFxFt4Z9sPXnZ7KQ9Ak2r+4XBCjI04MqJ1PhKs/3X22AkfA==
dependencies:
"@formatjs/fast-memoize" "1.2.0"
"@formatjs/icu-messageformat-parser" "2.0.11"
tslib "^2.1.0"
intl-messageformat@^7.8.4:
version "7.8.4"
resolved "https://registry.yarnpkg.com/intl-messageformat/-/intl-messageformat-7.8.4.tgz#c29146a06b9cd26662978a4d95fff2b133e3642f"
@@ -12525,6 +12613,22 @@ react-intl@3.12.1:
intl-messageformat-parser "^3.6.4"
shallow-equal "^1.2.1"
react-intl@^5.20.10:
version "5.20.10"
resolved "https://registry.yarnpkg.com/react-intl/-/react-intl-5.20.10.tgz#8b0f18a5b76e9f8f5a3ccc993deb0c4cef9dcde0"
integrity sha512-zy0ZQhpjkGsKcK1BFo2HbGM/q8GBVovzoXZGQ76DowR0yr6UzQuPLkrlIrObL2zxIYiDaxaz+hUJaoa2a1xqOQ==
dependencies:
"@formatjs/ecma402-abstract" "1.9.8"
"@formatjs/icu-messageformat-parser" "2.0.11"
"@formatjs/intl" "1.14.1"
"@formatjs/intl-displaynames" "5.2.3"
"@formatjs/intl-listformat" "6.3.3"
"@types/hoist-non-react-statics" "^3.3.1"
"@types/react" "17"
hoist-non-react-statics "^3.3.2"
intl-messageformat "9.9.1"
tslib "^2.1.0"
react-is@^16.12.0, react-is@^16.13.1, react-is@^16.6.0, react-is@^16.7.0, react-is@^16.8.1:
version "16.13.1"
resolved "https://registry.yarnpkg.com/react-is/-/react-is-16.13.1.tgz#789729a4dc36de2999dc156dd6c1d9c18cea56a4"