<template>
    <div v-wechat-title="$route.meta.title" style="height:100%;background-color:#FAFAFA;">
        <div style="display:inline-block;width:47%;margin:10px 0px 10px 8px;">
            <Input @on-click="chaXun" v-model="model2" style="" icon="ios-search"  placeholder="查询" />
        </div>
        <div style="display:inline-block;width:47%;margin-left:5px;">
           <Button @click="modal3 = true" style="width:100%;"><Icon type="ios-funnel-outline" style="margin-right:5px;"/>筛选</Button>
        </div>
       <Collapse v-model="value1"  accordion>
            <Panel  v-for="i in zaiban" :key="i.procedureName" :name="i.procedureName">
                <span style="font-weight:bold;color:black;font-size:14px;">{{i.procedureName}}({{i.actCount}})</span>
            
                <Card v-for="l in i.data" :key="l.actCode" slot="content" style="margin:0px 0px 10px 0px;background-color:#FAFAFA;height:110px;">
                    <p slot="title">
                        <Icon type="ios-film-outline"></Icon>
                        {{l.title}}
                    </p>
                    <div @click="openZaiBanDetauils(l)">
                        <p style="display:inline-block;font-size:11px;"><Icon type="ios-copy" style="margin-right:2px;"/>{{l.flowNumber}}</p>
                        <p style="float:right;font-size:11px;color:red;">{{l.projectName}}</p>
                        <br>
                        <p style="display:inline-block;font-size:11px;"><Icon type="ios-contact" style="margin-right:2px;"/>{{l.actUserName}}</p>
                        <p style="float:right;font-size:11px;"><Icon type="md-clock" style="margin-right:2px;"/>{{l.fromDate}}</p>
                    </div>
                </Card>
            </Panel>
        </Collapse>
        <Modal v-model="modal3" fullscreen >
            <!-- 项目查询 -->
            <div>
                <div>
                    <p style="font-size:20px;font-weight:bold;">项目筛选</p>
                </div>
                <Button v-for="i in cityList" :key="i.id"
                :style="i.type?'width:46%;margin:10px 5px 10px 5px;background-color:blue;color:#fff;height:50px;':'height:50px;width:46%;margin:10px 5px 10px 5px;'"
                icon="ios-home-outline" 
                @click="updateSelected(i)" 
                >{{i.name}}</Button>
            </div>
            <div style="margin:0px 0px 10px 0px;">
                <div>
                    <p style="font-size:20px;font-weight:bold;">日期筛选</p>
                </div>
                <Button v-for="i in dateList" :key="i.id"
                :style="did==i.id?'width:46%;margin:10px 5px 10px 5px;background-color:#FFCD42;color:#fff;height:50px;':'height:50px;width:46%;margin:10px 5px 10px 5px;'"
                icon="ios-clock-outline" 
                @click="updateDate(i)" 
                >{{i.name}}</Button>
            </div>
            <div slot="footer">
                <ButtonGroup style="width:100%;margin:10px 0px 10px 0px;height:40px;">
                    <Button @click="modal3=false" style="width:50%;height:40px;">
                        <Icon type="ios-arrow-back" />
                        关闭
                    </Button>
                    <Button @click="openSend" style="width:50%;height:40px;" type="primary">
                        确定
                        <Icon type="ios-arrow-forward" />
                    </Button>
                </ButtonGroup>
            </div>
        </Modal>
    </div>
</template>

<script>
export default {
    data() {
        return {
            modal1:false,
            modal3:false,
            value1:'1',
            user:JSON.parse(sessionStorage.getItem('usercode')),
            daiban:[],
            zaiban:[],
            hehe:[],
            hehe1:[],
            model16:'',
            model2:'',
            cityList: [],
            dateList:[
                {
                    id:1,
                    name:'今日',
                },
                {
                    id:2,
                    name:'本周',
                },
                {
                    id:3,
                    name:'更早',
                },
            ],
            did:1,
            start:'',
            end:'',
            opinionText:'',
            week:[],
        }
    },
    created() {
        if(this.user==null){
            this.$router.push('/');
        }
        var now = new Date();
        let nowDayOfWeek = now.getDay();
        let maxDay = 7 - nowDayOfWeek;
        let data=[]
        this.start=this.getDay(-nowDayOfWeek);
        this.end=this.getDay(+maxDay-1);
        for(let i=7;i>0;i--){
            let count = 1;
            let sum={
                id :count,
                name:this.getDay(-nowDayOfWeek+i)
            }
            count++;
          data.push(sum);
        }
        this.week=data;
        this.$store.dispatch('GetDongLong',encodeURIComponent('Web接口')).then(rx=>{
            this.opinionText = rx;
        this.$axios({
            url: this.opinionText+"/GetWorkFlowActGroupDone?userCode="+this.user,
            method:'get',
            //发送格式为json
            // headers:{
            // 'Content-Type': 'application/json'
            // }
        }).then(r=>{
            this.cityList = [];
            let c = {
                id:2,
                name:'全部',
                type:false,
            }
            this.cityList.push(c);
            this.daiban = [];
            for(let i of r.data.data){
                this.$axios({
                    url: this.opinionText+"/GetWorkFlowActListDone?userCode="+this.user+"&procedureName="+encodeURIComponent(i.procedureName),
                    method:'get',
                    //发送格式为json
                    // headers:{
                    // 'Content-Type': 'application/json'
                    // }
                }).then(r1=>{
                    let a={
                        actCount:i.actCount,
                        procedureName:i.procedureName,
                        data:r1.data.data.sort(f=>f.fromDate),
                    }
                    for(let i of r1.data.data){
                        if(this.cityList.find(f=>f.name==i.projectName)==undefined){
                            let b = {
                                id:i.actCode,
                                name:i.projectName,
                                type:false,
                            }
                            this.cityList.push(b);
                        }
                    }
                    this.daiban.push(a);
                    this.zaiban = this.daiban;
                })
            }
        })
        })
    },
    methods: {
        // 日期筛选
        updateDate(i){
            if(i.id==1){
                if(this.did==1){
                    this.did=0;
                }
                else{
                    this.did=1;
                }
            }
            if(i.id==2){
                if(this.did==2){
                    this.did=0;
                }
                else{
                    this.did=2;
                }
            }
            if(i.id==3){
                 if(this.did==3){
                    this.did=0;
                }
                else{
                    this.did=3;
                }
            }
        },
        updateSelected(i){
            if(i.type==false){
                i.type = true;
                for(let o of this.cityList){
                    if(o.type){
                        if(this.hehe.find(f=>f.name==o.name)==undefined){
                            let a = {
                                id :o.id,
                                name:o.name,
                            }
                            this.hehe.push(a);
                        }
                    }
                }
                this.hehe1 = this.hehe;
            }
            else{
                this.hehe = [];
                i.type = false;
                for(let o of this.cityList){
                    if(o.type==true){
                        let a = {
                            id :o.id,
                            name:o.name,
                        }
                        this.hehe.push(a);
                    }
                }
                this.hehe1 = this.hehe;
            }
        },
        //获取本周日期
        getDay(day){
            var today = new Date();
            var targetday_milliseconds=today.getTime() + 1000*60*60*24*day;
            today.setTime(targetday_milliseconds); //注意，这行是关键代码
            var tYear = today.getFullYear();
            var tMonth = today.getMonth();
            var tDate = today.getDate();
            tMonth = this.doHandleMonth(tMonth + 1);
            tDate =  this.doHandleMonth(tDate);
            return tYear+"-"+tMonth+"-"+tDate;
        },
        doHandleMonth(month){
        　　var m = month;
        　　if(month.toString().length == 1){
          　　m = "0" + month;
        　　}
        　　return m;
        },
        //确定筛选
        openSend(){
            var nowDate = new Date();
            //当前日期
            let date = nowDate.getFullYear()+'-'+(nowDate.getMonth()+1)+'-'+nowDate.getDate();
            if(this.hehe1.length!=0){
                if(this.cityList.find(f=>f.name=='全部' && f.type==true)==undefined){
                    let DB = [];
                    for(let l of this.daiban){
                        let a={
                                actCount:0,
                            procedureName:l.procedureName,
                            data:[],
                        }
                        for(let s of this.hehe1){
                            for(let o of l.data){
                                let month1 = o.fromDate.split(' ');
                                if(this.did==1){
                                    if(o.projectName==s.name && month1[0]==date){
                                        a.actCount +=1;
                                        a.data.push(o);   
                                    }    
                                }
                                if(this.did==2){
                                    for(let ss of this.week){
                                        if(o.projectName==s.name && month1[0]==ss.name){
                                            a.actCount +=1;
                                            a.data.push(o);
                                        }
                                    }
                                }
                                if(this.did==3){
                                    if(o.projectName==s.name && month1[0]<this.week[6].name){
                                        a.actCount +=1;
                                        a.data.push(o);   
                                    }    
                                }
                            }
                        }
                        DB.push(a);
                    }
                    this.zaiban = DB;
                }
                else{
                    if(this.did!=0){
                        let DB = [];
                        for(let l of this.daiban){
                            let a={
                                actCount:0,
                                procedureName:l.procedureName,
                                data:[],
                            }
                            for(let o of l.data){
                                let month1 = o.fromDate.split(' ');
                                if(this.did==2){
                                    for(let s of this.week){
                                        if(month1[0]==s.name){
                                            a.actCount +=1;
                                            a.data.push(o);   
                                        }
                                    }
                                }
                                if(this.did==3){
                                    if(month1[0]<this.week[6].name){
                                        a.actCount +=1;
                                        a.data.push(o);  
                                    }
                                }
                                else{
                                    if(month1[0]==date){
                                        a.actCount +=1;
                                        a.data.push(o);   
                                    }   
                                }
                            }
                            DB.push(a);
                        }
                        this.zaiban = DB;
                    }
                    else{
                        this.zaiban = this.daiban;
                    }
                }
            }
            else{
                if(this.did!=0){
                    let DB = [];
                    for(let l of this.daiban){
                        let a={
                            actCount:0,
                            procedureName:l.procedureName,
                            data:[],
                        }
                        for(let o of l.data){
                            let month1 = o.fromDate.split(' ');
                            if(this.did==2){
                                for(let s of this.week){
                                    if(month1[0]==s.name){
                                        a.actCount +=1;
                                        a.data.push(o);   
                                    }
                                }
                            }
                            if(this.did==3){
                                if(month1[0]<this.week[6].name){
                                    a.actCount +=1;
                                    a.data.push(o);  
                                }
                            }
                            else{
                                if(month1[0]==date){
                                    a.actCount +=1;
                                    a.data.push(o);   
                                }   
                            }
                        }
                        DB.push(a);
                    }
                    this.zaiban = DB;
                }
                else{
                    this.zaiban = this.daiban;
                }
            }
            this.modal3 = false;
        },
        //跳转详情
        openZaiBanDetauils (l) {
            sessionStorage.setItem('actCode',JSON.stringify(l.actCode));
           this.$router.push('/detauils');
        },
        //查询
        chaXun(){
            let DB = [];
            if(this.model2!=''){
                let sum = 1;
                for(let l of this.daiban){
                    let a={
                        actCount:0,
                        procedureName:l.procedureName,
                        data:[],
                    }
                    for(let o of l.data){
                        if(o.title==this.model2.trim()){
                            a.actCount +=1;
                            a.data.push(o);    
                        }
                    }
                    DB.push(a);
                }
                this.zaiban = DB;
            }
            else{
                this.zaiban = this.daiban;
            }
        }
    },
}
</script>

<style>
.sasda{
    color:rgba(0, 201, 140, 0.87)
}
</style>
