confirm.vue 5.0 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141142143144145146147148149150151152153154155156157158159160161162163164165166167168169170171172173174175176177178179180181182183184
  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. <u-number-box class="num-v" v-model="item.confirmQty" @change="handlerChange" :min="0" :max="item.qty" color="#000"></u-number-box>
  12. </view>
  13. </view>
  14. </view>
  15. </scroll-view>
  16. <view class="replenishment-confirm-footer">
  17. <u-button @click="confirmModal=true" type="success" :custom-style="customStyle" hover-class="none" shape="circle">确定补货({{confirmQty}}/{{totalQty}})</u-button>
  18. </view>
  19. <common-modal :openModal="confirmModal" content="确认对该数字货架进行补货吗?" confirmText="确认补货" @confirm="modalConfirm" @close="confirmModal=false" />
  20. </view>
  21. </template>
  22. <script>
  23. import commonModal from '@/pages/common/commonModal.vue'
  24. import { shelfReplenishDetailList, shelfReplenishDetailStock, shelfReplenishConfirm } from '@/api/shelfReplenish'
  25. export default {
  26. components: { commonModal },
  27. data() {
  28. return {
  29. listdata: [],
  30. theme: '',
  31. customStyle: {
  32. borderRadius:'100rpx',
  33. fontSize:'30rpx',
  34. background: '#0485F6'
  35. },
  36. confirmQty: 0, // 实发数量之合
  37. totalQty: 0, // 应发数量之合
  38. confirmModal: false,
  39. replenishBillSn: ''
  40. }
  41. },
  42. onLoad(options){
  43. this.theme = getApp().globalData.theme
  44. this.replenishBillSn = options.sn
  45. this.getRow()
  46. },
  47. methods:{
  48. // 查询列表
  49. getRow () {
  50. const _this = this
  51. shelfReplenishDetailList({ replenishBillSn: this.replenishBillSn }).then(res => {
  52. if (res.status == 200) {
  53. _this.totalQty = 0
  54. _this.confirmQty = 0
  55. res.data.map(item =>{
  56. item.confirmQty = item.qty || 0
  57. if(item.qty && Number(item.qty)){
  58. _this.totalQty += Number(item.qty)
  59. }
  60. if(item.confirmQty && Number(item.confirmQty)){
  61. _this.confirmQty += Number(item.confirmQty)
  62. }
  63. })
  64. this.listdata = res.data || []
  65. } else {
  66. this.listdata = []
  67. }
  68. })
  69. },
  70. handlerChange(value, index){
  71. const _this = this
  72. this.confirmQty = 0
  73. this.listdata.map(item => {
  74. if(item.confirmQty && Number(item.confirmQty)){
  75. _this.confirmQty += Number(item.confirmQty)
  76. }
  77. })
  78. },
  79. // 确认补货 confirm
  80. modalConfirm(){
  81. const arr = []
  82. this.listdata.map((item, index) => {
  83. if (item.confirmQty || item.confirmQty == 0) {
  84. arr.push({
  85. productSn: item.productSn,
  86. confirmQty: item.confirmQty
  87. })
  88. }
  89. })
  90. const params = {
  91. replenishBillSn: this.replenishBillSn,
  92. detailList: arr
  93. }
  94. // 校验产品库存是否足够
  95. shelfReplenishDetailStock(params).then(res => {
  96. if (res.status == 200) {
  97. // if (res.data && res.data.length > 0) {
  98. // this.stockList = res.data
  99. // this.validateType = 'confirm'
  100. // this.paramsData = params
  101. // this.openStockModal = true
  102. // } else {
  103. this.confirmFun(params)
  104. // }
  105. }
  106. })
  107. },
  108. // 提交确认
  109. confirmFun (params) {
  110. shelfReplenishConfirm(params).then(res => {
  111. if (res.status == 200) {
  112. uni.showToast({icon: 'none', title: '确认补货成功'})
  113. uni.$emit('refreshBL')
  114. uni.navigateTo({ url: "/pages/replenishmentManage/replenishmentList" })
  115. }
  116. })
  117. },
  118. }
  119. }
  120. </script>
  121. <style lang="scss" scoped>
  122. page {
  123. height: 100%;
  124. background-color: #fff;
  125. }
  126. .replenishment-confirm-wrap{
  127. position: relative;
  128. width: 100%;
  129. height: 100%;
  130. overflow: hidden;
  131. padding-bottom: 136upx;
  132. .replenishment-confirm-cont{
  133. width: 100%;
  134. height: 100%;
  135. overflow: auto;
  136. .replenishment-confirm-main{
  137. display: flex;
  138. justify-content: space-between;
  139. margin: 0 32upx;
  140. padding: 30upx 0;
  141. border-bottom: 1px solid #E5E5E5;
  142. .item-pic{
  143. flex-shrink: 0;
  144. margin-right: 20upx;
  145. }
  146. .item-con{
  147. flex-grow: 1;
  148. .item-name{
  149. color: #191919;
  150. font-size: 30upx;
  151. font-weight: bold;
  152. }
  153. .item-code{
  154. color: #999999;
  155. font-size: 26upx;
  156. }
  157. .item-num{
  158. display: flex;
  159. justify-content: space-between;
  160. align-items: center;
  161. .num-t{
  162. color: #707070;
  163. font-size: 26upx;
  164. }
  165. .num-v{
  166. }
  167. }
  168. }
  169. }
  170. }
  171. .replenishment-confirm-footer{
  172. padding: 26upx 32upx 30upx;
  173. background-color: #fff;
  174. position: fixed;
  175. left: 0;
  176. bottom: 0;
  177. width: 100%;
  178. box-shadow: 3px 1px 7px #eee;
  179. }
  180. }
  181. </style>