import React, { Component } from 'react';
import {observer} from 'mobx-react';
import {WeaAlertPage,WeaLocaleProvider,WeaRadioGroup} from 'ecCom';
import {WeaTableNew} from 'comsMobx';
import isEmpty from 'lodash/isEmpty';

const WeaTable = WeaTableNew.WeaTable;
const getLabel = WeaLocaleProvider.getLabel;

@observer
export default class DataListView extends Component{
    reRenderColumns = columns => {
        const {store: {handleViewClick}} = this.props;

        columns.map(c => {
            if (c.dataIndex === 'canViewSignImg') {
                c.render = function(text, record) {
                    const {
                        randomFieldId,
                        canViewSignImgspan
                    } = record;
                    if (canViewSignImgspan === '1') {
                        return <a onClick={() => handleViewClick(randomFieldId)}>{getLabel(33564,'查看')}</a>
                    } else {
                        return <span />
                    }
                }
            }
        });
    }

    render(){
        const {store: {radioGroupProps, hasRight, table}} = this.props;
        const {config} = radioGroupProps;

        if(isEmpty(config))
            return null;

        return (
            <div className='listView'>
                <WeaRadioGroup ecId={`${this && this.props && this.props.ecId || ''}_WeaRadioGroup@m5ufft`} {...radioGroupProps} />
                <div className='dataList'>
                {
                    !hasRight ? (
                        <WeaAlertPage ecId={`${this && this.props && this.props.ecId || ''}_WeaAlertPage@u9n5mw`}>
                            <div>{getLabel('517102', "你无权查看该人员的外勤数据")}</div>
                        </WeaAlertPage>
                    ) : (
                        <WeaTable ecId={`${this && this.props && this.props.ecId || ''}_WeaTable@z7vdj4`} 
                            comsWeaTableStore={table}
                            hasOrder={true}
                            needScroll={true}
                            getColumns={this.reRenderColumns}
                        />
                    )
                }
                </div>
            </div>
        )
    }
}