hs_hzl_uniapp_ml/pages/user/settings/swiper-news-subscription.vue

<template>
	<!--  消息订阅组件 -->
	<view class="message_subscription" style="color: #FFFFFF;">

		<u-cell-group>
			<u-cell title="审批结果" @click="judgementMessageSwitch('qgp7iG6xTRm4JewW8N46nXJT-E6xorFn2hZ2V7gD8wY')"
				:isLink="true">
			</u-cell>
			<u-cell title="待审批" @click="judgementMessageSwitch('Toomi1XWGMzNxOCoPX1rRNj7gLuykgszEzUstXaAp9c')"
				:isLink="true">
			</u-cell>
			<u-cell title="预定提醒" @click="judgementMessageSwitch('2nFR6OXrC7d6w3ZkqaLsKjXYBQB3k78xzRvQoPacfKA')"
				:isLink="true">
			</u-cell>
			<u-cell title="工资单通知" @click="judgementMessageSwitch('SSsS8EV9dfv-CC7-w_JUKYnfEuWm6FiGL_eED8hf80Q')"
				:isLink="true">
			</u-cell>
		</u-cell-group>
		<!-- 		<u-button @click="judgementMessageSwitch('qgp7iG6xTRm4JewW8N46nXJT-E6xorFn2hZ2V7gD8wY')"
			style="margin: 20px;background-color: rgb(55,186,189);">审批结果</u-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: '不需要提醒',
				tmplId: []
			}
		},
		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(flag)
						}
					},
					fail() {
						that.messageSubscription(flag) // 如果失败，则继续向下打开弹窗，获取用户授权
					}
				})
			},
			// 弹窗点订阅，开启消息订阅提醒
			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;
								}
							}
						})
					}
				})
			},
			getUser() {
				uni.getUserProfile({
					desc: "获取你的昵称、头像信息", //必填项，声明获取用户个人信息后的用途，不超过30个字符
					success: (res) => {
						const userInfo = res.userInfo;
						console.log("用户基本信息", userInfo);
					},
					fail: (res) => {
						//拒绝授权
						wx.showToast({
							title: "获取失败",
							icon: "error",
							duration: 2000,
						});
						return;
					},
				});

			},
			// 弹窗点不订阅
			dontOpenSetting() {
				this.showOpenSettingDialog = false;
			},

			// 订阅申请弹出，只允许点击弹出
			messageSubscription(text) {
				let that = this
				that.showOpenSettingDialog = false;
				let tmplId = [text]
				// let tmplId = ['qgp7iG6xTRm4JewW8N46nXJT-E6xorFn2hZ2V7gD8wY']
				// 'Toomi1XWGMzNxOCoPX1rRNj7gLuykgszEzUstXaAp9c', 'CdLBnE4unNbHlQikYoGHehagWZAK8gSGu52QCbAesLIQUE'
				// 模板ID，去小程序后台管理开一个，写进数组里，官方文档也有介绍
				uni.requestSubscribeMessage({
					tmplIds: tmplId,
					success(res) {}
				})
			}
		}
	}
</script>
<style lang="scss" scoped></style>