衍生表预览

src/view/Manage/Model/Component/ImportAction.jsx

@@ -3,6 +3,7 @@ import { Spin } from 'antd';
 import LocalStorage from 'local-storage';
 
 import ImportActionHeader from './ImportActionHeader'; 
+import ImportActionInherited from './ImportActionInherited';
 import { ImportActionTable } from './ImportActionTable';
 import ImportActionIndex from './ImportActionIndex';
 import { getQueryParam } from '../../../../util';
@@ -547,6 +548,7 @@ const ImportAction = (props) => {
         terms={terms}
         supportedPartitionTypes={supportedPartitionTypes} 
       />   
+      <ImportActionInherited />
       <ImportActionTable 
         modelerData={modelerData||{}}
         constraint={constraint} 

src/view/Manage/Model/Component/ImportActionInherited.jsx

+import React, { useState } from "react";
+import { Button, Tabs, Checkbox } from "antd";
+import { DownOutlined, UpOutlined } from "@ant-design/icons";
+
+import Preview from './InheritedPreview';
+
+const FC = (props) => {
+  const [collapse, setCollapse] = useState(true);
+  const [activeKey, setActiveKey] = useState('history');
+  const [generateHistory, setGenerateHistory] = useState(false);
+  const [generateZipper, setGenerateZipper] = useState(false);
+
+  return (
+    <div className='model-import-action-inherited'>
+      <div className='mb-3'>
+        <Tabs 
+          activeKey={activeKey} 
+          onChange={(key) => { setActiveKey(key); }}
+          tabBarExtraContent={{
+            left: <div className='flex mr-6' style={{ alignItems: 'center' }}>
+              <h2 className='mr-3' style={{ marginBottom: 0 }}>历史存储形式</h2>
+              {
+                collapse ? <Button type='primary' size='small' onClick={() => { setCollapse(!collapse); }}>
+                  展开<DownOutlined />
+                </Button> : <Button type='primary' size='small' onClick={() => { setCollapse(!collapse); }}>
+                  收起<UpOutlined />
+                </Button>
+              }
+            </div>
+          }}
+        >
+          <Tabs.TabPane tab={<Checkbox onChange={(e) => { setGenerateHistory(e.target.checked); }}>历史表</Checkbox>} key='history'>
+            <Preview />
+          </Tabs.TabPane>
+          <Tabs.TabPane tab={<Checkbox onChange={(e) => { setGenerateZipper(e.target.checked); }}>拉链表</Checkbox>} key='zipper'>
+            <Preview />
+          </Tabs.TabPane>
+        </Tabs> 
+      </div>
+    </div>
+  )
+}
+
+export default FC;
\ No newline at end of file

src/view/Manage/Model/Component/InheritedPreview.jsx

+import React from "react";
+import { Row, Col, Descriptions } from "antd";
+
+const FC = (props) => {
+  return (
+    <Row>
+      <Col span={12}>
+        <Basic />
+      </Col>
+      <Col span={12}>
+
+      </Col>
+    </Row>
+  )
+}
+
+export default FC;
+
+const Basic = () => {
+  return (
+    <Descriptions column={2}>
+      <Descriptions.Item label={<div style={{ textAlign: 'right', width: 85 }}>中文名称</div>} ></Descriptions.Item>
+      <Descriptions.Item label={<div style={{ textAlign: 'right', width: 85 }}>英文名称</div>} ></Descriptions.Item>
+      <Descriptions.Item label={<div style={{ textAlign: 'right', width: 85 }}>分区键</div>} ></Descriptions.Item>
+      <Descriptions.Item label={<div style={{ textAlign: 'right', width: 85 }}>技术主键</div>} ></Descriptions.Item>
+      <Descriptions.Item label={<div style={{ textAlign: 'right', width: 85 }}>数据类型</div>} ></Descriptions.Item>
+      <Descriptions.Item label={<div style={{ textAlign: 'right', width: 85 }}>绑定加载范围</div>} ></Descriptions.Item>
+      <Descriptions.Item label={<div style={{ textAlign: 'right', width: 85 }}>更新时间</div>} ></Descriptions.Item>
+      <Descriptions.Item label={<div style={{ textAlign: 'right', width: 85 }}>数据情况</div>} ></Descriptions.Item>
+    </Descriptions>
+  )
+}
\ No newline at end of file