优化估值审核页面功能

This commit is contained in:
Wei_佳 2025-11-13 17:53:01 +08:00
parent 106472944b
commit bd76792ec9

View File

@ -34,7 +34,6 @@ const statusOptions = [
{ label: '全部', value: '' }, { label: '全部', value: '' },
{ label: '待审核', value: 'pending' }, { label: '待审核', value: 'pending' },
{ label: '已完成', value: 'approved' }, { label: '已完成', value: 'approved' },
{ label: '已拒绝', value: 'rejected' },
] ]
const { const {
@ -67,6 +66,13 @@ const approvalForm = ref({
}) })
const approvalFormRef = ref(null) const approvalFormRef = ref(null)
//
const contentModalVisible = ref(false)
const contentForm = ref({
content: '',
})
const contentFormRef = ref(null)
onMounted(() => { onMounted(() => {
$table.value?.handleSearch() $table.value?.handleSearch()
}) })
@ -76,7 +82,6 @@ const renderStatus = (status) => {
const statusMap = { const statusMap = {
pending: { type: 'warning', text: '待审核' }, pending: { type: 'warning', text: '待审核' },
approved: { type: 'success', text: '已完成' }, approved: { type: 'success', text: '已完成' },
rejected: { type: 'error', text: '已拒绝' },
} }
const config = statusMap[status] || { type: 'default', text: '未知' } const config = statusMap[status] || { type: 'default', text: '未知' }
return h(NTag, { type: config.type }, { default: () => config.text }) return h(NTag, { type: config.type }, { default: () => config.text })
@ -148,28 +153,25 @@ const columns = [
{ {
title: '操作', title: '操作',
key: 'actions', key: 'actions',
width: 150, width: 120,
align: 'center', align: 'center',
fixed: 'right', fixed: 'right',
render(row) { render(row) {
return [ if (row.status === 'pending') {
// - return h(
row.status === 'pending' && NButton,
h( {
NButton, size: 'small',
{ type: 'primary',
size: 'small', onClick: () => handleApprove(row),
type: 'primary', },
style: 'margin-right: 8px;', {
onClick: () => handleApprove(row), default: () => '审核',
}, icon: renderIcon('mdi:check-circle-outline', { size: 16 }),
{ }
default: () => '审核', )
icon: renderIcon('mdi:check-circle-outline', { size: 16 }), } else if (row.status === 'approved') {
} return h(
),
//
h(
NButton, NButton,
{ {
size: 'small', size: 'small',
@ -180,8 +182,9 @@ const columns = [
default: () => '查看', default: () => '查看',
icon: renderIcon('mdi:eye-outline', { size: 16 }), icon: renderIcon('mdi:eye-outline', { size: 16 }),
} }
), )
] }
return null
}, },
}, },
] ]
@ -199,12 +202,33 @@ function handleApprove(row) {
// //
function handleView(row) { function handleView(row) {
handleEdit(row) console.log('查看详情', row)
} }
// //
async function submitApproval(action) { function handleAddContent() {
contentForm.value = {
content: '',
}
contentModalVisible.value = true
}
//
function handleContentSave() {
contentFormRef.value?.validate((errors) => {
if (!errors) {
console.log('保存文案设置', contentForm.value)
// API
contentModalVisible.value = false
$message.success('文案设置保存成功')
}
})
}
//
async function handleApprovalSubmit(action) {
try { try {
approvalForm.value.action = action
await approvalFormRef.value?.validate() await approvalFormRef.value?.validate()
const apiCall = action === 'approve' ? api.approveValuation : api.rejectValuation const apiCall = action === 'approve' ? api.approveValuation : api.rejectValuation
@ -233,6 +257,16 @@ const approvalRules = {
}, },
], ],
} }
const contentRules = {
content: [
{
required: true,
message: '请输入文案内容',
trigger: ['input', 'blur'],
},
],
}
</script> </script>
<template> <template>
@ -296,6 +330,13 @@ const approvalRules = {
/> />
</QueryBarItem> </QueryBarItem>
</template> </template>
<template #action>
<NButton type="primary" @click="handleAddContent">
<TheIcon icon="mdi:plus" :size="18" class="mr-5" />
新增文案设置
</NButton>
</template>
</CrudTable> </CrudTable>
<!-- 查看详情弹窗 --> <!-- 查看详情弹窗 -->
@ -375,13 +416,13 @@ const approvalRules = {
</NFormItem> </NFormItem>
<NFormItem> <NFormItem>
<NSpace> <NSpace>
<NButton type="success" @click="submitApproval('approve')"> <NButton type="success" @click="handleApprovalSubmit('approve')">
<template #icon> <template #icon>
<TheIcon icon="mdi:check-circle-outline" :size="16" /> <TheIcon icon="mdi:check-circle-outline" :size="16" />
</template> </template>
通过 通过
</NButton> </NButton>
<NButton type="error" @click="submitApproval('reject')"> <NButton type="error" @click="handleApprovalSubmit('reject')">
<template #icon> <template #icon>
<TheIcon icon="mdi:close-circle-outline" :size="16" /> <TheIcon icon="mdi:close-circle-outline" :size="16" />
</template> </template>
@ -392,5 +433,38 @@ const approvalRules = {
</NFormItem> </NFormItem>
</NForm> </NForm>
</CrudModal> </CrudModal>
<!-- 文案设置弹窗 -->
<CrudModal
v-model:visible="contentModalVisible"
title="新增文案设置"
:show-footer="false"
>
<NForm
ref="contentFormRef"
label-placement="left"
label-align="left"
:label-width="80"
:model="contentForm"
:rules="contentRules"
>
<NFormItem label="文案" path="content">
<NInput
v-model:value="contentForm.content"
type="textarea"
:rows="6"
placeholder="请输入文案内容"
/>
</NFormItem>
<NFormItem>
<NSpace>
<NButton type="primary" @click="handleContentSave">
保存
</NButton>
<NButton @click="contentModalVisible = false">取消</NButton>
</NSpace>
</NFormItem>
</NForm>
</CrudModal>
</CommonPage> </CommonPage>
</template> </template>