<template>
  <BasicModal v-bind="$attrs" @register="register" title="邮件发送参数" @ok="handleOK"
              width="700px">
    <div class="pt-6px pr-6px">
      <BasicForm @register="registerForm"/>
    </div>
  </BasicModal>
</template>
<script lang="ts">
import { defineComponent,h } from 'vue';
import { BasicModal, useModalInner } from '/@/components/Modal';
import { BasicForm, FormSchema, useForm } from '/@/components/Form/index';
import {useMessage} from "/@/hooks/web/useMessage";
import { Tinymce } from '/@/components/Tinymce';
import {sendEmail} from "/@/api/message/template";
const schemas: FormSchema[] = [
  {
    field: 'id',
    component: 'Input',
    label: 'id',
    show:false
  },
  {
    field: 'templatePurpose',
    label: '用途',
    component:'Input',
    show:false,
  },
  {
    field: 'messageType',
    component: 'Input',
    label: 'messageType',
    show:false
  },
  {
    field: 'subject',
    component: 'Input',
    label: '邮件主题',
    required: true,
    colProps: {
      span: 12,
    },
  },
  {
    field: 'to',
    component: 'Input',
    label: '主送',
    required: true,
    colProps: {
      span: 12,
    },
  },
  {
    field: 'cc',
    component: 'Input',
    label: '抄送',
    colProps: {
      span: 12,
    },
  },
  {
    field: 'bcc',
    component: 'Input',
    label: '密送',
    colProps: {
      span: 12,
    },
  },
  {
    field: 'body',
    component: 'Input',
    label: '邮件内容',
    rules: [{ required: true }],
    render: ({ model, field }) => {
      return h(Tinymce, {
        value: model[field],
        onChange: (value: string) => {
          model[field] = value;
        },
      });
    },
  },
];
export default defineComponent({
  components: { BasicModal, BasicForm},
  setup() {
    const {createMessage} = useMessage();
    const [registerForm,{validate,resetFields,setFieldsValue},] = useForm({
      labelWidth: 70,
      schemas,
      showActionButtonGroup: false,
      actionColOptions: {
        span: 24,
      },
    });
    const [register,{closeModal}] = useModalInner(async(data) => {
      await resetFields();
      await setFieldsValue({
        ...data.record,
      });
    });

    async function handleOK() {
      const values = await validate();
      const to = Reflect.get(values,"to").split(",");
      const cc = Reflect.get(values,"cc");
      const bcc = Reflect.get(values,"bcc");
      if(typeof (cc) != "undefined"){
        cc.split(",");
        Reflect.set(values,"cc",cc)
      }
      if(typeof (bcc) != "undefined"){
        bcc.split(",");
        Reflect.set(values,"bcc",bcc)
      }
      Reflect.set(values,"to",to)
      Reflect.set(values,"emailFormatEnum","HTML")
      await sendEmail(values);
      console.log(values,"values")
      closeModal();
      createMessage.success("发送成功")
    }

    return { register, schemas, registerForm, handleOK };
  },
});
</script>