JLNTV_IPD/tmagic-editor
4
0
Fork 0
mirror of https://github.com/Tencent/tmagic-editor.git synced 2025-04-06 03:57:56 +08:00
Code Issues Projects Releases Wiki Activity

fix(ui): 页面组件无法支持event配置

Browse Source
This commit is contained in:
roymondchen 2022-06-06 15:24:59 +08:00 committed by jia000
parent 5d159ad9d8
commit cdabe36b93
9 changed files with 96 additions and 17 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

33
packages/ui-react/src/page/Page.tsx
View File

@ -18,7 +18,7 @@
import React from 'react';
import { MPage } from '@tmagic/schema';
import { MComponent, MContainer, MPage } from '@tmagic/schema';
import useApp from '../useApp';
@ -27,15 +27,38 @@ interface PageProps {
}
const Page: React.FC<PageProps> = ({ config }) => {
const { app } = useApp({ config });
const { app } = useApp({
config,
methods: {
refresh: () => window.location.reload()
}
});
if (!app) return null;
const MagiUiContainer = app.resolveComponent('container');
return <div
id={`${config.id || ''}`}
className={`magic-ui-page${config.className ? ` ${config.className}` : ''}`}
style={app.transformStyle(config.style || {})}
>
{config.items?.map((item: MComponent | MContainer) => {
const MagicUiComp = app.resolveComponent(item.type || 'container');
return <MagiUiContainer config={{ className: 'magic-ui-page', ...config }}></MagiUiContainer>;
if (!MagicUiComp) return null;
return (
<MagicUiComp
id={`${item.id || ''}`}
key={item.id}
config={item}
className={`magic-ui-component${config.className ? ` ${config.className}` : ''}`}
style={app.transformStyle(item.style || {})}
></MagicUiComp>
);
})}
</div>;
};
Page.displayName = 'maigc-ui-page';
Page.displayName = 'magic-ui-page';
export default Page;

8
packages/ui-react/src/page/event.ts Normal file
View File

@ -0,0 +1,8 @@
export default {
methods: [
{
label: '刷新页面',
value: 'refresh',
},
],
};

1
packages/ui-react/src/page/index.ts
View File

@ -20,5 +20,6 @@ import Page from './Page';
export { default as config } from './formConfig';
export { default as value } from './initValue';
export { default as event } from './event';
export default Page;

24
packages/ui-vue2/src/page/Page.vue
View File

@ -1,19 +1,25 @@
<template>
<magic-ui-container class="magic-ui-page" :config="config">
<div :id="config.id" :class="`magic-ui-page${config.className ? ` ${config.className}` : ''}`" :style="style">
<slot></slot>
</magic-ui-container>
<magic-ui-component v-for="item in config.items" :key="item.id" :config="item"></magic-ui-component>
</div>
</template>
<script lang="ts">
import { defineComponent, PropType } from '@vue/composition-api';
import { computed, defineComponent, PropType } from '@vue/composition-api';
import { MPage } from '@tmagic/schema';
import Component from '../Component.vue';
import useApp from '../useApp';
export default defineComponent({
name: 'magic-ui-page',
components: {
'magic-ui-component': Component,
},
props: {
config: {
type: Object as PropType<MPage>,
@ -22,9 +28,15 @@ export default defineComponent({
},
setup(props) {
if (props.config) {
useApp(props);
}
const app = useApp(props);
return {
style: computed(() => app?.transformStyle(props.config.style || {})),
refresh() {
window.location.reload();
},
};
},
});
</script>

8
packages/ui-vue2/src/page/event.ts Normal file
View File

@ -0,0 +1,8 @@
export default {
methods: [
{
label: '刷新页面',
value: 'refresh',
},
],
};

1
packages/ui-vue2/src/page/index.ts
View File

@ -20,5 +20,6 @@ import Page from './Page.vue';
export { default as config } from './formConfig';
export { default as value } from './initValue';
export { default as event } from './event';
export default Page;

1
packages/ui/src/page/index.ts
View File

@ -20,5 +20,6 @@ import Page from './src/index.vue';
export { default as config } from './src/formConfig';
export { default as value } from './src/initValue';
export { default as event } from './src/event';
export default Page;

8
packages/ui/src/page/src/event.ts Normal file
View File

@ -0,0 +1,8 @@
export default {
methods: [
{
label: '刷新页面',
value: 'refresh',
},
],
};

29
packages/ui/src/page/src/index.vue
View File

@ -1,18 +1,29 @@
<template>
<magic-ui-container class="magic-ui-page" :config="config">
<div
:id="`${config.id || ''}`"
:class="`magic-ui-page${config.className ? ` ${config.className}` : ''}`"
:style="style"
>
<slot></slot>
</magic-ui-container>
<magic-ui-component v-for="item in config.items" :key="item.id" :config="item"></magic-ui-component>
</div>
</template>
<script lang="ts">
import { defineComponent, PropType } from 'vue';
import { computed, defineComponent, PropType } from 'vue';
import { MPage } from '@tmagic/schema';
import Component from '../../Component.vue';
import useApp from '../../useApp';
export default defineComponent({
name: 'magic-ui-page',
components: {
'magic-ui-component': Component,
},
props: {
config: {
type: Object as PropType<MPage>,
@ -21,9 +32,15 @@ export default defineComponent({
},
setup(props) {
if (props.config) {
useApp(props);
}
const app = useApp(props);
return {
style: computed(() => app?.transformStyle(props.config.style || {})),
refresh() {
window.location.reload();
},
};
},
});
</script>