React + nodejs 提交成功界面包含进度条

React + nodejs 提交成功界面(包含进度条)


//***frontend/src/pages/businessUser/newPage/newSuccess.js ***
import React from 'react'
import TestTTT from '../../../components/resultPage/testTTT'
import SubmitSuccessPage from '../../../components/resultPage/submitSuccessPage'
import StepProgress, { stepProgress } from '../../../components/resultPage/stepProgress'
export default class NewSuccess extends React.Component {

render(){

	var successItems = { 

		successTitle: "Idea submit Success - RaiseIdea", 
		subTitle: "Idea request number:2020182818828182881 server configuration takes 1-5 minutes, please wait." ,
		homeButtonName:"Return Home",
		gotoButtonName:"Raise New Idea",
		homeRul:"/EUC",
		GotoUrl:"/EUC/NewAutomation/Raiseidea"
	}

	
	var stepItems = [
		
		{ title: "Raise Idea", description: "" },
		{ title: "Prioritize", description: "" },
		{ title: "Pick up Idea", description: "" },
		{ title: "Initial Risk Assessment", description: "" },
		{ title: "Build & Test", description: "" },
		{ title: "UAT", description: "" },
		{ title: "Final Risk Assessment", description: "" },
		{ title: "Go-live", description: "" },
		{ title: "Release", description: "" }
	]
	return (
		<div width='60%'>
			<SubmitSuccessPage successItems ={successItems} />
			<div><br /><br /></div>
			<div><br /><br /></div>
			<StepProgress stepNo='5' stepItems = {stepItems}/>
		</div>
	)
}
}

//**frontend/src/components/resultPage/stepProgress.js **
import React from 'react';
import ReactDOM from 'react-dom';
import 'antd/dist/antd.css';
import './result.css';
import { Steps } from 'antd';

const { Step } = Steps;
export const stepProgress = props => {
    
    const {stepNo} = props
    const {stepItems} = props
    let nStep = stepNo
    var strSteplist = new Array(10)

    for (var i=0;i<stepItems.length;i++){

        strSteplist[i] =  <Step title={stepItems[i]['title']} description={stepItems[i]['description']} />
    }

    return (

       <div>
            <Steps progressDot current={nStep}>
                {strSteplist}
                {/* <Step title={stepItems[0]['title']} description={stepItems[0]['description']} />
                <Step title="Prioritize" description="" />
                <Step title="Pick up Idea" description="" />
                <Step title="Initial Risk Assessment" description="" />
                <Step title="Build & Test" description="" />
                <Step title="Build & Test" description="" />
                <Step title="Final Risk Assessment" description="" />
                <Step title="Go-live" description="" />
                <Step title="Release" description="" /> */}
            </Steps>
       </div>
      
    )
  }
  export default stepProgress

//***frontend/src/components/resultPage/submitSuccessPage.js ***

import React from 'react'
import ReactDOM from 'react-dom'
import 'antd/dist/antd.css'
import './result.css'
import { Result, Button } from 'antd'

export const submitSuccess = props => {

    //const ideaType =  'Idea submit Success'
  
    const {successItems} = props

    let ideaType = successItems['successTitle']
    let strSubTitle = successItems['subTitle']
    //let ideaType1 = ideaType + this.props
  return (
     <div>
         
            <Result
                status="success"
                title={ideaType}
                subTitle= {strSubTitle}
                extra={[
                <Button type="primary" key="returnHome"
                    onClick={() => {
                        window.location.href = successItems['homeRul']
                    }}
                >
                    {successItems['homeButtonName']}
                </Button>,
                <Button key="NewIdea"
                    onClick={() => {
                        window.location.href = successItems['GotoUrl']
                    }}
                
                >
                    {successItems['gotoButtonName']} </Button>,
                ]}
            />

     </div>
    
  )
}
export default submitSuccess

版权声明:本文内容由互联网用户自发贡献,该文观点与技术仅代表作者本人。本站仅提供信息存储空间服务,不拥有所有权,不承担相关法律责任。如发现本站有涉嫌侵权/违法违规的内容, 请发送邮件至 dio@foxmail.com 举报,一经查实,本站将立刻删除。

相关推荐


uuid javascript语言代码function uuid() {   return 'xxxxxxxx-xxxx-4xxx-yxxx-xxxxxxxxxxxx'.replace(/[xy]/g, function(c) {
js关闭当前页面
二维数组动态定义,赋值。 例如创建一个N行2列的二维数组。
jQuery实现PHP的htmlspecialchars的功能
js关闭当前页面
提取网页中的表格,把输出的内容复制粘贴到表格即可
js中,将数字字符串转换成数字,parseInt不是很好的办法,因为当你忘了传第二个参数的时候,会出现一些问题
javascript 中,删除一个数组,应该使用`arr.length = 0`,而不是`delete a`
广告屏蔽检测
js根据相对url获取绝对url的一种方式
404模板
vscode settings.json
简单的数组排序
简单的数组去重
React + nodejs 提交成功界面(包含进度条)
在线统计owhat集资金额
混合数组深度去重,源自项目 gQuery.js
jsbeautify配置文件
匹配邮箱
源代码: vue特效70行代码,一片动态星空 视频地址: https://www.bilibili.com/video/BV1EJ411e7sr