ibms/src/views/data_admin/buildAssets/index.vue

<template>
  <div class='box'>
    <div class='condition'>
      <p>
        <span style="margin-right: 12px">建筑名称</span>
        <el-select v-model='buildValue' placeholder='请选择'>
          <el-option v-for='item in options' :key='item.BuildID' :label='item.BuildLocalName' :value='item.BuildID'></el-option>
        </el-select>
      </p>
    </div>
    <el-tabs v-model='activeName' @tab-click='tabChange' style="background:#fff">
      <el-tab-pane v-for="item in tabList" :label='item.label' :name='item.name' :key="item.label"></el-tab-pane>
    </el-tabs>
    <assets-list :buildingData="options" :buildingId="buildValue" :active="activeName" ref="assetlist"></assets-list>
  </div>
</template>

<script>
import assetsList from './assetsList'
import { mapGetters } from 'vuex'
//api
import { buildingQuery } from '@/api/scan/request'
export default {
  name: 'build-assets',
  data() {
    return {
      activeName: 'first',
      buildValue: '',
      options: [],
      floorsObj: {},
      allFamilyObj: {},
      allEquipObj: {},
      tabList: [
        { label: '现场无法找到的资产', name: "first" },
        { label: '未画入模型的资产', name: "second" },
        { label: '无对应岗位的资产', name: "third" },
        { label: '未扫楼验证的资产', name: "fourth" }
      ],
    }
  },
  computed: {
    ...mapGetters('layout', ['projectId', 'userId', 'secret'])
  },
  components: {
    assetsList
  },
  methods: {
    //获取建筑列表
    getBuilding() {
      buildingQuery({}, res => {
        this.options = res.Content
        this.buildValue = res.Content ? res.Content[0].BuildID : ''
      })
    },
    tabChange(tab) { }
  },
  created() {
    this.getBuilding()
  },
  watch: {
    projectId() {
      this.getBuilding()
    }
  }
}
</script>

<style scoped lang='less'>
.box {
    .condition {
        padding: 10px;
        display: flex;
        border: 1px solid #dfe6ec;
        background:#fff;
        margin-bottom: 10px;
    }
    /deep/ .el-tabs__nav{
        margin-left: 10px;
    }
}
</style>