<template>
  <div>
    <div class="container normal-panel normal-margin">
      <add style="margin-right:10px;" v-if="tool.checkAuth($route.name,'insert')" @onSuccess="onSuccess"></add>
    </div>
    <list v-if="tool.checkAuth($route.name,'read')" ref="list" @handleSelectionChange="handleSelectionChange">
      <template v-slot:detail="scope">
        <div class="inline-16">
          <el-button size="mini" type="text" @click="$router.push({path:'/account_details',query:{id:scope.data.userid}})">查 看</el-button>
        </div>
      </template>
      <template v-slot:del="scope">
        <account-del v-if="tool.checkAuth($route.name,'delete')" :data="scope.data" @onSuccess="onSuccess" :type="'text'"></account-del>
      </template>
      <template v-slot:edit="scope">
        <account-edit v-if="tool.checkAuth($route.name,'update')" :data="scope.data" @onSuccess="onSuccess" :type="'text'"></account-edit>
      </template>
      <template v-slot:use="scope">
        <account-use v-if="tool.checkAuth($route.name,'use') && scope.data.status === 'INACTIVE'" :data="scope.data" @onSuccess="onSuccess" :type="'text'"></account-use>
        <account-unuse v-if="tool.checkAuth($route.name,'use') && scope.data.status === 'ACTIVE'" :data="scope.data" @onSuccess="onSuccess" :type="'text'"></account-unuse>
      </template>
    </list>
  </div>
</template>

<script>
import list from './modules/list.vue'
import add from './modules/account_add.vue'
import accountDel from './modules/account_delete.vue'
import accountEdit from './modules/account_edit.vue'
import accountUse from './modules/useAccdount.vue'
import accountUnuse from './modules/unuseAccount.vue'

import role from './modules/set_account_role.vue'
import accountDetail from './modules/account_detail.vue'

export default {
  components:{
    list,
    add,
    accountDel,
    accountEdit,
    accountDetail,
    accountUse,
    accountUnuse,
    role
  },
  data () {
    return {
      accounts:[]
    }
  },
  methods:{
    onSuccess () {
      this.$refs.list.listData()
    },
    handleSelectionChange (arr) {
      console.log(arr)
      this.accounts = arr
    },
    
  }
}

</script>
<style>
</style>
<style scoped>
.borderRight{
  border-right: 1px solid #ccc;
}
</style>