<template>
    <div class="flex-container">
        <!-- 查询区域 -->
        <div class="table-page-search-wrapper">
            <!-- 搜索区域 -->
            <a-form layout="inline">
                <a-row :gutter="24">
                    <a-col :md="12" :sm="12">
                        <a-form-item  label="时间选择：">
                            <a-range-picker @change="onChange" />
                        </a-form-item>
                    </a-col>
                    <span class="table-page-search-submitButtons" style="float: left; overflow: hidden;">
                        <a-col :md="4" :sm="24">
                             <a-button @click="search()" type="primary">查询</a-button>
                    <a-button  v-show="!callback" @click="handleSubmit" style="margin-left: 10px">导出</a-button>
                    <a-button v-show="callback" style="margin-left: 10px">导出中<a-spin  style="margin-left: 5px" size="small"/></a-button>
                        </a-col>
                    </span>

                </a-row>
            </a-form>
           </div>

        <!--列表-->
        <s-table :columns="columns" :data="rowdata" bordered ref="table" size="small" class="flex-filling">
        </s-table>
    </div>
</template>

<script>
    import STable from '@/components/table';
    import {reportList,reportDownload} from "@/api/school-center/orderAPI"
    import {cloneObject,exportFile} from '@/utils/util';
    import moment from 'moment';
    export default {
        name: "hhrReport",
        components: {
            STable,
        },
        data(){
            return {
                //下载完成状态
                callback:false,
                Formtable: this.$form.createForm(this),
                queryParam: {
                    startTime :'',
                    endTime  :''
                },
                columns: [
                    {title:'时间',
                    children: [
                        {title:'业务类型',children: [
                            {dataIndex: 'subName', width: 80, title: '县分'},
                            {dataIndex: 'schoolNum', width: 80, title: '学校数'},
                            {dataIndex: 'studentNum', width: 80, title: '学生数'}
                        ]}
                    ]},
                    {title:'本周',
                    children: [
                        {title:'新增',children: [
                            {dataIndex: 'newUserNumWeek', width: 80, title: '新用户'},
                            {dataIndex: 'newAloneNumWeek', width: 80, title: '单宽带'},
                            {dataIndex: 'newMixNumWeek', width: 80, title: '融合宽带'}
                        ]},
                        {title:'存量',children: [
                            {dataIndex: 'oldUserNumWeek', width: 80, title: '老用户办理'},
                            {dataIndex: 'oldContinueNumWeek', width: 80, title: '老用户续约'}
                        ]},
                        {title:'已竣工',children: [
                            {dataIndex: 'finishNewNumWeek', width: 80, title: '新增'},
                            {dataIndex: 'finishOldNumWeek', width: 80, title: '存量'}
                        ]},
                        {dataIndex: 'sumWeek', width: 80, title: '总计'}
                    ]},
                    {title:'本月',
                    children: [
                        {title:'新增',children: [
                            {dataIndex: 'newUserNumMonth', width: 80, title: '新用户'},
                            {dataIndex: 'newAloneNumMonth', width: 80, title: '单宽带'},
                            {dataIndex: 'newMixNumMonth', width: 80, title: '融合宽带'}
                        ]},
                        {title:'存量',children: [
                            {dataIndex: 'oldUserNumMonth', width: 80, title: '老用户办理'},
                            {dataIndex: 'oldContinueNumMonth', width: 80, title: '老用户续约'}
                        ]},
                        {title:'已竣工',children: [
                            {dataIndex: 'finishNewNumMonth', width: 80, title: '新增'},
                            {dataIndex: 'finishOldNumMonth', width: 80, title: '存量'}
                        ]},
                        {dataIndex: 'sumMonth', width: 80, title: '总计'}
                    ]},
                    {title:'累计',
                    children: [
                        {title:'新增',children: [
                            {dataIndex: 'newUserNumAll', width: 80, title: '新用户'},
                            {dataIndex: 'newAloneNumAll', width: 80, title: '单宽带'},
                            {dataIndex: 'newMixNumAll', width: 80, title: '融合宽带'}
                        ]},
                        {title:'存量',children: [
                            {dataIndex: 'oldUserNumAll', width: 80, title: '老用户办理'},
                            {dataIndex: 'oldContinueNumAll', width: 80, title: '老用户续约'}
                        ]},
                        {title:'已竣工',children: [
                            {dataIndex: 'finishNewNumAll', width: 80, title: '新增'},
                            {dataIndex: 'finishOldNumAll', width: 80, title: '存量'}
                        ]},
                        {dataIndex: 'sumAll', width: 80, title: '总计'}
                    ]}
                ]
                ,
                rowdata: parameter => {
                    let params = {
                        pageNo: parameter.pageNo,
                        pageSize: parameter.pageSize
                    }
                    let obj = cloneObject(this.queryParam)
                    //表示
                    return reportList(Object.assign(params,obj)).then(res => {
                        let data = {}
                        if (res.state !== 'success') {
                            data = {
                                data: []
                            }
                        } else {
                            data = {
                                data: res.data
                            }
                        }
                        return data
                    })
                }
            }
        },
        methods:{
            moment,
            search() {
                this.$refs.table.refresh({search: true})
            },
            //时间事件
            onChange(date, dateString) {
                if(dateString.length==0){
                    this.queryParam.startTime=''
                    this.queryParam.endTime=''
                }else {
                    this.queryParam.startTime=dateString[0]
                    this.queryParam.endTime=dateString[1]
                }
            },
            handleSubmit() {
                this.callback=true;
                exportFile(reportDownload(), "一人一码统计报表" + nowdate + ".xlsx",this.downloadstatu);
            },
            downloadstatu(){
                this.callback=false;
            }
        }
    }
</script>

<style scoped>

</style>