<template>
  <div class="app-container">
    <div class="box-container">
      <div class="contain-title">内容草稿箱列表</div>
    </div>
    <div class="content-container">
      <div class="contain-select">
        <span>栏目分类：</span>
        <el-select v-model="selectMode" placeholder="选择分类" @change="change">
          <el-option label="全部栏目" value=""></el-option>
          <el-option label="平台新闻" value="1"></el-option>
          <el-option label="采访专栏" value="2"></el-option>
          <el-option label="政策法规" value="3"></el-option>
          <el-option label="通知公告" value="4"></el-option>
        </el-select>
      </div>
      <complex-table :tableData="tableData" :tableItem="tableItem" :operatingList='operatingList' :total='total'
        v-on:deleteFun="deleteFun" :jump="'content'" v-on:current="current" v-on:edit="edit"></complex-table>
    </div>
  </div>
</template>

<script>
  import complexTable from '@/components/complexTable'
  import { pageInquireUrl, deleteUrl, inquireContentUrl } from '@/api/content'
  import { parseTime, type } from '@/utils/index'
  import ret from '@/utils/comTable'
  import cacheModule from '@/utils/queryName'
  export default {
    data() {
      return {
        selectMode: '',
        info: {
          title: '',
          catalog: '',
          published: 0,
          pageSize: 20,
          pageNo: 1
        },
        operatingList: [ // 在子组件中遍历事件
          {
            text: '编辑',
            event: 'edit',
            icon: 'primary'
          },
          {
            text: '删除',
            event: 'deleteFun',
            icon: 'danger'
          }
        ],
        tableData: [], //  每一页的存储的数据
        total: 0, //  页码总数
        tableItem: [ // 表头信息
          {
            prop: 'title',
            tit: '标题',
            active: 'active' // 点击加颜色，加此选项
          },
          {
            prop: 'catalog',
            tit: '栏目分类'
          },
          {
            prop: 'modifier',
            tit: '最后修改人',
            width: '160'
          },
          {
            prop: 'modifyTime',
            tit: '最后修改时间',
            width: '160'
          },
          {
            operate: 'edit',
            width: '200'
          }
        ]
      }
    },
    created() {
      this.draftList()
    },
    components: {
      complexTable //  表子页面
    },
    methods: {
      change(value) {
        this.info.catalog = value
        this.draftList()
      },
      draftList() {
        this.$http.get(pageInquireUrl, this.info, (response) => { //  拉去草稿信息列表，tableData存每一页的信息
          if (response.success && response.data) {
            const res = response.data
            const epData = res.data
            let j = 0
            for (let i = 0; i < epData.length; i++) {
              j++
              epData[i].modifyTime = parseTime(epData[i].modifyTime).substr(0, 16)
              epData[i].catalog = type[epData[i].catalog]
              cacheModule.Judge(epData[i].modifier, info => {
                j--
                epData[i].modifier = info.name
                if (j === 0) {
                  this.total = res.total
                  if (epData.length === 20) {
                    this.tableData = epData
                  } else {
                    const array = epData
                    if (epData.length !== 0) {
                      ret.gapFilling(array)
                    }
                    this.tableData = array
                  }
                }
              })
            }
            if (epData.length === 0) {
              this.total = 0
              this.tableData = []
            }
          } else {
            this.total = 0
            this.tableData = []
          }
        })
      },
      edit(obj) { //  编辑草稿信息
        this.$router.push({ path: 'content/publish', query: { id: obj.id }})
      },
      deleteFun(obj) { //  点击删除单个草稿内容信息
        this.$confirm('确定删除该条内容？', '提示', {
          confirmButtonText: '确定',
          cancelButtonText: '取消',
          type: 'warning',
          center: true
        }).then(() => {
          this.$http.get(deleteUrl, { id: obj.id }, response => {
            if (response.success) {
              if (response.data) {
                this.draftList()
                this.$message({
                  message: '删除成功',
                  type: 'success'
                })
              } else {
                this.$http.get(inquireContentUrl, { id: this.id }, (response) => {
                  if (response.success && response.data) {
                    const info = response.data
                    if (!info.actived) {
                      this.$message({
                        message: '该内容已被删除',
                        type: 'warning'
                      })
                    }
                  }
                })
              }
            }
          })
        }).catch(() => {
        })
      },
      jump(id) { // 点击超练级跳转
        this.$router.push({ path: 'content/publish', query: { id }})
      },
      current(val) { // 点击页码
        this.info.pageNo = val
        this.draftList()
      }
    }
  }
</script>