inventory.vue 6.0 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141142143144145146147148149150151152153154155156157158159160161162163164165166167168169170171172173174175176177178179180181182183184185186187188189190191192193194195196197198199200201202203204205206207208209
  1. <!-- 盘点 -->
  2. <template>
  3. <div class="stock-order">
  4. <el-form :inline="true" :model="dataForm" @keyup.enter.native="queryData()">
  5. <el-form-item label="盘点日期">
  6. <el-date-picker
  7. v-model="dataForm.date"
  8. value-format="yyyy-MM-dd HH:mm:ss"
  9. type="daterange"
  10. range-separator="至"
  11. start-placeholder="开始日期"
  12. end-placeholder="结束日期">
  13. </el-date-picker>
  14. </el-form-item>
  15. <el-form-item>
  16. <el-button @click="queryData()">查询</el-button>
  17. <el-button v-if="isAuth('wh:inventory:save')" @click="inventoryAdd()" type="primary">新增盘点</el-button>
  18. </el-form-item>
  19. </el-form>
  20. <el-table
  21. :data="dataList"
  22. border
  23. v-loading="dataListLoading"
  24. @selection-change="selectionChangeHandle"
  25. style="width: 100%;">
  26. <el-table-column
  27. label="序号"
  28. type="index"
  29. width="50"
  30. align="center">
  31. </el-table-column>
  32. <el-table-column
  33. prop="inventoryCode"
  34. header-align="center"
  35. align="center"
  36. min-width="140"
  37. :show-tooltip-when-overflow="true"
  38. label="编码">
  39. </el-table-column>
  40. <el-table-column
  41. prop="createTime"
  42. header-align="center"
  43. align="center"
  44. min-width="140"
  45. label="开始日期">
  46. </el-table-column>
  47. <el-table-column
  48. prop="-"
  49. header-align="center"
  50. align="center"
  51. min-width="140"
  52. label="结束日期">
  53. </el-table-column>
  54. <el-table-column
  55. prop="state"
  56. header-align="center"
  57. align="center"
  58. :formatter="formatState"
  59. label="状态">
  60. </el-table-column>
  61. <el-table-column
  62. prop="checkerName"
  63. header-align="center"
  64. align="center"
  65. label="盘点员">
  66. </el-table-column>
  67. <el-table-column
  68. prop="dcheckerName"
  69. header-align="center"
  70. align="center"
  71. label="复核员">
  72. </el-table-column>
  73. <el-table-column
  74. prop="notes"
  75. header-align="center"
  76. align="center"
  77. width="120"
  78. :show-tooltip-when-overflow="true"
  79. label="备注">
  80. </el-table-column>
  81. <el-table-column
  82. fixed="right"
  83. header-align="center"
  84. align="center"
  85. width="150"
  86. label="操作">
  87. <template slot-scope="scope">
  88. <el-button v-if="isAuth('wh:inventory:info') && scope.row.state === '1'" type="text" size="small" @click="addOrUpdateHandle(scope.row.inventoryId, true)">查看</el-button>
  89. <el-button v-if="isAuth('wh:inventory:start') && scope.row.state === '0'" type="text" size="small" @click="addOrUpdateHandle(scope.row.inventoryId, false)">开始盘点</el-button>
  90. </template>
  91. </el-table-column>
  92. </el-table>
  93. <el-pagination
  94. @size-change="sizeChangeHandle"
  95. @current-change="currentChangeHandle"
  96. :current-page="pageIndex"
  97. :page-sizes="[10, 20, 50, 100]"
  98. :page-size="pageSize"
  99. :total="totalPage"
  100. layout="total, sizes, prev, pager, next, jumper">
  101. </el-pagination>
  102. <!-- 入库-->
  103. <inventory-add v-if="inventoryAddVisible" ref="inventoryAdd" @refreshDataList="getDataList"></inventory-add>
  104. <inventory-detail v-if="inventoryDetailVisible" ref="inventoryDetail" @refreshDataList="getDataList"></inventory-detail>
  105. </div>
  106. </template>
  107. <script>
  108. import inventoryAdd from './inventory-add'
  109. import inventoryDetail from './inventory-detail'
  110. import {getInventoryList} from '@/api/warehouse'
  111. export default {
  112. name: 'stock-order',
  113. components: {inventoryAdd, inventoryDetail},
  114. data () {
  115. return {
  116. inventoryAddVisible: false,
  117. inventoryDetailVisible: false,
  118. dataForm: {},
  119. dataList: [],
  120. pageIndex: 1,
  121. pageSize: 10,
  122. totalPage: 0,
  123. dataListLoading: false,
  124. dataListSelections: [],
  125. // 状态
  126. optionsState: [
  127. {
  128. code: '0',
  129. value: '正在进行中'
  130. },
  131. {
  132. code: '1',
  133. value: '完成'
  134. }
  135. ]
  136. }
  137. },
  138. created () {
  139. this.getDataList()
  140. },
  141. methods: {
  142. // 查询
  143. queryData () {
  144. this.pageIndex = 1
  145. this.getDataList()
  146. },
  147. // 获取数据列表
  148. getDataList () {
  149. this.dataListLoading = true
  150. let params = {
  151. 'current': this.pageIndex,
  152. 'size': this.pageSize,
  153. 'beginTime': this.dataForm.date ? this.dataForm.date[0] : null,
  154. 'endTime': this.dataForm.date ? this.dataForm.date[1] : null
  155. }
  156. getInventoryList(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. addOrUpdateHandle (id, display) {
  184. this.inventoryDetailVisible = true
  185. this.$nextTick(() => {
  186. this.$refs.inventoryDetail.init(id, display)
  187. })
  188. },
  189. // 新增盘点
  190. inventoryAdd () {
  191. this.inventoryAddVisible = true
  192. this.$nextTick(() => {
  193. this.$refs.inventoryAdd.init()
  194. })
  195. },
  196. // 转换属性“状态”
  197. formatState (row) {
  198. if (!row.state) return ''
  199. const item1 = this.optionsState.find((item) => item.code === row.state.toString())
  200. return item1 ? item1.value : ''
  201. }
  202. }
  203. }
  204. </script>
  205. <style scoped>
  206. </style>