import React, { useState, useEffect } from 'react';
import { Card, Form, Button, message, Input } from 'antd';
import ProCard from '@ant-design/pro-card';
import { getWithdrawalDetail, updateWithdrawal } from '@/services/withdrawal'
import { PageHeaderWrapper } from '@ant-design/pro-layout';
import { history } from 'umi';

const { TextArea } = Input;
const FormItem = Form.Item;
const formItemLayout = { labelCol: { span: 6 }, wrapperCol: { span: 14 } };
const goBack = () => {
  history.goBack();
};
export default (props) => {
  const { location } = props;
  const { id } = location.query;
  const [withdrawal, setWithdrawal] = useState();
  const [remarks, setRemarks] = useState()
  const [loading, setLoading] = useState(false)

  const handleAudit = (val) => {
    if (remarks) {
      if (val == 1 && withdrawal.amountLeft < withdrawal.money) {
        message.success('合作社余额小于提现余额时不能提现');
        return
      }
      setLoading(true)
      updateWithdrawal(withdrawal.withdrawalId, { ...withdrawal, auditStatus: val, auditRemark: remarks }).then(() => {
        message.success('操作成功');
        goBack()
        setLoading(false)
      }).catch(err => {
        console.log(err.message)
        setLoading(false)
      })
    }
    else {
      message.success('请输入处理结果');
    }
  }
  useEffect(() => {
    getWithdrawalDetail(id).then((res) => {
      setWithdrawal(res)
      setRemarks(res.auditRemark)
    }).catch((err) => {
      console.log(err.message)
    });
  }, [id])
  return (
    <PageHeaderWrapper
      extra='合作社余额小于提现余额时不能提现'
    >
      <Card>
        <Form {...formItemLayout}>
          <FormItem label="申请人">
            {withdrawal?.userName}
          </FormItem>
          <FormItem label="联系电话">
            {withdrawal?.phone}
          </FormItem>
          <FormItem label="合作社">
            {withdrawal?.orgName}
          </FormItem>
          <FormItem label="合作社余额">
            {withdrawal?.amountLeft / 100}
          </FormItem>
          <FormItem label="提现银行">
            {withdrawal?.bankCard.ownerBank}
          </FormItem>
          <FormItem label="提现账户">
            {withdrawal?.bankCard.cardNo}
          </FormItem>
          <FormItem label="申请金额">
            {withdrawal?.money / 100}
          </FormItem>
          <FormItem label="处理结果">
            {
              withdrawal?.auditStatus == 0 ?
                <TextArea placeholder='请输入处理结果（必填）' rows='3' style={{ width: '350px' }} value={remarks} onChange={(e) => setRemarks(e.target.value)} /> :
                remarks
            }
          </FormItem>
          <FormItem label=" " colon={false}>
            {
              withdrawal?.auditStatus == 0 &&
              <>
                <Button type="primary" loading={loading} style={{ marginRight: '16px' }} onClick={() => handleAudit(1)}>
                  同意
                </Button>
                <Button type="primary" loading={loading} style={{ marginRight: '16px' }} onClick={() => handleAudit(2)}>
                  拒绝
                </Button>
              </>
            }
            <Button type="default" onClick={() => goBack()}>
              返回
            </Button>
          </FormItem>
        </Form>
      </Card>
    </PageHeaderWrapper>
  );
};