import React, { useState, useEffect } from 'react';
import { Form, Input, Button, Icon, Select, Tabs, Radio, DatePicker, message, Upload } from 'antd';
import { FormattedMessage } from 'umi-plugin-react/locale';
import styles from '../style/GoodsList.less';
import apis from '../../services/apis';
import moment from 'moment';
import router from 'umi/router';
import BuildSelect from '../../components/SelectButton/BuildSelect'
import XForm, { FieldTypes } from '../../components/XForm';
import Wangedit from '../../components/Wangedit/Wangedit'
import request from '../../utils/request'
import yinhao from '../../assets/yinhao.png'
import ImageUploader from '../../components/XForm/ImageUpload';
import logo from '../../assets/logo.png';
import touxiang from '../../assets/touxiang.jpg';
import poster1 from '../../assets/poster1.png';
import poster2 from '../../assets/poster2.png';
import xiaochengxu from '../../assets/xiaochengxu.png'

const { MonthPicker, RangePicker, WeekPicker } = DatePicker;
const { TextArea } = Input;

/**
 *
 *
 * @param {*} props
 * @returns
 */
const third = (props) => {
  const configId = props.location.query.configId
  const [thirdData, setThirdData] = useState({})
  if (configId) {
    useEffect(() => {
      getThirdData(configId);
    }, [])

    // 查询列表
    const getThirdData = (configId) => {
      request({ ...apis.third.details, urlData: { id: configId } }).then((data) => {
        console.log(data)
        setThirdData(data)
      })
    }
  }

  const cancelPage = () => {
    router.push({
      pathname: '/third/thirdList',
    });
  }
 
  const fields = [
    {
      label: 'appid',
      name: 'appid',
      type: FieldTypes.Text,
      value: thirdData.appid,
      rules: [
        { required: true, message: '请输入appid' },
      ]
    },
    {
      label: 'appSecret',
      name: 'appSecret',
      type: FieldTypes.Text,
      value: thirdData.appSecret,
      rules: [
        { required: true, message: '请输入appSecret' },
      ]
    },
    {
      label: '过期时间',
      name: 'expirationDate',
      type: FieldTypes.DatePicker,
      value: thirdData.expirationDate != null ? moment(thirdData.expirationDate, 'YYYY-MM-DD HH:mm') : null,
      rules: [
        { required: true, message: '请选择时间' },
      ]
    },
  ]

  const handleSubmit = val => {
    console.log('submit data --->', val)
    if (configId) {
      val.configId = configId
      request({ ...apis.third.update, data: val }).then((data) => {
        message.info("保存成功")
        cancelPage()
      }).catch((err) => {
        message.info(err.msg || err.message)
      })
    } else {
      request({ ...apis.third.add, data: val }).then((data) => {
        message.info("保存成功")
        cancelPage()
      }).catch((err) => {
        message.info(err.msg || err.message)
      })
    }
  }

  return (
    <XForm onSubmit={handleSubmit} onCancel={cancelPage} fields={fields}></XForm>
  );
}



export default third
