+
+ );
+ }
+}
+
+export default SponsorBarCharts;
\ No newline at end of file
diff --git a/src/forge/users/sponsor/charts/sponsorPieChart.js b/src/forge/users/sponsor/charts/sponsorPieChart.js
new file mode 100644
index 000000000..82a15f612
--- /dev/null
+++ b/src/forge/users/sponsor/charts/sponsorPieChart.js
@@ -0,0 +1,70 @@
+import React, { Component } from 'react';
+import {FlexibleXYPlot, RadialChart, VerticalGridLines, HorizontalGridLines, XAxis, YAxis, Crosshair, DiscreteColorLegend} from 'react-vis';
+// import DiscreteColorLegend from 'legends/discrete-color-legend';
+import "./style.scss";
+
+const data = [
+ {label: "张三", angle: 1},
+ {label: "李四", angle: 2},
+ {label: "王五", angle: 5},
+ {label: "赵六", angle: 3},
+];
+
+const data2 = [
+ {label: "张三", angle: 2},
+ {label: "林磊", angle: 1},
+ {label: "赵辉", angle: 4},
+];
+
+const ITEMS = [
+ {title: '收入', color: 'powderblue', strokeWidth: 13},
+ {title: '支出', color: 'powderblue', strokeWidth: 13}
+];
+
+class SponsorPieCharts extends Component {
+ constructor(props) {
+ super(props);
+ this.state = {
+ crosshairValues: []
+ };
+ }
+
+ componentWillReceiveProps = () => {
+ this.setState({
+ crosshairValues: []
+ })
+ }
+
+ render() {
+ const DATA = this.props.is_sponsor?data2:data;
+ // const DATA = [{angle: 1}, {angle: 5}, {angle: 2}]
+
+ return (
+
+ {/* */}
+ {/*
+
+ {/* */}
+
+ );
+ }
+}
+
+export default SponsorPieCharts;
\ No newline at end of file
diff --git a/src/forge/users/sponsor/charts/style.scss b/src/forge/users/sponsor/charts/style.scss
new file mode 100644
index 000000000..79f09ff3c
--- /dev/null
+++ b/src/forge/users/sponsor/charts/style.scss
@@ -0,0 +1,5 @@
+@import "react-vis/dist/styles/plot.scss";
+@import "react-vis/dist/styles/examples.scss";
+@import "react-vis/dist/styles/legends.scss";
+@import "react-vis/dist/styles/radial-chart.scss";
+@import "react-vis/dist/styles/treemap.scss";
\ No newline at end of file
diff --git a/src/forge/users/sponsor/communityData.js b/src/forge/users/sponsor/communityData.js
new file mode 100644
index 000000000..53d4124c7
--- /dev/null
+++ b/src/forge/users/sponsor/communityData.js
@@ -0,0 +1,133 @@
+import React, { Component } from 'react';
+import {XYPlot, VerticalBarSeries, LineSeries, VerticalGridLines, HorizontalGridLines, XAxis, YAxis, Crosshair, DiscreteColorLegend} from 'react-vis';
+// import DiscreteColorLegend from 'legends/discrete-color-legend';
+import "./charts/style.scss";
+import "../../Main/list.css";
+import "../../UsersList/list.css";
+import "../../sponsor/sponsor.css";
+import "../new_user.css"
+import axios from "axios";
+import { isSupported } from 'clipboard';
+
+const ITEMS = [
+ {title: '资助者数量', strokeWidth: 13},
+ {title: '受资助人数', strokeWidth: 13},
+];
+
+class SponsorDataCharts extends Component {
+ constructor(props) {
+ super(props);
+ this.state = {
+ crosshairValues: [],
+ sponsor: [],
+ sponsored: [],
+ nums: [],
+ };
+ }
+
+ componentDidMount = () => {
+ this.get_chart_data();
+ }
+
+ get_chart_data = () => {
+ this.setState({
+ isSpin: true
+ })
+
+ let url = `/sponsorships/community_data.json`;
+ axios.get(url)
+ .then((result) => {
+ this.setState({
+ sponsor: result.data.sponsor,
+ sponsored: result.data.sponsored,
+ isSpin: false,
+ })
+ })
+ .catch((error) => {
+ console.log(error);
+ this.setState({
+ isSpin: false,
+ });
+ });
+
+ url = `/wallets/community_data.json`;
+ axios.get(url)
+ .then((result) => {
+ this.setState({
+ nums: result.data,
+ isSpin: false,
+ })
+ })
+ .catch((error) => {
+ console.log(error);
+ this.setState({
+ isSpin: false,
+ });
+ });
+ };
+
+ componentWillReceiveProps = () => {
+ this.setState({
+ crosshairValues: []
+ })
+ }
+
+ render() {
+ // const DATA = this.props.is_sponsor?data2:data;
+ const {sponsor, sponsored, nums} = this.state;
+ var max1 = 0;
+ for(var i=0; i平台资助者/受资助人数
+平台资助交易数量
+
+ {/* })
+
+
+ );
+ });
+ } else{
+ return null;
+ }
+ }
+ render() {
+ const { users, userClass, current_user } = this.props;
+ return (
+
+
+
+
+
*/}
+
+
+ {item && item.username}
+
+
+ 金额：{item.amount}硬币
+ 累计金额：{item.accumulate}硬币
+
+
+
+
+ {item.start_time} - {item.stop_time? item.stop_time:"现在"}
+
+
+
+
+ {item.stop_time? "":(
+ this.stop_sponsorship(item, key, e)}
+ // onCancel={cancel}
+ okText="是"
+ cancelText="否"
+ >
+
+
+ )}
+ {!item.stop_time && item.sponsor_id==current_user.user_id? (
+
+ ):""}
+
+ {this.renderList(users, userClass, current_user)}
+
+ );
+ }
+}
+
+export default SponsorList;
diff --git a/src/forge/users/sponsor/wallet.js b/src/forge/users/sponsor/wallet.js
new file mode 100644
index 000000000..992d8a8d3
--- /dev/null
+++ b/src/forge/users/sponsor/wallet.js
@@ -0,0 +1,272 @@
+import React, { Component } from "react";
+import { Link } from "react-router-dom";
+import { Menu, Input, Spin, Pagination, Popover, Button, Divider } from "antd";
+
+import axios from "axios";
+import CoinChangeItem from "./CoinChangeItem";
+import Nodata from "../../Nodata";
+import img_array from "../../Images/array.png";
+import CoinChangeCharts from "./charts/coinChangeCharts";
+const Search = Input.Search;
+
+const tempData = [
+ {amount: -3, description: "des", reasons: "no reason", to_user: "串串", date: "2016年1月5日"},
+ {amount: 3, description: "des", reasons: "no reason", to_user: "串串", date: "2016年1月5日"},
+ {amount: -3, description: "des", reasons: "no reason", to_user: "串", date: "2016年1月5日"},
+ {amount: 3, description: "des", reasons: "no reason", to_user: "串串", date: "2016年1月5日"},
+ {amount: -3, description: "des", reasons: "no reason", to_user: "串串", date: "2016年1月5日"},
+ {amount: 3, description: "des", reasons: "no reason", to_user: "串串", date: "2016年1月5日"},
+ {amount: -3, description: "des", reasons: "no reason", to_user: "串串", date: "2016年1月5日"},
+ {amount: 3, description: "des", reasons: "no reason", to_user: "串串", date: "2016年1月5日"},
+ {amount: -3, description: "des", reasons: "no reason", to_user: "串串", date: "2016年1月5日"}
+];
+
+class Wallet extends Component {
+ constructor(props) {
+ super(props);
+ this.state = {
+ page: 1,
+ limit: 10,
+ sort_by: "desc",
+ isSpin: false,
+ coinChangeList: undefined,
+ displayList: undefined,
+ total: undefined,
+ category: "all",
+ balance: 50,
+ saerch: undefined,
+ chartsData: {income:[], outcome:[]},
+ };
+ }
+
+ componentDidMount = () => {
+ this.get_coin_changes();
+ };
+
+ componentDidUpdate = () => {
+ // this.get_coin_changes()
+ };
+
+ componentWillReceiveProps = () => {
+ if (this.props.current_user)
+ this.get_coin_changes();
+ }
+
+ get_chart_data = () => {
+ this.setState({
+ isSpin: true
+ })
+
+ let url = `/wallets/balance_chart.json`;
+ const {current_user} = this.props;
+ let user_id = current_user && current_user.user_id;
+ if (current_user){
+ axios.get(url, {
+ params: {
+ id: user_id,
+ }})
+ .then((result) => {
+ this.setState({
+ chartsData: result.data,
+ isSpin: false,
+ })
+ })
+ .catch((error) => {
+ console.log(error);
+ this.setState({
+ isSpin: false,
+ });
+ });
+ }
+ };
+
+ get_coin_changes = () => {
+ this.setState({
+ isSpin: true
+ })
+
+ let url = `/wallets/coin_changes.json`;
+ const {category, sort_by, page, limit} = this.state;
+ const {current_user} = this.props;
+ let user_id = current_user && current_user.user_id;
+ if (current_user){
+ axios.get(url, {
+ params: {
+ id: user_id,
+ category: category,
+ sort_direction: sort_by,
+ page: page,
+ limit: limit,
+ }})
+ .then((result) => {
+ // console.log(result);
+ this.setState({
+ coinChangeList: result.data.coin_changes,
+ displayList: result.data.coin_changes,
+ total: result.data.count,
+ balance: result.data.balance,
+ isSpin: false,
+ })
+ })
+ .catch((error) => {
+ console.log(error);
+ this.setState({
+ isSpin: false,
+ });
+ });
+ }
+ };
+
+ changeCategory = (cate) => {
+ if(cate.target.value == "charts"){
+ // console.log("charts");
+ this.setState({
+ category: cate.target.value,
+ page: 1,
+ }, ()=> {this.get_chart_data();});
+ return ;
+ }
+ else{
+ this.setState({
+ category: cate.target.value,
+ page: 1,
+ }, ()=> {this.get_coin_changes();});
+ }
+ };
+
+ //切换页数
+ changePage = (page) => {
+ this.setState({
+ page: page
+ }, ()=>{this.get_coin_changes();})
+ };
+
+ // 排序
+ ChangeSoryBy = (e) => {
+ this.setState({
+ sort_by: e.key,
+ page: 1,
+ }, ()=>{this.get_coin_changes();})
+ // this.get_coin_changes();
+ console.log(e.key);
+ };
+
+ changeSearchValue = (e) => {
+ this.setState({
+ search: e.target.value,
+ });
+ };
+
+ menu =()=> (
+
+ );
+
+ category_button=(category)=>{
+ const { current_user, user } = this.props;
+ const button_lists =
+ user && current_user && user.login === current_user.login
+ ? [
+ { type: "all", name: "所有" },
+ { type: "income", name: "收入" },
+ { type: "outcome", name: "支出" },
+ { type: "charts", name: "查看统计" },
+ ]
+ :
+ [];
+
+ let list = button_lists.map((item, key) => {
+ return (
+
+
+
+ );
+ })
+ return list;
+ }
+
+ render() {
+ const { current_user, user } = this.props;
+ const { category , sort_by, chartsData } = this.state;
+ const { displayList, coinChangeList, isSpin, total, search, limit, page, balance} = this.state;
+
+ const coinChangeItem = displayList && displayList.length > 0 ?
+
+ {/*
+
+
+
+
+
+ 排序 
+
+
+
+
+ 余额：{balance}
+
+
+ {user && current_user && user.login === current_user.login?
+ displayComponent
+ :
+ {this.category_button(category)}
+
+
+
+ :
+ ""
+ }
+