This commit is contained in:
Your Name
2026-09-09 12:18:17 +08:00
parent 0cea43b027
commit 40319eea41
76 changed files with 4821 additions and 268 deletions
@@ -72,6 +72,23 @@
</div>
</div>
<section v-if="operationResults.length" class="member-sync-results" aria-live="polite">
<strong>本次保存与企微同步结果</strong>
<ul>
<li v-for="result in operationResults" :key="result.id">
<span>{{ result.name || `方案 ${result.id}` }}:{{ operationResultText(result) }}</span>
<el-button
v-if="result.success && result.sync_status !== 'synced' && canSyncPool(result.id)"
type="primary"
link
:loading="syncingPoolId === result.id"
:disabled="syncingPoolId > 0 || savingBatchConfig"
@click="syncMemberRange(result.id)"
>重试同步</el-button>
</li>
</ul>
</section>
<div v-if="overview.pools.length" class="pool-layout">
<aside class="pool-sidebar">
<div class="pool-select-all">
@@ -126,6 +143,7 @@
</div>
<div class="toolbar-actions">
<el-button :icon="CircleCheck" :loading="checkingApi" @click="checkApiPermission">验证 API</el-button>
<el-button v-if="selectedPool.can_operate" :icon="Refresh" :loading="syncingPoolId === Number(selectedPool.id)" :disabled="!selectedPool.official_link || syncingPoolId > 0 || togglingMemberId > 0" @click="syncMemberRange(Number(selectedPool.id))">同步成员范围</el-button>
<el-button :icon="DocumentCopy" :disabled="!selectedPool.main_url" @click="copyText(selectedPool.main_url, '官方获客链接')">复制链接</el-button>
<el-button :icon="DocumentCopy" @click="copyText(selectedPool.install_code, 'JS 安装代码')">复制 JS</el-button>
<el-button v-if="selectedPool.can_manage_access" :icon="User" @click="openAccessDialog([Number(selectedPool.id)])">设置访问操作</el-button>
@@ -150,7 +168,16 @@
show-icon
:closable="false"
title="企业微信原生多人路由"
description="当前全部可用医助会同时写入官方链接的成员范围,由企业微信在打开和添加阶段直接进行多人路由。回调只用于统计实际承接结果,并在禁用、过期或达到上限后更新成员范围。"
description="上线开关和可用性表示本地规则;企微范围显示上次远端确认结果。“待移出”的成员仍可能获客,只有同步完成才会从官方链接移除。"
/>
<el-alert
class="legacy-sync-alert member-sync-state"
:type="selectedSyncState.type"
show-icon
:closable="false"
:title="selectedSyncState.title"
:description="selectedSyncState.description"
/>
<div class="member-table-area">
@@ -163,10 +190,10 @@
</div>
</template>
</el-table-column>
<el-table-column label="企微范围同步" width="130" align="center">
<el-table-column label="企微范围(上次确认)" width="165" align="center">
<template #default="{ row }">
<span class="status-tag" :class="routeStatus(row).className">{{ routeStatus(row).label }}</span>
<div v-if="Number(row.sync_status) === 3" class="sync-retry-tip">同步失败,后台重试中</div>
<div v-if="Number(row.sync_status) === 3" class="sync-retry-tip">同步失败,请查看上方原因</div>
</template>
</el-table-column>
<el-table-column label="今日 / 上限" width="125" align="center">
@@ -180,7 +207,7 @@
</el-table-column>
<el-table-column label="上线" width="90" align="center">
<template #default="{ row }">
<el-switch :model-value="Number(row.enabled) === 1" :disabled="!selectedPool.can_operate" :loading="togglingMemberId === Number(row.id)" @change="(value) => handleMemberToggle(row, value)" />
<el-switch :model-value="Number(row.enabled) === 1" :disabled="!selectedPool.can_operate || togglingMemberId > 0 || syncingPoolId > 0" :loading="togglingMemberId === Number(row.id)" @change="(value) => handleMemberToggle(row, value)" />
</template>
</el-table-column>
<el-table-column label="操作" min-width="100" fixed="right">
@@ -584,6 +611,7 @@
</el-form>
</div>
<template #footer>
<span v-if="batchSyncProgress.total" class="uploading-save-tip" role="status">本地配置已保存,正在同步企微 {{ batchSyncProgress.completed }} / {{ batchSyncProgress.total }} 个方案</span>
<span v-if="batchConfigBusy" class="uploading-save-tip">正在处理标签或素材,请稍候</span>
<el-button :disabled="savingBatchConfig || batchConfigBusy" @click="batchConfigDialogVisible = false">取消</el-button>
<el-button type="primary" :loading="savingBatchConfig" :disabled="batchConfigBusy" @click="saveBatchConfig">批量保存</el-button>
@@ -694,9 +722,10 @@ import {
wecomPromotionSaveMember,
wecomPromotionSavePool,
wecomPromotionSyncCustomers,
wecomPromotionSyncMemberRange,
wecomPromotionToggleMember
} from '@/api/first_visit'
import type { WecomPromotionCustomerChatStatus } from '@/api/first_visit'
import type { WecomPromotionBatchUpdatePoolResult, WecomPromotionCustomerChatStatus, WecomPromotionMemberSyncResult } from '@/api/first_visit'
import WecomFloatingWidgetBuilder from './components/WecomFloatingWidgetBuilder.vue'
import PromotionAutomationForm from './components/PromotionAutomationForm.vue'
@@ -778,6 +807,9 @@ const accessDialogVisible = ref(false)
const savingAccess = ref(false)
const batchConfigDialogVisible = ref(false)
const savingBatchConfig = ref(false)
const syncingPoolId = ref(0)
const batchSyncProgress = reactive({ completed: 0, total: 0 })
const operationResults = ref<WecomPromotionBatchUpdatePoolResult[]>([])
const batchConfigBusy = ref(false)
const batchConfigScroll = ref<HTMLElement>()
const batchConfigError = ref('')
@@ -808,6 +840,25 @@ const customerStats = reactive({
const selectedPool = computed(() => overview.pools.find((item: any) => Number(item.id) === selectedPoolId.value))
const selectedMemberRules = computed(() => Array.isArray(selectedPool.value?.member_rules) ? selectedPool.value.member_rules : [])
const selectedSyncState = computed(() => {
const pool = selectedPool.value
const sync = pool?.dispatch_sync || {}
const remote = Array.isArray(pool?.official_link?.range_userids) ? pool.official_link.range_userids.map(String) : []
const planned = selectedMemberRules.value.filter((row: any) => eligibility(row).className === 'is-ok').map((row: any) => String(row.userid))
const names = new Map<string, string>(selectedMemberRules.value.map((row: any) => [String(row.userid), String(row.name || row.userid)]))
const remoteNames = remote.map((id: string) => names.get(id) || id).join('、') || '暂无确认记录'
const plannedNames = planned.map((id: string) => names.get(id) || id).join('、') || '暂无可用成员'
const lastSync = pool?.official_link?.last_sync_time
const detail = `当前计划:${plannedNames};上次企微确认:${remoteNames}${lastSync ? `(${formatCustomerTime(lastSync)})` : ''}。`
const error = String(sync.last_error || pool?.official_link?.sync_error || '')
if (Number(sync.status) === 3 || error) return { type: 'warning' as const, title: '企微成员范围尚未同步成功', description: `${detail}${error || '同步失败,请点击“同步成员范围”重试。'}` }
if (Number(sync.status) === 4) return { type: 'warning' as const, title: '企微成员范围同步受阻', description: `${detail}请检查可用成员后重试同步。` }
if ([1, 2].includes(Number(sync.status))) return { type: 'warning' as const, title: '本地规则已保存,企微成员范围同步待完成', description: `${detail}可点击“同步成员范围”立即重试。` }
const hasDepartments = (pool?.official_link?.range_department_ids || []).length > 0
const matches = remote.length > 0 && new Set(remote).size === new Set(planned).size && planned.every((id: string) => remote.includes(id)) && !hasDepartments
if (!matches) return { type: 'warning' as const, title: '当前计划与上次企微范围不一致', description: `${detail}${hasDepartments ? '企微范围仍包含部门。' : ''}请点击“同步成员范围”更新并确认。` }
return { type: 'info' as const, title: '上次确认的企微成员范围与当前计划一致', description: detail }
})
const selectedInstallPool = computed(() => overview.pools.find((item: any) => Number(item.id) === selectedInstallPoolId.value))
const accessDialogPools = computed(() => overview.pools.filter((item: any) => accessForm.pool_ids.includes(Number(item.id))))
const manageablePoolIds = computed(() => overview.pools
@@ -1011,6 +1062,83 @@ function setBatchConfigError(message: string) {
ElMessage.warning(message)
}
function syncErrorMessage(error: unknown, fallback: string) {
if (typeof error === 'string' && error) return error
if (error && typeof error === 'object' && 'message' in error && typeof error.message === 'string') return error.message
return fallback
}
function operationResultText(result: WecomPromotionBatchUpdatePoolResult) {
if (!result.success) return `本地保存失败:${result.error || '请检查配置后重试'}`
if (result.sync_status === 'synced') return '本地已保存,企微成员范围已确认同步'
if (result.sync_status === 'blocked' || result.sync_status === 'failed' || result.sync_error) {
return `本地已保存,企微同步${result.sync_status === 'blocked' ? '受阻' : '失败'}:${result.sync_error || '请重试同步'}`
}
return '本地已保存,企微成员范围尚未确认同步,请重试同步'
}
function recordOperationResult(result: WecomPromotionBatchUpdatePoolResult) {
const index = operationResults.value.findIndex((item) => item.id === result.id)
if (index < 0) operationResults.value.push(result)
else operationResults.value[index] = result
}
function notifySavedResult(label: string, result: Partial<WecomPromotionMemberSyncResult>) {
if (result.sync_status === 'synced') {
ElMessage.success(`${label},企微成员范围已确认同步`)
} else {
const reason = result.sync_error || '企微成员范围尚未确认同步,请点击“同步成员范围”重试'
ElMessage.warning({ message: `${label}。${reason}`, duration: 8000 })
}
}
function recordSavedResult(poolId: number, name: string, result: Partial<WecomPromotionMemberSyncResult>) {
recordOperationResult({ id: poolId, name, success: true, sync_status: result.sync_status, sync_error: result.sync_error, sync_queued: result.sync_queued })
}
function canSyncPool(poolId: number) {
const pool = overview.pools.find((item: any) => Number(item.id) === poolId)
return Boolean(pool?.can_operate && pool?.official_link)
}
async function requestMemberSync(poolId: number): Promise<Partial<WecomPromotionMemberSyncResult>> {
try {
return await wecomPromotionSyncMemberRange({ pool_id: poolId })
} catch (error: unknown) {
return { pool_id: poolId, sync_status: 'failed', sync_error: syncErrorMessage(error, '同步请求失败,请重试确认企微范围'), sync_queued: false }
}
}
async function syncMemberRange(poolId: number) {
if (syncingPoolId.value || savingBatchConfig.value || !canSyncPool(poolId)) return
const pool = overview.pools.find((item: any) => Number(item.id) === poolId)
syncingPoolId.value = poolId
try {
const result = await requestMemberSync(poolId)
recordOperationResult({ id: poolId, name: pool.name, success: true, ...result })
await loadOverview()
notifySavedResult('本地规则已保存', result)
} finally {
syncingPoolId.value = 0
}
}
async function syncBatchResults(results: WecomPromotionBatchUpdatePoolResult[]) {
operationResults.value = results.map((item) => ({ ...item }))
const queued = results.filter((item) => item.success && item.sync_queued)
Object.assign(batchSyncProgress, { total: queued.length, completed: 0 })
let next = 0
// Two workers keep large batches responsive without flooding the enterprise API.
await Promise.all(Array.from({ length: Math.min(2, queued.length) }, async () => {
while (next < queued.length) {
const item = queued[next++]
const synced = await requestMemberSync(item.id)
recordOperationResult({ ...item, ...synced })
batchSyncProgress.completed++
}
}))
}
async function saveBatchConfig() {
if (savingBatchConfig.value || batchConfigBusy.value) return
batchConfigError.value = ''
@@ -1081,11 +1209,13 @@ async function saveBatchConfig() {
}
savingBatchConfig.value = true
operationResults.value = []
try {
const result = await wecomPromotionBatchUpdatePools({
pool_ids: [...batchConfigForm.pool_ids],
changes
})
operationResults.value = result.results.map((item) => ({ ...item }))
if (result.updated === 0) {
const detail = result.results
.slice(0, 2)
@@ -1093,33 +1223,27 @@ async function saveBatchConfig() {
.join(';')
return setBatchConfigError(detail || '所选方案均未能保存,请检查配置后重试')
}
await syncBatchResults(result.results)
batchConfigDialogVisible.value = false
selectedPoolIds.value = []
selectedPoolIds.value = operationResults.value
.filter((item) => !item.success || item.sync_status !== 'synced')
.map((item) => item.id)
await loadOverview()
const memberStatusText = batchConfigForm.member_status === 1 ? '上线' : '下线'
const memberResultText = hasMemberStatusChange
? (result.member_updated > 0
? `,${result.member_updated} 条员工规则已${memberStatusText}`
: `,所选员工均已处于${memberStatusText}状态`)
? `,${result.member_updated} 条本地员工规则已${memberStatusText}`
: `,所选员工本地均已处于${memberStatusText}状态`)
: ''
if (result.failed > 0) {
const detail = result.results
.filter((item) => !item.success)
.slice(0, 2)
.map((item) => `${item.name || `方案 ${item.id}`}:${item.error || '保存失败'}`)
.join(';')
ElMessage.warning(`已更新 ${result.updated} 个方案,${result.failed} 个失败${memberResultText}${detail ? `。${detail}` : ''}`)
} else if (result.sync_error_count > 0) {
ElMessage.warning(`已更新 ${result.updated} 个方案${memberResultText},其中 ${result.sync_error_count} 个企微范围将在后台自动重试同步`)
} else if (result.sync_queued_count > 0) {
ElMessage.success(`已批量更新 ${result.updated} 个分流方案${memberResultText},${result.sync_queued_count} 个企微链接配置将在后台同步`)
} else {
ElMessage.success(`已批量更新 ${result.updated} 个分流方案${memberResultText}`)
}
const synced = operationResults.value.filter((item) => item.success && item.sync_status === 'synced').length
const unconfirmed = result.updated - synced
const summary = `本地已保存 ${result.updated} 个方案${memberResultText};企微已确认同步 ${synced} 个${unconfirmed ? `,${unconfirmed} 个尚未确认同步` : ''}${result.failed ? `;${result.failed} 个本地保存失败` : ''}`
ElMessage({ type: unconfirmed || result.failed ? 'warning' : 'success', message: `${summary}。详情见方案列表上方。`, duration: 8000 })
} catch (error: any) {
setBatchConfigError(error?.message || '批量修改分流方案失败')
} finally {
savingBatchConfig.value = false
Object.assign(batchSyncProgress, { completed: 0, total: 0 })
}
}
@@ -1242,11 +1366,10 @@ async function savePool() {
throw new Error('方案已提交,但服务端未确认标签和欢迎语配置保存成功,请刷新后重试')
}
poolDialogVisible.value = false
await loadOverview()
if (result?.id) selectedPoolId.value = Number(result.id)
result?.sync_error
? ElMessage.warning('方案已保存,企业微信多人范围将在后台自动重试同步')
: ElMessage.success(poolForm.id ? '分流方案已保存' : '分流方案和官方获客链接已创建')
recordSavedResult(Number(result?.id || poolForm.id), poolForm.name, result || {})
await loadOverview()
if (result?.id) selectedPoolId.value = Number(result.id)
notifySavedResult(poolForm.id ? '本地方案已保存' : '分流方案已创建', result || {})
} catch (error: any) {
poolFormError.value = error?.message || (typeof error === 'string' ? error : '分流方案保存失败,请检查配置或稍后重试')
poolFormScroll.value?.scrollTo({ top: 0, behavior: 'smooth' })
@@ -1295,7 +1418,10 @@ function openMemberDialog(row: any) {
}
async function saveMemberRule() {
if (savingMember.value) return
savingMember.value = true
const poolId = Number(selectedPool.value?.id)
const poolName = String(selectedPool.value?.name || '')
try {
const result: any = await wecomPromotionSaveMember({
...memberForm,
@@ -1303,10 +1429,9 @@ async function saveMemberRule() {
active_end: memberForm.active_range?.[1] || ''
})
memberDialogVisible.value = false
recordSavedResult(poolId, poolName, result || {})
await loadOverview()
result?.sync_error
? ElMessage.warning('规则已保存,企业微信成员范围将在后台自动重试同步')
: ElMessage.success('医助分流规则已保存')
notifySavedResult('本地医助规则已保存', result || {})
} catch (error: any) {
ElMessage.error(error?.message || '医助分流规则保存失败')
} finally {
@@ -1315,13 +1440,15 @@ async function saveMemberRule() {
}
async function handleMemberToggle(row: any, value: unknown) {
if (togglingMemberId.value || syncingPoolId.value) return
togglingMemberId.value = Number(row.id)
const poolId = Number(selectedPool.value?.id)
const poolName = String(selectedPool.value?.name || '')
try {
const result: any = await wecomPromotionToggleMember({ id: Number(row.id), status: value ? 1 : 0 })
recordSavedResult(poolId, poolName, result || {})
await loadOverview()
result?.sync_error
? ElMessage.warning('成员状态已保存,企业微信成员范围将在后台自动重试同步')
: ElMessage.success('成员规则已保存,企微多人路由范围已重新计算')
notifySavedResult('本地成员状态已保存', result || {})
} catch (error: any) {
ElMessage.error(error?.message || '成员状态更新失败')
await loadOverview()
@@ -1459,8 +1586,10 @@ function eligibility(row: any) {
function routeStatus(row: any) {
const available = eligibility(row).className === 'is-ok'
if (row.is_in_remote_range) return { label: available ? '企微路由中' : '待移出', className: available ? 'is-online' : 'is-offline' }
return { label: available ? '待同步' : '未在路由范围', className: 'is-offline' }
if (row.is_in_remote_range === true || Number(row.is_in_remote_range) === 1) {
return { label: available ? '企微范围内' : '待移出(仍在企微)', className: available ? 'is-online' : 'is-pending' }
}
return { label: available ? '待加入企微' : '未在企微范围', className: 'is-offline' }
}
function todayCount(row: any) {
@@ -1815,6 +1944,12 @@ h1, h2, h3, p { margin: 0; }
.batch-section-tip { margin: -6px 0 12px; color: #8491a2; font-size: 11px; line-height: 1.6; }.batch-section-selectors { display: flex; flex-wrap: wrap; gap: 8px; margin-bottom: 14px; }.batch-section-selectors :deep(.el-checkbox) { margin-right: 0; }.automation-batch-section :deep(.automation-note) { margin-top: 14px; }
.uploading-save-tip { color: #b88230; font-size: 12px; margin-right: 16px; }
.sync-retry-tip { color: #b88230; font-size: 10px; line-height: 1.6; margin-top: 4px; }
.status-tag.is-pending { color: #a36413; background: #fff1dd; }
.member-sync-state :deep(.el-alert__description) { max-height: 84px; overflow-y: auto; overflow-wrap: anywhere; }
.member-sync-results { margin-bottom: 14px; padding: 12px 14px; border: 1px solid var(--line); border-radius: 8px; background: #f8fafb; font-size: 12px; }
.member-sync-results ul { max-height: 150px; margin: 8px 0 0; padding: 0; overflow-y: auto; list-style: none; }
.member-sync-results li { display: flex; align-items: center; justify-content: space-between; gap: 12px; padding: 5px 0; }
.member-sync-results li span { overflow-wrap: anywhere; }.member-sync-results .el-button { flex-shrink: 0; }
:global(.promotion-pool-dialog) { max-width: calc(100vw - 32px); margin-top: 5vh; }
@media (max-width: 1100px) { .heading-actions { flex-wrap: wrap; justify-content: flex-end; }.metric-grid, .customer-metric-grid { grid-template-columns: repeat(2, minmax(0,1fr)); }.pool-layout { grid-template-columns: 210px minmax(0,1fr); }.pool-toolbar { align-items: flex-start; flex-direction: column; } }
@media (max-width: 760px) { .promotion-page { padding: 10px; }.page-header, .section-heading { align-items: flex-start; flex-direction: column; }.section-heading-actions { width: 100%; justify-content: flex-start; }.update-time { display: none; }.metric-grid, .customer-metric-grid, .form-grid, .rule-form-grid, .batch-field-grid, .batch-member-status-grid { grid-template-columns: 1fr; }.tab-nav { overflow-x: auto; }.tab-nav button { min-width: 112px; }.tab-content { padding: 14px; }.pool-layout { height: auto; min-height: 0; grid-template-columns: 1fr; }.pool-sidebar { display: flex; overflow-x: auto; overflow-y: hidden; border-right: 0; border-bottom: 1px solid var(--line); scrollbar-gutter: auto; }.pool-select-all { position: static; min-width: 126px; flex: 0 0 126px; margin: 0 6px 0 0; border-right: 1px solid var(--line); border-bottom: 0; }.pool-main { overflow: visible; }.member-table-area { height: 420px; min-height: 320px; flex: none; }.pool-select-row { min-width: 220px; }.pool-item { min-width: 190px; }.callback-list > div { grid-template-columns: 1fr 48px; padding: 8px 0; }.callback-list dt { grid-column: 1 / -1; }.install-pool-select { width: 100%; }.customer-heading-actions { width: 100%; justify-content: flex-end; }.customer-filter-bar :deep(.el-form-item) { width: 100%; margin-right: 0; }.customer-filter-bar :deep(.el-form-item__content), .customer-filter-bar .el-select { width: 100%; }.customer-filter-bar .filter-actions :deep(.el-form-item__content) { justify-content: flex-end; }.customer-pagination { align-items: flex-start; flex-direction: column; }.customer-pagination :deep(.el-pagination) { max-width: 100%; flex-wrap: wrap; justify-content: flex-start; }.access-pool-preview > div { grid-template-columns: 1fr; gap: 3px; } }