<template>
  <div>
    <a-modal
      v-model="isShow"
      title="操作干预"
      :confirm-loading="confirmLoading"
      :destroy-on-close="true"
      :modal-props="{ width: 800 }"
      @ok="handleOk"
      @cancel="handleCancel"
    >
      <a-form-model :model="interForm" :label-col="{ span: 7 }" :wrapper-col="{ span: 15 }">
        <a-form-model-item label="当前处理环节">
          <a-select v-model="interForm.begin">
            <a-select-option :value="interForm.begin">
              {{ interForm.begin }}
            </a-select-option>
          </a-select>
        </a-form-model-item>
        <a-form-model-item label="调整后处理环节" required>
          <sd-select
            v-model="interForm.end"
            :options="selectData"
            @change="selectChanged"
          ></sd-select>
        </a-form-model-item>
        <a-form-model-item label="调整后操作" required>
          <sd-select v-model="interForm.action" :options="operationData"></sd-select>
        </a-form-model-item>
        <a-form-model-item label="调整后的处理人">
          <sd-user-picker v-model="interForm.departName" :single="false" :read-only="false" />
        </a-form-model-item>
      </a-form-model>
    </a-modal>
  </div>
</template>

<script>
import WorkbenchService from '@/workbench/workbench-service'
import FlowService from '@/webflow/flow-service'
import { Message } from 'ant-design-vue'
import components from './_import-components/sd-flowdata-operation-import'

export default {
  name: 'SdFlowdataOperation',
  metaInfo: {
    title: 'SdFlowdataOperation',
  },
  components,
  props: {
    flowdata: {
      type: Object,
      default: (_) => {},
    },
    visibleInter: {
      type: Boolean,
      default: false,
    },
  },
  data() {
    return {
      interForm: {
        layout: 'inline',
        begin: '', // 当前流程
        end: '', // 结束流程
        action: '', // 调整到的操作
        departName: [], // 流程处理人
        title: '',
      },
      confirmLoading: false,
      isShow: this.visibleInter,
      selectData: [],
      operationData: [],
      peopleFlag: true,
    }
  },
  created() {
    this.getInterveneData()
  },
  methods: {
    getInterveneData() {
      this.interForm.begin =
        this.flowdata.processActiveLogInfo.length > 0
          ? this.flowdata.processActiveLogInfo[0].stepName
          : '已办结' // 当前流程步骤名
      this.interForm.departName = []
      FlowService.getInterveneSteps(this.flowdata).then((res) => {
        const extraFinish = res.datas.filter(function(itemData) {
          return itemData.name !== '结束'
        })
        this.selectData = extraFinish.map((val) => {
          return {
            id: val.stepId,
            name: val.name,
            processId: val.processId,
          }
        })
      })
    },
    handleOk() {
      if (this.interForm.end === '') {
        Message.warn({ content: '请选择调整后流程' })
        return
      }
      if (this.interForm?.departName.length === 0 && this.peopleFlag) {
        Message.warn({ content: '请选择调整后处理人' })
        return
      }
      if (this.interForm.action === '') {
        Message.warn({ content: '调整后的操作不能为空' })
        return
      }
      const handleParams = {
        activeStepId: this.flowdata.activeStepId === null ? 0 : this.flowdata.activeStepId, // 当前的步骤Id 如果无值则为0
        instId: this.flowdata.instId, // 当前流程Id
        stepId: this.interForm.end[0].id, // 目的流程id
        operators: this.interForm.departName ? this.interForm.departName : [],
        actionId: this.interForm.action === '' ? 0 : this.interForm.action[0].id,
        flowCallbackBeanName: 'subflowDataBinderCallback',
        thirdBean: {
          title: '',
          businessTypeId: '',
          businessTypeName: '',
        },
      }
      this.flowdata.processFormData.processFormPropertyValues.forEach((item) => {
        if (item.name === 'title') {
          handleParams.thirdBean.title = item.value
        }
        if (item.name === 'businessTypeId') {
          handleParams.thirdBean.businessTypeId = item.value
        }
        if (item.name === 'businessTypeName') {
          handleParams.thirdBean.businessTypeName = item.value
        }
      })
      this.$emit('interHandleOk', handleParams)
    },
    handleCancel() {
      this.$emit('interHandleCancle', '')
    },
    // 获取流程实例的当前活动环节信息
    selectChanged(item) {
      const interParams = {
        processId: item[0].processId,
        stepId: item[0].id,
      }
      WorkbenchService.toActions(interParams).then((data) => {
        this.operationData = data.datas
      })
      if (item[0].name === '结束') {
        this.peopleFlag = false
      } else {
        this.peopleFlag = true
      }
    },
  },
}
</script>

<style module lang="scss">
@use '@/common/design' as *;
</style>
