chore: PC杂项更新(App组件/筹码图片/更新服务/入口页/socket.io)

Generated with [Claude Code](https://claude.ai/code)
via [Happy](https://happy.engineering)

Co-Authored-By: Claude <noreply@anthropic.com>
Co-Authored-By: Happy <yesreply@happy.engineering>
This commit is contained in:
li
2026-03-22 12:56:10 +08:00
co-authored by Claude Happy
parent 1fe554f907
commit cd64a1c073
5 changed files with 104 additions and 8 deletions
+13
View File
@@ -1,12 +1,17 @@
<template> <template>
<div id="app" @click="getLastTime"> <div id="app" @click="getLastTime">
<router-view/> <router-view/>
<CustomerServiceWindow ref="csWindow" />
</div> </div>
</template> </template>
<script> <script>
import { mapState } from 'vuex' import { mapState } from 'vuex'
import CustomerServiceWindow from './components/updateService/CustomerServiceWindow.vue'
export default { export default {
name: 'App', name: 'App',
components: {
CustomerServiceWindow
},
data(){ data(){
return { return {
routeName: null, routeName: null,
@@ -18,6 +23,14 @@ export default {
mounted: function() { mounted: function() {
var _this=this; var _this=this;
// 监听打开客服窗口的全局事件
this.$root.$on('openCustomerService', () => {
if (this.$refs.csWindow) {
this.$refs.csWindow.open();
}
});
clearInterval(window['checkLoginTime']); clearInterval(window['checkLoginTime']);
setTimeout(function(){ setTimeout(function(){
Binary file not shown.

Before

Width:  |  Height:  |  Size: 86 KiB

After

Width:  |  Height:  |  Size: 82 KiB

@@ -2,11 +2,22 @@
<div class="updatepwd animated bounceInUp" > <div class="updatepwd animated bounceInUp" >
<div class="title"> {{Language.tip_service}} <button class="close-btn" @click="offPop()"> {{Language.close}}</button></div> <div class="title"> {{Language.tip_service}} <button class="close-btn" @click="offPop()"> {{Language.close}}</button></div>
<div class="lang-set-box"> <div class="lang-set-box">
<span class="title">點擊以下圖片聯繫在線客服</span> <span class="title">在线客服</span>
<a :href="webconfig.customerLink+'&username='+userInfo.nickname+'&nickname='+userInfo.nickname" target="_blank"> <div class="service-options">
<img class="s-code" :src="webconfig.ServerQrcode||''"></a> <button class="service-btn" @click="openChatWindow">
<i class="icon">💬</i>
<span>在线聊天</span>
</button>
<a v-if="webconfig.customerLink" :href="webconfig.customerLink+'&username='+userInfo.nickname+'&nickname='+userInfo.nickname" target="_blank" class="service-btn">
<i class="icon">🔗</i>
<span>外部客服</span>
</a>
</div>
<div v-if="webconfig.ServerQrcode" class="qrcode-section">
<span class="subtitle">扫码联系客服</span>
<img class="s-code" :src="webconfig.ServerQrcode">
</div>
</div> </div>
</div> </div>
</template> </template>
<script> <script>
@@ -28,6 +39,13 @@ export default {
this.$store.dispatch('updatemainPop',{type:'',ishow:false}); this.$store.dispatch('updatemainPop',{type:'',ishow:false});
}, },
openChatWindow(){
// 关闭当前弹窗
this.offPop();
// 通过全局事件打开客服窗口(App.vue中的组件)
this.$root.$emit('openCustomerService');
}
}, },
computed: { computed: {
...mapState(['webconfig','Language','userInfo']) ...mapState(['webconfig','Language','userInfo'])
@@ -41,8 +59,33 @@ export default {
</script> </script>
<!-- Add "scoped" attribute to limit CSS to this component only --> <!-- Add "scoped" attribute to limit CSS to this component only -->
<style scoped> <style scoped>
.s-code{ width: 100%;} .s-code{ width: 200px; margin-top: 10px;}
.lang-set-box{padding: 10px; min-height: 100px; text-align: center; margin-top:-35px} .lang-set-box{padding: 20px; min-height: 100px; text-align: center; margin-top:-35px}
.lang-set-box .title{display: block; font-size: 18px; font-weight: bold; color: #fff; margin-bottom: 20px;}
.lang-set-box .subtitle{display: block; font-size: 14px; color: #d9ac6b; margin-top: 20px; margin-bottom: 10px;}
.service-options{display: flex; justify-content: center; gap: 20px; margin-bottom: 20px;}
.service-btn{
display: flex;
flex-direction: column;
align-items: center;
justify-content: center;
width: 120px;
height: 100px;
background: linear-gradient(135deg, #667eea 0%, #764ba2 100%);
border: none;
border-radius: 10px;
color: #fff;
cursor: pointer;
transition: transform 0.2s;
text-decoration: none;
}
.service-btn:hover{transform: translateY(-3px); box-shadow: 0 5px 15px rgba(0,0,0,0.3);}
.service-btn .icon{font-size: 32px; margin-bottom: 8px;}
.service-btn span{font-size: 14px; font-weight: bold;}
.qrcode-section{margin-top: 20px;}
.updatepwd .btn-item.lang-btn{background: #ccc;} .updatepwd .btn-item.lang-btn{background: #ccc;}
.updatepwd .btn-item.lang-btn.active{ color: #0a4629; .updatepwd .btn-item.lang-btn.active{ color: #0a4629;
background-color: #00e45f; background-color: #00e45f;
+2 -2
View File
@@ -12,10 +12,10 @@
<img src="../common/image/entrance/electricthrow.jpg"> <img src="../common/image/entrance/electricthrow.jpg">
<span class="btn" >電投登錄入口</span> <span class="btn" >電投登錄入口</span>
</div> --> </div> -->
<div class="item right" :class="{'hover':itemIndex==3}" @click="goUrl(2,webconfig.agentUrl)" @mouseenter="ItemHover(3)" @mouseleave="ItemHover(2)"> <!-- <div class="item right" :class="{'hover':itemIndex==3}" @click="goUrl(2,webconfig.agentUrl)" @mouseenter="ItemHover(3)" @mouseleave="ItemHover(2)">
<img src="../common/image/entrance/agent.jpg"> <img src="../common/image/entrance/agent.jpg">
<span class="btn" >代理端登錄入口</span> <span class="btn" >代理端登錄入口</span>
</div> </div> -->
<img class="qrcode animated slideInUp" :src="webconfig.entranceQrcode"> <img class="qrcode animated slideInUp" :src="webconfig.entranceQrcode">
</div> </div>
</template> </template>
+40
View File
@@ -266,6 +266,46 @@ const mutations = {
$store.dispatch("updateOneTab", { sendMode, ...data }); $store.dispatch("updateOneTab", { sendMode, ...data });
} }
}, },
// 客服系统 - 连接成功
socket_chat_connected(state, data) {
console.log('[Vuex] 收到 chat.connected 事件:', data);
// 触发自定义事件,让组件可以监听
if (window.__chatConnectedCallback) {
window.__chatConnectedCallback(data);
}
},
// 客服系统 - 会话分配
socket_chat_session_assigned(state, data) {
console.log('[Vuex] 收到 chat.session.assigned 事件:', data);
if (window.__chatSessionAssignedCallback) {
window.__chatSessionAssignedCallback(data);
}
},
// 客服系统 - 新消息
socket_chat_message_new(state, data) {
console.log('[Vuex] 收到 chat.message.new 事件:', data);
if (window.__chatMessageNewCallback) {
window.__chatMessageNewCallback(data);
}
},
// 客服系统 - 会话结束
socket_chat_session_ended(state, data) {
console.log('[Vuex] 收到 chat.session.ended 事件:', data);
if (window.__chatSessionEndedCallback) {
window.__chatSessionEndedCallback(data);
}
},
// 客服系统 - 离线通知
socket_chat_offline_notice(state, data) {
console.log('[Vuex] 收到 chat.offline_notice 事件:', data);
if (window.__chatOfflineNoticeCallback) {
window.__chatOfflineNoticeCallback(data);
}
},
// 客服系统 - 心跳响应
socket_chat_pong(state, data) {
// 心跳响应,不需要处理
},
}; };
const actions = { const actions = {