修改项目编辑页排版

package.json

@@ -55,6 +55,7 @@
     "path-to-regexp": "^3.0.0",
     "qs": "^6.7.0",
     "react": "^16.8.6",
+    "react-amap": "^1.2.8",
     "react-copy-to-clipboard": "^5.0.1",
     "react-document-title": "^2.0.3",
     "react-dom": "^16.8.6",

src/pages/building/list/add/components/amap.jsx

@@ -0,0 +1,20 @@
+import React from 'react';
+import ReactDOM from 'react-dom';
+import { Map } from 'react-amap';
+
+class Amap extends React.Component {
+  constructor(props) {
+    super(props)
+    this.state = { coordinates: [] }
+  }
+
+  render() {
+    return (
+      <div style={{ width: '100%', height: '400px' }}>
+        <Map amapkey="f0d1d4f82432504003ebf46e5e36ff03"/>
+      </div>
+    )
+  }
+}
+
+export default Amap

src/pages/building/list/add/components/base.jsx

@@ -9,6 +9,7 @@ import ImageUpload from '../../../../../components/XForm/ImageUpload'
 import ImageListUpload from '../../../../../components/XForm/ImageListUpload'
 import Wangedit from '../../../../../components/Wangedit/Wangedit'
 import TagGroup from './tags'
+import Amap from './amap'
 import BudildingProjectType from './buildingProjectType'
 
 const { Option } = Select
@@ -177,7 +178,7 @@ function AddBuilding(props) {
             {getFieldDecorator('coordinate')(<Input disabled />)}
           </Form.Item>
           <Form.Item label="地图位置" hasFeedback>
-            {(<Input />)}
+            {(<Amap />)}
           </Form.Item>
           <Form.Item label="周边交通" hasFeedback>
             {getFieldDecorator('buildingTransport')(

src/pages/building/list/add/index.jsx

@@ -29,25 +29,41 @@ const formItemLayout = {
 };
 
 function AddBuilding(props) {
-  function tabsCallback(key) {
-    console.log(key);
+
+  const [tab, setTab] = useState('base')
+
+  function tabsCallback(e) {
+    console.log(e);
+    setTab(e.target.value)
   }
 
-  console.log(props.location)
+  // console.log(props.location)
 
   return (
-    <Tabs defaultActiveKey="1" onChange={tabsCallback}>
-      <TabPane tab="基本信息" key="1">
-        <Base building={{ buildingId: props.location.query && props.location.query.id }} />
-      </TabPane>
-      {
-        props.location.query.id &&
-        <TabPane tab="图片" key="2">
-          {/* '159fd19bb973b6972c10fbebf07ddeb1' */}
-          <ImageSet building={{ buildingId: props.location.query && props.location.query.id }} />
-        </TabPane>
-      }
-    </Tabs>
+    <>
+      <Radio.Group value={ tab } buttonStyle="solid" onChange={e => tabsCallback(e)}>
+        <Radio.Button value="base">基本信息</Radio.Button>
+        {
+          props.location.query.id && <Radio.Button value="image">图片</Radio.Button>
+        }
+      </Radio.Group>
+      <div style={{ marginTop: '20px' }}>
+        { tab === 'base' && <Base building={{ buildingId: props.location.query && props.location.query.id }} /> }
+        { props.location.query.id && (tab === 'image' && <ImageSet building={{ buildingId: props.location.query && props.location.query.id }} />)}
+      </div>
+    </>
+    // <Tabs defaultActiveKey="1" onChange={tabsCallback}>
+    //   <TabPane tab="基本信息" key="1">
+    //     <Base building={{ buildingId: props.location.query && props.location.query.id }} />
+    //   </TabPane>
+    //   {
+    //     props.location.query.id &&
+    //     <TabPane tab="图片" key="2">
+    //       {/* '159fd19bb973b6972c10fbebf07ddeb1' */}
+    //       <ImageSet building={{ buildingId: props.location.query && props.location.query.id }} />
+    //     </TabPane>
+    //   }
+    // </Tabs>
   )
 }