Browse Source

feat:右侧客服栏添加客服企微

zhangsiya 1 year ago
parent
commit
a07b95a100

BIN
src/web/staticres/images/index/new/wework.png


+ 11 - 1
src/web/staticres/js/login.js

@@ -174,6 +174,11 @@ function toggleLoginDom (type) {
     $("#public-nav .fl").addClass('fix-work')
     // 客服入口显示
     $('#go-customer-4').show()
+    // 客服企微展示
+    $('#customer-wework').show()
+    // 登录后客服间隔(样式)
+    $('#login-custom-gap').show()
+    $('#right-side-swhz').addClass('b-radius-left-top')
   } else {
     $("#public-nav .nav-avatar").hide()
     $("#public-nav .work-link").hide()
@@ -181,6 +186,11 @@ function toggleLoginDom (type) {
     $("#login .loginBtn").show()
     // 客服入口隐藏
     $('#go-customer-4').hide()
+    // 客服企微隐藏
+    $('#customer-wework').hide()
+    // 登录后客服间隔(样式)隐藏
+    $('#login-custom-gap').hide()
+    $('#right-side-swhz').removeClass('b-radius-left-top')
   }
 }
 //
@@ -1223,7 +1233,7 @@ $(function(){
               document.querySelector(setPassArr[i]).style.display = (type ? 'block' : 'none')
             }
           }
-          
+
         },
         ajaxRegister: function (e, arr) {
           var source =	 getParam("source");//百度SEM

+ 62 - 0
src/web/staticres/public-pc/css/pc-bottom.css

@@ -284,6 +284,7 @@
   cursor: pointer;
 }
 
+
 /* .right-side-box .right-side-pop::before {
   content: "客服热线:400-108-6670   服务时间:工作日 9:00-17:40";
   position: absolute;
@@ -578,6 +579,67 @@
     display: block;
 }
 
+.right-side-box .right-side-wework {
+    border-radius: 0 0 0 10px;
+    position: relative;
+    width: 100%;
+    height: 80px;
+    background: linear-gradient(180deg, #F1F4F9 0%, #fff 100%);
+    border-top: 2px solid #FFF;
+    border-left: 2px solid #FFF;
+    box-sizing: border-box;
+    cursor: pointer;
+    padding-top: 10px;
+}
+.right-side-box .right-side-wework .text-customer {
+    text-align: center !important;
+}
+.right-side-box .right-side-wework .text-customer img{
+    width: 28px;
+    height: 28px;
+}
+.right-side-box .right-side-wework .desc_text{
+    font-size: 13px;
+    line-height:20px;
+    color: #1d1d1d;
+}
+.right-side-wework .kf-wework {
+    display: none;
+    width:144px;
+    height:154px;
+    min-width:144px;
+    top: 6px;
+    font-size: 14px;
+    line-height: 22px;
+    left: -162px;
+    color: #1D1D1D;
+    background: linear-gradient(180deg, #F1F4F8 0%, #FEFEFF 100%);
+    border: 2px solid #FFFFFF;
+    box-shadow: 0px 0px 20px rgba(8, 31, 38, 0.12);
+    border-radius: 8px;
+    box-sizing: border-box;
+    text-align: center;
+    padding: 12px 20px;
+}
+.right-side-wework .kf-wework img {
+    width: 104px;
+    height:104px;
+}
+.right-side-wework .kf-wework p {
+    font-size: 14px;
+    line-height: 22px;
+    color:#1d1d1d;
+    text-align: center;
+    margin-top:4px;
+}
+
+#login-custom-gap{
+    height:16px;
+    background: transparent
+}
+.right-side-box .b-radius-left-top {
+   border-top-left-radius: 10px !important;
+}
 
 @media all and (-ms-high-contrast: none),
 (-ms-high-contrast: active) {

+ 35 - 1
src/web/staticres/public-pc/js/pc-bottom.js

@@ -223,6 +223,30 @@ $(window).on('click', function (e) {
     }
   }
 })
+
+/**
+ * 获取客服二维码
+ */
+window.kefu = {
+  name: '',
+  remark: "专属客服",
+  wxer: ''
+}
+function getKefuInfo () {
+  $.ajax({
+    type: 'post',
+    url: '/bigmember/use/getCustom',
+    data: { type: "kf" },
+    success: function (res) {
+      if (res && res.data) {
+        const resData = res.data || {}
+        window.kefu = resData
+      }
+    }
+  })
+}
+getKefuInfo()
+
 $(function () {
   function getDomScreenHeight () {
     var clientHeight = [document.documentElement.clientHeight, document.body.clientHeight, window.screen.availHeight, window.screen.height]
@@ -302,6 +326,14 @@ $(function () {
   },function() {
     $('.right-side-box .kf-phone').hide()
   })
+
+  // 右侧客服企微
+  $('.right-side-wework').hover(function(e) {
+    $('.right-side-box .kf-wework img').attr('src', window.kefu.wxer)
+    $('.right-side-box .kf-wework').show()
+  },function() {
+    $('.right-side-box .kf-wework').hide()
+  })
 });
 ;(function(){
   // 动态设置copyright
@@ -350,6 +382,8 @@ $(function () {
     stypesearch(stype);
   })
 })();
+
+
 function zbsqClose(){
   $("#bidcommunity").modal("hide");
 }
@@ -456,4 +490,4 @@ function renderBottomCustomer (obj) {
   }
   $('.config_classify_r_box').append(html)
 }
-/** SEO优化-pcbottom.html内js迁移 END */
+/** SEO优化-pcbottom.html内js迁移 END */

+ 13 - 1
src/web/templates/common/pcbottom.html

@@ -155,7 +155,19 @@
             </div>
           </div> -->
       </div>
-      <div class="right-side-phone right-side-wx common-right-side-item">
+        <div class="right-side-wework  common-right-side-item" id="customer-wework" style="display:none;">
+            <p class="text-customer">
+              <img src='{{Msg "seo" "cdn"}}/images/index/new/wework.png?v={{Msg "seo" "version"}}' alt="">
+            </p>
+            <p class="desc_text">客服企微</p>
+            <div class="silde-float kf-wework">
+                <img class="qrcode" src="" alt="">
+                <p>微信扫一扫</p>
+            </div>
+        </div>
+<!--        登录后的间隔-->
+       <div id="login-custom-gap"></div>
+      <div class="right-side-phone right-side-wx common-right-side-item" id="right-side-swhz">
           <span class="text-customer"><img src='{{Msg "seo" "cdn"}}/images/index/new/shangwuhezuo.png?v={{Msg "seo" "version"}}' alt=""></span>
           <span class="text-customer text-customer-hover"><img src='{{Msg "seo" "cdn"}}/images/index/new/shangwuhezuo-blue.png?v={{Msg "seo" "version"}}' alt=""></span>
           <p class="desc_text_b">商务合作</p>