<template>
|
<ProTabs
|
v-model="queryState.status"
|
flexTitle
|
name="resourceManage-tab"
|
:showPaneContent="false"
|
class="resourceManage-tabs"
|
>
|
<ProTabPane
|
:title="`${ResourceStatusText[ResourceStatus.Running]}(${runningCount})`"
|
:pane-key="ResourceStatus.Running"
|
></ProTabPane>
|
<ProTabPane
|
:title="`${ResourceStatusText[ResourceStatus.WaitAudit]}(${waitAuditCount})`"
|
:pane-key="ResourceStatus.WaitAudit"
|
></ProTabPane>
|
<ProTabPane
|
:title="`${ResourceStatusText[ResourceStatus.OffShelf]}(${offShelfCount})`"
|
:pane-key="ResourceStatus.OffShelf"
|
></ProTabPane>
|
<ProTabPane
|
:title="`${ResourceStatusText[ResourceStatus.Reject]}(${rejectCount})`"
|
:pane-key="ResourceStatus.Reject"
|
></ProTabPane>
|
</ProTabs>
|
<InfiniteLoading
|
:key="queryState.status"
|
scrollViewClassName="common-infinite-scroll-list"
|
v-bind="infiniteLoadingProps"
|
>
|
<template #renderItem="{ item }">
|
<ResourceManageCard
|
:title="item.title"
|
:time="item.creationTime"
|
:resourceCount="item.resourceCount"
|
:intendedDeliveryCities="item.intendedDeliveryCities"
|
:status="item.status"
|
@edit="handleEdit(item)"
|
@stop="handleStop(item)"
|
@delete="handleDelete(item)"
|
@detail="handleGoDetail(item)"
|
@publish="handleRePublish(item)"
|
@copy="handleCopy(item)"
|
>
|
</ResourceManageCard>
|
</template>
|
</InfiniteLoading>
|
</template>
|
|
<script setup lang="ts">
|
import { useInfiniteLoading } from '@12333/hooks';
|
import * as resourceServices from '@12333/services/api/Resource';
|
import { OrderInputType, ResourceStatusText, ResourceStatus } from '@12333/constants';
|
import { useResourceActions } from '@/hooks';
|
import Taro from '@tarojs/taro';
|
import { ProTabs, ProTabPane } from '@12333/components';
|
|
const queryState = reactive({
|
status: ResourceStatus.Running,
|
});
|
|
const objectData = ref<{ status: ResourceStatus; count: number }[]>([]);
|
|
const { infiniteLoadingProps, invalidateQueries } = useInfiniteLoading(
|
async ({ pageParam }) => {
|
let params: API.GetMyResourceListInput = {
|
pageModel: {
|
rows: 20,
|
page: pageParam,
|
orderInput: [{ property: 'id', order: OrderInputType.Desc }],
|
},
|
status: queryState.status,
|
};
|
|
let res = await resourceServices.getMyResourceList(params, {
|
showLoading: false,
|
});
|
objectData.value = res.objectData;
|
return res;
|
},
|
{
|
queryKey: ['resourceServices/getMyResourceList', queryState],
|
}
|
);
|
|
const runningCount = computed(
|
() => objectData.value?.find?.((x) => x.status === ResourceStatus.Running)?.count ?? 0
|
);
|
|
const waitAuditCount = computed(
|
() => objectData.value?.find?.((x) => x.status === ResourceStatus.WaitAudit)?.count ?? 0
|
);
|
|
const offShelfCount = computed(
|
() => objectData.value?.find?.((x) => x.status === ResourceStatus.OffShelf)?.count ?? 0
|
);
|
|
const rejectCount = computed(
|
() => objectData.value?.find?.((x) => x.status === ResourceStatus.Reject)?.count ?? 0
|
);
|
|
const { handleEdit, handleGoDetail, handleStop, handleRePublish, handleCopy, handleDelete } =
|
useResourceActions({
|
onStopSuccess() {
|
invalidateQueries();
|
},
|
onDeleteSuccess() {
|
invalidateQueries();
|
},
|
});
|
</script>
|
