index.vue.vm 2.9 KB

12345678910111213141516171819202122232425262728293031323334353637383940414243444546474849505152535455565758596061626364656667686970717273747576777879808182838485868788899091
  1. <script lang="ts" setup>
  2. import {columns, searchFormSchema} from './'
  3. import {useI18n} from '@/hooks/web/useI18n'
  4. import {useMessage} from '@/hooks/web/useMessage'
  5. import {useModal} from '@/components/Modal'
  6. import {useTable} from '@/components/Table'
  7. import { delete${ simpleClassName }, export${ simpleClassName }, get${ simpleClassName } Page } from '@/api/${table.moduleName}/${classNameVar}'
  8. defineOptions({ name: '${table.className}' })
  9. const { t } = useI18n()
  10. const { createConfirm, createMessage } = useMessage()
  11. const [registerModal, { openModal }] = useModal()
  12. const [registerTable, { getForm, reload }] = useTable({
  13. title: '${table.classComment}列表',
  14. api: get${ simpleClassName }Page,
  15. columns,
  16. formConfig: { labelWidth: 120, schemas: searchFormSchema },
  17. useSearchForm: true,
  18. showTableSetting: true,
  19. actionColumn: {
  20. width: 140,
  21. title: t('common.action'),
  22. dataIndex: 'action',
  23. fixed: 'right',
  24. },
  25. })
  26. function handleCreate() {
  27. openModal(true, { isUpdate: false })
  28. }
  29. function handleEdit(record: Recordable) {
  30. openModal(true, { record, isUpdate: true })
  31. }
  32. async function handleExport() {
  33. createConfirm({
  34. title: t('common.exportTitle'),
  35. iconType: 'warning',
  36. content: t('common.exportMessage'),
  37. async onOk() {
  38. await export${ simpleClassName } (getForm().getFieldsValue())
  39. createMessage.success(t('common.exportSuccessText'))
  40. },
  41. })
  42. }
  43. async function handleDelete(record: Recordable) {
  44. await delete${ simpleClassName } (record.id)
  45. createMessage.success(t('common.delSuccessText'))
  46. reload()
  47. }
  48. </script>
  49. <template>
  50. <div>
  51. <BasicTable @register="registerTable">
  52. <template #toolbar>
  53. <a-button type="primary" v-auth="['${permissionPrefix}:create']" :preIcon="IconEnum.ADD" @click="handleCreate">
  54. {{ t('action.create') }}
  55. </a-button>
  56. <a-button v-auth="['${permissionPrefix}:export']" :preIcon="IconEnum.EXPORT" @click="handleExport">
  57. {{ t('action.export') }}
  58. </a-button>
  59. </template>
  60. <template #bodyCell="{ column, record }">
  61. <template v-if="column.key === 'action'">
  62. <TableAction
  63. :actions="[
  64. { icon: IconEnum.EDIT, label: t('action.edit'), auth: '${permissionPrefix}:update', onClick: handleEdit.bind(null, record) },
  65. {
  66. icon: IconEnum.DELETE,
  67. danger: true,
  68. label: t('action.delete'),
  69. auth: '${permissionPrefix}:delete',
  70. popConfirm: {
  71. title: t('common.delMessage'),
  72. placement: 'left',
  73. confirm: handleDelete.bind(null, record),
  74. },
  75. },
  76. ]"
  77. />
  78. </template>
  79. </template>
  80. </BasicTable>
  81. <${simpleClassName}Modal @register="registerModal" @success="reload()" />
  82. </div>
  83. </template>