dev/dcp-app-gate/components/share.vue

<template>
		<view class="share">
			<!-- :mask-close-able="false" :closeable="true" -->
			<u-popup v-model="show" mode="bottom" @close="close">
				
				<u-grid :col="2" style="background-color: #fff;">
						<u-grid-item @click="weixinShare">
							<u-icon name="weixin-circle-fill" :size="46" class="icon"></u-icon>
							<view class="grid-text">微信</view>
						</u-grid-item>
						<u-grid-item @click="weixinMoments">
							<u-icon name="moments" :size="46"></u-icon>
							<view class="grid-text">微信朋友圈</view>
						</u-grid-item>
						<!-- <u-grid-item @click="QQkongjianShare">
							<u-icon name="qzone" :size="46"></u-icon>
							<view class="grid-text">qq空间</view>
						</u-grid-item>
						<u-grid-item @click="QQShare">
							<u-icon name="qq-fill" :size="46"></u-icon>
							<view class="grid-text">QQ</view>
						</u-grid-item>
						<u-grid-item @click="weiboShare">
							<u-icon name="weibo" :size="46"></u-icon>
							<view class="grid-text">微博</view>
						</u-grid-item> -->
						<!-- <u-grid-item>
							<u-icon name="zhifubao" :size="46"></u-icon>
							<view class="grid-text">支付宝</view>
						</u-grid-item> -->
				</u-grid>
				<!-- <view class="" style="margin-top: 0upx;">
					<u-button >取消</u-button>
				</view> -->
			</u-popup>
			<u-toast ref="uToast" />
		</view>
</template>

<script>
	export default {
		props:{
			show: {
				type: Boolean,
				default: false
			},
			title:{
				type: String,
				default: '能联全球'
			},
			summary:{
				type: String,
				default: ''
			},
			href:{
				type: String,
				default: 'https://www.geidcp.com/#/'
			},
			imageUrl:{
				type: String,
				default: 'https://geidcp.com/api/file/pub/defaultCutPic/shareLogo.png'
			}
		},
		data() {
			return {
				canvasShow: false
			};
		},
		methods:{
			close(){
				this.$emit('closeShare',false);
			},
			// 微信
			weixinShare(){
				const that = this;
				uni.share({
				    provider: "weixin",
				    scene: "WXSceneSession",
				    type: 0,
				    href: this.href,
				    title: this.title,
				    summary: this.summary,
				    imageUrl: this.imageUrl,
				    success: function (res) {
				        that.$refs.uToast.show({
							title: '分享成功',
							type: 'success',
						})
						
				    },
				    fail: function (err) {
				        that.$refs.uToast.show({
				        	title: '分享失败',
				        	type: 'error',
				        })
				    }
				});
			},
			// 微信朋友圈
			weixinMoments(){
				const that = this;
				uni.share({
				    provider: "weixin",
				    scene: "WXSenceTimeline",
				    type: 0,
				    href: this.href,
				    title: this.title,
				    summary: this.summary,
				    imageUrl: this.imageUrl,
				    success: function (res) {
					   that.$refs.uToast.show({
						title: '分享成功',
						type: 'success',
					   });
					   
				    },
				    fail: function (err) {
				        that.$refs.uToast.show({
				        	title: '分享失败',
				        	type: 'error',
				        })
				    }
				});
			},
			// QQ
			QQShare(){
		
				if(uni.getSystemInfoSync().platform =='ios'){
					uni.share({
						provider: "qq",
						scene: "WXSceneSession",
						type: 1,
						summary:this.summary + this.href,
						success: function (res) {
						   // that.$refs.popup.close()
						},
						fail: function (err) {
							console.log("fail:" + JSON.stringify(err));
						}
					});
				}else{
					uni.share({
						provider: "qq",
						scene: "WXSceneSession",
						title:this.title,
						type: 1,
						href:this.href,
						summary:this.summary + this.href,
						success: function (res) {
						   // that.$refs.popup.close()
						},
						fail: function (err) {
							console.log("fail:" + JSON.stringify(err));
						}
					});	
				}
			},
			// QQ空间
			QQkongjianShare(){
				if(uni.getSystemInfoSync().platform =='ios'){
					uni.share({
						provider: "qq",
						scene: "WXSenceTimeline",
						type: 1,
						summary:this.summary + this.href,
						success: function (res) {
						   // that.$refs.popup.close()
						},
						fail: function (err) {
							console.log("fail:" + JSON.stringify(err));
						}
					});
				}else{
					uni.share({
						provider: "qq",
						scene: "WXSenceTimeline",
						title:this.title,
						type: 1,
						href:this.href,
						summary:this.summary + this.href,
						success: function (res) {
						   // that.$refs.popup.close()
						},
						fail: function (err) {
							console.log("fail:" + JSON.stringify(err));
						}
					});	
				}
			},
			weiboShare(){
				uni.share({
					provider: "sinaweibo",
					scene: "WXSceneSession",
					"type": 0,
					title:this.title,
					"summary": this.summary,
					"imageUrl":this.imageUrl,
					success: function (res) {
					   // that.$refs.popup.close()
					},
					fail: function (err) {
						console.log("fail:" + JSON.stringify(err));
					}
				});	
			}
		}
	}
</script>

<style scoped>
.share /deep/ .u-drawer-bottom {
	background-color: #fff;
}
.icon {
	
}
</style>