<template>
  <!--安检综合查询主界面-->
  <div id="unit" class="flex-row">
    <!--展示查询界面-->
    <safecheck-pitfall-defect-search class="flex" :tempval="hidden" v-bind:style="{width:barwidth}" @select-changed="selected"
                             @canel-main="close" v-ref:checksearch></safecheck-pitfall-defect-search>
    <div class="flex" v-if="showItem" style="width: 40%;">
      <!--安检项详细信息-->
      <ul class="nav nav-tabs">
        <li role="presentation" class="active"><a href="#">隐患用户</a></li>
        <span class="glyphicon glyphicon-remove-circle close" style="margin-top: 5px" @click="close"></span>
      </ul>
      <div style="height: 100vh;overflow: scroll;">
        <defect-pitfall-list style="height: 100%" :row="rowData"></defect-pitfall-list>
      </div>
    </div>
  </div>
</template>

<script>

export default {
  title: '隐患中心查看（隐患）',
  data () {
    return {
      hidden: true,
      barwidth: '100%',
      showItem: false,
      rowData: null
    }
  },
  methods: {
    show () {
      this.showItem = this.showItem ? false : true
    },
    selected (row) {
      this.showItem = true
      this.barwidth = '60%'
      this.rowData = row.val
      this.hidden = false
      console.log('2.现在的状态是:' + this.hidden)
    },

    close () {
      this.showItem = false
      this.barwidth = '100%'
      this.hidden = true
      this.rowData = null
    }
  }
}

</script>

