fj-dc-ui/.svn/pristine/a8/a88c1bb155b619e5f49d7bc8ec27d307b4dae1bf.svn-base

<template>

    <el-row>
        <el-col :span="4" >
            <el-card :body-style="{'padding':'0'}">
                <export-tree-list-with-check-box-ry
                        :pid="pid"
                        :type="type"
                        :style="{'max-height':dxdcAsideHeight+'px'}"
                        @treeCheckedDataChange="treeCheckedDataChange"
                ></export-tree-list-with-check-box-ry>
            </el-card>
        </el-col>
        <el-col :span="20">
            <el-card :body-style="{'padding-top':'0'}">
                <el-checkbox :indeterminate="isIndeterminate"
                             v-model="checkAll"
                             @change="handleCheckAllChange"
                             style="margin-top: 10px"
                >全选</el-checkbox>
                <el-checkbox :indeterminate="isIndeterminate"
                             v-model="checkSum"
                             @change="handleCheckSumChange"
                             style="margin-top: 10px"
                >合并</el-checkbox>
                <el-checkbox-group v-model="checkTable">
                    <el-checkbox v-for="table in tables"
                                 :label="table"
                                 :key="table"
                                 style="margin-top: 10px;"
                    >{{table}}
                    </el-checkbox>
                    <el-button type="primary" icon="el-icon-check" style="float: right" @click="createExecl">导出</el-button>
                </el-checkbox-group>
            </el-card>
            <el-card :body-style="{'height':dxdcMainHeight + 'px'}">
                <div style="width: 100%;height: 100%;overflow-y: auto" v-show="showDiv" v-loading="loadDiv" id="myDiv" ref="myDiv" >

                </div>
            </el-card>
        </el-col>
    </el-row>

</template>

<script>

    const tableOptions = [
        '暗访调研行政村统计表',
        '村内农村饮水工程设施运行维护情况表',
        '用水户情况表',
        '农村饮水工程运行管理情况表',
        '千人以上供水工程水源地保护情况表',
        '管理责任体系落实情况表'
    ];

    import request from '../../utils/gw_ajax_request.js';
    import exportTreeListWithCheckBoxRy from './exportTreeListWithCheckBox_ry'
    export default {
        name: "generalExport",
        components: {
            exportTreeListWithCheckBoxRy:exportTreeListWithCheckBoxRy,
        },
        data() {
            return {
                ids:[],
                tableIds:[],
                pid:'000',
                type:'002',
                tables: tableOptions,
                checkAll:false,
                checkSum:false,
                checkSumState:0,
                checkTable:['暗访调研行政村统计表'],
                dxdcMainHeight: window.innerHeight-250,
                dxdcAsideHeight: window.innerHeight-90,
                showDiv:true,
                loadDiv:false,
            }
        },
        mounted() {

        },
        computed: {
            userId: function () {
                return localStorage.getItem("userid")
                    ? localStorage.getItem("userid")
                    : "1098101939614724096";
            }
        },
        methods: {
            //树节点选中事件
            treeCheckedDataChange(params){
                // 如果是选中状态，把元素id加入到ids里
                if(params.newStatus){
                    params.newCheckedArray.forEach((element,index) => {
                        let id = element.id;
                        if(id != null && id !== undefined && id !=='' && id.length == 32){
                            this.ids.push(id)
                        }
                    });
                }else {
                    // 删除取消的元素id
                    params.changedItem.forEach((element,index) => {
                        let id =  element.id;
                        let inx = this.ids.indexOf(id);
                        if(inx > -1) {
                            delete this.ids[inx]
                        }
                    });
                }
                // 去重
                this.ids = Array.from(new Set(this.ids));
            },
            //表格点击选中事件
            handleCheckAllChange(val) {
                //
                this.checkTable = val ? tableOptions : [];
                this.isIndeterminate = false;
            },
            handleCheckSumChange(val){
                if(val){
                    this.checkSumState = 1;
                }else{
                    this.checkSumState = 0;
                }
                this.isIndeterminate = false;
            },
            //创建Excel事件
            createExecl(){

                this.$refs.myDiv.innerHTML = "";
                this.loadDiv = true;

                let _tableIds = [];
                this.checkTable.forEach((element,index) => {
                    let tableName = "";
                    switch (element){
                        case "暗访调研行政村统计表" :
                            tableName =  "01";
                            break;
                        case "村内农村饮水工程设施运行维护情况表" :
                            tableName =  "02";
                            break;
                        case "用水户情况表" :
                            tableName =  "03";
                            break;
                        case "农村饮水工程运行管理情况表" :
                            tableName =  "04";
                            break;
                        case "千人以上供水工程水源地保护情况表" :
                            tableName =  "05";
                            break;
                        case "管理责任体系落实情况表" :
                            tableName =  "06";
                            break;
                    }
                    _tableIds.push(tableName);
                });
                this.tableIds = _tableIds;

                let params = {
                    'engIds':this.ids.toString(),
                    'tableIds':this.tableIds.toString(),
                    'sumState':this.checkSumState,
                    'adCodes':''//已不需要传
                }
                request.post('/dc/gd/base/create', params).then((res) => {
                    this.$refs.myDiv.innerHTML = res;
                    this.loadDiv = false;
                })
            },

        },
        watch:{

        }
    }
</script>

<style scoped>



</style>