handover-records.vue 5.6 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141142143144145146147148149150151152153154155156157158159160161162163164165166167168169170171172173174175176177178179180181182183184185186187188189190191192193194195196
  1. <!-- 移交记录 -->
  2. <template>
  3. <div>
  4. <template v-if="!detailVisible">
  5. <el-form :inline="true" :model="dataForm" @keyup.enter.native="queryPage()">
  6. <el-form-item label="名称">
  7. <el-input v-model="dataForm.name" placeholder="名称" clearable/>
  8. </el-form-item>
  9. <el-form-item label="产品编号">
  10. <el-input v-model="dataForm.code" placeholder="产品编号" clearable/>
  11. </el-form-item>
  12. <el-form-item>
  13. <el-button @click="queryPage()">查询</el-button>
  14. </el-form-item>
  15. </el-form>
  16. <el-table
  17. :data="dataList"
  18. border
  19. v-loading="dataListLoading"
  20. style="width: 100%;">
  21. <el-table-column
  22. label="序号"
  23. type="index"
  24. width="50"
  25. align="center">
  26. </el-table-column>
  27. <el-table-column
  28. prop="productName"
  29. header-align="center"
  30. align="center"
  31. width="160"
  32. :show-overflow-tooltip="true"
  33. label="产品名称">
  34. </el-table-column>
  35. <el-table-column
  36. prop="prodCode"
  37. header-align="center"
  38. align="center"
  39. width="160"
  40. :show-overflow-tooltip="true"
  41. label="产品编号">
  42. </el-table-column>
  43. <el-table-column
  44. prop="techName"
  45. header-align="center"
  46. align="center"
  47. width="160"
  48. :show-overflow-tooltip="true"
  49. label="工艺名称">
  50. </el-table-column>
  51. <el-table-column
  52. prop="nodeName"
  53. header-align="center"
  54. align="center"
  55. width="160"
  56. :show-overflow-tooltip="true"
  57. label="工序名称">
  58. </el-table-column>
  59. <el-table-column
  60. prop="transferUserName"
  61. header-align="center"
  62. align="center"
  63. width="120"
  64. :show-overflow-tooltip="true"
  65. label="移交接收人">
  66. </el-table-column>
  67. <el-table-column
  68. prop="creatorName"
  69. header-align="center"
  70. align="center"
  71. min-width="120"
  72. :show-overflow-tooltip="true"
  73. label="移交发起人">
  74. </el-table-column>
  75. <el-table-column
  76. prop="transferExplain"
  77. header-align="center"
  78. align="center"
  79. min-width="160"
  80. :show-overflow-tooltip="true"
  81. label="移交说明">
  82. </el-table-column>
  83. <el-table-column
  84. prop="createTime"
  85. header-align="center"
  86. align="center"
  87. min-width="160"
  88. label="移交时间">
  89. </el-table-column>
  90. <el-table-column
  91. v-if="isAuth('prod:transfer:info')"
  92. fixed="right"
  93. header-align="center"
  94. align="center"
  95. width="140"
  96. label="操作">
  97. <template slot-scope="scope">
  98. <el-button type="text" size="small" @click="detailHandle(scope.row.recordId)">查看</el-button>
  99. </template>
  100. </el-table-column>
  101. </el-table>
  102. <el-pagination
  103. @size-change="sizeChangeHandle"
  104. @current-change="currentChangeHandle"
  105. :current-page="pageIndex"
  106. :page-sizes="[10, 20, 50, 100]"
  107. :page-size="pageSize"
  108. :total="totalPage"
  109. layout="total, sizes, prev, pager, next, jumper">
  110. </el-pagination>
  111. </template>
  112. <detail v-if="detailVisible" ref="detail" @onChose="onChose"/>
  113. </div>
  114. </template>
  115. <script>
  116. import {getTransferList} from '@/api/task'
  117. import Detail from './handover-records-details'
  118. export default {
  119. name: 'handover-records',
  120. components: {Detail},
  121. data () {
  122. return {
  123. detailVisible: false,
  124. dataForm: {},
  125. dataList: [],
  126. pageIndex: 1,
  127. pageSize: 10,
  128. totalPage: 0,
  129. dataListLoading: false,
  130. dataListSelections: []
  131. }
  132. },
  133. created () {
  134. this.getDataList()
  135. },
  136. methods: {
  137. onChose () {
  138. this.detailVisible = false
  139. },
  140. // 查询
  141. queryPage () {
  142. this.pageIndex = 1
  143. this.getDataList()
  144. },
  145. // 获取数据列表
  146. getDataList () {
  147. this.dataListLoading = true
  148. this.addOrUpdateVisible = false
  149. // 接口调用
  150. let params = {
  151. 'current': this.pageIndex,
  152. 'size': this.pageSize,
  153. 'productName': this.dataForm.name ? this.dataForm.name : null,
  154. 'prodCode': this.dataForm.code ? this.dataForm.code : null
  155. }
  156. getTransferList(params).then(({data}) => {
  157. if (data && data.code === '200') {
  158. this.dataList = data.data.records
  159. this.totalPage = Number(data.data.total)
  160. } else {
  161. this.dataList = []
  162. this.totalPage = 0
  163. }
  164. this.dataListLoading = false
  165. })
  166. },
  167. // 每页数
  168. sizeChangeHandle (val) {
  169. this.pageSize = val
  170. this.pageIndex = 1
  171. this.getDataList()
  172. },
  173. // 当前页
  174. currentChangeHandle (val) {
  175. this.pageIndex = val
  176. this.getDataList()
  177. },
  178. // 多选
  179. selectionChangeHandle (val) {
  180. this.dataListSelections = val
  181. },
  182. // 详情
  183. detailHandle (id) {
  184. this.detailVisible = true
  185. this.$nextTick(() => {
  186. this.$refs.detail.init(id)
  187. })
  188. }
  189. }
  190. }
  191. </script>
  192. <style scoped>
  193. </style>