/** * 客服统一处理服务 * 整合各种客服方式,提供统一的调用接口 */ class CustomerService { constructor(vueInstance, externalConfig = {}) { if (!vueInstance.$lang) { throw new Error('CustomerService 必须在 Vue 实例中初始化'); } this.vm = vueInstance; this.externalConfig = externalConfig; // 外部传入的最新配置(优先级最高) this.latestPlatformConfig = null; } getSupoortKeFuList() { if (!this.vm) return []; const vm = this.vm; return [ { id: 'weixin-official', name: vm.$lang('customer.weChatKefu'), isOfficial: true, type: 'weapp' }, { id: 'custom-kefu', name: vm.$lang('customer.systemKefu'), isOfficial: false }, { id: 'qyweixin-kefu', name: vm.$lang('customer.weChatWorkKefu'), isOfficial: false }, ] } /** * 打开客服选择弹窗 */ openCustomerSelectPopupDialog() { const kefu_list = this.getSupoortKeFuList(); const kefuNames = kefu_list.map(item => item.name); uni.showActionSheet({ itemList: kefuNames, success: (res) => { const kefu = kefu_list[res.tapIndex]; this.externalConfig = kefu ?? this.externalConfig ?? {}; if (kefu.isOfficial) { uni.openCustomerServiceConversation({ sessionFrom: 'weapp', showMessageCard: true }); } else if (kefu.id === 'custom-kefu') { this.handleCustomerClick(); } else if (kefu.id === 'qyweixin-kefu') { this.handleQyWeixinKefuClick(); } } }); } /** * 强制刷新配置(支持传入外部配置) * @param {Object} externalConfig 外部最新配置 */ refreshConfig(externalConfig = null) { this.externalConfig = externalConfig || this.externalConfig; this.latestPlatformConfig = null; return this.getPlatformConfig(); } /** * 获取平台配置 * @returns {Object} 平台对应的客服配置 */ getPlatformConfig() { if (this.latestPlatformConfig) { return this.latestPlatformConfig; } // 优先级:外部传入的最新配置 > vuex配置 > 空对象 const servicerConfig = this.externalConfig || this.vm.$store.state.servicerConfig || {}; console.log(`【实时客服配置】`, servicerConfig); let platformConfig = null; // #ifdef H5 platformConfig = servicerConfig.h5 ? (typeof servicerConfig.h5 === 'object' ? servicerConfig.h5 : null) : null; // #endif // #ifdef MP-WEIXIN platformConfig = servicerConfig.weapp ? (typeof servicerConfig.weapp === 'object' ? servicerConfig.weapp : null) : null; // #endif // #ifdef MP-ALIPAY platformConfig = servicerConfig.aliapp ? (typeof servicerConfig.aliapp === 'object' ? servicerConfig.aliapp : null) : null; // #endif // #ifdef PC platformConfig = servicerConfig.pc ? (typeof servicerConfig.pc === 'object' ? servicerConfig.pc : null) : null; // #endif // 处理空数组情况(你的配置中pc/aliapp是空数组,转为null) if (Array.isArray(platformConfig)) { platformConfig = null; } this.latestPlatformConfig = platformConfig; return platformConfig; } /** * 获取企业微信配置 * @returns {Object} 企业微信配置 */ getWxworkConfig() { return this.vm.$store.state.wxworkConfig || {}; } /** * 检查客服配置是否可用 * @returns {boolean} 是否有可用配置 */ isConfigAvailable() { const config = this.getPlatformConfig(); return config && typeof config === 'object' && config.type; } /** * 验证客服配置完整性 * @returns {Object} 验证结果 */ validateConfig() { const config = this.getPlatformConfig(); const wxworkConfig = this.getWxworkConfig(); const result = { isValid: true, errors: [], warnings: [] }; if (!config) { result.isValid = false; result.errors.push('客服配置不存在'); return result; } if (config.type === 'aikefu') { return result; } if (!config.type) { result.isValid = false; result.errors.push('客服类型未配置'); } if (config.type === 'wxwork') { if (!wxworkConfig) { result.isValid = false; result.errors.push('企业微信配置不存在'); } else { if (!wxworkConfig.enable) { result.warnings.push('企业微信功能未启用'); } if (!wxworkConfig.contact_url) { result.warnings.push('企业微信活码链接未配置,将使用原有客服方式'); } } } return result; } /** * 跳转到AI客服页面 */ openAIKeFuService() { const vm = this.vm; vm.$util.redirectTo(vm.$util.AI_CHAT_PAGE_URL); } /** * 处理客服点击事件 * @param {Object} options 选项参数 */ handleCustomerClick(options = {}) { const validation = this.validateConfig(); if (!validation.isValid) { console.error('客服配置验证失败:', validation.errors); this.showConfigErrorPopup(validation.errors); return; } if (validation.warnings.length > 0) { console.warn('客服配置警告:', validation.warnings); } const config = this.getPlatformConfig(); const { niushop = {}, sendMessageTitle = '', sendMessagePath = '', sendMessageImg = '' } = options || {}; if (config.type === 'none') { this.showNoServicePopup(); return; } // 核心分支:根据最新的type处理 switch (config.type) { case 'aikefu': this.openAIKeFuService(); break; case 'wxwork': this.openWxworkService(false, config, options); break; case 'third': this.openThirdService(config); break; case 'niushop': this.openNiushopService(niushop); break; case 'weapp': this.openWeappService(config, options); break; case 'aliapp': this.openAliappService(config); break; default: this.makePhoneCall(); } } /** * 打开企业微信客服 * @param {boolean} useOriginalService 是否使用原有客服方式 * @param {Object} servicerConfig 客服配置 * @param {Object} options 选项参数 */ openWxworkService(useOriginalService = false, servicerConfig = null, options = {}) { const config = servicerConfig || this.getPlatformConfig(); const wxworkConfig = this.getWxworkConfig(); const { sendMessageTitle = '', sendMessagePath = '', sendMessageImg = '' } = options || {}; // #ifdef MP-WEIXIN if (wxworkConfig?.enable && wxworkConfig?.contact_url && !useOriginalService) { wx.navigateToMiniProgram({ appId: 'wxeb490c6f9b154ef9', path: `pages/contacts/externalContactDetail?url=${encodeURIComponent(wxworkConfig.contact_url)}`, success: () => console.log('跳转企业微信成功'), fail: (err) => { console.error('跳转企业微信失败:', err); this.fallbackToOriginalService(); } }); } else { wx.openCustomerServiceChat({ extInfo: { url: config.wxwork_url }, corpId: config.corpid, showMessageCard: true, sendMessageTitle, sendMessagePath, sendMessageImg }); } // #endif // #ifdef H5 if (wxworkConfig?.enable && wxworkConfig?.contact_url) { window.location.href = wxworkConfig.contact_url; } else if (config.wxwork_url) { location.href = config.wxwork_url; } else { this.fallbackToPhoneCall(); } // #endif } /** * 打开第三方客服 * @param {Object} config 客服配置 */ openThirdService(config) { if (config.third_url) { window.location.href = config.third_url; } else { this.fallbackToPhoneCall(); } } /** * 打开牛商客服 * @param {Object} niushop 牛商参数 */ openNiushopService(niushop) { if (Object.keys(niushop).length > 0) { this.vm.$util.redirectTo('/pages_tool/chat/room', niushop); } else { this.makePhoneCall(); } } /** * 打开微信小程序客服 * @param {Object} config 客服配置 * @param {Object} options 选项参数 */ openWeappService(config, options = {}) { if (!this.shouldUseCustomService(config)) { console.log('使用官方微信小程序客服'); return; } console.log('使用自定义微信小程序客服'); this.handleCustomWeappService(config, options); } /** * 处理自定义微信小程序客服 * @param {Object} config 客服配置 * @param {Object} options 选项参数 */ handleCustomWeappService(config, options = {}) { const { sendMessageTitle = '', sendMessagePath = '', sendMessageImg = '' } = options || {}; if (config.customServiceUrl) { let url = config.customServiceUrl; const params = []; if (sendMessageTitle) params.push(`title=${encodeURIComponent(sendMessageTitle)}`); if (sendMessagePath) params.push(`path=${encodeURIComponent(sendMessagePath)}`); if (sendMessageImg) params.push(`img=${encodeURIComponent(sendMessageImg)}`); if (params.length > 0) { url += (url.includes('?') ? '&' : '?') + params.join('&'); } uni.navigateTo({ url: url, fail: (err) => { console.error('跳转自定义客服页面失败:', err); this.tryThirdPartyService(config, options); } }); return; } this.tryThirdPartyService(config, options); } /** * 尝试使用第三方客服 * @param {Object} config 客服配置 * @param {Object} options 选项参数 */ tryThirdPartyService(config, options = {}) { if (config.thirdPartyServiceUrl) { // #ifdef H5 window.open(config.thirdPartyServiceUrl, '_blank'); // #endif // #ifdef MP-WEIXIN if (config.thirdPartyMiniAppId) { wx.navigateToMiniProgram({ appId: config.thirdPartyMiniAppId, path: config.thirdPartyMiniAppPath || '', fail: (err) => { console.error('跳转第三方小程序失败:', err); this.fallbackToPhoneCall(); } }); } else { uni.setClipboardData({ data: config.thirdPartyServiceUrl, success: () => { uni.showModal({ title: '客服链接已复制', content: '客服链接已复制到剪贴板,请在浏览器中粘贴访问', showCancel: false }); } }); } // #endif return; } this.fallbackToPhoneCall(); } /** * 降级到电话客服 */ fallbackToPhoneCall() { uni.showModal({ title: '联系客服', content: '在线客服暂时不可用,是否拨打电话联系客服?', success: (res) => { if (res.confirm) { this.makePhoneCall(); } } }); } /** * 打开支付宝小程序客服 * @param {Object} config 客服配置 */ openAliappService(config) { console.log('支付宝小程序客服', config); switch (config.type) { case 'aikefu': this.openAIKeFuService(); break; case 'third': this.openThirdService(config); break; default: console.log('使用支付宝官方客服'); break; } } /** * 拨打电话 */ makePhoneCall(mobileNumber) { if (mobileNumber) { return uni.makePhoneCall({ phoneNumber: mobileNumber }); } // 从缓存中获取电话信息 uni.getStorage({ key: 'shopInfo', success: (res) => { const shopInfo = res.data; const mobile = shopInfo?.mobile ?? ''; if (mobile) { uni.makePhoneCall({ phoneNumber: mobile }); } else { uni.showToast({ title: '暂无客服电话', icon: 'none' }); } } }); } /** * 显示无客服弹窗 */ showNoServicePopup() { const siteInfo = this.vm.$store.state.siteInfo || {}; const message = siteInfo?.site_tel ? `请联系客服,客服电话是${siteInfo.site_tel}` : '抱歉,商家暂无客服,请线下联系'; uni.showModal({ title: '联系客服', content: message, showCancel: false }); } /** * 显示配置错误弹窗 * @param {Array} errors 错误列表 */ showConfigErrorPopup(errors) { const message = errors.join('\n'); uni.showModal({ title: '配置错误', content: `客服配置有误:\n${message}`, showCancel: false }); } /** * 降级处理:使用原有客服方式 */ fallbackToOriginalService() { uni.showModal({ title: '提示', content: '无法直接添加企业微信客服,是否使用其他方式联系客服?', success: (res) => { if (res.confirm) { this.openWxworkService(true); } } }); } /** * 获取客服按钮配置 * @returns {Object} 按钮配置 */ getButtonConfig() { const config = this.getPlatformConfig(); if (!config) return { openType: '' }; let openType = ''; // #ifdef MP-WEIXIN if (config.type === 'weapp') { openType = config.useOfficial !== false ? 'contact' : ''; } // #endif // #ifdef MP-ALIPAY if (config.type === 'aliapp') openType = 'contact'; // #endif return { ...config, openType }; } /** * 判断是否应该使用自定义客服处理 * @param {Object} config 客服配置 * @returns {boolean} 是否使用自定义客服 */ shouldUseCustomService(config) { // #ifdef MP-WEIXIN if (config?.type === 'weapp') { return config.useOfficial === false; } // #endif return true; } } /** * 创建客服服务实例 * @param {Object} vueInstance Vue实例 * @param {Object} externalConfig 外部最新配置 * @returns {CustomerService} 客服服务实例 */ export function createCustomerService(vueInstance, externalConfig = {}) { return new CustomerService(vueInstance, externalConfig); }