import React, {Component} from 'react';
import {observer} from 'mobx-react';
import {WeaNewScroll, WeaLocaleProvider} from 'ecCom';
import filter from 'lodash/filter';
const getLabel = WeaLocaleProvider.getLabel;

@observer
export default class DaySetting extends Component{
    onClickHandle = id => {
        const {store, target, date, record, hide } = this.props;
        const data = {};
        if(target === 'resource'){
            Object.assign(data, {
                shiftid: id
            });
        }else{
            Object.assign(data, {
                [date]: id
            });
        }
        if(record != null)
            Object.assign(data, {
                resourceid: record.resourceid
            });
        store.onScheduleChange([data], target);
        hide && hide();
    }

    render(){
        const {store, target } = this.props;
        const shiftList = filter(store.toJS(store.shiftList), v => v.isDelete != '1');
        let lbl;
        switch(target){
            case 'cell':
                lbl = <div className='tips text-elli' title={getLabel('500467','修改该员工当天班次')}>{getLabel('500467','修改该员工当天班次')}</div>; 
                break;
            case 'resource':
                lbl = <div className='tips text-elli' title={getLabel('500468','修改该员工当月所有班次')}>{getLabel('500468','修改该员工当月所有班次')}</div>;
                break;
            case 'header':
                lbl = <div className='tips text-elli' title={getLabel('500469','修改所有员工当天班次')}>{getLabel('500469','修改所有员工当天班次')}</div>;
                break;
        }

        shiftList.length > 1 && shiftList.push({
            id: '-999',
            bgColor: '#ddd',
            name: getLabel(131966, '删除')
        });

        return (
            <div className='tabPane tabPane-dialog'>
                <WeaNewScroll ecId={`${this && this.props && this.props.ecId || ''}_WeaNewScroll@4o2sok`} height={'100%'}>
                    <div className='daySetting'>
                    {lbl}
                    {
                        shiftList.map(shift => <div className='item text-elli' title={shift.name} style={{background: shift.bgColor, color: shift.id === 0 ? '#000' : '#fff'}} onClick={() => this.onClickHandle(shift.id)}>{shift.name}</div>)
                    }
                    </div>
                </WeaNewScroll>
            </div>
        )
    }
}