Skip to content

S
szse
Commit 7b851f3d by zhaochengxiang
Options

衍生表静态页面

parent dd86b2c6
Showing with 210 additions and 22 deletions
src/view/Manage/Model/Component/EditInherited.jsx 0 → 100644
import React from "react";
import { Modal, Space, Button, Form } from "antd";
import ImportAction from "./ImportAction";
const FC = (props) => {
const { visible, id, onCancel } = props;
const [form] = Form.useForm();
const onOk = () => {
}
return (
<Modal
title='编辑衍生表'
visible={visible}
onCancel={() => { onCancel?.(); }}
width='95%'
footer={
<Space>
<Button onClick={ () => { onCancel?.(); } }>取消</Button>
<Button type="primary" onClick={ onOk }>确定</Button>
</Space>
}
centered={true}
bodyStyle={{
height: '80vh',
overflow: 'auto'
}}
>
<ImportAction form={form} action='edit' modelerId={id} />
</Modal>
)
}
export default FC;
\ No newline at end of file
src/view/Manage/Model/Component/ImportAction.jsx
...@@ -45,7 +45,7 @@ const ImportAction = (props) => { ...@@ -45,7 +45,7 @@ const ImportAction = (props) => {
//初始化form状态 //初始化form状态
if (action==='add'||action==='edit'||action==='flow') { if (action==='add'||action==='edit'||action==='flow') {
form.resetFields(); form?.resetFields();
} }
if (action === 'detail'|| action ==='flow' || action === 'detail-version') { if (action === 'detail'|| action ==='flow' || action === 'detail-version') {
...@@ -174,7 +174,6 @@ const ImportAction = (props) => { ...@@ -174,7 +174,6 @@ const ImportAction = (props) => {
} }
const getCurrentDataModel = () => { const getCurrentDataModel = () => {
if ((modelerId||'') === '') { if ((modelerId||'') === '') {
setLoading(false); setLoading(false);
return; return;
...@@ -201,7 +200,8 @@ const ImportAction = (props) => { ...@@ -201,7 +200,8 @@ const ImportAction = (props) => {
} else if (action==='edit' && permitCheckOut) { } else if (action==='edit' && permitCheckOut) {
type = 'datamodel.checkOutDataModel'; type = 'datamodel.checkOutDataModel';
} else if (action==='edit') { } else if (action==='edit') {
const _action = getQueryParam(Action, props.location.search);
const _action = getQueryParam(Action, props.location?.search);
if (_action === 'flow') { if (_action === 'flow') {
params.ignoreNamespace = true; params.ignoreNamespace = true;
......
src/view/Manage/Model/Component/ImportActionInherited.jsx
...@@ -29,11 +29,25 @@ const FC = (props) => { ...@@ -29,11 +29,25 @@ const FC = (props) => {
</div> </div>
}} }}
> >
<Tabs.TabPane tab={<Checkbox onChange={(e) => { setGenerateHistory(e.target.checked); }}>历史表</Checkbox>} key='history'> <Tabs.TabPane
<Preview /> tab={
<span>
<Checkbox className='mr-2' onChange={(e) => { setGenerateHistory(e.target.checked); }}></Checkbox>历史表
</span>
}
key='history'
>
{ !collapse && <Preview /> }
</Tabs.TabPane> </Tabs.TabPane>
<Tabs.TabPane tab={<Checkbox onChange={(e) => { setGenerateZipper(e.target.checked); }}>拉链表</Checkbox>} key='zipper'> <Tabs.TabPane
<Preview /> tab={
<span>
<Checkbox className='mr-2' onChange={(e) => { setGenerateZipper(e.target.checked); }}></Checkbox>拉链表
</span>
}
key='zipper'
>
{ !collapse && <Preview /> }
</Tabs.TabPane> </Tabs.TabPane>
</Tabs> </Tabs>
</div> </div>
......
src/view/Manage/Model/Component/InheritedPreview.jsx
import React from "react"; import React, { useState } from "react";
import { Row, Col, Descriptions } from "antd"; import { Row, Col, Tooltip, Typography, Space, Button } from "antd";
import DataGrid from '../../VirtualTable';
import EditInherited from './EditInherited';
const FC = (props) => { const FC = (props) => {
const [editInheritedParams, setEditInheritedParms] = useState({ visible: false, id: undefined });
const { visible, id } = editInheritedParams;
return ( return (
<Row> <Row>
<Col span={12}> <Col span={12}>
<Basic /> <Basic />
</Col> </Col>
<Col span={12}> <Col span={12}>
<div className='flex'>
<div className='mr-3' style={{ flex: 1 }}>
<Table />
</div>
<Button type='primary' size='small' onClick={() => {
setEditInheritedParms({ visible: true, id: '643df3039e14e61e90acdfe7-1' });
}}>编辑</Button>
</div>
</Col> </Col>
<EditInherited visible={visible} id={id} onCancel={() => { setEditInheritedParms({ visible: false, id: undefined }) }} />
</Row> </Row>
) )
} }
...@@ -18,15 +32,135 @@ export default FC; ...@@ -18,15 +32,135 @@ export default FC;
const Basic = () => { const Basic = () => {
return ( return (
<Descriptions column={2}> <Row gutter={10}>
<Descriptions.Item label={<div style={{ textAlign: 'right', width: 85 }}>中文名称</div>} ></Descriptions.Item> <Col className='mb-4' span={12}>
<Descriptions.Item label={<div style={{ textAlign: 'right', width: 85 }}>英文名称</div>} ></Descriptions.Item> <Tooltip title=''>
<Descriptions.Item label={<div style={{ textAlign: 'right', width: 85 }}>分区键</div>} ></Descriptions.Item> <Typography.Text ellipsis={true}>
<Descriptions.Item label={<div style={{ textAlign: 'right', width: 85 }}>技术主键</div>} ></Descriptions.Item> 中文名称:&nbsp;<Typography.Text></Typography.Text>
<Descriptions.Item label={<div style={{ textAlign: 'right', width: 85 }}>数据类型</div>} ></Descriptions.Item> </Typography.Text>
<Descriptions.Item label={<div style={{ textAlign: 'right', width: 85 }}>绑定加载范围</div>} ></Descriptions.Item> </Tooltip>
<Descriptions.Item label={<div style={{ textAlign: 'right', width: 85 }}>更新时间</div>} ></Descriptions.Item> </Col>
<Descriptions.Item label={<div style={{ textAlign: 'right', width: 85 }}>数据情况</div>} ></Descriptions.Item> <Col className='mb-4' span={12}>
</Descriptions> <Tooltip title=''>
<Typography.Text ellipsis={true}>
英文名称:&nbsp;<Typography.Text></Typography.Text>
</Typography.Text>
</Tooltip>
</Col>
<Col className='mb-4' span={12}>
<Tooltip title=''>
<Typography.Text ellipsis={true}>
分区键:&nbsp;<Typography.Text></Typography.Text>
</Typography.Text>
</Tooltip>
</Col>
<Col className='mb-4' span={12}>
<Tooltip title=''>
<Typography.Text ellipsis={true}>
技术主键:&nbsp;<Typography.Text></Typography.Text>
</Typography.Text>
</Tooltip>
</Col>
<Col className='mb-4' span={12}>
<Tooltip title=''>
<Typography.Text ellipsis={true}>
数据类型:&nbsp;<Typography.Text></Typography.Text>
</Typography.Text>
</Tooltip>
</Col>
<Col className='mb-4' span={12}>
<Tooltip title=''>
<Typography.Text ellipsis={true}>
绑定加载范围:&nbsp;<Typography.Text></Typography.Text>
</Typography.Text>
</Tooltip>
</Col>
<Col className='mb-4' span={12}>
<Tooltip title=''>
<Typography.Text ellipsis={true}>
更新时间:&nbsp;<Typography.Text></Typography.Text>
</Typography.Text>
</Tooltip>
</Col>
<Col className='mb-4' span={12}>
<Tooltip title=''>
<Typography.Text ellipsis={true}>
数据情况:&nbsp;<Typography.Text></Typography.Text>
</Typography.Text>
</Tooltip>
</Col>
</Row>
)
}
const Table = () => {
const cols = [
{
name: '序号',
key: 'index',
width: 60,
// resizable: true,
},
{
name: '中文名称',
key: 'cnName',
resizable: true,
formatter(props) {
return (
<Tooltip title={props.row.cnName||''}>
<Typography.Text ellipsis={true}>{props.row.cnName}</Typography.Text>
</Tooltip>
)
}
},
{
name: '英文名称',
key: 'name',
resizable: true,
formatter(props) {
return (
<Tooltip title={props.row.name||''}>
<Typography.Text ellipsis={true}>{props.row.name}</Typography.Text>
</Tooltip>
)
}
},
{
name: '类型',
key: 'datatype',
resizable: true,
formatter(props) {
if (props.row.datatype) {
let datatype = props.row.datatype;
if ((datatype.name==='Char'||datatype.name==='Varchar') && datatype.parameterValues?.length>0) {
return `${datatype.name||''}(${(datatype.parameterValues[0]?datatype.parameterValues[0]:0)})`;
} else if ((datatype.name==='Decimal'||datatype.name==='Numeric') && datatype.parameterValues?.length>1) {
return `${datatype.name||''}(${(datatype.parameterValues[0]?datatype.parameterValues[0]:0)},${(datatype.parameterValues[1]?datatype.parameterValues[1]:0)})`;
}
return datatype.name||'';
}
return '';
}
},
];
return (
<DataGrid
style={{ blockSize: 146 }}
columns={cols}
rows={Array.from({ length: 10000 }).map((_, i) => ({
name: `test${i}`,
}))}
// rows={data||[]}
headerHeight={30}
rowHeight={36}
rowClassName={(row) => {
return ''
}}
/>
) )
} }
\ No newline at end of file
src/view/Manage/VirtualTable/index.tsx
...@@ -43,6 +43,7 @@ interface Props<Row> { ...@@ -43,6 +43,7 @@ interface Props<Row> {
selectedRows?: Array<any> selectedRows?: Array<any>
onSelectedRowsChange?: (selectedRows: Array<any>) => void onSelectedRowsChange?: (selectedRows: Array<any>) => void
rowHeight?: number rowHeight?: number
headerHeight?: number
rowClassName?: (row: RowData) => string rowClassName?: (row: RowData) => string
scrollRowIndex: number scrollRowIndex: number
} }
...@@ -112,7 +113,7 @@ function FC<Row extends RowData, SR, K extends React.Key = React.Key>(props: Dat ...@@ -112,7 +113,7 @@ function FC<Row extends RowData, SR, K extends React.Key = React.Key>(props: Dat
expandable, expandable,
getComparator, getComparator,
loadMoreRows, loadMoreRows,
onSelectedRowsChange, columns, rows, checkable, selectedRows, rowHeight = 45, rowClassName, onContextMenu, scrollRowIndex, ...rest } = props onSelectedRowsChange, columns, rows, checkable, selectedRows, rowHeight = 45, headerHeight = 38, rowClassName, onContextMenu, scrollRowIndex, ...rest } = props
const rowKeyGetter = (row: Row): K => { const rowKeyGetter = (row: Row): K => {
return row.id as K; return row.id as K;
...@@ -268,7 +269,7 @@ function FC<Row extends RowData, SR, K extends React.Key = React.Key>(props: Dat ...@@ -268,7 +269,7 @@ function FC<Row extends RowData, SR, K extends React.Key = React.Key>(props: Dat
}} }}
onRowsChange={onRowsChange} onRowsChange={onRowsChange}
headerRowHeight={38} headerRowHeight={headerHeight}
rowHeight={(args) => (args.type === 'ROW' && args.row.__type__ === RowType.Detail ? (expandable?.expandedRowHeight||100) : rowHeight)} rowHeight={(args) => (args.type === 'ROW' && args.row.__type__ === RowType.Detail ? (expandable?.expandedRowHeight||100) : rowHeight)}
// 排序 // 排序
......
Markdown is supported
0% or
You are about to add 0 people to the discussion. Proceed with caution.
Finish editing this message first!
Please register or to comment