邮件右键菜单

huangyinfeng

4 天以前 db42d08c39ae6129e2b95cd24c0d57c6769282e5

 src/views/email/Edit/index.vue

@@ -30,7 +30,7 @@
                placeholder="请选择收件人或者输入收件人邮箱"
                v-model:value="modelRef.recipients"
                :options="state.recipientsList"
                :field-names="{ label: 'email', value: 'userName' }"
                :field-names="{ label: 'email', value: 'email' }"
                :maxTagCount="4"
                @search="fetchUser"
              >
@@ -111,7 +111,7 @@
                placeholder="请选择抄送人或者输入抄送人邮箱"
                v-model:value="modelRef.ccRecipients"
                :options="state.recipientsList"
                :field-names="{ label: 'email', value: 'userName' }"
                :field-names="{ label: 'email', value: 'email' }"
                :maxTagCount="4"
              >
                <template #tagRender="{ label, closable, onClose }">
@@ -151,7 +151,7 @@
                placeholder="请选择抄送人或者输入抄送人邮箱"
                v-model:value="modelRef.bccRecipients"
                :options="state.recipientsList"
                :field-names="{ label: 'email', value: 'userName' }"
                :field-names="{ label: 'email', value: 'email' }"
                :maxTagCount="4"
              >
                <template #tagRender="{ label, closable, onClose }">
@@ -192,7 +192,7 @@
          :wrapper-col="{ span: 24 }"
          :label-col="{ span: 2 }"
        >
          <Tinymce @change="fnChangeContent"></Tinymce>
          <Tinymce v-model="modelRef.content" @change="fnChangeContent"></Tinymce>
        </a-form-item>
      </a-form>
    </a-spin>
@@ -202,7 +202,6 @@
      :selectIds="selectIds"
      :idName="idName"
      :title="selectUserTitle"
      @sudUserList="fnGetRecipientsList"
      @updateData="fnSelectUser"
    />
    <a-modal
@@ -257,7 +256,7 @@
  name: 'Edit';
  import { useDesign } from '@/hooks/web/useDesign';

  import { ref, reactive, computed } from 'vue';
  import { ref, reactive, computed, onMounted } from 'vue';
  import { useMessage } from '@/hooks/web/useMessage';
  import { Tinymce } from '@/components/Tinymce';
  import { PlusCircleOutlined } from '@ant-design/icons-vue';
@@ -293,6 +292,18 @@
      },
    ],
  });
  const TYPE = computed(() => {
    return router.currentRoute.value.query.type || 'send';
  });
  onMounted(() => {
    fnGetRecipientsList();
    if (TYPE.value === 'reply') {
      fuGetReplyEmailData();
    }
    if (TYPE.value === 'edit') {
      fuGetEditEmailData();
    }
  });
  const useForm = Form.useForm;
  const { validate, validateInfos } = useForm(modelRef, rulesRef);

@@ -318,6 +329,7 @@
    sendingMailApi,
    saveMailDraftsApi,
    emailListAPi,
    getMailInfoApi,
  } from '@/api/email/userList';
  // 定义状态管理对象
  const state = reactive({
@@ -381,9 +393,47 @@
  };

  function fnChangeContent(e) {
    modelRef.content = e.content;
    modelRef.attachmentList = e.attachmentList;
  if (!isValidEvent(e)) {
    console.error('Invalid event:', e);
    return;
  }

  console.log('Event:', e, '----------------');
  
  modelRef.content = e.content;
  modelRef.attachmentList = mergeArrayWithPrefix(fnBuildAttachmentList(e.fileUNID));
  
  console.log('Updated modelRef:', modelRef);
}

function isValidEvent(e) {
  return e && typeof e === 'object' && typeof e.content === 'string';
}

function fnBuildAttachmentList(data) {
  if (!Array.isArray(data)) {
    console.error('Invalid argument: data must be an array');
    return [];
  }

  return data.reduce((acc, item) => {
    const uuid = item?.response?.uuid;
    if (uuid) {
      acc.push(uuid);
    } else {
      console.warn('Invalid item:', item);
    }
    return acc;
  }, []);
}

function mergeArrayWithPrefix(arr) {
  if (!arr || arr.length === 0) return '';
  const [prefix] = arr[0].split(';');
  const suffixes = arr.map(item => item.split(';')[1]).filter(Boolean).join(';');
  
  return `${prefix};${suffixes}`;
}

  function fnBuildingCommitData() {
    return {
@@ -393,7 +443,7 @@
      bcc: modelRef.bccRecipients,
      subject: modelRef.subject,
      content: modelRef.content,
      attachmentList: '',
      attachmentList: modelRef.attachmentList,
      docCode: docCode.value,
    };
  }
@@ -429,7 +479,7 @@
        loading.value = false;
        if (res.code === 0) {
          createMessage.success(res.msg);
          router.push('/email/list');
          router.push('/email/index');
        }
      })
      .catch((error) => {
@@ -510,14 +560,14 @@
    }, 2000);
  };

  function fnGetRecipientsList(data) {
    state.recipientsList = data;
  function fnGetRecipientsList() {
    emailListAPi({ key: '' }).then((body) => {
      state.recipientsList = body.data;
    });
  }

  // 邮箱校验正则表达式
  const validateEmail = (email) => /^[^\s@]+@[^\s@]+\.[^\s@]+$/.test(email);
  import { debounce } from 'lodash-es';
import DragBar from '@/layouts/default/sider/DragBar.vue';
  let lastFetchId = 0;

  const fetchUser = debounce((value) => {
@@ -535,6 +585,36 @@
      state.fetching = false;
    });
  }, 300);
  // 编辑
  function fuGetEditEmailData() {
    getMailInfoApi({ docCode: router.currentRoute.value.query.docCode })
      .then((res) => {
        modelRef.sender = res.data.sender;
        modelRef.recipients = res.data.receiver;
        modelRef.subject = res.data.subject;
        modelRef.content = res.data.content;
      })
      .catch(() => {});
  }

  // 回复
  function fuGetReplyEmailData() {
    getMailInfoApi({ docCode: router.currentRoute.value.query.docCode })
      .then((res) => {
        console.log(ref.data, '---3022');
        modelRef.sender = res.data.receiver[0];
        modelRef.recipients = [res.data.sender];
        modelRef.subject = 'Re：' + res.data.subject;
        modelRef.content = setContent(res.data);
        // tableRowData.value = res.data;
      })
      .catch(() => {});
    console.log('----------------4');
  }
  const setContent = (row) => {
    const text = `<div style=\"font-size: 12px; font-family: Arial Narrow,serif; padding: 2px 0 2px 0;\">------------------&nbsp;Original&nbsp;------------------</div>\n<div style=\"font-size: 12px; background: #efefef; padding: 8px;\">\n<div><strong>From:&nbsp;</strong>&nbsp;${row.sender} &lt;<a style=\"color: #1e7bf9; text-decoration: none;\" href=\"mailto:${row.sender}\" target=\"_blank\" rel=\"noopener noreferrer\">${row.sender}</a>&gt;</div>\n<div><strong>Send time:&nbsp;</strong>&nbsp;${row.createTime}</div>\n<div><strong>To:&nbsp;</strong>&nbsp;${row.userName} &lt;<a style=\"color: #1e7bf9; text-decoration: none;\" href=\"mailto:${row.receiver}\" target=\"_blank\" rel=\"noopener noreferrer\">${row.receiver}</a>&gt;</div>\n<div><strong>Subject:&nbsp;</strong> ${row.subject}</div>\n</div>`;
    return text + row.content;
  };
</script>
<style lang="less" scoped>
  @prefix-cls: ~'@{namespace}-email';