wupengfei
昨天 0458b859259b5806f4923b0ea791893bdffbf771
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
82
83
84
85
86
87
88
89
90
91
92
93
94
95
96
97
98
99
100
101
102
103
104
105
106
107
108
109
110
111
112
113
114
115
116
<template>
  <LoadingLayout :loading="state.loading">
    <AppContainer>
      <ProTableV2
        v-bind="proTableProps"
        :columns="settleColumns"
        :operationBtns="settleOperationBtns"
      >
      </ProTableV2>
    </AppContainer>
  </LoadingLayout>
</template>
 
<script setup lang="ts">
import { ProTableV2, LoadingLayout, AppContainer, useTable } from '@bole-core/components';
import { ModelValueType } from 'element-plus';
import * as taskUserServices from '@/services/api/taskUser';
import { useQuery } from '@tanstack/vue-query';
import { SettlementReceiveStatusText } from '@/constants';
import { downloadFileByUrl, paginateList, setOSSLink } from '@/utils';
 
defineOptions({
  name: 'SelltementDetailView',
});
 
const operationBtnMap: Record<string, OperationBtnType> = {
  'settle-downloadBtn': {
    emits: { onClick: (role) => handleDownload(role) },
    extraProps: {
      hide: (row: API.GetSettlementTaskUsersQueryResultItem) => !row.ereceiptDownloadOssUrl,
    },
  },
};
 
const { checkSubModuleItemShow, column, operationBtns } = useAccess({
  operationBtnMap,
});
 
const [settleColumns] = useGroupColumns(column, ['settle-']);
const [settleOperationBtns] = useGroupOperationBtns(operationBtns, ['settle-']);
 
const route = useRoute();
const id = route.params?.id as string;
const BaseState = {
  loading: true,
  settlementTaskUsers: [] as API.GetSettlementTaskUsersQueryResultItem[],
};
 
const state = reactive({ ...BaseState });
 
onMounted(async () => {
  await getList();
  state.loading = false;
});
 
const { isLoading, data, refetch } = useQuery({
  queryKey: ['taskUserServices/getSettlementTaskUsers', id],
  queryFn: async () => {
    return await taskUserServices.getSettlementTaskUsers(
      { taskInfoId: id },
      {
        showLoading: false,
      }
    );
  },
  placeholderData: () => ({} as API.GetSettlementTaskUsersQueryResult),
  onSuccess(res) {
    state.settlementTaskUsers = res.data;
    getList();
  },
  enabled: !!id,
});
 
const {
  getDataSource: getList,
  proTableProps,
  paginationState,
  extraParamState,
  reset,
} = useTable(
  async ({ pageIndex, pageSize }, extraParamState) => {
    try {
      let list = [...state.settlementTaskUsers];
 
      return Promise.resolve({
        pageModel: {
          rows: pageSize,
          page: pageIndex,
          totalCount: list.length,
        },
        data: paginateList(list, pageIndex, pageSize),
      });
    } catch (error) {
      console.log('error: ', error);
    }
  },
  {
    defaultExtraParams: {
      keywords: '',
      orderInput: [{ property: 'id', order: EnumPagedListOrder.Desc }],
    },
    queryKey: ['taskUserServices/getSettlementTaskUsers'],
    columnsRenderProps: {
      settlementTime: { type: 'date' },
      createdTime: { type: 'date' },
      settlementAmount: { type: 'money' },
      actualSettlementAmount: { type: 'money' },
      settlementReceiveStatus: { type: 'enum', valueEnum: SettlementReceiveStatusText },
    },
  }
);
 
function handleDownload(row: API.GetSettlementTaskUsersQueryResultItem) {
  downloadFileByUrl(setOSSLink(row.ereceiptDownloadOssUrl), '结算回单');
}
</script>