curd.tsx 3.7 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137
  1. import * as api from './api';
  2. import { UserPageQuery, AddReq, DelReq, EditReq, CreateCrudOptionsProps, CreateCrudOptionsRet } from '@fast-crud/fast-crud';
  3. import dayjs from 'dayjs';
  4. export const createCrudOptions = function ({ crudExpose }: CreateCrudOptionsProps): CreateCrudOptionsRet {
  5. const pageRequest = async (query: UserPageQuery) => {
  6. try {
  7. const res = await api.GetList(query);
  8. return {
  9. ...res,
  10. records: res.data,
  11. total: res.total,
  12. };
  13. } catch (error) {
  14. return {
  15. code: 2000,
  16. msg: 'success',
  17. records: [],
  18. total: 0,
  19. };
  20. }
  21. };
  22. const editRequest = async ({ form, row }: EditReq) => {
  23. form.id = row.id;
  24. return await api.UpdateObj(row.id,form);
  25. };
  26. const delRequest = async ({ row }: DelReq) => {
  27. return await api.DelObj(row.id);
  28. };
  29. const addRequest = async ({ form }: AddReq) => {
  30. return await api.AddObj(form);
  31. };
  32. return {
  33. crudOptions: {
  34. request: {
  35. pageRequest,
  36. addRequest,
  37. editRequest,
  38. delRequest,
  39. },
  40. actionbar: {
  41. buttons: {
  42. add: {
  43. show: false,
  44. text: '新建审批流程',
  45. click: () => {
  46. window.dispatchEvent(new CustomEvent('workflow-add'))
  47. }
  48. },
  49. },
  50. },
  51. search:{show:true},
  52. toolbar:{show:false},
  53. rowHandle: {
  54. fixed: 'right',
  55. width: 220,
  56. buttons: {
  57. view: {
  58. show: true,
  59. click: ({ row }) => {
  60. window.dispatchEvent(new CustomEvent('workflow-view', { detail: row }));
  61. },
  62. },
  63. edit: {
  64. show: true,
  65. click: ({ row }) => {
  66. window.dispatchEvent(new CustomEvent('workflow-edit', { detail: row }));
  67. },
  68. },
  69. remove: {
  70. show: true,
  71. },
  72. },
  73. },
  74. columns: {
  75. _index: {
  76. title: '序号',
  77. form: { show: false },
  78. column: {
  79. align: 'center',
  80. width: '70px',
  81. columnSetDisabled: true,
  82. formatter: (context: any) => {
  83. let index = context.index ?? 1;
  84. let pagination = crudExpose!.crudBinding.value.pagination;
  85. return ((pagination!.currentPage ?? 1) - 1) * pagination!.pageSize + index + 1;
  86. },
  87. },
  88. },
  89. name: { title: '流程名称',type:'input', column: { minWidth: 140 }, search: { show: true} , form:{
  90. component: { placeholder: '请输入设备编号' },
  91. }},
  92. workflow_type:{
  93. title: '流程类型id',type:'input', column: { show:false,minWidth: 140 },
  94. search: { show: false },
  95. form:{
  96. component: { placeholder: '请输入设备编号' },
  97. }
  98. },
  99. "trigger_conditions.team_type":{
  100. title: '流程类型id', column: { show:false,minWidth: 140 }, search: { show: false }
  101. },
  102. "trigger_conditions.user_types":{
  103. title: '流程类型id', column: { show:false,minWidth: 140 }, search: { show: false }
  104. },
  105. "trigger_conditions.borrow_types":{
  106. title: '流程类型id', column: { show:false,minWidth: 140 }, search: { show: false }
  107. },
  108. "trigger_conditions.equipment_categories":{
  109. title: '流程类型id', column: { show:false,minWidth: 140 }, search: { show: false }
  110. },
  111. workflow_type_label: { title: '流程类型', column: { minWidth: 120 } },
  112. description: { title: '流程描述', column: { minWidth: 200 } },
  113. step_count: { title: '步骤数', column: { minWidth: 80, align: 'center' } },
  114. is_active: {
  115. title: '状态',
  116. column: {
  117. minWidth: 80,
  118. formatter: ({ value }: any) => (value ? '启用' : '停用'),
  119. },
  120. },
  121. create_datetime: {
  122. title: '创建时间',
  123. column: { minWidth: 160, formatter: ({ value }: any) => (value ? dayjs(value).format('YYYY-MM-DD HH:mm:ss') : '') },
  124. },
  125. update_datetime: {
  126. title: '更新时间',
  127. column: { minWidth: 160, formatter: ({ value }: any) => (value ? dayjs(value).format('YYYY-MM-DD HH:mm:ss') : '') },
  128. },
  129. },
  130. },
  131. };
  132. };