134 lines
3.8 KiB
Vue
134 lines
3.8 KiB
Vue
<template>
|
||
<ele-modal
|
||
:width="860"
|
||
:visible="visible"
|
||
:maskClosable="false"
|
||
:maxable="maxable"
|
||
:title="title || '审核历史'"
|
||
:body-style="{ paddingBottom: '20px' }"
|
||
@update:visible="updateVisible"
|
||
okText="关闭"
|
||
@ok="updateVisible(false)"
|
||
>
|
||
<a-space style="margin-bottom: 12px">
|
||
<span>当前审核状态：</span>
|
||
<ReviewStatusTag :review-list="list" />
|
||
<a-button size="small" :loading="loading" @click="refresh">
|
||
刷新
|
||
</a-button>
|
||
</a-space>
|
||
|
||
<div style="overflow-y: auto; padding: 10px 0" class="ele-scrollbar-hover">
|
||
<a-timeline v-if="displayList.length > 0">
|
||
<a-timeline-item
|
||
v-for="item in displayList"
|
||
:key="item.id"
|
||
:color="item.status === 1 ? 'green' : item.status === 0 ? 'red' : 'gray'"
|
||
>
|
||
<div style="margin-bottom: 8px">
|
||
<span style="color: rgba(0, 0, 0, 0.45)">
|
||
{{ toDateString(item.createTime, 'yyyy-MM-dd HH:mm:ss') }}
|
||
</span>
|
||
<a-tag
|
||
:color="item.status === 1 ? 'success' : item.status === 2 ? 'error' : 'default'"
|
||
style="margin-left: 8px"
|
||
>
|
||
{{ item.status === 1 ? '通过' : item.status === 2 ? '驳回' : '待审核' }}
|
||
</a-tag>
|
||
</div>
|
||
<div v-if="item.user?.realName" style="margin-bottom: 4px">
|
||
<span style="font-weight: 500">审核人：</span>
|
||
<span>{{ item.user.realName }}</span>
|
||
</div>
|
||
<div v-if="item.content" style="color: rgba(0, 0, 0, 0.85)">
|
||
{{ item.content }}
|
||
</div>
|
||
</a-timeline-item>
|
||
</a-timeline>
|
||
<a-empty v-else description="暂无审核记录" :image="simpleImage" />
|
||
</div>
|
||
</ele-modal>
|
||
</template>
|
||
|
||
<script lang="ts" setup>
|
||
import { computed, ref, watch } from 'vue';
|
||
import { message, Empty } from 'ant-design-vue';
|
||
import { toDateString } from 'ele-admin-pro';
|
||
import { listReviewList } from '@/api/gxmu/reviewList';
|
||
import type { ReviewList } from '@/api/gxmu/reviewList/model';
|
||
import ReviewStatusTag from './reviewStatusTag.vue';
|
||
|
||
const props = defineProps<{
|
||
visible: boolean;
|
||
title?: string;
|
||
module?: string;
|
||
pk?: number;
|
||
reviewList?: ReviewList[];
|
||
}>();
|
||
|
||
const emit = defineEmits<{
|
||
(e: 'update:visible', visible: boolean): void;
|
||
}>();
|
||
|
||
const loading = ref(false);
|
||
const maxable = ref(true);
|
||
const list = ref<ReviewList[]>([]);
|
||
const simpleImage = Empty.PRESENTED_IMAGE_SIMPLE;
|
||
|
||
const updateVisible = (value: boolean) => {
|
||
emit('update:visible', value);
|
||
};
|
||
|
||
const displayList = computed(() => {
|
||
const getTime = (value?: string) => {
|
||
const t = Date.parse(value || '');
|
||
return Number.isFinite(t) ? t : 0;
|
||
};
|
||
return [...(list.value ?? [])].sort((a, b) => {
|
||
const diff = getTime(b.createTime) - getTime(a.createTime);
|
||
if (diff !== 0) return diff;
|
||
return (b.id || 0) - (a.id || 0);
|
||
});
|
||
});
|
||
|
||
const refresh = () => {
|
||
if (!props.module || !props.pk) {
|
||
list.value = props.reviewList ? [...props.reviewList] : [];
|
||
return;
|
||
}
|
||
loading.value = true;
|
||
listReviewList({
|
||
module: props.module,
|
||
pk: props.pk
|
||
})
|
||
.then((data) => {
|
||
loading.value = false;
|
||
list.value = data || [];
|
||
})
|
||
.catch((e) => {
|
||
loading.value = false;
|
||
message.error(e.message);
|
||
list.value = props.reviewList ? [...props.reviewList] : [];
|
||
});
|
||
};
|
||
|
||
watch(
|
||
() => props.visible,
|
||
(visible) => {
|
||
if (visible) {
|
||
list.value = props.reviewList ? [...props.reviewList] : [];
|
||
refresh();
|
||
} else {
|
||
list.value = [];
|
||
}
|
||
},
|
||
{ immediate: true }
|
||
);
|
||
</script>
|
||
|
||
<style lang="less" scoped>
|
||
.ele-scrollbar-hover :deep(.ant-timeline-item-last > .ant-timeline-item-content) {
|
||
min-height: auto;
|
||
}
|
||
</style>
|