102 lines
3.4 KiB
JavaScript
102 lines
3.4 KiB
JavaScript
import { mount } from '@vue/test-utils'
|
|
import { createPinia, setActivePinia } from 'pinia'
|
|
import { beforeEach, describe, expect, it } from 'vitest'
|
|
import FmsQueryControl from '@/components/fms-module-list/FmsQueryControl.vue'
|
|
import FmsQueryToolbar from '@/components/fms-module-list/FmsQueryToolbar.vue'
|
|
import FmsAdvancedQueryPanel from '@/components/fms-module-list/FmsAdvancedQueryPanel.vue'
|
|
|
|
/** 构造一个查询条件项（字段 + 配置），供工具栏布局用例复用 */
|
|
const queryItem = (field) => ({
|
|
field: { b_field: field, b_type: 'input' },
|
|
config: { b_operator: 'like', b_component: 'input' },
|
|
})
|
|
|
|
describe('fms-module-list components', () => {
|
|
beforeEach(() => setActivePinia(createPinia()))
|
|
|
|
it('mounts a text query control with the new UI kit', () => {
|
|
const wrapper = mount(FmsQueryControl, {
|
|
props: {
|
|
item: {
|
|
field: { b_field: 'name', b_type: 'input' },
|
|
config: { b_operator: 'like', b_component: 'input' },
|
|
},
|
|
modelValue: '',
|
|
},
|
|
})
|
|
expect(wrapper.find('input').exists()).toBe(true)
|
|
})
|
|
|
|
it('mounts an empty toolbar without legacy Ant components', () => {
|
|
const wrapper = mount(FmsQueryToolbar)
|
|
expect(wrapper.find('.fms-query-toolbar').exists()).toBe(true)
|
|
expect(wrapper.html()).not.toContain('<a-')
|
|
})
|
|
|
|
it('查询条件网格列数按条件数收缩（只有一个条件时不占 4 列宽）', () => {
|
|
const one = mount(FmsQueryToolbar, {
|
|
props: {
|
|
queryItems: [queryItem('b_name')],
|
|
queryLayout: { area: { b_name: 'quick' }, order: { b_name: 10 } },
|
|
},
|
|
})
|
|
expect(one.find('.query-grid').element.style.gridTemplateColumns).toBe(
|
|
'repeat(1, minmax(0, 200px))',
|
|
)
|
|
one.unmount()
|
|
|
|
const four = mount(FmsQueryToolbar, {
|
|
props: {
|
|
queryItems: [queryItem('a'), queryItem('b'), queryItem('c'), queryItem('d')],
|
|
queryLayout: {
|
|
area: { a: 'quick', b: 'quick', c: 'quick', d: 'quick' },
|
|
order: {},
|
|
},
|
|
},
|
|
})
|
|
expect(four.find('.query-grid').element.style.gridTemplateColumns).toBe(
|
|
'repeat(4, minmax(0, 200px))',
|
|
)
|
|
four.unmount()
|
|
})
|
|
|
|
it('高级查询行间连接符表达行与行的连接：≥2 项才出现，点击切换后一项的 join', async () => {
|
|
const state = {
|
|
nodes: [
|
|
{ id: 'n1', join: 'and', field: 'name', operator: 'like', value: 'a' },
|
|
{ id: 'n2', join: 'and', field: 'name', operator: 'like', value: 'b' },
|
|
],
|
|
groups: [],
|
|
}
|
|
const wrapper = mount(FmsAdvancedQueryPanel, {
|
|
props: { open: true, items: [], modelValue: state },
|
|
})
|
|
|
|
const pill = wrapper.find('.filter-joiner .joiner-pill')
|
|
expect(pill.exists()).toBe(true)
|
|
expect(pill.text()).toBe('且')
|
|
|
|
await pill.trigger('click')
|
|
expect(state.nodes[1].join).toBe('or')
|
|
expect(wrapper.find('.filter-joiner .joiner-pill').text()).toBe('或')
|
|
wrapper.unmount()
|
|
})
|
|
|
|
it('只有 1 个条件时不显示行间连接符（没有连接对象），条件行直接可见', () => {
|
|
const wrapper = mount(FmsAdvancedQueryPanel, {
|
|
props: {
|
|
open: true,
|
|
items: [],
|
|
modelValue: {
|
|
logic: 'and',
|
|
nodes: [{ id: 'n1', field: 'name', operator: 'like', value: '' }],
|
|
groups: [],
|
|
},
|
|
},
|
|
})
|
|
expect(wrapper.find('.filter-joiner').exists()).toBe(false)
|
|
expect(wrapper.find('.filter-row').exists()).toBe(true)
|
|
wrapper.unmount()
|
|
})
|
|
})
|