Browse Source

推荐给朋友功能

laiguoran 5 years ago
parent
commit
cc669e3068
2 changed files with 64 additions and 1 deletions
  1. 39 1
      public/web/headerOpr.js
  2. 25 0
      web/common/html/header.html

+ 39 - 1
public/web/headerOpr.js

@@ -1,4 +1,4 @@
-                                                                                                                                                                                                                                      'use strict';
+'use strict';
 
 /**
  *
@@ -51,12 +51,20 @@ const CommonHeader = (function () {
             }
         })
     }
+
+    // 推荐给朋友
+    const copyDom = $('#copy_link');
+
     //绑定事件
     //@return {void}
     function addEventListener(){
         csDom.click(function () {
             getCategoryList(-1, '联系客服');
         });
+        copyDom.click(function () {
+            copy('大司空市政云计价,正版软件永久免费\r\nhttps://yun.smartcost.com.cn');
+            $('#show_share_msg').show();
+        })
     }
     //取消浏览器自带右键
     //@return {void}
@@ -76,6 +84,36 @@ const CommonHeader = (function () {
             }
         }
     }
+
+    /**
+     * 复制字符串到剪贴板的函数
+     * @param {String} value 需要被复制的字符串
+     * @returns {Boolean} 操作结果
+     */
+    function copy(value){
+        var currentFocus = document.activeElement;// 保存当前活动节点
+
+        let input = document.createElement('textarea');// 创建一个texterea标签
+        document.body.appendChild(input);// 把标签添加给body
+        input.style.opacity = 0;//设置input标签设置为透明(不可见)
+        input.value = value;// 把需要复制的值放到input上
+
+        // 记录当前滚动位置, 因为添加节点并选中的时候回影响页面滚动
+        let scrollY = window.scrollY;
+
+        input.focus();// input节点获取焦点
+        input.setSelectionRange(0, input.value.length);// 选中input框中的所有文字
+
+        var res = document.execCommand('copy', true);// 复制文字并获取结果
+
+        currentFocus.focus();// 之前活动节点获得焦点
+        document.body.removeChild(input);// 删除添加的input节点
+
+        // 页面滚动到之前位置
+        window.scrollTo(0, scrollY);
+
+        return res;// 返回操作结果
+    }
     return {getCategoryList, addEventListener, banNavigatorContextMenu};
 })();
 

+ 25 - 0
web/common/html/header.html

@@ -17,6 +17,9 @@
     <div class="navbar-text p-0 navbar-expand-sm">
         <!--大屏菜单-->
         <ul class="nav navbar-nav" id="fluid-menu">
+            <li class="nav-item" >
+                <a class="nav-link" href="#share" data-toggle="modal" data-target="#share" ><i class="fa fa-share-alt"></i> 推荐给朋友</a>
+            </li>
             <li class="nav-item dropdown" id="showqqgroup" >
                 <a class="nav-link" href="#"><i class="fa fa-qq" ></i> 群</a>
                 <div class="dropdown-menu p-3 dropdown-menu-right" id="qqgroup" style="width: 200px;top:36px">
@@ -280,6 +283,28 @@
         </div>
     </div>
 </div>
+<!--推荐给朋友-->
+<div class="modal fade" id="share" data-backdrop="static">
+    <div class="modal-dialog" role="document">
+        <div class="modal-content">
+            <div class="modal-header">
+                <h5 class="modal-title">推荐给朋友</h5>
+                <button type="button" class="close" data-dismiss="modal" aria-label="Close">
+                    <span aria-hidden="true">&times;</span>
+                </button>
+            </div>
+            <div class="modal-body">
+                <div class="input-group mb-3">
+                    <input type="text" class="form-control " value="https://yun.smartcost.com.cn" disabled>
+                    <div class="input-group-append">
+                        <button class="btn btn-outline-secondary" id="copy_link">复制链接</button>
+                    </div>
+                </div>
+                <div id="show_share_msg" style="display: none" class="alert alert-success">地址复制成功,快去发给朋友试试吧。</div>
+            </div>
+        </div>
+    </div>
+</div>
 <div style="display: none">
     <%include dataStatistics.html %>
 </div>