Compare commits

...

12 Commits

11 changed files with 1843 additions and 4302 deletions

View File

@@ -65,6 +65,10 @@ export default {
componentRefresh() {
return this.$store.state.componentRefresh;
},
// AI客服配置
globalAIKefuConfig() {
return this.$store.state.globalAIKefuConfig;
},
// 客服配置
servicerConfig() {
return this.$store.state.servicerConfig;

File diff suppressed because it is too large Load Diff

View File

@@ -183,13 +183,17 @@ export default {
});
},
methods: {
/**
* 初始化多语言配置
*/
initLanguage() {
this.langList = this. $langConfig.list();
this.langList = this.$langConfig.list();
this.langIndexMap = {};
for (let i = 0; i < this.langList.length; i++) {
this.langIndexMap[i] = this.langList[i].value;
}
const savedLang = uni.getStorageSync('lang');
const savedLang = this.$langConfig.getCurrentLocale();
if (savedLang) {
for (let i = 0; i < this.langList.length; i++) {
if (this.langList[i].value === savedLang) {
@@ -201,23 +205,37 @@ export default {
this.currentLangIndex = 0;
}
},
/**
* 电话联系客服
*/
call() {
if (this.tel) {
uni.makePhoneCall({ phoneNumber: this.tel + '' });
} else {
uni.showToast({ title: '暂无联系电话', icon: 'none' });
}
this.customerService.makePhoneCall(this.tel);
},
/**
* 切换中英文语言,并刷新当前页面(保留所有参数)
*/
toggleLanguage() {
this.currentLangIndex = this.currentLangIndex === 0 ? 1 : 0;
const targetLang = this.langIndexMap[this.currentLangIndex];
this. $langConfig.change(targetLang);
if (uni.getSystemInfoSync().platform === 'browser') {
setTimeout(() => {
window.location.reload();
}, 100);
}
// 调用语言切换逻辑(设置 storage + 清空缓存)
this.$langConfig.change(targetLang);
},
/**
* 打开 AI 智能助手
*/
openAIChat() {
this.$util.redirectTo(this.$util.AI_CHAT_PAGE_URL);
},
/**
* 打开客服选择对话框
*/
openCustomerSelectPopup() {
this.customerService.openCustomerSelectPopupDialog();
},
// ✅ 核心方法:统一客服入口
@@ -312,7 +330,7 @@ export default {
}
</script>
<style scoped>
<style lang="scss" scoped>
.fixed-box {
position: fixed;
right: 0rpx;
@@ -333,16 +351,27 @@ export default {
}
.btn-item {
display: flex;
justify-content: center;
text-align: center;
flex-direction: column;
line-height: 1;
margin: 14rpx 0;
transition: 0.1s;
color: var(--hover-nav-text-color);
border-radius: 40rpx;
width: 80rpx;
height: 80rpx;
background: #fff;
border-radius: 50%;
display: flex;
align-items: center;
justify-content: center;
margin: 14rpx 0;
box-shadow: 0 2rpx 8rpx rgba(0,0,0,0.1);
padding: 0;
overflow: hidden;
}
/* 定义共同的背景颜色 */
.common-bg {
background-color: var(--hover-nav-bg-color);
/* 使用变量以保持一致性 */
}
.btn-item text {
font-size: 28rpx;
}
@@ -357,7 +386,6 @@ export default {
justify-content: center;
align-items: center;
margin: 14rpx 0;
background: #fff;
border-radius: 50rpx;
width: 80rpx;
height: 80rpx;
@@ -371,21 +399,7 @@ export default {
font-weight: bold;
}
.unread-badge {
position: absolute;
top: -5rpx;
right: -5rpx;
background-color: #ff4544;
color: white;
border-radius: 20rpx;
min-width: 30rpx;
height: 30rpx;
font-size: 20rpx;
line-height: 30rpx;
text-align: center;
padding: 0 8rpx;
box-shadow: 0 2rpx 10rpx rgba(255, 69, 68, 0.3);
}
.ai-icon {
font-size: 40rpx;

View File

@@ -104,7 +104,7 @@
},
"router" : {
"mode" : "history",
"base" : "/hwappx/2811/"
"base" : "/hwappx/common/"
},
"title" : "",
"devServer" : {

View File

@@ -321,6 +321,12 @@
"navigationBarTitleText": "AI 客服"
}
},
{
"path": "agreement/contenr",
"style": {
"navigationBarTitleText": ""
}
},
{
"path": "vr/index",
"style": {
@@ -912,16 +918,22 @@
},
//******************文件模块******************
{
"path": "files/list",
"style": {
// #ifdef APP-PLUS
"navigationStyle": "custom",
// #endif
"navigationBarTitleText": "查看文件"
}
"path": "files/list",
"style": {
// #ifdef APP-PLUS
"navigationStyle": "custom",
// #endif
"navigationBarTitleText": "查看文件"
}
]
}
},
{
"path": "file-preview/file-preview",
"style": {
"navigationBarTitleText": "文件预览"
}
}
]
}
],
"globalStyle": {
"navigationBarTextStyle": "black",

View File

@@ -1,167 +1,159 @@
<template>
<view :style="themeColor">
<view :style="{ backgroundColor: bgColor, minHeight: openBottomNav ? 'calc(100vh - 55px)' : '' }"
class="page-img">
<view class="site-info-box"
v-if="$util.isWeiXin() && followOfficialAccount && followOfficialAccount.isShow && wechatQrcode">
<view class="site-info">
<view class="img-box" v-if="siteInfo.logo_square">
<image :src="$util.img(siteInfo.logo_square)" mode="aspectFill"></image>
</view>
<view class="info-box" :style="{ color: '#ffffff' }">
<text class="font-size-base">{{ siteInfo.site_name }}</text>
<text>{{ followOfficialAccount.welcomeMsg }}</text>
</view>
</view>
<view class="dite-button" @click="officialAccountsOpen">{{ isEnEnv ? 'Follow Official Account' : '关注公众号'
}}</view>
</view>
<view :style="themeColor">
<view :style="{ backgroundColor: bgColor, minHeight: openBottomNav ? 'calc(100vh - 55px)' : '' }"
class="page-img">
<view class="site-info-box"
v-if="$util.isWeiXin() && followOfficialAccount && followOfficialAccount.isShow && wechatQrcode">
<view class="site-info">
<view class="img-box" v-if="siteInfo.logo_square">
<image :src="$util.img(siteInfo.logo_square)" mode="aspectFill"></image>
</view>
<view class="info-box" :style="{ color: '#ffffff' }">
<text class="font-size-base">{{ siteInfo.site_name }}</text>
<text>{{ followOfficialAccount.welcomeMsg }}</text>
</view>
</view>
<view class="dite-button" @click="officialAccountsOpen">{{ isEnEnv ? 'Follow Official Account' : '关注公众号'
}}</view>
</view>
<diy-index-page v-if="topIndexValue" ref="indexPage" :value="topIndexValue" :bgUrl="safeBgUrl"
:scrollTop="scrollTop" :diyGlobal="diyData.global" class="diy-index-page">
<template v-slot:components>
<diy-group ref="diyGroup" v-if="diyData.value" :diyData="diyData" :scrollTop="scrollTop"
:haveTopCategory="true" :followOfficialAccount="followOfficialAccount" />
</template>
<template v-slot:default>
<ns-copyright v-show="isShowCopyRight" />
</template>
</diy-index-page>
<!-- <view class="page-header" v-if="diyData.global && diyData.global.navBarSwitch" :style="{ backgroundImage: bgImg }">
<ns-navbar :title-color="textNavColor" :data="diyData.global" :scrollTop="scrollTop" :isBack="false"/>
</view> -->
<view v-else class="bg-index"
:style="{ backgroundImage: backgroundUrlStyle, paddingTop: paddingTop, marginTop: marginTop }">
<diy-group ref="diyGroup" v-if="diyData.value" :diyData="diyData" :scrollTop="scrollTop"
:followOfficialAccount="followOfficialAccount" />
<ns-copyright v-show="isShowCopyRight" />
</view>
<diy-index-page v-if="topIndexValue" ref="indexPage" :value="topIndexValue" :bgUrl="bgUrl"
:scrollTop="scrollTop" :diyGlobal="diyData.global" class="diy-index-page">
<template v-slot:components>
<diy-group ref="diyGroup" v-if="diyData.value" :diyData="diyData" :scrollTop="scrollTop"
:haveTopCategory="true" :followOfficialAccount="followOfficialAccount" />
</template>
<template v-slot:default>
<ns-copyright v-show="isShowCopyRight" />
</template>
</diy-index-page>
<template v-if="adv.advshow != -1">
<view @touchmove.prevent.stop>
<uni-popup ref="uniPopupWindow" type="center" class="wap-floating" :maskClick="false">
<view class="small-bot">
<swiper autoplay="true" :circular="true" indicator-active-color="#fff"
indicator-color="rgba(255,255,255,0.6)" :indicator-dots="true" interval="3000">
<swiper-item v-for="(item, index) in adv.list" :key="index">
<image class="slide-image" @click="$util.diyRedirectTo(item.link)" height="100%"
:src="$util.img(item.imageUrl)" width="100%"></image>
</swiper-item>
</swiper>
<view class="small-bot-close" @click="closePopupWindow">
<i class="iconfont icon-round-close" style="color:#fff"></i>
</view>
</view>
</uni-popup>
</view>
</template>
<view v-else class="bg-index"
:style="{ backgroundImage: backgroundUrl, paddingTop: paddingTop, marginTop: marginTop }">
<diy-group ref="diyGroup" v-if="diyData.value" :diyData="diyData" :scrollTop="scrollTop"
:followOfficialAccount="followOfficialAccount" />
<ns-copyright v-show="isShowCopyRight" />
</view>
<!-- 底部tabBar -->
<view class="page-bottom" v-if="openBottomNav">
<diy-bottom-nav @callback="callback" :name="name" />
</view>
<template v-if="adv.advshow != -1">
<view @touchmove.prevent.stop>
<uni-popup ref="uniPopupWindow" type="center" class="wap-floating" :maskClick="false">
<view class="small-bot">
<!-- <view class="adver-time" wx:if="{{startadv.params.style=='default'&&startadv.params.canclose==1}}">
<view bindtap="adverclose">跳过</view>
<view class="time">{{clock}}s</view>
</view>
<view class="adver-time" wx:if="{{startadv.params.style=='default'&&startadv.params.canclose==0}}">
<view class="time" style="line-height: 64rpx;">{{clock}}s</view>
</view> -->
<swiper autoplay="true" :circular="true" indicator-active-color="#fff"
indicator-color="rgba(255,255,255,0.6)" :indicator-dots="true" interval="3000">
<swiper-item v-for="(item, index) in adv.list" :key="index">
<image class="slide-image" @click="$util.diyRedirectTo(item.link)" height="100%"
:src="$util.img(item.imageUrl)" width="100%"></image>
<!-- <image bindtap="adverclose" class="slide-image" height="100%" src="{{item.imgurl}}" width="100%" wx:if="{{item.click==1}}"></image> -->
</swiper-item>
</swiper>
<view bindtap="adverclose" class="small-bot-close" @click="closePopupWindow">
<i class="iconfont icon-round-close" style="color:#fff"></i>
</view>
</view>
<!-- <view class="image-wrap">
<swiper class="swiper" style="width:100%;height: 1200rpx;" :autoplay="true" interval="3000" circular="true" :indicator-dots="true" indicator-color="#000" indicator-active-color="red">
<swiper-item class="swiper-item" v-for="(item, index) in adv.list" :key="index" v-if="item.imageUrl" @click="$util.diyRedirectTo(item.link)">
<view class="item">
<image :src="$util.img(item.imageUrl)" mode="aspectFit" :show-menu-by-longpress="true"/>
</view>
</swiper-item>
</swiper>
</view>
<text class="iconfont icon-round-close" @click="closePopupWindow"></text> -->
</uni-popup>
</view>
</template>
<!-- 关注公众号弹窗 -->
<view @touchmove.prevent class="official-accounts-inner" v-if="wechatQrcode">
<uni-popup ref="officialAccountsPopup" type="center">
<view class="official-accounts-wrap">
<image class="content" :src="$util.img(wechatQrcode)" mode="aspectFit"></image>
<text class="desc">关注了解更多</text>
<text class="close iconfont icon-round-close" @click="officialAccountsClose"></text>
</view>
</uni-popup>
</view>
<!-- 底部tabBar -->
<view class="page-bottom" v-if="openBottomNav">
<diy-bottom-nav @callback="callback" :name="name" />
</view>
<!-- 收藏 -->
<uni-popup ref="collectPopupWindow" type="top" class="wap-floating wap-floating-collect">
<view v-if="showTip" class="collectPopupWindow"
:style="{ marginTop: (collectTop + statusBarHeight) * 2 + 'rpx' }">
<image :src="$util.img('public/uniapp/index/collect2.png')" mode="aspectFit" />
<text @click="closeCollectPopupWindow">我知道了</text>
</view>
</uni-popup>
<!-- 关注公众号弹窗 -->
<view @touchmove.prevent class="official-accounts-inner" v-if="wechatQrcode">
<uni-popup ref="officialAccountsPopup" type="center">
<view class="official-accounts-wrap">
<image class="content" :src="$util.img(wechatQrcode)" mode="aspectFit"></image>
<text class="desc">关注了解更多</text>
<text class="close iconfont icon-round-close" @click="officialAccountsClose"></text>
</view>
</uni-popup>
</view>
<!-- 选择门店弹出框 -->
<view @touchmove.prevent.stop class="choose-store">
<uni-popup ref="chooseStorePopup" type="center" :maskClick="false" class="choose-store">
<view class="choose-store-popup">
<view class="head-wrap" @click="closeChooseStorePopup">请确认门店</view>
<view class="position-wrap">
<text class="iconfont icon-dizhi"></text>
<text class="address">{{ currentPosition }}</text>
<view class="reposition" @click="reposition"
v-if="globalStoreConfig && globalStoreConfig.is_allow_change == 1">
<text class="iconfont icon-dingwei"></text>
<text>重新定位</text>
</view>
</view>
<view class="store-wrap" v-if="nearestStore">
<text class="tag">当前门店</text>
<view class="store-name">{{ nearestStore.store_name }}</view>
<view class="address">{{ nearestStore.show_address }}</view>
<view class="distance" v-if="nearestStore.distance">
<text class="iconfont icon-dizhi"></text>
<text>{{ nearestStore.distance > 1 ? nearestStore.distance + 'km' :
nearestStore.distance *
1000 +
'm' }}</text>
</view>
</view>
<button type="primary" @click="enterStore">确认进入</button>
<view class="other-store" @click="chooseOtherStore"
v-if="globalStoreConfig && globalStoreConfig.is_allow_change == 1">
<text>选择其他门店</text>
<text class="iconfont icon-right"></text>
</view>
</view>
</uni-popup>
</view>
<hover-nav :need="true"></hover-nav>
<privacy-popup ref="privacyPopup"></privacy-popup>
<to-top v-if="showTop" @toTop="scrollToTopNative()"></to-top>
<ns-login ref="login"></ns-login>
</view>
</view>
<!-- 收藏 -->
<uni-popup ref="collectPopupWindow" type="top" class="wap-floating wap-floating-collect">
<view v-if="showTip" class="collectPopupWindow"
:style="{ marginTop: (collectTop + statusBarHeight) * 2 + 'rpx' }">
<image :src="$util.img('public/uniapp/index/collect2.png')" mode="aspectFit" />
<text @click="closeCollectPopupWindow">我知道了</text>
</view>
</uni-popup>
<!-- 选择门店弹出框定位当前位置展示最近的一个门店 -->
<view @touchmove.prevent.stop class="choose-store">
<uni-popup ref="chooseStorePopup" type="center" :maskClick="false" class="choose-store">
<view class="choose-store-popup">
<view class="head-wrap" @click="closeChooseStorePopup">请确认门店</view>
<view class="position-wrap">
<text class="iconfont icon-dizhi"></text>
<text class="address">{{ currentPosition }}</text>
<view class="reposition" @click="reposition"
v-if="globalStoreConfig && globalStoreConfig.is_allow_change == 1">
<text class="iconfont icon-dingwei"></text>
<text>重新定位</text>
</view>
</view>
<view class="store-wrap" v-if="nearestStore">
<text class="tag">当前门店</text>
<view class="store-name">{{ nearestStore.store_name }}</view>
<view class="address">{{ nearestStore.show_address }}</view>
<view class="distance" v-if="nearestStore.distance">
<text class="iconfont icon-dizhi"></text>
<text>{{ nearestStore.distance > 1 ? nearestStore.distance + 'km' :
nearestStore.distance *
1000 +
'm' }}</text>
</view>
</view>
<button type="primary" @click="enterStore">确认进入</button>
<view class="other-store" @click="chooseOtherStore"
v-if="globalStoreConfig && globalStoreConfig.is_allow_change == 1">
<text>选择其他门店</text>
<text class="iconfont icon-right"></text>
</view>
</view>
</uni-popup>
</view>
<hover-nav :need="true"></hover-nav>
<!-- 隐私协议 -->
<privacy-popup ref="privacyPopup"></privacy-popup>
<to-top v-if="showTop" @toTop="scrollToTopNative()"></to-top>
<ns-login ref="login"></ns-login>
</view>
</view>
</template>
<script>
import diyJs from '@/common/js/diy.js';
import scroll from '@/common/js/scroll-view.js';
import indexJs from './public/js/index.js';
export default {
mixins: [diyJs, scroll, indexJs],
data() {
return {
diyData: { global: {}, value: null },
followOfficialAccount: {},
wechatQrcode: '',
adv: { advshow: -1, list: [] },
// ❌ 不要定义 siteInfo、bgUrl除非你明确知道它们不会冲突
};
},
computed: {
// ✅ 安全获取 bgUrl用于 diy-index-page 的 prop
safeBgUrl() {
// 优先取全局配置中的 bgUrl没有则用组件自己的 bgUrl如有否则为空
return this.diyData?.global?.bgUrl || this.bgUrl || '';
},
// ✅ 安全生成 background-image 样式字符串(用于 fallback 区域)
backgroundUrlStyle() {
const url = this.diyData?.global?.bgUrl || this.bgUrl || '';
return url ? `url(${url})` : 'none';
}
},
// 如果你的 mixin 中已经处理了数据加载,这里可以留空
// 否则建议在 created/mounted 中初始化默认值或请求数据
created() {
// 可选:如果 mixin 没有初始化 diyData这里再兜底一次
if (!this.diyData) {
this.diyData = { global: {}, value: null };
}
}
mixins: [diyJs, scroll, indexJs]
};
</script>
@@ -170,86 +162,85 @@ export default {
@import './public/css/index.scss';
.small-bot {
width: 100%;
height: 100%;
position: fixed;
top: 0;
bottom: 0;
left: 0;
right: 0;
z-index: 122;
width: 100%;
height: 100%;
position: fixed;
top: 0;
bottom: 0;
left: 0;
right: 0;
z-index: 122;
}
.small-bot swiper {
width: 560rpx;
height: 784rpx;
margin: 120rpx auto 0;
border-radius: 10rpx;
overflow: hidden;
width: 560rpx;
height: 784rpx;
margin: 120rpx auto 0;
border-radius: 10rpx;
overflow: hidden;
}
.small-bot swiper .slide-image {
width: 100%;
height: 100%;
width: 100%;
height: 100%;
}
.small-bot-close {
width: 66rpx;
height: 66rpx;
border-radius: 50%;
text-align: center;
line-height: 64rpx;
font-size: 64rpx;
color: #fff;
margin: 30rpx auto 0;
width: 66rpx;
height: 66rpx;
border-radius: 50%;
text-align: center;
line-height: 64rpx;
font-size: 64rpx;
color: #fff;
margin: 30rpx auto 0;
}
.small-bot-close i {
font-size: 60rpx;
font-size: 60rpx;
}
</style>
<style scoped>
.swiper /deep/ .uni-swiper-dots-horizontal {
left: 40%;
bottom: 40px
.swiper ::v-deep .uni-swiper-dots-horizontal {
left: 40%;
bottom: 40px
}
.wap-floating>>>.uni-popup__wrapper.uni-custom .uni-popup__wrapper-box {
background: none !important;
background: none !important;
}
.choose-store>>>.goodslist-uni-popup-box {
width: 80%;
width: 80%;
}
/deep/.diy-index-page .uni-popup .uni-popup__wrapper-box {
border-radius: 0;
::v-deep .diy-index-page .uni-popup .uni-popup__wrapper-box {
border-radius: 0;
}
/deep/ .placeholder {
height: 0;
::v-deep .placeholder {
height: 0;
}
/deep/::-webkit-scrollbar {
width: 0;
height: 0;
background-color: transparent;
display: none;
::v-deep ::-webkit-scrollbar {
width: 0;
height: 0;
background-color: transparent;
display: none;
}
/deep/ .sku-layer .uni-popup__wrapper.uni-custom .uni-popup__wrapper-box {
max-height: unset !important;
::v-deep .sku-layer .uni-popup__wrapper.uni-custom .uni-popup__wrapper-box {
max-height: unset !important;
}
/deep/ .mescroll-totop {
/* #ifdef H5 */
right: 28rpx !important;
bottom: 200rpx !important;
/* #endif */
/* #ifdef MP-WEIXIN */
right: 27rpx !important;
bottom: 180rpx !important;
/* #endif */
::v-deep .mescroll-totop {
/* #ifdef H5 */
right: 28rpx !important;
bottom: 200rpx !important;
/* #endif */
/* #ifdef MP-WEIXIN */
right: 27rpx !important;
bottom: 180rpx !important;
/* #endif */
}
</style>

File diff suppressed because it is too large Load Diff

View File

@@ -1,5 +1,5 @@
<template>
<view class="ai-chat-page" :style="wrapperPageStyle">
<view class="container" :style="wrapperPageStyle">
<!--自定义导航头部 -->
<view class="custom-navbar" ref="pageHeader" v-if="showCustomNavbar">
<view class="header-left">
@@ -51,12 +51,11 @@
import { mapGetters, mapMutations } from 'vuex'
import navigationHelper from '@/common/js/navigation';
import { EventSafety } from '@/common/js/event-safety';
import aiChatMessage from './ai-chat-message.vue';
export default {
components: {
aiChatMessage,
aiChatMessage
},
data() {
return {
@@ -86,11 +85,11 @@ export default {
// --- 聊天内容区域 ---
scrollViewHeight: '0px',
// 事件处理器引用(用于清理)
safeEventHandlers: new Map()
}
},
computed: {
...mapGetters([
'globalAIKefuConfig'
@@ -109,7 +108,7 @@ export default {
},
wrapperPageStyle() {
// #ifdef H5
return `top: ${this.navBarHeight + 'px'};`
return `top: $ {this.navBarHeight + 'px'};`
// #endif
// #ifdef MP-WEIXIN
@@ -121,35 +120,42 @@ export default {
wrapperChatContentStyle() {
return {
height: this.containerHeight,
paddingTop: this.showCustomNavbar ? '0' : (this.navHeight + 'px')
paddingTop: this.showCustomNavbar ? '0' : (this.navBarHeight + 'px')
}
}
},
async onLoad(options) {
await this.initPage(options)
// ✅ 修改:取消权限校验,允许所有客服类型访问此页面
// const hasAccess = this.checkAccessPermission();
// if (!hasAccess) {
// // 如果校验失败,不继续初始化
// return;
// }
this. $langConfig.title('AI智能客服');
this.initChat();
},
async onReady() {
await this.initNavigation()
await this.initNavigation();
},
onShow() {
// 可在此补充逻辑(如刷新未读数)
},
onHide() {
// 页面隐藏时可暂停音频等
},
onUnload() {
this.cleanup()
this.cleanup();
},
methods: {
// ========== 安全事件处理 ==========
setupSafeEventListeners() {
// 使用 EventSafety 包装事件处理器
const safeHandlers = {
serviceRequest: EventSafety.wrapEventHandler(
this.handleServiceRequest.bind(this),
@@ -165,124 +171,100 @@ export default {
)
}
// 注册事件监听
this.$on('service.requestComponentInfo', safeHandlers.serviceRequest)
this.$on('navigation.requestInfo', safeHandlers.navigationRequest)
this.$on('component.interaction', safeHandlers.componentInteraction)
this. $on('service.requestComponentInfo', safeHandlers.serviceRequest);
this. $on('navigation.requestInfo', safeHandlers.navigationRequest);
this. $on('component.interaction', safeHandlers.componentInteraction);
// 保存处理器引用用于清理
this.safeEventHandlers.set('serviceRequest', safeHandlers.serviceRequest)
this.safeEventHandlers.set('navigationRequest', safeHandlers.navigationRequest)
this.safeEventHandlers.set('componentInteraction', safeHandlers.componentInteraction)
this.safeEventHandlers.set('serviceRequest', safeHandlers.serviceRequest);
this.safeEventHandlers.set('navigationRequest', safeHandlers.navigationRequest);
this.safeEventHandlers.set('componentInteraction', safeHandlers.componentInteraction);
},
setupNavigationEvents() {
// 监听窗口大小变化
uni.onWindowResize((res) => {
console.log('窗口大小变化:', res.size)
this.calculateScrollViewHeight()
})
console.log('窗口大小变化:', res.size);
this.calculateScrollViewHeight();
});
},
// ========== 事件处理方法 ==========
async handleServiceRequest(event) {
console.log('处理服务请求:', EventSafety.extractEventData(event))
console.log('处理服务请求:', EventSafety.extractEventData(event));
// 安全地检查事件目标
if (event.matches('.service-component') ||
event.detail?.componentType === 'service') {
await this.processServiceRequest(event)
await this.processServiceRequest(event);
}
},
async handleNavigationRequest(event) {
console.log('处理导航请求:', event.type)
// 提供导航信息
this.emitNavigationInfo(event)
console.log('处理导航请求:', event.type);
this.emitNavigationInfo(event);
},
handleComponentInteraction(event) {
console.log('处理组件交互:', event.detail)
// 安全地处理组件交互
this.processComponentInteraction(event)
console.log('处理组件交互:', event.detail);
this.processComponentInteraction(event);
},
handleEventError(error, event) {
console.error('事件处理错误:', {
error: error.message,
eventType: event?.type,
component: this.$options.name
})
component: this. $options.name
});
this.showError('操作失败,请重试')
this.showError('操作失败,请重试');
},
// ========== 初始化页面 ==========
async initPage(options = {}) {
this.$langConfig.title('AI智能客服');
this.initChat()
initChat() {
console.log('AI聊天页面初始化');
},
// 初始化导航栏相关配置
async initNavigation() {
try {
// 获取导航栏高度
this.navBarHeight = await navigationHelper.getNavigationHeight(this, {forceRefresh: false})
// 获取状态栏高度
this.statusBarHeight = navigationHelper.getStatusBarHeight()
// 计算滚动视图高度
this.calculateScrollViewHeight()
// 注册导航相关事件
this.setupNavigationEvents()
this.navBarHeight = await navigationHelper.getNavigationHeight(this, {forceRefresh: false});
this.statusBarHeight = navigationHelper.getStatusBarHeight();
this.calculateScrollViewHeight();
this.setupNavigationEvents();
} catch (error) {
console.error('初始化导航栏失败:', error)
this.setFallbackNavigationValues()
console.error('初始化导航栏失败:', error);
this.setFallbackNavigationValues();
}
},
// 计算滚动视图高度
calculateScrollViewHeight() {
const safeArea = navigationHelper.getSafeAreaInsets()
const bottomInset = safeArea.bottom || 0
const inputHeight = 120 // 输入区域高度
this.scrollViewHeight = `calc(100vh - ${this.navBarHeight + this.statusBarHeight + inputHeight + bottomInset}px)`
const safeArea = navigationHelper.getSafeAreaInsets();
const bottomInset = safeArea.bottom || 0;
const inputHeight = 120;
this.scrollViewHeight = `calc(100vh - $ {this.navBarHeight + this.statusBarHeight + inputHeight + bottomInset}px)`;
},
// 备用高度设置
setFallbackNavigationValues() {
// #ifdef MP-WEIXIN
this.navBarHeight = 44
this.statusBarHeight = 20
this.navBarHeight = 44;
this.statusBarHeight = 20;
// #endif
// #ifdef H5
this.navBarHeight = 44
this.statusBarHeight = 0
this.navBarHeight = 44;
this.statusBarHeight = 0;
// #endif
// #ifdef APP-PLUS
this.navBarHeight = 88
this.statusBarHeight = 44
this.navBarHeight = 88;
this.statusBarHeight = 44;
// #endif
},
cleanup() {
// 清理事件监听器
this.safeEventHandlers.forEach((handler, eventType) => {
this.$off(eventType, handler)
})
this.safeEventHandlers.clear()
console.log('组件清理完成')
this. $off(eventType, handler);
});
this.safeEventHandlers.clear();
console.log('组件清理完成');
},
showError(message) {
@@ -290,19 +272,12 @@ export default {
title: message,
icon: 'none',
duration: 2000
})
},
// 初始化聊天
initChat() {
// 可以在这里加载历史消息
console.log('AI聊天页面初始化')
});
},
// 返回上一页
goBack() {
uni.navigateBack()
uni.navigateBack();
},
// 显示菜单
@@ -312,59 +287,54 @@ export default {
success: (res) => {
switch (res.tapIndex) {
case 0:
this.clearChat()
break
this.clearChat();
break;
case 1:
this.exportChat()
break
this.exportChat();
break;
case 2:
this.showSettings()
break
this.showSettings();
break;
case 3:
this.showHelp()
break
this.showHelp();
break;
}
}
})
});
},
// 清空聊天
clearChat() {
uni.showModal({
title: '提示',
content: '确定要清空聊天记录吗?',
success: (res) => {
if (res.confirm) {
this.$refs.chat.clearMessages()
// 重新添加欢迎消息
this.$refs.chat.addMessage({
this. $refs.chat.clearMessages();
this. $refs.chat.addMessage({
id: Date.now(),
role: 'ai',
type: 'text',
content: '聊天记录已清空,有什么可以帮助您的吗?',
timestamp: Date.now()
})
});
}
}
})
});
},
// 导出聊天记录
exportChat() {
uni.showToast({
title: '功能开发中',
icon: 'none'
})
});
},
// 显示设置
showSettings() {
uni.navigateTo({
url: '/pages/settings/index'
})
});
},
// 显示帮助
showHelp() {
const helpMessage = {
id: Date.now(),
@@ -391,27 +361,18 @@ export default {
- **复制**: 长按消息可复制内容
- **转发**: 支持消息转发功能`,
timestamp: Date.now()
}
this.$refs.chat.addMessage(helpMessage)
};
this. $refs.chat.addMessage(helpMessage);
},
// 用户发送消息
onMessageSent(message) {
console.log('用户发送消息:', message)
// 使用AI服务获取回复
// AI聊天组件内部已经集成了AI服务这里只需要监听事件
console.log('用户发送消息:', message);
},
// AI回复消息
onAIResponse(message) {
console.log('AI回复消息:', message)
// 可以在这里处理AI回复后的逻辑
// 比如记录对话、更新状态等
console.log('AI回复消息:', message);
},
// 生成AI回复
generateAIResponse(userMessage) {
const responses = [
'我理解您的需求,让我为您详细解答。',
@@ -419,133 +380,142 @@ export default {
'根据您的问题,我建议您可以考虑以下几个方面:',
'这个问题很常见,让我为您提供一些解决方案。',
'我明白您的困惑,让我帮您分析一下。'
]
];
const randomResponse = responses[Math.floor(Math.random() * responses.length)]
const randomResponse = responses[Math.floor(Math.random() * responses.length)];
const aiMessage = {
id: Date.now(),
role: 'ai',
type: 'text',
content: `${randomResponse}\n\n您的问题"${userMessage.content}"我已经收到,正在为您处理中...`,
content: ` $ {randomResponse}\n\n您的问题" $ {userMessage.content}"我已经收到,正在为您处理中...`,
timestamp: Date.now(),
actions: [
{ type: 'like', count: 0 },
{ type: 'dislike', count: 0 }
]
}
};
this.$refs.chat.addMessage(aiMessage)
this.$emit('ai-response', aiMessage)
this. $refs.chat.addMessage(aiMessage);
this. $emit('ai-response', aiMessage);
},
// 操作按钮点击
onActionClick({ action, message }) {
console.log('操作点击:', action, message)
switch (action.type) {
case 'like':
uni.showToast({
title: '感谢您的反馈!',
icon: 'success'
})
break
uni.showToast({ title: '感谢您的反馈!', icon: 'success' });
break;
case 'dislike':
uni.showToast({
title: '我们会改进服务',
icon: 'none'
})
break
uni.showToast({ title: '我们会改进服务', icon: 'none' });
break;
}
},
// 历史消息加载完成
onHistoryLoaded(messages) {
console.log('历史消息加载完成:', messages.length)
console.log('历史消息加载完成:', messages.length);
},
// 文件预览
onFilePreview(message) {
console.log('文件预览:', message)
uni.showToast({
title: '打开文件: ' + message.fileName,
icon: 'none'
})
uni.showToast({ title: '打开文件: ' + message.fileName, icon: 'none' });
},
// 音频播放
onAudioPlay(message) {
console.log('音频播放:', message)
console.log('音频播放:', message);
},
// 音频暂停
onAudioPause(message) {
console.log('音频暂停:', message)
console.log('音频暂停:', message);
},
// 视频播放
onVideoPlay(message) {
console.log('视频播放:', message)
console.log('视频播放:', message);
},
// 视频暂停
onVideoPause(message) {
console.log('视频暂停:', message)
console.log('视频暂停:', message);
},
// 链接打开
onLinkOpen(message) {
console.log('链接打开:', message)
uni.showModal({
title: '打开链接',
content: `确定要打开链接:${message.url} 吗?`,
content: `确定要打开链接: $ {message.url} 吗?`,
success: (res) => {
if (res.confirm) {
// #ifdef H5
window.open(message.url, '_blank')
window.open(message.url, '_blank');
// #endif
// #ifdef APP-PLUS
plus.runtime.openURL(message.url)
plus.runtime.openURL(message.url);
// #endif
}
}
})
});
},
// 商品查看
onProductView(message) {
console.log('商品查看:', message)
uni.showToast({
title: '查看商品: ' + message.title,
icon: 'none'
})
uni.showToast({ title: '查看商品: ' + message.title, icon: 'none' });
},
// 输入内容变化
onInputChange(value) {
console.log('输入内容:', value)
console.log('输入内容:', value);
},
// ✅ 新增:权限校验(核心修复)
checkAccessPermission() {
const servicerConfig = this. $store.state.servicerConfig;
// 如果配置未加载延迟重试最多3次防白屏
if (!servicerConfig) {
console.warn('【AI客服】servicerConfig 未加载200ms后重试...');
setTimeout(() => {
this.checkAccessPermission();
}, 200);
return false;
}
let currentType = 'none';
// #ifdef MP-WEIXIN
currentType = servicerConfig?.weapp?.type || 'none';
// #endif
// #ifdef H5
currentType = servicerConfig?.h5?.type || 'none';
// #endif
if (currentType !== 'aikefu') {
uni.showToast({ title: '当前客服类型不支持此页面', icon: 'none' });
setTimeout(() => {
const pages = getCurrentPages();
if (pages.length > 1) {
uni.navigateBack();
} else {
// 回到首页(假设首页是 tab 页)
uni.switchTab({ url: '/pages/index/index' });
}
}, 1500);
return false;
}
return true;
}
}
}
</script>
<style lang="scss">
/* 引入图标字体 */
@import url('@/common/css/iconfont.css');
@import url('/common/css/iconfont.css');
/* 页面样式 */
.ai-chat-page {
display: flex;
flex-direction: column;
background-color: #f8f8f8;
overflow: hidden;
position: fixed;
top: 0;
left: 0;
right: 0;
bottom: 0;
}
.container {
display: flex;
flex-direction: column;
background-color: white; /* 白色 */
overflow: hidden;
position: fixed;
top: 0;
left: 0;
right: 0;
bottom: 0;
}
/* 自定义导航头部 */
.custom-navbar {
@@ -553,7 +523,7 @@ export default {
align-items: center;
justify-content: space-between;
padding: 20rpx 30rpx;
background-color: white;
background-color: #c4e0ff; /* 浅蓝色 */
border-bottom: 2rpx solid #eeeeee;
.header-left {
@@ -565,7 +535,7 @@ export default {
width: 60rpx;
height: 60rpx;
border-radius: 50%;
background-color: #f8f8f8;
background-color: #ffffff; /* 白色按钮 */
display: flex;
align-items: center;
justify-content: center;
@@ -610,7 +580,7 @@ export default {
width: 60rpx;
height: 60rpx;
border-radius: 50%;
background-color: #f8f8f8;
background-color: #ffffff; /* 白色按钮 */
display: flex;
align-items: center;
justify-content: center;
@@ -634,18 +604,11 @@ export default {
display: flex;
flex-direction: column;
overflow: hidden;
top: 0;
left: 0;
right: 0;
bottom: 0;
}
/* 底部tabBar占位样式 */
.page-bottom {
width: 100%;
background-color: transparent;
}
</style>

View File

@@ -1,4 +1,4 @@
module.exports = {
baseUrl: "https://xcx6.aigc-quickapp.com/",//修改域名
uniacid: 2811,//后台对应uniacid
baseUrl: "https://dev.aigc-quickapp.com/",//修改域名
uniacid: 1,//后台对应uniacid
};

View File

@@ -65,6 +65,7 @@ const store = new Vuex.Store({
bottomNavHidden: false, // 底部导航是否隐藏true隐藏false显示
aiUnreadCount: 10, // AI未读消息数量
globalAIKefuConfig: null, // AI客服配置
customerServiceType: 'ai',
globalStoreConfig: null, // 门店配置
globalStoreInfo: null, // 门店信息
defaultStoreInfo: null, // 默认门店
@@ -159,6 +160,9 @@ const store = new Vuex.Store({
state.globalAIKefuConfig = value;
uni.setStorageSync('globalAIKefuConfig', value); // 初始化数据调用
},
setCustomerServiceType(state, type) {
state.customerServiceType = type;
},
setGlobalStoreConfig(state, value) {
state.globalStoreConfig = value;
uni.setStorageSync('globalStoreConfig', value); // 初始化数据调用