You can not select more than 25 topics
Topics must start with a letter or number, can include dashes ('-') and can be up to 35 characters long.
105 lines
2.2 KiB
105 lines
2.2 KiB
<template> |
|
<view> |
|
<view class="container"> |
|
<view class="text content-center"> |
|
<text>想要新功能吗</text> |
|
</view> |
|
<view class="text content-center"> |
|
<text>任何意见或建议都非常感谢</text> |
|
</view> |
|
<view class="text content-center"> |
|
<text>你可以提交下面的表格来告诉我</text> |
|
</view> |
|
|
|
<view class="padding-t-12"> |
|
<uni-easyinput type="textarea" autoHeight v-model="feedbackText" placeholder="对开发者的话..."> |
|
</uni-easyinput> |
|
</view> |
|
|
|
<view class="content-center padding-t-12"> |
|
<button @click="submit" type="primary" size="mini"> |
|
提交留言 |
|
</button> |
|
</view> |
|
<!-- 提示消息 --> |
|
<uni-popup ref="popup" type="message"> |
|
<uni-popup-message :type="msgType" :message="msgContent"></uni-popup-message> |
|
</uni-popup> |
|
</view> |
|
|
|
|
|
</view> |
|
</template> |
|
|
|
<script> |
|
export default { |
|
data() { |
|
return { |
|
feedbackText: "", // 留言 |
|
msgType: "", // 弹出框的类型(发送成功/发送失败) |
|
msgContent: "", // 弹出框的内容 |
|
} |
|
}, |
|
computed: { |
|
// 防止留言文本过长 |
|
mailContent: function() { |
|
return this.feedbackText.trim().slice(0, 2000); |
|
} |
|
}, |
|
methods: { |
|
// 提交emial留言 |
|
submit() { |
|
if (this.mailContent === "") { |
|
return uni.showToast({ |
|
title: "请输入你的留言", |
|
icon: "none", |
|
}) |
|
} |
|
this.sendMail(); |
|
}, |
|
sendMail() { |
|
// 调用云函数sendMail() |
|
uniCloud.callFunction({ |
|
name: 'sendMail', |
|
data: { |
|
content: this.feedbackText, |
|
} |
|
}).then(res => { |
|
if (res.success === true) { |
|
this.msgType = "success"; |
|
this.msgContent = "邮件发送成功"; |
|
this.feedbackText = ""; // 清空留言 |
|
console.log(this.msgContent); |
|
} else { |
|
this.msgType = "error"; |
|
this.msgContent = "邮件发送失败,晚点再尝试下吧"; |
|
console.log(this.msgContent); |
|
} |
|
return this.$refs.popup.open(); |
|
}); |
|
} |
|
} |
|
} |
|
</script> |
|
|
|
<style scoped> |
|
.container { |
|
padding: 20px; |
|
} |
|
|
|
.content-center { |
|
display: flex; |
|
justify-content: center; |
|
align-items: center; |
|
} |
|
|
|
.text { |
|
font-size: 18px; |
|
color: #434343; |
|
font-weight: 500; |
|
} |
|
|
|
.padding-t-12 { |
|
padding-top: 12px; |
|
} |
|
</style>
|
|
|