index.vue 11 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141142143144145146147148149150151152153154155156157158159160161162163164165166167168169170171172173174175176177178179180181182183184185186187188189190191192193194195196197198199200201202203204205206207208209210211212213214215216217218219220221222223224225226227228229230231232233234235236237238239240241242243244245246247248249250251252253254255256257258259260261262263264265266267268269270271272273274275276277278279280281282283284285286287288289290291292293294295296297298299300301302303304305306307308309310311312313314315316317318319320321322323324325326327328329330331332333334335336337338339340341342343344345346347348349350351352353354355356357358359360361362363
  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. <view>
  15. <text>发货单号:</text>
  16. <text style="color: crimson;">{{baseData[0].sendBillNo}}</text>
  17. </view>
  18. </view>
  19. <view>
  20. <view>
  21. <text>条码:</text>
  22. <view>
  23. <input
  24. @blur="addQty(true)"
  25. style="width: 100%;text-align: left;"
  26. class="uni-input"
  27. placeholder="扫描或输入条码"
  28. border="surround"
  29. v-model="code">
  30. </view>
  31. </view>
  32. </view>
  33. <view style="justify-content: flex-start;flex-wrap: wrap;" v-for="(item,bindex) in baseData" :key="item.id">
  34. <view>总款数:{{ item.totalPutCategory }}</view>
  35. <view>发货数量: {{ item.totalPutQty }}</view>
  36. <view>发货金额: {{ item.totalPutAmount?toThousands(item.totalPutAmount,2):'0.00' }}</view>
  37. <view>入库数量: {{ item && (item.totalRealPutQty || item.totalRealPutQty==0) ? item.totalRealPutQty : '--' }}</view>
  38. <view>入库金额: {{ item && (item.totalRealPutAmount || item.totalRealPutAmount==0) ? toThousands(item.totalRealPutAmount, 2) : '--' }}</view>
  39. </view>
  40. </view>
  41. <view class="p-body">
  42. <uni-table style="width: 100%;" border emptyText="暂无数据" :loading="loading" >
  43. <!-- 表头行 -->
  44. <uni-tr>
  45. <uni-td align="center">产品编码</uni-td>
  46. <uni-td align="center">仓库仓位</uni-td>
  47. <uni-td align="center">入库/发货数量</uni-td>
  48. </uni-tr>
  49. <!-- 表格数据行 -->
  50. <uni-tr
  51. v-for="item in detailList"
  52. :key="item.id"
  53. :checkedRow="curProduct&&curProduct.dealerProductEntity&&curProduct.dealerProductEntity.code == item.dealerProductEntity.code"
  54. @click="editRow(item)"
  55. >
  56. <uni-td width="30%" align="center">
  57. <view>{{item.dealerProductEntity&&item.dealerProductEntity.code||'--'}}</view>
  58. </uni-td>
  59. <uni-td width="30%" align="center">
  60. <view>
  61. <view>{{item.warehouseEntity&&item.warehouseEntity.name||defWarehouseName[0]}}/</view>
  62. <view>{{item.warehouseLocationEntity&&item.warehouseLocationEntity.name||defWarehouseName[1]}}</view>
  63. </view>
  64. </uni-td>
  65. <uni-td width="40%" align="center"><text style="color: red;">{{item.realPutQty}}</text>/{{item.putQty}}</uni-td>
  66. </uni-tr>
  67. </uni-table>
  68. </view>
  69. <view class="p-footer">
  70. <button size="mini" type="warn" @click="addQty(false)"> <text class="iconfont icon-reduce-btn"> 减 </text></button>
  71. <button size="mini" type="primary" @click="addQty(true)"> <text class="iconfont icon-add-btn"> 加 </text></button>
  72. </view>
  73. <scanCode @onKeyDown="keyDown"></scanCode>
  74. <!-- 选择仓库 -->
  75. <chooseWarehouse ref="chooseWarehouse" :openPick="showPick" :value="warehouseVal" @close="showPick=false" @change="confirmWarehouse"></chooseWarehouse>
  76. <!-- 左键扫描,修改包装数 -->
  77. <uni-popup ref="popup" :mask-click="false" type="dialog">
  78. <view style="background-color: #fff;padding: 30rpx 50rpx;border-radius: 30rpx;width: 75%;margin: 0 auto;">
  79. <view v-if="curProduct">
  80. <view style="padding: 30rpx 0;">
  81. 产品编码:{{curProduct.dealerProductEntity.code}}
  82. </view>
  83. <view style="display: flex;align-items: center;">
  84. 数量:
  85. <u--input
  86. placeholder="请输入数量"
  87. border="surround"
  88. v-model="curProduct.packQty"
  89. :min="0"
  90. type="digit"
  91. ></u--input>
  92. {{curProduct.dealerProductEntity.unit}}
  93. {{curProduct.dealerProductEntity.packQtyUnit?("/"+curProduct.dealerProductEntity.packQtyUnit):''}}
  94. </view>
  95. </view>
  96. <view style="display: flex;padding: 60rpx 15rpx 10rpx;justify-content: space-between;">
  97. <button size="mini" @click="closePop">取消</button>
  98. <button size="mini" type="primary" @click="okPop">确定</button>
  99. </view>
  100. </view>
  101. </uni-popup>
  102. <u-modal :show="showModal" :title="msg.title" :confirmText="msg.confirmText" showCancelButton :content='msg.content' @cancel="showModal=false" @confirm="confirmModal"></u-modal>
  103. </view>
  104. </template>
  105. <script>
  106. import scanCode from '@/libs/scan-code.vue';
  107. import { purchaseWriteStockIn, receivingQuery, receivingDetail, purchaseUpdateWarehouse, updateRealPutQty, receivingStockInVerify } from '@/config/api.js'
  108. import { playAudio, toThousands } from '@/libs/tools.js'
  109. import clipboard from "@/js_sdk/dc-clipboard/clipboard.js"
  110. import chooseWarehouse from './chooseWarehouse.vue'
  111. export default {
  112. components: { scanCode, chooseWarehouse },
  113. data() {
  114. return {
  115. loading: false,
  116. showModal: false,
  117. msg:{title:'提示',content:''},
  118. showPick: false,
  119. baseData: null,
  120. detailList:[],
  121. code:'',
  122. receivingBillSn: null,
  123. salesId: null,
  124. curProduct: null,
  125. toThousands,
  126. defWarehouse: [],
  127. defWarehouseName:[],
  128. keyName: '',
  129. warehouseVal: []
  130. };
  131. },
  132. onLoad(opts) {
  133. var _this = this
  134. this.receivingBillSn = opts.receivingBillSn
  135. this.salesId = opts.id
  136. // 默认仓库仓位
  137. this.defWarehouse = this.$store.state.vuex_tempData
  138. // 调用数据
  139. this.getDetail()
  140. this.getDetailList()
  141. uni.$on('scancodedate', function(content) {
  142. console.log("扫描到的内容为:", content, _this.keyName)
  143. _this.code = content||''
  144. if(_this.keyName == 'rightKey'){
  145. _this.addQty(true)
  146. }
  147. if(_this.keyName == 'leftKey'){
  148. _this.openPack()
  149. }
  150. })
  151. },
  152. onShow() {
  153. this.hideKeyborder()
  154. const list = this.$store.state.vuex_warehouseList
  155. const an =list.find(item => item.warehouseSn==this.defWarehouse[0])
  156. const cn = an&&an.warehouseLocationList&&an.warehouseLocationList.find(item => item.warehouseLocationSn == this.defWarehouse[1])
  157. this.defWarehouseName = [an&&an.name,cn&&cn.name]
  158. console.log(this.defWarehouseName)
  159. },
  160. onUnload() {
  161. uni.$off('scancodedate')
  162. },
  163. methods: {
  164. hideKeyborder(){
  165. uni.hideKeyboard()
  166. },
  167. // 复制
  168. copyText(text){
  169. clipboard.setText(text);
  170. uni.showToast({
  171. icon: 'none',
  172. title: '编码已复制成功'
  173. })
  174. },
  175. closePop(){
  176. this.$refs.popup.close()
  177. },
  178. okPop(){
  179. if(this.curProduct.packQty){
  180. this.changePutQty(this.curProduct,Number(this.curProduct.realPutQty) + Number(this.curProduct.packQty))
  181. this.closePop()
  182. }else{
  183. uni.$u.toast("请输入数量!")
  184. playAudio('warn')
  185. }
  186. },
  187. keyDown(e){
  188. this.keyName = e
  189. },
  190. // 确定选择仓库
  191. confirmWarehouse(data){
  192. console.log(data)
  193. this.updateWarehouse({id:this.curProduct.id,warehouseSn:data[0],warehouseLocationSn:data[1]})
  194. },
  195. // 修改仓库
  196. editRow(item){
  197. this.warehouseVal = item.warehouseSn ? [item.warehouseSn,item.warehouseLocationSn] : this.defWarehouse
  198. this.showPick = true
  199. this.curProduct = item
  200. },
  201. // 获取当前操作行
  202. getCurRow(){
  203. const curProduct = this.detailList.find(item => item.dealerProductEntity&&item.dealerProductEntity.qrCode == this.code)
  204. this.curProduct = curProduct || null
  205. if(curProduct){
  206. this.curProduct.packQty = this.curProduct.dealerProductEntity&&this.curProduct.dealerProductEntity.packQty || 0
  207. }
  208. return curProduct
  209. },
  210. // 修改仓库
  211. updateWarehouse (row) {
  212. console.log(row)
  213. this.loading = true
  214. purchaseUpdateWarehouse({
  215. id: row.id,
  216. warehouseSn: row.warehouseSn,
  217. warehouseLocationSn: row.warehouseLocationSn
  218. }).then(res => {
  219. if (res.status == 200) {
  220. this.showPick = false
  221. this.getDetailList()
  222. }
  223. this.loading = false
  224. })
  225. },
  226. // 修改入库数量
  227. changePutQty(record, realPutQty){
  228. if(realPutQty){
  229. this.loading = true
  230. updateRealPutQty({id:record.id,realPutQty:realPutQty}).then(res => {
  231. if(res.status == 200){
  232. uni.$u.toast(res.message)
  233. this.getDetail()
  234. this.getDetailList()
  235. }
  236. this.loading = false
  237. })
  238. }else{
  239. uni.$u.toast("入库数量不能为0")
  240. playAudio('warn')
  241. }
  242. },
  243. //拣货
  244. addQty(flag){
  245. if(this.code==''){
  246. uni.$u.toast("请扫描或输入条形码")
  247. playAudio('warn')
  248. return
  249. }
  250. const row = this.getCurRow()
  251. if(row){
  252. if(row.warehouseLocationSn){
  253. this.changePutQty(row,row.realPutQty + (flag?1:-1))
  254. }else{
  255. uni.$u.toast("此商品没有仓库仓位")
  256. playAudio('warn')
  257. }
  258. }else{
  259. uni.$u.toast("此商品不存在")
  260. playAudio('error')
  261. }
  262. },
  263. // 详情
  264. getDetail(){
  265. receivingQuery({receivingBillSn: this.receivingBillSn}).then(res => {
  266. console.log(res,'详情')
  267. if(res.status == 200){
  268. this.baseData = res.data
  269. }
  270. })
  271. },
  272. // 产品明细列表
  273. getDetailList(){
  274. receivingDetail({pageNo:1,pageSize:1000,receivingBillSn:this.receivingBillSn}).then(res => {
  275. console.log(res,'明细列表')
  276. if(res.status == 200){
  277. this.detailList = res.data.list
  278. this.getCurRow()
  279. }
  280. })
  281. },
  282. // 打开包装数弹框
  283. openPack(){
  284. const curProduct = this.getCurRow()
  285. if(curProduct){
  286. this.$refs.popup.open()
  287. }else{
  288. uni.$u.toast("此商品不存在")
  289. playAudio('error')
  290. }
  291. },
  292. // 入库
  293. async toOut(){
  294. const isOk = await receivingStockInVerify({receivingBillSn:this.receivingBillSn})
  295. if(!isOk.data){
  296. this.submitForm()
  297. }else{
  298. this.showModal = true
  299. this.msg = {
  300. title: '提示',
  301. content: '有产品入库数量与发货数量不一致,确定入库?',
  302. confirmText: '确定'
  303. }
  304. }
  305. },
  306. confirmModal(e){
  307. this.submitForm()
  308. },
  309. async submitForm(){
  310. const a = this.defWarehouse
  311. const ret = await purchaseWriteStockIn({id: this.baseData[0].id,warehouseSn:a[0], warehouseLocationSn:a[1]})
  312. if(ret.status == 200){
  313. this.$store.state.vuex_isRefash = true
  314. uni.navigateBack()
  315. }
  316. this.showModal = false
  317. }
  318. },
  319. }
  320. </script>
  321. <style lang="scss">
  322. .p-content{
  323. .p-head{
  324. font-size: 32upx;
  325. color: $uni-text-color;
  326. >view{
  327. display: flex;
  328. align-items: center;
  329. padding: 10upx 20upx;
  330. border-bottom: 1px solid #eee;
  331. justify-content: space-between;
  332. > view{
  333. display: flex;
  334. padding: 0 10upx;
  335. align-items: center;
  336. }
  337. }
  338. .uni-input{
  339. border: 1px solid #eee;
  340. width: 150upx;
  341. text-align: center;
  342. padding: 8upx;
  343. }
  344. }
  345. .p-body{
  346. overflow: auto;
  347. flex-grow: 1;
  348. height: 50%;
  349. }
  350. .p-footer{
  351. padding:30upx;
  352. display: flex;
  353. > button{
  354. width: 40%;
  355. }
  356. }
  357. }
  358. </style>