<!-- 综合事项记录 -->
<template>
    <div class='zhsx-box'>
        <div class='zhsx-top'>
            <div>
                <el-tabs v-model='activeName' @tab-click='handleClick'>
                    <el-tab-pane v-for='(item,index) in everySystem' :key='index' :label='`${item.label}`' :name='`${item.type}`'>
                        <!-- 综合记录事项 -->
                        <div v-if='item.type==1'>
                            <zhsx-other-table1 ref='tableZhsx1'></zhsx-other-table1>
                        </div>
                        <!-- 第三方检测事项 -->
                        <div v-if='item.type==2'>
                            <zhsx-other-table2 ref='tableZhsx2'></zhsx-other-table2>
                        </div>
                    </el-tab-pane>
                </el-tabs>
            </div>
            <div class='zhsx-img' @click='zhsxLog'>
                <img src='../../assets/imgs/zy1.png' alt />
            </div>
        </div>
        <zhsx-dialog ref='Dialog'></zhsx-dialog>
    </div>
</template>
<script>
import moment from 'moment'
import Select from '@/components/Select/Select.vue'
import ZhsxDialog from './zhsxDialog'
import zhsxOtherTable1 from './zhsxOtherTable1'
import zhsxOtherTable2 from './zhsxOtherTable2'
import { querySelect } from '@/api/public.js'
export default {
    data() {
        return {
            activeName: '1'
        }
    },
    props: ['everySystem'],
    components: { ZhsxDialog, Select, zhsxOtherTable1, zhsxOtherTable2 },
    methods: {
        zhsxLog() {
            this.$refs.Dialog.open()
        },
        handleClick(tab) {
            if (tab.index == '0') {
                this.$refs.tableZhsx1[0].getZhjl()
            } else if (tab.index == '1') {
                this.$refs.tableZhsx2[0].dsfjc()
            }
        },
        changeSelect() {
            let postParams = [
                {
                    columnName: { brand: 'brand', manufacturer: 'manufacturer' }, //列名称
                    params: {
                        // tab_code: '1572'
                    },
                    tableName: 'glsms_asset' //视图名称
                }
            ]
            let data = {
                // major: '弱电',
                plazaId: '1001145'
            }
            querySelect({ data, postParams }).then(res => {
                console.log('部门', res)
            })
        }
    },
    mounted() {
        this.$refs.tableZhsx1[0].getZhjl()
        this.changeSelect()
    }
}
</script>
<style lang="less" scoped>
.zhsx-box {
    height: 100%;
    padding: 66px 50px 38px 50px;
    .zhsx-top {
        position: relative;
        .zhsx-img {
            position: absolute;
            width: 16px;
            height: 16px;
            left: 274px;
            top: 3px;
            img {
                width: 100%;
                height: 100%;
            }
        }
        .tab-top {
            display: flex;
            align-items: center;
        }
    }

    .zhsx-bottom {
        margin-top: 12px;
        background: #ffffff;
        position: relative;
        padding-bottom: 73px;
        .footer {
            position: absolute;
            height: 32px;
            right: 28px;
            bottom: 24px;
        }
    }
}
</style>
<style lang="less">
.zhsx-box {
    .el-dialog__header {
        padding: 16px 24px;
    }
    .el-dialog__title {
        font-size: 16px;
        font-family: PingFangSC-Medium, PingFang SC;
        font-weight: 500;
        color: rgba(0, 0, 0, 0.85);
        line-height: 24px;
    }
    .el-dialog__body {
        padding: 0 24px;
        height: 90%;
    }
    .el-tabs--bottom .el-tabs__item.is-bottom:nth-child(2),
    .el-tabs--bottom .el-tabs__item.is-top:nth-child(2),
    .el-tabs--top .el-tabs__item.is-bottom:nth-child(2),
    .el-tabs--top .el-tabs__item.is-top:nth-child(2) {
        padding-left: 16px;
    }
    .el-tabs--bottom .el-tabs__item.is-bottom:last-child,
    .el-tabs--bottom .el-tabs__item.is-top:last-child,
    .el-tabs--top .el-tabs__item.is-bottom:last-child,
    .el-tabs--top .el-tabs__item.is-top:last-child {
        padding-right: 16px;
    }
    .el-tabs__nav-wrap::after {
        height: 0;
    }
    .el-tabs__item {
        padding: 5px 16px;
        height: 30px;
        line-height: 22px;
        font-size: 14px;
        font-family: MicrosoftYaHei;
        color: rgba(31, 36, 41, 1);
        border: 1px solid rgba(195, 199, 203, 1);
        border-radius: 4px;
    }
    .el-tabs,
    .el-tabs__content {
        height: 94%;
    }
    .el-tabs__active-bar {
        background-color: transparent !important;
    }
    .is-active {
        color: #025baa;
        border-color: #025baa;
        border-radius: 4px;
    }
    .el-tabs__header {
        margin: 0 0 12px;
    }
    .el-table td,
    .el-table th {
        padding: 8px 0;
    }
    .el-input--suffix .el-input__inner {
        padding-right: 20px;
    }
}
</style>