1.4.5.2
This commit is contained in:
unknown
102
EdgeAdmin/web/public/js/components/senders/email-sender.js
Normal file
102
EdgeAdmin/web/public/js/components/senders/email-sender.js
Normal file
@@ -0,0 +1,102 @@
|
||||
Vue.component("email-sender", {
|
||||
props: ["value", "name"],
|
||||
data: function () {
|
||||
let value = this.value
|
||||
if (value == null) {
|
||||
value = {
|
||||
isOn: false,
|
||||
smtpHost: "",
|
||||
smtpPort: 0,
|
||||
username: "",
|
||||
password: "",
|
||||
fromEmail: "",
|
||||
fromName: ""
|
||||
}
|
||||
}
|
||||
let smtpPortString = value.smtpPort.toString()
|
||||
if (smtpPortString == "0") {
|
||||
smtpPortString = ""
|
||||
}
|
||||
|
||||
return {
|
||||
config: value,
|
||||
smtpPortString: smtpPortString
|
||||
}
|
||||
},
|
||||
watch: {
|
||||
smtpPortString: function (v) {
|
||||
let port = parseInt(v)
|
||||
if (!isNaN(port)) {
|
||||
this.config.smtpPort = port
|
||||
}
|
||||
}
|
||||
},
|
||||
methods: {
|
||||
test: function () {
|
||||
window.TESTING_EMAIL_CONFIG = this.config
|
||||
teaweb.popup("/users/setting/emailTest", {
|
||||
height: "36em"
|
||||
})
|
||||
}
|
||||
},
|
||||
template: `<div>
|
||||
<input type="hidden" :name="name" :value="JSON.stringify(config)"/>
|
||||
<table class="ui table selectable definition">
|
||||
<tbody>
|
||||
<tr>
|
||||
<td class="title">启用</td>
|
||||
<td><checkbox v-model="config.isOn"></checkbox></td>
|
||||
</tr>
|
||||
</tbody>
|
||||
<tbody v-show="config.isOn">
|
||||
<tr>
|
||||
<td>SMTP地址 *</td>
|
||||
<td>
|
||||
<input type="text" :name="name + 'SmtpHost'" v-model="config.smtpHost"/>
|
||||
<p class="comment">SMTP主机地址，比如<code-label>smtp.qq.com</code-label>，目前仅支持TLS协议，如不清楚，请查询对应邮件服务商文档。</p>
|
||||
</td>
|
||||
</tr>
|
||||
<tr>
|
||||
<td>SMTP端口 *</td>
|
||||
<td>
|
||||
<input type="text" :name="name + 'SmtpPort'" v-model="smtpPortString" style="width: 5em" maxlength="5"/>
|
||||
<p class="comment">SMTP主机端口，比如<code-label>587</code-label>、<code-label>465</code-label>，如不清楚，请查询对应邮件服务商文档。</p>
|
||||
</td>
|
||||
</tr>
|
||||
<tr>
|
||||
<td>用户名 *</td>
|
||||
<td>
|
||||
<input type="text" :name="name + 'Username'" v-model="config.username"/>
|
||||
<p class="comment">通常为发件人邮箱地址。</p>
|
||||
</td>
|
||||
</tr>
|
||||
<tr>
|
||||
<td>密码 *</td>
|
||||
<td>
|
||||
<input type="password" :name="name + 'Password'" v-model="config.password"/>
|
||||
<p class="comment">邮箱登录密码或授权码，如不清楚，请查询对应邮件服务商文档。。</p>
|
||||
</td>
|
||||
</tr>
|
||||
<tr>
|
||||
<td>发件人Email *</td>
|
||||
<td>
|
||||
<input type="text" :name="name + 'FromEmail'" v-model="config.fromEmail" maxlength="128"/>
|
||||
<p class="comment">使用的发件人邮箱地址，通常和发件用户名一致。</p>
|
||||
</td>
|
||||
</tr>
|
||||
<tr>
|
||||
<td>发件人名称</td>
|
||||
<td>
|
||||
<input type="text" :name="name + 'FromName'" v-model="config.fromName" maxlength="30"/>
|
||||
<p class="comment">使用的发件人名称，默认使用系统设置的<a href="/settings/ui" target="_blank">产品名称</a>。</p>
|
||||
</td>
|
||||
</tr>
|
||||
<tr>
|
||||
<td>发送测试</td>
|
||||
<td><a href="" @click.prevent="test">[点此测试]</a></td>
|
||||
</tr>
|
||||
</tbody>
|
||||
</table>
|
||||
<div class="margin"></div>
|
||||
</div>`
|
||||
})
|
||||
207
EdgeAdmin/web/public/js/components/senders/sms-sender-plus.js
Normal file
207
EdgeAdmin/web/public/js/components/senders/sms-sender-plus.js
Normal file
@@ -0,0 +1,207 @@
|
||||
Vue.component("sms-sender", {
|
||||
props: ["value", "name"],
|
||||
mounted: function () {
|
||||
this.initType(this.config.type)
|
||||
},
|
||||
data: function () {
|
||||
let config = this.value
|
||||
if (config == null) {
|
||||
config = {
|
||||
isOn: false,
|
||||
type: "webHook",
|
||||
webHookParams: {
|
||||
url: "",
|
||||
method: "POST"
|
||||
},
|
||||
aliyunSMSParams: {
|
||||
sign: "",
|
||||
templateCode: "",
|
||||
codeVarName: "code",
|
||||
accessKeyId: "",
|
||||
accessKeySecret: ""
|
||||
},
|
||||
tencentSMSParams: {
|
||||
sdkAppId: "",
|
||||
sign: "",
|
||||
templateId: "",
|
||||
accessKeyId: "",
|
||||
accessKeySecret: ""
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
if (config.aliyunSMSParams == null) {
|
||||
Vue.set(config, "aliyunSMSParams", {
|
||||
sign: "",
|
||||
templateCode: "",
|
||||
codeVarName: "code",
|
||||
accessKeyId: "",
|
||||
accessKeySecret: ""
|
||||
})
|
||||
}
|
||||
if (config.tencentSMSParams == null) {
|
||||
Vue.set(config, "tencentSMSParams", {
|
||||
sdkAppId: "",
|
||||
sign: "",
|
||||
templateId: "",
|
||||
accessKeyId: "",
|
||||
accessKeySecret: ""
|
||||
})
|
||||
}
|
||||
|
||||
return {
|
||||
config: config
|
||||
}
|
||||
},
|
||||
watch: {
|
||||
"config.type": function (v) {
|
||||
this.initType(v)
|
||||
}
|
||||
},
|
||||
methods: {
|
||||
initType: function (v) {
|
||||
// initialize params
|
||||
switch (v) {
|
||||
case "webHook":
|
||||
if (this.config.webHookParams == null) {
|
||||
this.config.webHookParams = {
|
||||
url: "",
|
||||
method: "POST"
|
||||
}
|
||||
}
|
||||
break
|
||||
}
|
||||
},
|
||||
test: function () {
|
||||
window.TESTING_SMS_CONFIG = this.config
|
||||
teaweb.popup("/users/setting/smsTest", {
|
||||
height: "22em"
|
||||
})
|
||||
}
|
||||
},
|
||||
template: `<div>
|
||||
<input type="hidden" :name="name" :value="JSON.stringify(config)"/>
|
||||
<table class="ui table selectable definition">
|
||||
<tbody>
|
||||
<tr>
|
||||
<td class="title">启用</td>
|
||||
<td><checkbox v-model="config.isOn"></checkbox></td>
|
||||
</tr>
|
||||
</tbody>
|
||||
<tbody v-show="config.isOn">
|
||||
<tr>
|
||||
<td>发送渠道</td>
|
||||
<td>
|
||||
<select class="ui dropdown auto-width" v-model="config.type">
|
||||
<option value="webHook">自定义HTTP接口</option>
|
||||
<option value="aliyunSMS">阿里云短信</option>
|
||||
<option value="tencentSMS">腾讯云短信</option>
|
||||
</select>
|
||||
<p class="comment" v-if="config.type == 'webHook'">通过HTTP接口的方式调用你的自定义发送短信接口。</p>
|
||||
<p class="comment" v-if="config.type == 'aliyunSMS'">通过阿里云短信服务发送短信接口；<strong>目前仅支持发送验证码</strong>。</p>
|
||||
<p class="comment" v-if="config.type == 'tencentSMS'">通过腾讯云短信服务发送短信接口；<strong>目前仅支持发送验证码</strong>。</p>
|
||||
</td>
|
||||
</tr>
|
||||
|
||||
<!-- webhook -->
|
||||
<tr v-if="config.type == 'webHook' && config.webHookParams != null">
|
||||
<td class="color-border">HTTP接口的URL地址 *</td>
|
||||
<td>
|
||||
<input type="text" maxlength="100" placeholder="https://..." v-model="config.webHookParams.url"/>
|
||||
<p class="comment">接收发送短信请求的URL，必须以<code-label>http://</code-label>或<code-label>https://</code-label>开头。</p>
|
||||
</td>
|
||||
</tr>
|
||||
<tr v-if="config.type == 'webHook' && config.webHookParams != null">
|
||||
<td class="color-border">HTTP接口的请求方法</td>
|
||||
<td>
|
||||
<select class="ui dropdown auto-width" v-model="config.webHookParams.method">
|
||||
<option value="GET">GET</option>
|
||||
<option value="POST">POST</option>
|
||||
</select>
|
||||
<p class="comment" v-if="config.webHookParams.method == 'GET'">以在URL参数中加入mobile、body和code三个参数（<code-label>YOUR_API_URL?mobile=手机号&body=短信内容&code=验证码</code-label>)的方式调用你的HTTP接口的URL地址；状态码返回200表示成功。</p>
|
||||
<p class="comment" v-if="config.webHookParams.method == 'POST'">通过POST表单发送mobile、body和code三个参数（<code-label>mobile=手机号&body=短信内容&code=验证码</code-label>）的方式调用你的HTTP接口URL地址；状态码返回200表示成功。</p>
|
||||
</td>
|
||||
</tr>
|
||||
|
||||
<!-- aliyun sms -->
|
||||
<tr v-if="config.type == 'aliyunSMS'">
|
||||
<td class="color-border">签名名称 *</td>
|
||||
<td><input type="text" v-model="config.aliyunSMSParams.sign" maxlength="12"/>
|
||||
<p class="comment">在阿里云短信服务 “签名管理” 中添加并通过审核后才能使用。</p>
|
||||
</td>
|
||||
</tr>
|
||||
<tr v-if="config.type == 'aliyunSMS'">
|
||||
<td class="color-border">模板CODE *</td>
|
||||
<td>
|
||||
<input type="text" v-model="config.aliyunSMSParams.templateCode" maxlength="30"/>
|
||||
<p class="comment">在阿里云短信服务 “模板管理” 中添加并通过审核后才能使用。</p>
|
||||
</td>
|
||||
</tr>
|
||||
<tr v-if="config.type == 'aliyunSMS'">
|
||||
<td class="color-border">模板中验证码变量名称 *</td>
|
||||
<td>
|
||||
<input type="text" v-model="config.aliyunSMSParams.codeVarName" maxlength="30"/>
|
||||
<p class="comment">默认为<code-label>code</code-label>，不需要带\${}等符号，即表示在模板中使用<code-label>\${<span>{{ config.aliyunSMSParams.codeVarName }}</span>}</code-label>代表要发送的验证码。</p>
|
||||
</td>
|
||||
</tr>
|
||||
<tr v-if="config.type == 'aliyunSMS'">
|
||||
<td class="color-border">AccessKey ID *</td>
|
||||
<td>
|
||||
<input type="text" v-model="config.aliyunSMSParams.accessKeyId" maxlength="100"/>
|
||||
<p class="comment">在阿里云 -- RAM访问控制 -- AccessKey中可以创建和获取。</p>
|
||||
</td>
|
||||
</tr>
|
||||
<tr v-if="config.type == 'aliyunSMS'">
|
||||
<td class="color-border">AccessKey Secret *</td>
|
||||
<td>
|
||||
<input type="text" v-model="config.aliyunSMSParams.accessKeySecret" maxlength="100"/>
|
||||
<p class="comment">和表单中的AccessKey ID对应，在阿里云 -- RAM访问控制 -- AccessKey中可以创建和获取。</p>
|
||||
</td>
|
||||
</tr>
|
||||
|
||||
<!-- tencent sms -->
|
||||
<tr v-if="config.type == 'tencentSMS'">
|
||||
<td>SDK应用ID *</td>
|
||||
<td>
|
||||
<input type="text" v-model="config.tencentSMSParams.sdkAppId" maxlength="30"/>
|
||||
<p class="comment">在腾讯云 -- 短信 -- 应用管理 -- 应用列表中可以查看。</p>
|
||||
</td>
|
||||
</tr>
|
||||
<tr v-if="config.type == 'tencentSMS'">
|
||||
<td>签名内容 *</td>
|
||||
<td>
|
||||
<input type="text" v-model="config.tencentSMSParams.sign" maxlength="12"/>
|
||||
<p class="comment">比如“腾讯云”，在腾讯云 -- 短信 -- 签名管理中可以查看。</p>
|
||||
</td>
|
||||
</tr>
|
||||
<tr v-if="config.type == 'tencentSMS'">
|
||||
<td>正文模板ID *</td>
|
||||
<td>
|
||||
<input type="text" v-model="config.tencentSMSParams.templateId" maxlength="50"/>
|
||||
<p class="comment">在腾讯云 -- 短信 -- 正文模板管理中可以查看。</p>
|
||||
</td>
|
||||
</tr>
|
||||
<tr v-if="config.type == 'tencentSMS'">
|
||||
<td>密钥SecretId *</td>
|
||||
<td>
|
||||
<input type="text" v-model="config.tencentSMSParams.accessKeyId"/>
|
||||
<p class="comment">同SecretKey一同在腾讯云 -- 访问管理 -- API密钥管理中获取。</p>
|
||||
</td>
|
||||
</tr>
|
||||
<tr v-if="config.type == 'tencentSMS'">
|
||||
<td>密钥SecretKey *</td>
|
||||
<td>
|
||||
<input type="text" v-model="config.tencentSMSParams.accessKeySecret"/>
|
||||
<p class="comment">同SecretId一同在腾讯云 -- 访问管理 -- API密钥管理中获取。</p>
|
||||
</td>
|
||||
</tr>
|
||||
|
||||
<tr>
|
||||
<td>发送测试</td>
|
||||
<td><a href="" @click.prevent="test">[点此测试]</a></td>
|
||||
</tr>
|
||||
</tbody>
|
||||
</table>
|
||||
<div class="margin"></div>
|
||||
</div>`
|
||||
})
|
||||
Reference in New Issue
Block a user