<template>
  <div>
      <div class="panel-fieldset">
        <h4 class="panel-legend">工作流设置</h4>
        <el-form-item label="流程设置">
          <el-select :disabled="catalogId===0" clearable v-model="extendsData.workflowID" placeholder="请选择" :style="{width:'150px'}">
            <el-option
              v-for="item in workflows"
              :key="item.ID"
              :label="item.name"
              :value="item.ID">
            </el-option>
          </el-select>
          <el-button :disabled="catalogId===0" @click="workflowApplyToCatalog"><i class="fa fa-cog"></i> 应用到其他栏目</el-button>
        </el-form-item>
        <el-form-item label="各机构分别审核">
          <el-switch v-model="extendsData.branchIndependenceAudit" active-value="Y" inactive-value="N" :disabled="catalogId===0"></el-switch>
        </el-form-item>
      </div>
      <el-dialog title="选择栏目" :visible.sync="isShowModal" class="catalog-list-dlg">
        <catalog-tree @callback="getCheckedData" :isNeedNode="true" :show="isShowModal" type="Link,Default"></catalog-tree>
        <span slot="footer">
          <el-button @click="isShowModal = false">取 消</el-button>
          <el-button type="primary" v-loading='submitLoading' @click="submitWorkflowApplyToCatalogHandler">确 定</el-button>
        </span>
      </el-dialog>
  </div>
</template>
<script>
import CatalogTree from '../../contentcore/components/CatalogTreeBatchSelect.vue'
import util from '@src/common/util.js'
export default {
  components: {
    'catalog-tree': CatalogTree
  },
  props: {
    extendsData: {
      type: Object,
      default: function() {
        return {
          branchIndependenceAudit: 'N', //  各机构是否分别审核
          workflowID: '' //  工作流ID
        }
      }
    },
    catalogId: [String, Number]
  },
  data() {
    return {
      workflows: [], //  工作流数组
      isShowModal: false, //  选择栏目是否显示
      submitLoading: false,
      checkedCatalogs: [] //   选中的栏目
    }
  },
  watch: {
    extendsData: function(val) {
      if (val.workflowID) {
        val.workflowID = parseInt(val.workflowID)
      }
    }
  },
  created() {
    this.loadWorkFlow()
  },
  methods: {
    // 工作流应用到其他子栏目
    workflowApplyToCatalog() {
      this.isShowModal = true
      this.checkedCatalogs = []
    },
    async loadWorkFlow() {
      let res = await axios.get('/ui/contentworkflow')
      this.workflows = res.data.data
    },
    getCheckedData(ids, nodes) {
      this.checkedCatalogs = nodes
    },
    // 提交工作流应用到其他子栏目
    async submitWorkflowApplyToCatalogHandler() {
      if (!this.checkedCatalogs || !this.checkedCatalogs.length) {
        this.dialog('请选择要应用工作流的栏目！')
        return
      }
      let catalogIDs = JSON.stringify(this.checkedCatalogs)
      this.submitLoading = true
      let opts = {
        currentCatalogID: this.catalogId,
        catalogIDs: catalogIDs,
        workflowID: this.extendsData.workflowID
      }
      try {
        let res = await axios.put('/ui/workflowlist/applytocatalog', opts)
        this.submitLoading = false
        util.showMessage(res)
        if (res.data.status === 1) {
          this.isShowModal = false
        }
      } catch (e) {
        this.submitLoading = false
        util.showErrorNotification(e)
      }
    },
    // 消息Dialog封装
    dialog(msg) {
      this.$confirm(msg, '系统提示', {
        confirmButtonText: '确定',
        showCancelButton: false,
        type: 'warning'
      })
    }
  }
}
</script>
<style scoped>

</style>
