temproaryStockIn.vue 5.5 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141142143144145146147148149150151152153154155156157158159160161162163164165166167168169170171172173174175176177178179180181182183184185186187188189190191192193194195196197198199200201202203204205206207208209210211212213214215216217218219220221222223224225226227228229230231232233234235236237238239240241242243244245246
  1. <template>
  2. <view class="temproaryPages flex flex_column">
  3. <view class="temproary-head">
  4. <view>经销商:{{$store.state.vuex_storeShelf.dealerName}}</view>
  5. <view class="notes">具体的临配价格请与配件经销商沟通确认</view>
  6. </view>
  7. <view class="temproary-body">
  8. <div class="cpb_cart-box flex flex_column">
  9. <div class="cpb_cart-tit">
  10. <div class="flex align_center">
  11. <span class="line"></span>
  12. <span>选择配件</span>
  13. </div>
  14. <div class="add" @click="morePart">添加更多临配配件</div>
  15. </div>
  16. <div class="cpb_cart-list">
  17. <view class="nav-right-item flex" v-for="(item, index) in partList" :key="item.id">
  18. <view class="uni-col-2">
  19. <u-image :src="item.images+'?x-oss-process=image/resize,m_fixed,h_120,w_120,color_ffffff'" @click="viewImg(item)" border-radius="30" width="120" height="120" bg-color="#EBEBEB" ></u-image>
  20. </view>
  21. <view class="item-info uni-col-10">
  22. <view class="item-name">
  23. <text>{{item.name}}</text>
  24. </view>
  25. <view class="item-detail">
  26. <view class="item-detail-info">
  27. <view class="flex justify_between">
  28. <view class="item-detail-text flex_1">
  29. <text class="item-detail-text">{{item.code}}</text>
  30. </view>
  31. <view class="item-detail-text">
  32. <u-number-box v-model="item.qty" @change="numberChange" :index="'cart_'+item.productSn" :min="0"></u-number-box>
  33. </view>
  34. </view>
  35. </view>
  36. </view>
  37. </view>
  38. </view>
  39. </div>
  40. </div>
  41. </view>
  42. <view class="temproary-footer">
  43. <u-button type="primary" @click="submitForm" :custom-style="{background:'#1283d4',fontSize:'32rpx'}" shape="circle">确认提交</u-button>
  44. </view>
  45. </view>
  46. </template>
  47. <script>
  48. import { shelfTemporarySave } from '@/api/shelf.js'
  49. export default {
  50. data() {
  51. return {
  52. vinNumber: '',
  53. dealerPhone: ''
  54. }
  55. },
  56. computed: {
  57. partList() {
  58. return this.$store.state.vuex_shelfChoosePart
  59. }
  60. },
  61. onLoad(option) {
  62. this.vinNumber = option.vinNumber
  63. },
  64. onReady() {
  65. const shelfInfo = this.$store.state.vuex_storeShelf
  66. this.dealerPhone = shelfInfo&&shelfInfo.contactMobile ? shelfInfo.contactMobile : ''
  67. // #ifdef APP-PLUS
  68. var webView = this.$mp.page.$getAppWebview();
  69. if(this.dealerPhone==''){
  70. webView.setTitleNViewButtonStyle(0,{text:"",color:"#FFFFFF"});
  71. }
  72. // #endif
  73. },
  74. // 点击导航栏按钮
  75. onNavigationBarButtonTap() {
  76. if(this.dealerPhone!=''){
  77. uni.makePhoneCall({
  78. phoneNumber: this.dealerPhone
  79. })
  80. }
  81. },
  82. methods: {
  83. viewImg(item){
  84. uni.previewImage({
  85. urls: [item.images]
  86. })
  87. },
  88. numberChange(e){
  89. console.log(e)
  90. const rowIndex = this.partList.findIndex(item => 'cart_'+item.productSn == e.index)
  91. if(e.value == 0){
  92. this.partList.splice(rowIndex,1)
  93. }
  94. },
  95. formatData(){
  96. let ret = []
  97. this.partList.map(item => {
  98. ret.push({
  99. "productSn" : item.productSn,
  100. "price": item.cost,
  101. "qty":item.qty
  102. })
  103. })
  104. return ret
  105. },
  106. // 更多配件
  107. morePart(){
  108. uni.navigateTo({
  109. url:"/pages/digitalShelf/temproaryStockIn/moreShelfProduct?vinNumber="+this.vinNumber
  110. })
  111. },
  112. // 确认提交
  113. submitForm(){
  114. if(this.partList.length){
  115. shelfTemporarySave({
  116. "temporaryDispatchingBillDetailApiEntityList": this.formatData()
  117. }).then(res => {
  118. uni.showToast({icon: 'none',title: res.message})
  119. if(res.status == 200){
  120. setTimeout(()=>{
  121. uni.navigateBack()
  122. },500)
  123. }
  124. })
  125. }else{
  126. uni.showToast({icon: 'none',title: "请选择配件"})
  127. }
  128. }
  129. }
  130. }
  131. </script>
  132. <style lang="less">
  133. .temproaryPages{
  134. height: 100vh;
  135. .temproary-head{
  136. background-color: #fff;
  137. padding: 20rpx;
  138. font-size: 32rpx;
  139. .notes{
  140. font-size: 30rpx;
  141. color: #FF9528;
  142. }
  143. }
  144. .temproary-footer{
  145. background-color: #fff;
  146. padding: 20rpx 10%;
  147. }
  148. .temproary-body{
  149. flex-grow: 1;
  150. }
  151. .nav-right-item{
  152. background-color: #fff;
  153. padding: 15upx 25upx;
  154. border-bottom: 2rpx solid #f5f5f5;
  155. .item-info{
  156. padding-left: 20upx;
  157. .item-name{
  158. font-size: 32upx;
  159. color: #191919;
  160. display: flex;
  161. align-items: center;
  162. >image{
  163. width: 38rpx;
  164. height: 38rpx;
  165. margin-right: 10rpx;
  166. }
  167. >text{
  168. flex: 1;
  169. word-break: break-all;
  170. }
  171. }
  172. .item-detail{
  173. .item-detail-info{
  174. padding: 10upx 0 4upx;
  175. > view{
  176. padding-bottom: 10rpx;
  177. align-items: center;
  178. .item-detail-text{
  179. color: #999;
  180. .phtxt{
  181. color: #0485F6;
  182. font-size: 28upx;
  183. }
  184. .item-price{
  185. color: #FB1E1E;
  186. font-size: 28upx;
  187. }
  188. }
  189. }
  190. }
  191. }
  192. }
  193. }
  194. .cpb_cart-box{
  195. width: 100%;
  196. padding: 20rpx 0 0;
  197. font-size: 32rpx;
  198. height: 100%;
  199. .cpb_cart-tit{
  200. background-color: #fff;
  201. padding: 20rpx;
  202. display: flex;
  203. justify-content: space-between;
  204. .add{
  205. color: #0485F6;
  206. }
  207. .line{
  208. width: 8rpx;
  209. height: 34rpx;
  210. background-color: #0485F6;
  211. border-radius: 6rpx;
  212. margin-right: 15rpx;
  213. }
  214. }
  215. .cpb_cart-list{
  216. flex-grow: 1;
  217. overflow: auto;
  218. .item-info{
  219. border-bottom:2rpx solid #f8f8f8;
  220. }
  221. .item-detail{
  222. .item-detail-info{
  223. padding: 10upx 0 4upx;
  224. > view{
  225. padding-bottom: 30rpx;
  226. align-items: center;
  227. .item-detail-text{
  228. color: #999;
  229. .phtxt{
  230. color: #0485F6;
  231. font-size: 28upx;
  232. }
  233. .item-price{
  234. color: #FB1E1E;
  235. font-size: 28upx;
  236. }
  237. }
  238. }
  239. }
  240. }
  241. }
  242. }
  243. }
  244. </style>