<template>
  <!--安检综合查询主界面-->
  <div id="unit" class="flex-row" :class="{'binary':showItem}">
    <div :class="{'basic-main':!showItem,'binary-left':showItem}">
      <!--展示查询界面-->
      <check-search-user-new class="flex" :tempval="hidden" :style="style" :style2="style2" @select-changed="selected"
                         @canel-main="close" v-ref:checksearch></check-search-user-new>
    </div>
    <div class="binary-right" v-show="showItem">
      <div class="flex">
        <check-paper-list style="height: 100%" :row="rowData"></check-paper-list>
      </div>
    </div>
  </div>

</template>

<script>

export default {
  title: '用户安检情况',
  name: 'CheckPaperSearchUser',
  data() {
    return {
      style: 'col-sm-2 form-group',
      style2: 'col-sm-4 form-group',
      hidden: true,
      barwidth: '100%',
      showItem: false,
      rowData: {}
    }
  },
  methods: {
    show() {
      this.showItem = this.showItem ? false : true
    },
    selected(row) {
      this.showItem = true
      this.barwidth = '50%'
      this.rowData = row.val
      this.hidden = false
      //tag
    },

    close() {
      this.showItem = false
      this.barwidth = '100%'
      this.hidden = true
    }
  },
  watch: {
    'showItem'(val) {
      //tag
      //tag
      if (val) {
        this.style = 'col-sm-3 form-group'
        this.style2 = 'col-sm-6 form-group'
      } else {
        this.style = 'col-sm-2 form-group'
        this.style2 = 'col-sm-4 form-group'
      }
    }
  }
}

</script>

