<template>
  <div id="deviceManagement" class="flex-row">
    <div :class="{'basic-main': !isEdit,'binary-left': isEdit}">
      <device-list v-ref:list @select-changed="edit"></device-list>
    </div>
    <div class="binary-right" style="overflow-y: scroll" v-if="isEdit">
      <device-edit @close="refresh" v-ref:edit :data="row"></device-edit>
    </div>
  </div>
</template>
<script>
  export default {
    title: '设备管理',
    data () {
      return {
        isEdit: false,
        row: null
      }
    },
    ready () {
    },
    methods: {
      edit (row) {
        this.row = null
        this.isEdit = false
        this.$nextTick(() => {
          this.isEdit = true
          if (row) {
            this.row = row.val
          }
        })
      },
      refresh () {
        this.isEdit = false
        this.$refs.list.search()
      }
    },
    events: {

    }
  }
</script>
<style>

</style>
