<template>
  <div class="layout-no-cols right-list-toolbar">
    <el-toolbar>
      <el-button @click="addClick" priv="Platform.Branch.Add" theme="flat"><i class="fa fa-plus"></i>新建</el-button>
      <!-- <el-button :disabled="selectedRows.length !== 1" @click="editClick" priv="Platform.Branch.Edit"><i class="fa fa-edit"></i>编辑</el-button>
      <el-button :disabled="selectedRows.length === 0" @click="deleteClick" priv="Platform.Branch.Delete"><i class="fa fa-remove"></i>删除</el-button>
      <el-button :disabled="selectedRows.length !== 1" @click="setPermissionsClick" priv="Platform.Branch.SetPrivRange"><i class="fa fa-cog"></i>设置权限范围</el-button> -->
    </el-toolbar>

    <div v-loading="dataLoading">

      <tree-table :data="branch" :expanded-level="branchLevel" row-key="branchCode">
        <tree-table-column prop="name" label="名称">
          <template slot-scope="scope">
            <a class="list-card-title" @click.stop="editClick(scope.row)">{{scope.row.name}}</a>
          </template>
        </tree-table-column>
        <el-table-column prop="branchCode" label="编号">
        </el-table-column>
        <el-table-column label="机构主管">
          <template slot-scope="{ row, $index }">
            {{branchManagers(row.managers)}}
          </template>
        </el-table-column>
        <el-table-column prop="phone" label="电话">
        </el-table-column>
        <el-table-column prop="fax" label="传真">
        </el-table-column>
        <el-table-column label="操作" width="120" align="right">
          <template slot-scope="scope">
            <el-button @click.stop="editClick(scope.row)" type="text" title="编辑" priv="Platform.Branch.Delete" class="table-operate-icon">
              <i class="fa fa-edit f16"></i>
            </el-button>
            <el-button @click.stop="deleteClick(scope.row)" type="text" priv="Platform.Branch.Delete" title="删除" class="table-operate-icon">
              <i class="fa fa-remove f16"></i>
            </el-button>
          </template>
        </el-table-column>
      </tree-table>
    </div>
  </div>
</template>

<script>
import TreeTable from '@src/components/treeTable/TreeTable.vue'
import TreeTableColumn from '@src/components/treeTable/TreeTableColumn.vue'
import util from '@src/common/util.js'
export default {
  components: {
    'tree-table': TreeTable,
    'tree-table-column': TreeTableColumn
  },
  data() {
    return {
      branch: [],
      dataLoading: false,
      selectedRows: [],
      deleteLoading: false,
      confirmLoading: false,
      treeItemsOptions: {
        children: 'children',
        label: 'name',
        key: 'branchInnerCode'
      },
      branchLevel: 2
    }
  },
  methods: {
    branchManagers (managers) {
      let names = []
      managers.forEach(val => {
        names.push(val.realName)
      })
      return names.join('，')
    },
    onSelectionChange(selection) {
      this.selectedRows = selection
    },
    editClick(row) {
      if (!row || !row.branchInnerCode) {
        return
      }
      this.$router.push({path: `/platform/branch/${row.branchInnerCode}`, query: {parentId: row.parentInnerCode}})
    },
    addClick() {
      this.$router.push({path: '/platform/branch/new'})
    },
    async deleteClick(data) {
      let isHasAdmin = (data.treeLevel === 1) || this.selectedRows.find(val => val.treeLevel === 1)
      if (isHasAdmin) {
        this.$notify({
          title: '不能删除',
          message: '不能删除，根机构!',
          type: 'warning',
          duration: 2000
        })
        return
      }
      try {
        await this.$confirm('确定删除吗，删除后无法恢复。是否继续删除？', '删除确认', {
          confirmButtonText: '确定',
          cancelButtonText: '取消',
          type: 'warning'
        })
      } catch (e) {
        return
      }
      let rowIds = []
      this.selectedRows.forEach(function(row) {
        rowIds.push(row.branchInnerCode)
      })
      rowIds = data.branchInnerCode ? [data.branchInnerCode] : rowIds
      if (!rowIds.length) {
        return
      }
      let res = await axios.delete('/ui/branches/' + rowIds.join(','))
      util.showResponseMessage(res.data)
      if (res.data.status === 1) {
        let res
        try {
          res = await axios.get('/ui/branches')
        } catch (e) {
          this.dataLoading = false
          return
        }
        this.dataLoading = false
        this.branch = res.data.data
      }
    },
    async lodaBranches() {
      this.dataLoading = true
      let userPreferences = JSON.parse(localStorage.userPreferences)
      this.branchLevel = userPreferences.branchListTreeLevel || 2
      let res = ''
      try {
        res = await axios.get('/ui/branches')
      } catch (e) {
        this.dataLoading = false
        return
      }
      this.dataLoading = false
      this.branch = res.data.data
    }
  },
  created() {
    this.lodaBranches()
  }
}
</script>
