index.jsx

import React from 'react';
import './index.less'

const data = [{}, {}, {}, {s: '1'}, {s: '111', result: '11111'}]
const Index = (props) => {
    return (
        <div className="auto-step">
            <ul className="auto-step-card">
                {
                    data.map((item, index) => (
                        <li className="auto-step-item" key={index}>
                            <div className={`auto-step-item-title ${item.s ? 'step-current' : 'step-success'}`}>
                                <div className="auto-step-item-title-name">发起申请(拟稿)</div>
                            </div>
                            <div className={`auto-step-content ${item.s ? '' : 'step-success'}`}>
                                <div className="step-content-wrapper">
                                    <div className="auto-step-content-flow">
                                        <div className="auto-step-content-head">
                                            <img src="/img/test/test-2.png" alt="" className="step-content-head-img"/>
                                            <span>赵依安</span>
                                        </div>
                                      <span>2020-04-09 08:44:36</span>
                                    </div>
                                    {item.result && (
                                        <div className="auto-step-content-result">
                                            11111
                                        </div>
                                    )}
                                </div>
                            </div>

                        </li>
                    ))
                }
            </ul>

        </div>
    );
};

export default Index;