index.vue 10 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141142143144145146147148149150151152153154155156157158159160161162163164165166167168169170171172173174175176177178179180181182183184185186187188189190191192193194195196197198199200201202203204205206207208209210211212213214215216217218219220221222223224225226227228229230231232233234235236237238239240241242243244245246247248249250251252253254255256257258259260261262263264265266267268269270271272273274275276277278279280281282283284285286287288289290291292293294295296297298299300301302303304305306307308309310311312313314315316317318319320321322323324325326327328329330331332333334335336337338339340341342343344345346347348349350351352353354355356357358
  1. <template>
  2. <view class="p-content">
  3. <view class="p-head">
  4. <view v-if="baseData">
  5. <view>
  6. <text>盘点单号:</text>
  7. <text style="color: crimson;">{{baseData.checkWarehouseNo}}</text>
  8. </view>
  9. <view>
  10. <button size="mini" :disabled="loading" type="warn" @click="submitIn"> 提交 <text class="iconfont icon-icon-test43"></text></button>
  11. </view>
  12. </view>
  13. <view>
  14. <view>
  15. <text>产品条码:</text>
  16. <view style="flex-grow: 1;display: flex;align-items: center;">
  17. <input
  18. style="width: 150px;text-align: left;font-size: 32rpx;padding: 6rpx 0 6rpx 7rpx;"
  19. class="uni-input"
  20. placeholder="扫描或输入条码"
  21. border="surround"
  22. v-model="code">
  23. <button size="mini" @click="queryProduct" :style="{padding:'2px 10px',color:'#00aaff'}">查询</button>
  24. </view>
  25. </view>
  26. <view></view>
  27. </view>
  28. <view>
  29. <view>
  30. <text>产品编码:</text>
  31. <view style="flex-grow: 1;display: flex;align-items: center;">
  32. <input
  33. style="width: 150px;text-align: left;font-size: 32rpx;padding: 6rpx 0 6rpx 7rpx;"
  34. class="uni-input"
  35. placeholder="请输入产品编码"
  36. border="surround"
  37. v-model="productCode">
  38. <button size="mini" @click="queryProduct" :style="{padding:'2px 10px',color:'#00aaff'}">查询</button>
  39. </view>
  40. </view>
  41. <view></view>
  42. </view>
  43. <view v-if="curProduct">
  44. <view>
  45. <text style="width:180rpx">产品名称:</text>
  46. <view>
  47. {{curProduct.productName}}
  48. </view>
  49. </view>
  50. </view>
  51. <view v-if="curProduct">
  52. <view>盘点数量:<input class="uni-input" v-model="curProduct.checkQty" :min="0" @blur="updateCurr" type="digit"/></view>
  53. <view v-if="curProduct.checkProfitLossQty>0||(curProduct.stockQty==curProduct.checkQty)">成本:{{curProduct.cost||'--'}}</view>
  54. <view v-else>成本:<input class="uni-input" v-model="curProduct.cost" :min="0" @blur="updateCost" type="digit"/></view>
  55. <view>库存:{{curProduct.stockQty}}</view>
  56. </view>
  57. <view v-if="countData" style="justify-content: flex-start;flex-wrap: wrap;">
  58. <view>共{{countData.totalCategory||0}}款</view>
  59. <view>总数量:{{countData.stockQty||0}}</view>
  60. <view>盈亏数量:<span :style="{ color: countData.totalCheckProfitLossQty>0?'red':countData.totalCheckProfitLossQty<0?'green':'' }">{{ (countData.totalCheckProfitLossQty || countData.totalCheckProfitLossQty==0) ? Math.abs(countData.totalCheckProfitLossQty) : '--' }}</span></view>
  61. </view>
  62. </view>
  63. <view class="p-body">
  64. <uni-table style="width: 100%;" border emptyText="暂无数据" :loading="loading" >
  65. <!-- 表头行 -->
  66. <uni-tr>
  67. <uni-td align="center">产品编码</uni-td>
  68. <uni-td align="center">库存</uni-td>
  69. <uni-td align="center">盘点数量</uni-td>
  70. <uni-td align="center">盈亏数量</uni-td>
  71. </uni-tr>
  72. <!-- 表格数据行 -->
  73. <uni-tr v-for="item in detailList" :key="item.id" :checkedRow="curProduct&&curProduct.qrCode == item.qrCode" @click="toDetail(item)">
  74. <uni-td width="40%" align="center">{{item.productCode}}</uni-td>
  75. <uni-td width="20%" align="center">{{item.stockQty}}</uni-td>
  76. <uni-td width="20%" align="center">{{item.checkQty}}</uni-td>
  77. <uni-td width="20%" align="center">
  78. <span :style="{ color: item.checkProfitLossQty>0?'red':item.checkProfitLossQty<0?'green':'' }">{{ (item.checkProfitLossQty || item.checkProfitLossQty==0) ? Math.abs(item.checkProfitLossQty) : '--' }}</span>
  79. </uni-td>
  80. </uni-tr>
  81. </uni-table>
  82. </view>
  83. <view class="p-footer">
  84. <button size="mini" type="warn" @click="addQty(false)"> <text class="iconfont icon-reduce-btn"> 减 </text></button>
  85. <button size="mini" type="primary" @click="addQty(true)"> <text class="iconfont icon-add-btn"> 加 </text></button>
  86. </view>
  87. <scanCode @onKeyDown="keyDown"></scanCode>
  88. </view>
  89. </template>
  90. <script>
  91. import scanCode from '@/libs/scan-code.vue';
  92. import { playAudio } from '@/libs/tools.js'
  93. import {
  94. checkWarehouseDetailStockList,
  95. checkWarehouseDetailBySn,
  96. checkWarehouseDetailList,
  97. checkWarehouseDetailCount,
  98. checkWarehouseDetailSave,
  99. checkWarehouseModifyCost,
  100. checkWarehouseDetailDel,
  101. checkWarehouseSubmit} from '@/config/api.js'
  102. export default {
  103. components: { scanCode },
  104. data() {
  105. return {
  106. checkWarehouseSn: '',
  107. checkWarehouseId: null,
  108. loading: false,
  109. detailList:[],
  110. countData: null,
  111. code:'',
  112. productCode: '',
  113. baseData: null,
  114. curProduct: null,
  115. };
  116. },
  117. onLoad(opts) {
  118. var _this = this
  119. this.checkWarehouseSn = opts.checkWarehouseSn
  120. this.checkWarehouseId = opts.id
  121. uni.$on('scancodedate', function(content) {
  122. console.log("扫描到的内容为:", content)
  123. _this.code = content||''
  124. _this.queryProduct()
  125. })
  126. this.getDetail()
  127. this.pageInit()
  128. },
  129. onShow() {
  130. this.pageInit()
  131. this.hideKeyborder()
  132. },
  133. onUnload() {
  134. uni.$off('scancodedate')
  135. },
  136. onNavigationBarButtonTap(e){
  137. if(e.index == 0){
  138. uni.navigateTo({
  139. url: "/pages/stockPan/list"
  140. })
  141. }
  142. },
  143. methods: {
  144. pageInit(){
  145. this.getTotal()
  146. this.getDetailList()
  147. },
  148. hideKeyborder(){
  149. uni.hideKeyboard()
  150. },
  151. // 物理按键
  152. keyDown(key,e){
  153. console.log(key,e)
  154. },
  155. // 修改数量
  156. updateCurr(){
  157. if(this.curProduct.checkQty>0){
  158. this.addDetailProduct(this.curProduct, true)
  159. }else{
  160. // 删除
  161. this.delDetailProduct(this.curProduct)
  162. }
  163. },
  164. // 修改成本
  165. updateCost(){
  166. checkWarehouseModifyCost({
  167. id: this.curProduct.id,
  168. checkWarehouseSn: this.checkWarehouseSn,
  169. cost: this.curProduct.cost
  170. }).then(res => {
  171. if(res.status == 200){
  172. uni.$u.toast(res.message)
  173. this.pageInit()
  174. }
  175. })
  176. },
  177. // 加减数量
  178. addQty(type){
  179. playAudio('info')
  180. const hasProduct = this.detailList.find(item => item.qrCode == this.code || item.productCode == this.productCode)
  181. if(hasProduct){
  182. hasProduct.checkQty = hasProduct.checkQty + (type ? 1 : -1)
  183. if(hasProduct.checkQty>0){
  184. this.addDetailProduct(hasProduct, true)
  185. }else{
  186. // 删除
  187. this.delDetailProduct(hasProduct)
  188. }
  189. }
  190. },
  191. // 删除
  192. delDetailProduct(item) {
  193. checkWarehouseDetailDel({ id: item.id, checkWarehouseSn: this.checkWarehouseSn }).then(res => {
  194. if (res.status == 200) {
  195. uni.$u.toast(res.message)
  196. this.pageInit()
  197. }
  198. })
  199. },
  200. // 查询产品
  201. queryProduct(){
  202. if(!this.code&&!this.productCode){
  203. uni.$u.toast("请输入条形码或编码!")
  204. playAudio('error')
  205. return
  206. }
  207. // 如果已添加产品,则累加数量
  208. const hasProduct = this.detailList.find(item => item.qrCode == this.code || item.productCode == this.productCode)
  209. console.log(hasProduct)
  210. if(!!hasProduct){
  211. this.addQty(true)
  212. return
  213. }
  214. const params = {
  215. checkWarehouseId: this.checkWarehouseId,
  216. qrCode: this.code,
  217. productCode: this.productCode,
  218. pageNo:1,
  219. pageSize:1 ,
  220. }
  221. console.log(params)
  222. checkWarehouseDetailStockList(params).then(res => {
  223. if(res.status == 200){
  224. const curProduct = res.data && res.data.list[0] || null
  225. console.log(curProduct,'curProduct')
  226. if(curProduct){
  227. // 添加产品
  228. this.addDetailProduct(curProduct, false)
  229. }else{
  230. uni.$u.toast("此商品不存在!")
  231. playAudio('error')
  232. }
  233. }
  234. })
  235. },
  236. // 添加明细
  237. addDetailProduct(row, isEdit){
  238. const params = isEdit ? row : {
  239. checkWarehouseSn: this.checkWarehouseSn,
  240. checkCost: row.putCost,
  241. cost: row.lastStockCost,
  242. productSn: row.productSn,
  243. productCode: row.productCode,
  244. productOrigCode: row.productOrigCode || undefined,
  245. productTypeSn1: row.productTypeSn1,
  246. productTypeSn2: row.productTypeSn2,
  247. productTypeSn3: row.productTypeSn3,
  248. brandSn: row.brandSn,
  249. stockQty: row.currentQty,
  250. lastStockTime: row.lastStockTime,
  251. checkProfitLossCost: row.lastStockCost,
  252. stockBatchNo: row.stockBatchNo || undefined,
  253. productProduceDate: row.productProduceDate || undefined,
  254. productExpiryDate: row.productExpiryDate || undefined,
  255. warehouseSn: row.warehouseSn || undefined,
  256. warehouseLocationSn: row.warehouseLocationSn || undefined
  257. };
  258. console.log(params)
  259. this.loading = true
  260. checkWarehouseDetailSave(params).then(res => {
  261. console.log(res,'添加')
  262. if (res.status == 200) {
  263. this.loading = false
  264. this.pageInit()
  265. } else {
  266. this.loading = false
  267. }
  268. })
  269. },
  270. // 详情
  271. getDetail(){
  272. checkWarehouseDetailBySn({sn: this.checkWarehouseSn}).then(res => {
  273. console.log(res,'详情')
  274. if(res.status == 200){
  275. this.baseData = res.data
  276. }
  277. })
  278. },
  279. // 已添加产品列表
  280. getDetailList(){
  281. checkWarehouseDetailList({pageNo:1,pageSize:1000,checkWarehouseSn:this.checkWarehouseSn}).then(res => {
  282. console.log(res,'已添加产品列表')
  283. if(res.status == 200){
  284. this.detailList = res.data.list
  285. const curProduct = this.detailList.find(item => item.qrCode == this.code || item.productCode == this.productCode)
  286. this.curProduct = curProduct || null
  287. }
  288. })
  289. },
  290. getTotal(){
  291. checkWarehouseDetailCount({checkWarehouseSn:this.checkWarehouseSn}).then(res => {
  292. console.log(res,'getTotal')
  293. this.countData = res.data
  294. })
  295. },
  296. // 商品详情
  297. toDetail(item) {
  298. this.$store.state.vuex_tempData = item
  299. uni.navigateTo({
  300. url:"/pages/stockPan/detail?state="+this.baseData.state
  301. })
  302. },
  303. // 提交盘点
  304. submitIn(){
  305. checkWarehouseSubmit({id: this.checkWarehouseId, auditFlag: true}).then(res => {
  306. if(res.status == 200){
  307. uni.$emit("refashList")
  308. uni.navigateBack()
  309. }
  310. })
  311. }
  312. },
  313. }
  314. </script>
  315. <style lang="scss">
  316. .p-content{
  317. button{
  318. line-height: 1.7;
  319. }
  320. .p-head{
  321. font-size: 32upx;
  322. color: $uni-text-color;
  323. >view{
  324. display: flex;
  325. align-items: center;
  326. padding: 15upx 20upx;
  327. border-bottom: 1px solid #eee;
  328. justify-content: space-between;
  329. > view{
  330. display: flex;
  331. padding: 0 10upx;
  332. align-items: center;
  333. }
  334. }
  335. .uni-input{
  336. border: 1px solid #eee;
  337. width: 150upx;
  338. text-align: center;
  339. }
  340. }
  341. .p-body{
  342. overflow: auto;
  343. flex-grow: 1;
  344. height: 50%;
  345. }
  346. .p-footer{
  347. padding:20upx 30upx;
  348. display: flex;
  349. > button{
  350. width: 30%;
  351. }
  352. }
  353. }
  354. </style>