fix: 伙伴列表的合作状态列显示中文,不再直接暴露英文枚举值

This commit is contained in:
文睿 张 2026-09-21 14:56:32 +08:00
parent ea63cd9931
commit cbcd54b70c
2 changed files with 39 additions and 6 deletions

View File

@ -123,3 +123,36 @@ describe('伙伴表单必填校验', () => {
wrapper.unmount() wrapper.unmount()
}) })
}) })
describe('伙伴列表的合作状态显示', () => {
beforeEach(() => {
partnersApi.list.mockReset().mockResolvedValue({ data: [] })
})
afterEach(() => {
vi.restoreAllMocks()
})
test('合作状态列显示中文,不把英文枚举值直接给用户', async () => {
partnersApi.list.mockResolvedValue({
data: [{ id: 1, partner_code: 'SUP-001', legal_name: '某某钢材有限公司', supplier_status: 'active' }]
})
const wrapper = mountPartner()
await flushPromises()
expect(wrapper.text()).toContain('启用')
expect(wrapper.text()).not.toContain('active')
wrapper.unmount()
})
test('未收录的状态原样显示,不伪装成已知状态', async () => {
partnersApi.list.mockResolvedValue({
data: [{ id: 2, partner_code: 'SUP-002', legal_name: '某某轴承厂', supplier_status: 'unknown_state' }]
})
const wrapper = mountPartner()
await flushPromises()
expect(wrapper.text()).toContain('unknown_state')
wrapper.unmount()
})
})

View File

@ -10,7 +10,7 @@
<el-table-column prop="unified_credit_code" label="统一社会信用代码" min-width="180" /> <el-table-column prop="unified_credit_code" label="统一社会信用代码" min-width="180" />
<el-table-column prop="contact_name" label="联系人" width="110" /> <el-table-column prop="contact_name" label="联系人" width="110" />
<el-table-column prop="contact_phone" label="联系电话" width="140" /> <el-table-column prop="contact_phone" label="联系电话" width="140" />
<el-table-column :prop="statusField" label="合作状态" width="110" /> <el-table-column :prop="statusField" label="合作状态" width="110" :formatter="statusFormatter" />
<el-table-column label="操作" width="100"><template #default="{ row }"><el-button link type="primary" @click="openEdit(row)">编辑</el-button></template></el-table-column> <el-table-column label="操作" width="100"><template #default="{ row }"><el-button link type="primary" @click="openEdit(row)">编辑</el-button></template></el-table-column>
</el-table> </el-table>
<el-empty v-if="!loading && rows.length === 0" :description="`暂无${title}`" /> <el-empty v-if="!loading && rows.length === 0" :description="`暂无${title}`" />
@ -25,11 +25,7 @@
<el-form-item label="地址"><el-input v-model="form.address" /></el-form-item> <el-form-item label="地址"><el-input v-model="form.address" /></el-form-item>
<el-form-item label="合作状态"> <el-form-item label="合作状态">
<el-select v-model="form.status" style="width: 100%"> <el-select v-model="form.status" style="width: 100%">
<el-option label="启用" value="active" /> <el-option v-for="(label, value) in STATUS_LABELS" :key="value" :label="label" :value="value" />
<el-option label="暂停" value="suspended" />
<el-option label="淘汰" value="eliminated" />
<el-option label="待审核" value="pending" />
<el-option label="停用" value="inactive" />
</el-select> </el-select>
</el-form-item> </el-form-item>
</el-form> </el-form>
@ -50,6 +46,10 @@ const saving = ref(false)
const dialogVisible = ref(false) const dialogVisible = ref(false)
const editingId = ref(null) const editingId = ref(null)
const statusField = computed(() => `${props.role}_status`) const statusField = computed(() => `${props.role}_status`)
// 合作状态英文枚举到中文的对照。列表列与编辑弹窗共用这一份,避免两处各写一遍后失步。
const STATUS_LABELS = { active: '启用', suspended: '暂停', eliminated: '淘汰', pending: '待审核', inactive: '停用' }
// 未收录的状态原样显示,不伪装成某个已知状态。
function statusFormatter(row, column, cellValue) { return STATUS_LABELS[cellValue] || cellValue }
const form = reactive(emptyForm()) const form = reactive(emptyForm())
function emptyForm() { return { partner_code: '', legal_name: '', unified_credit_code: '', contact_name: '', contact_phone: '', address: '', status: 'active', is_supplier: false, is_customer: false } } function emptyForm() { return { partner_code: '', legal_name: '', unified_credit_code: '', contact_name: '', contact_phone: '', address: '', status: 'active', is_supplier: false, is_customer: false } }