import React from 'react'
import 'antd-mobile/dist/antd-mobile.css'; 
import { CNavBar } from '../common/navbar.jsx';
import {  NavBar, Flex, Card, List, WhiteSpace } from 'antd-mobile';

import '../dashboard/less/picker.less';

const Item = List.Item;
const Brief = Item.Brief;

export default class ProcessWastDatanum extends React.Component {
    constructor(props) {
        super(props);
        const {func,detaildata,workshopname} = this.props.location.state;
        this.state={
            func:func,
            data:[],
            wastnumdata:detaildata.sort(function (a, b) {
                return a.ddate < b.ddate ? 1 : -1;
            }),
            workshopname:workshopname,
        }
    }

    componentWillMount(){
    }

    componentDidUpdate(){
    }

    componentDidMount() {
        var ddata=this.state.wastnumdata
        var nowdata=[]
        var sdata={}
            for(let i=0;i<ddata.length;i++){
                for(let j=0;j<ddata.length;j++){
                if(ddata[i].ddate===ddata[j].ddate&&ddata[i].workshopname===ddata[j].workshopname&&ddata[i].type==='实际损耗'&&ddata[i].type!==ddata[j].type){
                    sdata.ddate=ddata[i].ddate
                    sdata.sjwastnum=ddata[i].wastnum
                    sdata.bzwastnum=ddata[j].wastnum
                    nowdata.push(sdata)
                    sdata={}
                }
                }
            }
            console.log("nowdata:",nowdata)
            this.setState({
                wastnumdata:nowdata,
            })
    }
    
    componentWillUnmount(){
    }

    render() {
        var comment={
            fontSize: '14px', color: '#949896'
        }
        var titlegr={
            fontSize: '14px', color: '#949896',flexGrow:1
        }
        return (

            <div style={{height:'100%', backgroundColor:'#fff'}}>
                <NavBar mode="light"><span style={{color:'#000'}}>
                {this.state.workshopname}损耗
                </span></NavBar>
                <div>
                    <WhiteSpace size="sm" style={{backgroundColor:'#f5f5f9'}} />
                    
                        <Card full style={{padding:'0px', border:'0px'}}>
                            <Card.Body style={{height:'400px', padding:'6px 6px 0px'}}>
                                <div id="drawerC" className="flex-container">
                                    <Flex wrap="wrap" align="start">
                                        
                                        <div style={{width:'100%', overflowY:'auto'}}>
                                            <div>
                                                <List className="my-list">
                                               
                                                    {  
                                                       
                                                        (this.state.wastnumdata.length > 0)?( 
                                                            <Item multipleLine>
                                                                <Brief style={titlegr}>{<div> <Flex><Flex.Item>日期</Flex.Item><Flex.Item>标准损耗(kg)</Flex.Item><Flex.Item>实际损耗(kg)</Flex.Item></Flex></div>}</Brief>
                                                            </Item>
                                                        ):""
                                                    }
                                                    </List>
                                                    <List  className="my-list">
                                                    {     
                                                        (this.state.wastnumdata.length > 0)? 
                                                        this.state.wastnumdata.map((v, index) => (
                                                            <Item 
                                                             onClick ={()=>{
                                                                // const { history } = this.props;
                                                                // history.push({ pathname: '/processwastdatenum', 
                                                                //     state: { 
                                                                //         func:this.state.func,
                                                                //         workshopname:this.state.workshopname,
                                                                //         wastdatenum:v
                                                                //     } 
                                                                // });
                                                            }}
                                                            >
                                                                <Brief style={comment}>{<div> <Flex><Flex.Item>{v.ddate}</Flex.Item><Flex.Item>{v.bzwastnum }</Flex.Item><Flex.Item>{v.sjwastnum }</Flex.Item></Flex></div>}</Brief>
                                                            </Item>
                                                        )):""
                                                    }   
                                                </List>
                                            </div>
                                        </div>
                                    </Flex>
                                </div>
                            </Card.Body>
                        </Card>  
                </div>
           </div>
        ) 
    }
}