<template>
    <div class="dilog">
        <el-dialog :title="!isfabu ? '亮灯提示' : '发布结果'" :visible.sync="dialogTableVisibleTips" :before-close="close">
            <el-table :data="gridData" height="300px" v-if="!isfabu" @selection-change="handleSelectionChange"
                ref="multipleTable">
                <el-table-column type="selection" width="55" :selectable="selectable">
                </el-table-column>
                <el-table-column property="imei1" label="IMEI/SN" width="150">
                    <template slot-scope="{row}">
                        <span>
                            {{ row.imei1 || row.imei2 || row.sn }}
                        </span>
                    </template>
                </el-table-column>
                <el-table-column property="model_info" label="机器信息" width="200">
                    <template slot-scope="{row}">
                        <span style="display:felx;align-items:center;">
                            <el-popover placement="right" width="350" trigger="click">
                                <img v-if="!!row['img']" style="height: 350px" :src="row['img']">
                                <img v-if="!!row['img']" slot="reference" style="float: left;height: 50px"
                                    :src="row['img']">
                            </el-popover>
                            {{ row['brand_name'] }} {{ row['model_name'] }} {{ row['rom_name'] }} {{ row['color_name'] }}
                        </span>
                    </template>
                </el-table-column>
                <el-table-column property="status" label="亮灯状态">
                    <template slot-scope="{row}">
                        <span>
                            {{ row.tipsStatus == 0 ? '不在货架' : '成功' }}
                        </span>
                    </template>
                </el-table-column>
            </el-table>
            <el-table :data="fabuData" height="300px" v-if="isfabu">
                <el-table-column property="business_id" label="质检码" width="150">
                    <template slot-scope="{row}">
                        <span>
                            {{ row.business_id }}
                        </span>
                    </template>
                </el-table-column>

                <el-table-column property="status" label="发布状态">
                    <template slot-scope="{row}">
                        <span>
                            {{ row.msg }}
                        </span>
                    </template>
                </el-table-column>
            </el-table>
            <div slot="footer" class="dialog-footer">
                <el-button type="warning" @click="closeLight">关灯</el-button>
                <el-button @click="quzou">已取走</el-button>
                <el-button type="primary" @click="confirm">确 定</el-button>
            </div>
        </el-dialog>
    </div>
</template>

<script>
export default {
    data() {
        return {
            gridDataList: [],
        }
    },
    props: {
        dialogTableVisibleTips: {
            type: Boolean,
            default: () => {
                return false;
            }
        },
        gridData: {
            default: () => {
                return [{
                    imei: '666',
                    name: '王小虎',
                    status: '0'
                }]
            }
        },
        fabuData: {
            default: () => {
                return []
            }
        },
        isfabu: {
            default: () => {
                return false
            }
        }
    },
    watch: {
        gridData(newval) {
            console.log(newval, '子------------gridData');
            if (newval.length > 0) {
                newval.forEach(row => {
                    this.$nextTick(() => {
                        if (row.tipsStatus != 0) {
                            this.$refs.multipleTable.toggleRowSelection(row)
                        }
                    })
                });
            } else {
                this.$refs.multipleTable.clearSelection();
            }
        },
        fabuData(newval) {
            console.log(newval, '子------------fabuData');
        },
    },
    methods: {
        confirm() {
            this.$emit('dialogTipsChange', false)
        },
        close() {
            this.confirm();
        },
        //关灯
        closeLight() {
            this.$emit('tipCloseLight', this.gridDataList)
        },
        //取走
        quzou() {
            this.$emit('tipCloseLight', this.gridDataList,1)
        },
        //选中事件
        handleSelectionChange(e) {
            this.gridDataList = e;
            console.log(e);
        },
        selectable(row,rowIndex){
            if(row.tipsStatus == 0){
                return false;
            }else {
                return true;
            }
        },
    },
}
</script>

<style></style>