短息和邮件发送功能页面
This commit is contained in:
zhengzhi
19
src/api/sendmail/index.ts
Normal file
19
src/api/sendmail/index.ts
Normal file
@ -0,0 +1,19 @@
|
||||
import { XjrSmsPageModel, XjrSmsPageParams, XjrSmsPageResult } from './model/SmsModel';
|
||||
import { defHttp } from '/@/utils/http/axios';
|
||||
import { ErrorMessageMode } from '/#/axios';
|
||||
|
||||
enum Api {
|
||||
sendmail = '/mail/send',
|
||||
}
|
||||
|
||||
export async function sendmail(params, mode: ErrorMessageMode = 'modal') {
|
||||
return defHttp.post<boolean>(
|
||||
{
|
||||
url: Api.sendmail,
|
||||
data:params
|
||||
},
|
||||
{
|
||||
errorMessageMode: mode,
|
||||
},
|
||||
);
|
||||
}
|
||||
19
src/api/sms/index.ts
Normal file
19
src/api/sms/index.ts
Normal file
@ -0,0 +1,19 @@
|
||||
import { XjrSmsPageModel, XjrSmsPageParams, XjrSmsPageResult } from './model/SmsModel';
|
||||
import { defHttp } from '/@/utils/http/axios';
|
||||
import { ErrorMessageMode } from '/#/axios';
|
||||
|
||||
enum Api {
|
||||
sendSms = '/sms/send',
|
||||
}
|
||||
|
||||
export async function sendSms(params, mode: ErrorMessageMode = 'modal') {
|
||||
return defHttp.get<boolean>(
|
||||
{
|
||||
url: Api.sendSms,
|
||||
params: { mobile: params.mobile, message: params.message },
|
||||
},
|
||||
{
|
||||
errorMessageMode: mode,
|
||||
},
|
||||
);
|
||||
}
|
||||
130
src/views/sendmail/index.vue
Normal file
130
src/views/sendmail/index.vue
Normal file
@ -0,0 +1,130 @@
|
||||
<template>
|
||||
<div class="p-4 bg-white h-full">
|
||||
<div class="pb-4 text-xl">{{ t('邮件发送') }}</div>
|
||||
<div class="step1-form">
|
||||
<a-form
|
||||
:key="formKey"
|
||||
:model="formState"
|
||||
name="basic"
|
||||
:label-col="{ span: 4 }"
|
||||
:wrapper-col="{ span: 20 }"
|
||||
autocomplete="off"
|
||||
@finish="onFinish"
|
||||
@finish-failed="onFinishFailed"
|
||||
>
|
||||
<div class="flex items-center header-title">
|
||||
<div class="node-icon"></div>
|
||||
<div class="text-base">{{ t('基本信息') }}</div>
|
||||
</div>
|
||||
<a-form-item
|
||||
:label="t('邮件标题')"
|
||||
name="title"
|
||||
|
||||
>
|
||||
<a-input v-model:value="formState.title" :placeholder="t('请输入邮件标题')" />
|
||||
</a-form-item>
|
||||
|
||||
<a-form-item
|
||||
:label="t('邮件内容')"
|
||||
name="plain"
|
||||
|
||||
>
|
||||
<a-input v-model:value="formState.plain" :placeholder="t('请输入邮件内容')" />
|
||||
</a-form-item>
|
||||
|
||||
<a-form-item
|
||||
:label="t('接收人姓名')"
|
||||
name="name"
|
||||
|
||||
>
|
||||
<a-input v-model:value="formState.name" :placeholder="t('请输入接收人姓名')" />
|
||||
</a-form-item>
|
||||
|
||||
<a-form-item
|
||||
:label="t('接收人邮件')"
|
||||
name="mail"
|
||||
|
||||
>
|
||||
<a-input v-model:value="formState.mail" :placeholder="t('请输入接收人邮件')" />
|
||||
</a-form-item>
|
||||
<a-form-item :wrapper-col="{ offset: 10, span: 24 }">
|
||||
<!-- <a-button type="default" html-type="reset">{{ t('重置') }}</a-button> -->
|
||||
<a-button type="primary" html-type="submit" class="ml-4">{{ t('提交') }}</a-button>
|
||||
</a-form-item>
|
||||
</a-form>
|
||||
</div>
|
||||
</div>
|
||||
</template>
|
||||
<script lang="ts" setup>
|
||||
import { onMounted, reactive, ref } from 'vue';
|
||||
|
||||
import { useI18n } from '/@/hooks/web/useI18n';
|
||||
// import { getLogoInfoToken, setLogoConfig } from '/@/api/system/login';
|
||||
import { useMessage } from '/@/hooks/web/useMessage';
|
||||
|
||||
import { sendmail } from '/@/api/sendmail';
|
||||
|
||||
const { t } = useI18n();
|
||||
const { notification } = useMessage();
|
||||
|
||||
interface FormState {
|
||||
title?: string;
|
||||
plain?: string;
|
||||
mail?: string;
|
||||
name?: string
|
||||
}
|
||||
|
||||
let formState = reactive<FormState>({});
|
||||
const formKey = ref(0);
|
||||
const id = ref();
|
||||
onMounted(() => {
|
||||
formState = {}
|
||||
});
|
||||
const onFinish = (values: any) => {
|
||||
// console.log('------>', values)
|
||||
// console.log('------>', formState)
|
||||
//let params = values;
|
||||
//params.id = id.value;
|
||||
let params = {
|
||||
title: formState.title,
|
||||
plain: formState.plain,
|
||||
to: [{
|
||||
name: formState.name,
|
||||
mail: formState.mail
|
||||
}]
|
||||
}
|
||||
sendmail(params).then((res) => {
|
||||
if (res) {
|
||||
notification.success({
|
||||
message: t('提示'),
|
||||
description: t('修改成功'),
|
||||
});
|
||||
} else {
|
||||
notification.success({
|
||||
message: t('提示'),
|
||||
description: t('修改失败'),
|
||||
});
|
||||
}
|
||||
});
|
||||
};
|
||||
|
||||
const onFinishFailed = (errorInfo: any) => {
|
||||
console.log('Failed:', errorInfo);
|
||||
};
|
||||
</script>
|
||||
<style>
|
||||
.header-title {
|
||||
height: 40px;
|
||||
font-size: 16px;
|
||||
color: #333;
|
||||
border-bottom: 1px solid #f0f0f0;
|
||||
margin-bottom: 12px;
|
||||
}
|
||||
|
||||
.node-icon {
|
||||
width: 6px;
|
||||
height: 18px;
|
||||
background-color: #5e95ff;
|
||||
margin-right: 8px;
|
||||
}
|
||||
</style>
|
||||
106
src/views/sms/index.vue
Normal file
106
src/views/sms/index.vue
Normal file
@ -0,0 +1,106 @@
|
||||
<template>
|
||||
<div class="p-4 bg-white h-full">
|
||||
<div class="pb-4 text-xl">{{ t('短信发送') }}</div>
|
||||
<div class="step1-form">
|
||||
<a-form
|
||||
:key="formKey"
|
||||
:model="formState"
|
||||
name="basic"
|
||||
:label-col="{ span: 4 }"
|
||||
:wrapper-col="{ span: 20 }"
|
||||
autocomplete="off"
|
||||
@finish="onFinish"
|
||||
@finish-failed="onFinishFailed"
|
||||
>
|
||||
<div class="flex items-center header-title">
|
||||
<div class="node-icon"></div>
|
||||
<div class="text-base">{{ t('基本信息') }}</div>
|
||||
</div>
|
||||
<a-form-item
|
||||
:label="t('收件人手机号')"
|
||||
name="mobile"
|
||||
|
||||
>
|
||||
<a-input v-model:value="formState.mobile" :placeholder="t('请输入收件人手机号')" />
|
||||
</a-form-item>
|
||||
|
||||
<a-form-item
|
||||
:label="t('短信内容')"
|
||||
name="message"
|
||||
|
||||
>
|
||||
<a-input v-model:value="formState.message" :placeholder="t('请输入短信内容')" />
|
||||
</a-form-item>
|
||||
|
||||
|
||||
<a-form-item :wrapper-col="{ offset: 10, span: 24 }">
|
||||
<!-- <a-button type="default" html-type="reset">{{ t('重置') }}</a-button> -->
|
||||
<a-button type="primary" html-type="submit" class="ml-4">{{ t('提交') }}</a-button>
|
||||
</a-form-item>
|
||||
</a-form>
|
||||
</div>
|
||||
</div>
|
||||
</template>
|
||||
<script lang="ts" setup>
|
||||
import { onMounted, reactive, ref } from 'vue';
|
||||
|
||||
import { useI18n } from '/@/hooks/web/useI18n';
|
||||
// import { getLogoInfoToken, setLogoConfig } from '/@/api/system/login';
|
||||
import { useMessage } from '/@/hooks/web/useMessage';
|
||||
|
||||
import { sendSms } from '/@/api/sms';
|
||||
|
||||
const { t } = useI18n();
|
||||
const { notification } = useMessage();
|
||||
|
||||
interface FormState {
|
||||
mobile?: string;
|
||||
message?: string;
|
||||
}
|
||||
|
||||
let formState = reactive<FormState>({});
|
||||
const formKey = ref(0);
|
||||
const id = ref();
|
||||
onMounted(() => {
|
||||
formState = {}
|
||||
});
|
||||
const onFinish = (values: any) => {
|
||||
// console.log('------>', values)
|
||||
// console.log('------>', formState)
|
||||
let params = values;
|
||||
params.id = id.value;
|
||||
sendSms(formState).then((res) => {
|
||||
if (res) {
|
||||
notification.success({
|
||||
message: t('提示'),
|
||||
description: t('修改成功'),
|
||||
});
|
||||
} else {
|
||||
notification.success({
|
||||
message: t('提示'),
|
||||
description: t('修改失败'),
|
||||
});
|
||||
}
|
||||
});
|
||||
};
|
||||
|
||||
const onFinishFailed = (errorInfo: any) => {
|
||||
console.log('Failed:', errorInfo);
|
||||
};
|
||||
</script>
|
||||
<style>
|
||||
.header-title {
|
||||
height: 40px;
|
||||
font-size: 16px;
|
||||
color: #333;
|
||||
border-bottom: 1px solid #f0f0f0;
|
||||
margin-bottom: 12px;
|
||||
}
|
||||
|
||||
.node-icon {
|
||||
width: 6px;
|
||||
height: 18px;
|
||||
background-color: #5e95ff;
|
||||
margin-right: 8px;
|
||||
}
|
||||
</style>
|
||||
Reference in New Issue
Block a user