<template>
    <div class='gdqd-dialog'>
        <div class='top'></div>
        <div class='gdqd-dialog-top'>
            <Select width='224' tipPlace='top' caption='管理归属' size='small' style='margin-right:12px' :selectdata='dataSelect2' :placeholder='"请选择"'></Select>
            <Select width='224' tipPlace='top' caption='设备状态' size='small' style='margin-right:12px' :selectdata='dataSelect2' :placeholder='"请选择"'></Select>
            <Select width='224' tipPlace='top' caption='楼层：' size='small' style='margin-right:12px' :selectdata='floorSelect' :placeholder='"请选择"'></Select>
            <el-input placeholder='请按照设备简称搜索' size='small' prefix-icon='el-icon-search' v-model='input'></el-input>
            <el-input placeholder='请按照设备编号搜索' size='small' prefix-icon='el-icon-search' v-model='input'></el-input>
            <el-input placeholder='请按品牌搜索' size='small' prefix-icon='el-icon-search' v-model='input'></el-input>
            <el-input placeholder='请按照型号搜索' size='small' prefix-icon='el-icon-search' v-model='input'></el-input>
            <el-input placeholder='请按照安装位置搜索' size='small' prefix-icon='el-icon-search' v-model='input'></el-input>
            <el-input placeholder='请按照生产厂商搜索' size='small' prefix-icon='el-icon-search' v-model='input'></el-input>
            <el-input placeholder='请按照服务商搜索' size='small' prefix-icon='el-icon-search' v-model='input'></el-input>
        </div>
        <el-table :data='tableData' style='width: 100%'>
            <el-table-column type='index' label='序号' width='50'></el-table-column>
            <el-table-column prop='lb' label='设备简称'></el-table-column>
            <el-table-column prop='sl' label='设备编号'></el-table-column>
            <el-table-column prop='unit' label='数量'></el-table-column>
            <el-table-column prop='lb' label='管理归属'></el-table-column>
            <el-table-column prop='sl' label='设备状态'></el-table-column>
            <el-table-column prop='unit' label='品牌'></el-table-column>
            <el-table-column prop='sl' label='型号'></el-table-column>
            <el-table-column prop='unit' label='楼层'></el-table-column>
            <el-table-column prop='lb' label='安装位置'></el-table-column>
            <el-table-column prop='sl' label='生产厂商'></el-table-column>
            <el-table-column prop='unit' label='服务商'></el-table-column>
        </el-table>
    </div>
</template>
<script>
import Select from '@/components/Select/Select.vue'
import { mapGetters } from 'vuex'
export default {
    data() {
        return {
            tableData: [],
            dataSelect2: [
                { id: 'test1', name: '选择项' },
                { id: 'test2', name: '单平米' },
                { id: 'test3', name: '下级分项' },
                { id: 'test4', name: '滑动平均滑动平均' }
            ],
            input: '',
            floorSelect: [] //楼层下拉框
        }
    },
    components: {
        Select
    },
    computed: {
        ...mapGetters(['floorsArr'])
    },
    mounted() {
        this.init()
    },
    methods: {
        open() {
            this.visible = true
        },
        init() {
            this.floorSelect = []
            if (this.floorsArr.length > 0) {
                this.floorsArr.forEach(e => {
                    let obj = {
                        id: e,
                        name: e
                    }
                    this.floorSelect.push(obj)
                })
            }
        }
    }
}
</script>
<style lang="less" scoped>
.gdqd-dialog {
    .top {
    }
    .gdqd-dialog-top {
        display: flex;
    }
}
</style>
<style lang="less">
.gdqd-dialog {
    border: 1px solid green;
    padding: 16px 24px 24px;
}
</style>