<template>
  <div class="layout-no-cols right-list-toolbar right-list-panel-card">
    <el-toolbar>
      <el-button @click="addgatherClickHandler">
        <i class="fa fa-plus"></i>新建</el-button>
    </el-toolbar>
    <div v-loading="dataLoading">
      <el-list-view :data="gatherData" data-read-url="/ui/sitegroupgather/bindtasktree" :auto-get-data="false" ref="dataTable">
        <template slot-scope="row">
          <div class="panel-card">
            <el-row>
              <a class="list-card-title" href="javascript:void(0)" @click.stop="gotoDetailPage(row.ID)">{{row.gatherName}}</a>
            </el-row>
            <el-row>
              <el-col :span="8">
                <span>任务ID：</span>
                <em>{{row.ID}}</em>
              </el-col>
              <el-col :span="8">
                <span>任务名称：</span>
                <em>{{row.gatherName}}</em>
              </el-col>
              <el-col :span="8">
                <span>从此栏目分发：</span>
                <em>{{row.catalogName}}</em>
              </el-col>
            </el-row>
            <el-row>
              <el-col :span="8">
                <span>同步修改/删除/下线：</span>
                <em>{{row.syncArticleModify === 'Y' ? '是' : '否'}}</em>
              </el-col>
              <el-col :span="8">
                <span>初次分发后状态：</span>
                <em>{{row.afterSyncStatusName}}</em>
              </el-col>
              <el-col :span="8">
                <span>再次分发后状态：</span>
                <em>{{row.afterModifyStatusName}}</em>
              </el-col>
            </el-row>
            <el-row class="list-card-buttons">
              <el-col :span="10">
                <el-tag v-if="row.status === 'Y'" size="small">启用</el-tag>
                <el-tag v-else type="danger" size='medium'>停用</el-tag>
              </el-col>
              <el-col :span="14" class="tar">
                <el-button @click.stop="gotoDetailPage(row.ID)" type="text" title="编辑"><i class="fa fa-edit"></i>编辑</el-button>
                <el-button @click.stop="del(row.ID)" type="text" title="删除">
                  <i class="fa fa-remove"></i>删除</el-button>
              </el-col>
            </el-row>
          </div>
        </template>
      </el-list-view>
    </div>
  </div>
</template>

<script>
import util from '@src/common/util.js'

export default {
  data() {
    return {
      dataLoading: false,
      gatherData: [] // 所有任务数据
    }
  },
  mounted() {
    this.getTaskData()
  },
  methods: {
    gotoDetailPage(ID) {
      this.$router.push({path: `/datachannel/gather/${ID}`})
    },
    async getTaskData() {
      this.dataLoading = true
      await this.$refs.dataTable.getData()
      this.dataLoading = false
    },
    // 新建网站群分发
    addgatherClickHandler() {
      this.$router.push({path: `/datachannel/gather/new`})
    },
    // 删除网站群分发
    async del(ID) {
      try {
        await this.$confirm('确认删除？', '提示', {
          confirmButtonText: '确定',
          cancelButtonText: '取消',
          type: 'warning'
        })
        let res = await axios.delete(`/ui/sitegroupgather/${ID}`)
        util.showResponseMessage(res.data)
        if (res.data.status === 1) {
          this.getTaskData()
        }
      } catch (e) {
        return (e)
      }
    }
  }
}
</script>

<style scoped>
</style>
