salesReturnCheck.vue 8.7 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141142143144145146147148149150151152153154155156157158159160161162163164165166167168169170171172173174175176177178179180181182183184185186187188189190191192193194195196197198199200201202203204205206207208209210211212213214215216217218219220221222223224225226227228229230231232233234235236237238239240241242243244245246247248249250251252253254255256257258259260261262263264265266267268269270271272273274275
  1. <template>
  2. <div>
  3. <a-page-header :ghost="false" :backIcon="false" class="salesReturnCheck-back" >
  4. <!-- 自定义的二级文字标题 -->
  5. <template slot="subTitle">
  6. <a id="salesReturnCheck-back-btn" href="javascript:;" @click="handleBack"><a-icon type="left" /> 返回列表</a>
  7. <span style="margin: 0 15px;color: #666;">客户名称:{{ ordeDetail&&ordeDetail.buyerName || '--' }}</span>
  8. </template>
  9. </a-page-header>
  10. <a-spin :spinning="spinning" tip="Loading...">
  11. <a-card size="small" :bordered="false" class="pages-wrap">
  12. <div>
  13. <a-button type="primary" :loading="loading" class="button-error" @click="backStock">批量返库</a-button>
  14. </div>
  15. <!-- 已选配件列表 -->
  16. <s-table
  17. class="sTable"
  18. ref="table"
  19. size="small"
  20. :row-selection="{ selectedRowKeys: selectedRowKeys, onChange: onChange, onSelect: onSelectChange, onSelectAll: onSelectAllChange }"
  21. :rowKey="(record) => record.id"
  22. :columns="columns"
  23. :data="loadData"
  24. :scroll="{ x: 710, y: 300 }"
  25. bordered>
  26. <!-- 返库数量 -->
  27. <template slot="backStockQty" slot-scope="text, record">
  28. <a-input-number
  29. id="salesReturn-backStockQty"
  30. size="small"
  31. v-model="record.backStockQty"
  32. :precision="0"
  33. :min="0"
  34. :max="record.qty"
  35. placeholder="请输入"
  36. @blur="e => onCellBlur(e.target.value, record)"
  37. style="width: 100%;" />
  38. </template>
  39. </s-table>
  40. </a-card>
  41. <a-affix :offset-bottom="0">
  42. <div
  43. style="text-align: center;width: 100%;background-color: #fff;padding: 0 0 40px;box-shadow: 0 0 20px #dcdee2;">
  44. <a-button
  45. size="large"
  46. style="width: 150px;"
  47. type="primary"
  48. class="button-primary"
  49. @click="handleSubmit()"
  50. id="salesReturn-handleSubmit">提交</a-button>
  51. </div>
  52. </a-affix>
  53. </a-spin>
  54. </div>
  55. </template>
  56. <script>
  57. import { STable, VSelect } from '@/components'
  58. import queryPart from './queryPart.vue'
  59. import { salesReturnDetail, salesReturnCheck } from '@/api/salesReturn'
  60. import {
  61. salesReturnDetailList,
  62. updateBackStockQty
  63. } from '@/api/salesReturnDetail'
  64. export default {
  65. name: 'SalesReturnEdit',
  66. components: {
  67. STable,
  68. VSelect,
  69. queryPart
  70. },
  71. data () {
  72. return {
  73. spinning: false,
  74. orderId: null,
  75. orderSn: null,
  76. buyerSn: null,
  77. disabled: false,
  78. isInster: false, // 是否正在添加产品
  79. ordeDetail: { discountAmount: 0 },
  80. loading: false,
  81. selectedRowKeys: [], // Check here to configure the default column
  82. selectedRows: [],
  83. // 已选产品
  84. dataSource: [],
  85. productForm: {
  86. salesReturnBillSn: ''
  87. },
  88. // 表头
  89. columns: [
  90. { title: '序号', dataIndex: 'no', width: 70, align: 'center' },
  91. { title: '产品编码', dataIndex: 'productEntity.code', align: 'center', width: 120, customRender: function (text) { return text || '--' } },
  92. { title: '产品名称', dataIndex: 'productEntity.name', align: 'center', customRender: function (text) { return text || '--' } },
  93. { title: '退货数量', dataIndex: 'qty', align: 'center', width: 80, customRender: function (text) { return ((text || text == 0) ? text : '--') } },
  94. { title: '坏件数量', dataIndex: 'badQty', align: 'center', width: 80, customRender: function (text) { return ((text || text == 0) ? text : '--') } },
  95. { title: '返库数量', dataIndex: 'backStockQty', width: 100, align: 'center', scopedSlots: { customRender: 'backStockQty' } },
  96. { title: '单位', dataIndex: 'productEntity.unit', align: 'center', customRender: function (text) { return text || '--' }, width: 60 },
  97. { title: '售价', dataIndex: 'price', align: 'center', width: 80, customRender: function (text) { return ((text || text == 0) ? text : '--') } }
  98. ],
  99. chooseLoadData: [],
  100. // 加载数据方法 必须为 Promise 对象
  101. loadData: parameter => {
  102. this.disabled = true
  103. // 查询总计
  104. this.productForm.salesReturnBillSn = this.$route.params.sn
  105. return salesReturnDetailList(Object.assign(parameter, this.productForm)).then(res => {
  106. const data = res.data
  107. const no = (data.pageNo - 1) * data.pageSize
  108. for (var i = 0; i < data.list.length; i++) {
  109. data.list[i].no = no + i + 1
  110. data.list[i].backStockQtyBackups = data.list[i].backStockQty
  111. }
  112. this.disabled = false
  113. this.chooseLoadData = data.list
  114. return data
  115. })
  116. }
  117. }
  118. },
  119. methods: {
  120. onChange (selectedRowKeys, selectedRows) {
  121. this.selectedRowKeys = selectedRowKeys
  122. },
  123. onSelectChange (record, selected, selectedRows, nativeEvent) {
  124. const _this = this
  125. if (selected) { // 选择
  126. this.selectedRows.push(record)
  127. } else { // 取消
  128. const arrId = []
  129. this.selectedRows.map((item, index) => {
  130. if (item.id == record.id) {
  131. arrId.push(index)
  132. }
  133. })
  134. arrId.map((item, index) => {
  135. _this.selectedRows = _this.selectedRows.slice(item, item + 1)
  136. })
  137. }
  138. },
  139. // 本页全选/取消全选
  140. onSelectAllChange (selected, selectedRows, changeRows) {
  141. const _this = this
  142. if (selected) { // 选择
  143. this.selectedRows = [...this.selectedRows, ...changeRows]
  144. } else { // 取消
  145. const arrId = []
  146. this.selectedRows.map((item, index) => {
  147. this.selectedRows.map((subItem, ind) => {
  148. if (item.id == subItem.id) {
  149. arrId.push(index)
  150. }
  151. })
  152. })
  153. arrId.map((item, index) => {
  154. _this.selectedRows = _this.selectedRows.slice(item, item + 1)
  155. })
  156. }
  157. },
  158. // 返回
  159. handleBack () {
  160. this.$router.push({ path: '/salesManagement/salesReturn/list', query: { closeLastOldTab: true } })
  161. },
  162. // 批量返库
  163. backStock () {
  164. const _this = this
  165. if (_this.selectedRowKeys.length < 1) {
  166. _this.$message.warning('请在选择产品!')
  167. return
  168. }
  169. this.$confirm({
  170. title: '提示',
  171. content: '确认要批量返库吗?',
  172. centered: true,
  173. onOk () {
  174. const obj = []
  175. _this.selectedRows.map(item => {
  176. obj.push({
  177. salesReturnDetailSn: item.salesReturnDetailSn,
  178. backStockQty: item.qty
  179. })
  180. })
  181. _this.submitCheck(obj)
  182. }
  183. })
  184. },
  185. // 已选产品 blur
  186. onCellBlur (val, record) {
  187. // 光标移出,值发生改变再调用编辑接口
  188. if (val && val != record.backStockQtyBackups) {
  189. this.submitCheck([{
  190. salesReturnDetailSn: record.salesReturnDetailSn,
  191. backStockQty: record.backStockQty
  192. }])
  193. } else {
  194. record.backStockQty = record.backStockQtyBackups
  195. }
  196. },
  197. // 品检
  198. submitCheck (data) {
  199. this.loading = true
  200. this.spinning = true
  201. updateBackStockQty(data).then(res => {
  202. if (res.status == 200) {
  203. this.resetSearchForm(true)
  204. this.$message.success(res.message)
  205. }
  206. this.loading = false
  207. this.spinning = false
  208. })
  209. },
  210. // 重置列表
  211. resetForm () {
  212. this.$refs.table.refresh(true)
  213. },
  214. // 获取单据详细
  215. getOrderDetail () {
  216. salesReturnDetail({ sn: this.orderSn }).then(res => {
  217. this.ordeDetail = res.data || null
  218. })
  219. },
  220. // 重置
  221. resetSearchForm (flag) {
  222. this.$refs.table.refresh(!!flag)
  223. this.getOrderDetail()
  224. },
  225. // 提交销售单
  226. handleSubmit () {
  227. this.spinning = true
  228. salesReturnCheck({ salesReturnBillSn: this.orderSn }).then(res => {
  229. if (res.status == 200) {
  230. this.handleBack()
  231. this.$message.success(res.message)
  232. this.spinning = false
  233. } else {
  234. this.spinning = false
  235. }
  236. })
  237. }
  238. },
  239. mounted () {
  240. this.orderSn = this.$route.params.sn
  241. this.buyerSn = this.$route.params.buyerSn
  242. this.getOrderDetail()
  243. },
  244. beforeRouteEnter (to, from, next) {
  245. next(vm => {
  246. console.log('beforeRouteEnter')
  247. })
  248. }
  249. }
  250. </script>
  251. <style lang="less">
  252. .pages-wrap{
  253. margin-top: 10px;
  254. .sTable{
  255. margin-top: 10px;
  256. }
  257. .total-bar{
  258. display: flex;
  259. align-items: center;
  260. justify-content: space-between;
  261. > div{
  262. &:last-child{
  263. display: flex;
  264. align-items: center;
  265. justify-content: space-between;
  266. > div{
  267. padding: 0 10px;
  268. }
  269. }
  270. }
  271. }
  272. }
  273. </style>