recallModal.vue 5.5 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141142143144145146147148149150151152153154155156157158159160161162163164165166167168169170171172173174175176177178179180181182183184185
  1. <template>
  2. <a-modal
  3. v-model="opened"
  4. :title="title"
  5. centered
  6. :maskClosable="false"
  7. :confirmLoading="confirmLoading"
  8. :width="960"
  9. :footer="null"
  10. @cancel="cancel"
  11. >
  12. <a-spin :spinning="spinning" tip="Loading...">
  13. <a-descriptions v-if="currentData">
  14. <a-descriptions-item label="调回单号">{{ currentData.recallBillNo||'--' }}</a-descriptions-item>
  15. <a-descriptions-item label="创建时间">{{ currentData.createDate||'--' }}</a-descriptions-item>
  16. </a-descriptions>
  17. <a-table
  18. class="sTable fixPagination"
  19. ref="table"
  20. size="small"
  21. :rowKey="(record) => record.id"
  22. :columns="columns"
  23. :data-source="list"
  24. :scroll="{ y:500 }"
  25. :pagination="false"
  26. bordered>
  27. <template slot="confirmQty" slot-scope="text,record,index">
  28. <a-input-number
  29. size="small"
  30. id="recallModal-inputNumber"
  31. @focus="currentInd=index"
  32. @change="changeNum"
  33. v-model="record.confirmQty"
  34. :precision="0"
  35. :min="0"
  36. :max="record.qty"
  37. placeholder="请输入"
  38. />
  39. </template>
  40. </a-table>
  41. <div class="btn-cont">
  42. <a-button type="primary" id="recallManagement-confirm-modal-save" @click="handleSave">确认退库</a-button>
  43. <a-button id="recallManagement-confirm-modal-back" @click="cancel" style="margin-left: 15px;">取消</a-button>
  44. </div>
  45. </a-spin>
  46. </a-modal>
  47. </template>
  48. <script>
  49. import { commonMixin } from '@/utils/mixin'
  50. import { STable } from '@/components'
  51. import { warehouseCascadeList, shelfRecallDetailList } from '@/api/shelfRecall.js'
  52. export default {
  53. components: { STable },
  54. mixins: [commonMixin],
  55. props: {
  56. isOpenModal: {
  57. type: Boolean,
  58. default: false
  59. },
  60. currentData: {
  61. type: Object,
  62. default: function () {
  63. return {}
  64. }
  65. }
  66. },
  67. data () {
  68. return {
  69. currentInd: 0,
  70. formItemLayout: {
  71. labelCol: { span: 6 },
  72. wrapperCol: { span: 15 }
  73. },
  74. opened: this.isOpenModal,
  75. confirmLoading: false,
  76. spinning: false,
  77. rules: [],
  78. columns: [
  79. { title: '产品编码', dataIndex: 'product.code', width: '20%', align: 'center', customRender: function (text) { return text || '--' } },
  80. { title: '产品名称', dataIndex: 'product.name', width: '30%', align: 'left', customRender: function (text) { return text || '--' } },
  81. { title: '调回数量', dataIndex: 'qty', width: '15%', align: 'center', customRender: function (text) { return text || '--' } },
  82. { title: '实退数量', width: '15%', align: 'center', scopedSlots: { customRender: 'confirmQty' } },
  83. { title: '单位', dataIndex: 'product.unit', width: '15%', align: 'center', customRender: function (text) { return text || '--' } }
  84. ],
  85. list: []
  86. }
  87. },
  88. computed: {
  89. title () {
  90. return '调回单退库' + ' —— ' + (this.currentData && this.currentData.shelfInfo ? this.currentData.shelfInfo.shelfName : '')
  91. }
  92. },
  93. methods: {
  94. changeNum (val) {
  95. console.log(val)
  96. this.list[this.currentInd].confirmQty = val
  97. this.list.splice()
  98. console.log(this.list[this.currentInd].confirmQty, '调回数量')
  99. },
  100. // 保存
  101. handleSave () {
  102. const _this = this
  103. this.$confirm({
  104. title: '提示',
  105. content: '调回产品将退回至经销商仓库,确认退库吗?',
  106. centered: true,
  107. onOk () {
  108. // _this.$emit('close')
  109. _this.spinning = true
  110. const arr = []
  111. _this.list.map((item, index) => {
  112. if (item.confirmQty || item.confirmQty == 0) {
  113. arr.push({
  114. productSn: item.productSn,
  115. confirmQty: item.confirmQty,
  116. recallBillDetailSn: item.recallBillDetailSn
  117. })
  118. }
  119. })
  120. const params = {
  121. shelfSn: _this.list[0].shelfSn,
  122. recallBillSn: _this.list[0].recallBillSn,
  123. recallBillNo: _this.list[0].recallBillNo,
  124. detailList: arr
  125. }
  126. warehouseCascadeList(params).then(res => {
  127. if (res.status == 200) {
  128. _this.$message.success(res.message)
  129. _this.spinning = false
  130. _this.$emit('refresh')
  131. _this.cancel()
  132. } else {
  133. _this.spinning = false
  134. }
  135. })
  136. }
  137. })
  138. },
  139. getData () {
  140. this.spinning = true
  141. shelfRecallDetailList({ recallBillSn: this.currentData.recallBillSn }).then(res => {
  142. if (res.status == 200) {
  143. this.list = res.data
  144. const no = 0
  145. for (var i = 0; i < this.list.length; i++) {
  146. this.list[i].no = no + i + 1
  147. this.list[i].confirmQty = this.list[i].qty
  148. }
  149. } else {
  150. this.list = []
  151. }
  152. this.spinning = false
  153. })
  154. },
  155. // 取消
  156. cancel () {
  157. this.$emit('close')
  158. }
  159. },
  160. watch: {
  161. isOpenModal (nVal, oVal) {
  162. this.opened = nVal
  163. if (nVal) {
  164. this.getData()
  165. // if (this.currentData) {
  166. // this.currentData.map((item, index) => {
  167. // item.no = index + 1
  168. // item.confirmQty = item.qty
  169. // })
  170. // }
  171. // this.list = JSON.parse(JSON.stringify(this.currentData || []))
  172. }
  173. }
  174. }
  175. }
  176. </script>
  177. <style lang="less">
  178. .btn-cont {
  179. text-align: center;
  180. margin: 25px 0 10px;
  181. }
  182. </style>