Эх сурвалжийг харах

feat:详情页分享功能

tsz 2 жил өмнө
parent
commit
ea0ea260b6

+ 28 - 9
src/web/staticres/site/page/industryInfo/css/industry_content.css

@@ -41,14 +41,18 @@
   width: 800px;
 }
 .school_tabs .industry_info {
-  max-height: 923px;
-  overflow-y: auto;
-  overflow-x: hidden;
+  position: relative;
+  height: 923px;
   margin-bottom: 40px;
   padding: 40px;
-  max-height: 923px;
   background: #fff;
 }
+.industry_info .scroll_main{
+  margin-top: 20px;
+  height: 576px;
+  overflow-y: auto;
+  overflow-x: hidden;
+}
 .industry_info h2 {
   width: 100%;
   text-align: center;
@@ -109,6 +113,7 @@
   background-size: contain;
 }
 .industry_info .active_info .active_info_right .give_share{
+  position: relative;
   display: flex;
   align-items: center;
   margin-left: 40px;
@@ -130,7 +135,20 @@
 .give_share img.icon{
   width: 20px;
 }
-
+.give_share #pcShare-content{
+  top: 39px;
+}
+.give_share #pcShare-content>div{
+  word-break: keep-all;
+}
+.give_share #pcShare-content>div>span{
+  display: flex;
+  align-items: center;
+  cursor: pointer;
+}
+.give_share #share-weixin{
+  padding: 12px;
+}
 .industry_info .summary{
   margin-top: 20px;
   padding: 12px 20px 16px;
@@ -143,9 +161,6 @@
   line-height: 20px;
   color: #686868;
 }
-.industry_info .jyb_dimg{
-  margin-top: 20px;
-}
 .industry_info .jyb_dimg, .industry_info .jyb_dimg>img{
   width: 100%;
 }
@@ -161,10 +176,14 @@
   color: #1D1D1D;
 }
 .industry_info .btn_next{
+  position: absolute;
+  bottom: 40px;
   display: flex;
   justify-content: center;
-  align-items: center;
+  align-items: flex-start;
   margin-top: 50px;
+  width: calc(100% - 40px); ;
+  background: #fff;
 }
 .btn_next>button{
   width: 132px;

Файлын зөрүү хэтэрхий том тул дарагдсан байна
+ 0 - 0
src/web/staticres/site/page/js/qrcode.min.js


+ 2 - 2
src/web/templates/common/seo-pagination.html

@@ -68,9 +68,9 @@
     min-width: 32px;
     margin-left: 8px;
     width: 52px;
-    height: 32px;
+    height: 30px;
     font-size: 14px;
-    line-height: 32px;
+    line-height: 30px;
     box-sizing: border-box;
     text-align: center;
     color: #1d1d1d;

+ 130 - 25
src/web/templates/site/page/jyblogdetail.html

@@ -50,15 +50,20 @@
                 <span class="value">{{.T.data.praise}}</span>
               </div>
               <div class="give_share">
-                <div class="btns">
-                  <span><img class="icon" src="{{Msg "seo" "cdn"}}/images/jyblogVector.png" alt=""></span>
-                  <span>分享</span>
+                <div class="btns" id="pcShare">
+                  <span class="give_share_img"><img class="icon" src="{{Msg "seo" "cdn"}}/images/jyblogVector.png" alt=""></span>
+                  <span class="give_share_text">分享</span>
                 </div>
-                <div style="display: none">
-                  <span id="share-weixinF"><img src="{{Msg "seo" "cdn"}}/wxswordfish/images/wechat.png">微信好友</span>
-                  <span id="share-tsina"><img src="{{Msg "seo" "cdn"}}/wxswordfish/images/sina.png">新浪微博</span>
-                  <span id="share-qzone"><img src="{{Msg "seo" "cdn"}}/wxswordfish/images/qq.png">QQ空间</span>
-                  <!--					<span id="share-tqq"><img src="{{Msg "seo" "cdn"}}/wxswordfish/images/tencent.png">腾讯微博</span>-->
+                <div id="share-weixin" class="hidden"></div>
+                <span class="jybk_remindone hidden"></span>
+                <span class="jybk_remindonebak hidden"></span>
+                <div class="b-pcshare-content" id="pcShare-content">
+                  <div>
+                    <span id="share-weixinF"><img src="{{Msg "seo" "cdn"}}/wxswordfish/images/wechat.png">微信好友</span>
+                    <span id="share-tsina"><img src="{{Msg "seo" "cdn"}}/wxswordfish/images/sina.png">新浪微博</span>
+                    <span id="share-qzone"><img src="{{Msg "seo" "cdn"}}/wxswordfish/images/qq.png">QQ空间</span>
+          <!--					<span id="share-tqq"><img src="{{Msg "seo" "cdn"}}/wxswordfish/images/tencent.png">腾讯微博</span>-->
+                  </div>
                 </div>
               </div>
             </div>
@@ -66,22 +71,24 @@
           <div class="summary">
             <span>文章摘要:</span>{{.T.data.s_description}}
           </div>
-          {{if .T.data.s_pic}}
-          <div class="jyb_dimg">
-            <img src="{{.T.data.s_pic}}"/>
+          <div class="scroll_main">
+            {{if .T.data.s_pic}}
+            <div class="jyb_dimg">
+              <img src="{{.T.data.s_pic}}"/>
+            </div>
+            {{end}}
+  <!--          <p class="text_content">-->
+  <!--            建设工程实施过程中,一般先由建设单位与施工单位签订《建设工程施工合同》,并在合同中约定工程暂定“合同价格”,此价格即为合同价格。合同价款是建设单位与施工单位在施工合同中约定的价款或者价款计算方法。这只是根据合同双方在订立合同时预想的状况所达成的意思表示。-->
+  <!--            但建设工程在实际施工过程中,设计变更、工期补偿、索赔等可转化为价款的事项时有发生,最终经过竣工结算审定得出的结算价格,才是所谓的工程造价。所以,工程造价与合同价格往往不尽一致,并常常具有较大差距。-->
+  <!--            工程造价具体指什么?-->
+  <!--            工程造价包括工程预算,预算是按照施工图所作的工程预算造价,其价格是用的定额中材料预算价格,和实际的市场价格是有差别的。-->
+  <!--            工程造价的范围很广,包括:概算、预算、结算、决算等。合同金额是指我国对外承包劳务企业开展对外承包工程、对外劳务合作和对外设计咨询业务与外商签约的合同所定金额,其口径同于合同数。工程造价的直意就是工程的建造价格。工程计价的三要素:量、价、费。-->
+  <!--            广义上工程造价涵盖建设工程造价(土建专业和安装专业),公路工程造价,水运工程造价、铁路工程造价,水利工程造价,电力工程造价,通信工程造价,航空航天工程造价等。-->
+  <!--            工程造价是指进行某项工程建设所花费的全部费用,其核心内容是投资估算、设计概算、修正概算、施工图预算、工程结算、竣工结算等等。-->
+  <!--            工程造价的主要任务:根据图纸、定额以及清单规范,计算出过程中所包含的直接费(人工、材料及设备、施工机具使用)等,还有企业管理费、措施费、规费、利润及税金等等。-->
+  <!--          </p>-->
+            <div class="jyb_ddetail">{{.T.data.s_content}}</div>
           </div>
-          {{end}}
-<!--          <p class="text_content">-->
-<!--            建设工程实施过程中,一般先由建设单位与施工单位签订《建设工程施工合同》,并在合同中约定工程暂定“合同价格”,此价格即为合同价格。合同价款是建设单位与施工单位在施工合同中约定的价款或者价款计算方法。这只是根据合同双方在订立合同时预想的状况所达成的意思表示。-->
-<!--            但建设工程在实际施工过程中,设计变更、工期补偿、索赔等可转化为价款的事项时有发生,最终经过竣工结算审定得出的结算价格,才是所谓的工程造价。所以,工程造价与合同价格往往不尽一致,并常常具有较大差距。-->
-<!--            工程造价具体指什么?-->
-<!--            工程造价包括工程预算,预算是按照施工图所作的工程预算造价,其价格是用的定额中材料预算价格,和实际的市场价格是有差别的。-->
-<!--            工程造价的范围很广,包括:概算、预算、结算、决算等。合同金额是指我国对外承包劳务企业开展对外承包工程、对外劳务合作和对外设计咨询业务与外商签约的合同所定金额,其口径同于合同数。工程造价的直意就是工程的建造价格。工程计价的三要素:量、价、费。-->
-<!--            广义上工程造价涵盖建设工程造价(土建专业和安装专业),公路工程造价,水运工程造价、铁路工程造价,水利工程造价,电力工程造价,通信工程造价,航空航天工程造价等。-->
-<!--            工程造价是指进行某项工程建设所花费的全部费用,其核心内容是投资估算、设计概算、修正概算、施工图预算、工程结算、竣工结算等等。-->
-<!--            工程造价的主要任务:根据图纸、定额以及清单规范,计算出过程中所包含的直接费(人工、材料及设备、施工机具使用)等,还有企业管理费、措施费、规费、利润及税金等等。-->
-<!--          </p>-->
-          <div class="jyb_ddetail">{{.T.data.s_content}}</div>
           <div class="btn_next">
             {{if .T.lastId}}<button  onclick="window.location.href='/jySite/{{.T.lastId}}.html'" >上一篇</button>{{end}}
             {{if .T.nextId}}<button  onclick="window.location.href='/jySite/{{.T.nextId}}.html'" >下一篇</button>{{end}}
@@ -116,8 +123,7 @@
           alert(pCode)
         </script>
         {{include "/site/common/slide-leave-info.html"}}
-
-        <div class="real_time_info_module">
+        <div class="real_time_info_module" style="margin-top:40px;">
           <div class="module_title">
             <span>热点资讯</span>
             <span>MORE</span>
@@ -153,6 +159,7 @@
 </section>
 </body>
 <script type="text/javascript" src='{{Msg "seo" "cdn"}}/js/public-nav.js?v={{Msg "seo" "version"}}'></script>
+<script type="text/javascript" src='{{Msg "seo" "cdn"}}/site/page/js/qrcode.min.js?v={{Msg "seo" "version"}}'></script>
 <script>
   $(function (){
     haslogin({{.T.logid}})
@@ -165,7 +172,21 @@
       $(".give_help").find("img").attr("src","{{Msg "seo" "cdn"}}/images/praise_no.png");
     }
 
+    // 分享
+    // $('.give_share').click(function() {
+    //   $('.jybk_remindone').removeClass('hidden')
+    //   $('.jybk_remindonebak').removeClass('hidden')
+    //   $('#pcShare-content').show()
+    // })
+    new pcShare();
+    $("#share-weixinF").mouseover(function(){
+      $("#share-weixin").removeClass("hidden");
+    });
+    $("#share-weixinF").mouseout(function(){
+      $("#share-weixin").addClass("hidden");
+    });
 
+    // 点赞
     $(".give_help").click(function(){
       if(ttflag){
         ttflag=false
@@ -190,6 +211,90 @@
         }
       }
     })
+    //生成二维码
+    function makeCode() {
+        $("#qrcode").empty();
+        qrcode = new QRCode(document.getElementById("share-weixin"), {
+            width: 130,
+            height: 120,
+        });
+        qrcode.makeCode(location.href);
+    }
+    makeCode()
+    //页面中分享功能
+    function pcShare(){
+      this.flag = false;
+      var thisCla = this;
+      let url = encodeURIComponent(window.location.href)
+      let title = encodeURIComponent({{.T.data.s_title}})
+      $("body").click(function(e){
+        var a = $(e.target)[0].className
+        if(e.target.id == "pcShare" || a == 'btns' || a == 'give_share_text' || a == 'icon'){
+          $("#pcShare-content").show();
+          $(".jybk_remindone").removeClass("hidden");
+          $(".jybk_remindonebak").removeClass("hidden");
+          //
+          if(!thisCla.flag){
+                  if (!window.JyGlobalConfig) {
+                    window.JyGlobalConfig = {}
+                  }
+                  window.JyGlobalConfig.SEO_CDN = {{Msg "seo" "cdn"}}
+            loadJS(window.JyGlobalConfig.SEO_CDN + "/js/bdshare.js?v=20210521.js?cdnversion="+~(-new Date()/36e5),function(){
+              var interval = setInterval(function(){
+                if($("#bdshare_weixin_qrcode_dialog").length == 1){
+                  clearInterval(interval);
+                  $("#share-weixin").append($("#bdshare_weixin_qrcode_dialog").find("table"));
+                  $("#bdshare_weixin_qrcode_dialog_bg,.bdshare_dialog_bg,.bdshare_dialog_box").remove();
+                }else{
+                  // document.getElementById('bds_weixin').click();
+                }
+              },500);
+              setTimeout(function(){
+                clearInterval(interval);
+              },60000);
+            });
+            $("#share-tsina").click(function(e){
+              // document.getElementById('bds_tsina').click();
+              window.open('https://service.weibo.com/share/share.php?title='+title+'&url='+url);
+              $("#pcShare-content").hide();
+              $(".jybk_remindone").addClass("hidden");
+              $(".jybk_remindonebak").addClass("hidden");
+            });
+            $("#share-tqq").click(function(e){
+              document.getElementById('bds_tqq').click();
+              $("#pcShare-content").hide();
+              $(".jybk_remindone").addClass("hidden");
+              $(".jybk_remindonebak").addClass("hidden");
+            });
+            $("#share-qzone").click(function(e){
+              var pic = {{.T.data.s_pic}};
+              if(pic == ""){
+                pic = {{.T.data.s_pic1}};
+              }
+              if(pic == ""){
+                pic = "https://www.jianyu360.cn/images/swordfish/sf_01_new.png?v={{Msg "seo" "version"}}";
+              }
+              // document.getElementById('bds_qzone').click();
+              window.open('https://sns.qzone.qq.com/cgi-bin/qzshare/cgi_qzshare_onekey?url='+url+'&title='+title+'&pics='+encodeURIComponent(pic)+'&summary='+encodeURIComponent({{.T.data.s_description}}));
+              $("#pcShare-content").hide();
+              $(".jybk_remindone").addClass("hidden");
+              $(".jybk_remindonebak").addClass("hidden");
+            });
+            $("#share-weixin").click(function(e){
+              document.getElementById('bds_weixin').click();
+              $("#pcShare-content").hide();
+              $(".jybk_remindone").addClass("hidden");
+              $(".jybk_remindonebak").addClass("hidden");
+            });
+            thisCla.flag = true;
+          }
+        }else if(e.target.id != "pcShare-content" && $(e.target).parents(".b-pcshare-content").attr("id") != "pcShare-content" && !$(e.target).hasClass("bdsharebuttonbox") && !$(e.target).parent().hasClass("bdsharebuttonbox")){
+          $("#pcShare-content").hide();
+          $(".jybk_remindone").addClass("hidden");
+          $(".jybk_remindonebak").addClass("hidden");
+        }
+      });
+    }
     function upordown(type){
       var upno = $(".give_help .value").text();
       $.ajax({

Энэ ялгаанд хэт олон файл өөрчлөгдсөн тул зарим файлыг харуулаагүй болно