修改样式

修改样式

.nuxt/components.d.ts

@@ -17,6 +17,7 @@ interface _GlobalComponents {
     'HomeTopTen': typeof import("../components/home/TopTen.vue")['default']
     'HomeFoot': typeof import("../components/home/foot.vue")['default']
     'HomeFoot1': typeof import("../components/home/foot1.vue")['default']
+    'HomeKefu': typeof import("../components/home/kefu.vue")['default']
     'HomePageHead': typeof import("../components/home/pageHead.vue")['default']
     'HomePageNavigation': typeof import("../components/home/pageNavigation.vue")['default']
     'HomePageNavigation1': typeof import("../components/home/pageNavigation1.vue")['default']
@@ -58,6 +59,7 @@ interface _GlobalComponents {
     'LazyHomeTopTen': typeof import("../components/home/TopTen.vue")['default']
     'LazyHomeFoot': typeof import("../components/home/foot.vue")['default']
     'LazyHomeFoot1': typeof import("../components/home/foot1.vue")['default']
+    'LazyHomeKefu': typeof import("../components/home/kefu.vue")['default']
     'LazyHomePageHead': typeof import("../components/home/pageHead.vue")['default']
     'LazyHomePageNavigation': typeof import("../components/home/pageNavigation.vue")['default']
     'LazyHomePageNavigation1': typeof import("../components/home/pageNavigation1.vue")['default']
@@ -105,6 +107,7 @@ export const HomeSlider: typeof import("../components/home/Slider.vue")['default
 export const HomeTopTen: typeof import("../components/home/TopTen.vue")['default']
 export const HomeFoot: typeof import("../components/home/foot.vue")['default']
 export const HomeFoot1: typeof import("../components/home/foot1.vue")['default']
+export const HomeKefu: typeof import("../components/home/kefu.vue")['default']
 export const HomePageHead: typeof import("../components/home/pageHead.vue")['default']
 export const HomePageNavigation: typeof import("../components/home/pageNavigation.vue")['default']
 export const HomePageNavigation1: typeof import("../components/home/pageNavigation1.vue")['default']
@@ -146,6 +149,7 @@ export const LazyHomeSlider: typeof import("../components/home/Slider.vue")['def
 export const LazyHomeTopTen: typeof import("../components/home/TopTen.vue")['default']
 export const LazyHomeFoot: typeof import("../components/home/foot.vue")['default']
 export const LazyHomeFoot1: typeof import("../components/home/foot1.vue")['default']
+export const LazyHomeKefu: typeof import("../components/home/kefu.vue")['default']
 export const LazyHomePageHead: typeof import("../components/home/pageHead.vue")['default']
 export const LazyHomePageNavigation: typeof import("../components/home/pageNavigation.vue")['default']
 export const LazyHomePageNavigation1: typeof import("../components/home/pageNavigation1.vue")['default']

.nuxt/manifest/latest.json

@@ -1 +1 @@
-{"id":"dev","timestamp":1744246823228}
+{"id":"dev","timestamp":1744261298228}

.nuxt/manifest/meta/dev.json

@@ -1 +1 @@
-{"id":"dev","timestamp":1744246823228,"matcher":{"static":{},"wildcard":{},"dynamic":{}},"prerendered":[]}
+{"id":"dev","timestamp":1744261298228,"matcher":{"static":{},"wildcard":{},"dynamic":{}},"prerendered":[]}

.nuxt/nitro.json

@@ -1,5 +1,5 @@
 {
-  "date": "2025-04-10T01:00:25.811Z",
+  "date": "2025-04-10T05:01:47.341Z",
   "preset": "nitro-dev",
   "framework": {
     "name": "nuxt",
@@ -9,9 +9,9 @@
     "nitro": "2.10.4"
   },
   "dev": {
-    "pid": 14928,
+    "pid": 14804,
     "workerAddress": {
-      "socketPath": "\\\\.\\pipe\\nitro\\worker-14928-1.sock"
+      "socketPath": "\\\\.\\pipe\\nitro\\worker-14804-1.sock"
     }
   }
 }

.nuxt/nuxt.d.ts

@@ -1,6 +1,6 @@
 // Generated by nuxi
-/// <reference types="@nuxt/telemetry" />
 /// <reference types="@nuxt/devtools" />
+/// <reference types="@nuxt/telemetry" />
 /// <reference path="types/builder-env.d.ts" />
 /// <reference types="nuxt" />
 /// <reference path="types/app-defaults.d.ts" />

assets/css/footer.less

@@ -1,244 +0,0 @@
-.index_foot{box-sizing:border-box;width: 1200px;margin: 0 auto;}
-.index_foot_name_box{margin:10px auto 0px; text-align:center;font-size:0px;}
-.index_foot_name{display:inline-block;height:67px;line-height:67px;color:#f2f9f4;font-size:51px;font-weight:bold;overflow:hidden;}
-.index_foot_name:nth-of-type(even){color:#333;font-size:32px;}
-.foot_img_box{
-    overflow:hidden;
-    display:block;
-    margin:20px auto 0;
-    width:100%; 
-    display: flex;
-    flex-wrap: wrap;
-    align-items: center;
-    justify-content: flex-start;
-}
-.foot_img_box a{
-    width:170px;
-    height:57px;
-    margin:0 0 20px 0;
-    display: block;
-}
-.foot_img_box img {
-    float: left;
-    width:170px;
-    height:57px;
-    overflow:hidden;
-    box-sizing:border-box;
-    border:solid 1px #D7EDD4;
-    display: block;
-    margin: 0 auto;
-}
-.foot_img_box a:nth-child(2){margin-left: 35px;}
-.foot_img_box a:nth-child(3){margin-left: 35px;}
-.foot_img_box a:nth-child(4){margin-left: 35px;}
-.foot_img_box a:nth-child(5){margin-left: 35px;}
-.foot_img_box a:nth-child(6){margin-left: 40px;}
-.foot_img_box a:nth-child(7){margin-left: 0;}
-.foot_img_box a:nth-child(8){margin-left: 35px;}
-.foot_img_box a:nth-child(9){margin-left: 35px;}
-.foot_img_box a:nth-child(10){margin-left: 35px;}
-.foot_img_box a:nth-child(11){margin-left: 35px;}
-.foot_img_box a:nth-child(12){margin-left: 40px;}
-.foot_img_box>* *{display: block;width:100%;height:100%;}
-.foot_img_box>*:nth-of-type(7n){margin-right:0px; }
-.foot_frind_box{ display:block;margin:11px auto;overflow:hidden;display:flex;width:100%;border-bottom:solid 2px #49A769;padding-bottom:35px;}
-.foot_frind_box span{word-break: keep-all; white-space: nowrap;line-height:22px;font-size:16px;color:#333;font-weight:bold;}
-.foot_frind_box div{width:100%;overflow:hidden; }
-.foot_frind_box div *{float:left;line-height:22px;height:22px;color:#333;font-size:16px;margin:0 30px;}
-.call_us_box{
-    display:block;width:100%;margin:40px auto 0;overflow:hidden;text-align:center;font-size:0px;background:#49A769; 
-    a {
-        color: #fff;
-    }
-}
-.call_us_box>*{height:12px;line-height:12px;color:#fff;font-size:14px;display:inline-block;box-sizing:border-box;padding:0 19px;font-weight:bold;border-left:solid 1px #5B8D54;margin:18px 0;}
-.call_us_box>*:nth-of-type(1){border-left:0px;}
-.foot_text_box{
-    margin:40px auto 0px;text-align:center;color:#333;font-size:14px;line-height:25px;
-    a {
-        color: #333;
-        font-size: 14px;
-    }
-}
-.foot_text_box_green{color:#40663B;}   
-.foot_text_box img{display:inline-block;height:20px;vertical-align:middle;}   
-.foot_logo_out{position:relative;margin:0px auto;width:100%;height:0px;}
-.foot_logo_out *{width:120px;display:block; }
-.foot_logo_out>*{position:absolute;top:-166px;}
-.foot_logo_out>*:nth-of-type(1){left:0px;}
-.foot_logo_out>*:nth-of-type(2){right:0px;}               
-.foot_last_img_box {margin:40px auto 10px;text-align:center;overflow:hidden;width:100%;font-size:0px;padding-bottom: 40px;}
-.foot_last_img_box>*{height:50px;width:150px;display:inline-block;overflow:hidden;}
-.foot_last_img_box img {
-    width: 120px;
-    height: 50px;
-}
-.foot_text_html_css :deep(a) {
-    color: #333;
-    // text-decoration: underline;
-}
-.foot_text_html_css :deep(img) {
-    margin: 0 5px;
-}
-//添加在线客服
-.kefu {
-    bottom: 100px;
-    height: 430px;
-    position: fixed;
-    right: 10px;
-    width: 100px;
-    .kefu_itemKf {
-        background-color: #fff;
-        border-radius: 10px;
-        box-shadow: 0 4px 16px #0000001a;
-        height: 100px;
-        margin-bottom: 15px;
-        text-align: center;
-        width: 100px;
-        box-sizing: border-box;
-        position: relative;
-        cursor: pointer;
-        margin-bottom: 100px;
-        a {
-            >p {
-                color: #666;
-                font-size: 14px;
-                font-weight: 500;
-                line-height: 16px;
-            }
-            >img {
-                margin-top: 15px;
-                width: 50px;
-                height:50px;
-                margin-bottom: 5px;
-            }
-        }
-    }
-    .kefu_itemQQ {
-        background-color: #fff;
-        border-radius: 10px;
-        box-shadow: 0 4px 16px #0000001a;
-        height: 100px;
-        margin-bottom: 15px;
-        text-align: center;
-        width: 100px;
-        box-sizing: border-box;
-        position: relative;
-        cursor: pointer;
-        >p {
-            color: #666;
-            font-size: 14px;
-            font-weight: 500;
-            line-height: 16px;
-        }
-        >img {
-            margin-top: 10px;
-            width: 60px;
-            height: 60px;
-        }
-        &:hover {
-            .kefu_item_content_QQ {
-                display: block;
-            }
-        }
-    }
-    .kefu_itemPhone {
-        background-color: #fff;
-        border-radius: 10px;
-        box-shadow: 0 4px 16px #0000001a;
-        height: 100px;
-        margin-bottom: 15px;
-        text-align: center;
-        width: 100px;
-        box-sizing: border-box;
-        position: relative;
-        cursor: pointer;
-        >p {
-            color: #666;
-            font-size: 14px;
-            font-weight: 500;
-            line-height: 16px;
-        }
-        >img {
-            margin-top: 10px;
-            width: 60px;
-            height: 60px;
-        }
-        &:hover {
-            .kefu_item_content_phone {
-                display: block;
-            }
-        }
-    }
-    .kefu_item_content_QQ {
-        position: absolute;
-        top: -100px;
-        right: 100px;
-        background: #fff;
-        border-radius: 10px;
-        display: none;
-        width: 190px;
-        height: 330px;
-        background: #fff;
-        box-shadow: 0 4px 16px #0000001a;
-        z-index: 99;
-        box-sizing: border-box;
-        padding: 20px;
-        img {
-            margin-bottom: 10px;
-        }
-        .qqfs {
-            margin-bottom: 20px;
-            font-size: 14px;
-            color: #333;
-        }
-        .arrow {
-            width: 0;
-            height: 0;
-            width: 0;
-            border-top: 20px solid transparent;
-            border-bottom: 20px solid transparent; 
-            border-left: 20px solid #fff; 
-            position: absolute;
-            top: 120px;
-            right: -20px;
-            transform: translateX(-50%);
-            z-index: 100;
-        }
-    }
-    .kefu_item_content_phone {
-        position: absolute;
-        top: 0;
-        right: 100px;
-        background: #fff;
-        border-radius: 10px;
-        display: none;
-        width: 190px;
-        height: 80px;
-        background: #fff;
-        box-shadow: 0 4px 16px #0000001a;
-        z-index: 99;
-        box-sizing: border-box;
-        padding: 20px;
-        text-align: left;
-        color: #333;
-        .kefu_item_content_phone_title {
-            margin-bottom: 5px;
-            font-weight: bold;
-        }
-        .arrow {
-            width: 0;
-            height: 0;
-            width: 0;
-            border-top: 20px solid transparent;
-            border-bottom: 20px solid transparent; 
-            border-left: 20px solid #fff; 
-            position: absolute;
-            top: 20px;
-            right: -20px;
-            transform: translateX(-50%);
-            z-index: 100;
-        }
-    }
-}
-

assets/css/public/footer.less

@@ -0,0 +1,226 @@
+.index_foot {
+    box-sizing: border-box;
+    width: 1200px;
+    margin: 0 auto;
+}
+
+.index_foot_name_box {
+    margin: 40px auto 0px;
+    text-align: center;
+    font-size: 0px;
+}
+
+.index_foot_name {
+    display: inline-block;
+    height: 67px;
+    line-height: 67px;
+    color: #f2f9f4;
+    font-size: 51px;
+    font-weight: bold;
+    overflow: hidden;
+}
+
+.index_foot_name:nth-of-type(even) {
+    color: #333;
+    font-size: 32px;
+}
+
+.foot_img_box {
+    overflow: hidden;
+    display: block;
+    margin: 10px auto 0;
+    width: 100%;
+    display: flex;
+    justify-content: space-between;
+    flex-wrap: wrap;
+}
+
+.foot_img_box>* {
+    float: left;
+    width: 170px;
+    height: 57px;
+    overflow: hidden;
+    margin-top: 20px;
+    // box-sizing: border-box;
+    border: solid 1px #D7EDD4;
+    // margin: 0px 25px 10px 0px;
+}
+
+.foot_img_box>* * {
+    display: block;
+    width: 100%;
+    height: 100%;
+}
+
+.foot_img_box>*:nth-of-type(7n) {
+    margin-right: 0px;
+}
+
+.foot_frind_box {
+    display: block;
+    margin: 30px auto;
+    overflow: hidden;
+    display: flex;
+    width: 100%;
+}
+
+.foot_frind_box span {
+    word-break: keep-all;
+    white-space: nowrap;
+    line-height: 22px;
+    font-size: 16px;
+    color: #333;
+    font-weight: bold;
+}
+
+.foot_frind_box div {
+    width: 100%;
+    overflow: hidden;
+}
+
+.foot_frind_box div * {
+    float: left;
+    line-height: 22px;
+    height: 22px;
+    color: #333;
+    font-size: 16px;
+    margin: 0 30px;
+}
+
+.call_us_box {
+    display: block;
+    width: 100%;
+    margin: 40px auto 0;
+    overflow: hidden;
+    text-align: center;
+    font-size: 0px;
+    background: #dd7d18;
+
+    a {
+        color: #fff;
+    }
+}
+
+.inner {
+    width: 1200px;
+    margin: 0 auto;
+}
+
+.inner>* {
+    height: 12px;
+    line-height: 12px;
+    color: #fff;
+    font-size: 14px;
+    display: inline-block;
+    box-sizing: border-box;
+    padding: 0 19px;
+    font-weight: bold;
+    border-left: solid 1px #CB7113;
+    margin: 18px 0;
+}
+
+.inner>*:nth-of-type(1) {
+    border-left: 0px;
+}
+
+.foot_text_box {
+    margin: 40px auto 0px;
+    text-align: center;
+    color: #333;
+    font-size: 14px;
+    line-height: 25px;
+
+    p {
+        a {
+            color: #333;
+            font-size: 14px;
+        }
+
+        .webSitecolor {
+            color: #dd7d18;
+        }
+    }
+}
+
+.top_content {
+    padding: 0 170px;
+}
+
+.webSitecolor {
+    color: #dd7d18;
+}
+
+
+.foot_text_box_green {
+    color: #40663B;
+}
+
+.foot_text_box img {
+    display: inline-block;
+    height: 20px;
+    vertical-align: middle;
+}
+
+.foot_logo_out {
+    position: relative;
+    margin: 0px auto;
+    width: 100%;
+    height: 0px;
+}
+
+.foot_logo_out * {
+    width: 120px;
+    display: block;
+}
+
+.foot_logo_out>* {
+    position: absolute;
+    top: -100px;
+}
+
+.foot_logo_out>*:nth-of-type(1) {
+    left: 0px;
+}
+
+.foot_logo_out>*:nth-of-type(2) {
+    right: 0px;
+}
+
+.foot_last_img_box {
+    margin: 40px auto 10px;
+    text-align: center;
+    overflow: hidden;
+    width: 100%;
+    font-size: 0px;
+    padding-bottom: 40px;
+}
+
+.foot_last_img_box>* {
+    height: 50px;
+    width: 150px;
+    margin: 0px 12px;
+    display: inline-block;
+    overflow: hidden;
+}
+
+.foot_last_img_box>* * {
+    display: block;
+    height: 100%;
+    width: 100%;
+    overflow: hidden;
+}
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+

assets/css/public/kefu.less

@@ -0,0 +1,161 @@
+//添加在线客服
+.kefu {
+  bottom: 100px;
+  height: 430px;
+  position: fixed;
+  right: 10px;
+  width: 100px;
+  .kefu_itemKf {
+      background-color: #fff;
+      border-radius: 10px;
+      box-shadow: 0 4px 16px #0000001a;
+      height: 100px;
+      margin-bottom: 15px;
+      text-align: center;
+      width: 100px;
+      box-sizing: border-box;
+      position: relative;
+      cursor: pointer;
+      margin-bottom: 100px;
+      a {
+          >p {
+              color: #666;
+              font-size: 14px;
+              font-weight: 500;
+              line-height: 16px;
+          }
+          >img {
+              margin-top: 15px;
+              width: 50px;
+              height:50px;
+              margin-bottom: 5px;
+          }
+      }
+  }
+  .kefu_itemQQ {
+      background-color: #fff;
+      border-radius: 10px;
+      box-shadow: 0 4px 16px #0000001a;
+      height: 100px;
+      margin-bottom: 15px;
+      text-align: center;
+      width: 100px;
+      box-sizing: border-box;
+      position: relative;
+      cursor: pointer;
+      >p {
+          color: #666;
+          font-size: 14px;
+          font-weight: 500;
+          line-height: 16px;
+      }
+      >img {
+          margin-top: 10px;
+          width: 60px;
+          height: 60px;
+      }
+      &:hover {
+          .kefu_item_content_QQ {
+              display: block;
+          }
+      }
+  }
+  .kefu_itemPhone {
+      background-color: #fff;
+      border-radius: 10px;
+      box-shadow: 0 4px 16px #0000001a;
+      height: 100px;
+      margin-bottom: 15px;
+      text-align: center;
+      width: 100px;
+      box-sizing: border-box;
+      position: relative;
+      cursor: pointer;
+      >p {
+          color: #666;
+          font-size: 14px;
+          font-weight: 500;
+          line-height: 16px;
+      }
+      >img {
+          margin-top: 10px;
+          width: 60px;
+          height: 60px;
+      }
+      &:hover {
+          .kefu_item_content_phone {
+              display: block;
+          }
+      }
+  }
+  .kefu_item_content_QQ {
+      position: absolute;
+      top: -100px;
+      right: 100px;
+      background: #fff;
+      border-radius: 10px;
+      display: none;
+      width: 190px;
+      height: 330px;
+      background: #fff;
+      box-shadow: 0 4px 16px #0000001a;
+      z-index: 99;
+      box-sizing: border-box;
+      padding: 20px;
+      img {
+          margin-bottom: 10px;
+      }
+      .qqfs {
+          margin-bottom: 20px;
+          font-size: 14px;
+          color: #333;
+      }
+      .arrow {
+          width: 0;
+          height: 0;
+          width: 0;
+          border-top: 20px solid transparent;
+          border-bottom: 20px solid transparent; 
+          border-left: 20px solid #fff; 
+          position: absolute;
+          top: 120px;
+          right: -20px;
+          transform: translateX(-50%);
+          z-index: 100;
+      }
+  }
+  .kefu_item_content_phone {
+      position: absolute;
+      top: 0;
+      right: 100px;
+      background: #fff;
+      border-radius: 10px;
+      display: none;
+      width: 190px;
+      height: 80px;
+      background: #fff;
+      box-shadow: 0 4px 16px #0000001a;
+      z-index: 99;
+      box-sizing: border-box;
+      padding: 20px;
+      text-align: left;
+      color: #333;
+      .kefu_item_content_phone_title {
+          margin-bottom: 5px;
+          font-weight: bold;
+      }
+      .arrow {
+          width: 0;
+          height: 0;
+          width: 0;
+          border-top: 20px solid transparent;
+          border-bottom: 20px solid transparent; 
+          border-left: 20px solid #fff; 
+          position: absolute;
+          top: 20px;
+          right: -20px;
+          transform: translateX(-50%);
+          z-index: 100;
+      }
+  }
+}

components/home/foot.vue

@@ -1,17 +1,20 @@
- <template>
+<template>
     <footer class="index_foot">
-        <div class="foot_img_box"> 
-            <a :href="item.url" v-for="(item, index) in bottomLink" :title="item.title" target="_blank">
-                <img :src="item.logo_url" :alt="item.title">
+        <div class="foot_img_box">
+            <a :href="item.url" v-for="(item, index) in bottomLink" target="_blank">
+                <img :src="item.logo_url" alt="">
             </a>
         </div>
         <div class="foot_frind_box">
-            <span>友情链接</span>	 		
+            <span>友情链接</span>
             <div>
-                <a :href="item.url" v-for="(item, index) in bottomText" :key="index" :title="item.title" target="_blank">{{ item.title }}</a>	
+                <a :href="item.url" v-for="(item, index) in bottomText" :key="index" target="_blank">{{item.title}}</a>
             </div>
         </div>
-        <div class="call_us_box">
+    </footer>
+
+    <div class="call_us_box">
+        <div class="inner">
             <span v-for="(item, index) in bottomMenu" :key="index">
                 <NuxtLink :to="{ path: `/about/${item.name_pinyin}/list-1.html` }" v-if="item.type == 1" :title="item.name">
                     {{ item.name }}
@@ -21,7 +24,9 @@
                 </NuxtLink>
             </span>
         </div>
-        <div class="foot_text_box" v-if="bottomBase">
+    </div>
+    <footer class="index_foot">
+        <div class="foot_text_box">
             <p v-html="bottomBase.statement" class="foot_text_html_css"></p>
             <p v-html="bottomBase.organizer" class="foot_text_html_css"></p>
             <p v-html="bottomBase.copyright_information" class="foot_text_html_css"></p>
@@ -51,50 +56,11 @@
         </div>
 
         <!--在线客服-->
-        <div class="kefu">
-            <div class="kefu_itemKf">
-                <a :href="bottomBase.online_service" target="_blank">
-                    <img src="https://img.bjzxtw.org.cn/pre/public/image/online1.png">
-                    <p>在线客服</p>
-                </a>
-            </div>
-            <div class="kefu_itemQQ">
-                <img src="https://img.bjzxtw.org.cn/pre/public/image/qq1.png">
-                <p>QQ客服</p>
-                <div class="kefu_item_content_QQ">
-                    <div @click="addQQFriend(qq1)" class="qqadd">
-                        <img src="https://img.bjzxtw.org.cn/pre/public/index/tubiao1.png" width="100">
-                        <div class="qqfs">{{bottomBase.customer_service_qq}}</div>
-                    </div>
-                    <div @click="addQQFriend(qq2)" class="qqadd">
-                        <img src="https://img.bjzxtw.org.cn/pre/public/index/tubiao2.png" width="100">
-                        <div class="qqfs">{{bottomBase.communications}}</div>
-                    </div>
-                    <div class="arrow"></div>
-                </div>
-            </div>
-            <div class="kefu_itemPhone">
-                <img src="https://img.bjzxtw.org.cn/pre/public/image/dianhua1.png">
-                <p>电话客服</p>
-                <div class="kefu_item_content_phone">
-                    <div class="kefu_item_content_phone_title">联系电话：</div>
-                    <div>{{bottomBase.customer_service}}</div>
-                    <div class="arrow"></div>
-                </div>
-            </div>
-        </div>
- 	</footer>	
+        <HomeKefu :bottomBase="bottomBase" />
+    </footer>
 </template>
-
+ 
 <script setup>
-//0.添加网站客服 start---------------------------------------->
-//添加网站客服
-function addQQFriend(qqNumber) {
-    // 使用tencent协议唤起QQ客户端并添加好友
-    window.location.href = `tencent://message/?uin=${qqNumber}&Site=&Menu=yes`;
-}
-//0.添加网站客服 end---------------------------------------->
-
 //获得底部基本信息 start---------------------------------------->
 //1.获得全部友情链接与底部图片
 const bottomLink = ref([])
@@ -103,9 +69,6 @@ const bottomphoto = ref([])
 const bottomMenu = ref([])
 const bottomBase = ref({})
 
-const qq1 = ref("")
-const qq2 = ref("")
-
 async function getModelDataAll() {
     const mkdata =  await requestDataPromise('/web/getWebsiteFootAll', {
         method: 'GET',
@@ -137,5 +100,6 @@ getModelDataAll();
 </script>
 
 <style lang="less" scoped>
-    @import '@/assets/css/footer.less';
+    @import '@/assets/css/public/footer.less';
+    @import '@/assets/css/public/kefu.less';
 </style>

components/home/foot1.vue

@@ -126,5 +126,5 @@ getModelDataAll();
 </script>
 
 <style lang="less" scoped>
-    @import '@/assets/css/footer.less';
+    @import '@/assets/css/public/footer.less';
 </style>

components/home/kefu.vue

@@ -0,0 +1,53 @@
+<template>
+  <!--在线客服-->
+  <div class="kefu">
+    <div class="kefu_itemKf">
+      <a :href="bottomBase.online_service" target="_blank">
+          <img src="https://img.bjzxtw.org.cn/pre/public/image/online1.png">
+          <p>在线客服</p>
+      </a>
+    </div>
+    <div class="kefu_itemQQ">
+      <img src="https://img.bjzxtw.org.cn/pre/public/image/qq1.png">
+      <p>QQ客服</p>
+      <div class="kefu_item_content_QQ">
+          <div @click="addQQFriend(qq1)" class="qqadd">
+              <img src="https://img.bjzxtw.org.cn/pre/public/index/tubiao1.png" width="100">
+              <div class="qqfs">{{bottomBase.customer_service_qq}}</div>
+          </div>
+          <div @click="addQQFriend(qq2)" class="qqadd">
+              <img src="https://img.bjzxtw.org.cn/pre/public/index/tubiao2.png" width="100">
+              <div class="qqfs">{{bottomBase.communications}}</div>
+          </div>
+          <div class="arrow"></div>
+      </div>
+    </div>
+    <div class="kefu_itemPhone">
+      <img src="https://img.bjzxtw.org.cn/pre/public/image/dianhua1.png">
+      <p>电话客服</p>
+      <div class="kefu_item_content_phone">
+          <div class="kefu_item_content_phone_title">联系电话：</div>
+          <div>{{bottomBase.customer_service}}</div>
+          <div class="arrow"></div>
+      </div>
+    </div>
+  </div>
+</template>
+
+<script setup>
+  const props = defineProps({
+    bottomBase: {
+      type: Object,
+      required: true
+    }
+  })
+  //添加网站客服
+  function addQQFriend(qqNumber) {
+      // 使用tencent协议唤起QQ客户端并添加好友
+      window.location.href = `tencent://message/?uin=${qqNumber}&Site=&Menu=yes`;
+  }
+</script>
+
+<style lang="less" scoped>
+  @import url('@/assets/css/public/kefu.less');
+</style>

components/home/pageHead.vue

@@ -323,5 +323,5 @@ onMounted(async () => {
 </script>
 
 <style lang="less" scoped>
-    @import url('@/assets/css/head.less');
+    @import url('@/assets/css/public/head.less');
 </style>