|
|
|
@ -63,10 +63,22 @@ |
|
|
|
<div class="report-cell">序号</div> |
|
|
|
<div class="report-cell">律师姓名</div> |
|
|
|
<div class="report-cell">执业证号</div> |
|
|
|
<div class="report-cell">季度累计公益服务时长</div> |
|
|
|
<div class="report-cell">季度累计公益服务成本</div> |
|
|
|
<div class="report-cell">年度累计公益服务时长</div> |
|
|
|
<div class="report-cell">年度累计公益服务成本</div> |
|
|
|
<div class="report-cell sortable" @click="handleSort('quarterlyServiceDuration')"> |
|
|
|
季度累计公益服务时长 |
|
|
|
<span class="sort-icon">{{ getSortIcon('quarterlyServiceDuration') }}</span> |
|
|
|
</div> |
|
|
|
<div class="report-cell sortable" @click="handleSort('quarterlyServiceCost')"> |
|
|
|
季度累计公益服务成本 |
|
|
|
<span class="sort-icon">{{ getSortIcon('quarterlyServiceCost') }}</span> |
|
|
|
</div> |
|
|
|
<div class="report-cell sortable" @click="handleSort('annualServiceDuration')"> |
|
|
|
年度累计公益服务时长 |
|
|
|
<span class="sort-icon">{{ getSortIcon('annualServiceDuration') }}</span> |
|
|
|
</div> |
|
|
|
<div class="report-cell sortable" @click="handleSort('annualServiceCost')"> |
|
|
|
年度累计公益服务成本 |
|
|
|
<span class="sort-icon">{{ getSortIcon('annualServiceCost') }}</span> |
|
|
|
</div> |
|
|
|
</div> |
|
|
|
|
|
|
|
<!-- 数据行 --> |
|
|
|
@ -76,9 +88,7 @@ |
|
|
|
<div class="report-cell">{{ item.certificateNumber || '-' }}</div> |
|
|
|
<div class="report-cell">{{ formatNumber(item.quarterlyServiceDuration) }}</div> |
|
|
|
<div class="report-cell">{{ formatCurrency(item.quarterlyServiceCost) }}</div> |
|
|
|
<!--<div class="report-cell">0</div>--> |
|
|
|
<div class="report-cell">{{ formatNumber(item.annualServiceDuration) }}</div> |
|
|
|
<!--<div class="report-cell">0</div>--> |
|
|
|
<div class="report-cell">{{ formatCurrency(item.annualServiceCost) }}</div> |
|
|
|
</div> |
|
|
|
|
|
|
|
@ -150,6 +160,66 @@ function initYearOptions() { |
|
|
|
// 表格数据 |
|
|
|
const tableData = ref(props.tableData || []); |
|
|
|
|
|
|
|
// 排序状态:{ field: 'annualServiceCost', order: 'desc' | 'asc' | null } |
|
|
|
const sortState = ref({ field: '', order: '' }); |
|
|
|
|
|
|
|
// 点击表头排序(后端排序) |
|
|
|
async function handleSort(field) { |
|
|
|
let newOrder; |
|
|
|
if (sortState.value.field !== field) { |
|
|
|
// 首次点击该列,默认降序(金额大的排前面) |
|
|
|
newOrder = 'desc'; |
|
|
|
} else if (sortState.value.order === 'desc') { |
|
|
|
// 再次点击切换为升序 |
|
|
|
newOrder = 'asc'; |
|
|
|
} else { |
|
|
|
// 第三次点击切换回降序(保持排序始终有方向) |
|
|
|
newOrder = 'desc'; |
|
|
|
} |
|
|
|
sortState.value = { field, order: newOrder }; |
|
|
|
|
|
|
|
// 调用后端排序 |
|
|
|
queryLoading.value = true; |
|
|
|
try { |
|
|
|
const params = { |
|
|
|
...localQueryForm, |
|
|
|
sortField: field, |
|
|
|
sortOrder: newOrder |
|
|
|
}; |
|
|
|
const res = await serviceApplicationsApi.statistics(params); |
|
|
|
if (res.data && Array.isArray(res.data)) { |
|
|
|
tableData.value = res.data.map(item => ({ |
|
|
|
...item, |
|
|
|
quarterlyServiceDuration: Number(item.quarterlyServiceDuration) || 0, |
|
|
|
quarterlyServiceCost: Number(item.quarterlyServiceCost) || 0, |
|
|
|
annualServiceDuration: Number(item.annualServiceDuration) || 0, |
|
|
|
annualServiceCost: Number(item.annualServiceCost) || 0 |
|
|
|
})); |
|
|
|
} else { |
|
|
|
tableData.value = []; |
|
|
|
} |
|
|
|
} catch (error) { |
|
|
|
console.error('排序失败', error); |
|
|
|
message.error('排序失败'); |
|
|
|
} finally { |
|
|
|
queryLoading.value = false; |
|
|
|
} |
|
|
|
} |
|
|
|
|
|
|
|
// 获取排序图标 |
|
|
|
function getSortIcon(field) { |
|
|
|
if (sortState.value.field !== field) { |
|
|
|
return '⇅'; |
|
|
|
} |
|
|
|
if (sortState.value.order === 'asc') { |
|
|
|
return '↑'; |
|
|
|
} |
|
|
|
if (sortState.value.order === 'desc') { |
|
|
|
return '↓'; |
|
|
|
} |
|
|
|
return '⇅'; |
|
|
|
} |
|
|
|
|
|
|
|
// 计算汇总数据 |
|
|
|
const summaryData = computed(() => { |
|
|
|
|
|
|
|
@ -191,6 +261,8 @@ function formatCurrency(value) { |
|
|
|
// 查询数据 |
|
|
|
async function handleQuery() { |
|
|
|
queryLoading.value = true; |
|
|
|
// 重置排序状态 |
|
|
|
sortState.value = { field: '', order: '' }; |
|
|
|
try { |
|
|
|
const params = { |
|
|
|
...localQueryForm |
|
|
|
@ -368,4 +440,21 @@ onMounted(() => { |
|
|
|
.report-row:last-child .report-cell { |
|
|
|
border-bottom: none; |
|
|
|
} |
|
|
|
|
|
|
|
/* 可排序列样式 */ |
|
|
|
.report-cell.sortable { |
|
|
|
cursor: pointer; |
|
|
|
user-select: none; |
|
|
|
transition: background-color 0.2s; |
|
|
|
} |
|
|
|
|
|
|
|
.report-cell.sortable:hover { |
|
|
|
background-color: #003399; |
|
|
|
} |
|
|
|
|
|
|
|
.sort-icon { |
|
|
|
margin-left: 4px; |
|
|
|
font-size: 12px; |
|
|
|
opacity: 0.85; |
|
|
|
} |
|
|
|
</style> |