| 123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141142143144145146147148149150151152153154155156157158159160161162163164165166167168169170171172173174175176177178179180181182183184185186187188189190191192193194195196197198199200201202203204205206207208209210211212213214215216217218219220221222223224225226227 | import React, { Component } from "react";import { Tabs, Button, Card, Col, Row, Modal, } from "antd";import $ from "jquery/src/ajax";import ShowModalDiv from "@/showModal.jsx";import { ShowModal } from "@/tools";import "./index.less"import LaunchInvest from "../component/launchinvest"; // 发起投资import InvestmentList from "../component/investmentlist"; // 投资明细import Payment from "../component/payment"; // 发起付款const TabPane = Tabs.TabPane;// 资金管理class FundManagement extends Component {  constructor(props) {    super(props);    this.state = {      visible: "",      navList: [],      details: {},      type: 0,    };    this.onCancel = this.onCancel.bind(this);  }  componentWillMount() {    this.getData()  }  onCancel(e) {    if (e) {      this.getData()    }    this.setState({      visible: "",    })  }  getData() {    const { type } = this.state    $.ajax({      method: "get",      dataType: "json",      crossDomain: false,      url: globalConfig.context + "/api/admin/amb/getMyambDtails",      data: {},      success: function (data) {        ShowModal(this);        if (!data.data) {          if (data.error && data.error.length) {            message.warning(data.error[0].message);          }        } else {          this.setState({            navList: data.data,            details: data.data[type] || {},          });        }      }.bind(this),    }).always(      function () {      }.bind(this)    );  }  render() {    const { visible, navList, details } = this.state    const gridStyle1 = {      height: '80px',      background: 'green',      fontSize: '20px',      fontWeight: 'bold',      color: '#fff',      display: 'flex',      flexDirection: 'column',      alignItems: 'center',      justifyContent: 'center',      textAlign: 'center',    };    const gridStyle2 = {      height: '80px',      background: 'green',      fontSize: '20px',      color: '#fff',      display: 'flex',      flexDirection: 'column',      alignItems: 'center',      justifyContent: 'center',      textAlign: 'center',    };    const gridStyle3 = {      height: '170px',      background: 'rgba(255,102,0,1)',      fontSize: '20px',      color: '#fff',      display: 'flex',      flexDirection: 'column',      alignItems: 'center',      justifyContent: 'center',      textAlign: 'center',    };    const buttonstyle = {      fontSize: '18px',      display: 'block',      margin: ' 0 auto',    }    return (      <div className="user-content">        <ShowModalDiv ShowModal={this.state.showModal} />        <div className="card-container">          <Tabs type="card"            onChange={(e) => {              this.setState({                type: e,                details: navList[e]              }, () => {                this.getData()              })            }}>            {              navList.map((item, index) =>                <TabPane tab={item.name} key={index}>                </TabPane>              )            }          </Tabs>        </div>        <Row gutter={8}>          <Col span={3}>            <Card style={gridStyle1}>核算单位</Card>            <div style={{ height: 10 }}></div>            <Card style={gridStyle2}>{details.name}</Card>          </Col>          <Col span={6}>            <Card style={gridStyle2}>实收投资款(万元)<br />{details.received}</Card>            <div style={{ height: 10 }}></div>            <Row gutter={8}>              <Col span={12}>                <Card style={gridStyle2}>对外投资款(万元)<br />{details.foreign}</Card>              </Col>              <Col span={12}>                <Card style={gridStyle2}>剩余投资款(万元)<br />{details.surplus}</Card>              </Col>            </Row>          </Col>          <Col span={6}>            <Card bordered={false} style={gridStyle3}>当前资金池(万元)<br />{details.totalAmount}</Card>          </Col>        </Row>        <div style={{ marginTop: 20 }}>          <Row gutter={8}>            <Col span={3} offset={3}>              <Button                type="primary"                size="large"                style={buttonstyle}                onClick={() => { this.setState({ visible: "investdetails" }) }}              >投资明细</Button>            </Col>            <Col span={3}>              <Button                type="primary"                size="large"                style={buttonstyle}                onClick={() => { this.setState({ visible: "invest" }) }}              >发起投资</Button>            </Col>            <Col span={3}>              <Button                type="primary"                size="large"                style={buttonstyle}              >收支明细</Button>            </Col>            <Col span={3}>              <Button                type="primary"                size="large"                style={buttonstyle}                onClick={() => { this.setState({ visible: "pay" }) }}              >发起付款</Button>            </Col>          </Row>        </div>        {          // 发起投资          visible == "invest" &&          <LaunchInvest            myAmbId={details.id}            visible={visible}            onCancel={this.onCancel}          />        }        {          // 投资明细          visible == "investdetails" &&          <Modal            maskClosable={false}            visible={visible == "investdetails"}            title="投资明细"            footer=""            width="70%"            onCancel={() => { this.onCancel(false) }}          >            <InvestmentList              myAmbId={details.id}            />          </Modal>        }        {          // 发起付款          visible == "pay" &&          <Payment            myAmbId={details.id}            visible={visible}            onCancel={this.onCancel}          />        }      </div>    );  }}export default FundManagement;
 |