estateagents-admin-manager/src/pages/news/list/editNewsList.jsx

import React, { useState, useEffect } from 'react';
import { Form, Input, Button, Icon, Select, Tabs, Radio, DatePicker,message } from 'antd';
import { FormattedMessage } from 'umi-plugin-react/locale';
import styles from '../../style/GoodsList.less';
import moment from 'moment';
import router from 'umi/router';
import BuildSelect from '../../../components/SelectButton/BuildSelect'
import NewsTypeSelect from '../../../components/SelectButton/NewTypeSelect'
import XForm, { FieldTypes } from '../../../components/XForm';
import Wangedit from '../../../components/Wangedit/Wangedit'
import request from '../../../utils/request'

const { MonthPicker, RangePicker, WeekPicker } = DatePicker;
/**
 *
 *
 * @param {*} props
 * @returns
 */
 const Edit = (props) => {
  const [ tab, changeTab ] = useState('basic')
  const newsId = props.location.query.newsId
  const [ dynamicData, setDynamicData ] = useState({})
  if(newsId){
    useEffect(() => {
      getDynamicData(newsId);
    },[])

  // 查询列表
  const getDynamicData = (newsId) => {
    request({
        url: '/api/admin/taNews/' + newsId,
        method: 'GET',
        params: { newsId },
    }).then((data) => {
        console.log(data)
        setDynamicData(data)
    })
  }
  }

  const cancelPage = () =>{
    router.push({
      pathname: '/news/list/NewsList',
    });
  }

  const Basic = (props) => {
    const fields = [
      {
        label: '意向项目',
        name: 'buildingId',
        render: <BuildSelect />,
        value: dynamicData.buildingId,
        rules: [
          {required: true, message: '请选择所属项目'},
        ]
      },
      {
        label: '资讯图片',
        name: 'newsImg',
        type: FieldTypes.ImageUploader,
        value: dynamicData.newsImg,
      },
      {
        label: '资讯标题',
        name: 'newsName',
        type: FieldTypes.Text,
        value: dynamicData.newsName,
        rules: [
          {required: true, message: '请输入资讯标题'},
        ]
      },
      {
        label: '资讯类型',
        name: 'newsTypeId',
        render: <NewsTypeSelect />,
        value: dynamicData.newsTypeId,
        rules: [
          {required: true, message: '请选择资讯类型'},
        ]
      },
      {
        label: '资讯详情',
        name: 'desc',
        render: <Wangedit />,
        value: dynamicData.desc,
      },
    ]
  
    const handleSubmit = val => { 
      let {...submitValue} = val
      if(dynamicId){
        submitValue.dynamicId = dynamicId
        request({
          url: '/api/admin/buildingDynamic/update',
          method: 'PUT',
          data: submitValue,
        }).then((data) => {
          cancelPage()
        }).catch((err) => {
          message.info(err.msg || err.message)
        })
      }else{
        request({
          url: '/api/admin/taNews',
          method: 'POST',
          data: submitValue,
        }).then((data) => {
          cancelPage()
        }).catch((err) => {
          message.info(err.msg || err.message)
        })
      }
    }
    
    return <XForm onSubmit={handleSubmit} onCancel={cancelPage} fields={fields}></XForm>
  }
  
  const Poster = (props) => {
   return <div>Poster</div>
  }
 
  const Share = (props) => {
    return <div>Share</div>
  }

  return (
    <div>
      <div>
        <Radio.Group value={tab} buttonStyle="solid" onChange={e => changeTab(e.target.value)}>
          <Radio.Button value="basic">基本信息</Radio.Button>
          <Radio.Button value="poster">海报图片</Radio.Button>
          <Radio.Button value="share">分享设置</Radio.Button>
        </Radio.Group>
      </div>
      <div>
        { tab === 'basic' && <Basic /> }
        { tab === 'poster' && <Poster /> }
        { tab === 'share' && <Share /> }
      </div>
    </div>
  );
 }



export default Edit