✨ 认证审核列表新增待审核/已通过/已驳回页签
审核对象是「一条认证记录」,每次提交产生一条,原列表只能看审核中的, 已通过与已驳回的记录无从查看。 三个页签默认停在待审核;切换页签回到第一页;只有审核中的记录显示「审核」, 终态记录显示「查看」(详情弹窗本就对终态禁用通过/驳回)。
This commit is contained in:
@@ -1,8 +1,9 @@
|
|||||||
import request from '@/axios';
|
import request from '@/axios';
|
||||||
|
|
||||||
/**
|
/**
|
||||||
* 待审列表:只含「审核中」的认证记录,按提交时间倒序
|
* 认证记录列表:按审核状态分页,按提交时间倒序
|
||||||
* 审核对象是**一条认证记录**,不是一辆车或一名司机,故必须带 bizType 区分
|
* 审核对象是**一条认证记录**,不是一辆车或一名司机,故必须带 bizType 区分
|
||||||
|
* status 为审核状态(0审核中 1已通过 2已驳回 3已作废);不传时后端按 0 处理
|
||||||
*/
|
*/
|
||||||
export const getPendingPage = (bizType, current, size, params) => {
|
export const getPendingPage = (bizType, current, size, params) => {
|
||||||
return request({
|
return request({
|
||||||
|
|||||||
@@ -13,6 +13,21 @@
|
|||||||
@refresh-change="refreshChange"
|
@refresh-change="refreshChange"
|
||||||
@on-load="onLoad"
|
@on-load="onLoad"
|
||||||
>
|
>
|
||||||
|
<!-- 审核状态分页签:审核对象每次提交都产生一条记录,故按记录状态分类 -->
|
||||||
|
<template #header>
|
||||||
|
<el-tabs
|
||||||
|
v-model="activeStatus"
|
||||||
|
class="cert-audit-list-page__tabs"
|
||||||
|
@tab-change="handleStatusChange"
|
||||||
|
>
|
||||||
|
<el-tab-pane
|
||||||
|
v-for="tab in statusTabs"
|
||||||
|
:key="tab.value"
|
||||||
|
:label="tab.label"
|
||||||
|
:name="tab.value"
|
||||||
|
/>
|
||||||
|
</el-tabs>
|
||||||
|
</template>
|
||||||
<template #statusText="{ row }">
|
<template #statusText="{ row }">
|
||||||
<el-tag :type="certStatusTag(row.status).type" class="status-text">
|
<el-tag :type="certStatusTag(row.status).type" class="status-text">
|
||||||
{{ row.statusText || certStatusTag(row.status).label }}
|
{{ row.statusText || certStatusTag(row.status).label }}
|
||||||
@@ -22,7 +37,10 @@
|
|||||||
{{ formatCertDateTime(row.submitTime) }}
|
{{ formatCertDateTime(row.submitTime) }}
|
||||||
</template>
|
</template>
|
||||||
<template #menu="{ row }">
|
<template #menu="{ row }">
|
||||||
<el-link type="primary" v-if="canAudit" @click="openDetail(row)">审核</el-link>
|
<!-- 只有审核中的记录能审;已通过/已驳回只能查看,弹窗内也会禁用审核按钮 -->
|
||||||
|
<el-link type="primary" v-if="canAudit" @click="openDetail(row)">
|
||||||
|
{{ isPending(row) ? '审核' : '查看' }}
|
||||||
|
</el-link>
|
||||||
</template>
|
</template>
|
||||||
</avue-crud>
|
</avue-crud>
|
||||||
|
|
||||||
@@ -38,14 +56,15 @@
|
|||||||
<script>
|
<script>
|
||||||
import { mapGetters } from 'vuex';
|
import { mapGetters } from 'vuex';
|
||||||
import { getPendingPage } from '@/api/transportCapacity/certification-audit';
|
import { getPendingPage } from '@/api/transportCapacity/certification-audit';
|
||||||
import { certStatusTag, formatCertDateTime } from '@/utils/cert-audit';
|
import { CERT_RECORD_STATUS, certStatusTag, formatCertDateTime } from '@/utils/cert-audit';
|
||||||
import { isAdministrator } from '@/utils/auth';
|
import { isAdministrator } from '@/utils/auth';
|
||||||
import CertAuditDetail from '../cert-audit-detail/main.vue';
|
import CertAuditDetail from '../cert-audit-detail/main.vue';
|
||||||
|
|
||||||
/**
|
/**
|
||||||
* 认证待审列表(司机 / 车辆共用)
|
* 认证记录列表(司机 / 车辆共用)
|
||||||
*
|
*
|
||||||
* 审核对象是「一条认证记录」,只有审核中的记录会出现在这里;
|
* 审核对象是「一条认证记录」:每次提交产生一条,按审核状态分为
|
||||||
|
* 待审核 / 已通过 / 已驳回三个页签,默认停在待审核。
|
||||||
* 列表只负责挑选记录,具体改了什么由审核详情弹窗做字段级对比。
|
* 列表只负责挑选记录,具体改了什么由审核详情弹窗做字段级对比。
|
||||||
*/
|
*/
|
||||||
export default {
|
export default {
|
||||||
@@ -80,6 +99,13 @@ export default {
|
|||||||
currentPage: 1,
|
currentPage: 1,
|
||||||
total: 0,
|
total: 0,
|
||||||
},
|
},
|
||||||
|
// 当前页签对应的审核状态,默认待审核
|
||||||
|
activeStatus: CERT_RECORD_STATUS.PENDING,
|
||||||
|
statusTabs: [
|
||||||
|
{ label: '待审核', value: CERT_RECORD_STATUS.PENDING },
|
||||||
|
{ label: '已通过', value: CERT_RECORD_STATUS.APPROVED },
|
||||||
|
{ label: '已驳回', value: CERT_RECORD_STATUS.REJECTED },
|
||||||
|
],
|
||||||
detailVisible: false,
|
detailVisible: false,
|
||||||
detailRecordId: '',
|
detailRecordId: '',
|
||||||
};
|
};
|
||||||
@@ -96,11 +122,15 @@ export default {
|
|||||||
methods: {
|
methods: {
|
||||||
certStatusTag,
|
certStatusTag,
|
||||||
formatCertDateTime,
|
formatCertDateTime,
|
||||||
|
isPending(row) {
|
||||||
|
return String(row.status) === String(CERT_RECORD_STATUS.PENDING);
|
||||||
|
},
|
||||||
onLoad(page, params = {}) {
|
onLoad(page, params = {}) {
|
||||||
this.loading = true;
|
this.loading = true;
|
||||||
getPendingPage(this.bizType, page.currentPage, page.pageSize, {
|
getPendingPage(this.bizType, page.currentPage, page.pageSize, {
|
||||||
...this.query,
|
...this.query,
|
||||||
...params,
|
...params,
|
||||||
|
status: this.activeStatus,
|
||||||
})
|
})
|
||||||
.then(res => {
|
.then(res => {
|
||||||
const data = res.data.data || {};
|
const data = res.data.data || {};
|
||||||
@@ -111,6 +141,11 @@ export default {
|
|||||||
this.loading = false;
|
this.loading = false;
|
||||||
});
|
});
|
||||||
},
|
},
|
||||||
|
// 切页签等于换一批数据,必须回到第一页,否则会停在上一页签的页码上
|
||||||
|
handleStatusChange() {
|
||||||
|
this.page.currentPage = 1;
|
||||||
|
this.onLoad(this.page, this.query);
|
||||||
|
},
|
||||||
searchChange(params, done) {
|
searchChange(params, done) {
|
||||||
this.query = params;
|
this.query = params;
|
||||||
this.page.currentPage = 1;
|
this.page.currentPage = 1;
|
||||||
@@ -135,10 +170,24 @@ export default {
|
|||||||
this.detailRecordId = row.id;
|
this.detailRecordId = row.id;
|
||||||
this.detailVisible = true;
|
this.detailVisible = true;
|
||||||
},
|
},
|
||||||
// 审核后该记录已是终态,重新拉取待审列表
|
// 审核后该记录已是终态,重新拉取当前页签的列表
|
||||||
handleAuditSuccess() {
|
handleAuditSuccess() {
|
||||||
this.onLoad(this.page, this.query);
|
this.onLoad(this.page, this.query);
|
||||||
},
|
},
|
||||||
},
|
},
|
||||||
};
|
};
|
||||||
</script>
|
</script>
|
||||||
|
|
||||||
|
<style lang="scss" scoped>
|
||||||
|
.cert-audit-list-page {
|
||||||
|
&__tabs {
|
||||||
|
:deep(.el-tabs__header) {
|
||||||
|
margin-bottom: 12px;
|
||||||
|
}
|
||||||
|
|
||||||
|
:deep(.el-tabs__nav-wrap::after) {
|
||||||
|
height: 1px;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
}
|
||||||
|
</style>
|
||||||
|
|||||||
Reference in New Issue
Block a user