/**
 * 设备详情弹窗页面
 */
<template>
    <div class="equipment-detail">
        <el-dialog custom-class="equipment-detail-dialog" title="设备详情" :visible.sync="dialogTableVisible">
            <el-table :data="gridData">
                <el-table-column property="date" label="日期" width="150"></el-table-column>
                <el-table-column property="name" label="姓名" width="200"></el-table-column>
                <el-table-column property="address" label="地址"></el-table-column>
            </el-table>
            <el-container>
                <el-aside>
                    <ul class="outer" v-for="(item, index) in asideData" :key="index">
                        {{
                            item.name
                        }}
                        <li class="inner" v-for="(detail, dIndex) in item.children" :key="dIndex">
                            {{ detail.name }}
                        </li>
                    </ul>
                </el-aside>
                <el-main> 222 </el-main>
            </el-container>
        </el-dialog>
    </div>
</template>
<script>
/**
 * 设备详情弹窗页面
 */
export default {
    name: "equipmentDetail",
    props: {},
    components: {},
    data() {
        return {
            asideData: [
                {
                    name: "静态信息点",
                    id: "staticInfoPoint",
                    children: [
                        {
                            name: "基本信息",
                            id: "baseInfo",
                            focus: true,
                        },
                        {
                            name: "设备厂家",
                            id: "equipmentManufacturer",
                            focus: false,
                        },
                        {
                            name: "供应购买",
                            id: "supplyPurchase",
                            focus: false,
                        },
                    ],
                },
                {
                    name: "动态信息点",
                    id: "dynamicInfoPpoint",
                    children: [
                        {
                            name: "能源信息",
                            id: "energyInfo",
                            focus: false,
                        },
                    ],
                },
            ],
            gridData: [
                {
                    date: "2016-05-02",
                    name: "王小虎",
                    address: "上海市普陀区金沙江路 1518 弄",
                },
                {
                    date: "2016-05-04",
                    name: "王小虎",
                    address: "上海市普陀区金沙江路 1518 弄",
                },
                {
                    date: "2016-05-01",
                    name: "王小虎",
                    address: "上海市普陀区金沙江路 1518 弄",
                },
                {
                    date: "2016-05-03",
                    name: "王小虎",
                    address: "上海市普陀区金沙江路 1518 弄",
                },
            ],
            dialogTableVisible: true,
        };
    },
    created() {},
    mounted() {},
    methods: {},
};
</script>
<style lang='less' scoped>
.equipment-detail {
    /deep/ .equipment-detail-dialog {
        width: 1200px;
        height: 648px;
        // background-color: blueviolet;
    }
}
</style>