<!--
 * @Author: nxy
 * @Date: 2024-08-07 14:31:29
-->
<template>
  <a-modal
    :width="750"
    :maskClosable="false"
    :visible="visible"
    :confirm-loading="loading"
    :forceRender="true"
    title="添加抄送人"
    :body-style="{ paddingBottom: '8px' }"
    @update:visible="updateVisible"
    @ok="save"
    class="fix-modal"
    @close="updateVisible(false)"
  >
    <a-form ref="formRef" :model="form" :label-col="{ md: { span: 3 }, sm: { span: 24 } }">
      <a-form-item
        label="选择抄送人："
        name="copyToUserList"
        :rules="{
          required: props.taskId ? true : false,
          type: 'array',
          message: '请选择抄送人'
        }"
      >
        <FormSelectUser :multiple="true" v-model:value="form.copyToUserList" width="500px" :isJson="false" />
      </a-form-item>
      <a-form-item label="审批意见:" name="approvalComments" v-if="props.taskId">
        <a-textarea v-model:value="form.approvalComments" placeholder="请输入审批意见" :rows="4" />
      </a-form-item>
    </a-form>
  </a-modal>
</template>

<script setup name="FlowAddCopyUser">
import { onMounted, ref, provide } from 'vue';
import { message } from 'ant-design-vue/es';
import { deepClone } from '@/utils/common/util';
import { FlowTaskApi } from '../../list/api/FlowTaskApi';
import FormSelectUser from '../../../../../form/design/element/components/select-user.vue';

const props = defineProps({
  visible: Boolean,
  // 抄送人列表
  copyToUserList: {
    type: Array,
    default: []
  },
  taskId: {
    type: String,
    default: ''
  }
});

const emits = defineEmits(['done', 'update:visible']);

const loading = ref(false);

const formRef = ref(null);

// 表单数据
const form = ref({
  copyToUserList: []
});

provide('formRef', formRef);

onMounted(() => {
  form.value.copyToUserList = deepClone(props.copyToUserList);
});

// 更改弹框或抽屉状态
const updateVisible = value => {
  emits('update:visible', value);
};

// 保存
const save = async () => {
  if (props.taskId) {
    await formRef.value.validate();
    form.value.taskId = props.taskId;
    form.value.copyToUserIdList = form.value.copyToUserList.map(item => item.id);
    FlowTaskApi.copyTo(form.value).then(res => {
      message.success(res.message);
      emits('done');
      updateVisible(false);
    });
  } else {
    emits('done', form.value.copyToUserList);
    updateVisible(false);
  }
};
</script>

<style></style>
