<template>
  <!-- 传阅 -->
  <div>
    <ApprovalDialog
      ref="approvalDialog"
      alias="communication"
      :dialog-title="$t('taskToCommu.CommunicationSetting')"
      :user-label="$t('taskToCommu.CommunicationPersonnel')"
      :opinion-label="$t('taskToCommu.CommunicationContent')"
      :is-show-user-selector="true"
      :is-get-approval-btn="isGetApprovalBtn"
      @submit-form="handleSubmitForm"
    />
  </div>
</template>

<script>
  import ApprovalDialog from './ApprovalDialog'
  import { communicate } from '@/api/process'
  import { mapState } from 'vuex'
  export default {
    name: 'Communication',
    components: {
      ApprovalDialog,
    },
    props: {
      defId: {
        type: String,
        default: '',
      },
      instId: {
        type: String,
        default: '',
      },
      nodeId: {
        type: String,
        default: '',
      },
      noticeId: {
        type: String,
        default: '',
      },
      isGetApprovalBtn: {
        type: Boolean,
        default: false,
      },
    },
    data() {
      return {}
    },
    computed: {
      ...mapState('matter', ['currentShowDialogAlias']),
    },
    watch: {
      currentShowDialogAlias(val) {
        if (val && val !== 'communication') {
          this.$refs.approvalDialog.handleClose('autoClose')
        }
      },
    },
    methods: {
      handleOpen() {
        this.$refs.approvalDialog.openDialog()
      },
      handleSubmitForm(formData, cb) {
        let { userId, files, opinion } = formData
        if (opinion.length > 500) {
          opinion = opinion.substring(0, 500)
        }
        const data = {
          files,
          userId,
          opinion,
          defId: this.defId,
          instId: this.instId,
          nodeId: this.nodeId,
          parentId: this.noticeId,
        }
        communicate(data, (res) => {
          if (res.state) {
            cb?.()
            this.$emit('submit-after')
            this.$message.success(res.message)
          } else {
            cb?.()
            this.$message.info(res.message)
          }
        })
      },
    },
  }
</script>

<style lang="scss" scoped></style>
