fix(staffchat): ContactsPane 加请求序号防 ownerId/翻页切换竞态(对齐 ChatMain/MomentsPane 惯例)+修正跨tab关键词注释
Co-Authored-By: Claude <noreply@anthropic.com>
This commit is contained in:
@@ -22,7 +22,8 @@ const PAGE_SIZE = 10
|
|||||||
|
|
||||||
type TabKey = 'customers' | 'groups'
|
type TabKey = 'customers' | 'groups'
|
||||||
const activeTab = ref<TabKey>('customers')
|
const activeTab = ref<TabKey>('customers')
|
||||||
/** 输入框值 / 已应用值:点「查询」(或回车)才生效重查,对齐云客。 */
|
/** 输入框值 / 已应用值:点「查询」(或回车)才生效重查,对齐云客。
|
||||||
|
单一搜索框设计——关键词跨 tab 保留并应用于新 tab 的查询(placeholder 随 tab 切换,关键词可见)。 */
|
||||||
const keyword = ref('')
|
const keyword = ref('')
|
||||||
const appliedKeyword = ref('')
|
const appliedKeyword = ref('')
|
||||||
|
|
||||||
@@ -42,7 +43,12 @@ const groupLoading = ref(false)
|
|||||||
const groupError = ref<string | null>(null)
|
const groupError = ref<string | null>(null)
|
||||||
const selectedGroups = ref<Group[]>([])
|
const selectedGroups = ref<Group[]>([])
|
||||||
|
|
||||||
|
/** 请求序号: ownerId/翻页切换后在途旧响应整体丢弃(防竞态覆盖新员工/新页的数据)。 */
|
||||||
|
let customerSeq = 0
|
||||||
|
let groupSeq = 0
|
||||||
|
|
||||||
async function loadCustomers(): Promise<void> {
|
async function loadCustomers(): Promise<void> {
|
||||||
|
const mySeq = ++customerSeq
|
||||||
customerLoading.value = true
|
customerLoading.value = true
|
||||||
customerError.value = null
|
customerError.value = null
|
||||||
try {
|
try {
|
||||||
@@ -53,18 +59,21 @@ async function loadCustomers(): Promise<void> {
|
|||||||
page: customerPage.value,
|
page: customerPage.value,
|
||||||
page_size: PAGE_SIZE,
|
page_size: PAGE_SIZE,
|
||||||
})
|
})
|
||||||
|
if (mySeq !== customerSeq) return
|
||||||
customers.value = res.items
|
customers.value = res.items
|
||||||
customerTotal.value = res.total
|
customerTotal.value = res.total
|
||||||
} catch (e) {
|
} catch (e) {
|
||||||
|
if (mySeq !== customerSeq) return
|
||||||
customerError.value = (e as Error).message
|
customerError.value = (e as Error).message
|
||||||
customers.value = []
|
customers.value = []
|
||||||
customerTotal.value = 0
|
customerTotal.value = 0
|
||||||
} finally {
|
} finally {
|
||||||
customerLoading.value = false
|
if (mySeq === customerSeq) customerLoading.value = false
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
|
||||||
async function loadGroups(): Promise<void> {
|
async function loadGroups(): Promise<void> {
|
||||||
|
const mySeq = ++groupSeq
|
||||||
groupLoading.value = true
|
groupLoading.value = true
|
||||||
groupError.value = null
|
groupError.value = null
|
||||||
try {
|
try {
|
||||||
@@ -75,18 +84,20 @@ async function loadGroups(): Promise<void> {
|
|||||||
page: groupPage.value,
|
page: groupPage.value,
|
||||||
page_size: PAGE_SIZE,
|
page_size: PAGE_SIZE,
|
||||||
})
|
})
|
||||||
|
if (mySeq !== groupSeq) return
|
||||||
groups.value = res.items
|
groups.value = res.items
|
||||||
groupTotal.value = res.total
|
groupTotal.value = res.total
|
||||||
} catch (e) {
|
} catch (e) {
|
||||||
|
if (mySeq !== groupSeq) return
|
||||||
groupError.value = (e as Error).message
|
groupError.value = (e as Error).message
|
||||||
groups.value = []
|
groups.value = []
|
||||||
groupTotal.value = 0
|
groupTotal.value = 0
|
||||||
} finally {
|
} finally {
|
||||||
groupLoading.value = false
|
if (mySeq === groupSeq) groupLoading.value = false
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
|
||||||
/** 当前 tab 重查(tab 切换时总是重查,另一 tab 不会残留旧关键词的旧数据)。 */
|
/** 当前 tab 重查(tab 切换时按保留的关键词重查新 tab,对齐云客单一搜索框)。 */
|
||||||
function loadActiveTab(): void {
|
function loadActiveTab(): void {
|
||||||
if (activeTab.value === 'customers') void loadCustomers()
|
if (activeTab.value === 'customers') void loadCustomers()
|
||||||
else void loadGroups()
|
else void loadGroups()
|
||||||
@@ -116,6 +127,7 @@ function onGroupSelection(rows: Group[]): void {
|
|||||||
selectedGroups.value = rows
|
selectedGroups.value = rows
|
||||||
}
|
}
|
||||||
|
|
||||||
|
// tab 切换即按当前(跨 tab 保留的)关键词重查新 tab
|
||||||
watch(activeTab, loadActiveTab)
|
watch(activeTab, loadActiveTab)
|
||||||
watch(
|
watch(
|
||||||
() => props.ownerId,
|
() => props.ownerId,
|
||||||
|
|||||||
Reference in New Issue
Block a user