mirror of
				https://gitee.com/hhyykk/ipms-sjy.git
				synced 2025-10-31 18:28:43 +08:00 
			
		
		
		
	feat: add vue3(element-plus)
This commit is contained in:
		
							
								
								
									
										70
									
								
								yudao-ui-admin-vue3/src/views/pay/app/app.data.ts
									
									
									
									
									
										Normal file
									
								
							
							
						
						
									
										70
									
								
								yudao-ui-admin-vue3/src/views/pay/app/app.data.ts
									
									
									
									
									
										Normal file
									
								
							| @@ -0,0 +1,70 @@ | ||||
| import { reactive } from 'vue' | ||||
| import { useI18n } from '@/hooks/web/useI18n' | ||||
| import { required } from '@/utils/formRules' | ||||
| import { CrudSchema, useCrudSchemas } from '@/hooks/web/useCrudSchemas' | ||||
| import { DICT_TYPE } from '@/utils/dict' | ||||
| const { t } = useI18n() // 国际化 | ||||
|  | ||||
| // 表单校验 | ||||
| export const rules = reactive({ | ||||
|   name: [required], | ||||
|   code: [required], | ||||
|   sort: [required], | ||||
|   status: [required] | ||||
| }) | ||||
|  | ||||
| // CrudSchema | ||||
| const crudSchemas = reactive<CrudSchema[]>([ | ||||
|   { | ||||
|     label: t('common.index'), | ||||
|     field: 'id', | ||||
|     type: 'index', | ||||
|     form: { | ||||
|       show: false | ||||
|     }, | ||||
|     detail: { | ||||
|       show: false | ||||
|     } | ||||
|   }, | ||||
|   { | ||||
|     label: '应用名', | ||||
|     field: 'name', | ||||
|     search: { | ||||
|       show: true | ||||
|     } | ||||
|   }, | ||||
|   { | ||||
|     label: '商户名称', | ||||
|     field: 'payMerchant', | ||||
|     search: { | ||||
|       show: true | ||||
|     } | ||||
|   }, | ||||
|   { | ||||
|     label: t('common.status'), | ||||
|     field: 'status', | ||||
|     dictType: DICT_TYPE.COMMON_STATUS, | ||||
|     search: { | ||||
|       show: true | ||||
|     } | ||||
|   }, | ||||
|   { | ||||
|     label: t('common.createTime'), | ||||
|     field: 'createTime', | ||||
|     form: { | ||||
|       show: false | ||||
|     } | ||||
|   }, | ||||
|   { | ||||
|     label: t('table.action'), | ||||
|     field: 'action', | ||||
|     width: '240px', | ||||
|     form: { | ||||
|       show: false | ||||
|     }, | ||||
|     detail: { | ||||
|       show: false | ||||
|     } | ||||
|   } | ||||
| ]) | ||||
| export const { allSchemas } = useCrudSchemas(crudSchemas) | ||||
							
								
								
									
										198
									
								
								yudao-ui-admin-vue3/src/views/pay/app/index.vue
									
									
									
									
									
										Normal file
									
								
							
							
						
						
									
										198
									
								
								yudao-ui-admin-vue3/src/views/pay/app/index.vue
									
									
									
									
									
										Normal file
									
								
							| @@ -0,0 +1,198 @@ | ||||
| <script setup lang="ts"> | ||||
| import { ref, unref } from 'vue' | ||||
| import dayjs from 'dayjs' | ||||
| import { ElMessage } from 'element-plus' | ||||
| import { DICT_TYPE } from '@/utils/dict' | ||||
| import { useTable } from '@/hooks/web/useTable' | ||||
| import { useI18n } from '@/hooks/web/useI18n' | ||||
| import { FormExpose } from '@/components/Form' | ||||
| import type { AppVO } from '@/api/pay/app/types' | ||||
| import { rules, allSchemas } from './app.data' | ||||
| import * as AppApi from '@/api/pay/app' | ||||
| const { t } = useI18n() // 国际化 | ||||
|  | ||||
| // ========== 列表相关 ========== | ||||
| const { register, tableObject, methods } = useTable<PageResult<AppVO>, AppVO>({ | ||||
|   getListApi: AppApi.getAppPageApi, | ||||
|   delListApi: AppApi.deleteAppApi, | ||||
|   exportListApi: AppApi.exportAppApi | ||||
| }) | ||||
| const { getList, setSearchParams, delList, exportList } = methods | ||||
|  | ||||
| // 导出操作 | ||||
| const handleExport = async () => { | ||||
|   await exportList('应用数据.xls') | ||||
| } | ||||
|  | ||||
| // ========== CRUD 相关 ========== | ||||
| const actionLoading = ref(false) // 遮罩层 | ||||
| const actionType = ref('') // 操作按钮的类型 | ||||
| const dialogVisible = ref(false) // 是否显示弹出层 | ||||
| const dialogTitle = ref('edit') // 弹出层标题 | ||||
| const formRef = ref<FormExpose>() // 表单 Ref | ||||
|  | ||||
| // 设置标题 | ||||
| const setDialogTile = (type: string) => { | ||||
|   dialogTitle.value = t('action.' + type) | ||||
|   actionType.value = type | ||||
|   dialogVisible.value = true | ||||
| } | ||||
|  | ||||
| // 新增操作 | ||||
| const handleCreate = () => { | ||||
|   setDialogTile('create') | ||||
|   // 重置表单 | ||||
|   unref(formRef)?.getElFormRef()?.resetFields() | ||||
| } | ||||
|  | ||||
| // 修改操作 | ||||
| const handleUpdate = async (row: AppVO) => { | ||||
|   setDialogTile('update') | ||||
|   // 设置数据 | ||||
|   const res = await AppApi.getAppApi(row.id) | ||||
|   unref(formRef)?.setValues(res) | ||||
| } | ||||
|  | ||||
| // 提交按钮 | ||||
| const submitForm = async () => { | ||||
|   actionLoading.value = true | ||||
|   // 提交请求 | ||||
|   try { | ||||
|     const data = unref(formRef)?.formModel as AppVO | ||||
|     if (actionType.value === 'create') { | ||||
|       await AppApi.createAppApi(data) | ||||
|       ElMessage.success(t('common.createSuccess')) | ||||
|     } else { | ||||
|       await AppApi.updateAppApi(data) | ||||
|       ElMessage.success(t('common.updateSuccess')) | ||||
|     } | ||||
|     // 操作成功,重新加载列表 | ||||
|     dialogVisible.value = false | ||||
|     await getList() | ||||
|   } finally { | ||||
|     actionLoading.value = false | ||||
|   } | ||||
| } | ||||
|  | ||||
| // 删除操作 | ||||
| const handleDelete = (row: AppVO) => { | ||||
|   delList(row.id, false) | ||||
| } | ||||
|  | ||||
| // ========== 详情相关 ========== | ||||
| const detailRef = ref() // 详情 Ref | ||||
|  | ||||
| // 详情操作 | ||||
| const handleDetail = async (row: AppVO) => { | ||||
|   // 设置数据 | ||||
|   detailRef.value = row | ||||
|   setDialogTile('detail') | ||||
| } | ||||
|  | ||||
| // ========== 初始化 ========== | ||||
| getList() | ||||
| </script> | ||||
|  | ||||
| <template> | ||||
|   <!-- 搜索工作区 --> | ||||
|   <ContentWrap> | ||||
|     <Search :schema="allSchemas.searchSchema" @search="setSearchParams" @reset="setSearchParams" /> | ||||
|   </ContentWrap> | ||||
|   <ContentWrap> | ||||
|     <!-- 操作工具栏 --> | ||||
|     <div class="mb-10px"> | ||||
|       <el-button type="primary" v-hasPermi="['system:post:create']" @click="handleCreate"> | ||||
|         <Icon icon="el:zoom-in" class="mr-5px" /> {{ t('action.add') }} | ||||
|       </el-button> | ||||
|       <el-button | ||||
|         type="warning" | ||||
|         v-hasPermi="['system:post:export']" | ||||
|         :loading="tableObject.exportLoading" | ||||
|         @click="handleExport" | ||||
|       > | ||||
|         <Icon icon="ep:download" class="mr-5px" /> {{ t('action.export') }} | ||||
|       </el-button> | ||||
|     </div> | ||||
|     <!-- 列表 --> | ||||
|     <Table | ||||
|       :columns="allSchemas.tableColumns" | ||||
|       :selection="false" | ||||
|       :data="tableObject.tableList" | ||||
|       :loading="tableObject.loading" | ||||
|       :pagination="{ | ||||
|         total: tableObject.total | ||||
|       }" | ||||
|       v-model:pageSize="tableObject.pageSize" | ||||
|       v-model:currentPage="tableObject.currentPage" | ||||
|       @register="register" | ||||
|     > | ||||
|       <template #status="{ row }"> | ||||
|         <DictTag :type="DICT_TYPE.COMMON_STATUS" :value="row.status" /> | ||||
|       </template> | ||||
|       <template #createTime="{ row }"> | ||||
|         <span>{{ dayjs(row.createTime).format('YYYY-MM-DD HH:mm:ss') }}</span> | ||||
|       </template> | ||||
|       <template #action="{ row }"> | ||||
|         <el-button | ||||
|           link | ||||
|           type="primary" | ||||
|           v-hasPermi="['system:post:update']" | ||||
|           @click="handleUpdate(row)" | ||||
|         > | ||||
|           <Icon icon="ep:edit" class="mr-5px" /> {{ t('action.edit') }} | ||||
|         </el-button> | ||||
|         <el-button | ||||
|           link | ||||
|           type="primary" | ||||
|           v-hasPermi="['system:post:update']" | ||||
|           @click="handleDetail(row)" | ||||
|         > | ||||
|           <Icon icon="ep:view" class="mr-5px" /> {{ t('action.detail') }} | ||||
|         </el-button> | ||||
|         <el-button | ||||
|           link | ||||
|           type="primary" | ||||
|           v-hasPermi="['system:post:delete']" | ||||
|           @click="handleDelete(row)" | ||||
|         > | ||||
|           <Icon icon="ep:delete" class="mr-5px" /> {{ t('action.del') }} | ||||
|         </el-button> | ||||
|       </template> | ||||
|     </Table> | ||||
|   </ContentWrap> | ||||
|  | ||||
|   <Dialog v-model="dialogVisible" :title="dialogTitle"> | ||||
|     <!-- 对话框(添加 / 修改) --> | ||||
|     <Form | ||||
|       v-if="['create', 'update'].includes(actionType)" | ||||
|       :schema="allSchemas.formSchema" | ||||
|       :rules="rules" | ||||
|       ref="formRef" | ||||
|     /> | ||||
|     <!-- 对话框(详情) --> | ||||
|     <Descriptions | ||||
|       v-if="actionType === 'detail'" | ||||
|       :schema="allSchemas.detailSchema" | ||||
|       :data="detailRef" | ||||
|     > | ||||
|       <template #status="{ row }"> | ||||
|         <DictTag :type="DICT_TYPE.COMMON_STATUS" :value="row.status" /> | ||||
|       </template> | ||||
|       <template #createTime="{ row }"> | ||||
|         <span>{{ dayjs(row.createTime).format('YYYY-MM-DD HH:mm:ss') }}</span> | ||||
|       </template> | ||||
|     </Descriptions> | ||||
|     <!-- 操作按钮 --> | ||||
|     <template #footer> | ||||
|       <el-button | ||||
|         v-if="['create', 'update'].includes(actionType)" | ||||
|         type="primary" | ||||
|         :loading="actionLoading" | ||||
|         @click="submitForm" | ||||
|       > | ||||
|         {{ t('action.save') }} | ||||
|       </el-button> | ||||
|       <el-button @click="dialogVisible = false">{{ t('dialog.close') }}</el-button> | ||||
|     </template> | ||||
|   </Dialog> | ||||
| </template> | ||||
							
								
								
									
										198
									
								
								yudao-ui-admin-vue3/src/views/pay/merchant/index.vue
									
									
									
									
									
										Normal file
									
								
							
							
						
						
									
										198
									
								
								yudao-ui-admin-vue3/src/views/pay/merchant/index.vue
									
									
									
									
									
										Normal file
									
								
							| @@ -0,0 +1,198 @@ | ||||
| <script setup lang="ts"> | ||||
| import { ref, unref } from 'vue' | ||||
| import dayjs from 'dayjs' | ||||
| import { ElMessage } from 'element-plus' | ||||
| import { DICT_TYPE } from '@/utils/dict' | ||||
| import { useTable } from '@/hooks/web/useTable' | ||||
| import { useI18n } from '@/hooks/web/useI18n' | ||||
| import { FormExpose } from '@/components/Form' | ||||
| import type { MerchantVO } from '@/api/pay/merchant/types' | ||||
| import { rules, allSchemas } from './merchant.data' | ||||
| import * as MerchantApi from '@/api/pay/merchant' | ||||
| const { t } = useI18n() // 国际化 | ||||
|  | ||||
| // ========== 列表相关 ========== | ||||
| const { register, tableObject, methods } = useTable<PageResult<MerchantVO>, MerchantVO>({ | ||||
|   getListApi: MerchantApi.getMerchantPageApi, | ||||
|   delListApi: MerchantApi.deleteMerchantApi, | ||||
|   exportListApi: MerchantApi.exportMerchantApi | ||||
| }) | ||||
| const { getList, setSearchParams, delList, exportList } = methods | ||||
|  | ||||
| // 导出操作 | ||||
| const handleExport = async () => { | ||||
|   await exportList('商户数据.xls') | ||||
| } | ||||
|  | ||||
| // ========== CRUD 相关 ========== | ||||
| const actionLoading = ref(false) // 遮罩层 | ||||
| const actionType = ref('') // 操作按钮的类型 | ||||
| const dialogVisible = ref(false) // 是否显示弹出层 | ||||
| const dialogTitle = ref('edit') // 弹出层标题 | ||||
| const formRef = ref<FormExpose>() // 表单 Ref | ||||
|  | ||||
| // 设置标题 | ||||
| const setDialogTile = (type: string) => { | ||||
|   dialogTitle.value = t('action.' + type) | ||||
|   actionType.value = type | ||||
|   dialogVisible.value = true | ||||
| } | ||||
|  | ||||
| // 新增操作 | ||||
| const handleCreate = () => { | ||||
|   setDialogTile('create') | ||||
|   // 重置表单 | ||||
|   unref(formRef)?.getElFormRef()?.resetFields() | ||||
| } | ||||
|  | ||||
| // 修改操作 | ||||
| const handleUpdate = async (row: MerchantVO) => { | ||||
|   setDialogTile('update') | ||||
|   // 设置数据 | ||||
|   const res = await MerchantApi.getMerchantApi(row.id) | ||||
|   unref(formRef)?.setValues(res) | ||||
| } | ||||
|  | ||||
| // 提交按钮 | ||||
| const submitForm = async () => { | ||||
|   actionLoading.value = true | ||||
|   // 提交请求 | ||||
|   try { | ||||
|     const data = unref(formRef)?.formModel as MerchantVO | ||||
|     if (actionType.value === 'create') { | ||||
|       await MerchantApi.createMerchantApi(data) | ||||
|       ElMessage.success(t('common.createSuccess')) | ||||
|     } else { | ||||
|       await MerchantApi.updateMerchantApi(data) | ||||
|       ElMessage.success(t('common.updateSuccess')) | ||||
|     } | ||||
|     // 操作成功,重新加载列表 | ||||
|     dialogVisible.value = false | ||||
|     await getList() | ||||
|   } finally { | ||||
|     actionLoading.value = false | ||||
|   } | ||||
| } | ||||
|  | ||||
| // 删除操作 | ||||
| const handleDelete = (row: MerchantVO) => { | ||||
|   delList(row.id, false) | ||||
| } | ||||
|  | ||||
| // ========== 详情相关 ========== | ||||
| const detailRef = ref() // 详情 Ref | ||||
|  | ||||
| // 详情操作 | ||||
| const handleDetail = async (row: MerchantVO) => { | ||||
|   // 设置数据 | ||||
|   detailRef.value = row | ||||
|   setDialogTile('detail') | ||||
| } | ||||
|  | ||||
| // ========== 初始化 ========== | ||||
| getList() | ||||
| </script> | ||||
|  | ||||
| <template> | ||||
|   <!-- 搜索工作区 --> | ||||
|   <ContentWrap> | ||||
|     <Search :schema="allSchemas.searchSchema" @search="setSearchParams" @reset="setSearchParams" /> | ||||
|   </ContentWrap> | ||||
|   <ContentWrap> | ||||
|     <!-- 操作工具栏 --> | ||||
|     <div class="mb-10px"> | ||||
|       <el-button type="primary" v-hasPermi="['system:post:create']" @click="handleCreate"> | ||||
|         <Icon icon="el:zoom-in" class="mr-5px" /> {{ t('action.add') }} | ||||
|       </el-button> | ||||
|       <el-button | ||||
|         type="warning" | ||||
|         v-hasPermi="['system:post:export']" | ||||
|         :loading="tableObject.exportLoading" | ||||
|         @click="handleExport" | ||||
|       > | ||||
|         <Icon icon="ep:download" class="mr-5px" /> {{ t('action.export') }} | ||||
|       </el-button> | ||||
|     </div> | ||||
|     <!-- 列表 --> | ||||
|     <Table | ||||
|       :columns="allSchemas.tableColumns" | ||||
|       :selection="false" | ||||
|       :data="tableObject.tableList" | ||||
|       :loading="tableObject.loading" | ||||
|       :pagination="{ | ||||
|         total: tableObject.total | ||||
|       }" | ||||
|       v-model:pageSize="tableObject.pageSize" | ||||
|       v-model:currentPage="tableObject.currentPage" | ||||
|       @register="register" | ||||
|     > | ||||
|       <template #status="{ row }"> | ||||
|         <DictTag :type="DICT_TYPE.COMMON_STATUS" :value="row.status" /> | ||||
|       </template> | ||||
|       <template #createTime="{ row }"> | ||||
|         <span>{{ dayjs(row.createTime).format('YYYY-MM-DD HH:mm:ss') }}</span> | ||||
|       </template> | ||||
|       <template #action="{ row }"> | ||||
|         <el-button | ||||
|           link | ||||
|           type="primary" | ||||
|           v-hasPermi="['system:post:update']" | ||||
|           @click="handleUpdate(row)" | ||||
|         > | ||||
|           <Icon icon="ep:edit" class="mr-5px" /> {{ t('action.edit') }} | ||||
|         </el-button> | ||||
|         <el-button | ||||
|           link | ||||
|           type="primary" | ||||
|           v-hasPermi="['system:post:update']" | ||||
|           @click="handleDetail(row)" | ||||
|         > | ||||
|           <Icon icon="ep:view" class="mr-5px" /> {{ t('action.detail') }} | ||||
|         </el-button> | ||||
|         <el-button | ||||
|           link | ||||
|           type="primary" | ||||
|           v-hasPermi="['system:post:delete']" | ||||
|           @click="handleDelete(row)" | ||||
|         > | ||||
|           <Icon icon="ep:delete" class="mr-5px" /> {{ t('action.del') }} | ||||
|         </el-button> | ||||
|       </template> | ||||
|     </Table> | ||||
|   </ContentWrap> | ||||
|  | ||||
|   <Dialog v-model="dialogVisible" :title="dialogTitle"> | ||||
|     <!-- 对话框(添加 / 修改) --> | ||||
|     <Form | ||||
|       v-if="['create', 'update'].includes(actionType)" | ||||
|       :schema="allSchemas.formSchema" | ||||
|       :rules="rules" | ||||
|       ref="formRef" | ||||
|     /> | ||||
|     <!-- 对话框(详情) --> | ||||
|     <Descriptions | ||||
|       v-if="actionType === 'detail'" | ||||
|       :schema="allSchemas.detailSchema" | ||||
|       :data="detailRef" | ||||
|     > | ||||
|       <template #status="{ row }"> | ||||
|         <DictTag :type="DICT_TYPE.COMMON_STATUS" :value="row.status" /> | ||||
|       </template> | ||||
|       <template #createTime="{ row }"> | ||||
|         <span>{{ dayjs(row.createTime).format('YYYY-MM-DD HH:mm:ss') }}</span> | ||||
|       </template> | ||||
|     </Descriptions> | ||||
|     <!-- 操作按钮 --> | ||||
|     <template #footer> | ||||
|       <el-button | ||||
|         v-if="['create', 'update'].includes(actionType)" | ||||
|         type="primary" | ||||
|         :loading="actionLoading" | ||||
|         @click="submitForm" | ||||
|       > | ||||
|         {{ t('action.save') }} | ||||
|       </el-button> | ||||
|       <el-button @click="dialogVisible = false">{{ t('dialog.close') }}</el-button> | ||||
|     </template> | ||||
|   </Dialog> | ||||
| </template> | ||||
							
								
								
									
										94
									
								
								yudao-ui-admin-vue3/src/views/pay/merchant/merchant.data.ts
									
									
									
									
									
										Normal file
									
								
							
							
						
						
									
										94
									
								
								yudao-ui-admin-vue3/src/views/pay/merchant/merchant.data.ts
									
									
									
									
									
										Normal file
									
								
							| @@ -0,0 +1,94 @@ | ||||
| import { reactive } from 'vue' | ||||
| import { useI18n } from '@/hooks/web/useI18n' | ||||
| import { required } from '@/utils/formRules' | ||||
| import { CrudSchema, useCrudSchemas } from '@/hooks/web/useCrudSchemas' | ||||
| import { DICT_TYPE } from '@/utils/dict' | ||||
| const { t } = useI18n() // 国际化 | ||||
|  | ||||
| // 表单校验 | ||||
| export const rules = reactive({ | ||||
|   name: [required], | ||||
|   code: [required], | ||||
|   sort: [required], | ||||
|   status: [required] | ||||
| }) | ||||
|  | ||||
| // CrudSchema | ||||
| const crudSchemas = reactive<CrudSchema[]>([ | ||||
|   { | ||||
|     label: t('common.index'), | ||||
|     field: 'id', | ||||
|     type: 'index', | ||||
|     form: { | ||||
|       show: false | ||||
|     }, | ||||
|     detail: { | ||||
|       show: false | ||||
|     } | ||||
|   }, | ||||
|   { | ||||
|     label: '商户号', | ||||
|     field: 'no', | ||||
|     search: { | ||||
|       show: true | ||||
|     } | ||||
|   }, | ||||
|   { | ||||
|     label: '商户全称', | ||||
|     field: 'code', | ||||
|     search: { | ||||
|       show: true | ||||
|     } | ||||
|   }, | ||||
|   { | ||||
|     label: '商户简称', | ||||
|     field: 'shortName', | ||||
|     search: { | ||||
|       show: true | ||||
|     } | ||||
|   }, | ||||
|   { | ||||
|     label: t('common.status'), | ||||
|     field: 'status', | ||||
|     dictType: DICT_TYPE.COMMON_STATUS, | ||||
|     search: { | ||||
|       show: true | ||||
|     } | ||||
|   }, | ||||
|   { | ||||
|     label: t('form.remark'), | ||||
|     field: 'remark', | ||||
|     form: { | ||||
|       component: 'Input', | ||||
|       componentProps: { | ||||
|         type: 'textarea', | ||||
|         rows: 4 | ||||
|       }, | ||||
|       colProps: { | ||||
|         span: 24 | ||||
|       } | ||||
|     }, | ||||
|     table: { | ||||
|       show: false | ||||
|     } | ||||
|   }, | ||||
|   { | ||||
|     label: t('common.createTime'), | ||||
|     field: 'createTime', | ||||
|     form: { | ||||
|       show: false | ||||
|     } | ||||
|   }, | ||||
|   { | ||||
|     label: t('table.action'), | ||||
|     field: 'action', | ||||
|     width: '240px', | ||||
|     form: { | ||||
|       show: false | ||||
|     }, | ||||
|     detail: { | ||||
|       show: false | ||||
|     } | ||||
|   } | ||||
| ]) | ||||
| export const { allSchemas } = useCrudSchemas(crudSchemas) | ||||
							
								
								
									
										177
									
								
								yudao-ui-admin-vue3/src/views/pay/order/index.vue
									
									
									
									
									
										Normal file
									
								
							
							
						
						
									
										177
									
								
								yudao-ui-admin-vue3/src/views/pay/order/index.vue
									
									
									
									
									
										Normal file
									
								
							| @@ -0,0 +1,177 @@ | ||||
| <script setup lang="ts"> | ||||
| import { ref, unref } from 'vue' | ||||
| import dayjs from 'dayjs' | ||||
| import { ElMessage } from 'element-plus' | ||||
| import { DICT_TYPE } from '@/utils/dict' | ||||
| import { useTable } from '@/hooks/web/useTable' | ||||
| import { useI18n } from '@/hooks/web/useI18n' | ||||
| import { FormExpose } from '@/components/Form' | ||||
| import type { OrderVO } from '@/api/pay/order/types' | ||||
| import { rules, allSchemas } from './order.data' | ||||
| import * as OrderApi from '@/api/pay/order' | ||||
| const { t } = useI18n() // 国际化 | ||||
| // ========== 列表相关 ========== | ||||
| const { register, tableObject, methods } = useTable<PageResult<OrderVO>, OrderVO>({ | ||||
|   getListApi: OrderApi.getOrderPageApi, | ||||
|   delListApi: OrderApi.deleteOrderApi, | ||||
|   exportListApi: OrderApi.exportOrderApi | ||||
| }) | ||||
| const { getList, setSearchParams, delList, exportList } = methods | ||||
| // 导出操作 | ||||
| const handleExport = async () => { | ||||
|   await exportList('订单数据.xls') | ||||
| } | ||||
| // ========== CRUD 相关 ========== | ||||
| const actionLoading = ref(false) // 遮罩层 | ||||
| const actionType = ref('') // 操作按钮的类型 | ||||
| const dialogVisible = ref(false) // 是否显示弹出层 | ||||
| const dialogTitle = ref('edit') // 弹出层标题 | ||||
| const formRef = ref<FormExpose>() // 表单 Ref | ||||
|  | ||||
| // 设置标题 | ||||
| const setDialogTile = (type: string) => { | ||||
|   dialogTitle.value = t('action.' + type) | ||||
|   actionType.value = type | ||||
|   dialogVisible.value = true | ||||
| } | ||||
|  | ||||
| // 新增操作 | ||||
| const handleCreate = () => { | ||||
|   setDialogTile('create') | ||||
|   // 重置表单 | ||||
|   unref(formRef)?.getElFormRef()?.resetFields() | ||||
| } | ||||
|  | ||||
| // 修改操作 | ||||
| const handleUpdate = async (row: OrderVO) => { | ||||
|   setDialogTile('update') | ||||
|   // 设置数据 | ||||
|   const res = await OrderApi.getOrderApi(row.id) | ||||
|   unref(formRef)?.setValues(res) | ||||
| } | ||||
|  | ||||
| // 提交按钮 | ||||
| const submitForm = async () => { | ||||
|   actionLoading.value = true | ||||
|   // 提交请求 | ||||
|   try { | ||||
|     const data = unref(formRef)?.formModel as OrderVO | ||||
|     if (actionType.value === 'create') { | ||||
|       await OrderApi.createOrderApi(data) | ||||
|       ElMessage.success(t('common.createSuccess')) | ||||
|     } else { | ||||
|       await OrderApi.updateOrderApi(data) | ||||
|       ElMessage.success(t('common.updateSuccess')) | ||||
|     } | ||||
|     // 操作成功,重新加载列表 | ||||
|     dialogVisible.value = false | ||||
|     await getList() | ||||
|   } finally { | ||||
|     actionLoading.value = false | ||||
|   } | ||||
| } | ||||
|  | ||||
| // 删除操作 | ||||
| const handleDelete = (row: OrderVO) => { | ||||
|   delList(row.id, false) | ||||
| } | ||||
|  | ||||
| // ========== 详情相关 ========== | ||||
| const detailRef = ref() // 详情 Ref | ||||
|  | ||||
| // 详情操作 | ||||
| const handleDetail = async (row: OrderVO) => { | ||||
|   setDialogTile('detail') | ||||
|   // 设置数据 | ||||
|   const res = await OrderApi.getOrderApi(row.id as number) | ||||
|   detailRef.value = res | ||||
| } | ||||
|  | ||||
| // ========== 初始化 ========== | ||||
| getList() | ||||
| </script> | ||||
| <template> | ||||
|   <!-- 搜索工作区 --> | ||||
|   <ContentWrap> | ||||
|     <Search :schema="allSchemas.searchSchema" @search="setSearchParams" @reset="setSearchParams" /> | ||||
|   </ContentWrap> | ||||
|   <ContentWrap> | ||||
|     <!-- 操作工具栏 --> | ||||
|     <div class="mb-10px"> | ||||
|       <el-button type="primary" v-hasPermi="['pay:order:create']" @click="handleCreate"> | ||||
|         <Icon icon="el:zoom-in" class="mr-5px" /> {{ t('action.add') }} | ||||
|       </el-button> | ||||
|       <el-button | ||||
|         type="warning" | ||||
|         v-hasPermi="['pay:order:export']" | ||||
|         :loading="tableObject.exportLoading" | ||||
|         @click="handleExport" | ||||
|       > | ||||
|         <Icon icon="ep:download" class="mr-5px" /> {{ t('action.export') }} | ||||
|       </el-button> | ||||
|     </div> | ||||
|     <!-- 列表 --> | ||||
|     <Table | ||||
|       :columns="allSchemas.tableColumns" | ||||
|       :selection="false" | ||||
|       :data="tableObject.tableList" | ||||
|       :loading="tableObject.loading" | ||||
|       :pagination="{ | ||||
|         total: tableObject.total | ||||
|       }" | ||||
|       v-model:pageSize="tableObject.pageSize" | ||||
|       v-model:currentPage="tableObject.currentPage" | ||||
|       @register="register" | ||||
|     > | ||||
|       <template #status="{ row }"> | ||||
|         <DictTag :type="DICT_TYPE.COMMON_STATUS" :value="row.status" /> | ||||
|       </template> | ||||
|       <template #action="{ row }"> | ||||
|         <el-button link type="primary" v-hasPermi="['pay:order:update']" @click="handleUpdate(row)"> | ||||
|           <Icon icon="ep:edit" class="mr-5px" /> {{ t('action.edit') }} | ||||
|         </el-button> | ||||
|         <el-button link type="primary" v-hasPermi="['pay:order:update']" @click="handleDetail(row)"> | ||||
|           <Icon icon="ep:view" class="mr-5px" /> {{ t('action.detail') }} | ||||
|         </el-button> | ||||
|         <el-button link type="primary" v-hasPermi="['pay:order:delete']" @click="handleDelete(row)"> | ||||
|           <Icon icon="ep:delete" class="mr-5px" /> {{ t('action.del') }} | ||||
|         </el-button> | ||||
|       </template> | ||||
|     </Table> | ||||
|   </ContentWrap> | ||||
|  | ||||
|   <Dialog v-model="dialogVisible" :title="dialogTitle"> | ||||
|     <!-- 对话框(添加 / 修改) --> | ||||
|     <Form | ||||
|       v-if="['create', 'update'].includes(actionType)" | ||||
|       :schema="allSchemas.formSchema" | ||||
|       :rules="rules" | ||||
|       ref="formRef" | ||||
|     /> | ||||
|     <!-- 对话框(详情) --> | ||||
|     <Descriptions | ||||
|       v-if="actionType === 'detail'" | ||||
|       :schema="allSchemas.detailSchema" | ||||
|       :data="detailRef" | ||||
|     > | ||||
|       <template #status="{ row }"> | ||||
|         <DictTag :type="DICT_TYPE.COMMON_STATUS" :value="row.status" /> | ||||
|       </template> | ||||
|       <template #createTime="{ row }"> | ||||
|         <span>{{ dayjs(row.createTime).format('YYYY-MM-DD HH:mm:ss') }}</span> | ||||
|       </template> | ||||
|     </Descriptions> | ||||
|     <!-- 操作按钮 --> | ||||
|     <template #footer> | ||||
|       <el-button | ||||
|         v-if="['create', 'update'].includes(actionType)" | ||||
|         type="primary" | ||||
|         :loading="actionLoading" | ||||
|         @click="submitForm" | ||||
|       > | ||||
|         {{ t('action.save') }} | ||||
|       </el-button> | ||||
|       <el-button @click="dialogVisible = false">{{ t('dialog.close') }}</el-button> | ||||
|     </template> | ||||
|   </Dialog> | ||||
| </template> | ||||
							
								
								
									
										169
									
								
								yudao-ui-admin-vue3/src/views/pay/order/order.data.ts
									
									
									
									
									
										Normal file
									
								
							
							
						
						
									
										169
									
								
								yudao-ui-admin-vue3/src/views/pay/order/order.data.ts
									
									
									
									
									
										Normal file
									
								
							| @@ -0,0 +1,169 @@ | ||||
| import { reactive } from 'vue' | ||||
| import { useI18n } from '@/hooks/web/useI18n' | ||||
| import { required } from '@/utils/formRules' | ||||
| import { CrudSchema, useCrudSchemas } from '@/hooks/web/useCrudSchemas' | ||||
| import { DICT_TYPE } from '@/utils/dict' | ||||
| const { t } = useI18n() // 国际化 | ||||
|  | ||||
| // 表单校验 | ||||
| export const rules = reactive({ | ||||
|   merchantId: [required], | ||||
|   appId: [required], | ||||
|   merchantOrderId: [required], | ||||
|   subject: [required], | ||||
|   body: [required], | ||||
|   notifyUrl: [required], | ||||
|   notifyStatus: [required], | ||||
|   amount: [required], | ||||
|   status: [required], | ||||
|   userIp: [required], | ||||
|   expireTime: [required], | ||||
|   refundStatus: [required], | ||||
|   refundTimes: [required], | ||||
|   refundAmount: [required] | ||||
| }) | ||||
| // CrudSchema | ||||
| const crudSchemas = reactive<CrudSchema[]>([ | ||||
|   { | ||||
|     label: t('common.index'), | ||||
|     field: 'id', | ||||
|     type: 'index', | ||||
|     form: { | ||||
|       show: false | ||||
|     }, | ||||
|     detail: { | ||||
|       show: false | ||||
|     } | ||||
|   }, | ||||
|   { | ||||
|     label: '商户编号', | ||||
|     field: 'merchantId', | ||||
|     search: { | ||||
|       show: true | ||||
|     } | ||||
|   }, | ||||
|   { | ||||
|     label: '应用编号', | ||||
|     field: 'appId', | ||||
|     search: { | ||||
|       show: true | ||||
|     } | ||||
|   }, | ||||
|   { | ||||
|     label: '渠道编号', | ||||
|     field: 'channelId' | ||||
|   }, | ||||
|   { | ||||
|     label: '渠道编码', | ||||
|     field: 'channelCode', | ||||
|     search: { | ||||
|       show: true | ||||
|     } | ||||
|   }, | ||||
|   { | ||||
|     label: '渠道订单号', | ||||
|     field: 'merchantOrderId', | ||||
|     search: { | ||||
|       show: true | ||||
|     } | ||||
|   }, | ||||
|   { | ||||
|     label: '商品标题', | ||||
|     field: 'subject' | ||||
|   }, | ||||
|   { | ||||
|     label: '商品描述', | ||||
|     field: 'body' | ||||
|   }, | ||||
|   { | ||||
|     label: '异步通知地址', | ||||
|     field: 'notifyUrl' | ||||
|   }, | ||||
|   { | ||||
|     label: '回调商户状态', | ||||
|     field: 'notifyStatus', | ||||
|     dictType: DICT_TYPE.PAY_ORDER_NOTIFY_STATUS | ||||
|   }, | ||||
|   { | ||||
|     label: '支付金额', | ||||
|     field: 'amount', | ||||
|     search: { | ||||
|       show: true | ||||
|     } | ||||
|   }, | ||||
|   { | ||||
|     label: '渠道手续费', | ||||
|     field: 'channelFeeRate', | ||||
|     search: { | ||||
|       show: true | ||||
|     } | ||||
|   }, | ||||
|   { | ||||
|     label: '渠道手续金额', | ||||
|     field: 'channelFeeAmount', | ||||
|     search: { | ||||
|       show: true | ||||
|     } | ||||
|   }, | ||||
|   { | ||||
|     label: '支付状态', | ||||
|     field: 'status', | ||||
|     dictType: DICT_TYPE.PAY_ORDER_STATUS, | ||||
|     search: { | ||||
|       show: true | ||||
|     } | ||||
|   }, | ||||
|   { | ||||
|     label: '用户 IP', | ||||
|     field: 'userIp' | ||||
|   }, | ||||
|   { | ||||
|     label: '订单失效时间', | ||||
|     field: 'expireTime' | ||||
|   }, | ||||
|   { | ||||
|     label: '订单支付成功时间', | ||||
|     field: 'successTime' | ||||
|   }, | ||||
|   { | ||||
|     label: '订单支付通知时间', | ||||
|     field: 'notifyTime' | ||||
|   }, | ||||
|   { | ||||
|     label: '支付成功的订单拓展单编号', | ||||
|     field: 'successExtensionId' | ||||
|   }, | ||||
|   { | ||||
|     label: '退款状态', | ||||
|     field: 'refundStatus', | ||||
|     dictType: DICT_TYPE.PAY_ORDER_REFUND_STATUS, | ||||
|     search: { | ||||
|       show: true | ||||
|     } | ||||
|   }, | ||||
|   { | ||||
|     label: '退款次数', | ||||
|     field: 'refundTimes' | ||||
|   }, | ||||
|   { | ||||
|     label: '退款总金额', | ||||
|     field: 'refundAmount' | ||||
|   }, | ||||
|   { | ||||
|     label: '渠道用户编号', | ||||
|     field: 'channelUserId' | ||||
|   }, | ||||
|   { | ||||
|     label: '渠道订单号', | ||||
|     field: 'channelOrderNo' | ||||
|   }, | ||||
|   { | ||||
|     label: t('table.action'), | ||||
|     field: 'action', | ||||
|     width: '270px', | ||||
|     form: { | ||||
|       show: false | ||||
|     } | ||||
|   } | ||||
| ]) | ||||
| export const { allSchemas } = useCrudSchemas(crudSchemas) | ||||
							
								
								
									
										121
									
								
								yudao-ui-admin-vue3/src/views/pay/refund/index.vue
									
									
									
									
									
										Normal file
									
								
							
							
						
						
									
										121
									
								
								yudao-ui-admin-vue3/src/views/pay/refund/index.vue
									
									
									
									
									
										Normal file
									
								
							| @@ -0,0 +1,121 @@ | ||||
| <script setup lang="ts"> | ||||
| import { ref } from 'vue' | ||||
| import dayjs from 'dayjs' | ||||
| import { DICT_TYPE } from '@/utils/dict' | ||||
| import { useTable } from '@/hooks/web/useTable' | ||||
| import { useI18n } from '@/hooks/web/useI18n' | ||||
| import type { RefundVO } from '@/api/pay/refund/types' | ||||
| import { allSchemas } from './refund.data' | ||||
| import * as RefundApi from '@/api/pay/refund' | ||||
| const { t } = useI18n() // 国际化 | ||||
|  | ||||
| // ========== 列表相关 ========== | ||||
| const { register, tableObject, methods } = useTable<PageResult<RefundVO>, RefundVO>({ | ||||
|   getListApi: RefundApi.getRefundPageApi, | ||||
|   delListApi: RefundApi.deleteRefundApi, | ||||
|   exportListApi: RefundApi.exportRefundApi | ||||
| }) | ||||
| const { getList, setSearchParams, delList, exportList } = methods | ||||
|  | ||||
| // 导出操作 | ||||
| const handleExport = async () => { | ||||
|   await exportList('退款订单.xls') | ||||
| } | ||||
|  | ||||
| // ========== CRUD 相关 ========== | ||||
| const dialogVisible = ref(false) // 是否显示弹出层 | ||||
| const dialogTitle = ref('edit') // 弹出层标题 | ||||
|  | ||||
| // 删除操作 | ||||
| const handleDelete = (row: RefundVO) => { | ||||
|   delList(row.id, false) | ||||
| } | ||||
|  | ||||
| // ========== 详情相关 ========== | ||||
| const detailRef = ref() // 详情 Ref | ||||
|  | ||||
| // 详情操作 | ||||
| const handleDetail = async (row: RefundVO) => { | ||||
|   // 设置数据 | ||||
|   detailRef.value = RefundApi.getRefundApi(row.id) | ||||
|   dialogTitle.value = t('action.detail') | ||||
|   dialogVisible.value = true | ||||
| } | ||||
|  | ||||
| // ========== 初始化 ========== | ||||
| getList() | ||||
| </script> | ||||
|  | ||||
| <template> | ||||
|   <!-- 搜索工作区 --> | ||||
|   <ContentWrap> | ||||
|     <Search :schema="allSchemas.searchSchema" @search="setSearchParams" @reset="setSearchParams" /> | ||||
|   </ContentWrap> | ||||
|   <ContentWrap> | ||||
|     <!-- 操作工具栏 --> | ||||
|     <div class="mb-10px"> | ||||
|       <el-button | ||||
|         type="warning" | ||||
|         v-hasPermi="['system:post:export']" | ||||
|         :loading="tableObject.exportLoading" | ||||
|         @click="handleExport" | ||||
|       > | ||||
|         <Icon icon="ep:download" class="mr-5px" /> {{ t('action.export') }} | ||||
|       </el-button> | ||||
|     </div> | ||||
|     <!-- 列表 --> | ||||
|     <Table | ||||
|       :columns="allSchemas.tableColumns" | ||||
|       :selection="false" | ||||
|       :data="tableObject.tableList" | ||||
|       :loading="tableObject.loading" | ||||
|       :pagination="{ | ||||
|         total: tableObject.total | ||||
|       }" | ||||
|       v-model:pageSize="tableObject.pageSize" | ||||
|       v-model:currentPage="tableObject.currentPage" | ||||
|       @register="register" | ||||
|     > | ||||
|       <template #status="{ row }"> | ||||
|         <DictTag :type="DICT_TYPE.COMMON_STATUS" :value="row.status" /> | ||||
|       </template> | ||||
|       <template #createTime="{ row }"> | ||||
|         <span>{{ dayjs(row.createTime).format('YYYY-MM-DD HH:mm:ss') }}</span> | ||||
|       </template> | ||||
|       <template #action="{ row }"> | ||||
|         <el-button | ||||
|           link | ||||
|           type="primary" | ||||
|           v-hasPermi="['system:post:update']" | ||||
|           @click="handleDetail(row)" | ||||
|         > | ||||
|           <Icon icon="ep:view" class="mr-5px" /> {{ t('action.detail') }} | ||||
|         </el-button> | ||||
|         <el-button | ||||
|           link | ||||
|           type="primary" | ||||
|           v-hasPermi="['system:post:delete']" | ||||
|           @click="handleDelete(row)" | ||||
|         > | ||||
|           <Icon icon="ep:delete" class="mr-5px" /> {{ t('action.del') }} | ||||
|         </el-button> | ||||
|       </template> | ||||
|     </Table> | ||||
|   </ContentWrap> | ||||
|  | ||||
|   <Dialog v-model="dialogVisible" :title="dialogTitle"> | ||||
|     <!-- 对话框(详情) --> | ||||
|     <Descriptions :schema="allSchemas.detailSchema" :data="detailRef"> | ||||
|       <template #status="{ row }"> | ||||
|         <DictTag :type="DICT_TYPE.COMMON_STATUS" :value="row.status" /> | ||||
|       </template> | ||||
|       <template #createTime="{ row }"> | ||||
|         <span>{{ dayjs(row.createTime).format('YYYY-MM-DD HH:mm:ss') }}</span> | ||||
|       </template> | ||||
|     </Descriptions> | ||||
|     <!-- 操作按钮 --> | ||||
|     <template #footer> | ||||
|       <el-button @click="dialogVisible = false">{{ t('dialog.close') }}</el-button> | ||||
|     </template> | ||||
|   </Dialog> | ||||
| </template> | ||||
							
								
								
									
										101
									
								
								yudao-ui-admin-vue3/src/views/pay/refund/refund.data.ts
									
									
									
									
									
										Normal file
									
								
							
							
						
						
									
										101
									
								
								yudao-ui-admin-vue3/src/views/pay/refund/refund.data.ts
									
									
									
									
									
										Normal file
									
								
							| @@ -0,0 +1,101 @@ | ||||
| import { reactive } from 'vue' | ||||
| import { useI18n } from '@/hooks/web/useI18n' | ||||
| import { CrudSchema, useCrudSchemas } from '@/hooks/web/useCrudSchemas' | ||||
| import { DICT_TYPE } from '@/utils/dict' | ||||
| const { t } = useI18n() // 国际化 | ||||
|  | ||||
| // CrudSchema | ||||
| const crudSchemas = reactive<CrudSchema[]>([ | ||||
|   { | ||||
|     label: t('common.index'), | ||||
|     field: 'id', | ||||
|     type: 'index', | ||||
|     form: { | ||||
|       show: false | ||||
|     }, | ||||
|     detail: { | ||||
|       show: false | ||||
|     } | ||||
|   }, | ||||
|   { | ||||
|     label: '应用编号', | ||||
|     field: 'appId', | ||||
|     search: { | ||||
|       show: true | ||||
|     } | ||||
|   }, | ||||
|   { | ||||
|     label: '商户名称', | ||||
|     field: 'merchantName' | ||||
|   }, | ||||
|   { | ||||
|     label: '应用名称', | ||||
|     field: 'appName' | ||||
|   }, | ||||
|   { | ||||
|     label: '商品名称', | ||||
|     field: 'subject' | ||||
|   }, | ||||
|   { | ||||
|     label: '商户退款单号', | ||||
|     field: 'merchantRefundNo' | ||||
|   }, | ||||
|   { | ||||
|     label: '商户订单号', | ||||
|     field: 'merchantOrderId' | ||||
|   }, | ||||
|   { | ||||
|     label: '交易订单号', | ||||
|     field: 'tradeNo' | ||||
|   }, | ||||
|   { | ||||
|     label: '支付金额', | ||||
|     field: 'payAmount' | ||||
|   }, | ||||
|   { | ||||
|     label: '退款金额', | ||||
|     field: 'refundAmount' | ||||
|   }, | ||||
|   { | ||||
|     label: '渠道编码', | ||||
|     field: 'channelCode', | ||||
|     search: { | ||||
|       show: true | ||||
|     } | ||||
|   }, | ||||
|   { | ||||
|     label: '退款类型', | ||||
|     field: 'type', | ||||
|     dictType: DICT_TYPE.PAY_REFUND_ORDER_TYPE, | ||||
|     search: { | ||||
|       show: true | ||||
|     } | ||||
|   }, | ||||
|   { | ||||
|     label: t('common.status'), | ||||
|     field: 'status', | ||||
|     dictType: DICT_TYPE.PAY_REFUND_ORDER_STATUS, | ||||
|     search: { | ||||
|       show: true | ||||
|     } | ||||
|   }, | ||||
|   { | ||||
|     label: t('common.createTime'), | ||||
|     field: 'createTime', | ||||
|     form: { | ||||
|       show: false | ||||
|     } | ||||
|   }, | ||||
|   { | ||||
|     label: t('table.action'), | ||||
|     field: 'action', | ||||
|     width: '240px', | ||||
|     form: { | ||||
|       show: false | ||||
|     }, | ||||
|     detail: { | ||||
|       show: false | ||||
|     } | ||||
|   } | ||||
| ]) | ||||
| export const { allSchemas } = useCrudSchemas(crudSchemas) | ||||
		Reference in New Issue
	
	Block a user
	 xingyu
					xingyu