<template>
    <el-table ref="curTable" v-bind="$attrs" v-on="$listeners" 
        :size="size"  :stripe="stripe"   highlight-current-row  border
        :maxHeight="maxheight"
         @cell-click = "onCellClick"  :cell-class-name="getCellClassName"
    >
        <slot></slot>
    </el-table>
</template>


<script>



export default {
    data() {
        return {
            maxheight: null,
            startRow: null,
            endRow: null,
            ctrlVals: [],
            selClassName: "select-copy-cell",
            size : "",
            stripe : true,
        }
    },
    computed:{
        tableData(){
            return this.$attrs.data;
        },
        labelCfg(){
            var cfg = {};
            if(this.tableLabelCfg){
                cfg = this.tableLabelCfg;
            }else if(this.globalLyExFnCfg){
                if(this.$store && this.$store.state.lang){
                    cfg = this.globalLyExFnCfg["tableLabelCfg"+this.$store.state.lang] || this.globalLyExFnCfg.tableLabelCfg || {};
                }else{
                    cfg = this.globalLyExFnCfg.tableLabelCfg || {};
                }
            }
            return cfg;
        },
    },
    watch:{
        tableData(val){
            this.startRow = null;
            this.endRow = null;
        }
    },

    mounted() {
        this.size = this.$attrs["size"] || "mini";
        if( this.$attrs["stripe"] === undefined) this.stripe = true;
        else this.stripe = this.$attrs["stripe"];

        this.setMaxheight();
        var methods = ["clearSelection","toggleRowSelection","toggleAllSelection","toggleRowExpansion",
            "setCurrentRow","clearSort","clearFilter","doLayout","sort"];
        methods.map((item)=>{
            // this[item] = this.$refs.curTable[item];
            this[item] = (a,b,c,d,e,f,g)=>{
                this.$refs.curTable[item](a,b,c,d,e,f,g)
            };
        });

    },
    inject: ['setCalcText'],

    methods: {
        setMaxheight(){
            if(this.$attrs["maxHeight"]){
                this.maxheight = this.$attrs["maxHeight"];
                return;
            }
            setTimeout(()=>{
                var diffHeight = this.$attrs["diffHeight"];
                if(!this.$refs.curTable) return;
                this.maxheight = this.getTableHeight(this.$refs.curTable.$el,diffHeight);
            },200)
        },
        onCellClick(row, column, cell, event){
            if(this.globalLyExFnCfg && this.globalLyExFnCfg.noCellCopyEvent) return;
            if(this.$listeners["cell-click"]) return;
            if(!event.shiftKey && !event.ctrlKey) return;
            var that = this;

            if(event.shiftKey || this.selCol){
                var eles = this.$refs.curTable.$el.querySelectorAll("."+this.selClassName);
                for (var i =0;i < eles.length;i++){
                    eles[i].classList.remove(this.selClassName);
                }
            }
            if(event.ctrlKey){
                this.selCol = null;
                this.doCtrlKey(row, column, cell, event);
            }else if(event.shiftKey){
                this.doShiftKey(row, column, cell, event);
            } 
        },
        doCtrlKey(row, column, cell, event){
            if(cell.classList.contains(this.selClassName)){
                cell.classList.remove(this.selClassName);
            }else{
                cell.classList.add(this.selClassName);
            }
            this.doCopy();
        },
        doShiftKey(row, column, cell, event){
            var that = this;
            if(this.startRow && this.endRow ){
                this.startRow = null;
                this.endRow = null;
            }
            if(this.selCol!=column.property){
                //清楚原有信息
                this.startRow = null;
                this.endRow = null;
            }
            this.selCol = column.property;
            if(!this.startRow){
                this.startRow = row;
                this.$attrs.data.map((item,idx)=>{
                    delete item.___isCurCellSelected;
                });
            }else if(this.startRow!=row && this.selCol){
                this.endRow = row;
                var is_start = false;
                this.$attrs.data.map((item,idx)=>{
                    if(this.startRow==item || this.endRow == item){
                        is_start = !is_start;
                        item.___isCurCellSelected  = true;
                    }else if(is_start){
                        item.___isCurCellSelected  = true;
                    }
                });
                this.doCopy();
            }
            this.startSelRow = null;
        },
        doCopy(){
            var that = this;
            setTimeout(function(){
                var eles = that.$refs.curTable.$el.querySelectorAll("."+that.selClassName);
                if(eles.length==0) return;
                var copytext = "";
                for (var i =0;i < eles.length;i++){
                    var text = eles[i].innerText;
                    if(text){
                        copytext+=text+"\r\n";
                    }
                }
                if(that.setCalcText){
                    that.setCalcText(copytext);
                }
                that.copy(copytext);
                that.$message.success(that.labelCfg.copySuccToClip || "已复制选择内容到剪切板");
            },300);
        },
        getCellClassName({row, column, rowIndex, columnIndex}){
            if(this.$attrs["cell-class-name"]) return;
            if(column.property == this.selCol && this.selCol){
                if(row.___isCurCellSelected){
                    return this.selClassName
                }
            }
            return "";
        },
    }
}
</script>