floraachy/shopxo
1
0
Fork 0
mirror of https://gitee.com/zongzhige/shopxo.git synced 2024-12-03 20:39:59 +08:00
Code Issues Actions Packages Projects Releases Wiki Activity

share

Browse Source
This commit is contained in:
gongfuxiang 2019-04-20 01:36:45 +08:00
parent 20c4ca905b
commit 9780848c73
3 changed files with 119 additions and 9 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

32
application/plugins/view/share/index/content.html
View File

@ -1,19 +1,33 @@
<div class="plugins-share">
<ul>
<li class="share-sian">
<span class="icon iconfont icon-sina"></span>
</li>
<li class="share-qq">
<li class="share-qq" data-type="qq">
<span class="icon iconfont icon-qq"></span>
</li>
<li class="share-url">
<span class="icon iconfont icon-url"></span>
</li>
<li class="share-qq-space">
<li class="share-qq-space" data-type="qq-space">
<span class="icon iconfont icon-qq-space"></span>
</li>
<li class="share-weixin">
<li class="share-weixin" data-type="weixin">
<span class="icon iconfont icon-weixin"></span>
</li>
<li class="share-sian" data-type="sian">
<span class="icon iconfont icon-sina"></span>
</li>
<li class="share-url" data-type="url">
<span class="icon iconfont icon-url"></span>
</li>
</ul>
</div>
<!-- 微信弹出框 -->
<div class="am-modal am-modal-no-btn" tabindex="-1" id="plugins-share-weixin-modal">
<div class="am-modal-dialog">
<div class="am-modal-hd">
<a href="javascript: void(0)" class="am-close am-close-spin" data-am-modal-close>&times;</a>
</div>
<div class="am-modal-bd">
<div id="plugins-share-modal-weixin-qrcode" class="am-text-center"></div>
<p>打开微信，点击底部的“发现”</p>
<p>使用“扫一扫”即可将网页分享至朋友圈</p>
</div>
</div>
</div>

25
public/static/plugins/css/share/style.css
View File

@ -8,8 +8,33 @@
}
.plugins-share ul li {
float: left;
width: 35px;
height: 35px;
text-align: center;
line-height: 35px;
border-radius: 50px;
margin-right: 10px;
cursor: pointer;
}
.plugins-share ul li:last-child {
margin-right: 0;
}
.plugins-share ul li .iconfont {
font-size: 20px;
color: #fff;
}
.plugins-share ul li.share-qq {
background: #d82d0e;
}
.plugins-share ul li.share-qq-space {
background: #0da6e4;
}
.plugins-share ul li.share-weixin {
background: #3eab0f;
}
.plugins-share ul li.share-sian {
background: #e71f2d;
}
.plugins-share ul li.share-url {
background: #607d8b;
}

71
public/static/plugins/js/share/style.js
View File

@ -0,0 +1,71 @@
$(function()
{
// 分享事件
$(document).on('click', '.plugins-share ul li', function()
{
// 分享类型
var type = $(this).data('type');
// 来源站点
var site = 'shopxo';
// url
var url = $(this).parents('.plugins-share').data('url') || window.location.href;
url = encodeURIComponent(url);
// 标题
var title = $(this).parents('.plugins-share').data('title') || $('title').text() || null;
title = title == null ? '' : encodeURIComponent(title);
// 描述
var desc = $(this).parents('.plugins-share').data('desc') || $('meta[name="description"]').attr('content') || null;
desc = desc == null ? '' : encodeURIComponent(desc);
// 封面图
var pic = $(this).parents('.plugins-share').data('pic') || null;
pic = pic == null ? '' : encodeURIComponent(pic);
// 平台地址
var platform_url = null;
switch(type)
{
// QQ
case 'qq' :
platform_url = 'https://connect.qq.com/widget/shareqq/index.html?url='+url+'&utm_medium=qqim&title='+title+'&desc='+desc+'&pics='+pic+'&site='+site
break;
// QQ空间
case 'qq-space' :
platform_url = 'http://sns.qzone.qq.com/cgi-bin/qzshare/cgi_qzshare_onekey?url='+url+'&utm_medium=qzone&title='+title+'&desc='+desc+'&pics='+pic+'&summary='+desc+'&site='+site;
break;
// 新浪
case 'sian' :
platform_url = 'http://service.weibo.com/share/share.php?url='+url+'&utm_medium=sian&title='+title+'&desc='+desc+'&pics='+pic+'&site='+site;
break;
// 微信
case 'weixin' :
var $modal = $('#plugins-share-weixin-modal');
$('#plugins-share-modal-weixin-qrcode').empty().qrcode({
text: decodeURIComponent(url),
width: 200,
height: 200
});
$modal.modal({width: 260});
$modal.modal('open');
break;
// url
case 'url' :
alert("已复制好，可贴粘。");
break;
}
// 跳转
if(platform_url != null)
{
window.open(platform_url);
}
});
});