FlowList.vue 3.5 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115
  1. <template>
  2. <a-row :gutter="24">
  3. <a-col :md="24">
  4. <a-card :style="cardStyle" :bordered="false">
  5. <!-- 查询区域 -->
  6. <div class="table-page-search-wrapper">
  7. <a-form layout="inline" @keyup.enter.native="searchQuery">
  8. <a-row :gutter="24">
  9. <a-col :md="6" :sm="24">
  10. <a-form-item label="流程类型" :labelCol="labelCol" :wrapperCol="wrapperCol">
  11. <a-select v-model="queryParam.processType" placeholder="请选择流程类型">
  12. <a-select-option value="0">全部</a-select-option>
  13. <a-select-option value="1">请假</a-select-option>
  14. </a-select>
  15. </a-form-item>
  16. </a-col>
  17. <a-col :md="6" :sm="24">
  18. <span style="float: left; overflow: hidden" class="table-page-search-submitButtons">
  19. <a-button type="primary" @click="searchQuery">查询</a-button>
  20. <a-button style="margin-left: 8px" @click="searchReset">重置</a-button>
  21. </span>
  22. </a-col>
  23. </a-row>
  24. </a-form>
  25. </div>
  26. <!-- table区域-begin -->
  27. <div>
  28. <a-table
  29. ref="table"
  30. bordered
  31. size="middle"
  32. rowKey="id"
  33. :columns="columns"
  34. :dataSource="dataSource"
  35. :pagination="ipagination"
  36. :scroll="scroll"
  37. :loading="loading"
  38. :rowSelection="{ selectedRowKeys: selectedRowKeys, onChange: onSelectChange }"
  39. @change="handleTableChange"
  40. >
  41. <span slot="action" slot-scope="text, record">
  42. <a @click="">查看</a>
  43. <a-divider type="vertical" />
  44. <a-popconfirm
  45. title="确定删除吗?"
  46. @confirm="() => handleDelete(record.id)"
  47. >
  48. <a>删除</a>
  49. </a-popconfirm>
  50. </span>
  51. </a-table>
  52. </div>
  53. <!-- table区域-end -->
  54. </a-card>
  55. </a-col>
  56. </a-row>
  57. </template>
  58. <script>
  59. import { postAction } from '@/api/manage'
  60. import { JeecgListMixin } from '@/mixins/JeecgListMixin'
  61. export default {
  62. name: 'FlowList',
  63. mixins: [JeecgListMixin],
  64. components: {},
  65. data() {
  66. return {
  67. labelCol: {
  68. span: 5,
  69. },
  70. wrapperCol: {
  71. span: 18,
  72. offset: 1,
  73. },
  74. queryParam: {},
  75. depotFlag: '0',
  76. customerFlag: '0',
  77. columns: [
  78. { title: '流程类型', dataIndex: 'username', width: 100, align: 'left' },
  79. { title: '流程节点1', dataIndex: 'userType', width: 80, align: 'left' },
  80. { title: '流程节点2', dataIndex: 'roleName', width: 100, align: 'left' },
  81. { title: '流程节点3', dataIndex: 'orgAbr', width: 100, align: 'left' },
  82. { title: '流程节点4', dataIndex: 'leaderFlagStr', width: 60, align: 'left' },
  83. { title: '备注', dataIndex: 'phonenum', width: 80, align: 'left' },
  84. {
  85. title: '操作',
  86. dataIndex: 'action',
  87. scopedSlots: { customRender: 'action' },
  88. align: 'center',
  89. width: 100,
  90. },
  91. ],
  92. url: {
  93. list: '',
  94. delete: '',
  95. },
  96. }
  97. },
  98. created() {
  99. },
  100. methods: {
  101. searchQuery() {
  102. this.loadData(1)
  103. this.getSystemConfig()
  104. },
  105. searchReset() {
  106. this.queryParam = {}
  107. this.loadData(1)
  108. this.getSystemConfig()
  109. },
  110. },
  111. }
  112. </script>
  113. <style scoped>
  114. @import '~@assets/less/common.less';
  115. </style>