<template>
  <Node
    :title="config.nodeName"
    :show-error="showError"
    :content="content"
    :error-info="errorInfo"
    placeholder="请设置审批人"
    :header-bgc="headerBgc"
    header-icon="x-icon-seal"
    @insertNode="handleInsertNode"
    @selected="onSelectedNode"
    @delNode="handleDelNode"
  />
</template>

<script>
import Node from './Node.vue'
import { mapState } from 'vuex'
//审批节点
export default {
  name: 'ApprovalNode',
  components: { Node },
  props: {
    config: {
      type: Object,
      default: () => ({})
    }
  },
  data () {
    return {
      showError: false,
      errorInfo: ''
    }
  },
  computed: {
    ...mapState({
      workflowStore: state => state.workflow
    }),
    headerBgc () {
      if (this.workflowStore.diagramMode === 'viewer') {
        return this.config.headerBgc
      }
      return '#ff943e'
    },
    content () {
      const config = this.config
      const assignees = config.nodeAssigneeList || []
      const getNames = () => assignees.map(org => org.name).join('、')

      switch (config.setType) {
        case 1: // 指定成员
        case 8: // 指定候选
          return assignees.length ? getNames() : '请指定审批人'
        case 3: // 角色
          return assignees.length ? `角色：${getNames()}` : '请指定角色'
        case 7: // 部门
          return assignees.length ? `部门：${getNames()}` : '请指定部门'
        case 2:
          return '主管审批'
        case 4:
          return '发起人自选'
        case 5:
          return '发起人自己'
        case 6:
          return '连续多级主管'
        default:
          return '未知设置项'
      }
    }
  },
  methods: {
    /**
     * 根据审批类型校验是否配置了人员列表
     * @param {number} validationType
     * @param {Array} err
     * @returns {boolean}
     */
    checkError (validationType, err) {
      switch (validationType) {
        case 1: // 指定成员
        case 3: // 角色
        case 7: // 部门
        case 8: // 指定候选
          if (this.config.nodeAssigneeList && this.config.nodeAssigneeList.length > 0) {
            return true
          }
          this.errorInfo = '请指定审批人员'
          err.push(`${this.config.nodeName} 未指定审批人员`)
          return false
        case 2: // 主管
        case 4: // 发起人自选
        case 5: // 发起人自己
        case 6: // 连续多级主管
          return true
        default:
          return false
      }
    },

    /**
     * 外部调用的校验方法
     * @param {Array} err
     * @returns {boolean} - 是否有错误（true 表示出错）
     */
    validate (err) {
      try {
        this.showError = !this.checkError(this.config.setType, err)
        return this.showError
      } catch (e) {
        return true
      }
    },
    onSelectedNode() {
      this.$emit('selected');
    },
    handleInsertNode(type) {
      this.$emit('insertNode', type)
    },
    handleDelNode() {
      this.$emit('delNode')
    }
  }
}
</script>

<style scoped>
/* 样式根据需要补充 */
</style>
