增加在线客服

src/App.vue

@@ -3,6 +3,7 @@
     <common-header :class="{'home-bg' : isHome}"></common-header>
     <main>
       <router-view></router-view>
+
     </main>
     <common-footer></common-footer>
   </div>

src/assets/img/cs_w.svg

@@ -0,0 +1 @@
+<?xml version="1.0" standalone="no"?><!DOCTYPE svg PUBLIC "-//W3C//DTD SVG 1.1//EN" "http://www.w3.org/Graphics/SVG/1.1/DTD/svg11.dtd"><svg t="1723032135095" class="icon" viewBox="0 0 1024 1024" version="1.1" xmlns="http://www.w3.org/2000/svg" p-id="1584" xmlns:xlink="http://www.w3.org/1999/xlink" width="200" height="200"><path d="M414.866 996.381c19.911 8.693 44.744 18.287 68.461 22.893l36.794 4.502c4.54 0.232 20.314 0.275 23.646 0.145 0 0 18.786-0.086 36.721-4.111 17.935-4.027 47.19-12.381 69.423-23.109 0 0 37.7-21.762 79.459-53.764 41.759-32.004 102.539-119.213 133.36-194.886 43.178-9.57 82.752-45.509 89.268-124.671 6.169-74.586-16.623-107.818-47.205-122.297-0.324-8.876-0.752-17.593-1.281-26.078 39.336-217.806-116.266-293.913-128.436-297.604-20.272-30.801-157.642-218.141-406.87-66.06-36.49 22.256-94.402 66.087-125.323 110.25-37.185 46.697-64.212 114.261-75.281 211.927-7.667 0.825-15.335 2.027-22.893 3.736-2.013-47.928 0.622-189.179 90.137-289.598 66.21-74.252 166.7-111.915 298.611-111.915 132.158 0 234.697 37.952 304.874 112.784 115.23 122.92 104.833 306.365 104.719 308.189-0.639 9.832 6.805 18.347 16.651 18.983 0.405 0.029 0.81 0.058 1.187 0.058 9.34 0 17.202-7.254 17.812-16.681 0.55-8.124 11.756-200.315-114.073-334.746C787.427 41.838 676.011 0.006 533.457 0.006c-142.691 0-252.203 41.76-325.486 124.121-107.157 120.4-101.395 287.049-98.398 325.84-41.701 22.285-71.854 70.821-63.291 174.7 11.288 136.893 90.76 184.604 165.933 184.604 14.604 0 27.52-3.156 38.887-8.949 43.032 27.859 112.096 51.982 222.742 56.501 10.854 16.319 33.601 27.556 59.947 27.556 36.801 0 66.665-21.98 66.665-49.059 0-27.077-29.864-49.043-66.665-49.043-30.009 0-55.385 14.566-63.748 34.621-72.588-3.461-124.585-15.798-161.726-31.334-50.687-68.156-74.803-183.895-74.803-250.01 0-24.456 0.767-47.204 2.215-68.388 234.438 7.862 373.763-86.923 449.977-169.255 98.058 97.753 132.976 230.012 144.575 293.231-22.705 173.455-146.385 357.523-296.49 357.523-64.572 0-124.267-34.057-173.122-86.678-49.897-10.453-91.491-26.758-124.52-48.854 26.97 48.233 65.487 98.022 99.122 125.628s59.684 44.927 79.595 53.62z" fill="#ffffff" p-id="1585"></path></svg>

src/components/CommonFooter.vue

@@ -1,6 +1,11 @@
 <template>
   <!-- colto-section -->
   <footer class="footer" @click="toggleMenu($event,2)">
+    <!-- customer service zone -->
+    <div class="cszone">
+      <a href="javascript:void(0);" @click="scbox()"><img src="../assets/img/cs_w.svg"></a>
+    </div>
+
     <div class="content">
       <div class="footer-upper-section">
         <!-- logo -->
@@ -258,11 +263,19 @@
       </div>
       <div class="footer-right">
         <div style="font-size: 20px;">{{ $t("homeNewText.bb39",{name:'BTCEXCOIN'}) }}</div>
-		<router-link class="jump_btn" to="/sign-up" v-if="!isLogin">{{ $t("homeNewText.bb43") }}</router-link>
+        <router-link class="jump_btn" to="/sign-up" v-if="!isLogin">{{ $t("homeNewText.bb43") }}</router-link>
         <router-link class="jump_btn" to="/exchange" v-else>{{ $t("homeNewText.bb42") }}</router-link>
         <img src="@/assets/img/home/btcex1.png" alt="" style="width: 120px;height: 120px;">
         <div style="font-size: 16px; color: #9c9c9c;margin-top: 12px;">{{ $t("homeNewText.bb40",{name:'BTCEXCOIN'}) }}</div>
       </div>
+
+
+      <!-- this customer service popup -->
+      <div class="cspopup" :class='{"hidden":ispopup?"":"none"}'>
+        <a href="javascript:void(0);" class="close_btn" @click="closebox();">x</a>
+        <iframe width="100%" height="100%" class="my-modal-body" src="https://cs.btcaholic.com/chat/?toid=2" frameborder="0"></iframe>
+      </div>
+
     </div>
   </footer>
 </template>
@@ -287,6 +300,7 @@ export default {
         { src: "https://www.rsncoin.com/static/flag/vk.png" },
         { src: "https://www.rsncoin.com/static/flag/youtube.jpg" },
       ],
+      ispopup:false, // customer service box 
       langList: [
         // {
         //     value: "cn", // zh-CN
@@ -371,9 +385,9 @@ export default {
     },
   },
   methods: {
-	Jump(vle){
+    Jump(vle){
-		this.$router.push(vle);
+      this.$router.push(vle);
-	},
+    },
     toggleMenu(e, type){
       e.stopPropagation();
       if(type===2){
@@ -400,6 +414,7 @@ export default {
         })
         .catch((err) => {});
     },
+    //
     getServiceLink() {
       College.getServiceList()
         .then((list) => {
@@ -419,6 +434,19 @@ export default {
         })
         .catch((err) => {});
     },
+    // scbox 
+    scbox(e){
+      this.ispopup = ! this.ispopup
+      console.log("dd",this.ispopup)
+    },
+    // close
+    closebox(){
+      if(this.ispopup){
+        this.ispopup = false
+      }
+      this.ispopup =false
+    }
+
   },
   created() {
     this.getCollegeLinks();
@@ -432,7 +460,23 @@ export default {
 .footer {
   background-color: #121212;
   border-top: none;
-  
+  position:relative;
+
+  .cszone{
+    width:60px;
+    position:fixed;
+    bottom:10%;
+    right:26px;
+    z-index:999;
+  }
+
+  .cszone img{
+    text-align:center;
+    width:48px;
+    height:48px;
+  }
+
+
   .content{
     display: flex;
     justify-content: space-between;
@@ -564,6 +608,27 @@ export default {
     }
   }
 
+  .cspopup{
+    .close_btn{
+      // width:20px;
+      height:20px;
+      font-size:18px;
+      line-height:20px;
+      text-align:right;
+      display:block;
+    }
+    position:fixed;
+    top:40%;
+    left:35%;
+    width:560px;
+    height:560px;
+    z-index:999;
+  }
+
+}
+
+.hidden{
+  display:none;
 }
 
 .serviceText{
@@ -629,4 +694,6 @@ export default {
 		display: none;
 	}
 }
+
+
 </style>

src/components/CommonHeader.vue

@@ -224,8 +224,10 @@
                     </template>
                 </ul>
             </div>
-            <!-- <a href="http://b.qiyeim.com:98/kefu.html?username=admin">
+            <!-- customer service  -->
-                <img class="kefu" src="../assets/img/logo-light.png" alt="">
+            <!-- <a href="https://sc.btcaholic.com/chat/?toid=2">
+                <img class="kefu" src="logo-light.png" alt="">
+                <span style="color:#fff;font-size:26px;">22222</span>
             </a> -->
         </nav>
     </header>

src/views/cszone/index.vue

@@ -0,0 +1,5 @@
+<template>
+    <div class="czone">
+        sss
+    </div>
+</template>