89 lines
2.9 KiB
Vue
89 lines
2.9 KiB
Vue
<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>
|