schema 页面 delete table icon 可用

src/components/app/App.jsx

@@ -306,12 +306,12 @@ class GraphqlSidebar extends Component {
 
 
     render() {
-        console.log('userID',this.state.userID);
+        // console.log('userID',this.state.userID);
         return (
             <Query query={gql(SHOW_ALL_SCHEMA)} variables={{user_id: this.state.userID}}>
                 {
                     ({loading, error, data}) => {
-                        console.log('user schema data',data);
+                        // console.log('user schema data',data);
                         if (loading) return <Spin style={{marginLeft: 3}}/>;
                         if (error) return 'error!';
                         return (

src/components/cloudFunction/CloudFunction.jsx

@@ -16,7 +16,7 @@ class CloudFunction extends Component {
     }
 
     switchMenu = (menuName, e) => {
-        console.log('menuName', menuName, 'e', e);
+        // console.log('menuName', menuName, 'e', e);
         this.setState({
             [menuName]: e.key,
         });

src/components/common/schema/Schema.jsx

@@ -4,21 +4,20 @@ import {Row, Col, Input, Icon, Button, Spin} from 'antd';
 import './index.css';
 import {Mutation, Query} from "react-apollo";
 import gql from "graphql-tag";
-import {SHOW_SCHEMA, DELETE_SCHEMA, SHOW_TABLE} from '../../gql'
+import {SHOW_SCHEMA, DELETE_SCHEMA, SHOW_TABLE, UPDATE_SCHEMA} from '../../gql'
 import Table from "./Table";
 
 class Schema extends Component {
     constructor(props) {
         super(props);
         this.state = {
-            currentTable: props.location.state === undefined? '' : props.location.state.create ? 'add' : '',
+            currentTable: props.location.state === undefined ? '' : props.location.state.create ? 'add' : '',
             // default schemaID and schemaName
             schemaID: props.schemaID || props.location.state.schemaID,
             schemaName: props.schemaName || props.location.state.schemaName,
         };
     }
 
-
     switchTable = (table) => {
         this.setState({
             currentTable: table
@@ -37,7 +36,7 @@ class Schema extends Component {
 
     componentWillReceiveProps(next) {
         this.setState({
-            currentTable: next.location.state === undefined? '' : next.location.state.create ? 'add' : '',
+            currentTable: next.location.state === undefined ? '' : next.location.state.create ? 'add' : '',
             schemaID: next.schemaID,
             schemaName: next.schemaName
         });
@@ -45,7 +44,7 @@ class Schema extends Component {
 
     render() {
         let userID = this.props.userID;
-        console.log('this.state.currentTable',this.state.currentTable);
+        // console.log('this.state.currentTable', this.state.currentTable);
         return (
             <Query query={gql(SHOW_TABLE)} variables={{schema_id: this.state.schemaID}}>
 
@@ -97,7 +96,14 @@ class Schema extends Component {
                                                         <Col span={8}
                                                              onClick={() => this.switchTable(table.name)}><span>{table.name}</span></Col>
                                                         <Col span={8}><span>{table.remark}</span></Col>
-                                                        <Col span={8}><Icon type="delete"/></Col>
+                                                        <Col span={8}>
+                                                            <DeleteTableButton
+                                                                currentTable={table.name}
+                                                                currentTableIndex={data.findIndex(obj => obj.name === table.name)}
+                                                                schemaID={this.state.schemaID}
+                                                                userID={userID}
+                                                            />
+                                                        </Col>
                                                     </Row>
                                                 ))
                                             }
@@ -141,42 +147,155 @@ export default Schema;
 
 // 备用代码
 
-class DeleteSchemaButton extends Component {
-    constructor(props) {
-        super(props);
-        this.state = {
-            schemaName: props.schemaName
-        }
-    }
+// class DeleteSchemaButton extends Component {
+//     constructor(props) {
+//         super(props);
+//         this.state = {
+//             schemaName: props.schemaName
+//         }
+//     }
+//
+//     render() {
+//         let userID = this.props.userID;
+//         return (
+//             <Mutation
+//                 mutation={DELETE_SCHEMA}
+//                 update={(cache) => {
+//                     let data = cache.readQuery({query: SHOW_SCHEMA, variables: {user_id: userID}});
+//
+//                     data.schema_by_props.splice(data.schema_by_props.findIndex(obj => obj.schemaName === this.state.schemaName), 1);
+//                     cache.writeQuery({
+//                         query: SHOW_SCHEMA,
+//                         variables: {user_id: userID},
+//                         data
+//                     });
+//                 }}
+//             >
+//                 {(delete_schema, {loading, error}) => {
+//                     if (error)
+//                         return 'error';
+//                     if (loading)
+//                         return <Spin style={{marginLeft: 3}}/>;
+//                     return (
+//                         <Button onClick={(e) => {
+//                             delete_schema({variables: {schemaName: this.props.schemaName}});
+//                         }} type="danger" shape="circle" icon="delete" size='small' style={{marginLeft: 3}}/>
+//                     )
+//                 }}
+//             </Mutation>
+//         )
+//     }
+// }
+
 
+class DeleteTableButton extends Component {
     render() {
+        let schemaID = this.props.schemaID;
         let userID = this.props.userID;
+
+        let varobj = {
+            id: schemaID,
+            updatedAt: new Date().getTime(),
+            schemaState: 'updated-delete-table',
+        };
+
         return (
-            <Mutation
-                mutation={DELETE_SCHEMA}
-                update={(cache) => {
-                    let data = cache.readQuery({query: SHOW_SCHEMA, variables: {user_id: userID}});
-
-                    data.schema_by_props.splice(data.schema_by_props.findIndex(obj => obj.schemaName === this.state.schemaName), 1);
-                    cache.writeQuery({
-                        query: SHOW_SCHEMA,
-                        variables: {user_id: userID},
-                        data
-                    });
-                }}
-            >
-                {(delete_schema, {loading, error}) => {
-                    if (error)
-                        return 'error';
-                    if (loading)
-                        return <Spin style={{marginLeft: 3}}/>;
-                    return (
-                        <Button onClick={(e) => {
-                            delete_schema({variables: {schemaName: this.props.schemaName}});
-                        }} type="danger" shape="circle" icon="delete" size='small' style={{marginLeft: 3}}/>
-                    )
-                }}
-            </Mutation>
+            <Query query={gql(SHOW_TABLE)} variables={{schema_id: schemaID}}>
+
+                {
+                    ({loading, error, data}) => {
+                        if (loading)
+                            return <Spin style={{marginLeft: 30, marginTop: 10}}/>;
+                        if (error)
+                            return 'error';
+
+                        let schemaData = data;
+
+                        return (
+                            <Mutation
+                                mutation={gql(UPDATE_SCHEMA)}
+                                update={(cache, {data: {update_schema}}) => {
+                                    let data = cache.readQuery({
+                                        query: gql(SHOW_TABLE),
+                                        variables: {schema_id: schemaID}
+                                    });
+                                    data.schema_by_id = update_schema;
+
+                                    let showSchemaData = cache.readQuery({
+                                        query: gql(SHOW_SCHEMA),
+                                        variables: {user_id: userID}
+                                    });
+                                    let schemas = showSchemaData.schema_by_props;
+                                    // console.log('schemas', schemas);
+                                    let targetSchema = schemas.find(obj => obj.schemaName === update_schema.schemaName);
+                                    // console.log('targetSchema', targetSchema);
+                                    let targetSchemaIndex = schemas.findIndex(obj => obj.schemaName === update_schema.schemaName);
+                                    // console.log('targetSchemaIndex', targetSchemaIndex);
+                                    let targetTables = JSON.parse(schemas[targetSchemaIndex].schemaData);
+                                    // console.log('targetTables', targetTables);
+                                    let targetTableIndex = targetTables.findIndex(obj => obj.name === this.props.currentTable);
+                                    // console.log('targetTableIndex', targetTableIndex);
+                                    targetTables.splice(targetTableIndex, 1);
+                                    // console.log('targetTablesAfterDelete', targetTables);
+                                    let temp = {schemaData: JSON.stringify(targetTables)};
+                                    // console.log('temp', temp);
+                                    let tempSchema = {...targetSchema, ...temp};
+                                    // console.log('tempSchema', tempSchema);
+                                    showSchemaData.schema_by_props.splice(targetSchemaIndex, 1, tempSchema);
+
+                                    cache.writeQuery(
+                                        {
+                                            query: gql(SHOW_TABLE),
+                                            variables: {schema_id: schemaID},
+                                            data
+                                        },
+                                        {
+                                            query: gql(SHOW_SCHEMA),
+                                            variables: {user_id: userID},
+                                            showSchemaData
+                                        }
+                                    );
+                                }}
+                            >
+
+                                {(update_schema, {loading, error}) => {
+                                    if (loading)
+                                        return <Spin style={{marginLeft: 30, marginTop: 10}}/>;
+                                    if (error)
+                                        return 'error';
+
+                                    // 先 query 再 mutation，然后删除
+                                    let schemaCols;
+                                    if (schemaData.schema_by_id === null) schemaCols = [];
+                                    else schemaCols = JSON.parse(schemaData.schema_by_id.schemaData);
+
+                                    const index = this.props.currentTableIndex;
+                                    if (index === -1) {
+                                        console.log('数据库信息不匹配');
+                                    } else {
+                                        schemaCols.splice(index, 1);
+                                    }
+
+                                    return (
+                                        <Icon type="delete"
+                                              onClick={() => {
+                                                  update_schema({
+                                                      variables: {
+                                                          ...varobj,
+                                                          schemaData: JSON.stringify(schemaCols)
+                                                      }
+                                                  });
+                                              }}>
+
+                                        </Icon>
+                                    )
+                                }}
+                            </Mutation>
+                        )
+                    }
+                }
+
+            </Query>
         )
     }
-}
+}

src/components/common/schema/Table.js

@@ -103,10 +103,10 @@ class Table extends Component {
 
     render() {
         // console.log('columns',this.state.columns);
-        console.log('this.props',this.props);
+        // console.log('this.props',this.props);
         let schemaID = this.props.schemaID || this.props.history.location.state.schemaID;
         let schemaName = this.props.schemaName || this.props.history.location.state.schemaName;
-        console.log('schemaID',schemaID,'schemaName',schemaName);
+        // console.log('schemaID',schemaID,'schemaName',schemaName);
         let userID = this.props.userID || getCookie('user_id');
         // console.log('schemaID',schemaID,'userID',userID);
 
@@ -208,16 +208,6 @@ class Table extends Component {
                                 schemaID={schemaID}
                                 userID={userID}
                             />
-                            {/*{*/}
-                            {/*// undefined的时候 上层未传进来 currentTable === 'add'，为的是输入框内不默认显示 add*/}
-                            {/*this.state.currentTable === '' ? '' : this.state.currentTable === undefined ? '' :*/}
-                            {/*<DeleteTableButton*/}
-                            {/*currentTable={this.state.currentTable}*/}
-                            {/*currentTableIndex={this.props.currentTableIndex}*/}
-                            {/*schemaID={schemaID}*/}
-                            {/*userID={userID}*/}
-                            {/*/>*/}
-                            {/*}*/}
                         </div>
                     </Content>
                 </Layout>
@@ -346,120 +336,3 @@ class UpdateTableButton extends Component {
         )
     }
 }
-
-class DeleteTableButton extends Component {
-    render() {
-        let schemaID = this.props.schemaID;
-        let userID = this.props.userID;
-
-        let varobj = {
-            id: schemaID,
-            updatedAt: new Date().getTime(),
-            schemaState: 'updated-delete-table',
-        };
-
-        return (
-            <Query query={gql(SHOW_TABLE)} variables={{schema_id: schemaID}}>
-
-                {
-                    ({loading, error, data}) => {
-                        if (loading)
-                            return <Spin style={{marginLeft: 30, marginTop: 10}}/>;
-                        if (error)
-                            return 'error';
-
-                        let schemaData = data;
-
-                        return (
-                            <Mutation
-                                mutation={gql(UPDATE_SCHEMA)}
-                                update={(cache, {data: {update_schema}}) => {
-                                    let data = cache.readQuery({
-                                        query: gql(SHOW_TABLE),
-                                        variables: {schema_id: schemaID}
-                                    });
-                                    data.schema_by_id = update_schema;
-
-                                    let showSchemaData = cache.readQuery({
-                                        query: gql(SHOW_SCHEMA),
-                                        variables: {user_id: userID}
-                                    });
-                                    let schemas = showSchemaData.schema_by_props;
-                                    // console.log('schemas', schemas);
-                                    let targetSchema = schemas.find(obj => obj.schemaName === update_schema.schemaName);
-                                    // console.log('targetSchema', targetSchema);
-                                    let targetSchemaIndex = schemas.findIndex(obj => obj.schemaName === update_schema.schemaName);
-                                    // console.log('targetSchemaIndex', targetSchemaIndex);
-                                    let targetTables = JSON.parse(schemas[targetSchemaIndex].schemaData);
-                                    // console.log('targetTables', targetTables);
-                                    let targetTableIndex = targetTables.findIndex(obj => obj.name === this.props.currentTable);
-                                    // console.log('targetTableIndex', targetTableIndex);
-                                    targetTables.splice(targetTableIndex, 1);
-                                    // console.log('targetTablesAfterDelete', targetTables);
-                                    let temp = {schemaData: JSON.stringify(targetTables)};
-                                    // console.log('temp', temp);
-                                    let tempSchema = {...targetSchema, ...temp};
-                                    // console.log('tempSchema', tempSchema);
-                                    showSchemaData.schema_by_props.splice(targetSchemaIndex, 1, tempSchema);
-
-                                    cache.writeQuery(
-                                        {
-                                            query: gql(SHOW_TABLE),
-                                            variables: {schema_id: schemaID},
-                                            data
-                                        },
-                                        {
-                                            query: gql(SHOW_SCHEMA),
-                                            variables: {user_id: userID},
-                                            showSchemaData
-                                        }
-                                    );
-                                }}
-                            >
-
-                                {(update_schema, {loading, error}) => {
-                                    if (loading)
-                                        return <Spin style={{marginLeft: 30, marginTop: 10}}/>;
-                                    if (error)
-                                        return 'error';
-
-                                    // 先 query 再 mutation，然后删除
-                                    let schemaCols;
-                                    if (schemaData.schema_by_id === null) schemaCols = [];
-                                    else schemaCols = JSON.parse(schemaData.schema_by_id.schemaData);
-
-                                    const index = this.props.currentTableIndex;
-                                    // 设置-2 标志为新建页面，防止通过 tablename 被修改导致每次 index 都为 -1 从而修改最后一个
-                                    if (index === -2) {
-                                        console.log('初始页面')
-                                    } else if (index === -1) {
-                                        console.log('进行了一次删除操作 或 数据库信息不匹配');
-                                    } else {
-                                        schemaCols.splice(index, 1);
-                                    }
-
-                                    return (
-                                        <div style={{display: 'inline-block'}}>
-                                            <Button type="danger"
-                                                    onClick={() => {
-                                                        update_schema({
-                                                            variables: {
-                                                                ...varobj,
-                                                                schemaData: JSON.stringify(schemaCols)
-                                                            }
-                                                        });
-                                                    }}>
-                                                DELETE
-                                            </Button>
-                                        </div>
-                                    )
-                                }}
-                            </Mutation>
-                        )
-                    }
-                }
-
-            </Query>
-        )
-    }
-}

src/components/monitorNotify/MonitorNotify.jsx

@@ -17,7 +17,7 @@ class MonitorNotify extends Component {
     }
 
     switchMenu = (menuName, e) => {
-        console.log('menuName', menuName, 'e', e);
+        // console.log('menuName', menuName, 'e', e);
         this.setState({
             [menuName]: e.key,
         });

src/components/quantService/QuantService.jsx

@@ -17,7 +17,7 @@ class QuantService extends Component {
     }
 
     switchMenu = (menuName, e) => {
-        console.log('menuName', menuName, 'e', e);
+        // console.log('menuName', menuName, 'e', e);
         this.setState({
             [menuName]: e.key,
         });

src/components/trialCase/TrialCase.jsx

@@ -15,7 +15,7 @@ const {Content} = Layout;
 class TrialCase extends Component {
     constructor(props) {
         super(props);
-        console.log('TrialCase props',props);
+        // console.log('TrialCase props',props);
         this.state = {
             menuLevel2: "schema",
             // default user
@@ -50,7 +50,7 @@ class TrialCase extends Component {
     render() {
         let schemaID = this.props.history.location.state ? this.props.history.location.state.schemaID : "schema_1542243424669_92094965";
         let schemaName = this.props.history.location.state ? this.props.history.location.state.schemaName : "ecommerce";
-        console.log('schemaID0',schemaID,'schemaName0',schemaName);
+        // console.log('schemaID0',schemaID,'schemaName0',schemaName);
         return (
             <div>
                 <Menu

src/components/wechatService/WechatService.jsx

@@ -17,7 +17,7 @@ class WechatService extends Component {
     }
 
     switchMenu = (menuName, e) => {
-        console.log('menuName', menuName, 'e', e);
+        // console.log('menuName', menuName, 'e', e);
         this.setState({
             [menuName]: e.key,
         });