Fix edit mode PUT payload (status field) and add error handling to fetchUsers
This commit is contained in:
@@ -87,7 +87,7 @@ async function handleSubmit() {
|
|||||||
await api.put(`/api/v1/users/${props.userData!.id}`, {
|
await api.put(`/api/v1/users/${props.userData!.id}`, {
|
||||||
username: formState.username,
|
username: formState.username,
|
||||||
email: formState.email,
|
email: formState.email,
|
||||||
ext: props.userData!.ext,
|
status: formState.status,
|
||||||
})
|
})
|
||||||
}
|
}
|
||||||
message.success('操作成功')
|
message.success('操作成功')
|
||||||
|
|||||||
@@ -2,6 +2,7 @@ import { describe, it, expect, vi, beforeEach, afterEach } from 'vitest'
|
|||||||
import { setActivePinia, createPinia } from 'pinia'
|
import { setActivePinia, createPinia } from 'pinia'
|
||||||
import { mount, flushPromises } from '@vue/test-utils'
|
import { mount, flushPromises } from '@vue/test-utils'
|
||||||
import { nextTick } from 'vue'
|
import { nextTick } from 'vue'
|
||||||
|
import { message } from 'ant-design-vue'
|
||||||
import { useUserManageStore, type UserRecord } from '@/stores/user-manage'
|
import { useUserManageStore, type UserRecord } from '@/stores/user-manage'
|
||||||
|
|
||||||
// jsdom 不支持 matchMedia,Ant Design Vue 响应式布局需要
|
// jsdom 不支持 matchMedia,Ant Design Vue 响应式布局需要
|
||||||
@@ -133,13 +134,17 @@ describe('useUserManageStore', () => {
|
|||||||
expect(store.pagination.page).toBe(2)
|
expect(store.pagination.page).toBe(2)
|
||||||
})
|
})
|
||||||
|
|
||||||
it('sets loading to false even on error', async () => {
|
it('sets loading to false and shows error message on failure', async () => {
|
||||||
const { api } = await import('@/utils/request')
|
const { api } = await import('@/utils/request')
|
||||||
vi.mocked(api.get).mockRejectedValueOnce(new Error('Network error'))
|
vi.mocked(api.get).mockRejectedValueOnce(new Error('Network error'))
|
||||||
|
const errorSpy = vi.spyOn(message, 'error').mockImplementation(() => ({}) as any)
|
||||||
|
|
||||||
const store = useUserManageStore()
|
const store = useUserManageStore()
|
||||||
await expect(store.fetchUsers()).rejects.toThrow('Network error')
|
await store.fetchUsers()
|
||||||
expect(store.loading).toBe(false)
|
expect(store.loading).toBe(false)
|
||||||
|
expect(store.users).toEqual([])
|
||||||
|
expect(errorSpy).toHaveBeenCalledWith('Network error')
|
||||||
|
errorSpy.mockRestore()
|
||||||
})
|
})
|
||||||
})
|
})
|
||||||
|
|
||||||
|
|||||||
@@ -157,17 +157,28 @@ describe('UserFormModal', () => {
|
|||||||
await flushPromises()
|
await flushPromises()
|
||||||
})
|
})
|
||||||
|
|
||||||
it('calls api.put for edit mode', async () => {
|
it('calls api.put for edit mode with status field', async () => {
|
||||||
const { api } = await import('@/utils/request')
|
const { api } = await import('@/utils/request')
|
||||||
vi.mocked(api.put).mockResolvedValueOnce({})
|
vi.mocked(api.put).mockResolvedValueOnce({})
|
||||||
|
|
||||||
await mountModal({ mode: 'edit', userData: mockUserData })
|
// 先以 open=false 挂载,再切换为 true 触发 watch 预填数据,使表单验证通过
|
||||||
|
const w = await mountModal({ mode: 'edit', userData: mockUserData, open: false })
|
||||||
|
await w.setProps({ open: true })
|
||||||
|
await flushPromises()
|
||||||
|
await nextTick()
|
||||||
|
|
||||||
// 点击确定按钮
|
// 点击确定按钮
|
||||||
const okBtn = document.body.querySelector('.ant-modal-footer .ant-btn-primary') as HTMLElement
|
const okBtn = document.body.querySelector('.ant-modal-footer .ant-btn-primary') as HTMLElement
|
||||||
expect(okBtn).toBeTruthy()
|
expect(okBtn).toBeTruthy()
|
||||||
okBtn?.click()
|
okBtn?.click()
|
||||||
await flushPromises()
|
await flushPromises()
|
||||||
|
|
||||||
|
// 验证 PUT payload 包含 status 且不包含 ext
|
||||||
|
expect(api.put).toHaveBeenCalledOnce()
|
||||||
|
const [url, payload] = vi.mocked(api.put).mock.calls[0]
|
||||||
|
expect(url).toContain('/api/v1/users/')
|
||||||
|
expect(payload).toHaveProperty('status')
|
||||||
|
expect(payload).not.toHaveProperty('ext')
|
||||||
})
|
})
|
||||||
})
|
})
|
||||||
})
|
})
|
||||||
|
|||||||
@@ -45,6 +45,9 @@ export const useUserManageStore = defineStore('user-manage', () => {
|
|||||||
users.value = data.items
|
users.value = data.items
|
||||||
pagination.total = data.total
|
pagination.total = data.total
|
||||||
pagination.page = data.page
|
pagination.page = data.page
|
||||||
|
} catch (err: unknown) {
|
||||||
|
const msg = err instanceof Error ? err.message : '获取用户列表失败'
|
||||||
|
message.error(msg)
|
||||||
} finally {
|
} finally {
|
||||||
loading.value = false
|
loading.value = false
|
||||||
}
|
}
|
||||||
|
|||||||
Reference in New Issue
Block a user