Merge branch 'master' of http://git.ycjcjy.com/marketing/pc-admin into master

config/proxy.js

@@ -8,7 +8,7 @@
 export default {
   dev: {
     '/api/': {
-      target: 'http://81.69.196.8:8567/',
+      target: 'https://xlk.njyz.tech/',
       changeOrigin: true,
       pathRewrite: {
         '^': '',

package.json

@@ -56,6 +56,7 @@
     "md5": "^2.3.0",
     "moment": "^2.24.0",
     "omit.js": "^1.0.2",
+    "package.json": "^2.0.1",
     "path-to-regexp": "2.4.0",
     "qs": "^6.9.0",
     "react": "^16.8.6",

src/models/user.js

@@ -13,12 +13,16 @@ const UserModel = {
   },
   effects: {
     *fetchCurrent(_, { call, put }) {
-      const response = yield call(getCurrentUser);
-
-      yield put({
-        type: 'saveCurrentUser',
-        payload: response,
-      });
+      try {
+        const response = yield call(getCurrentUser);
+  
+        yield put({
+          type: 'saveCurrentUser',
+          payload: response,
+        });
+      } catch (err) {
+        console.error(err)
+      }
     },
   },
   reducers: {

src/pages/building/Developers/tableColumns.js

@@ -27,7 +27,7 @@ export default ({page,getBrandData, onEdit, onDelete}) => [
     dataIndex: 'brandImg',
     key: 'brandImg',
     align: 'center',
-    render:(_,record)=> <img src={getImgURL(record.brandImg)} style={{width:'165px',height:'104px'}}/>,
+    render:(_,record)=> <img src={getImgURL(record.brandImg)} style={{width:'165px',height:'104px',borderRadius:'5px'}}/>,
   },
   {
     title: '简介',

src/pages/building/Edit/Basic/form.js

@@ -0,0 +1,31 @@
+export function initForm(form, data) {
+  if (!data) return;
+
+  const formData = { ...data }
+  // 交房时间
+  if (data.receivedDate) {
+    formData.receivedDate = moment(data.receivedDate)
+  }
+
+  // 主图 - 多个
+  if (data.buildingImg) {
+    formData.avatarImage = data.buildingImg.map((x) => x.url)
+  }
+
+  // 封面 - 一个
+  if (data.buildingListImg) {
+    formData.listImage = data.buildingListImg.map(item => item.url)[0]
+  }
+
+  // 视频
+  if (data.videoUrl) {
+    formData.videoUrl = [].concat(data.videoUrl)
+  }
+
+  // 视频封面
+  if (data.videoImage) {
+    formData.videoImage = data.videoImage[0].url
+  }
+
+  form.setFieldsValue(formData);
+}

src/pages/building/Edit/Basic/getData.js

@@ -1,53 +0,0 @@
-import moment from 'moment'
-import { fetch, apis } from '@/utils/request'
-
-export default (id) => {
-  if (!id) {
-    return Promise.reject('没有找到有效的项目ID');
-  }
-
-  return new Promise((resolve, reject) => {
-    fetch(apis.building.buildingGetById)({ urlData: { id } }).then((res) => {
-      const data = { ...res }
-
-      // 交房时间
-      if (res.receivedDate) {
-        data.receivedDate = moment(res.receivedDate)
-      }
-
-      // 标签
-      if (res.buildingTag) {
-        data.tag = res.buildingTag.map((x) => x.tagName)
-      }
-
-      // 主图 - 多个
-      if (res.buildingImg) {
-        data.avatarImage = res.buildingImg.map((x) => x.url)
-      }
-
-      // 封面 - 一个
-      if (res.buildingListImg) {
-        data.listImage = res.buildingListImg.map(item => item.url)[0]
-      }
-
-      // 视频
-      if (res.videoUrl) {
-        data.videoUrl = [].concat(res.videoUrl)
-      }
-
-      // 视频封面
-      if (res.videoImage) {
-        data.videoImage = res.videoImage[0].url
-      }
-
-      // POI 相关
-      if (res.mapJson) {
-        data.mapJson = JSON.parse(res.mapJson) || []
-      }
-
-      resolve(data)
-    }).catch((err) => {
-      reject(err.message || err)
-    })
-  })
-}

src/pages/building/Edit/Basic/index.jsx

@@ -12,27 +12,40 @@ import OpenTimePicker from '../components/OpenTimePicker'
 import EditableArround from '../components/EditableArround'
 import FormGroupItem, { gourpItemLayout } from '../components/FormGroupItem'
 import { formItemLayout, validMinNum } from '../utils'
-import useTags from './tag'
+import useArrounds from './useArrounds'
+import usePois from './usePois'
+import useQuery from './useQuery'
+import { initForm } from './form'
 
 const fullWidth= { width: '100%' }
 const Item = Form.Item
 
 const BuildingBasic = React.forwardRef((props, ref) => {
-  const { form } = props;
+  const { form, history } = props;
   const { getFieldDecorator, getFieldValue, setFieldsValue } = form;
+  const { query } = history.location;
+  const { id } = query;
 
-  const [ loading, setLoading ] = useState({ arround: false })
+  const [ loading, setLoading ] = useState({ form: false, arround: false })
   const [
-    tags,
-    initTags,
-    updateTags,
-    deletePoi,
+    arrounds,
+    initArrounds,
+    updateArrounds,
+    deleteArround,
+  ] = useArrounds()
+  const [
+    pois,
     initPois,
-    pois2Tags,
-    // updatePois,
-    deleteTag,
-    updatePoisAndTags,
-  ] = useTags()
+    deletePoi,
+  ] = usePois()
+
+  const updateLoading = (key) => (state) => setLoading({ ...loading, [key]: state })
+
+  useQuery(id, updateLoading('form'), (res) => {
+    initPois(res.mapJson)
+    initArrounds(res)
+    initForm(form, res)
+  })
   
   // 视频文件上传前 回调
   const fileUploadBeforeUpload = (file, fileList) => {
@@ -67,322 +80,327 @@ const BuildingBasic = React.forwardRef((props, ref) => {
         }
       }, {})
 
-      updatePoisAndTags(pois)
+      initPois(pois, true)
       setLoading({ ...loading, arround: false })
     }).catch((err) => {
       setLoading({ ...loading, arround: false })
       console.error(err)
       notification.error({ message: '周边数据获取异常' })
     })
-
-    // POI_TYPES.forEach(({ key }) => {
-    //   getPoiData({ type: key, location: lngLat, radius: e }).then(res => {
-    //     updatePois(key, res.pois || [])
-    //   }).catch(err => {
-    //     console.error(err)
-    //     notification.error({ message: '周边数据获取失败' })
-    //   })
-    // })
   }
 
   return (
-    <Form {...formItemLayout}>
-      <Item label="项目Id" style={{ display: 'none' }}>
-        {getFieldDecorator('buildingId')(<Input disabled />)}
-      </Item>
-      <Item label="楼盘编号" >
-        {getFieldDecorator('code', {
-          rules: [{ required: true, message: '请输入楼盘编号' }],
-        })(<Input />)}
-      </Item>
-      <Item label="楼盘名称" >
-        {getFieldDecorator('buildingName', {
-          rules: [{ required: true, message: '请输入楼盘名' }],
-        })(<Input />)}
-      </Item>
-      <Form.Item label="项目类型">
-        {getFieldDecorator('buildingProjectType', {
-          rules: [{ required: true, message: '请选择项目类型' }],
-        })(<BuildingType />)}
-      </Form.Item>
-      <Form.Item label="列表均价" help="项目列表展示价格，示例：约10000元/㎡、约1000万元/套起">
-        {getFieldDecorator('price')(<Input />)}
-      </Form.Item>
-      <FormGroupItem>
-        <Form.Item label="开盘时间" {...gourpItemLayout.ab.a} >
-          {getFieldDecorator('openingDate')(
-            <OpenTimePicker placeholder="请选择开盘时间" style={fullWidth} />
-          )}
+    <Spin spinning={loading.form}>
+      <Form {...formItemLayout}>
+        <Item label="项目Id" style={{ display: 'none' }}>
+          {getFieldDecorator('buildingId')(<Input disabled />)}
+        </Item>
+        <Item label="楼盘编号" >
+          {getFieldDecorator('code', {
+            rules: [{ required: true, message: '请输入楼盘编号' }],
+          })(<Input />)}
+        </Item>
+        <Item label="楼盘名称" >
+          {getFieldDecorator('buildingName', {
+            rules: [{ required: true, message: '请输入楼盘名' }],
+          })(<Input />)}
+        </Item>
+        <Form.Item label="项目类型">
+          {getFieldDecorator('buildingProjectType', {
+            rules: [{ required: true, message: '请选择项目类型' }],
+          })(<BuildingType />)}
         </Form.Item>
-        <Form.Item label="电话" {...gourpItemLayout.ab.b } >
-          {getFieldDecorator('tel', {
-            rules: [
-              {
-                pattern: new RegExp('^[0-9]*$'),
-                message: '请输入正确的电话号码',
-              },
-            ],
-          })(<Input placeholder="手机或者座机号码" />)}
+        <Form.Item label="列表均价" help="项目列表展示价格，示例：约10000元/㎡、约1000万元/套起">
+          {getFieldDecorator('price')(<Input />)}
         </Form.Item>
-      </FormGroupItem>
-      <Form.Item label="项目说明" >
-        {getFieldDecorator('dynamic')(<Input placeholder="项目动态等，不超过30个字" maxLength={30}/>)}
-      </Form.Item>
-      {/* <Form.Item label="物业类型" >
-        {getFieldDecorator('propertyType')(<Input />)}
-      </Form.Item> */}
-      <Form.Item label="销售状态" >
-        {getFieldDecorator('marketStatus', {
-          rules: [{ required: true, message: '请选择销售状态' }],
-        })(
-          <Select placeholder="销售状态" style={fullWidth}>
-            <Select.Option value="待售">待售</Select.Option>
-            <Select.Option value="在售">在售</Select.Option>
-            <Select.Option value="售罄">售罄</Select.Option>
-            <Select.Option value="在租">在租</Select.Option>
-          </Select>,
-        )}
-      </Form.Item>
-      <Form.Item label="项目标签" >
-        {getFieldDecorator('tag')(
-          <Select mode="tags" placeholder="输入后选中" style={fullWidth} />
-        )}
-      </Form.Item>
-
-      <FormGroupItem>
-        <Form.Item label="项目视频" help="视频仅支持mp4格式，建议尺寸：750*600，比例5:4，用于楼盘详情" {...gourpItemLayout.ab.a} >
-          {getFieldDecorator('videoUrl')(
-            <FileUpload accept=".mp4" beforeUpload={fileUploadBeforeUpload} label="上传视频" size={1} />,
-          )}
+        <FormGroupItem>
+          <Form.Item label="开盘时间" {...gourpItemLayout.ab.a} >
+            {getFieldDecorator('openingDate')(
+              <OpenTimePicker placeholder="请选择开盘时间" style={fullWidth} />
+            )}
+          </Form.Item>
+          <Form.Item label="电话" {...gourpItemLayout.ab.b } >
+            {getFieldDecorator('tel', {
+              rules: [
+                {
+                  pattern: new RegExp('^[0-9]*$'),
+                  message: '请输入正确的电话号码',
+                },
+              ],
+            })(<Input placeholder="手机或者座机号码" />)}
+          </Form.Item>
+        </FormGroupItem>
+        <Form.Item label="项目说明" >
+          {getFieldDecorator('dynamic')(<Input placeholder="项目动态等，不超过30个字" maxLength={30}/>)}
         </Form.Item>
-        <Form.Item label="视频封面图" help="建议图片尺寸：750*600px，比例5:4,格式：jpg，用于视频封面" labelCol={{span: 8}} wrapperCol={{span:16}}>
-          {getFieldDecorator('videoImage')(
-            <ImageUpload />,
+        {/* <Form.Item label="物业类型" >
+          {getFieldDecorator('propertyType')(<Input />)}
+        </Form.Item> */}
+        <Form.Item label="销售状态" >
+          {getFieldDecorator('marketStatus', {
+            rules: [{ required: true, message: '请选择销售状态' }],
+          })(
+            <Select placeholder="销售状态" style={fullWidth}>
+              <Select.Option value="待售">待售</Select.Option>
+              <Select.Option value="在售">在售</Select.Option>
+              <Select.Option value="售罄">售罄</Select.Option>
+              <Select.Option value="在租">在租</Select.Option>
+            </Select>,
           )}
         </Form.Item>
-      </FormGroupItem>
-      <Form.Item label="楼盘主图" help="建议图片尺寸：750*600px，比例5:4,格式：jpg，用于楼盘详情">
-        {getFieldDecorator('avatarImage', {
-          rules: [{ required: true, message: '请选择项目主图' }],
-        })(
-          <ImageListUpload unlimited />,
-        )}
-      </Form.Item>
-      <Form.Item label="楼盘封面图" help="建议图片尺寸：750*420px，比例16:9,格式：jpg，用于楼盘列表">
-        {getFieldDecorator('listImage', {
-          rules: [{ required: true, message: '请选择列表图' }],
-        })(
-          <ImageUpload />,
-        )}
-      </Form.Item>
-      <FormGroupItem>
-        <Form.Item label="首页推荐" {...gourpItemLayout.ab.a} >
-          {getFieldDecorator('isMain', { initialValue: 1 })(
-            <Radio.Group>
-              <Radio value={1}>是</Radio>
-              <Radio value={2}>否</Radio>
-            </Radio.Group>,
+        <Form.Item label="项目标签" >
+          {getFieldDecorator('tag')(
+            <Select mode="tags" placeholder="输入后选中" style={fullWidth} />
           )}
         </Form.Item>
-        <Form.Item label="排序" help="数值越大，楼盘在小程序列表页中展示越靠前" {...gourpItemLayout.ab.b}>
-          {getFieldDecorator('orderNo')(<InputNumber min={0} style={fullWidth} />)}
-        </Form.Item>
-      </FormGroupItem>
-      <FormGroupItem>
-        <Form.Item label="所在城市" {...gourpItemLayout.ab.a } >
-          {getFieldDecorator('cityId', {
-            rules: [{ required: true, message: '请选择城市' }],
+
+        <FormGroupItem>
+          <Form.Item label="项目视频" help="视频仅支持mp4格式，建议尺寸：750*600，比例5:4，用于楼盘详情" {...gourpItemLayout.ab.a} >
+            {getFieldDecorator('videoUrl')(
+              <FileUpload accept=".mp4" beforeUpload={fileUploadBeforeUpload} label="上传视频" size={1} />,
+            )}
+          </Form.Item>
+          <Form.Item label="视频封面图" help="建议图片尺寸：750*600px，比例5:4,格式：jpg，用于视频封面" labelCol={{span: 8}} wrapperCol={{span:16}}>
+            {getFieldDecorator('videoImage')(
+              <ImageUpload />,
+            )}
+          </Form.Item>
+        </FormGroupItem>
+        <Form.Item label="楼盘主图" help="建议图片尺寸：750*600px，比例5:4,格式：jpg，用于楼盘详情">
+          {getFieldDecorator('avatarImage', {
+            rules: [{ required: true, message: '请选择项目主图' }],
           })(
-            <SelectCity style={fullWidth} />,
+            <ImageListUpload unlimited />,
           )}
         </Form.Item>
-        <Form.Item label="楼盘区域" {...gourpItemLayout.ab.b } >
-          {getFieldDecorator('buildingArea', {
-            rules: [{ required: true, message: '请输入楼盘区域' }],
-          })(<AreaSelect style={fullWidth} />)}
-        </Form.Item>
-      </FormGroupItem>
-      <Form.Item label="项目地址" >
-        {getFieldDecorator('address', {
-          rules: [{ required: true, message: '请输入项目地址' }],
-        })(<Input />)}
-      </Form.Item>
-      <Form.Item label="项目坐标" >
-        {getFieldDecorator('coordinate', {
-          rules: [{ required: true, message: '请输入项目坐标' }],
-        })(<Amap onChange={e => setFieldsValue({ coordinate: e })} />)}
-      </Form.Item>
-      <Form.Item label="周边范围" >
-        {getFieldDecorator('mapScope', {
-          rules: [{ required: true, message: '请选择周边设施搜索范围' }],
-        })(
-          <Select placeholder="周边设施搜索范围" style={fullWidth} onChange={handleMapScopeChange}>
-            <Select.Option value={1000}>1公里</Select.Option>
-            <Select.Option value={3000}>3公里</Select.Option>
-            <Select.Option value={5000}>5公里</Select.Option>
-            <Select.Option value={10000}>10公里</Select.Option>
-          </Select>,
-        )}
-      </Form.Item>
-      <Spin spinning={loading.arround}>
-        <Form.Item label="周边交通" >
-          <EditableArround
-            tags={tags.buildingTransport}
-            onChange={(e) => updateTags('buildingTransport', e)}
-            onDelete={(tag) => deleteTag('buildingTransport', tag)}
-            onPoiDelete={(poi) => deletePoi('Transport', poi)}
-          />
-        </Form.Item>
-        <Form.Item label="周边商业" >
-          <EditableArround
-            tags={tags.buildingMall}
-            onChange={(e) => updateTags('buildingMall', e)}
-            onDelete={(tag) => deleteTag('buildingMall', tag)}
-            onPoiDelete={(poi) => deletePoi('Mall', poi)}
-          />
-        </Form.Item>
-        <Form.Item label="周边学校" >
-          <EditableArround
-            tags={tags.buildingEdu}
-            onChange={(e) => updateTags('buildingEdu', e)}
-            onDelete={(tag) => deleteTag('buildingEdu', tag)}
-            onPoiDelete={(poi) => deletePoi('Edu', poi)}
-          />
-        </Form.Item>
-        <Form.Item label="周边医院" >
-          <EditableArround
-            tags={tags.buildingHospital}
-            onChange={(e) => updateTags('buildingHospital', e)}
-            onDelete={(tag) => deleteTag('buildingHospital', tag)}
-            onPoiDelete={(poi) => deletePoi('Hospital', poi)}
-          />
-        </Form.Item>
-        <Form.Item label="周边银行" >
-          <EditableArround
-            tags={tags.buildingBank}
-            onChange={(e) => updateTags('buildingBank', e)}
-            onDelete={(tag) => deleteTag('buildingBank', tag)}
-            onPoiDelete={(poi) => deletePoi('Bank', poi)}
-          />
-        </Form.Item>
-        <Form.Item label="周边餐饮" >
-          <EditableArround
-            tags={tags.buildingRestaurant}
-            onChange={(e) => updateTags('buildingRestaurant', e)}
-            onDelete={(tag) => deleteTag('buildingRestaurant', tag)}
-            onPoiDelete={(poi) => deletePoi('Restaurant', poi)}
-          />
-        </Form.Item>
-      </Spin>
-      <FormGroupItem>
-        <Form.Item label="绿化率" {...gourpItemLayout.ab.a } >
-          {getFieldDecorator('greeningRate')(<Input />)}
-        </Form.Item>
-        <Form.Item label="容积率" {...gourpItemLayout.ab.b }>
-          {getFieldDecorator('volumeRate')(<Input />)}
+        <Form.Item label="楼盘封面图" help="建议图片尺寸：750*420px，比例16:9,格式：jpg，用于楼盘列表">
+          {getFieldDecorator('listImage', {
+            rules: [{ required: true, message: '请选择列表图' }],
+          })(
+            <ImageUpload />,
+          )}
         </Form.Item>
-      </FormGroupItem>
-      <FormGroupItem>
-        <Form.Item label="车位数量" {...gourpItemLayout.ab.a }>
-          {getFieldDecorator('parkingRate', {
-            rules: [{ validator: validMinNum }]
-          })(<InputNumber min={0} style={fullWidth}/>)}
+        <FormGroupItem>
+          <Form.Item label="首页推荐" {...gourpItemLayout.ab.a} >
+            {getFieldDecorator('isMain', { initialValue: 1 })(
+              <Radio.Group>
+                <Radio value={1}>是</Radio>
+                <Radio value={2}>否</Radio>
+              </Radio.Group>,
+            )}
+          </Form.Item>
+          <Form.Item label="排序" help="数值越大，楼盘在小程序列表页中展示越靠前" {...gourpItemLayout.ab.b}>
+            {getFieldDecorator('orderNo')(<InputNumber min={0} style={fullWidth} />)}
+          </Form.Item>
+        </FormGroupItem>
+        <FormGroupItem>
+          <Form.Item label="所在城市" {...gourpItemLayout.ab.a } >
+            {getFieldDecorator('cityId', {
+              rules: [{ required: true, message: '请选择城市' }],
+            })(
+              <SelectCity style={fullWidth} />,
+            )}
+          </Form.Item>
+          <Form.Item label="楼盘区域" {...gourpItemLayout.ab.b } >
+            {getFieldDecorator('buildingArea', {
+              rules: [{ required: true, message: '请输入楼盘区域' }],
+            })(<AreaSelect style={fullWidth} />)}
+          </Form.Item>
+        </FormGroupItem>
+        <Form.Item label="项目地址" >
+          {getFieldDecorator('address', {
+            rules: [{ required: true, message: '请输入项目地址' }],
+          })(<Input />)}
         </Form.Item>
-        <Form.Item label="规划户数" {...gourpItemLayout.ab.b }>
-          {getFieldDecorator('familyNum', {
-            rules: [{ validator: validMinNum }]
-          })(<InputNumber min={0} style={fullWidth}/>)}
+        <Form.Item label="项目坐标" >
+          {getFieldDecorator('coordinate', {
+            rules: [{ required: true, message: '请输入项目坐标' }],
+          })(<Amap onChange={e => setFieldsValue({ coordinate: e })} />)}
         </Form.Item>
-      </FormGroupItem>
-      <FormGroupItem>
-        <Form.Item label="供水" {...gourpItemLayout.abc.a }>
-          {getFieldDecorator('waterSupply')(
-            <Select style={fullWidth}>
-              <Select.Option value="民水">民水</Select.Option>
-              <Select.Option value="商用">商用</Select.Option>
-            </Select>
+        <Form.Item label="周边范围" >
+          {getFieldDecorator('mapScope', {
+            rules: [{ required: true, message: '请选择周边设施搜索范围' }],
+          })(
+            <Select placeholder="周边设施搜索范围" style={fullWidth} onChange={handleMapScopeChange}>
+              <Select.Option value={1000}>1公里</Select.Option>
+              <Select.Option value={3000}>3公里</Select.Option>
+              <Select.Option value={5000}>5公里</Select.Option>
+              <Select.Option value={10000}>10公里</Select.Option>
+            </Select>,
           )}
         </Form.Item>
-        <Form.Item label="供电" {...gourpItemLayout.abc.b }>
-          {getFieldDecorator('powerSupply')(
-            <Select style={fullWidth}>
-              <Select.Option value="民电">民电</Select.Option>
-              <Select.Option value="商用">商用</Select.Option>
-            </Select>
-          )}
+        <Spin spinning={loading.arround}>
+          <Form.Item label="周边交通" >
+            <EditableArround
+              type="Transport"
+              pois={pois.Transport}
+              tags={arrounds.buildingTransport}
+              onChange={(e) => updateArrounds('buildingTransport', e)}
+              onDelete={deleteArround}
+              onPoiDelete={(poi) => deletePoi('Transport', poi)}
+            />
+          </Form.Item>
+          <Form.Item label="周边商业" >
+            <EditableArround
+              type="Mall"
+              pois={pois.Mall}
+              tags={arrounds.buildingMall}
+              onChange={(e) => updateArrounds('buildingMall', e)}
+              onDelete={deleteArround}
+              onPoiDelete={(poi) => deletePoi('Mall', poi)}
+            />
+          </Form.Item>
+          <Form.Item label="周边学校" >
+            <EditableArround
+              type="Edu"
+              pois={pois.Edu}
+              tags={arrounds.buildingEdu}
+              onChange={(e) => updateArrounds('buildingEdu', e)}
+              onDelete={deleteArround}
+              onPoiDelete={(poi) => deletePoi('Edu', poi)}
+            />
+          </Form.Item>
+          <Form.Item label="周边医院" >
+            <EditableArround
+              type="Hospital"
+              pois={pois.Hospital}
+              tags={arrounds.buildingHospital}
+              onChange={(e) => updateArrounds('buildingHospital', e)}
+              onDelete={deleteArround}
+              onPoiDelete={(poi) => deletePoi('Hospital', poi)}
+            />
+          </Form.Item>
+          <Form.Item label="周边银行" >
+            <EditableArround
+              type="Bank"
+              pois={pois.Bank}
+              tags={arrounds.buildingBank}
+              onChange={(e) => updateArrounds('buildingBank', e)}
+              onDelete={deleteArround}
+              onPoiDelete={(poi) => deletePoi('Bank', poi)}
+            />
+          </Form.Item>
+          <Form.Item label="周边餐饮" >
+            <EditableArround
+              type="Restaurant"
+              pois={pois.Restaurant}
+              tags={arrounds.buildingRestaurant}
+              onChange={(e) => updateArrounds('buildingRestaurant', e)}
+              onDelete={deleteArround}
+              onPoiDelete={(poi) => deletePoi('Restaurant', poi)}
+            />
+          </Form.Item>
+        </Spin>
+        <FormGroupItem>
+          <Form.Item label="绿化率" {...gourpItemLayout.ab.a } >
+            {getFieldDecorator('greeningRate')(<Input />)}
+          </Form.Item>
+          <Form.Item label="容积率" {...gourpItemLayout.ab.b }>
+            {getFieldDecorator('volumeRate')(<Input />)}
+          </Form.Item>
+        </FormGroupItem>
+        <FormGroupItem>
+          <Form.Item label="车位数量" {...gourpItemLayout.ab.a }>
+            {getFieldDecorator('parkingRate', {
+              rules: [{ validator: validMinNum }]
+            })(<InputNumber min={0} style={fullWidth}/>)}
+          </Form.Item>
+          <Form.Item label="规划户数" {...gourpItemLayout.ab.b }>
+            {getFieldDecorator('familyNum', {
+              rules: [{ validator: validMinNum }]
+            })(<InputNumber min={0} style={fullWidth}/>)}
+          </Form.Item>
+        </FormGroupItem>
+        <FormGroupItem>
+          <Form.Item label="供水" {...gourpItemLayout.abc.a }>
+            {getFieldDecorator('waterSupply')(
+              <Select style={fullWidth}>
+                <Select.Option value="民水">民水</Select.Option>
+                <Select.Option value="商用">商用</Select.Option>
+              </Select>
+            )}
+          </Form.Item>
+          <Form.Item label="供电" {...gourpItemLayout.abc.b }>
+            {getFieldDecorator('powerSupply')(
+              <Select style={fullWidth}>
+                <Select.Option value="民电">民电</Select.Option>
+                <Select.Option value="商用">商用</Select.Option>
+              </Select>
+            )}
+          </Form.Item>
+          <Form.Item label="供暖" {...gourpItemLayout.abc.c }>
+            {getFieldDecorator('heatingSupply')(
+              <Select style={fullWidth}>
+                <Select.Option value="集中供暖">集中供暖</Select.Option>
+                <Select.Option value="自采暖">自采暖</Select.Option>
+              </Select>
+            )}
+          </Form.Item>
+        </FormGroupItem>
+        <Form.Item label="物业公司" >
+          {getFieldDecorator('serviceCompany', {
+            rules: [{ max: 30, message: '不超过30个字' }]
+          })(<Input placeholder="不超过30个字"/>)}
         </Form.Item>
-        <Form.Item label="供暖" {...gourpItemLayout.abc.c }>
-          {getFieldDecorator('heatingSupply')(
-            <Select style={fullWidth}>
-              <Select.Option value="集中供暖">集中供暖</Select.Option>
-              <Select.Option value="自采暖">自采暖</Select.Option>
-            </Select>
-          )}
+        <Form.Item label="物业费" >
+          {getFieldDecorator('serviceFee', {
+            rules: [{ max: 30, message: '不超过30个字' }]
+          })(<Input placeholder="不超过30个字"/>)}
         </Form.Item>
-      </FormGroupItem>
-      <Form.Item label="物业公司" >
-        {getFieldDecorator('serviceCompany', {
-          rules: [{ max: 30, message: '不超过30个字' }]
-        })(<Input placeholder="不超过30个字"/>)}
-      </Form.Item>
-      <Form.Item label="物业费" >
-        {getFieldDecorator('serviceFee', {
-          rules: [{ max: 30, message: '不超过30个字' }]
-        })(<Input placeholder="不超过30个字"/>)}
-      </Form.Item>
-      <FormGroupItem>
-        <Form.Item label="装修标准" {...gourpItemLayout.ab.a }>
-          {getFieldDecorator('decoration')(
-            <Select style={fullWidth}>
-              <Select.Option value="精装">精装</Select.Option>
-              <Select.Option value="毛坯">毛坯</Select.Option>
-            </Select>
-          )}
+        <FormGroupItem>
+          <Form.Item label="装修标准" {...gourpItemLayout.ab.a }>
+            {getFieldDecorator('decoration')(
+              <Select style={fullWidth}>
+                <Select.Option value="精装">精装</Select.Option>
+                <Select.Option value="毛坯">毛坯</Select.Option>
+              </Select>
+            )}
+          </Form.Item>
+          <Form.Item label="楼栋总数" {...gourpItemLayout.ab.b }>
+            {getFieldDecorator('buildingNum', {
+              rules: [{ validator: validMinNum }]
+            })(<InputNumber style={fullWidth}/>)}
+          </Form.Item>
+        </FormGroupItem>
+        <FormGroupItem>
+          <Form.Item label="交房时间" {...gourpItemLayout.ab.a }>
+            {getFieldDecorator('receivedDate')(<DatePicker style={fullWidth}/>)}
+          </Form.Item>
+          <Form.Item label="产权年限" {...gourpItemLayout.ab.b }>
+            {getFieldDecorator('rightsYear', {
+              rules: [{ validator: validMinNum }]
+            })(<InputNumber style={fullWidth}/>)}
+          </Form.Item>
+        </FormGroupItem>
+        <Form.Item label="品牌开发商" help="【品牌开发商】与【开发商】二选一">
+          {getFieldDecorator('brandId')(<Select style={fullWidth}></Select>)}
         </Form.Item>
-        <Form.Item label="楼栋总数" {...gourpItemLayout.ab.b }>
-          {getFieldDecorator('buildingNum', {
-            rules: [{ validator: validMinNum }]
-          })(<InputNumber style={fullWidth}/>)}
+        <Form.Item label="开发商" >
+          {getFieldDecorator('propertyDeveloper', {
+            rules: [{ max: 30, message: '不超过30个字' }]
+          })(<Input placeholder="不超过30个字"/>)}
         </Form.Item>
-      </FormGroupItem>
-      <FormGroupItem>
-        <Form.Item label="交房时间" {...gourpItemLayout.ab.a }>
-          {getFieldDecorator('receivedDate')(<DatePicker style={fullWidth}/>)}
+        <Form.Item label="备案名" >
+          {getFieldDecorator('recordName', {
+            rules: [{ max: 30, message: '不超过30个字' }]
+          })(<Input placeholder="不超过30个字" />)}
         </Form.Item>
-        <Form.Item label="产权年限" {...gourpItemLayout.ab.b }>
-          {getFieldDecorator('rightsYear', {
-            rules: [{ validator: validMinNum }]
-          })(<InputNumber style={fullWidth}/>)}
+        <Form.Item label="预售许可证" >
+          {getFieldDecorator('preSalePermit')(
+            <ImageUpload />,
+          )}
         </Form.Item>
-      </FormGroupItem>
-      <Form.Item label="品牌开发商" help="【品牌开发商】与【开发商】二选一">
-        {getFieldDecorator('brandId')(<Select style={fullWidth}></Select>)}
-      </Form.Item>
-      <Form.Item label="开发商" >
-        {getFieldDecorator('propertyDeveloper', {
-          rules: [{ max: 30, message: '不超过30个字' }]
-        })(<Input placeholder="不超过30个字"/>)}
-      </Form.Item>
-      <Form.Item label="备案名" >
-        {getFieldDecorator('recordName', {
-          rules: [{ max: 30, message: '不超过30个字' }]
-        })(<Input placeholder="不超过30个字" />)}
-      </Form.Item>
-      <Form.Item label="预售许可证" >
-        {getFieldDecorator('preSalePermit')(
-          <ImageUpload />,
-        )}
-      </Form.Item>
 
-      <Form.Item label=" " colon={false}>
-        <Button style={{marginLeft: '6em'}} type="primary" htmlType="submit">
-            确定
-        </Button>
-        <Button style={{marginLeft: '2em'}} onClick={() => router.go(-1)}>
-            取消
-        </Button>
-      </Form.Item>
-    </Form>
+        <Form.Item label=" " colon={false}>
+          <Button style={{marginLeft: '6em'}} type="primary" htmlType="submit">
+              确定
+          </Button>
+          <Button style={{marginLeft: '2em'}} onClick={() => router.go(-1)}>
+              取消
+          </Button>
+        </Form.Item>
+      </Form>
+    </Spin>
   )
 })
 

src/pages/building/Edit/Basic/tag.js

@@ -1,116 +0,0 @@
-import { useCallback, useState, useRef } from "react";
-
-export default function useTags(form) {
-  const [tags, setTags] = useState({})
-  const poisRef = useRef({})
-
-  // const updatePoi2Form = pois => form.setFieldsValue('mapJson', Object.keys(pois).map((key) => ({ key, data: pois[key] })))
-
-  // initPois 必须先于 initTags 执行
-  // initPois, initTags 是在请求远程数据结束后执行
-  const initPois = useCallback((raw) => {
-    const newPois = !raw ? {} : raw.reduce((acc, poi) => {
-      const { key, data } = poi
-      return {
-        ...acc,
-        [key]: data || []
-      }
-    }, {})
-
-    poisRef.current = newPois
-  }, [])
-
-  // 主要用于地图搜索周边结果
-  const updatePois = useCallback((key, val) => {
-    poisRef.current[key] = val
-
-    // 先把 tags 中的 poi 去掉, 再更新
-    const tagKey = `building${key}`
-    const newTags = (tags[tagKey] || []).filter((tag) => !tag.id).concat(val)
-    setTags({
-      ...tags,
-      [tagKey]: newTags,
-    })
-
-    // 更新form
-    // updatePoi2Form(poisRef.current)
-    // form.setFieldsValue({ [key]: newTags.map((tag) => tag.name).join(',') })
-  }, [tags])
-
-  // 主要用于单个 poi 删除
-  const deletePoi = useCallback((key, val) => {
-    if (!poisRef.current[key] || !poisRef.current[key].length) return;
-
-    const newPois = poisRef.current[key].filter((poi) => poi.name !== val.name)
-    poisRef.current[key] = newPois
-
-    // 更新form
-    // updatePoi2Form(poisRef.current)
-  }, [])
-
-  const updatePoisAndTags = useCallback((pois) => {
-    poisRef.current = pois
-    const keys = Object.keys(pois)
-    
-    const newTags = keys.reduce((acc, key) => {
-      const tagKey = `building${key}`
-      const arr = (tags[tagKey] || []).filter((tag) => !tag.id).concat(pois[key])
-      return { ...acc, [tagKey]: arr }
-    }, tags)
-
-    setTags(newTags)
-  }, [tags])
-
-  const initTags = useCallback((key, raw) => {
-    const tagArr = !raw ? [] : raw.split(',').filter(Boolean)
-
-    if (!tagArr.length) return;
-
-    const pois = poisRef.current[key] || []
-
-    const newTags = tagArr.map((tag) => {
-      const found = pois.filter((poi) => poi.name === tag)[0]
-
-      return found || { name: tag }
-    })
-
-    setTags({
-      ...tags,
-      [key]: newTags,
-    })
-  }, [tags])
-
-  const updateTags = useCallback((key, newTags = []) => {
-    setTags({
-      ...tags,
-      [key]: newTags,
-    })
-
-    // form.setFieldsValue({ [key]: newTags.map((tag) => tag.name).join(',') })
-  }, [tags])
-
-  // 主要用户单个 tag 删除
-  const deleteTag = useCallback((key, tag) => {
-    if (!tags[key] || !tags[key].length) return;
-
-    const leftTags = tags[key].filter((x) => x.name !== tag.name)
-
-    setTags({
-      ...tags,
-      [key]: leftTags,
-    })
-
-    // form.setFieldsValue({ [key]: leftTags.map((tag) => tag.name).join(',') })
-  })
-
-  return [
-    tags,
-    initTags,
-    updateTags,
-    deletePoi,
-    initPois,
-    updatePois,
-    deleteTag,
-    updatePoisAndTags,
-  ]
-}

src/pages/building/Edit/Basic/useArrounds.js

@@ -0,0 +1,48 @@
+import { useCallback, useState, useRef } from "react";
+
+const formateArroundTag = str => (str || '').split(',').filter(Boolean).map(x => ({name: x}));
+
+export default function useArrounds() {
+  const [arrounds, setArrounds] = useState({})
+
+  // 用来初始化数据库数据
+  const initArrounds = useCallback((data) => {
+    const tags = {
+      buildingTransport: formateArroundTag(data.buildingTransport),
+      buildingMall: formateArroundTag(data.buildingMall),
+      buildingEdu: formateArroundTag(data.buildingEdu),
+      buildingHospital: formateArroundTag(data.buildingHospital),
+      buildingBank: formateArroundTag(data.buildingBank),
+      buildingRestaurant: formateArroundTag(data.buildingRestaurant),
+    }
+
+    setArrounds(tags)
+  }, [])
+
+  // 用于周边 onChange 事件
+  const updateArrounds = useCallback((key, vals) => {
+    setArrounds({
+      ...arrounds,
+      [key]: vals || [],
+    })
+  }, [arrounds])
+
+  // 主要用户单个 tag 删除
+  const deleteArround = useCallback((key, tag) => {
+    if (!arrounds[key] || !arrounds[key].length) return;
+
+    const leftArrounds = arrounds[key].filter((x) => x.name !== tag.name)
+
+    setArrounds({
+      ...arrounds,
+      [key]: leftArrounds,
+    })
+  }, [arrounds])
+
+  return [
+    arrounds,
+    initArrounds,
+    updateArrounds,
+    deleteArround,
+  ]
+}

src/pages/building/Edit/Basic/usePois.js

@@ -0,0 +1,40 @@
+import { useCallback, useState } from "react";
+
+export default function usePois() {
+  const [pois, setPois] = useState({})
+
+  const initPois = useCallback((data, formated) => {
+    if (!data) return;
+
+    if (formated) {
+      setPois(data)
+      return;
+    }
+
+    const nwPois = data.reduce((acc, poi) => {
+      return {
+        ...acc,
+        [poi.key]: poi.data ? JSON.parse(poi.data) : [],
+      }
+    }, {})
+
+    setPois(nwPois)
+  }, [])
+  
+  const deletePoi = useCallback((key, val) => {
+    if (!pois[key] || !pois[key].length) return;
+
+    const newPois = pois[key].filter((poi) => poi.name !== val.name)
+
+    setPois({
+      ...pois,
+      [key]: newPois
+    })
+  }, [pois])
+
+  return [
+    pois,
+    initPois,
+    deletePoi,
+  ]
+}

src/pages/building/Edit/Basic/useQuery.js

@@ -0,0 +1,40 @@
+import { useEffect, useState } from 'react'
+import { fetch, apis } from '@/utils/request'
+import { notification } from 'antd'
+
+export default function useData(id, setLoading, callback) {
+  const [data, setData] = useState()
+
+  useEffect(() => {
+    if (!id) {
+      setData();
+      return;
+    }
+
+    setLoading(true);
+    fetch(apis.building.buildingGetById)({ urlData: { id } }).then((res) => {
+
+      // 标签
+      if (res.buildingTag) {
+        res.tag = res.buildingTag.map((x) => x.tagName)
+      }
+
+      // POI 相关
+      if (res.mapJson) {
+        res.mapJson = JSON.parse(res.mapJson) || []
+      }
+
+      setData(res)
+      setLoading(false);
+
+      if (callback) {
+        callback(res)
+      }
+    }).catch((err) => {
+      setLoading(false);
+      notification.error({message: err.message || err})
+    })
+  }, [id])
+
+  return [data, setData]
+}

src/pages/building/Edit/components/Amap/index.jsx

@@ -22,13 +22,11 @@ export default (props) => {
 
   useEffect(() => {
     // 只加载一次 amap 相关 js
-    sdk.loadMapModule({
-      plugins,
-    }).then((AMap) => {
+    sdk.loadMapModule({ plugins }).then((AMap) => {
       const instance = new AMap.Map(container.current, { zoom: 12 })
       instance.addControl(new AMap.Scale())
       instance.addControl(new AMap.ToolBar())
-      
+
       // 尝试自动定位到当前位置
       if (!props.value) {
         instance.addControl(autoPos(AMap))
@@ -60,7 +58,15 @@ export default (props) => {
 
   useEffect(() => {
     if (currentPos.length) {
-      posMarker.current.setPosition(currentPos)
+      if (posMarker.current) {
+        posMarker.current.setPosition(currentPos)
+      }
+      if (map.current) {
+        map.current.setCenter(currentPos);
+      }
+      if (currentPos.length && map.current) {
+        posMarker.current.setMap(map.current)
+      }
     }
   }, [currentPos])
 

src/pages/building/Edit/components/BuildingTypeDetail.jsx

@@ -1,4 +1,4 @@
-import React, { useState } from 'react'
+import React, { useEffect, useState } from 'react'
 import { Button, Drawer, Form, Radio, Input, Select } from 'antd'
 import { formItemLayout } from '../utils'
 import styles from '../style.less'
@@ -31,14 +31,18 @@ const BuildingTypeDetail = (props) => {
       };
 
       const data = {
-        ...values,
         ...dataset || {},
+        ...values,
       }
 
       onSubmit(data)
     })
   }
 
+  useEffect(() => {
+    form.setFieldsValue(dataset)
+  }, [dataset])
+
   return (
     <Drawer
       width={600}

src/pages/building/Edit/components/BuildingTypeSelect.jsx

@@ -33,7 +33,7 @@ export default React.forwardRef((props, ref) => {
 
   const handleClick = (buildingType) => () => {
     const current = (value || []).filter((it) => it.buildingTypeId === buildingType.buildingTypeId)[0] || {buildingTypeId: buildingType.buildingTypeId}
-    
+    console.log('-------------->', current)
     setCurRow(current)
     setBuildingType(buildingType)
     setShowDrawer(true)
@@ -84,9 +84,8 @@ export default React.forwardRef((props, ref) => {
               <Checkbox
                 checked={checked}
                 onChange={handleChange(it)}
-              >
-                {it.buildingTypeName}
-              </Checkbox>
+              />
+              <span style={{display: 'inline-block', margin: '0 .5em'}}>{it.buildingTypeName}</span>
               {checked && <a href="#" onClick={handleClick(it)}><Icon type="edit" /></a>}              
             </Card.Grid>
           )

src/pages/building/Edit/components/EditableArround/MapPois.jsx

@@ -1,26 +0,0 @@
-import React, { useRef, useEffect, forwardRef } from 'react'
-
-export default forwardRef((props, ref) => {
-  const tags = useRef((props.pois || '').split(','))
-
-  // 用来记录上一次传值
-  const previous = useRef()
-
-  // 监控 props.pois 的变化, 触发 onChange
-  // 实际场景中 props.pois 只会由地图引起变化
-  useEffect(() => {
-    const changed = previous.current !== props.pois
-    if (changed) {
-      tags.current = (props.pois || '').split(',')
-      previous.current = props.pois
-
-      if (props.onChange) {
-        props.onChange(tags.current)
-      }
-    }
-  }, [props.pois, props.onChange])
-
-  return (
-    <></>
-  )
-})

src/pages/building/Edit/components/EditableArround/hooks/usePoi.js

@@ -1,41 +0,0 @@
-import { useCallback, useEffect, useRef } from "react";
-
-export default function usePoi(pois, tags, setTags) {
-  const poiRef = useRef([])
-
-  useEffect(() => {
-    const len1 = !pois ? 0 : pois.length
-    const len2 = poiRef.current.length
-
-    // 空数据
-    if (len1 === len2 && len1 === 0) {
-      return
-    }
-
-    // 如果是 poiRef 更新导致了 pois 更新
-    if (len1 > 0 && poiRef.current === pois) {
-      return
-    }
-
-    // 如果是初始化
-    poiRef.current = pois || []
-  }, [pois])
-
-  const updatePois = useCallback((pois) => {
-    const newTags = tags.filter((tag) => !tag.id)
-    setTags(newTags.concat(pois))
-  }, [tags])
-
-  const deletePoi = useCallback((poi) => {
-    const newTags = tags.filter((tag) => tag.id !== poi.id)
-
-    const newPois = !poiRef.current.length ? [] : poiRef.current.filter((p) => p.id !== poi.id)
-    poiRef.current = newPois
-
-    setTags(newTags)
-
-    return newPois
-  }, [tags])
-
-  return [updatePois, deletePoi]
-}

src/pages/building/Edit/components/EditableArround/hooks/useTag.js

@@ -1,43 +0,0 @@
-import { useCallback, useRef } from "react";
-
-export default function useTag(inited, tags, setTags) {
-  const getNewTag = useRef()
-  getNewTag.current = (tag) => {
-    const matched = tags.filter((item) => (tag.name === item.name))[0]
-
-    if (matched && matched.id) {
-      return matched
-    }
-
-    return tag
-  }
-
-  const updateTags = useCallback((nwTags) => {
-    if (!nwTags || !nwTags.length) {
-      return tags
-    }
-
-    const nwVals = nwTags.map((tag) => getNewTag.current(tag))
-    setTags(nwVals)
-    inited.current = true
-  }, [tags])
-
-  const appendTags = useCallback((tag) => {
-    const found = tags.filter((item) => (tag.name === item.name))[0]
-    if (found) {
-      return
-    }
-
-    setTags(tags.concat(tag))
-    inited.current = true
-  }, [tags])
-
-
-  const deleteTags = useCallback((tag) => {
-    const nwVal = tags.filter((it) => it.name !== tag.name)
-    
-    setTags(nwVal)
-  }, [tags])
-
-  return [updateTags, appendTags, deleteTags]
-}

src/pages/building/Edit/components/EditableArround/hooks/useValue.js

@@ -1,17 +0,0 @@
-import { useEffect, useRef } from "react"
-
-export default function useValue(value, poiRef, updateTags) {
-  const valueInited = useRef(false)
-
-  useEffect(() => {
-    if (!valueInited.current && value) {
-      const vals = value.split(',').filter(Boolean).map((tag) => ({ name: tag }))
-      const newTags = !poiRef.length ? vals : vals.map((val) => {
-        const found = poiRef.current.filter((poi) => poi.name === val.name)[0]
-        return found || val
-      })
-      updateTags(newTags)
-      valueInited.current = true
-    }
-  }, [value])
-}

src/pages/building/Edit/components/EditableArround/index.jsx

@@ -1,10 +1,8 @@
-import React, { useEffect, useRef, useState } from 'react'
+import React, { useRef, useState } from 'react'
 import { Typography, Tag, Input, Icon } from 'antd'
-import MapPois from './MapPois'
-import { arrRemove, arrAdd } from './utils'
 
 export default React.forwardRef((props, ref) => {
-  const { tags = [], onPoiDelete, onDelete, onChange } = props
+  const { tags = [], pois = [], type, onPoiDelete, onDelete, onChange } = props
 
   const inputRef = useRef()
   const [inputValue, setInputValue] = useState()
@@ -12,18 +10,19 @@ export default React.forwardRef((props, ref) => {
 
   const handleClose = (tag) => {
     if (tag.id && onPoiDelete) {
-      onPoiDelete(tag)
+      onPoiDelete(type, tag)
+      return
     }
 
     if (onDelete) {
-      onDelete(tag)
+      onDelete(`building${type}`, tag)
     }
   }
 
   const handleInputConfirm = () => {
-    const exists = tags.filter((tag) => tag.name === inputValue)[0]
+    const exists = tags.concat(pois).filter((tag) => tag.name === inputValue)[0]
     if (!exists) {
-      onChange(tags.concat({ name: inputValue }))
+      onChange(`building${type}`, tags.concat({ name: inputValue }))
     }
     setInputVisible(false)
     setInputValue()
@@ -32,7 +31,7 @@ export default React.forwardRef((props, ref) => {
   return (
     <div>
       {
-        tags.map((tag) => (
+        tags.concat(pois).map((tag) => (
           <Tag key={tag.name} closable onClose={() => handleClose(tag)}>
             <Typography.Text>{tag.name}</Typography.Text>
           </Tag>

src/pages/building/Edit/components/EditableArround/utils.js

@@ -1,35 +0,0 @@
-
-export function arrRemove(src, target) {
-  if (!target || target.length < 1) {
-    return src;
-  }
-
-  if (!src || src.length < 1) {
-    return src;
-  }
-
-  const arr = src.filter((it) => target.indexOf(it) === -1)
-  if (arr.length === src.length) return src;
-
-  return arr;
-}
-
-export function arrAdd(src, add) {
-  if (!add || add.length < 1) {
-    return src;
-  }
-
-  if (!src && add.length > 0) {
-    return [...add]
-  }
-
-  
-  const nwTags = src.slice()
-  add.forEach((it) => {
-    if (nwTags.indexOf(it) === -1) {
-      nwTags.push(it)
-    }
-  })
-
-  return nwTags;
-}

src/pages/building/Edit/index.jsx

@@ -21,45 +21,45 @@ export default (props) => {
       <Tabs defaultActiveKey="1">
         <TabPane tab="基础信息" key="1">
           <div className={styles['tab-wrapper']} style={{maxWidth: 1000}}>
-            <Basic />
+            <Basic {...props} />
           </div>
         </TabPane>
         <TabPane tab="户型设置" key="2">
           <div className={styles['tab-wrapper']}>
-            <Apartment />
+            <Apartment {...props} />
           </div>
         </TabPane>
         <TabPane tab="项目相册" key="3">
           <div className={styles['tab-wrapper']}>
-            <AlbumList />
+            <AlbumList {...props} />
           </div>
         </TabPane>
         <TabPane tab="全景照片" key="4">
           <div className={styles['tab-wrapper']}>
-            <Panorama />
+            <Panorama {...props} />
           </div>
         </TabPane>
         <TabPane tab="项目动态" key="8">
           <div className={styles['tab-wrapper']}>
-            <News />
+            <News {...props} />
           </div>
         </TabPane>
         <TabPane tab="特价房源" key="9">
           <div className={styles['tab-wrapper']}>
-            <SpecialRoom />
+            <SpecialRoom {...props} />
           </div>
         </TabPane>
         <TabPane tab="渠道设置" key="7">
           <div className={styles['tab-wrapper']} style={{maxWidth: '800px'}}>
-            <Channel />
+            <Channel {...props} />
           </div>
         </TabPane>
         <TabPane tab="海报图片" key="5">
-          <Poster target={target} />
+          <Poster target={target} {...props} />
         </TabPane>
         <TabPane tab="分享设置" key="6">
           <div className={styles['tab-wrapper']} style={{maxWidth: '800px'}}>
-            <Share target={target} />
+            <Share target={target} {...props} />
           </div>
         </TabPane>
       </Tabs>

src/pages/home/Recommend/auditCopy.jsx

@@ -33,14 +33,14 @@ function body(props) {
   function getById(currentId) {
     request({ ...apis.customer.recommendGetById, urlData: { id: currentId } }).then(res => {
       // res.reportDate = moment(res.reportDate)
-      if(res){
-        props.form.setFieldsValue({...res,reportDate:moment(res.reportDate)})
+      if (res) {
+        props.form.setFieldsValue({ ...res, reportDate: moment(res.reportDate) })
       }
-    
+
     })
   }
   //返回上一页
-  function backCom(){
+  function backCom() {
     window.history.back(-1)
   }
   return (
@@ -81,15 +81,15 @@ function body(props) {
         </Form.Item>
         <Form.Item label="客户备注"  >
           {getFieldDecorator('say')(
-            <TextArea  placeholder="客户描述" rows={7}
+            <TextArea placeholder="客户描述" rows={7}
             />,
           )}
         </Form.Item>
         <Form.Item label="回访备注" >
-          {getFieldDecorator('describe' ,{
-            rules:[{required:true}]//v3x必填
+          {getFieldDecorator('describe', {
+            rules: [{ required: true }]//v3x必填
           })(
-            <TextArea placeholder="回访备注" rows={7}  value={props}/>,
+            <TextArea placeholder="回访备注" rows={7} value={props} />,
           )}
         </Form.Item>
         <Form.Item style={{ display: 'flex', justifyContent: 'center' }}>

src/pages/home/Recommend/index.jsx

@@ -1,5 +1,5 @@
-import React, {PureComponent, useMemo, useState } from 'react';
-import {  Avatar, Button } from 'antd';
+import React, { PureComponent, useMemo, useState } from 'react';
+import { Avatar, Button } from 'antd';
 import moment from 'moment';
 import request from '../../../utils/request';
 import apis from '../../../services/apis';
@@ -26,7 +26,7 @@ import { backgroundColor } from 'echarts/lib/theme/dark';
 
 
 function Recommend() {
-  const [exportLoding,setExportLoding] = useState(false)
+  const [exportLoding, setExportLoding] = useState(false)
   //详情页面弹窗配置
   function toAudit(cuurentId) {
     router.push({
@@ -35,7 +35,7 @@ function Recommend() {
         id: cuurentId,
       },
     })
-    
+
   }
   function toSee(cuurentId) {
     router.push({
@@ -44,7 +44,7 @@ function Recommend() {
         id: cuurentId,
       },
     })
-    
+
   }
 
 
@@ -64,19 +64,16 @@ function Recommend() {
 
     })
   }
-  function back(){
-    window.history.back(-1)
-  }
 
   function download(data) {
     if (!data) {
-      return 
+      return
     }
     const url = window.URL.createObjectURL(new Blob([data]))
     const link = document.createElement('a')
     link.style.display = 'none'
     link.href = url
-    link.setAttribute('download', '推荐客户.xlsx')
+    link.setAttribute('download', '找房需求.xlsx')
     document.body.append(link)
     link.click()
     setExportLoding(false)
@@ -84,146 +81,143 @@ function Recommend() {
   const columns = [
     {
       title: '头像',
-      dataIndex: 'picture',
-      key: 'picture',
-      align:'center',
-      render: (_, record) => <Avatar shape="square" src={record.picture} size={64} icon="user" />,
+      dataIndex: 'avatarurl',
+      key: 'avatarurl',
+      align: 'center',
+      render: (_, record) => <Avatar shape="square" src={record.avatarurl} size={64} />,
     },
     {
       title: '姓名',
-      dataIndex: 'name',
-      key: 'name',
-      align:'center',
+      dataIndex: 'nickname',
+      key: 'nickname',
+      align: 'center',
       // render: (_, record) => <><span>{record.name = '曹建芳'}</span></>,
     },
     {
       title: '电话',
       dataIndex: 'phone',
       key: 'phone',
-      align:'center',
+      align: 'center',
     },
     {
       title: '性别',
-      dataIndex: 'sex',
-      key: 'sex',
-      align:'center',
+      dataIndex: 'gender',
+      key: 'gender',
+      align: 'center',
       // eslint-disable-next-line no-nested-ternary
-      render: (_, record) => <><span>{record.sex === 1 ? '男' : record.sex === 2 ? '女' : '未知'}</span></>,
+      render: (_, record) => <><span>{record.gender === '1' ? '男' : record.gender === '2' ? '女' : '未知'}</span></>,
     },
     {
       title: '意向区域',
-      dataIndex: 'area',//意向区域
-      key: 'area',
-      align:'center',
-      render: (_, record) => <><span>{record.area = '江苏省南京市秦淮区'}</span></>,
+      dataIndex: 'intentArea',//意向区域
+      key: 'intentArea',
+      align: 'center',
+      // render: (_, record) => <><span>{record.area = '江苏省南京市秦淮区'}</span></>,
 
     },
     {
       title: '意向项目',
       dataIndex: 'intention',
       key: 'intention',
-      // intention
-      //project
-      align:'center',
-      // render: (_, record) => <><span>{record.area = '香颂.蔚澜半岛'}</span></>,
-      render:(_,record)=><span>{record='香颂.蔚澜半岛'}</span>
+      align: 'center',
+      // render:(_,record)=><span>{record='香颂.蔚澜半岛'}</span>
 
     },
     {
       title: '提交时间',
-      dataIndex: 'createDate',
-      key: 'createDate',
-      align:'center',
-      render: (_, record) => <><span>{record.createDate && moment(record.createDate).format('YYYY-MM-DD HH:mm:ss')}</span></>,
+      dataIndex: 'createdTime',
+      key: 'createdTime',
+      align: 'center',
+      render: (_, record) => <><span>{record.createdTime && moment(record.createdTime).format('YYYY-MM-DD HH:mm:ss')}</span></>,
     },
     {
       title: '状态',
-      dataIndex: 'verifyStatus',
-      key: 'verifyStatus',
-      align:'center',
-      render: (_, record) => <><span>{record.verifyStatus === 0 ? '待回访' : record.verifyStatus === 1 ? '已回访'   : record.verifyStatus === 2 ? '无效' : ''}</span></>,
+      dataIndex: 'status',
+      key: 'status',
+      align: 'center',
+      render: (_, record) => <><span>{record.verifyStatus === 0 ? '待回访' : record.verifyStatus === 1 ? '已回访' : record.verifyStatus === 2 ? '无效' : ''}</span></>,
     },
     {
       title: '操作',
       dataIndex: 'customerId',
       key: 'customerId',
-      align:'center',
+      align: 'center',
 
       render: (_, record) => (
         <><span style={{ color: 'rgba(239,39,58,1)', cursor: 'pointer' }} >
-          {record.verifyStatus ===0?<span onClick={() => toAudit(record.customerId)}>审核</span>
-          : record.verifyStatus ===1?<span onClick={() => toSee(record.customerId)}>查看详情</span>
-          : record.verifyStatus ===2?<span onClick={() => toSee(record.customerId)}>查看详情</span>
-          :''}</span>
+          {record.verifyStatus === 0 ? <span onClick={() => toAudit(record.customerId)}>审核</span>
+            : record.verifyStatus === 1 ? <span onClick={() => toSee(record.customerId)}>查看详情</span>
+              : record.verifyStatus === 2 ? <span onClick={() => toSee(record.customerId)}>查看详情</span>
+                : ''}</span>
         </>
       ),
     },
   ]
 
 
- const searchFields=[
-
-  {
-    name: 'project',
-    label: '意向项目',
-    placeholder: '请输入意向项目',
-  },
-
-  {
-    name: 'name',
-    label: '姓名',
-    placeholder: '请输入姓名',
-  },
-  {
-    name: 'tel',
-    label: '电话',
-    placeholder: '请输入电话',
-  },
+  const searchFields = [
+
+    {
+      name: 'project',
+      label: '意向项目',
+      placeholder: '请输入意向项目',
+    },
+
+    {
+      name: 'name',
+      label: '姓名',
+      placeholder: '请输入姓名',
+    },
     {
-    name: 'types',
-    label: '类型',
-    placeholder: '类型',
-    type: 'select',
-    options: [
-      {label: '全部',value:''},
-      {label: '买房',value: '1'},
-      {label: '租房', value: '2'},
-      {label: '海外', value: '3'}
-    ]
-  },
-  {
-    name: 'verifyStatus',
-    label: '状态',
-    placeholder: '请选择状态',
-    type: 'select',
-    placeholder:'全部',//错误
-    options: [
-      {label: '全部',value:''},
-      {label: '待回访', value: '0'},
-      {label: '已回访', value: '1'},
-      {label: '无效', value: '2'}
-    ]
-  },
+      name: 'tel',
+      label: '电话',
+      placeholder: '请输入电话',
+    },
+    {
+      name: 'types',
+      label: '类型',
+      placeholder: '类型',
+      type: 'select',
+      options: [
+        { label: '全部', value: '' },
+        { label: '买房', value: '1' },
+        { label: '租房', value: '2' },
+        { label: '海外', value: '3' }
+      ]
+    },
+    {
+      name: 'verifyStatus',
+      label: '状态',
+      placeholder: '请选择状态',
+      type: 'select',
+      placeholder: '全部',//错误
+      options: [
+        { label: '全部', value: '' },
+        { label: '待回访', value: '0' },
+        { label: '已回访', value: '1' },
+        { label: '无效', value: '2' }
+      ]
+    },
   ]
- const actionRender = () => {
-  return (
-    <Button type="danger" loading={exportLoding} onClick={() => exportRecommendCustomer()}>
-      导出
-    </Button>
-  );
-};
+  const actionRender = () => {
+    return (
+      <Button type="danger" loading={exportLoding} onClick={() => exportRecommendCustomer()}>
+        导出
+      </Button>
+    );
+  };
 
   return (
     <>
       <QueryTable
-          rowKey="recommendCustomer"
-          // recommendCustomer
-          api={apis.searchHouse.list}
-          searchFields={searchFields}
-          columns={columns}
-          actionRender={actionRender}
-        />
-    
+        rowKey="recommendCustomer"
+        // recommendCustomer
+        api={apis.searchHouse.list}
+        searchFields={searchFields}
+        columns={columns}
+        actionRender={actionRender}
+      />
+
     </>
   );
 }

src/pages/staff/Organization/TreeTitle.jsx

@@ -0,0 +1,79 @@
+import { Icon } from 'antd';
+import { useState } from 'react';
+
+export default (props) => {
+    const [isEdit, setIsEdit] = useState(false)
+    const [inputVal, setInputVal] = useState()
+    const { onAdd, onDelete, isDelete, onChange, value } = props
+
+    const handleClose = () => {
+        setIsEdit(false)
+        setInputVal(value)
+    }
+
+    const handleSave = () => {
+        onChange(inputVal)
+        setIsEdit(false)
+        setInputVal()
+    }
+
+    if (isEdit) {
+        return (
+
+            <div>
+                {/* 逻辑运算 OR  */}
+                {/* item项目value根据状态切换 */}
+                {/*onChange这个API是一个函数，并且需要返回值，API的返回值是onChange方法的返回值
+                e就是api的形参，这个参数的生成需要onChange的API触发，同时将e传给方法并获取其返回值
+                实参把值给形参，由形参保存。
+                这个e会获取到最新的变化值并且传到onchange方法
+                */}
+                <input value={inputVal} onChange={(e) => setInputVal(e.target.value)} />
+
+                <Icon
+                    //取消保存
+                    type="close-circle"
+                    theme="filled"
+
+                    style={{ marginLeft: 10 }}
+                    onClick={handleClose}//恢复默认值 
+                />
+                <Icon
+                    //保存节点
+                    type="check-circle"
+                    theme="filled"
+                    style={{ marginLeft: 10 }}
+                    onClick={handleSave}
+                />
+            </div>
+        )
+    }
+
+    return (
+        <div >
+            <span>{value}</span>
+            <span>
+                {/* 编辑edit onclick 拿到项目的key */}
+                <Icon
+                    type="edit"
+                    style={{ marginLeft: 10 }}
+                    onClick={() => setIsEdit(true)}
+                />
+                {/* 编辑plus onclick 拿到项目的key */}
+                <Icon
+                    type="plus"
+                    style={{ marginLeft: 10 }}
+                    onClick={onAdd}
+                />
+                {/* 先确认父key是不是绝对等于"0" */}
+                {isDelete && (
+                    <Icon
+                        type="delete"
+                        style={{ marginLeft: 10 }}
+                        onClick={onDelete}
+                    />
+                )}
+            </span>
+        </div>
+    )
+}

src/pages/staff/Organization/form.jsx

@@ -0,0 +1,4 @@
+
+export default (props) => {
+
+}

src/pages/staff/Organization/index.jsx

@@ -1,140 +1,502 @@
+// import React, { useState } from "react";
+// import { Tree, Icon, Card } from "antd";
+// import { nanoid } from "nanoid";//生成唯一id
+// import { duration } from "moment";
+// import TreeTitle from './TreeTitle'
+
+// const { TreeNode } = Tree;
+// //树形数据
+// const treeData = [
+//   {
+//     value: "0",
+//     defaultValue: "0",
+//     key: "0",
+//     parentKey: '0',
+//     isEditable: false,
+//     children: [
+//       {
+//         value: "0",
+//         key: "0-1",
+//         defaultValue: "0-1",
+//         isEditable: false,
+//       },
+//     ],
+//   },
+
+// ];
+
+// const expandedKeyArr = ["0"];
+// export default function TreeDemo() {
+//   const [data, setData] = useState(treeData);//获取值，及时更新被修改的值。变量
+//   const [expandedKeys, setExpandedKeys] = useState(expandedKeyArr);//状态
+//   // const onExpand = (expandedKeys) => {
+//   //   //记录折叠的key值
+//   //   setExpandedKeys(expandedKeys);
+//   // };
+//   //开始渲染树形节点 data拿到数据
+//   const renderTreeNodes = (data) => {
+//     //遍历项目
+//     let nodeArr = data.map((item) => {
+
+//       const Title = (
+//         <TreeTitle
+//           value={item.value}
+//           isDelete={item.parentKey !== "0"}
+//           onAdd={() => onAdd(item.key)}
+//           onDelete={() => onDelete(item.key)}
+//           onChange={(val) => onChange(val, item.key)}
+//         />
+//       );
+//       if (item.children) {
+//         return (
+//           <TreeNode title={Title} key={item.key} dataRef={item}>
+//             {/* 渲染 */}
+//             {renderTreeNodes(item.children)}
+//           </TreeNode>
+//         );
+//       }
+//       //返回他的标题，和key值
+//       return <TreeNode title={Title} key={item.key} />;
+//     });
+//     //返回节点
+//     return nodeArr;
+//   }
+//   //新增
+//   const onAdd = (key) => {
+//     if (expandedKeys.indexOf(key) === -1) {
+//       expandedKeyArr.push(key);
+//     }
+//     setExpandedKeys(expandedKeyArr.slice());
+//     addNode(key, treeData);//添加节点 树形
+//     //useState里数据务必为immutable （不可赋值的对象），所以必须加上slice()返回一个新的数组对象
+//     setData(treeData.slice());//添加子项
+//   };
+//   //编辑
+//   //拿到key treeData数据--setData设置数据---slice删除数据中已返回的元素  [aa,bb,cc,dd,ee]--slice(2)输出[cc,dd,ee]
+//   const onEdit = (key) => {
+//     editNode(key, treeData);
+//     setData(treeData.slice());
+//   };
+//   const editNode = (key, data) =>
+//     data.forEach((item) => {
+//       if (item.key === key) {
+//         //编辑状态 true
+
+//         item.isEditable = true;
+//       } else {
+
+//         //编辑状态 false
+//         item.isEditable = false;
+//       }
+//       item.value = item.defaultValue; // 当某节点处于编辑状态，并改变数据，点击编辑其他节点时，此节点变成不可编辑状态，value 需要回退到 defaultvalue
+//       //当某子项处于编辑状态，改变数据，点击其他时候，此项变成不可编辑
+//       if (item.children) {
+//         editNode(key, item.children);
+//         //编辑子节点
+//       }
+//     });
+
+//   const addNode = (key, data) =>
+//     data.forEach((item) => {
+//       if (item.key === key) {//如果拿到的key相同则判断子项
+//         if (item.children) {
+//           item.children.push({
+//             value: "default",//创建新的子项默认值
+//             key: nanoid(), // 这个 key 应该是唯一的
+//           });
+//         } else {
+//           item.children = [];
+//           item.children.push({
+//             value: "default",
+//             key: nanoid(),
+//           });
+//         }
+//         return;
+//       }
+//       if (item.children) {
+//         addNode(key, item.children);
+//       }
+//     });
+
+//   const onChange = (val, key) => {
+//     changeNode(key, val, treeData);
+//     setData(treeData.slice());
+//   };
+
+//   const changeNode = (key, value, data) =>
+//     data.forEach((item) => {
+//       if (item.key === key) {//新增子项内容赋值
+//         item.value = value;
+//       }
+//       if (item.children) {
+//         changeNode(key, value, item.children);//子项
+//       }
+//     });
+
+//   //确认保存节点
+//   const saveNode = (key, data) =>
+//     data.forEach((item) => {
+//       if (item.key === key) {
+//         item.defaultValue = item.value;//item.value内容赋值给defaultValue
+//       }
+//       //子项保存不能编辑
+//       if (item.children) {
+//         saveNode(key, item.children);
+//       }
+//       //项目是否能编辑
+//       item.isEditable = false;
+//     });
+
+//   //取消确认
+//   const closeNode = (key, defaultValue, data) =>
+//     data.forEach((item) => {
+//       item.isEditable = false;
+//       if (item.key === key) {
+//         item.value = defaultValue;
+//       }
+//       if (item.children) {
+//         closeNode(key, defaultValue, item.children);
+//       }
+//     });
+//   // slice() 方法可提取字符串的某个部分，并以新的字符串返回被提取的部分。
+//   const onDelete = (key) => {
+//     deleteNode(key, treeData);
+//     setData(treeData.slice());
+//   };
+//   //删除节点
+//   const deleteNode = (key, data) =>
+//     //拿到每个key数据， 如果要删除的key相同，则删除，并返回。如果不同判断子项
+//     data.forEach((item, index) => {
+//       if (item.key === key) {
+//         data.splice(index, 1);//从某个位置开始删除元素
+//         return;
+//       } else {
+//         if (item.children) {
+//           deleteNode(key, item.children);
+//         }
+//       }
+//     });
+
+//   return (
+//     <div>
+//       <Card style={{ width: '90%' }}>
+//         <Tree
+//           switcherIcon={<Icon type="down-square" theme="filled" />}
+//           expandedKeys={expandedKeys}
+//         // onExpand={onExpand}
+//         >
+//           {renderTreeNodes(data)}
+//         </Tree>
+//       </Card>
+
+//     </div>
+//   );
+// }
+
+
+
+
+
+
+
+
+
+
+
+
+
+import { Row, Col, Card, Tree, DatePicker, Form, Input, InputNumber, Radio, Button } from 'antd'
+import React, { useEffect, useState, useCallback } from 'react';
+import ImageUpload from '@/components/XForm/ImageUpload';
+
+// import userTrees from './tree'
+
+const { TreeNode, DirectoryTree } = Tree
+const FormItem = Form.Item;
+
+
+
+
+const userTree = React.forwardRef((props, ref) => {
+  const [loading, setLoading] = useState(false);//防止多次点击 定义loadind
+  const [formData, setFormData] = useState();//提交表单的数据
+  const [contentType, setContentType] = useState(1);//单选。初始默认显示1 富文本框。点击视频， 渲染2
+  const { form, history } = props;
+  const { getFieldDecorator, setFieldsValue, validateFields } = form;
+  const { curriculumId } = history.location.query || {}
+
+
+  const formItemLayout = {
+    //布局
+    labelCol: { span: 6 },
+    wrapperCol: { span: 14 },
 
-import React, { Component,useState } from 'react';
-import { Card, Tree,Icon } from 'antd';
-import { render } from 'preact';
-import { turn } from 'cli-table';
-const { DirectoryTree,TreeNode } = Tree;
-const treeData = [
-  {
-    value:'江苏省公安厅',
-    defaultValue:'0',
-    parentKey:'0',
-    isEditable:false,
-    key:'0',
-    children:[
-      {
-        value:'南京分局',
-        key:'0-1',
-        defaultValue: "0-1",
-        isEditable: false,
-      },
-      {
-        value:'苏州分局',
-        key:'0-2',
-        defaultValue: "0-2",
-        isEditable: false,
-      },
-    ],
-  },
-];
-
-
-const expandedKeyArr=['0'];
-
-
-export default function TreeDemo() {
-  const[data,setData]=useState(treeData)//获取值，及时更新被修改的值。变量
-  const renderTreeNodes=(data)=>{
-    let nodeArr=data.map((item)=>{//遍历数据
-      item.title=(//修改
-        <div style={{display:'flex', minWidth: '100px'}}>
-          <span style={{ flex: 'auto' }}>{item.value}</span>
-          <span style={{ width: '6em', flex: 'none',marginLeft:'20px' }}>
-            {/* 编辑 */}
-            <Icon type="edit" onClick={()=>onDelete(item.key)} /> 
-            {/* 添加 */}
-            <Icon type="diff" onClick={()=>onAdd(item.key)} />
-            {/* 删除 */}
-            <Icon type="delete"  onClick={()=>onEdit(item.key)}/>
-          </span>
-        </div>
-      )
-      if(item.children){//如果有子项就返回下面组件
-        return(
-          <TreeNode title={item.title} key={item.key} dataRef={item}>
-            {renderTreeNodes(item.children)}
-            {/* 重新渲染节点 */}
-          </TreeNode>//title 接收的 ReactNode类型数据 自定义
-        )
-      }
-      //返回
-      return <TreeNode title={item.title} key={item.key} />
-    })
-      return nodeArr
-  };
-//添加
-  const onAdd=(key)=>{
-    // useState 里面数据是不能变的对象。需要slice返回一个新的数组
-    addNode(key.treeData);//添加节点 树形
-    setData(treeData.slice()) //设置 子项
-  }
-  //编辑
-  const onEdit=(key)=>{
-    editNode(key,treeData);
-    setData(treeData.slice());
   };
-  const editNode=(key,data)=>
-    data.forEach((item)=>{
-      if (item.key===key) {
-        item.isEditable=true;//可编辑状态更改
-      }else{
-        item.isEditable=false;
-      }
-      item.value=item.defaultValue;//当某子项处于编辑状态，改变数据，点击其他时候，此项变成不可编辑
-      if (item.children) {
-        editNode(key,item.children);
-      }
-    })  
-
-    //删除
-    const onDelete = (key) => {
-      deleteNode(key, treeData);
-      setData(treeData.slice());
-    };
-    const deleteNode = (key, data) =>
-      data.forEach((item, index) => {
-        if (item.key === key) {
-          data.splice(index, 1);//从某个位置开始删除元素
-          return;
-        } else {
-          if (item.children) {
-            deleteNode(key, item.children);
-          }
-        }
-      });
-
-  const addNode=(key,data)=>
-    data.forEach((item)=>{
-      if(item.key===key){//如果拿到的key相同则判断子项
-        if (item.children) {
-          item.children.push({
-            value:"请输入内容",
-            key:key+Math.random(100),//随机唯一的key
-          });
-        }
-        return;
-      }
-      if (item.children) {
-        addNode(key,item.children)//子项
-      }
-    })
+
   return (
-    <div>
-      <Card style={{width:'90%'}}>
-        <Tree 
-        switcherIcon={<Icon type="down-square" theme="filled" />}
-        // icon={<Icon type="carry-out" />}
-        style={{paddingLeft:'60px'}} 
-        treeData={treeData}  >
-        {renderTreeNodes(data)}
-        </Tree>
-        {/* 渲染被更新 */}
-      </Card>
-    </div>
-  );
-}
+    <Card>
+      <Row justify='center'>
+        <Col xs={{ span: 5, offset: 1 }} lg={{ span: 6, offset: 0 }}>
+          <Card>
+            <Button type='danger' style={{ marginLeft: '2em' }} >
+              删除
+            </Button>
+            <DirectoryTree multiple>
+              <TreeNode title="parent 0" key="0-0">
+                <TreeNode title="leaf 0-0" key="0-0-0" isLeaf />
+                <TreeNode title="leaf 0-1" key="0-0-1" isLeaf />
+              </TreeNode>
+              <TreeNode title="parent 1" key="0-1">
+                <TreeNode title="leaf 1-0" key="0-1-0" isLeaf />
+                <TreeNode title="leaf 1-1" key="0-1-1" isLeaf />
+                <TreeNode title="leaf 1-1" key="0-1-2" isLeaf />
+                <TreeNode title="leaf 1-1" key="0-1-3" isLeaf />
+                <TreeNode title="leaf 1-1" key="0-1-4" isLeaf />
+                <TreeNode title="leaf 1-1" key="0-1-5" isLeaf />
+              </TreeNode>
+            </DirectoryTree>
+          </Card>
+        </Col>
+        {/* FFFFFFFFFFFFFFFFFFFFFFFFFFFFFFFFFFFFFFFFFFFFFFFFFFFFFFFFFFFFFFFFFFFFFFFFFFFFFFFFFFFFFFFFFFFFFFFFFFF>Form表单 */}
+        <Col xs={{ span: 10, offset: 10 }} lg={{ span: 10, offset: 4 }}>
+          <Card>
+            <Form {...formItemLayout} >
+              <FormItem label="照片" help="建议尺寸：750px*600px，比例5:4，格式：jpg，用于：列表和详情">
+                {
+                  getFieldDecorator('curriculumImg', {
+                    rules: [
+                      { required: true, message: '请上传照片' }
+                    ]
+                  })(
+                    <ImageUpload />
+                  )
+                }
+              </FormItem>
+              <FormItem label="姓名">
+                {
+                  getFieldDecorator('name', {
+                    rules: [
+                      { required: true, message: '请输入姓名' }
+                    ]
+                  })(
+                    <Input style={{ width: '88px' }} />
+                  )
+                }
+              </FormItem>
+              <FormItem label="年龄" >
+                {
+                  getFieldDecorator('weight', {
+                    rules: [{ required: true, message: '请输入年龄' }]
+                  })(
+                    <InputNumber min='18' />
+                  )
+                }
+              </FormItem>
+
+              <FormItem label="性别">
+                {
+                  getFieldDecorator('type', {
+                    rules: [
+                      { required: true, message: '请选择性别' }
+                    ]
+                  })(
+                    <Radio.Group value={contentType} style={{ width: '500px' }} defaultValue={1}>
+                      {/* onChange={e => setContentType(e.target.value)} */}
+                      <Radio value={1}>男</Radio>
+                      <Radio value={2}>女</Radio>
+                    </Radio.Group>
+                  )
+                }
+              </FormItem>
+              <Form.Item label="工作总时间" style={{ marginBottom: 0 }} help="如未离职，第二个日期则不用输入">
+                <Form.Item style={{ display: 'inline-block' }} >
+                  <DatePicker />
+                </Form.Item>
+                <span style={{ display: 'inline-block', width: '20px', textAlign: 'center' }}>至</span>
+                <Form.Item style={{ display: 'inline-block' }}>
+                  <DatePicker />
+                </Form.Item>
+              </Form.Item>
+
+              <FormItem wrapperCol={{ span: 12, offset: 6 }}>
+                <Button loading={loading} type="primary" htmlType="">
+                  确认修改
+                </Button>
+              </FormItem>
+            </Form>
+          </Card>
+        </Col>
+      </Row>
+    </Card>
+
+  )
+})
+
+
+
+// import React, { useEffect, useState, useCallback } from 'react';
+// import { Button, Form, Select, Input, InputNumber, Radio, message, DatePicker, Card } from 'antd';
+// import ImageUpload from '@/components/XForm/ImageUpload';
+// import FileUpload from '@/components/XForm/FileUpload';
+// import Wangedit from '@/components/Wangedit/Wangedit';
+// import router from 'umi/router';
+// import { fetch, apis } from '@/utils/request';
+
+// const FormItem = Form.Item;
+// const Option = Select.Option;
+// // const getCurriculumData = fetch(apis.course.searchCourse);
+// // const saveCurriculumData = fetch(apis.course.addCourse);
+// // const updateCurriculumData = fetch(apis.course.alterCourse);
+// const goBack = () => router.goBack(-1);
+
+// const userTree = React.forwardRef((props, ref) => {
+//   const [loading, setLoading] = useState(false);//防止多次点击 定义loadind
+//   const [formData, setFormData] = useState();//提交表单的数据
+//   const [contentType, setContentType] = useState(1);//单选。初始默认显示1 富文本框。点击视频， 渲染2
+//   const { form, history } = props;
+//   const { getFieldDecorator, setFieldsValue, validateFields } = form;
+//   const { curriculumId } = history.location.query || {}
+
+//   const formItemLayout = {
+//     //布局
+//     labelCol: { span: 6 },
+//     wrapperCol: { span: 14 },
+
+//   };
+
+//   const handleSubmit = (e) => {
+//     e.preventDefault();
+//     validateFields((err, values) => {
+//       if (err) {
+//         return;
+//         //字符验证未填写---返回
+//       }
+
+//       setLoading(true);//loading开始
+
+//       if (curriculumId) {
+//         //如果有这个id拿。没有就，拿返回的curriculumId
+//         updateCurriculumData({
+//           data: {
+//             ...values,
+//             curriculumId
+//           },
+//           urlData: { id: curriculumId }
+//         }).then(() => {
+//           setLoading(false);
+//           message.success('数据更新成功');
+//           goBack()
+//         }).catch((err) => {
+//           setLoading(false);//loading消失
+//           message.error(err.message || err);
+//         })
+//       } else {
+//         saveCurriculumData({ data: values }).then(() => {
+//           setLoading(false);
+//           message.success('数据保存成功');
+//           goBack()
+//         }).catch((err) => {
+//           setLoading(false);//loading消失
+//           message.error(err.message || err);
+//         })
+//       }
+//     });
+//   }
+
+//   const getCourseData = useCallback(({ curriculumId }) => {//函数结果存 初始化运行一次，等待调用。
+//     getCurriculumData({ urlData: { id: curriculumId } }).then((res) => {
+//       setFormData(res)
+//     })
+//   }, [])
+
+//   useEffect(() => {
+//     if (curriculumId) {
+//       getCourseData({ curriculumId })//第一次渲染前//获取id
+//     }
+//   }, [curriculumId])//第二次id一样不执行
+
+//   useEffect(() => {
+//     if (formData) {//1.form表单数据{2} 执行。无变更不执行
+//       setFieldsValue(formData)
+//     }
+//   }, [formData])//2.有变更跟的话
+
 
+//   return (
+//     <Card>
+//       <Form {...formItemLayout} onSubmit={handleSubmit}>
+//         <FormItem label="照片" help="建议尺寸：750px*600px，比例5:4，格式：jpg，用于：列表和详情">
+//           {
+//             getFieldDecorator('curriculumImg', {
+//               rules: [
+//                 { required: true, message: '请上传照片' }
+//               ]
+//             })(
+//               <ImageUpload />
+//             )
+//           }
+//         </FormItem>
+//         <FormItem label="姓名">
+//           {
+//             getFieldDecorator('name', {
+//               rules: [
+//                 { required: true, message: '请输入姓名' }
+//               ]
+//             })(
+//               <Input style={{ width: '88px' }} />
+//             )
+//           }
+//         </FormItem>
+//         <FormItem label="年龄" >
+//           {
+//             getFieldDecorator('weight', {
+//               rules: [{ required: true, message: '请输入年龄' }]
+//             })(
+//               <InputNumber min='18' />
+//             )
+//           }
+//         </FormItem>
 
+//         <FormItem label="性别">
+//           {
+//             getFieldDecorator('type', {
+//               rules: [
+//                 { required: true, message: '请选择性别' }
+//               ]
+//             })(
+//               <Radio.Group value={contentType} style={{ width: '500px' }} defaultValue={1}>
+//                 {/* onChange={e => setContentType(e.target.value)} */}
+//                 <Radio value={1}>男</Radio>
+//                 <Radio value={2}>女</Radio>
+//               </Radio.Group>
+//             )
+//           }
+//         </FormItem>
+//         <Form.Item label="工作总时间" style={{ marginBottom: 0 }} help="如未离职，第二个日期则不用输入">
+//           <Form.Item style={{ display: 'inline-block' }} >
+//             <DatePicker />
+//           </Form.Item>
+//           <span style={{ display: 'inline-block', width: '20px', textAlign: 'center' }}>至</span>
+//           <Form.Item style={{ display: 'inline-block' }}>
+//             <DatePicker />
+//           </Form.Item>
+//         </Form.Item>
 
+//         <FormItem wrapperCol={{ span: 12, offset: 6 }}>
+//           <Button loading={loading} type="primary" htmlType="">
+//             保存
+//           </Button>
+//           <Button style={{ marginLeft: '2em' }} onClick={goBack}>
+//             返回
+//           </Button>
+//           <Button type='danger' style={{ marginLeft: '2em' }} >
+//             删除
+//           </Button>
+//         </FormItem>
+//       </Form>
+//     </Card>
 
+//   )
+// })
 
+export default Form.create({})(userTree);

src/pages/staff/Organization/tree.jsx

@@ -0,0 +1,18 @@
+import { Tree } from 'antd'
+
+export default (props) => {
+    const { TreeNode, DirectoryTree } = Tree
+
+    return (
+        <DirectoryTree multiple>
+            <TreeNode title="parent 0" key="0-0">
+                <TreeNode title="leaf 0-0" key="0-0-0" isLeaf />
+                <TreeNode title="leaf 0-1" key="0-0-1" isLeaf />
+            </TreeNode>
+            <TreeNode title="parent 1" key="0-1">
+                <TreeNode title="leaf 1-0" key="0-1-0" isLeaf />
+                <TreeNode title="leaf 1-1" key="0-1-1" isLeaf />
+            </TreeNode>
+        </DirectoryTree>
+    )
+}

src/pages/system/Sellhouse/index.jsx

@@ -163,7 +163,7 @@ export default props => {
       align: 'center',
       with: 300,
       // ellipsis: true,
-      render:(_,record)=><span>{record.houseName='高奢生活，在遇到它之前你想象不到'}</span>
+      // render:(_,record)=><span>{record.houseName='高奢生活，在遇到它之前你想象不到'}</span>
     },
     {
       title: '城市',
@@ -171,7 +171,7 @@ export default props => {
       dataIndex: 'houseType',
       align: 'center',
       // render: t => t.newsTypeName,
-      render:(_,record)=><span>{record.houseType='南京'}</span>
+      // render:(_,record)=><span>{record.houseType='南京'}</span>
 
     },
     {

src/pages/system/housingPolicy/Edit/index.jsx

@@ -1,5 +1,5 @@
 import React, { useState, useEffect } from 'react';
-import { Form, Input, Button, Icon, Select, Tabs, Radio, DatePicker,message } from 'antd';
+import { Form, Input, Button, Icon, Select, Tabs, Radio, DatePicker, message, Card } from 'antd';
 
 import moment from 'moment';
 import router from 'umi/router';
@@ -16,118 +16,120 @@ const { MonthPicker, RangePicker, WeekPicker } = DatePicker;
  * @param {*} props
  * @returns
  */
- const Edit = (props) => {
+const Edit = (props) => {
   const policyId = props.location.query.policyId
-  const [ policyData, setPolicyData ] = useState({})
-  if(policyId){
+  const [policyData, setPolicyData] = useState({})
+  if (policyId) {
     useEffect(() => {
       getPolicyData(policyId);
-    },[])
+    }, [])
 
-  // 查询列表
-  const getPolicyData = (policyId) => {
-    request({ ...apis.system.taPolicy, urlData: {id: policyId} }).then((data) => {
+    // 查询列表
+    const getPolicyData = (policyId) => {
+      request({ ...apis.system.taPolicy, urlData: { id: policyId } }).then((data) => {
         console.log(data)
         setPolicyData(data)
-    })
-  }
+      })
+    }
   }
 
-  const cancelPage = () =>{
+  const cancelPage = () => {
     router.push({
       pathname: '/system/housingPolicy',
     });
   }
-    const fields = [
-      {
-        label: '城市',
-        name: 'cityId',
-        render: <SelectCity />,
-        value: policyData.cityId,
-        rules: [
-          {
-            required: true,
-            message: '请选择城市',
-          },
-        ],
-      },
-      {
-        label: '购房须知封面图',
-        name: 'policyImg',
-        type: FieldTypes.ImageUploader,
-        value: policyData.policyImg,
-        help: '建议图片尺寸：220*176px，比例5:4,格式：jpg，用于购房须知列表',
-        rules: [
-          {
-            required: true,
-            message: '请选择购房须知封面图',
-          },
-        ],
-      },
-      {
-        label: '购房须知标题',
-        name: 'title',
-        type: FieldTypes.Text,
-        value: policyData.title,
-        rules: [
-          {
-            required: true,
-            message: '请输入购房须知标题',
-          },
-        ],
-      },
-      {
-        label: '购房须知详情',
-        name: 'body',
-        render: <Wangedit />,
-        value: policyData.body,
-        rules: [
-          {
-            required: true,
-            message: '请输入购房须知详情',
-          },
-        ],
-      },
-      {
-        label: '状态',
-        name: 'publishStatus',
-        type: FieldTypes.Select,
-        dict: [{label:"未发布",value:0},{label:"已发布",value:1}],
-        value: policyData.publishStatus != null ? policyData.publishStatus : 1,
-      },
-    ]
-  
-    const handleSubmit = val => { 
-      console.log('submit data --->', val)
-      console.log(val.body, 'val.body')
-      if (val.body == '<p><br></p>'){
-        message.info("购房须知详情必填")
-        return
-      }
-      
-      if(policyId){
-        val.policyId = policyId
-        request({ ...apis.system.updateTaPolicy, urlData: {id: policyId},data: val, }).then((data) => {
-          message.info("保存成功")
-          cancelPage()
-        }).catch((err) => {
-          message.info(err.msg || err.message)
-        })
-      }else{
-        request({ ...apis.system.addTaPolicy,data: val, }).then((data) => {
-          message.info("保存成功")
-          cancelPage()
-        }).catch((err) => {
-          message.info(err.msg || err.message)
-        })
-      }
+  const fields = [
+    {
+      label: '城市',
+      name: 'cityId',
+      render: <SelectCity />,
+      value: policyData.cityId,
+      rules: [
+        {
+          required: true,
+          message: '请选择城市',
+        },
+      ],
+    },
+    {
+      label: '购房须知封面图',
+      name: 'policyImg',
+      type: FieldTypes.ImageUploader,
+      value: policyData.policyImg,
+      help: '建议图片尺寸：220*176px，比例5:4,格式：jpg，用于购房须知列表',
+      rules: [
+        {
+          required: true,
+          message: '请选择购房须知封面图',
+        },
+      ],
+    },
+    {
+      label: '购房须知标题',
+      name: 'title',
+      type: FieldTypes.Text,
+      value: policyData.title,
+      rules: [
+        {
+          required: true,
+          message: '请输入购房须知标题',
+        },
+      ],
+    },
+    {
+      label: '购房须知详情',
+      name: 'body',
+      render: <Wangedit />,
+      value: policyData.body,
+      rules: [
+        {
+          required: true,
+          message: '请输入购房须知详情',
+        },
+      ],
+    },
+    {
+      label: '状态',
+      name: 'publishStatus',
+      type: FieldTypes.Select,
+      dict: [{ label: "未发布", value: 0 }, { label: "已发布", value: 1 }],
+      value: policyData.publishStatus != null ? policyData.publishStatus : 1,
+    },
+  ]
+
+  const handleSubmit = val => {
+    console.log('submit data --->', val)
+    console.log(val.body, 'val.body')
+    if (val.body == '<p><br></p>') {
+      message.info("购房须知详情必填")
+      return
     }
-     
+
+    if (policyId) {
+      val.policyId = policyId
+      request({ ...apis.system.updateTaPolicy, urlData: { id: policyId }, data: val, }).then((data) => {
+        message.info("保存成功")
+        cancelPage()
+      }).catch((err) => {
+        message.info(err.msg || err.message)
+      })
+    } else {
+      request({ ...apis.system.addTaPolicy, data: val, }).then((data) => {
+        message.info("保存成功")
+        cancelPage()
+      }).catch((err) => {
+        message.info(err.msg || err.message)
+      })
+    }
+  }
+
 
   return (
-    <XForm onSubmit={handleSubmit} onCancel={cancelPage} fields={fields}></XForm>
+    <Card>
+      <XForm onSubmit={handleSubmit} onCancel={cancelPage} fields={fields}></XForm>
+    </Card>
   );
- }
+}
 
 
 

src/utils/image.js

@@ -3,5 +3,5 @@ export function getImgURL(img) {
     if (!img) return undefined;
 
     const isProd = process.env.NODE_ENV === 'production'
-    return isProd ? img : `http://81.69.196.8:8567${img}`;
+    return isProd ? img : `https://xlk.njyz.tech${img}`;
 }