82 lines
		
	
	
		
			1.9 KiB
		
	
	
	
		
			Vue
		
	
	
			
		
		
	
	
			82 lines
		
	
	
		
			1.9 KiB
		
	
	
	
		
			Vue
		
	
	
| <script lang="ts" setup>
 | |
| import type { VxeTableGridOptions } from '#/adapter/vxe-table';
 | |
| 
 | |
| import { DocAlert, Page, useVbenModal } from '@vben/common-ui';
 | |
| import { $t } from '@vben/locales';
 | |
| 
 | |
| import { ACTION_ICON, TableAction, useVbenVxeGrid } from '#/adapter/vxe-table';
 | |
| import { getNotifyTaskPage } from '#/api/pay/notify';
 | |
| 
 | |
| import { useGridColumns, useGridFormSchema } from './data';
 | |
| import Detail from './modules/detail.vue';
 | |
| 
 | |
| const [DetailModal, detailModalApi] = useVbenModal({
 | |
|   connectedComponent: Detail,
 | |
|   destroyOnClose: true,
 | |
| });
 | |
| 
 | |
| /** 刷新表格 */
 | |
| function onRefresh() {
 | |
|   gridApi.query();
 | |
| }
 | |
| 
 | |
| /** 查看详情 */
 | |
| function handleDetail(row: any) {
 | |
|   detailModalApi.setData(row).open();
 | |
| }
 | |
| 
 | |
| const [Grid, gridApi] = useVbenVxeGrid({
 | |
|   formOptions: {
 | |
|     schema: useGridFormSchema(),
 | |
|   },
 | |
|   gridOptions: {
 | |
|     columns: useGridColumns(),
 | |
|     height: 'auto',
 | |
|     keepSource: true,
 | |
|     proxyConfig: {
 | |
|       ajax: {
 | |
|         query: async ({ page }, formValues) => {
 | |
|           return await getNotifyTaskPage({
 | |
|             pageNo: page.currentPage,
 | |
|             pageSize: page.pageSize,
 | |
|             ...formValues,
 | |
|           });
 | |
|         },
 | |
|       },
 | |
|     },
 | |
|     rowConfig: {
 | |
|       keyField: 'id',
 | |
|     },
 | |
|     toolbarConfig: {
 | |
|       refresh: { code: 'query' },
 | |
|       search: true,
 | |
|     },
 | |
|   } as VxeTableGridOptions<any>,
 | |
| });
 | |
| </script>
 | |
| <template>
 | |
|   <Page auto-content-height>
 | |
|     <template #doc>
 | |
|       <DocAlert title="支付功能开启" url="https://doc.iocoder.cn/pay/build/" />
 | |
|     </template>
 | |
| 
 | |
|     <DetailModal @success="onRefresh" />
 | |
|     <Grid table-title="支付通知列表">
 | |
|       <template #actions="{ row }">
 | |
|         <TableAction
 | |
|           :actions="[
 | |
|             {
 | |
|               label: $t('common.detail'),
 | |
|               type: 'primary',
 | |
|               link: true,
 | |
|               icon: ACTION_ICON.VIEW,
 | |
|               auth: ['pay:notify:query'],
 | |
|               onClick: handleDetail.bind(null, row),
 | |
|             },
 | |
|           ]"
 | |
|         />
 | |
|       </template>
 | |
|     </Grid>
 | |
|   </Page>
 | |
| </template>
 |