tableData.tsx 2.9 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114
  1. import { BasicColumn } from '/@/components/Table/src/types/table'
  2. import { Popconfirm } from 'ant-design-vue'
  3. import { Icon } from '/@/components/Icon/index'
  4. import { deletePermGroup } from '/@/api/sys/manager'
  5. import { computed } from 'vue'
  6. import { FormSchema } from '/@/components/Form'
  7. import { RoleEnum } from '/@/enums/roleEnum'
  8. enum PermMap {
  9. showProject = '项目',
  10. showStaff = '用户列表',
  11. showPermission = '权限组'
  12. }
  13. export function getTableColumns(fn1: () => Promise<void>, fn2: (item) => void): BasicColumn[] {
  14. async function delConfirm(id: string) {
  15. await deletePermGroup(id)
  16. await fn1()
  17. }
  18. return [
  19. {
  20. dataIndex: 'Id',
  21. title: 'ID',
  22. width: '5%'
  23. },
  24. {
  25. dataIndex: 'name',
  26. title: '组名称',
  27. width: '15%'
  28. },
  29. {
  30. dataIndex: 'permission',
  31. title: '拥有权限',
  32. customRender: ({ record }) => {
  33. const text = record.permission.reduce((prev, curr) => {
  34. if (prev && PermMap[curr]) {
  35. prev += '、'
  36. }
  37. if (PermMap[curr]) {
  38. prev += PermMap[curr]
  39. }
  40. return prev
  41. }, '')
  42. return <span>{text}</span>
  43. }
  44. },
  45. {
  46. dataIndex: 'createTime',
  47. title: '创建时间'
  48. },
  49. {
  50. dataIndex: 'remark',
  51. title: '备注'
  52. },
  53. {
  54. dataIndex: 'opreate',
  55. title: '操作',
  56. customRender: ({ record }) => (
  57. <div class="text-primary divide-x">
  58. <span class="cursor-pointer mr-2" onClick={() => fn2(record)}>
  59. <Icon icon="ant-design:edit-filled"></Icon>
  60. </span>
  61. <span class="pl-2">
  62. <Popconfirm title="确定删除吗?" okText="确认" cancelText="取消" onConfirm={() => delConfirm(record.id)}>
  63. <span class="text-red-500 hover:text-red-600 cursor-pointer">
  64. <Icon icon="fluent:delete-20-filled"></Icon>
  65. </span>
  66. </Popconfirm>
  67. </span>
  68. </div>
  69. )
  70. }
  71. ]
  72. }
  73. export function getPermSchemas() {
  74. const schemas = computed<FormSchema[]>(() => [
  75. {
  76. field: 'id',
  77. required: false,
  78. component: 'Input',
  79. label: 'ID',
  80. show: false
  81. },
  82. {
  83. field: 'name',
  84. component: 'Input',
  85. required: true,
  86. componentProps: {
  87. placeholder: '输入用户组名称'
  88. },
  89. label: '用户组名称'
  90. },
  91. {
  92. field: 'permission',
  93. component: 'CheckboxGroup',
  94. required: true,
  95. label: '权限设置',
  96. componentProps: {
  97. options: [
  98. { label: '项目', value: RoleEnum.SHOW_PROJECT },
  99. { label: '新增项目', value: RoleEnum.ADD_PROJECT },
  100. { label: '用户列表', value: RoleEnum.SHOW_STAFF },
  101. { label: '权限组', value: RoleEnum.SHOW_PERMISSION }
  102. ]
  103. }
  104. },
  105. {
  106. field: 'remark',
  107. component: 'InputTextArea',
  108. label: '备注'
  109. }
  110. ])
  111. return schemas
  112. }