/**
@author:fugy
@date:2018.09.29
@info:批量适用于
 */
 <template>
<el-dialog
title="批量适用于"
:visible.sync="dialogVisible"
width="40%"
:close-on-click-modal="false"
:show-close="false"
center
>
    <div class="batch-box">
        <div class="top">
            <p>您可以勾选适用此报警条目的其他实例，以适用此次编辑</p>
        </div>
        <div class="table-box">
            <el-table                
                :data="tableData"
                tooltip-effect="dark"
                style="width: 100%"
                border
                @selection-change="handleSelectionChange">                
                <el-table-column
                prop="instanceInfo"
                label="对象实例"
                header-align="center">
                </el-table-column>
                <el-table-column
                    type="selection"
                    width="55">
                </el-table-column>
            </el-table>
        </div>
        <div class="btn-box">
            <el-button type="primary" @click="save">确定</el-button>
            <el-button class="cancel" @click="cancel">取消</el-button>   
        </div>
    </div>
</el-dialog>
 </template>
 
 <script>
 import api from "./api"; //api;
 import utils from "./utils"; //api

export default {
    name: "batch-apply",
    data() {
        return {            
            dialogVisible: false,
            multipleSelection: [], //多选框
            tableData: [],
            entityDictObj:[], //对象实例的本地字典
        }
    },
    props:["batchApplyFlag", "batchApplyArr", "id", "projectId"],
    methods: {
        // checkbox选择事件
        handleSelectionChange(val) {
            this.multipleSelection = val;
        },
        // 批量数据处理
        btachListHandle() {
            let applyArr = [];            
            this.batchApplyArr.forEach((item, index, arr) => {   
                if(item.id == this.id) {
                    arr.splice(index, 1);
                };              
            });
            // 中转适用对象类实例
            this.batchApplyArr.forEach((item, index, arr) => {  
                applyArr.push({id: item.instanceId})            
			});
            let params = {criterias: applyArr, valid: null}
            api.getApplyObjInfo(this.projectId, params).then(resp => {	
                if(resp.length) {
                    this.entityDictObj = utils.entityDict(resp);
                    this.batchApplyArr.forEach((ele, idx) => {
                        let preName = utils.objPreName(ele.objType);
                        let name = this.entityDictObj[ele.instanceId].infos[preName + "LocalName"] || this.entityDictObj[ele.instanceId].infos[preName + "Name"];
                        let id = this.entityDictObj[ele.instanceId].infos[preName + "LocalID"] || this.entityDictObj[ele.instanceId].infos[preName + "ID"];
                        if(preName == "facility") {
                            ele.instanceInfo = name + " - " + id + (ele.instanceLocation ? " - "+ele.instanceLocation : "");
                        } else {
                            ele.instanceInfo = name + " - " + id;
                        }
                    })
                    // 最后赋值
                    this.tableData = this.batchApplyArr;				
                }
            })
        },
        // 保存
        save() {
            let arr = this.multipleSelection.length ? this.multipleSelection: [];
            this.$emit("batch-apply-handle", arr);
            this.dialogVisible = false;
        },
        // 取消
        cancel() {
            let arr = []
            this.$emit("batch-apply-handle", arr);
            this.dialogVisible = false;
        }
    },
    watch: {
        batchApplyFlag() {
            this.dialogVisible = true;
            this.btachListHandle();
        }
    }
}
 </script>
 <style lang="less" scoped>
.batch-box {
    .top {
        text-align: center;
    }
    .table-box{
        height: 500px;
        overflow-y: auto; 
        margin-top: 10px;
    }
    .btn-box {
        margin-top: 10px;
        text-align: center;
        .cancel {
            margin-left: 50px;
        }
    }
}
 
 </style>
 
 