| 123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141142143144145146147148149150151152153154155156157158159160161162163164165166167168169170171172173174175176177178179180181182183184 | import React from 'react';import { Steps, Spin } from 'antd';import './steps.less';import ajax from 'jquery/src/ajax/xhr.js';import $ from 'jquery/src/ajax';import Step1 from './steps/step1';import Step2 from './steps/step2';import Step3 from './steps/step3';import Step4 from './steps/step4';import Step5 from './steps/step5';import Step6 from './steps/step6';import Step7 from './steps/step7';import Step8 from './steps/step8';import SpinContainer from "../../SpinContainer";const Step = Steps.Step;const steps = [	{		title: '基本信息',		content: Step1	},	{		title: '法律状况评估',		content: Step2	},	{		title: '技术状况评估',		content: Step3	},	{		title: '历史收入',		content: Step4	},	{		title: '收入预估',		content: Step5	},	{		title: '所得税预估',		content: Step6	},	{		title: '风险预估',		content: Step7	},	{		title: '评估值',		content: Step8	}];const EvaluateSteps = React.createClass({	getInitialState() {		return {			current: 0,			loading: true,			steps: null,			value: 0,			step: 0,			dottList:[]		};	},	next(values) {		console.log(values)		if (this.state.current == 7) {			this.state.value = values;			return;		} else {			this.state.value = 0;		}		const current = this.state.current + 1;		this.state.steps[this.state.current] = values;		if (this.state.current === 0 && this.props.title) {			this.props.title(values.name);		}		if(!this.state.current){			this.loadData(this.props.id)		}		this.setState({			current: current,			steps: this.state.steps		});	},	prev() {		const current = this.state.current - 1;		this.setState({ current });	},	loadData(id) {		this.state.dottList=[];		this.state.step=0;		$.ajax({			url: globalConfig.context + '/api/user/evaluate/info/' + id		})			.done(				function(res) {					if (res && res.data) {						this.setState({							steps: res.data.steps || {},							current: res.data.step || 0,							step: res.data.step || 0,							value: res.data.value || 0,							loading: false						});						if (this.props.title) {							this.props.title(res.data.name || '');						}					}				}.bind(this)			)			.fail(				function() {					this.setState({						loading: false					});				}.bind(this)			);		this.setState({			current: this.props.step || 0		});	},	componentWillMount() {		this.loadData(this.props.id);	},	componentWillReceiveProps(nextProps) {		if (!this.props.visible && nextProps.visible) {			if (nextProps.id) {				this.loadData(nextProps.id);			}		}	},	progressDot(dot, { index }) {		return (			<span				style={{ cursor: 'pointer' }}				onClick={() => {					let dottList=this.state.dottList;					if(index>0){						dottList.push(index)					}					if (index == this.state.step || !!this.state.steps[index]) {						this.setState({							current: index,							dottList:dottList						});					}				}}			>				{dot}			</span>		);	},	render() {		this.state.StepContent = steps[this.state.current].content;		let loadContent = !!this.state.steps;		let dottList =this.state.dottList;		return (			<SpinContainer spinning={this.state.loading}>				<div style={{ marginTop: 10 }}>					<Steps current={this.state.current} progressDot={this.progressDot} value={this.state.value}>						{steps.map((item) => <Step key={item.title} title={item.title} />)}					</Steps>					<div className="steps-content">						{loadContent ? (							<this.state.StepContent								next={this.next}								prev={this.prev}								id={this.props.id}								visible={this.props.visible}								data={this.state.step||dottList.length?this.state.steps[this.state.current]:{}}								record={this.state.steps}								value={this.state.value}							/>						) : (							<div />						)}					</div>				</div>			</SpinContainer>		);	}});export default EvaluateSteps;
 |