Commit 5c4f848b by zhaochengxiang

数据地图问题修改

parent de0be0e4
...@@ -62,11 +62,23 @@ code { ...@@ -62,11 +62,23 @@ code {
color: white; color: white;
} }
div[id^='__qiankun_microapp_wrapper_'] {
height: 100%;
}
//ant design //ant design
.ant-layout { .ant-layout {
background-color: #eee !important; background-color: #eee !important;
} }
.ant-tabs-content { .yy-tabs-content-holder {
height: 100% !important;
}
.yy-tabs-content {
height: 100% !important; height: 100% !important;
overflow: auto !important;
} }
...@@ -89,7 +89,10 @@ export const SetSource = function (source) { ...@@ -89,7 +89,10 @@ export const SetSource = function (source) {
const callback = resp => { const callback = resp => {
if (resp.status === 401) { if (resp.status === 401) {
message.warning("session过期,请重新登录!"); message.warning("session过期,请重新登录!");
//外网
window.location.href="/center-home/view/login" window.location.href="/center-home/view/login"
//内网
// window.location.href="/api/auth/login"
return null; return null;
} }
else if (resp.status !== 200) { else if (resp.status !== 200) {
......
...@@ -45,7 +45,6 @@ class Relation extends React.Component { ...@@ -45,7 +45,6 @@ class Relation extends React.Component {
componentDidMount() { componentDidMount() {
const { type, loadMoreData } = this.props; const { type, loadMoreData } = this.props;
setTimeout(() => {
const container = document.getElementById(`container${type||''}`); const container = document.getElementById(`container${type||''}`);
if (!container) return; if (!container) return;
...@@ -222,7 +221,6 @@ class Relation extends React.Component { ...@@ -222,7 +221,6 @@ class Relation extends React.Component {
graph.changeSize(container.scrollWidth, container.scrollHeight); graph.changeSize(container.scrollWidth, container.scrollHeight);
}; };
} }
}, 100);
} }
......
import React from 'react'; import React from 'react';
import { Card } from 'antd'; import { Card } from 'antd';
import './SquareItem.less';
class SquareItem extends React.Component { class SquareItem extends React.Component {
onItemClick = () => { onItemClick = () => {
...@@ -18,7 +20,7 @@ class SquareItem extends React.Component { ...@@ -18,7 +20,7 @@ class SquareItem extends React.Component {
render() { render() {
const { item } = this.props; const { item } = this.props;
return ( return (
<> <div className='map-square-item'>
{ {
item && ( item && (
item.dbType==='Dir' ? <Card title={ item.dbType==='Dir' ? <Card title={
...@@ -38,7 +40,7 @@ class SquareItem extends React.Component { ...@@ -38,7 +40,7 @@ class SquareItem extends React.Component {
</Card> </Card>
) )
} }
</> </div>
); );
} }
} }
......
.map-square-item {
.yy-card-head {
background-color: #ff4d4f !important;
.yy-card-head-title {
color: #fff !important;
:hover {
color: #1890ff;
}
}
}
}
\ No newline at end of file
import React, { useState, useEffect } from 'react'; import React, { useState, useEffect } from 'react';
import { Alert } from 'antd'; import { Alert } from 'antd';
import ImportActionHeader from './ImportActionHeader';
import ImportActionTable from './ImportActionTable'; import ImportActionTable from './ImportActionTable';
import ImportActionIndex from './ImportActionIndex'; import ImportActionIndex from './ImportActionIndex';
...@@ -21,7 +22,8 @@ for (let i = 0; i < 20; i++) { ...@@ -21,7 +22,8 @@ for (let i = 0; i < 20; i++) {
}); });
} }
const ImportAction = () => { const ImportAction = (props) => {
const { action } = props;
const [ tableData, setTableData ] = useState([...originData]); const [ tableData, setTableData ] = useState([...originData]);
const [indexData, setIndexData] = useState([]); const [indexData, setIndexData] = useState([]);
const [fileds, setFileds] = useState([]); const [fileds, setFileds] = useState([]);
...@@ -61,14 +63,17 @@ const ImportAction = () => { ...@@ -61,14 +63,17 @@ const ImportAction = () => {
return ( return (
<> <>
<Alert { <ImportActionHeader editable={action!=='detail'} /> }
{
action!=='detail' && <Alert
message="表格可以通过拖拽来排序" message="表格可以通过拖拽来排序"
type="info" type="info"
closable closable
className='mb-3' className='mb-3'
/> />
<ImportActionTable data={tableData} onChange={onTableChange} /> }
<ImportActionIndex data={indexData} fileds={fileds} onChange={onIndexChange} /> <ImportActionTable data={tableData} onChange={onTableChange} editable={action!=='detail'} />
<ImportActionIndex data={indexData} fileds={fileds} onChange={onIndexChange} editable={action!=='detail'} />
</> </>
); );
}; };
......
import React from 'react';
import { Form, Input, Row, Col } from 'antd';
const ImportActionHeader = (props) => {
const { editable } = props;
return (
<Form
// {...layout}
name="basic"
>
<Row gutter={10}>
<Col span={12}>
<Form.Item
label="模型名称"
name="name"
rules={[{ required: true, message: '请输入模型名称!' }]}
>
<Input disabled={editable} />
</Form.Item>
</Col>
<Col span={12}>
<Form.Item
label="模型描述"
name="desc"
disabled={editable}
rules={[{ required: true, message: '请输入模型描述!' }]}
>
<Input disabled={editable} />
</Form.Item>
</Col>
</Row>
</Form>
)
}
export default ImportActionHeader;
\ No newline at end of file
...@@ -6,7 +6,7 @@ import update from 'immutability-helper'; ...@@ -6,7 +6,7 @@ import update from 'immutability-helper';
const { Option } = Select; const { Option } = Select;
const type = 'DragableBodyRow'; const type = 'DragableIndexBodyRow';
const modes = [ const modes = [
'主键索引', '主键索引',
...@@ -127,7 +127,7 @@ const DragableBodyRow = ({ index, moveRow, className, style, ...restProps }) => ...@@ -127,7 +127,7 @@ const DragableBodyRow = ({ index, moveRow, className, style, ...restProps }) =>
}; };
const ImportActionIndex = (props) => { const ImportActionIndex = (props) => {
const { data, fileds, onChange } = props; const { data, fileds, onChange, editable } = props;
const [form] = Form.useForm(); const [form] = Form.useForm();
const [editingKey, setEditingKey] = useState(''); const [editingKey, setEditingKey] = useState('');
const [suggests, setSuggests] = useState([]); const [suggests, setSuggests] = useState([]);
...@@ -245,8 +245,10 @@ const ImportActionIndex = (props) => { ...@@ -245,8 +245,10 @@ const ImportActionIndex = (props) => {
title: '操作', title: '操作',
dataIndex: 'action', dataIndex: 'action',
render: (_, record) => { render: (_, record) => {
const editable = isEditing(record);
return editable ? ( if (!editable) return null;
return isEditing(record) ? (
<> <>
<Typography.Link className='mr-3' disabled={editingKey === ''} onClick={() => save()}> <Typography.Link className='mr-3' disabled={editingKey === ''} onClick={() => save()}>
保存 保存
...@@ -307,9 +309,11 @@ const ImportActionIndex = (props) => { ...@@ -307,9 +309,11 @@ const ImportActionIndex = (props) => {
return ( return (
<> <>
<Divider>数据表索引</Divider> <Divider>数据表索引</Divider>
<div className='d-flex mb-3'> {
editable && <div className='d-flex mb-3'>
<Button type="primary" onClick={onAddClick} style={{ marginLeft: 'auto' }} disabled={ editingKey!=='' } >新增行</Button> <Button type="primary" onClick={onAddClick} style={{ marginLeft: 'auto' }} disabled={ editingKey!=='' } >新增行</Button>
</div> </div>
}
<DndProvider backend={HTML5Backend} > <DndProvider backend={HTML5Backend} >
<Form form={form} component={false}> <Form form={form} component={false}>
<Table <Table
...@@ -317,11 +321,11 @@ const ImportActionIndex = (props) => { ...@@ -317,11 +321,11 @@ const ImportActionIndex = (props) => {
body: { body: {
cell: EditableCell, cell: EditableCell,
//编辑状态下不允许拖动 //编辑状态下不允许拖动
row: editingKey===''?DragableBodyRow:null, row: (editable&&editingKey==='')?DragableBodyRow:null,
}, },
}} }}
onRow={(record, index) => { onRow={(record, index) => {
if (editingKey!=='') return null; if (!editable || editingKey!=='') return null;
return { return {
index, index,
......
...@@ -4,7 +4,7 @@ import { DndProvider, useDrag, useDrop } from 'react-dnd'; ...@@ -4,7 +4,7 @@ import { DndProvider, useDrag, useDrop } from 'react-dnd';
import { HTML5Backend } from 'react-dnd-html5-backend'; import { HTML5Backend } from 'react-dnd-html5-backend';
import update from 'immutability-helper'; import update from 'immutability-helper';
const type = 'DragableBodyRow'; const type = 'DragableTableBodyRow';
const EditableCell = ({ const EditableCell = ({
editing, editing,
...@@ -91,7 +91,7 @@ const DragableBodyRow = ({ index, moveRow, className, style, ...restProps }) => ...@@ -91,7 +91,7 @@ const DragableBodyRow = ({ index, moveRow, className, style, ...restProps }) =>
}; };
const ImportActionTable = (props) => { const ImportActionTable = (props) => {
const { data, onChange } = props; const { data, onChange, editable } = props;
const [form] = Form.useForm(); const [form] = Form.useForm();
const [editingKey, setEditingKey] = useState(''); const [editingKey, setEditingKey] = useState('');
const [recommends, setRecommends] = useState([]); const [recommends, setRecommends] = useState([]);
...@@ -100,7 +100,8 @@ const ImportActionTable = (props) => { ...@@ -100,7 +100,8 @@ const ImportActionTable = (props) => {
const isEditing = (record) => record.key === editingKey; const isEditing = (record) => record.key === editingKey;
const onAddClick = () => { const onAddClick = () => {
const newData = [{}, ...data]; //test
const newData = [{key: -1}, ...data];
onChange && onChange(newData); onChange && onChange(newData);
edit(newData[0]); edit(newData[0]);
...@@ -128,9 +129,11 @@ const ImportActionTable = (props) => { ...@@ -128,9 +129,11 @@ const ImportActionTable = (props) => {
const cancel = () => { const cancel = () => {
const newData = [...data]; const newData = [...data];
const item = newData[editingKey]; const index = newData.findIndex((item) => editingKey === item.key);
const item = newData[index];
if (!item.name || item.name==='') { if (!item.name || item.name==='') {
newData.splice(editingKey, 1); newData.splice(index, 1);
onChange && onChange(newData); onChange && onChange(newData);
} }
...@@ -283,8 +286,9 @@ const ImportActionTable = (props) => { ...@@ -283,8 +286,9 @@ const ImportActionTable = (props) => {
title: '操作', title: '操作',
dataIndex: 'action', dataIndex: 'action',
render: (_, record) => { render: (_, record) => {
const editable = isEditing(record); if (!editable) return null;
return editable ? (
return isEditing(record) ? (
<> <>
<Typography.Link className='mr-3' disabled={editingKey === ''} onClick={() => save()}> <Typography.Link className='mr-3' disabled={editingKey === ''} onClick={() => save()}>
保存 保存
...@@ -344,9 +348,11 @@ const ImportActionTable = (props) => { ...@@ -344,9 +348,11 @@ const ImportActionTable = (props) => {
return ( return (
<> <>
<Divider>数据表结构</Divider> <Divider>数据表结构</Divider>
<div className='d-flex mb-3'> {
editable && <div className='d-flex mb-3'>
<Button type="primary" onClick={onAddClick} style={{ marginLeft: 'auto' }} disabled={ editingKey!=='' } >新增行</Button> <Button type="primary" onClick={onAddClick} style={{ marginLeft: 'auto' }} disabled={ editingKey!=='' } >新增行</Button>
</div> </div>
}
<DndProvider backend={HTML5Backend} > <DndProvider backend={HTML5Backend} >
<Form form={form} component={false} onValuesChange={onValuesChange}> <Form form={form} component={false} onValuesChange={onValuesChange}>
<Table <Table
...@@ -354,11 +360,11 @@ const ImportActionTable = (props) => { ...@@ -354,11 +360,11 @@ const ImportActionTable = (props) => {
body: { body: {
cell: EditableCell, cell: EditableCell,
//编辑状态下不允许拖动 //编辑状态下不允许拖动
row: editingKey===''?DragableBodyRow:null, row: (editable&&editingKey==='')?DragableBodyRow:null,
}, },
}} }}
onRow={(record, index) => { onRow={(record, index) => {
if (editingKey!=='') return null; if (!editable || editingKey!=='') return null;
return { return {
index, index,
......
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