<template>
	<view>
		<button type="default" @click="showImageMenu">显示底部图标菜单</button>
		<view style="height: 100rpx;"></view>
		<button type="primary" @click="confirm({showCancel:true})">confirm提示</button>
		<view style="height: 100rpx;"></view>
		<button type="warn" @click="alert({showCancel:false})">alert提示</button>
	</view>
</template>

<script>
	import uniImageMenu from './js_sdk/bind-tip.js';
	export default {
		methods: {
			showImageMenu() {
				uniImageMenu.show({
					list: [{
							"img": "https://bjetxgzv.cdn.bspapp.com/VKCEYUGU-dc-site/9a952c80-6080-11eb-a16f-5b3e54966275.png",
							"text": "uni-app"
						},
						{
							"img": "https://bjetxgzv.cdn.bspapp.com/VKCEYUGU-dc-site/9a952c80-6080-11eb-a16f-5b3e54966275.png",
							"text": "uni-app"
						},
						{
							"img": "https://bjetxgzv.cdn.bspapp.com/VKCEYUGU-dc-site/d84c6de0-6080-11eb-bdc1-8bd33eb6adaa.png",
							"text": "unicloud"
						},
						{
							"img": "https://bjetxgzv.cdn.bspapp.com/VKCEYUGU-dc-site/9a952c80-6080-11eb-a16f-5b3e54966275.png",
							"text": "uni-app"
						}
					],
					cancelText: "取消"
				}, index => {
					uni.showToast({
						title: '你点了第' + (index + 1) + '个图标',
						icon: 'none'
					});
				})
			},

			async alert(options) {
				await this.showModal(options);
				uni.showToast({
					title: "你点击了确定按钮",
					position: "bottom"
				})
			},
			async confirm(options) {
				try {
					await this.showModal(options);
					uni.showToast({
						title: "你点击了确定按钮",
						position: "bottom"
					})
				} catch (e) {
					uni.showToast({
						title: "你点击了取消按钮",
						position: "bottom"
					})
				}
			},
			showModal(options) {
				let params = {
					title: "提示",
					content: "自定义内容",
					align: "center", // 对齐方式 left/center/right
					cancelText: "取消", // 取消按钮的文字
					cancelColor: "#8F8F8F", // 取消按钮颜色
					confirmText: "确定", // 确认按钮颜色
					confirmColor: "#FFAD15", // 确认按钮颜色 
					showCancel: true, // 是否显示取消按钮，默认为 true
				}

				Object.assign(params, options)

				let list = []
				Object.keys(params).forEach(ele => {
					list.push(ele + "=" + params[ele])
				})
				let paramsStr = list.join('&')
				
				console.log(1);
				
				uni.navigateTo({
					url: "/components/modal-mask/modal-mask-nvue?" + paramsStr
				})

				return new Promise((resolve, reject) => {
					uni.$once("AppModalCancel", () => {
						reject()
					})
					uni.$once("AppModalConfirm", () => {
						resolve()
					})
				});
			}
		}
	}
</script>

<style>
</style>
