oak-pay-business/es/components/ship/system/web.pc.js

80 lines
3.2 KiB
JavaScript

import React from 'react';
import Markdown from 'react-markdown';
import assert from "assert";
import ShipServiceSystem from '../../shipServiceSystem/list';
import { Tabs, Flex, Alert } from 'antd';
import Styles from './web.pc.module.less';
const ShipSettingComponentDict = {};
export function registerShipSettingComponent(entity, component) {
assert(!ShipSettingComponentDict[entity]);
ShipSettingComponentDict[entity] = component;
}
function RenderShipEntity(props) {
const { oakId, oakFullpath, t } = props;
const entities = Object.keys(ShipSettingComponentDict);
if (oakId && oakFullpath && entities.length) {
return (<Tabs className={Styles.container} tabPosition="left" items={entities.map((entity) => {
const Comp = ShipSettingComponentDict[entity];
return {
label: (<div className={Styles.systemLabel}>
{t(`${entity}:name`)}
</div>),
key: entity,
children: (<Flex vertical>
<Comp systemId={oakId} oakPath={`${oakFullpath}.${entity}$system`}/>
{/* <Flex
gap="middle"
justify='end'
>
<Button
type="primary"
disabled={!executable}
onClick={() => execute()}
>
{t('common::confirm')}
</Button>
<Button
disabled={!oakDirty}
onClick={() => clean()}
>
{t('common::reset')}
</Button>
</Flex> */}
</Flex>)
};
})}/>);
}
return (<Flex className={Styles.tips} vertical align="stretch">
<Alert type="info" message={t("tips.header")} description={t('tips.desc')}/>
<div className={Styles.code}>
<Markdown>{`
\`\`\`
import { registerShipSettingComponent } from 'oak-pay-business/es/registry';
import WechatMpShipSetting from 'oak-pay-business/es/components/ship/wechatMpShip';
registerShipSettingComponent('wechatMpShip', WechatMpShipSetting);
\`\`\`
`}
</Markdown>
</div>
</Flex>);
}
export default function render(props) {
const { oakFullpath, oakId } = props.data;
const { t } = props.methods;
if (oakFullpath && oakId) {
return (<Tabs items={[
{
key: '1',
label: t('shipEntity'),
children: <RenderShipEntity oakFullpath={oakFullpath} oakId={oakId} t={t}/>,
},
{
key: '2',
label: t('shipService'),
children: <ShipServiceSystem oakPath={"$$opb-shipSystem-shipServices"} systemId={oakId}/>
}
]}/>);
}
}