|
|
|
@ -5,41 +5,47 @@ |
|
|
|
<!-- 客服选择 --> |
|
|
|
<div class="kefu-selector"> |
|
|
|
<span class="kefu-label">指定客服:</span> |
|
|
|
<el-select |
|
|
|
v-model="selectedKefuId" |
|
|
|
placeholder="不指定(系统自动分配)" |
|
|
|
clearable |
|
|
|
size="small" |
|
|
|
style="width: 240px;" |
|
|
|
@change="onKefuChange" |
|
|
|
> |
|
|
|
<el-option |
|
|
|
v-for="item in kefuList" |
|
|
|
:key="item.id" |
|
|
|
:label="item.nickName" |
|
|
|
:value="item.id" |
|
|
|
> |
|
|
|
<div style="display: flex; align-items: center; gap: 8px;"> |
|
|
|
<el-select v-model="selectedKefuId" placeholder="不指定(系统自动分配)" size="small" style="width: 240px" @change="onKefuChange"> |
|
|
|
<el-option v-for="item in kefuList" :key="item.id" :label="item.nickName" :value="item.id"> |
|
|
|
<div style="display: flex; align-items: center; gap: 8px"> |
|
|
|
<el-avatar :src="item.headImageThumb" :size="24" v-if="item.headImageThumb" /> |
|
|
|
<span>{{ item.nickName }}</span> |
|
|
|
</div> |
|
|
|
</el-option> |
|
|
|
</el-select> |
|
|
|
<el-button |
|
|
|
v-if="selectedKefuId !== ''" |
|
|
|
size="small" |
|
|
|
type="danger" |
|
|
|
plain |
|
|
|
@click="onClearKefu" |
|
|
|
style="margin-left: 8px;" |
|
|
|
> |
|
|
|
清除 |
|
|
|
</el-button> |
|
|
|
</div> |
|
|
|
|
|
|
|
<!-- 使用悬浮球设置组件 --> |
|
|
|
<FloatBallSetting |
|
|
|
<FloatBallSetting |
|
|
|
ref="floatBallSettingRef" |
|
|
|
:token="uniqueToken" |
|
|
|
@save="handleFloatBallConfigSaved" |
|
|
|
@update:config="handleFloatBallConfigUpdate" |
|
|
|
/> |
|
|
|
|
|
|
|
|
|
|
|
<el-collapse v-model="activeName" accordion> |
|
|
|
<el-collapse-item title="超链接" name="1"> |
|
|
|
<alink :tokeninfo="token" :site-url="siteUrl" :unique-token="uniqueToken" @cget-copy="getCopy"></alink> |
|
|
|
</el-collapse-item> |
|
|
|
<el-collapse-item title="网页内嵌" name="2"> |
|
|
|
<wangye :tokeninfo="token" :site-url="siteUrl" :unique-token="uniqueToken" :kefu-id="selectedKefuId" :float-config="floatBallConfig" @cget-copy="getCopy"></wangye> |
|
|
|
<wangye |
|
|
|
:tokeninfo="token" |
|
|
|
:site-url="siteUrl" |
|
|
|
:unique-token="uniqueToken" |
|
|
|
:kefu-id="selectedKefuId" |
|
|
|
:float-config="floatBallConfig" |
|
|
|
@cget-copy="getCopy" |
|
|
|
></wangye> |
|
|
|
</el-collapse-item> |
|
|
|
</el-collapse> |
|
|
|
</el-card> |
|
|
|
@ -52,6 +58,8 @@ import { ref, computed, onMounted, getCurrentInstance } from 'vue'; |
|
|
|
// import { useStore } from 'vuex'; |
|
|
|
// import { adminAppCustomer, appReset } from '@/api/kefu'; |
|
|
|
import alink from './components/alink.vue'; |
|
|
|
import { ElMessage } from 'element-plus'; |
|
|
|
|
|
|
|
import wangye from './components/wangye.vue'; |
|
|
|
import FloatBallSetting from './components/FloatBallSetting.vue'; |
|
|
|
import { listUser, listAllCustomer } from '@/api/im/user/customer'; |
|
|
|
@ -74,7 +82,7 @@ const { proxy } = getCurrentInstance() as any; |
|
|
|
// 👇 定义悬浮球配置(默认空) |
|
|
|
const floatBallConfig = ref<FloatBallConfig>({ |
|
|
|
pcImage: '', |
|
|
|
mobileImage: '', |
|
|
|
mobileImage: '' |
|
|
|
}); |
|
|
|
const token = ref<any>(''); |
|
|
|
const canfrime = ref(false); |
|
|
|
@ -85,7 +93,7 @@ const canCustomerServer = ref(''); |
|
|
|
|
|
|
|
const selectedKefuId = ref<number | ''>(''); |
|
|
|
const kefuList = ref<any[]>([]); |
|
|
|
|
|
|
|
const kefuSaving = ref(false); |
|
|
|
const linkUrl = computed(() => `${location.origin}/chat/index?token=${token.value?.token_md5}&noCanClose=1`); |
|
|
|
onMounted(() => { |
|
|
|
// 页面加载就获取当前代理的 uniqueToken ✅ |
|
|
|
@ -132,7 +140,6 @@ async function loadKefuList() { |
|
|
|
} |
|
|
|
} |
|
|
|
|
|
|
|
|
|
|
|
// 加载已保存的默认客服ID |
|
|
|
async function loadDefaultKefu() { |
|
|
|
try { |
|
|
|
@ -145,13 +152,30 @@ async function loadDefaultKefu() { |
|
|
|
} |
|
|
|
} |
|
|
|
|
|
|
|
|
|
|
|
async function onKefuChange(val: number | '') { |
|
|
|
if (kefuSaving.value) return; |
|
|
|
kefuSaving.value = true; |
|
|
|
try { |
|
|
|
await saveDefaultCustomer(val || null); |
|
|
|
proxy?.$Message?.success('已保存'); |
|
|
|
ElMessage.success('已保存'); |
|
|
|
} catch (e) { |
|
|
|
console.error('保存默认客服失败', e); |
|
|
|
} finally { |
|
|
|
kefuSaving.value = false; |
|
|
|
} |
|
|
|
} |
|
|
|
|
|
|
|
async function onClearKefu() { |
|
|
|
if (kefuSaving.value) return; |
|
|
|
selectedKefuId.value = ''; |
|
|
|
kefuSaving.value = true; |
|
|
|
try { |
|
|
|
await saveDefaultCustomer(null); |
|
|
|
ElMessage.success('已清除'); |
|
|
|
} catch (e) { |
|
|
|
console.error('清除默认客服失败', e); |
|
|
|
} finally { |
|
|
|
kefuSaving.value = false; |
|
|
|
} |
|
|
|
} |
|
|
|
|
|
|
|
@ -167,7 +191,7 @@ function handleFloatBallConfigSaved(config: FloatBallConfig) { |
|
|
|
floatBallConfig.value = config; |
|
|
|
// 可以在这里执行额外的保存逻辑,比如同步到服务器 |
|
|
|
console.log('悬浮球配置已保存:', config); |
|
|
|
|
|
|
|
|
|
|
|
// 如果需要保存到服务器,可以在这里调用API |
|
|
|
// saveFloatBallConfigToServer(config); |
|
|
|
} |
|
|
|
@ -364,4 +388,4 @@ function copyToClipboard(elem: HTMLElement) { |
|
|
|
height: 40px !important; |
|
|
|
margin-right: 30px; |
|
|
|
} |
|
|
|
</style> |
|
|
|
</style> |
|
|
|
|