confirm.vue 6.7 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141142143144145146147148149150151152153154155156157158159160161162163164165166167168169170171172173174175176177178179180181182183184185186187188189190191192193194195196197198199200201202203204205206207208209210211212213214215216217218219220221222223224225226227228229230231232233234235236237238
  1. <template>
  2. <view class="replenishment-confirm-wrap">
  3. <scroll-view scroll-y class="replenishment-confirm-cont">
  4. <view class="replenishment-confirm-main" v-for="(item,index) in listdata" :key="item.id">
  5. <u-image class="item-pic" :src="item.product&&item.product.productMsg?item.product.productMsg:`../../static/${theme}/def_img@2x.png`" width="64px" height="64px"></u-image>
  6. <view class="item-con">
  7. <view class="item-name">{{item.product&&item.product.name?item.product.name:'--'}}</view>
  8. <view class="item-code">{{item.product&&item.product.code?item.product.code:'--'}}</view>
  9. <view class="item-num">
  10. <view class="num-t">x {{item.qty||item.qty==0?item.qty:'--'}} {{item.product&&item.product.unit?item.product.unit:'--'}}</view>
  11. <view class="num-v">
  12. <u-number-box color="#000" bg-color="#fff" v-model="item.confirmQty" @change="handlerChange" :min="0" :max="999999"></u-number-box>
  13. </view>
  14. </view>
  15. </view>
  16. </view>
  17. <u-empty :src="`/static/${$config('themePath')}/def_no_data@3x.png`" icon-size="240" :text="noDataText" img-width="120" v-if="listdata.length==0 && status!='loading'" mode="list"></u-empty>
  18. </scroll-view>
  19. <view class="replenishment-confirm-footer" v-if="listdata.length>0">
  20. <u-button @click="confirmModal=true" :loading="loading" type="success" :custom-style="customStyle" hover-class="none" shape="circle">确定补货({{confirmQty}}/{{totalQty}})</u-button>
  21. </view>
  22. <!-- 确认弹框 -->
  23. <common-modal :openModal="confirmModal" content="确认对该数字货架进行补货吗?" confirmText="确认补货" @confirm="modalConfirm" @close="confirmModal=false" />
  24. <!-- 库存不足 弹框 -->
  25. <stock-modal :openModal="stockModal" :list="stockList" :params="paramsData" @confirm="modalStock" @close="stockModal=false" />
  26. </view>
  27. </template>
  28. <script>
  29. import commonModal from '@/pages/common/commonModal.vue'
  30. import stockModal from './stockModal.vue'
  31. import { shelfReplenishDetailList, shelfReplenishDetailStock, shelfReplenishConfirm } from '@/api/shelfReplenish'
  32. export default {
  33. components: { commonModal, stockModal },
  34. data() {
  35. return {
  36. loading: false,
  37. listdata: [],
  38. status: 'loadmore',
  39. noDataText: '暂无数据',
  40. theme: '',
  41. customStyle: {
  42. borderRadius:'100rpx',
  43. fontSize:'30rpx',
  44. background: this.$config('primaryColor')
  45. },
  46. confirmQty: 0, // 实发数量之和
  47. totalQty: 0, // 应发数量之和
  48. replenishBillSn: '',
  49. confirmModal: false,
  50. stockModal: false,
  51. stockList: [],
  52. paramsData: null
  53. }
  54. },
  55. onReady() {
  56. uni.setNavigationBarColor({
  57. frontColor: '#ffffff',
  58. backgroundColor: this.$config('primaryColor')
  59. })
  60. },
  61. onLoad(options){
  62. this.theme = getApp({ allowDefault: true }).globalData.theme
  63. this.replenishBillSn = options.sn
  64. this.getRow()
  65. },
  66. methods:{
  67. // 查询列表
  68. getRow () {
  69. const _this = this
  70. shelfReplenishDetailList({ replenishBillSn: this.replenishBillSn }).then(res => {
  71. if (res.status == 200) {
  72. _this.totalQty = 0
  73. _this.confirmQty = 0
  74. res.data.map(item =>{
  75. item.confirmQty = item.qty || 0
  76. if(item.qty && Number(item.qty)){
  77. _this.totalQty += Number(item.qty)
  78. }
  79. if(item.confirmQty && Number(item.confirmQty)){
  80. _this.confirmQty += Number(item.confirmQty)
  81. }
  82. })
  83. this.listdata = res.data || []
  84. } else {
  85. this.listdata = []
  86. }
  87. })
  88. },
  89. handlerChange(value, index){
  90. const _this = this
  91. this.confirmQty = 0
  92. this.listdata.map(item => {
  93. if(item.confirmQty && Number(item.confirmQty)){
  94. _this.confirmQty += Number(item.confirmQty)
  95. }
  96. })
  97. },
  98. // 确认补货 confirm
  99. modalConfirm(){
  100. const arr = []
  101. this.listdata.map((item, index) => {
  102. if (item.confirmQty || item.confirmQty == 0) {
  103. arr.push({
  104. productSn: item.productSn,
  105. confirmQty: item.confirmQty,
  106. replenishBillDetailSn: item.replenishBillDetailSn,
  107. id: item.id
  108. })
  109. }
  110. })
  111. const params = {
  112. shelfSn: this.listdata[0].shelfSn,
  113. replenishBillSn: this.replenishBillSn,
  114. replenishBillNo: this.listdata[0].replenishBillNo,
  115. detailList: arr
  116. }
  117. // this.loading = true
  118. // 校验产品库存是否足够
  119. // shelfReplenishDetailStock(params).then(res => {
  120. // if (res.status == 200) {
  121. // if (res.data && res.data.length > 0) {
  122. // this.stockList = res.data || []
  123. // this.paramsData = params
  124. // this.confirmModal = false
  125. // this.stockModal = true
  126. // this.loading = false
  127. // } else {
  128. // this.confirmModal = false
  129. // this.confirmFun(params)
  130. // }
  131. // }
  132. // })
  133. this.confirmModal = false
  134. this.confirmFun(params)
  135. },
  136. // 提交确认
  137. confirmFun (params) {
  138. this.loading = true
  139. shelfReplenishConfirm(params).then(res => {
  140. this.loading = false
  141. if (res.status == 200) {
  142. this.toashMsg(res.message)
  143. uni.$emit('refreshBL')
  144. uni.$emit("refreshBhList",'WAIT_OUT_STOCK')
  145. uni.navigateBack()
  146. }else{
  147. this.toashMsg(res.message)
  148. }
  149. })
  150. },
  151. // 库存不足 confirm
  152. modalStock(params){
  153. this.stockModal = false
  154. this.loading = true
  155. this.confirmFun(params)
  156. }
  157. }
  158. }
  159. </script>
  160. <style lang="scss">
  161. page {
  162. height: 100vh;
  163. }
  164. .replenishment-confirm-wrap{
  165. background-color: #fff;
  166. position: relative;
  167. width: 100%;
  168. height: 100%;
  169. overflow: hidden;
  170. padding-bottom: 136upx;
  171. .replenishment-confirm-cont{
  172. width: 100%;
  173. height: 100%;
  174. overflow: auto;
  175. .replenishment-confirm-main{
  176. display: flex;
  177. justify-content: space-between;
  178. margin: 0 32upx;
  179. padding: 30upx 0;
  180. border-bottom: 1px solid #E5E5E5;
  181. .item-pic{
  182. flex-shrink: 0;
  183. margin-right: 20upx;
  184. }
  185. .item-con{
  186. flex-grow: 1;
  187. .item-name{
  188. color: #191919;
  189. font-size: 30upx;
  190. font-weight: bold;
  191. }
  192. .item-code{
  193. color: #999999;
  194. font-size: 26upx;
  195. }
  196. .item-num{
  197. display: flex;
  198. justify-content: space-between;
  199. align-items: center;
  200. .num-t{
  201. color: #707070;
  202. font-size: 26upx;
  203. }
  204. .num-v{
  205. border: 2rpx solid #eee;
  206. border-radius: 50rpx;
  207. padding: 0 6rpx;
  208. }
  209. ::v-deep .u-icon-disabled{
  210. background: #fff!important;
  211. }
  212. ::v-deep .u-number-input{
  213. margin: 0 0;
  214. border: 2rpx solid #eee;
  215. border-top: 0;
  216. border-bottom: 0;
  217. }
  218. ::v-deep .u-icon-plus, ::v-deep .u-icon-minus{
  219. border-radius: 50rpx;
  220. }
  221. }
  222. }
  223. }
  224. }
  225. .replenishment-confirm-footer{
  226. padding: 26upx 32upx 30upx;
  227. background-color: #fff;
  228. position: fixed;
  229. left: 0;
  230. bottom: 0;
  231. width: 100%;
  232. box-shadow: 3px 1px 7px #eee;
  233. }
  234. }
  235. </style>