Compare commits

7 Commits

9 changed files with 705 additions and 564 deletions

View File

@@ -453,6 +453,206 @@ export class CustomerService {
return { ...config, openType };
}
/**
* 获取客服按钮图标
* @returns {String} 图标URL
*/
getKefuButtonIcon() {
const shopInfo = this.vm.shopInfo || {};
const config = this.getPlatformConfig();
if (config?.type === 'aikefu') {
return shopInfo.aiAgentimg || '';
} else if (config?.type === 'wxwork' || config?.type === 'qyweixin') {
return shopInfo.aiAgentimg || '';
}
return shopInfo.kefuimg || this.vm.$util?.getDefaultImage()?.kefu || '';
}
/**
* 判断是否为微信官方客服
* @returns {Boolean}
*/
isWeappOfficialKefu() {
const config = this.getPlatformConfig();
return config?.type === 'weapp';
}
/**
* 判断是否需要同时显示小程序系统客服
* @returns {Boolean}
*/
shouldShowExtraWeappSystemKefu() {
const config = this.getPlatformConfig();
return (config?.show_system_service === true || config?.show_system_service === '1') && config?.type !== 'weapp';
}
/**
* 计算容器高度
* @param {Boolean} isLanguageSwitchEnabled 是否启用语言切换
* @param {Boolean} showWeappSystemKefu 是否显示小程序系统客服
* @param {Boolean} fixBtnShow 是否显示按钮
* @returns {String} 高度值px
*/
getContainerHeight(isLanguageSwitchEnabled, showWeappSystemKefu, fixBtnShow) {
if (!fixBtnShow) return '160px';
let buttonCount = 1;
if (isLanguageSwitchEnabled) buttonCount++;
if (showWeappSystemKefu) buttonCount++;
const totalRpx = 94 * buttonCount - 14;
const pxValue = Math.round(totalRpx * 0.5);
return `${pxValue}px`;
}
/**
* 获取未读消息数量
* @returns {Number}
*/
getUnreadCount() {
return this.vm.$store?.state?.aiUnreadCount || 0;
}
/**
* 拨打电话联系客服
* @param {String} phoneNumber 电话号码
*/
makePhoneCallByNumber(phoneNumber) {
if (phoneNumber) {
uni.makePhoneCall({ phoneNumber });
} else {
this.makePhoneCall();
}
}
/**
* 打开 AI 智能助手
*/
openAIChat() {
try {
if (typeof this.vm.setAiUnreadCount === 'function') {
this.vm.setAiUnreadCount(0);
}
const aiChatUrl = '/pages_tool/ai-chat/index';
uni.navigateTo({
url: aiChatUrl,
fail: (err) => {
console.error('跳转 AI 客服失败:', err);
// #ifdef H5
window.location.href = aiChatUrl;
// #endif
uni.showToast({ title: '打开客服失败', icon: 'none' });
}
});
} catch (e) {
console.error('跳转 AI 客服异常:', e);
uni.showToast({ title: '打开客服失败', icon: 'none' });
}
}
/**
* 打开客服选择对话框(预留方法)
*/
openCustomerSelectPopupDialog() {
uni.showToast({ title: '客服选择功能开发中', icon: 'none' });
}
/**
* 打开客服选择弹出层ActionSheet
* @param {Array} kefuList 客服列表
*/
openKefuSelectPopup(kefuList) {
const kefuNames = kefuList.map(item => item.name);
uni.showActionSheet({
itemList: kefuNames,
success: (res) => {
const selectedKefu = kefuList[res.tapIndex];
const cs = createCustomerService(this.vm, selectedKefu);
if (selectedKefu.isOfficial) {
uni.openCustomerServiceConversation({
sessionFrom: 'weapp',
showMessageCard: true
});
} else if (selectedKefu.id === 'qyweixin-kefu') {
if (uni.getSystemInfoSync().platform === 'wechat') {
uni.navigateTo({
url: '/pages_tool/qyweixin-kefu/index'
});
} else {
const qyweixinUrl = this.vm.shopInfo?.qyweixinUrl;
if (qyweixinUrl) {
window.location.href = qyweixinUrl;
} else {
uni.showToast({ title: '企业微信客服未配置', icon: 'none' });
}
}
} else {
cs.handleCustomerClick();
}
}
});
}
/**
* 核心方法:统一客服入口(带验证和配置检查)
* @param {Object} options 选项参数
*/
handleUnifiedKefuClick(options = {}) {
const validation = this.validateConfig();
console.log('【客服配置验证】', validation);
if (!validation.isValid) {
console.error('客服配置无效:', validation.errors);
uni.showToast({ title: '客服暂不可用', icon: 'none' });
return;
}
if (validation.warnings.length > 0) {
console.warn('客服配置警告:', validation.warnings);
}
const platformConfig = this.getPlatformConfig();
console.log('【当前客服配置】', platformConfig);
// 检查企业微信配置
if (platformConfig.type === 'wxwork') {
const wxworkConfig = this.getWxworkConfig();
console.log('【企业微信配置】', wxworkConfig);
// #ifdef MP-WEIXIN
if (!wxworkConfig?.enable || !wxworkConfig?.contact_url) {
console.warn('企业微信配置不完整,使用原生客服');
uni.showToast({ title: '企业微信配置不完整', icon: 'none' });
}
// #endif
// #ifdef H5
if (!wxworkConfig?.contact_url && !platformConfig.wxwork_url) {
console.error('企业微信链接未配置');
uni.showToast({ title: '企业微信链接未配置', icon: 'none' });
return;
}
// #endif
}
// 直接调用统一处理方法,由 CustomerService 内部根据配置路由
try {
this.handleCustomerClick({
sendMessageTitle: options.sendMessageTitle || '来自悬浮按钮的咨询',
sendMessagePath: options.sendMessagePath || '/pages/index/index'
});
} catch (error) {
console.error('客服处理失败:', error);
uni.showToast({ title: '打开客服失败', icon: 'none' });
}
}
}
/**

View File

@@ -7,7 +7,7 @@ export default {
computed: {
// 是否是英文环境
isEnEnv() {
return uni.getStorageSync('lang') === 'en-us';
return this.$langConfig.getCurrentLocale() === 'en-us';
},
themeStyle() {
return this.$store.state.themeStyle;

View File

@@ -1,161 +1,218 @@
import { langConfig } from './config-external.js';
// 缓存已加载的语言包
const loadedLangPacks = {};
// 处理页面目录映射
function processRoutePath(route) {
let routeParts = route.split("/");
let routeParts = route.split("/");
// ---- 处理页面目录映射 <begin> 分包造成的,需要根据实际目录结构进行映射----
if (routeParts[0] === 'pages_tool') {
routeParts = [routeParts[1], ...routeParts.slice(2)];
} else if (routeParts[0] === 'pages_goods') {
routeParts[0] = 'goods';
} else if (routeParts[0] === 'pages_member') {
routeParts[0] = 'member';
} else if (routeParts[0] === 'pages_order') {
routeParts[0] = 'order';
} else if (routeParts[0] === 'pages_promotion') {
const promotionModules = ['point', 'fenxiao', 'merch'];
if (routeParts[1] && promotionModules.includes(routeParts[1])) {
routeParts = [routeParts[1], ...routeParts.slice(2)];
}
}
// ---- 处理页面目录映射 <end>----
if (routeParts[0] === 'pages') {
routeParts = routeParts.slice(1);
}
return routeParts.join("/");
// ---- 处理页面目录映射 <begin> 分包造成的,需要根据实际目录结构进行映射----
// 先处理特殊的分包路径
if (routeParts[0] === 'pages_tool') {
// pages_tool 分包下的页面,直接使用子目录作为语言包路径
routeParts = [routeParts[1], ...routeParts.slice(2)];
} else if (routeParts[0] === 'pages_goods') {
// pages_goods 分包映射到 goods 目录
routeParts[0] = 'goods';
} else if (routeParts[0] === 'pages_member') {
// pages_member 分包映射到 member 目录
routeParts[0] = 'member';
} else if (routeParts[0] === 'pages_order') {
// pages_order 分包映射到 order 目录
routeParts[0] = 'order';
} else if (routeParts[0] === 'pages_promotion') {
// pages_promotion 分包特殊处理
const promotionModules = ['point', 'fenxiao', 'merch'];
if (routeParts[1] && promotionModules.includes(routeParts[1])) {
routeParts = [routeParts[1], ...routeParts.slice(2)];
}
}
// ---- 处理页面目录映射 <end>----
// 去掉pages目录只保留子目录
if (routeParts[0] === 'pages') {
routeParts = routeParts.slice(1);
}
return routeParts.join("/");
}
// 加载语言包(同步方式)
function loadLangPackSync(lang, path) {
try {
if (loadedLangPacks[`${lang}_${path}`]) {
return loadedLangPacks[`${lang}_${path}`];
}
const langData = require(`@/lang/${lang}/${path}.js`).lang;
loadedLangPacks[`${lang}_${path}`] = langData;
return langData;
} catch (error) {
console.error(`加载语言包 ${lang}/${path} 失败:`, error);
return {};
}
try {
if (loadedLangPacks[`${lang}_${path}`]) {
return loadedLangPacks[`${lang}_${path}`];
}
const langData = require(`@/lang/${lang}/${path}.js`).lang;
loadedLangPacks[`${lang}_${path}`] = langData;
return langData;
} catch (error) {
console.error(`加载语言包 ${lang}/${path} 失败:`, error);
return {};
}
}
function getCurrentLocale() {
return uni.getStorageSync('lang') || "zh-cn";
}
export default {
langList: langConfig.langList,
/**
* 解析多语言
*/
lang(field) {
let _this = getCurrentPages()[getCurrentPages().length - 1];
if (!_this) return;
langList: langConfig.langList,
const locale = uni.getStorageSync('lang') || "zh-cn";
/**
* 获得当前本地语言
* @returns
*/
getCurrentLocale,
let value = '';
let langPath = '';
/**
* * 解析多语言
* @param {Object} field
*/
lang(field) {
let _page = getCurrentPages()[getCurrentPages().length - 1];
if (!_page) return;
try {
var lang = loadLangPackSync(locale, 'common');
let route = _this.route;
langPath = processRoutePath(route);
let currentPageLang = loadLangPackSync(locale, langPath);
const locale = getCurrentLocale(); // 获得当前本地语言
let value = ''; // 存放解析后的语言值
let langPath = ''; // 存放当前页面语言包路径
let mergedLang = { ...lang, ...currentPageLang };
try {
//公共语言包(同步加载)
var lang = loadLangPackSync(locale, 'common');
//当前页面语言包(同步加载)
let route = _page.route;
langPath = processRoutePath(route);
// 加载当前页面语言包
let currentPageLang = loadLangPackSync(locale, langPath);
var arr = field.split(".");
if (arr.length > 1) {
let temp = mergedLang;
let found = true;
for (let key of arr) {
if (temp[key] !== undefined) {
temp = temp[key];
} else {
found = false;
break;
}
}
value = found ? temp : field;
} else {
value = mergedLang[field] !== undefined ? mergedLang[field] : field;
}
} catch (e) {
console.error('解析语言包失败:', e, { langPath, field, locale });
value = field;
}
// 合并语言包
let mergedLang = { ...lang, ...currentPageLang };
if (arguments.length > 1) {
for (var i = 1; i < arguments.length; i++) {
value = value.replace("{" + (i - 1) + "}", arguments[i]);
}
}
if (value == undefined || (value == 'title' && field == 'title')) value = '';
// 解析字段
var arr = field.split(".");
if (arr.length > 1) {
// 处理嵌套属性,如 common.currencySymbol
let temp = mergedLang;
let found = true;
for (let key of arr) {
if (temp[key] !== undefined) {
temp = temp[key];
} else {
found = false;
break;
}
}
value = found ? temp : field;
} else {
value = mergedLang[field] !== undefined ? mergedLang[field] : field;
}
} catch (e) {
console.error('解析语言包失败:', e, { langPath, field, locale });
value = field;
}
if (field == value) {
console.warn(`警告: 字段 ${field} 在语言包 ${langPath} 中未找到对应值,使用默认值 ${field} 当前语言: ${locale}`);
}
if (arguments.length > 1) {
//有参数,需要替换
for (var i = 1; i < arguments.length; i++) {
value = value.replace("{" + (i - 1) + "}", arguments[i]);
}
}
if (value == undefined || (value == 'title' && field == 'title')) value = ''; // field
return value;
},
/**
* 切换语言
*/
change(value, url = '/pages_tool/member/index') {
let _this = getCurrentPages()[getCurrentPages().length - 1];
if (!_this) return;
// 多语言调试,注释后可以关闭控制台输出
if (field == value) {
console.warn(`警告: 字段 ${field} 在语言包 ${langPath} 中未找到对应值,使用默认值 ${field} 当前语言: ${locale}`);
}
uni.setStorageSync("lang", value);
const locale = uni.getStorageSync('lang') || "zh-cn";
return value;
},
/**
* * 切换语言
* @param {String} value 语言值
* @param {String} url 切换后跳转的页面url
*/
change(value, url = '/pages_tool/member/index') {
let _page = getCurrentPages()[getCurrentPages().length - 1];
if (!_page) return;
// ✅ 关键修复:清空所有语言包缓存(不再保留任何旧缓存)
for (let key in loadedLangPacks) {
delete loadedLangPacks[key];
}
uni.setStorageSync("lang", value);
const locale = getCurrentLocale();
this.refresh();
// 清空已加载的语言包缓存
for (let key in loadedLangPacks) {
if (!key.startsWith(locale)) {
delete loadedLangPacks[key];
}
}
if (url) {
uni.reLaunch({ url: url });
}
},
//刷新标题、tabbar
refresh() {
let _this = getCurrentPages()[getCurrentPages().length - 1];
if (!_this) return;
const locale = uni.getStorageSync('lang') || "zh-cn";
this.title(this.lang("title"));
},
title(str) {
if (str) {
uni.setNavigationBarTitle({
title: str
});
}
},
// 获取语言包列表
list() {
var list = [];
try {
for (var i = 0; i < langConfig.langList.length; i++) {
let langType = langConfig.langList[i];
let item = loadLangPackSync(langType, 'common');
list.push({
name: item.common ? item.common.name : langType,
value: langType
});
}
} catch (e) {
console.error('获取语言包列表失败:', e);
}
return list;
}
this.refresh();
if (url) {
uni.reLaunch({ url: url });
}
},
//刷新标题、tabbar
refresh() {
let _page = getCurrentPages()[getCurrentPages().length - 1];
if (!_page) return;
const locale = getCurrentLocale();
this.title(this.lang("title"));
//设置tabbar的文字语言
// uni.setTabBarItem({
// index: 0,
// text: this.lang("tabBar.home")
// });
// uni.setTabBarItem({
// index: 1,
// text: this.lang("tabBar.category")
// });
// uni.setTabBarItem({
// index: 2,
// text: this.lang("tabBar.cart")
// });
// uni.setTabBarItem({
// index: 3,
// text: this.lang("tabBar.member")
// });
},
title(str) {
if (str) {
uni.setNavigationBarTitle({
title: str,
success: function (res) {
},
fail: function (err) {
}
});
}
},
// 获取语言包列表
list() {
var list = [];
try {
//公共语言包
for (var i = 0; i < langConfig.langList.length; i++) {
let langType = langConfig.langList[i];
let item = loadLangPackSync(langType, 'common');
list.push({
name: item.common ? item.common.name : langType,
value: langType
});
}
} catch (e) {
console.error('获取语言包列表失败:', e);
}
return list;
}
}

View File

@@ -156,11 +156,11 @@
</script>
<style lang="scss">
/deep/.uni-popup__wrapper.uni-custom .uni-popup__wrapper-box {
::v-deep .uni-popup__wrapper.uni-custom .uni-popup__wrapper-box {
background-color: #000;
}
/deep/.uni-popup__wrapper.uni-custom.center .uni-popup__wrapper-box {
::v-deep .uni-popup__wrapper.uni-custom.center .uni-popup__wrapper-box {
max-width: 100%;
width: 100%;
}

View File

@@ -1,41 +1,10 @@
<template>
<view v-if="pageCount == 1 || need" class="fixed-box"
<view v-if="pageCount === 1 || need" class="fixed-box"
:style="[customContainerStyle, {
height: containerHeight,
backgroundImage: bgUrl ? `url( $ {bgUrl})` : '',
backgroundImage: bgUrl ? `url(${bgUrl})` : '',
backgroundSize: 'cover'
}]">
<!-- 统一客服入口根据后台配置自动适配 AI / 企业微信 / 第三方等 -->
<!-- 微信官方客服需要使用 button open-type="contact" -->
<button
v-if="fixBtnShow && isWeappOfficialKefu"
class="btn-item common-bg"
open-type="contact"
:style="{ backgroundImage: currentKefuImg ? `url( $ {currentKefuImg})` : '', backgroundSize: '100% 100%' }"
>
<text class="ai-icon" v-if="!currentKefuImg">🤖</text>
</button>
<!-- 其他类型客服使用普通 view -->
<view
v-else-if="fixBtnShow"
class="btn-item common-bg"
@click="handleUnifiedKefuClick"
:style="{ backgroundImage: currentKefuImg ? `url( $ {currentKefuImg})` : '', backgroundSize: '100% 100%' }"
>
<text class="ai-icon" v-if="!currentKefuImg">🤖</text>
</view>
<!-- 新增小程序系统客服按钮当附加设置开启时显示 -->
<button
v-if="fixBtnShow && showWeappSystemKefu"
class="btn-item common-bg"
open-type="contact"
:style="{ backgroundImage: currentKefuImg ? `url( $ {currentKefuImg})` : '', backgroundSize: '100% 100%' }"
>
<text class="ai-icon" v-if="!currentKefuImg">💬</text>
</button>
<!-- 中英文切换按钮 -->
<view
v-if="isLanguageSwitchEnabled && fixBtnShow"
@@ -44,13 +13,44 @@
>
<text>{{ currentLangDisplayName }}</text>
</view>
<!-- 微信官方客服按钮-->
<button
v-if="fixBtnShow && isWeappOfficialKefu"
class="btn-item common-bg"
open-type="contact"
:style="{ backgroundImage: currentKefuImg ? `url(${currentKefuImg})` : '', backgroundSize: '100% 100%' }"
>
<text class="ai-icon" v-if="!currentKefuImg">🤖</text>
</button>
<!-- 电话按钮始终显示 -->
<!-- 其他类型客服按钮 -->
<view
v-else-if="fixBtnShow"
class="btn-item common-bg"
@click="handleUnifiedKefuClick"
:style="{ backgroundImage: currentKefuImg ? `url(${currentKefuImg})` : '', backgroundSize: '100% 100%' }"
>
<text class="ai-icon" v-if="!currentKefuImg">🤖</text>
</view>
<!-- 小程序系统客服按钮 -->
<button
v-if="fixBtnShow && showWeappSystemKefu"
class="btn-item common-bg"
open-type="contact"
:style="{ backgroundImage: currentKefuImg ? `url(${currentKefuImg})` : '', backgroundSize: '100% 100%' }"
>
<text class="ai-icon" v-if="!currentKefuImg">💬</text>
</button>
<!-- 电话按钮 -->
<view
v-if="fixBtnShow"
class="btn-item common-bg"
@click="call()"
:style="[{ backgroundImage: phoneimg ? `url( $ {phoneimg})` : '', backgroundSize: '100% 100%' }, customButtonStyle]"
@click="call"
:style="[{ backgroundImage: phoneimg ? `url(${phoneimg})` : '', backgroundSize: '100% 100%' }, customButtonStyle]"
>
<text class="iconfont icon-dianhua" v-if="!phoneimg"></text>
</view>
@@ -73,12 +73,7 @@ export default {
shopInfo: null,
currentLangIndex: 0,
langIndexMap: {},
kefuList: [
{ id: 'weixin-official', name: '微信官方客服', isOfficial: true, type: 'weapp' },
{ id: 'custom-kefu', name: '自定义在线客服', isOfficial: false, type: 'custom' },
{ id: 'qyweixin-kefu', name: '企业微信客服', isOfficial: false, type: 'qyweixin' }
],
selectedKefu: null,
customerService: null,
};
},
computed: {
@@ -89,10 +84,10 @@ export default {
return this.shopInfo?.aiAgentimg || '';
},
kefuimg() {
return this.shopInfo?.kefuimg || this. $util.getDefaultImage().kefu;
return this.shopInfo?.kefuimg || this.$util.getDefaultImage().kefu;
},
phoneimg() {
return this.shopInfo?.phoneimg || this. $util.getDefaultImage().phone;
return this.shopInfo?.phoneimg || this.$util.getDefaultImage().phone;
},
tel() {
return this.shopInfo?.mobile || '';
@@ -111,58 +106,33 @@ export default {
return this.shopInfo?.floatingButton?.button || {};
},
unreadCount() {
return this. $store.state.aiUnreadCount || 0;
return this.customerService?.getUnreadCount() || 0;
},
// ✅ 新增:根据当前客服类型动态返回图标
currentKefuImg() {
if (!this.shopInfo) return '';
const customerService = createCustomerService(this);
const config = customerService.getPlatformConfig();
if (config?.type === 'aikefu') {
return this.aiAgentimg;
} else if (config?.type === 'wxwork' || config?.type === 'qyweixin') {
// 企业微信客服专用图标
return this.aiAgentimg;
}
// 默认客服图标
return this.kefuimg;
return this.customerService?.getKefuButtonIcon() || '';
},
// ✅ 新增:判断是否为微信官方客服
isWeappOfficialKefu() {
if (!this.shopInfo) return false;
const customerService = createCustomerService(this);
const config = customerService.getPlatformConfig();
return config?.type === 'weapp';
return this.customerService?.isWeappOfficialKefu() || false;
},
// ✅ 新增:判断是否需要同时显示小程序系统客服
showWeappSystemKefu() {
if (!this.shopInfo) return false;
const customerService = createCustomerService(this);
const config = customerService.getPlatformConfig();
// 检查附加设置是否开启了同时显示小程序系统客服,且当前客服类型不是小程序系统客服
return (config?.show_system_service === true || config?.show_system_service === '1') && config?.type !== 'weapp';
return this.customerService?.shouldShowExtraWeappSystemKefu() || false;
},
//根据显示的按钮数量动态计算容器高度
containerHeight() {
if (!this.fixBtnShow) return '320rpx';
let buttonCount = 1;
if (this.isLanguageSwitchEnabled) buttonCount++;
if (this.showWeappSystemKefu) buttonCount++;
buttonCount++;
const totalRpx = 94 * buttonCount - 14;
const pxValue = Math.round(totalRpx * 0.5);
return ` $ {pxValue}px`;
}
},
containerHeight() {
if (!this.fixBtnShow) return '320rpx';
let buttonCount = 1;
if (this.isLanguageSwitchEnabled) buttonCount++;
if (this.showWeappSystemKefu) buttonCount++;
buttonCount++;
const totalRpx = 94 * buttonCount - 14;
const pxValue = Math.round(totalRpx * 0.5);
return ` $ {pxValue}px`;
}
},
watch: {
shopInfo: {
handler(newVal) {
// 可在此添加额外逻辑(如埋点、通知等),当前无需操作
},
immediate: true
}
@@ -170,7 +140,6 @@ export default {
created() {
this.initLanguage();
this.pageCount = getCurrentPages().length;
uni.getStorage({
key: 'shopInfo',
success: (e) => {
@@ -181,15 +150,17 @@ export default {
console.warn('未获取到 shopInfo使用默认设置');
}
});
// 初始化 customerService 实例
this.customerService = createCustomerService(this);
},
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,118 +172,30 @@ export default {
this.currentLangIndex = 0;
}
},
call() {
if (this.tel) {
uni.makePhoneCall({ phoneNumber: this.tel + '' });
} else {
uni.showToast({ title: '暂无联系电话', icon: 'none' });
}
this.customerService.makePhoneCallByNumber(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);
},
// ✅ 核心方法:统一客服入口
handleUnifiedKefuClick() {
const customerService = createCustomerService(this);
const validation = customerService.validateConfig();
console.log('【客服配置验证】', validation);
if (!validation.isValid) {
console.error('客服配置无效:', validation.errors);
uni.showToast({ title: '客服暂不可用', icon: 'none' });
return;
}
if (validation.warnings.length > 0) {
console.warn('客服配置警告:', validation.warnings);
}
const platformConfig = customerService.getPlatformConfig();
console.log('【当前客服配置】', platformConfig);
// 检查企业微信配置
if (platformConfig.type === 'wxwork') {
const wxworkConfig = customerService.getWxworkConfig();
console.log('【企业微信配置】', wxworkConfig);
// #ifdef MP-WEIXIN
if (!wxworkConfig?.enable || !wxworkConfig?.contact_url) {
console.warn('企业微信配置不完整,使用原生客服');
uni.showToast({ title: '企业微信配置不完整', icon: 'none' });
}
// #endif
// #ifdef H5
if (!wxworkConfig?.contact_url && !platformConfig.wxwork_url) {
console.error('企业微信链接未配置');
uni.showToast({ title: '企业微信链接未配置', icon: 'none' });
return;
}
// #endif
}
// 直接调用统一处理方法,由 CustomerService 内部根据配置路由
try {
customerService.handleCustomerClick({
sendMessageTitle: '来自悬浮按钮的咨询',
sendMessagePath: '/pages/index/index'
});
} catch (error) {
console.error('客服处理失败:', error);
uni.showToast({ title: '打开客服失败', icon: 'none' });
}
},
// 以下方法保留用于 actionSheet如仍需手动选择
openKefuSelectPopup() {
const kefuNames = this.kefuList.map(item => item.name);
uni.showActionSheet({
itemList: kefuNames,
success: (res) => {
this.selectedKefu = this.kefuList[res.tapIndex];
const cs = createCustomerService(this, this.selectedKefu);
if (this.selectedKefu.isOfficial) {
uni.openCustomerServiceConversation({
sessionFrom: 'weapp',
showMessageCard: true
});
} else if (this.selectedKefu.id === 'qyweixin-kefu') {
// 处理企业微信客服
if (uni.getSystemInfoSync().platform === 'wechat') {
// 小程序端:跳转到企业微信客服
uni.navigateTo({
url: '/pages_tool/qyweixin-kefu/index'
});
} else {
// H5端跳转到企业微信链接
const qyweixinUrl = this.shopInfo.qyweixinUrl; // 后端返回的企业微信链接
if (qyweixinUrl) {
window.location.href = qyweixinUrl;
} else {
uni.showToast({ title: '企业微信客服未配置', icon: 'none' });
}
}
} else {
cs.handleCustomerClick();
}
}
this.customerService.handleUnifiedKefuClick({
sendMessageTitle: '来自悬浮按钮的咨询',
sendMessagePath: '/pages/index/index'
});
}
}
}
</script>
<style scoped>
<style lang="scss" scoped>
.fixed-box {
position: fixed;
right: 0rpx;
@@ -333,16 +216,25 @@ 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: 50%;
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 +249,6 @@ export default {
justify-content: center;
align-items: center;
margin: 14rpx 0;
background: #fff;
border-radius: 50rpx;
width: 80rpx;
height: 80rpx;
@@ -371,22 +262,6 @@ 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;
width: 100%;

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>

View File

@@ -7,7 +7,7 @@
"setting": {
"urlCheck": true,
"es6": true,
"enhance": false,
"enhance": true,
"postcss": true,
"preloadBackgroundData": false,
"minified": true,
@@ -39,19 +39,27 @@
"packNpmManually": false,
"packNpmRelationList": [],
"minifyWXSS": true,
"compileWorklet": false,
"condition": true,
"swc": false,
"disableSWC": true,
"minifyWXML": true,
"compileWorklet": true,
"localPlugins": false,
"disableUseStrict": false,
"useCompilerPlugins": false,
"condition": false,
"swc": false,
"disableSWC": true
"useCompilerPlugins": false
},
"compileType": "miniprogram",
"libVersion": "3.12.0",
"libVersion": "2.16.1",
"appid": "wx29215aa1bd97bbd6",
"projectname": "uniapp",
"debugOptions": {
"hidedInDevtools": []
},
"scripts": {},
"staticServerOptions": {
"baseURL": "",
"servePath": ""
},
"isGameTourist": false,
"condition": {
"search": {
@@ -72,7 +80,5 @@
"miniprogram": {
"list": []
}
},
"simulatorPluginLibVersion": {},
"editorSetting": {}
}
}

View File

@@ -416,7 +416,7 @@ const store = new Vuex.Store({
},
// 生成主题颜色CSS变量
themeColorSet() {
console.log('样式颜色设置...');
// console.log('样式颜色设置...');
let theme = this.state.themeStyle;
if (!theme?.main_color || !theme?.aux_color) return;
try {
@@ -440,7 +440,7 @@ const store = new Vuex.Store({
} catch (e) {
console.error('设置主题颜色失败', e);
}
console.log('themeColor => ', this.state.themeColor);
// console.log('themeColor => ', this.state.themeColor);
}
}
})