import React, { useState, useEffect } from 'react';
import { Input, Menu, Dropdown, Button, Icon, message, Table, Divider, Tag, Select, Form, Alert } from 'antd';
import { FormattedMessage } from 'umi-plugin-react/locale';
import XForm, { FieldTypes } from '../../components/XForm';
import router from 'umi/router';
import apis from '../../services/apis';
import request from '../../utils/request';
import Wangedit from '../../components/Wangedit/Wangedit'
import moment from 'moment';


const header = props => {
    const newsId = props.location.query.id
  
    const [ data, setData ] = useState({})
    if(newsId){
      useEffect(() => {
        getNewData(newsId);
      },[])
  
    // 查询列表
    const getNewData = (newsId) => {
      request({
          ...apis.officenews.get,
          urlData: { id: newsId }
      }).then((data) => {
        setData(data)
      }).catch((err) => {
        message.error(err.msg || err.message)
      })
    }
    }
  
    const fields = [
      {
        label: '资讯封面',
        name: 'thumb',
        type: FieldTypes.ImageUploader,
        value: data.thumb,
        rules: [
            { required: true, message: '请选择资讯封面' },
        ],
        help: '建议尺寸：500px*400px，比例5:4，格式：jpg，用于：橙蕉官网新闻资讯列表',
      },    
      {
        label: '资讯标题',
        name: 'title',
        type: FieldTypes.Text,
        value: data.title
      },
      {
        label: '资讯详情',
        name: 'content',
        value: data.content,
        render: <Wangedit />
      },
      {
        label: '状态',
        name: 'status',
        value: data.status,
        render: <Select style={{ width: '180px' }} placeholder="发布状态">
                    <Option value={0}>已发布</Option>
                    <Option value={1}>未发布</Option>
                </Select>,
      },
    ]
  
     
    const handleSubmit = (values) => {
      if(newsId){
          request({ ...apis.officenews.update, urlData: { id: newsId }, data: { ...values }}).then((data) => {
            cancelPage();
          }).catch((err) => {
            message.error(err.msg || err.message)
          })
        }else{
          request({ ...apis.officenews.save, data: { ...values }}).then((data) => {
            cancelPage();
          }).catch((err) => {
            message.error(err.msg || err.message)
          })
        }
    }
  
    const cancelPage = () => {
      router.push({
        pathname: '/officenews/index',
      });
    }
  
    return (
      <XForm onSubmit={handleSubmit} onCancel={cancelPage} fields={fields}></XForm>
    )
  }
  
  const WrappedNormalLoginForm = Form.create({ name: 'header' })(header);
  export default WrappedNormalLoginForm