<template>
  <div>
    <el-dialog :title="title" :visible.sync="isShow" :append-to-body="true" @open="beforeDialogOpen" class="catalog-export-dlg">
      <el-form ref="exportCatalogForm" label-width="20%">
        <el-form-item label="文档状态：">
          <el-checkbox-group v-model="checkedContentStatus">
            <el-checkbox v-for="val in contentStatus" :label="val.value" :key="val.value">{{val.label}}</el-checkbox>
          </el-checkbox-group>
        </el-form-item>
        <el-form-item label="分类属性：">
          <el-checkbox-group v-model="checkedAttribute">
            <el-checkbox v-for="val in contentAttribute" :label="val.value" :key="val.value">{{val.label}}</el-checkbox>
          </el-checkbox-group>
        </el-form-item>
      </el-form>
      <div slot="footer">
        <el-button @click="isShow = false">取 消</el-button>
        <el-button type="primary" v-loading="submitLoading" @click="confirm">确 定</el-button>
      </div>
    </el-dialog>
  </div>
</template>
<script>
import util from '@src/common/util.js'
export default {
  props: {
    show: Boolean,
    title: String,
    catalogId: [Number, String],
    contentType: String
  },
  data() {
    return {
      submitLoading: false,
      checkedContentStatus: [], //  选中文档状态
      checkedAttribute: [], //  选中分类属性
      contentStatus: [], //  文档状态
      contentAttribute: [] //  分类属性
    }
  },
  computed: {
    isShow: {
      get() {
        return this.show
      },
      set(val) {
        this.$emit('update:show', val)
      }
    }
  },
  methods: {
    beforeDialogOpen() {
      this.checkedContentStatus = []
      this.checkedAttribute = []
      this.loadContentStatus()
      this.loadContentAttribute()
    },
    // 提交导出
    async confirm() {
      let opts = {
        catalogID: this.catalogId,
        contentType: this.contentType,
        attribute: this.checkedAttribute.join(),
        contentStatus: this.checkedContentStatus.join()
      }
      this.submitLoading = true
      try {
        let res = await axios.get('/ui/catalogs/export', { params: opts })
        this.submitLoading = false
        if (res.data.status === 1) {
          this.$emit('update:show', false)
          await util.showProgress(res.data.taskID, `正在${this.title}`)
          window.location.href = `ui/catalogs/downloads?fileName=${res.data.path}`
        } else {
          util.showMessage(res)
        }
      } catch (e) {
        this.submitLoading = false
        // util.showErrorNotification(e)
      }
    },
    // 加载文档状态
    async loadContentStatus() {
      let code = 'ContentStatus'
      let res = await axios.get(`/ui/platform/codes/${code}`)
      this.contentStatus = res.data.data
    },
    // 加载分类属性
    async loadContentAttribute() {
      let code = 'ContentAttribute'
      let res = await axios.get(`/ui/platform/codes/${code}`)
      this.contentAttribute = res.data.data
    }
  }
}
</script>
<style>
.catalog-export-dlg .el-dialog{
  width: 700px;
}
@media (max-width:480px){
  .catalog-export-dlg .el-dialog{
    width: 96%;
  }
}
</style>
