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

update 0.9.5

Browse Source
This commit is contained in:
hufeixiong
2021-11-02 12:48:08 +08:00
parent ab67e095b4
commit b854f9f275
9 changed files with 139 additions and 42 deletions
Download Patch File Download Diff File Expand all files Collapse all files

6
CHANGELOG.md
View File

@@ -1,5 +1,11 @@
## changelog
## 0.9.5
preview组件scripts加载由并发变为线性。
编辑模式下使用远程组件会储存当前画布状态。
## 0.9.4
修复preview组件不能解除loading的bug

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

@@ -4,6 +4,12 @@ order: 1
---
## changelog
## 0.9.5
preview组件scripts加载由并发变为线性。
编辑模式下使用远程组件会储存当前画布状态。
## 0.9.4
修复preview组件不能解除loading的bug

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

@@ -14,12 +14,12 @@ import {
ContainerWrapper,
Control,
} from 'dooringx-lib';
import { InsertRowBelowOutlined } from '@ant-design/icons';
import { InsertRowBelowOutlined, UploadOutlined } from '@ant-design/icons';
import { useContext, useState } from 'react';
import { configContext, LocaleContext } from '@/layouts';
import { useCallback } from 'react';
import { PREVIEWSTATE } from '@/constant';
import { Button, Input, Popover } from 'antd';
import { Button, Input, message, Modal, Popover, Upload } from 'antd';
import { localeKey } from '../../../dooringx-lib/dist/locale';
import { LeftRegistComponentMapItem } from 'dooringx-lib/dist/core/crossDrag';
@@ -48,6 +48,19 @@ export default function IndexPage() {
const [state] = useStoreState(config, subscribeFn, everyFn);
const [value, setValue] = useState('');
const [open, setOpen] = useState(false);
const createAndDownloadFile = (fileName: string) => {
const aTag = document.createElement('a');
const res = config.getStore().getData();
const JSONres = JSON.stringify(res);
const blob = new Blob([JSONres]);
aTag.download = fileName;
const url = URL.createObjectURL(blob);
aTag.href = url;
aTag.click();
URL.revokeObjectURL(url);
};
return (
<div {...innerContainerDragUp(config)}>
@@ -91,7 +104,54 @@ export default function IndexPage() {
>
远程组件
</Button>
<Button
onClick={() => {
createAndDownloadFile('dooring.json');
}}
>
下载json
</Button>
<Button
onClick={() => {
setOpen(true);
}}
>
上传json
</Button>
</div>
<Modal
visible={open}
onCancel={() => setOpen(false)}
onOk={() => setOpen(false)}
title={'import json'}
>
<Upload
name="file"
maxCount={1}
onChange={(e) => {
if (e.file.status === 'done') {
const file = e.file.originFileObj;
if (file) {
let reader = new FileReader();
reader.addEventListener('loadend', function () {
try {
let res = JSON.parse(reader.result as string);
console.log(res, '返回结果数据');
config.getStore().resetToInitData([res]);
setOpen(false);
} catch {
message.error('json解析格式有误');
}
});
reader.readAsText(file);
}
}
}}
>
<Button icon={<UploadOutlined />}>&nbsp; 点击上传</Button>
</Upload>
</Modal>
<div
style={{
display: 'flex',

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

@@ -1,5 +1,5 @@
{
"version": "0.9.4",
"version": "0.9.5",
"license": "MIT",
"main": "dist/index.js",
"module": "dist/dooringx-lib.esm.js",

51
packages/dooringx-lib/src/components/preview.tsx
View File

@@ -68,27 +68,38 @@ function Preview(props: PreviewProps): ReactElement {
// 加载 script
const scripts = props.config.getStore().getData().globalState['script'];
if (scripts && Array.isArray(scripts) && scripts.length > 0) {
const allp = scripts.map((v) => {
return new Promise((res) => {
const s = document.createElement('script');
s.src = v;
document.body.appendChild(s);
s.onload = () => {
const item = window[
props.config.SCRIPTGLOBALNAME as any
] as unknown as ComponentItemFactory;
props.config.registComponent(item);
res(0);
};
});
});
Promise.all(allp)
.then(() => {
finalFn();
})
.catch(() => {
finalFn();
const fn = async () => {
const allp = scripts.map((v) => {
return () =>
new Promise<number>((res) => {
const s = document.createElement('script');
s.src = v;
document.body.appendChild(s);
s.onload = () => {
const item = window[
props.config.SCRIPTGLOBALNAME as any
] as unknown as ComponentItemFactory;
try {
props.config.registComponent(item);
} catch {
console.error('read item fail:', v);
}
document.body.removeChild(s);
res(0);
};
});
});
const allplen = allp.length;
for (let i = 0; i < allplen; i++) {
try {
await allp[i]();
} catch {
console.error('script load fail:', scripts[i]);
}
}
finalFn();
};
fn();
} else {
finalFn();
}

44
packages/dooringx-lib/src/config/index.tsx
View File

@@ -592,29 +592,41 @@ export class UserConfig {
this.addCoRegistMap(leftProps);
}
scriptRegistComponentMulti(
items: ComponentItemFactory[],
leftProps: LeftRegistComponentMapItem[]
) {
items.forEach((item) => {
this.registComponent(item);
});
const obj = {} as InitConfig;
obj.leftAllRegistMap = leftProps;
this.initConfig = userConfigMerge(this.initConfig, obj);
this.init();
this.store.forceUpdate();
}
// foreach可能导致问题
// scriptRegistComponentMulti(
// items: ComponentItemFactory[],
// leftProps: LeftRegistComponentMapItem[]
// ) {
// items.forEach((item) => {
// this.registComponent(item);
// });
// const obj = {} as InitConfig;
// obj.leftAllRegistMap = leftProps;
// this.initConfig = userConfigMerge(this.initConfig, obj);
// this.init();
// this.store.forceUpdate();
// }
/**
*
* 分类信息需要单独存储后加载
* @param {string} src url地址
* @param {Partial<LeftRegistComponentMapItem>} leftProps 分类
* @param {Function} [callback] 回调
* @return {*}
* @memberof UserConfig
*/
scriptSingleLoad(
src: string,
leftProps: Partial<LeftRegistComponentMapItem>,
callback?: Function
) {
let isEdit = this.storeChanger.isEdit();
let globalState = this.store.getData().globalState;
let storeData = this.store.getData();
let globalState = storeData.globalState;
if (isEdit) {
globalState = this.storeChanger.getOrigin()!.now.globalState;
storeData = this.storeChanger.getOrigin()!.now;
globalState = storeData.globalState;
}
if (globalState['script'].includes(src)) {
console.error(src + 'scripts have been loaded');
@@ -643,6 +655,8 @@ export class UserConfig {
globalState = this.storeChanger.getOrigin()!.now.globalState;
}
globalState['script'].push(src);
storeData.globalState = globalState;
this.store.resetToInitData([storeData], true);
this.store.forceUpdate();
this.scriptLoading = false;
if (callback) {

4
packages/dooringx-lib/src/core/store/index.ts
View File

@@ -45,9 +45,9 @@ class Store {
}
/**
*
* 注意重置需要注册事件
* 重置需要注册事件
* @param {IStoreData[]} initData
* @param {boolean} [check=false]
* @param {boolean} [check=false] 检查编辑弹窗状态
* @memberof Store
*/
resetToInitData(initData: IStoreData[], check = false) {

2
packages/dooringx-plugin-template/package.json
View File

@@ -1,6 +1,6 @@
{
"name": "dooringx-plugin-template",
"version": "0.9.4",
"version": "0.9.5",
"description": "> TODO: description",
"author": "yehuozhili <673632758@qq.com>",
"homepage": "https://github.com/H5-Dooring/dooringx#readme",

2
packages/dooringx-plugin-template/template/template.json
View File

@@ -40,7 +40,7 @@
"@rollup/plugin-node-resolve": "^13.0.4",
"@rollup/plugin-url": "^6.1.0",
"@svgr/rollup": "^5.5.0",
"dooringx-lib": "^0.9.4",
"dooringx-lib": "^0.9.5",
"postcss": "^8.3.6",
"rollup-plugin-peer-deps-external": "^2.2.4",
"rollup-plugin-postcss": "^4.0.1",