<template> <view class="p-content"> <view class="p-head"> <view v-if="baseData"> <view> <text>盘点单号:</text> <text style="color: crimson;">{{baseData.checkWarehouseNo}}</text> </view> <view> <button size="mini" :disabled="loading" type="warn" @click="submitIn"> 提交 <text class="iconfont icon-icon-test43"></text></button> </view> </view> <view> <view> <text>产品条码:</text> <view style="flex-grow: 1;display: flex;align-items: center;"> <input style="width: 150px;text-align: left;font-size: 32rpx;padding: 6rpx 0 6rpx 7rpx;" class="uni-input" placeholder="扫描或输入条码" border="surround" v-model="code"> <button size="mini" @click="queryProduct" :style="{padding:'2px 10px',color:'#00aaff'}">查询</button> </view> </view> <view></view> </view> <view> <view> <text>产品编码:</text> <view style="flex-grow: 1;display: flex;align-items: center;"> <input style="width: 150px;text-align: left;font-size: 32rpx;padding: 6rpx 0 6rpx 7rpx;" class="uni-input" placeholder="请输入产品编码" border="surround" v-model="productCode"> <button size="mini" @click="queryProduct" :style="{padding:'2px 10px',color:'#00aaff'}">查询</button> </view> </view> <view></view> </view> <view v-if="curProduct"> <view> <text style="width:180rpx">产品名称:</text> <view> {{curProduct.productName}} </view> </view> </view> <view v-if="curProduct"> <view>盘点数量:<input class="uni-input" v-model="curProduct.checkQty" :min="0" @blur="updateCurr" type="digit"/></view> <view v-if="curProduct.checkProfitLossQty>0||(curProduct.stockQty==curProduct.checkQty)">成本:{{curProduct.cost||'--'}}</view> <view v-else>成本:<input class="uni-input" v-model="curProduct.cost" :min="0" @blur="updateCost" type="digit"/></view> <view>库存:{{curProduct.stockQty}}</view> </view> <view v-if="countData" style="justify-content: flex-start;flex-wrap: wrap;"> <view>共{{countData.totalCategory||0}}款</view> <view>总数量:{{countData.stockQty||0}}</view> <view>盈亏数量:<span :style="{ color: countData.totalCheckProfitLossQty>0?'red':countData.totalCheckProfitLossQty<0?'green':'' }">{{ (countData.totalCheckProfitLossQty || countData.totalCheckProfitLossQty==0) ? Math.abs(countData.totalCheckProfitLossQty) : '--' }}</span></view> </view> </view> <view class="p-body"> <uni-table style="width: 100%;" border emptyText="暂无数据" :loading="loading" > <!-- 表头行 --> <uni-tr> <uni-td align="center">产品编码</uni-td> <uni-td align="center">库存</uni-td> <uni-td align="center">盘点数量</uni-td> <uni-td align="center">盈亏数量</uni-td> </uni-tr> <!-- 表格数据行 --> <uni-tr v-for="item in detailList" :key="item.id" :checkedRow="curProduct&&curProduct.qrCode == item.qrCode" @click="toDetail(item)"> <uni-td width="40%" align="center">{{item.productCode}}</uni-td> <uni-td width="20%" align="center">{{item.stockQty}}</uni-td> <uni-td width="20%" align="center">{{item.checkQty}}</uni-td> <uni-td width="20%" align="center"> <span :style="{ color: item.checkProfitLossQty>0?'red':item.checkProfitLossQty<0?'green':'' }">{{ (item.checkProfitLossQty || item.checkProfitLossQty==0) ? Math.abs(item.checkProfitLossQty) : '--' }}</span> </uni-td> </uni-tr> </uni-table> </view> <view class="p-footer"> <button size="mini" type="warn" @click="addQty(false)"> <text class="iconfont icon-reduce-btn"> 减 </text></button> <button size="mini" type="primary" @click="addQty(true)"> <text class="iconfont icon-add-btn"> 加 </text></button> </view> <scanCode @onKeyDown="keyDown"></scanCode> </view> </template> <script> import scanCode from '@/libs/scan-code.vue'; import { playAudio } from '@/libs/tools.js' import { checkWarehouseDetailStockList, checkWarehouseDetailBySn, checkWarehouseDetailList, checkWarehouseDetailCount, checkWarehouseDetailSave, checkWarehouseModifyCost, checkWarehouseDetailDel, checkWarehouseSubmit} from '@/config/api.js' export default { components: { scanCode }, data() { return { checkWarehouseSn: '', checkWarehouseId: null, loading: false, detailList:[], countData: null, code:'', productCode: '', baseData: null, curProduct: null, }; }, onLoad(opts) { var _this = this this.checkWarehouseSn = opts.checkWarehouseSn this.checkWarehouseId = opts.id uni.$on('scancodedate', function(content) { console.log("扫描到的内容为:", content) _this.code = content||'' _this.queryProduct() }) this.getDetail() this.pageInit() }, onShow() { this.pageInit() this.hideKeyborder() }, onUnload() { uni.$off('scancodedate') }, onNavigationBarButtonTap(e){ if(e.index == 0){ uni.navigateTo({ url: "/pages/stockPan/list" }) } }, methods: { pageInit(){ this.getTotal() this.getDetailList() }, hideKeyborder(){ uni.hideKeyboard() }, // 物理按键 keyDown(key,e){ console.log(key,e) }, // 修改数量 updateCurr(){ if(this.curProduct.checkQty>0){ this.addDetailProduct(this.curProduct, true) }else{ // 删除 this.delDetailProduct(this.curProduct) } }, // 修改成本 updateCost(){ checkWarehouseModifyCost({ id: this.curProduct.id, checkWarehouseSn: this.checkWarehouseSn, cost: this.curProduct.cost }).then(res => { if(res.status == 200){ uni.$u.toast(res.message) this.pageInit() } }) }, // 加减数量 addQty(type){ playAudio('info') const hasProduct = this.detailList.find(item => item.qrCode == this.code || item.productCode == this.productCode) if(hasProduct){ hasProduct.checkQty = hasProduct.checkQty + (type ? 1 : -1) if(hasProduct.checkQty>0){ this.addDetailProduct(hasProduct, true) }else{ // 删除 this.delDetailProduct(hasProduct) } } }, // 删除 delDetailProduct(item) { checkWarehouseDetailDel({ id: item.id, checkWarehouseSn: this.checkWarehouseSn }).then(res => { if (res.status == 200) { uni.$u.toast(res.message) this.pageInit() } }) }, // 查询产品 queryProduct(){ if(!this.code&&!this.productCode){ uni.$u.toast("请输入条形码或编码!") playAudio('error') return } // 如果已添加产品,则累加数量 const hasProduct = this.detailList.find(item => item.qrCode == this.code || item.productCode == this.productCode) console.log(hasProduct) if(!!hasProduct){ this.addQty(true) return } const params = { checkWarehouseId: this.checkWarehouseId, qrCode: this.code, productCode: this.productCode, pageNo:1, pageSize:1 , } console.log(params) checkWarehouseDetailStockList(params).then(res => { if(res.status == 200){ const curProduct = res.data && res.data.list[0] || null console.log(curProduct,'curProduct') if(curProduct){ // 添加产品 this.addDetailProduct(curProduct, false) }else{ uni.$u.toast("此商品不存在!") playAudio('error') } } }) }, // 添加明细 addDetailProduct(row, isEdit){ const params = isEdit ? row : { checkWarehouseSn: this.checkWarehouseSn, checkCost: row.putCost, cost: row.lastStockCost, productSn: row.productSn, productCode: row.productCode, productOrigCode: row.productOrigCode || undefined, productTypeSn1: row.productTypeSn1, productTypeSn2: row.productTypeSn2, productTypeSn3: row.productTypeSn3, brandSn: row.brandSn, stockQty: row.currentQty, lastStockTime: row.lastStockTime, checkProfitLossCost: row.lastStockCost, stockBatchNo: row.stockBatchNo || undefined, productProduceDate: row.productProduceDate || undefined, productExpiryDate: row.productExpiryDate || undefined, warehouseSn: row.warehouseSn || undefined, warehouseLocationSn: row.warehouseLocationSn || undefined }; console.log(params) this.loading = true checkWarehouseDetailSave(params).then(res => { console.log(res,'添加') if (res.status == 200) { this.loading = false this.pageInit() } else { this.loading = false } }) }, // 详情 getDetail(){ checkWarehouseDetailBySn({sn: this.checkWarehouseSn}).then(res => { console.log(res,'详情') if(res.status == 200){ this.baseData = res.data } }) }, // 已添加产品列表 getDetailList(){ checkWarehouseDetailList({pageNo:1,pageSize:1000,checkWarehouseSn:this.checkWarehouseSn}).then(res => { console.log(res,'已添加产品列表') if(res.status == 200){ this.detailList = res.data.list const curProduct = this.detailList.find(item => item.qrCode == this.code || item.productCode == this.productCode) this.curProduct = curProduct || null } }) }, getTotal(){ checkWarehouseDetailCount({checkWarehouseSn:this.checkWarehouseSn}).then(res => { console.log(res,'getTotal') this.countData = res.data }) }, // 商品详情 toDetail(item) { this.$store.state.vuex_tempData = item uni.navigateTo({ url:"/pages/stockPan/detail?state="+this.baseData.state }) }, // 提交盘点 submitIn(){ checkWarehouseSubmit({id: this.checkWarehouseId, auditFlag: true}).then(res => { if(res.status == 200){ uni.$emit("refashList") uni.navigateBack() } }) } }, } </script> <style lang="scss"> .p-content{ button{ line-height: 1.7; } .p-head{ font-size: 32upx; color: $uni-text-color; >view{ display: flex; align-items: center; padding: 15upx 20upx; border-bottom: 1px solid #eee; justify-content: space-between; > view{ display: flex; padding: 0 10upx; align-items: center; } } .uni-input{ border: 1px solid #eee; width: 150upx; text-align: center; } } .p-body{ overflow: auto; flex-grow: 1; height: 50%; } .p-footer{ padding:20upx 30upx; display: flex; > button{ width: 30%; } } } </style>