<template>
  <div class=" layout-no-cols right-list-toolbar right-list-panel-card">

    <el-toolbar>
      <el-button @click="addExtendModel" priv="ContentCore.ExtendModelMenu.Add"><i class="fa fa-plus"></i>新建</el-button>
    </el-toolbar>

    <el-list-view ref="extendModels" :data="extendModels" data-read-url="/ui/contentextends">
      <template slot-scope="item">
        <div class="panel-card">
          <el-row>
            <span class="f16 bold">{{ item.label }}</span>
          </el-row>

          <div class="card-content">
            <el-table :data="item.children">
              <el-table-column prop="name" label="名称">
                <template slot-scope="scope">
                  <a href="javascript:void(0)" @click.stop="edit(scope.row)">{{scope.row.name}}</a>
                </template>
              </el-table-column>
              <el-table-column prop="code" label="代码"></el-table-column>
              <el-table-column label="操作" width="120" align="right">
                <template slot-scope="scope">
                  <el-button type="text" @click.stop="addExtendModel(scope.row)" priv="ContentCore.ExtendModelMenu.Add" title="类似创建">
                    <i class="fa fa-plus f16" aria-hidden="true"></i></el-button>
                  <el-button type="text" @click.stop="edit(scope.row)" title="编辑" priv="ContentCore.ExtendModelMenu.Save">
                    <i class="fa fa-edit f16" aria-hidden="true"></i></el-button>
                  <el-button type="text" @click.stop="del(scope.row.ID)" title="删除" priv="ContentCore.ExtendModelMenu.Delete">
                    <i class="fa fa-remove f16" aria-hidden="true"></i></el-button>
                </template>
              </el-table-column>
            </el-table>
          </div>
        </div>
      </template>
    </el-list-view>
  </div>
</template>
<script>
import util from '@src/common/util.js'
export default {
  components: {
  },

  data() {
    return {
      extendModels: []
    }
  },

  methods: {
    // 新建扩展模型
    addExtendModel(item) {
      if (item.ID) {
        // 类似创建
        this.$router.push({path: `/settings/extendModel/${item.ID}`})
      } else {
        this.$router.push({path: '/settings/extendModel/new'})
      }
    },

    edit(item) {
      this.$router.push({path: `/settings/extendModel/${item.ID}/info`})
    },

    async del(id) {
      try {
        await this.$confirm('确定删除吗？删除后无法恢复。是否继续删除？', '删除确认', {
          confirmButtonText: '确定',
          cancelButtonText: '取消',
          type: 'warning'
        })
        let resp = await axios.delete(`/ui/contentextends/${id}`)
        util.showResponseMessage(resp.data)
        if (resp.data.status === 1) {
          this.$refs.extendModels.getData()
        }
      } catch (e) {
        console.error(e || 'error')
        util.showErrorMessageBox(e.message || '操作失败！')
      }
    }
  }
}
</script>
<style scoped>
.bold{
  font-weight: bold;
}
</style>
