封装一个订阅消息逻辑组件
现在消息订阅只允许用户点击才能订阅
如果用户没有打开订阅消息的总开关的话,
用户点击也是不会弹出弹框订阅的
弹框使用的uview组件,可以换成其他的
<template>
<!-- 消息订阅组件 -->
<view class="message_subscription">
<button @click="judgementMessageSwitch()" style="margin: 20px;background-color: #FFFFFF;">消息订阅测试</button>
<u-popup v-model="showOpenSettingDialog" mode="center" width="520rpx" :mask-close-able="false" height="300rpx"
border-radius="18">
<div class="mock-dialog">
<div class="mock-dialog-content">
<div class="mock-dialog-title">提示</div>
<div class="mock-dialog-text">
{{tipsContent}}
</div>
</div>
<div class="mock-dialog-button">
<div class="color-gray" @click="dontOpenSetting">{{buttonCancelText}}</div>
<div class="color-blue" @click="openSetting">{{buttonConfirmText}}</div>
</div>
</div>
</u-popup>
</view>
</template>
<script>
export default {
name: 'messageSubscription',
components: {},
data() {
return {
showOpenSettingDialog: false, // 授权询问弹框,uview
tipsContent: '为了及时获取订单状态,您是否想接收订单状态的消息提醒?', // 弹框提示内容,
buttonConfirmText: '去开启消息提醒',
buttonCancelText: '不需要提醒',
}
},
methods: {
// 判断消息订阅总开关是否打开
judgementMessageSwitch(flag) {
let that = this
uni.getSetting({
withSubscriptions: true,
success(res) {
console.log(res)
if (!res.subscriptionsSetting.mainSwitch) { // 订阅消息的总开关,如果是关着的,引导用户去打开
that.showOpenSettingDialog = true
} else { // 如果开着,则继续向下打开弹窗,获取用户授权
that.messageSubscription()
}
},
fail() {
that.messageSubscription() // 如果失败,则继续向下打开弹窗,获取用户授权
}
})
},
// 弹窗点订阅,开启消息订阅提醒
openSetting() {
if(this.buttonConfirmText == '确定'){
this.messageSubscription()
return
}
var that = this
uni.openSetting({
withSubscriptions: true,
complete(res) {
uni.getSetting({
withSubscriptions: true,
success(res) {
if (res.subscriptionsSetting.mainSwitch) { // 订阅消息的总开关,如果是开着的
that.tipsContent = '再次点击确定,弹出可订阅列表进行订阅'
that.buttonCancelText = '取消'
that.buttonConfirmText = '确定'
} else {
that.showOpenSettingDialog = false;
}
}
})
}
})
},
// 弹窗点不订阅
dontOpenSetting() {
this.showOpenSettingDialog = false;
},
// 订阅申请弹出,只允许点击弹出
messageSubscription() {
this.tipsContent= '为了及时掌握订单状态,您是否想接收订单状态的消息提醒?' // 弹框提示内容,
this.buttonConfirmText= '去开启消息提醒'
this.buttonCancelText= '不需要提醒'
let that = this
that.showOpenSettingDialog = false;
let tmplId = ['xxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxx'] // 模板ID,去小程序后台管理开一个,写进数组里,官方文档也有介绍
uni.requestSubscribeMessage({
tmplIds: tmplId,
success(res) {
console.log("success", res)
if (res['xxxxxxxxxxxxxxxxxxxxxxxxxxxxxxx'] == 'accept') {
console.log('订阅成功');
}
},
})
},
},
}
</script>
<style lang="scss" scoped></style>
|