index.vue 7.4 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141142143144145146147148149150151152153154155156157158159160161162163164165166167168169170171172173174175176177178179180181182183184185186187188189190191192193194195196197198199200201202203204205206207208209210211212213214215216217218219220221222223224225226227228229230231232233234235236237238239240241242243244245246247248249250251252253254255256257258259260261262263264265266267268269270271272273274275276277278279280281
  1. <template>
  2. <view class="p-content">
  3. <view class="p-head" v-if="baseData">
  4. <view>
  5. <view>
  6. <text>采购单号:</text>
  7. <text style="color: crimson;">{{baseData[0].purchaseBillNo}}</text>
  8. </view>
  9. <view>
  10. <button :disabled="loading" size="mini" type="primary" @click="toOut"> 入库 <text class="iconfont icon-icon-test43"></text></button>
  11. </view>
  12. </view>
  13. <view>
  14. <text>发货单号:</text>
  15. <text style="color: crimson;">{{baseData[0].sendBillNo}}</text>
  16. </view>
  17. <view>
  18. <text>条码:</text>
  19. <view>
  20. <input
  21. @blur="addQty(true)"
  22. style="width: 100%;text-align: left;"
  23. class="uni-input"
  24. placeholder="扫描或输入条码"
  25. border="surround"
  26. v-model="code">
  27. </view>
  28. </view>
  29. <view style="justify-content: flex-start;flex-wrap: wrap;" v-for="(item,bindex) in baseData" :key="item.id">
  30. <view>总款数:{{ item.totalPutCategory }}</view>
  31. <view>发货数量: {{ item.totalPutQty }}</view>
  32. <view>发货金额: {{ item.totalPutAmount?toThousands(item.totalPutAmount,2):'0.00' }}</view>
  33. <view>入库数量: {{ item && (item.totalRealPutQty || item.totalRealPutQty==0) ? item.totalRealPutQty : '--' }}</view>
  34. <view>入库金额: {{ item && (item.totalRealPutAmount || item.totalRealPutAmount==0) ? toThousands(item.totalRealPutAmount, 2) : '--' }}</view>
  35. </view>
  36. </view>
  37. <view class="p-body">
  38. <uni-table style="width: 100%;" border emptyText="暂无数据" :loading="loading" >
  39. <!-- 表头行 -->
  40. <uni-tr>
  41. <uni-td align="center">产品编码</uni-td>
  42. <uni-td align="center">产品分类</uni-td>
  43. <uni-td align="center">入库/发货数量</uni-td>
  44. <uni-td align="center">入库金额</uni-td>
  45. </uni-tr>
  46. <!-- 表格数据行 -->
  47. <uni-tr v-for="item in detailList" :key="item.id" :checkedRow="curProduct&&curProduct.dealerProductEntity.qrCode == item.dealerProductEntity.qrCode">
  48. <uni-td width="30%" align="center">{{item.dealerProductEntity.code}}</uni-td>
  49. <uni-td width="30%" align="center">{{item.dealerProductEntity.productTypeName3}}</uni-td>
  50. <uni-td width="25%" align="center"><text style="color: red;">{{item.realPutQty}}</text>/{{item.putQty}}</uni-td>
  51. <uni-td width="15%" align="center">
  52. {{item.realPutAmount}}
  53. </uni-td>
  54. </uni-tr>
  55. </uni-table>
  56. </view>
  57. <view class="p-footer">
  58. <button size="mini" type="warn" @click="addQty(false)"> <text class="iconfont icon-reduce-btn"> 减 </text></button>
  59. <button size="mini" type="primary" @click="addQty(true)"> <text class="iconfont icon-add-btn"> 加 </text></button>
  60. </view>
  61. <scanCode @onKeyDown="keyDown"></scanCode>
  62. <u-picker
  63. :show="showPick"
  64. :closeOnClickOverlay="true"
  65. ref="uPicker"
  66. title="选择仓库仓位"
  67. :columns="pickItem"
  68. keyName="name"
  69. @close="showPick=false"
  70. @cancel="showPick=false"
  71. @change="changePick"></u-picker>
  72. </view>
  73. </template>
  74. <script>
  75. import scanCode from '@/libs/scan-code.vue';
  76. import { purchaseWriteStockIn, receivingQuery, receivingDetail, purchaseUpdateWarehouse, updateRealPutQty } from '@/config/api.js'
  77. import { playAudio, toThousands } from '@/libs/tools.js'
  78. export default {
  79. components: { scanCode },
  80. data() {
  81. return {
  82. loading: false,
  83. showPick: false,
  84. baseData: null,
  85. detailList:[],
  86. code:'',
  87. receivingBillSn: null,
  88. salesId: null,
  89. curProduct: null,
  90. toThousands,
  91. warehouseList: [],
  92. pickItem: [],
  93. keyName: ''
  94. };
  95. },
  96. onLoad(opts) {
  97. var _this = this
  98. this.warehouseList = this.$store.state.vuex_warehouseList
  99. this.receivingBillSn = opts.receivingBillSn
  100. this.salesId = opts.id
  101. // 仓库列表
  102. this.getWarehousePick()
  103. this.getDetail()
  104. this.getDetailList()
  105. uni.$on('scancodedate', function(content) {
  106. console.log("扫描到的内容为:", content, this.keyName)
  107. if(this.keyName == 'rightKey'){
  108. _this.code = content||''
  109. _this.addQty(true)
  110. }
  111. if(this.keyName == 'leftKey'){
  112. }
  113. })
  114. },
  115. onShow() {
  116. this.hideKeyborder()
  117. },
  118. onUnload() {
  119. uni.$off('scancodedate')
  120. },
  121. methods: {
  122. hideKeyborder(){
  123. uni.hideKeyboard()
  124. },
  125. keyDown(e){
  126. this.keyName = e
  127. },
  128. getWarehousePick(){
  129. const col1 = []
  130. const col2 = []
  131. this.warehouseList.map((item,index) => {
  132. col1.push(item)
  133. if(index == 0 && item.warehouseLocationList){
  134. item.warehouseLocationList.map(k => {
  135. col2.push(k)
  136. })
  137. }
  138. })
  139. this.pickItem = [col1,col2]
  140. // this.showPick = true
  141. },
  142. // 选择仓库
  143. changePick(e){
  144. const {
  145. columnIndex,
  146. index,
  147. // 微信小程序无法将picker实例传出来,只能通过ref操作
  148. picker = this.$refs.uPicker
  149. } = e
  150. console.log(columnIndex,index)
  151. if (columnIndex === 0) {
  152. const currow = this.pickItem[0][index]
  153. const col2 = []
  154. currow&&currow.warehouseLocationList.map(item => {
  155. col2.push(item)
  156. })
  157. picker.setColumnValues(1, col2)
  158. }
  159. },
  160. getCurRow(){
  161. const curProduct = this.detailList.find(item => item.dealerProductEntity.qrCode == this.code)
  162. this.curProduct = curProduct || null
  163. return curProduct
  164. },
  165. // 修改仓库
  166. updateWarehouse (row) {
  167. this.loading = true
  168. purchaseUpdateWarehouse({
  169. id: row.id,
  170. warehouseSn: row.warehouseSn,
  171. warehouseLocationSn: row.warehouseLocationSn
  172. }).then(res => {
  173. if (res.status == 200) {
  174. this.getDetailList()
  175. }
  176. this.loading = false
  177. })
  178. },
  179. // 修改入库数量
  180. changePutQty(record, realPutQty){
  181. if(realPutQty){
  182. this.loading = true
  183. updateRealPutQty({id:record.id,realPutQty:realPutQty}).then(res => {
  184. if(res.status == 200){
  185. uni.$u.toast(res.message)
  186. this.getDetail()
  187. this.getDetailList()
  188. }
  189. this.loading = false
  190. })
  191. }else{
  192. uni.$u.toast("入库数量不能为0")
  193. }
  194. },
  195. //拣货
  196. addQty(flag){
  197. if(this.code==''){
  198. uni.$u.toast("请扫描或输入条形码")
  199. return
  200. }
  201. const row = this.getCurRow()
  202. if(row){
  203. this.changePutQty(row,row.realPutQty + (flag?1:-1))
  204. }else{
  205. uni.$u.toast("此商品不存在")
  206. }
  207. },
  208. // 详情
  209. getDetail(){
  210. receivingQuery({receivingBillSn: this.receivingBillSn}).then(res => {
  211. console.log(res,'详情')
  212. if(res.status == 200){
  213. this.baseData = res.data
  214. }
  215. })
  216. },
  217. // 产品明细列表
  218. getDetailList(){
  219. receivingDetail({pageNo:1,pageSize:1000,receivingBillSn:this.receivingBillSn}).then(res => {
  220. console.log(res,'明细列表')
  221. if(res.status == 200){
  222. this.detailList = res.data.list
  223. this.getCurRow()
  224. }
  225. })
  226. },
  227. // 入库
  228. async toOut(){
  229. const ret = await salesWriteStockOut({receivingBillSn: this.receivingBillSn})
  230. if(ret.status == 200){
  231. this.$store.state.vuex_isRefash = true
  232. uni.navigateBack()
  233. }
  234. }
  235. },
  236. }
  237. </script>
  238. <style lang="scss">
  239. .p-content{
  240. .p-head{
  241. font-size: 32upx;
  242. color: $uni-text-color;
  243. >view{
  244. display: flex;
  245. align-items: center;
  246. padding: 10upx 20upx;
  247. border-bottom: 1px solid #eee;
  248. justify-content: space-between;
  249. > view{
  250. display: flex;
  251. padding: 0 10upx;
  252. align-items: center;
  253. }
  254. }
  255. .uni-input{
  256. border: 1px solid #eee;
  257. width: 150upx;
  258. text-align: center;
  259. padding: 8upx;
  260. }
  261. }
  262. .p-body{
  263. overflow: auto;
  264. flex-grow: 1;
  265. height: 50%;
  266. }
  267. .p-footer{
  268. padding:30upx;
  269. display: flex;
  270. > button{
  271. width: 40%;
  272. }
  273. }
  274. }
  275. </style>