<template>
    <div class="page-table-template" style='display: flex;flex-direction: column;flex-grow: 1;flex-shrink: 1;'>
        <div class='data-table'>
            <el-table  :data='tableData' style='width: 100%;' v-loading='loading' height="100%">
                <el-table-column header-align='center' align='center' prop='BuildName' label='建筑'  width="150"></el-table-column>、
                <el-table-column header-align='center' align='center' prop='floorName' label='楼层' width="80"></el-table-column>
                <el-table-column header-align='center' align='center' prop='PointName' label='点位标签名称'>
                    <template slot-scope='scope'>
                        <span>{{scope.row.PointName || '--'}}</span>
                    </template>
                </el-table-column>
                <el-table-column header-align='center' align='center' prop='FamilyName' label='设备族'></el-table-column>
                <el-table-column header-align='center' align='center' label='本地编码' width='250'>
                    <template slot-scope='scope'>
                        <span>{{scope.row.Infos.EquipLocalID || scope.row.Infos.EquipID || '--'}}</span>
                    </template>
                </el-table-column>
                <el-table-column header-align='center' align='center' prop='LocalName' label='本地名称'></el-table-column>
                <el-table-column header-align='center' align='center' prop='PointName' label='操作' width='150'>
                    <template slot-scope='scope'>
                        <el-button type='primary' plain size='mini' @click='look(scope.row)'>查看</el-button>
                        <el-button type='danger' plain size='mini' @click='del(scope.row)'>删除</el-button>
                    </template>
                </el-table-column>
            </el-table>
        </div>
        <base-pagination class='data-table-pagination' style="text-align:right;" :currentPages='pageNum' :total='total' @pageChanged='pageChanged'></base-pagination>
        <saga-dialog ref='dialog' :iframeSrc='iframeSrc'></saga-dialog>
    </div>
</template>

<script>
import { mapGetters } from 'vuex'
import SagaDialog from './Frame'
//api
import {
    getErrAssets, //获取异常资产type不同不同tab
    delErrAssets
} from '@/api/scan/request'
export default {
    name: 'nofind',
    data() {
        return {
            loading: false,
            tableData: [],
            total: 0,
            pageNum: 1,
            pageSize: 50,
            iframeSrc: ''
        }
    },
    props: {
        buildVlaue: {
            default: ''
        },
        floorsObj: {
            default: {}
        }
    },
    components: {
        SagaDialog
    },
    computed: {
        ...mapGetters('layout', ['projectId', 'userId', 'secret'])
    },
    methods: {
        look(row) {
            this.iframeSrc =
                process.env.BASE_URL +
                ':8889/#/details?perjectId=' +
                this.projectId +
                '&secret=' +
                this.secret +
                '&FmId=' +
                row.FmId +
                '&type=1&code=' +
                row.Family
            this.$refs['dialog'].show()
        },
        del(row) {
            this.$confirm('此操作将永久删除, 是否继续?', '提示', {
                confirmButtonText: '确定',
                cancelButtonText: '取消',
                type: 'warning'
            })
                .then(() => {
                    let param = {
                        ProjId: this.projectId,
                        UserId: this.userId
                    }
                    let paramList = [row.FmId]
                    delErrAssets(param, paramList).then(result => {
                        if (result.data.Result == 'success') {
                            this.getAsset()
                            this.$message({
                                message: '删除成功',
                                type: 'success'
                            })
                        }
                    })
                })
                .catch(() => {
                    this.$message({
                        type: 'info',
                        message: '已取消删除'
                    })
                })
        },
        pageChanged(page, size) {
            this.pageNum = page
            this.pageSize = size
            this.getAsset()
        },
        getAsset() {
            this.loading = true
            let param = {
                BuildId: this.buildVlaue || undefined,
                PageNum: this.pageNum,
                PageSize: this.pageSize,
                Type: 2,
                ProjId: this.projectId,
                UserId: this.userId
            }
            getErrAssets(param).then(res => {
                if (res.data.Result == 'success') {
                    this.loading = false
                    let list = res.data.FmList
                    list.forEach((ele, index) => {
                        ele.LocalName = ele.LocalName? ele.LocalName: ele.FmName
                        ele.floorName = this.floorsObj[ele.FloorId] || '--'
                    })
                    this.tableData = list
                    this.total = res.data.Count
                } else {
                    this.tableData = []
                    this.total = 0
                    this.loading = false
                }
            })
        }
    },
    watch: {
        buildVlaue() {
            this.getAsset()
        }
    }
}
</script>

<style scoped lang='less'>
</style>
