import React, { useEffect, useState } from 'react';
import { connect } from 'react-redux';
import Empty from '../components/empty';
import '../style.less'

const HighMonthly = (props) => {
    const { dispatch, actions } = props

    return (
        <>
            <div style={{ padding: '0px 12px' }}>
                <div style={{ display: 'flex' }}>
                    <div style={{ color: 'rgba(0,0,0,0.45)', fontSize: 14 }}>绩效考核</div>
                    <div style={{ color: 'rgba(0,0,0,0.45)', fontSize: 14, margin: '0px 8px' }}>/</div>
                    <div style={{ color: 'rgba(0,0,0,0.45)', fontSize: 14 }}>高管考核</div>
                    <div style={{ color: '#033C9A', fontSize: 14, margin: '0px 8px' }}>/</div>
                    <div style={{ color: '#033C9A', fontSize: 14 }}>月度过程考核</div>
                </div>
                <div style={{ background: '#FFFFFF', boxShadow: '0px 0px 12px 2px rgba(220,222,224,0.2)', borderRadius: 2, padding: '20px 0px 20px 19px ', marginTop: 12 }}>
                    <div style={{ display: 'flex', alignItems: 'center', justifyContent: 'space-between' }}>
                        <div style={{ display: 'flex', alignItems: 'baseline' }}>
                            <div style={{ width: 0, height: 20, borderLeft: '3px solid #0F7EFB', borderTop: '3px solid transparent', borderBottom: '3px solid transparent' }}></div>
                            <div style={{ fontFamily: "YouSheBiaoTiHei", fontSize: 24, color: '#033C9A', marginLeft: 8 }}>月度过程考核</div>
                            <div style={{ marginLeft: 6, fontSize: 12, color: '#969799', fontFamily: "DINExp", }}>MONTHLY PROCESS ASSESSMENT</div>
                        </div>
                    </div>
                    <Empty />
                </div>
            </div>
        </>
    )
}

function mapStateToProps(state) {
    const { auth, global } = state;
    return {
        user: auth.user,
        actions: global.actions,
    };
}

export default connect(mapStateToProps)(HighMonthly);