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
117
118
119
120
121
122
123
124
125
126
127
128
129
130
131
132
133
134
135
136
137
138
139
140
141
142
143
144
145
146
147
148
149
150
151
152
153
154
155
156
157
158
159
| <template>
| <div>
| <basicContainer>
| <avue-crud
| ref="crudRef"
| v-model="form"
| :option="option"
| :data="tableData"
| :table-loading="pageF.loading"
| :page="page"
| :permission="permissionList"
| @on-load="onLoad"
| @search-change="searchChange"
| @search-reset="searchReset"
| @current-change="currentChange"
| @size-change="sizeChange"
| @refresh-change="refreshChange"
| >
| <template #menu-left>
| <el-button
| type="warning"
| icon="Download"
| style="background-color: #eb9e44; border-color: #eb9e44; color: #fff;"
| @click="handleExport"
| v-hasPermi="['cwgl:receivableBillManagement:export']"
| >导出</el-button>
| </template>
|
| <template #menu="{ row, size }">
| <el-link
| type="primary"
| underline="hover"
| @click="handleAgeAnalysis(row)"
| style="margin-right: 15px"
| >账龄分析表</el-link>
|
| <el-link
| type="primary"
| underline="hover"
| @click="handleAccountAnalysis(row)"
| >账款分析表</el-link>
| </template>
| </avue-crud>
| </basicContainer>
| </div>
| </template>
|
| <script setup name="ReceivableAnalysis" lang="ts">
| import { reactive, ref, computed, toRefs } from "vue";
| import { usePagePlus } from "@/hooks/usePagePlus";
| import { hasPermission } from "@/utils/permissionUtils";
| // 假设对应的API接口路径(需根据实际后端接口调整)
| import { customerSummaryList, exportBankAccountConfig } from "@/api/cwgl/analysisManagement";
| import router from "@/router";
|
| const crudRef = ref();
|
| // 权限控制
| const permissionList = computed(() => {
| return {
| addBtn: false, // 界面不需要新增
| delBtn: false, // 界面不需要删除
| editBtn: false, // 界面不需要默认编辑
| viewBtn: false,
| menu: true, // 显示操作栏
| };
| });
|
| const data = reactive({
| form: {},
| queryParams: {},
| page: {
| pageSize: 10,
| total: 0,
| currentPage: 1,
| },
| });
|
| const { queryParams, form, page } = toRefs(data);
|
| const option = ref({
| align: 'center',
| headerAlign: 'center',
| index: false,
| addBtn: false,
| refreshBtn: false,
| columnBtn: false,
| searchIndex: 1,
| searchIcon: true,
| searchMenuSpan: 4, // 对应图片搜索按钮位置
| searchSpan: 6,
| gutter: 20,
| column: [
| {
| label: '客户名称',
| prop: 'customerName',
| search: true,
| minWidth: 200,
| },
| {
| label: '合计含暂估应收账款余额',
| prop: 'totalEstimatedAmount',
| minWidth: 180,
| },
| {
| label: '合计已确认应收账款金额',
| prop: 'totalConfirmedAmount',
| minWidth: 180,
| },
| {
| label: '合计应收账款余额',
| prop: 'totalPendingAmount',
| minWidth: 150,
| }
| ]
| });
|
| // 使用 Hook 统一管理分页逻辑
| const {
| tableData,
| pageF,
| onLoad,
| searchChange,
| searchReset,
| currentChange,
| sizeChange,
| handleExport,
| refreshChange
| } = usePagePlus({
| form: form,
| option: option,
| queryParams: queryParams,
| page: page.value,
| getListApi: customerSummaryList,
| exportApi: exportBankAccountConfig,
| });
|
| /**
| * 业务跳转:账龄分析表
| */
| const handleAgeAnalysis = (row: any) => {
| // 可使用 router.push 进行跳转
| console.log(row.customerName);
| router.push('/basic/ageAnalysis?customerName='+row.customerName)
| };
|
| /**
| * 业务跳转:账款分析表
| */
| const handleAccountAnalysis = (row: any) => {
| // console.log("跳转至账款分析表", row.customerName);
| router.push('/basic/accountAnalysisDetail?customerName='+row.customerName)
| };
|
| </script>
|
| <style scoped>
|
| </style>
|
|