queryByCode.vue 7.7 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141142143144145146147148149150151152153154155156157158159160161162163164165166167168169170171172173174175176177178179180181182183184185186187188189190191192193194195196197198199200201202203204205206207208209210211212213214215216217218219220221222223224225226227228229230231232233234235236237238239240241242243244245246247248249250251252253254255256257258259260261262263264265266267268269270271272273274275276277278279280281282283284285286287288289290291292293294295296297298299300301
  1. <template>
  2. <view class="content flex flex_column">
  3. <uni-nav-bar left-icon="back" title="按编码查询" @clickLeft="back" statusBar fixed></uni-nav-bar>
  4. <view class="check-list">
  5. <scroll-view scroll-y type="custom" class="scroll-view" @scrolltolower="onreachBottom">
  6. <sticky-header>
  7. <view class="searchBar">
  8. <uni-search-bar
  9. radius="100"
  10. focus
  11. cancelButton="none"
  12. placeholder="请输入产品编码搜索"
  13. bg-color="#f3f3f3"
  14. @input="change"
  15. @confirm="search"
  16. @blur="search"
  17. @clear="clearSearch"
  18. v-model="queryWord"
  19. clearButton="auto"/>
  20. </view>
  21. </sticky-header>
  22. <view class="partList-list-box" v-for="item in partList" :key="item.id">
  23. <view class="product flex align_center" @click="toEdit(item)">
  24. <view class="flex align_center flex_1">
  25. <view class="pimgs">
  26. <u-image :src="item.images?item.images:`/static/def_imgs.png`" width="128" height="128" border-radius="10"></u-image>
  27. </view>
  28. <view class="pinfo">
  29. <view class="pname flex align_center justify_between">
  30. <view class="code"><text>{{item.shelfPlaceCode}}</text>{{item.code}}</view>
  31. </view>
  32. <view class="flex align_center" v-if="item.productTypeSn=='543766811373752320'&&item.origCode" style="padding-top: 5px;">
  33. <text class="item-detail-text">原厂编码:</text>
  34. <view style="width: 50%;flex-grow: 1;">
  35. <uni-tag :text="item.origCode" inverted :circle="true" type="warning"></uni-tag>
  36. </view>
  37. </view>
  38. <view class="ptxt">
  39. <view>
  40. <text class="pcode">{{item.name}}</text>
  41. </view>
  42. </view>
  43. <view class="pname flex align_center justify_between">
  44. <view class="pcode">
  45. <text class="item-price" v-if="showCarPrice">价格:{{item.price?'¥'+item.price:'暂无'}}</text>
  46. <text class="item-price" v-if="showCostPrice">价格:{{item.cost?'¥'+item.cost:'暂无'}}</text>
  47. </view>
  48. <view class="kc">库存:<text>{{item.currentInven}}</text>{{item.unit}}</view>
  49. </view>
  50. </view>
  51. </view>
  52. <view class="flex align_center justify_center">
  53. <uni-icons type="arrowright" size="20" color="#999"></uni-icons>
  54. </view>
  55. </view>
  56. </view>
  57. <view style="padding: 20upx;">
  58. <sklineTemp v-if="partList.length==0 && status!='loading'" :text="noDataText"/>
  59. <uni-load-more v-if="(total>=partList.length&&partList.length)||status=='loading'" :status="status"/>
  60. </view>
  61. </scroll-view>
  62. </view>
  63. </view>
  64. </template>
  65. <script>
  66. import sklineTemp from '@/components/skline/sklineTemp.vue'
  67. import { getShelfProductList,findShelfUserParam } from '@/api/shelf'
  68. export default {
  69. components:{
  70. sklineTemp
  71. },
  72. data() {
  73. return {
  74. queryWord: '',
  75. shelfName:'',
  76. shelfSn: '',
  77. pageNo:1,
  78. pageSize: 20,
  79. total: 0, // 列表总数
  80. noDataText: '暂无产品',
  81. status: 'nomore',
  82. partList: [],
  83. priceShowVal: null, // 是否可以查看所有价格
  84. showCarPrice: false, // 显示车主价
  85. showCostPrice: false, // 显示成本价
  86. }
  87. },
  88. onLoad(opts) {
  89. this.shelfSn = this.$store.state.vuex_storeShelf.shelfSn
  90. uni.$on("updateQueryByCodeList",()=>{
  91. this.getpartList()
  92. })
  93. // 价格显示权限
  94. this.getShowPriceType()
  95. },
  96. computed: {
  97. userInfo(){
  98. return this.$store.state.vuex_userInfo
  99. },
  100. isAdmin(){
  101. return this.userInfo.superAdmin == 1
  102. }
  103. },
  104. onUnload() {
  105. uni.$off("updateQueryByCodeList")
  106. },
  107. methods: {
  108. back(){
  109. uni.navigateBack()
  110. },
  111. getShowPriceType(){
  112. findShelfUserParam({shelfSn: this.shelfSn}).then(res => {
  113. this.priceShowVal = res.data ? res.data.carOwnerPrice == '1' && res.data.purchasesPrice == '1' : false
  114. // 选中了2中价格,则从列表显示价格中取值
  115. if(this.priceShowVal){
  116. // 进货价
  117. this.showCostPrice = res.data.priceShowType == 'PURCHASES_PRICE'
  118. // 车主价
  119. this.showCarPrice = res.data.priceShowType == 'CAR_OWNER_PRICE'
  120. }else{
  121. // 进货价
  122. this.showCostPrice = res.data ? res.data.purchasesPrice == '1' : false
  123. // 车主价
  124. this.showCarPrice = res.data ? res.data.carOwnerPrice == '1' : false
  125. }
  126. })
  127. },
  128. //拿货
  129. toEdit(item){
  130. if(item.currentInven){
  131. const params = {
  132. shelfSn: this.shelfSn,
  133. billSource: 'product_code',
  134. showPrice: this.showCarPrice ? item.price : (this.showCostPrice?item.cost:'')
  135. }
  136. this.$store.state.vuex_tempData = Object.assign(params, item)
  137. uni.navigateTo({
  138. url: '/pagesA/queryByCode/confirmQh'
  139. })
  140. }else{
  141. uni.showToast({
  142. icon:'none',
  143. title: '库存不足,不能拿货!',
  144. duration: 4000
  145. })
  146. }
  147. },
  148. change(v){
  149. if(v==''){
  150. this.clearSearch()
  151. }
  152. },
  153. clearSearch(){
  154. this.queryWord = ''
  155. this.search()
  156. },
  157. search(){
  158. this.pageNo = 1
  159. this.partList = []
  160. this.getpartList()
  161. },
  162. // 获取数字货架列表
  163. getpartList(){
  164. const _this = this
  165. let params = {
  166. pageNo: this.pageNo,
  167. pageSize: this.pageSize,
  168. code: this.queryWord.trim(),
  169. }
  170. _this.status = 'loading'
  171. getShelfProductList(params).then(res => {
  172. uni.hideLoading()
  173. if(res.status == 200){
  174. let list = res.data.list
  175. if (list && list.length){
  176. // 分页 拼接数据
  177. if (_this.pageNo != 1) {
  178. _this.partList = _this.partList ? _this.partList.concat(list) : list
  179. } else {
  180. _this.partList = list
  181. }
  182. this.total = res.data.count
  183. if (_this.partList.length == res.data.count) {
  184. _this.status = 'nomore'
  185. } else {
  186. _this.status = 'loadmore'
  187. }
  188. } else {
  189. _this.partList = list || []
  190. this.total = 0
  191. _this.status = 'nomore'
  192. }
  193. _this.noDataText = '暂无匹配产品'
  194. }else{
  195. _this.status = 'loadmore'
  196. _this.partList = []
  197. _this.total = 0
  198. _this.noDataText = res.message ? res.message : '网络似乎出错了,请稍后再试'
  199. }
  200. this.showTab = false
  201. })
  202. },
  203. // 加载更多
  204. onreachBottom () {
  205. if(this.partList.length < this.total ){
  206. this.pageNo++
  207. this.getpartList()
  208. }else{
  209. this.status = "nomore"
  210. }
  211. },
  212. }
  213. }
  214. </script>
  215. <style lang="less">
  216. .content{
  217. height: 100vh;
  218. width: 100%;
  219. padding: 0;
  220. background: #fff;
  221. .check-list{
  222. flex-grow: 1;
  223. background: #f8f8f8;
  224. .scroll-view{
  225. height: 100%;
  226. box-sizing: border-box;
  227. .searchBar{
  228. background-color: #fff;
  229. }
  230. }
  231. .partList-list-box{
  232. padding: 10rpx 20rpx;
  233. &:last-child{
  234. border:0;
  235. }
  236. .product{
  237. flex-grow: 1;
  238. padding: 20rpx;
  239. background-color: #fff;
  240. border-radius: 10rpx;
  241. box-shadow: 1px 1px 3px #eee;
  242. &:active{
  243. opacity: 0.6;
  244. background-color: #f8f8f8;
  245. }
  246. .pinfo{
  247. flex-grow: 1;
  248. padding-left: 20rpx;
  249. width: 80%;
  250. /deep/ .uni-tag{
  251. word-break: break-all;
  252. font-size: 28rpx;
  253. color: #0fab04eee;
  254. border: 0;
  255. padding: 0.2rem 0.3rem;
  256. }
  257. .item-detail-text{
  258. color: #999;
  259. }
  260. .pname{
  261. font-size: 28rpx;
  262. color: #191919;
  263. .code{
  264. display: flex;
  265. align-items: center;
  266. text{
  267. font-weight: normal;
  268. margin-right: 6rpx;
  269. padding: 0 10rpx;
  270. background: rgba(3, 54, 146, 0.15);
  271. border-radius: 20rpx;
  272. color: #033692;
  273. font-size: 24rpx;
  274. }
  275. }
  276. .kc{
  277. display: flex;
  278. align-items: center;
  279. color: #999;
  280. text{
  281. color: #333;
  282. }
  283. }
  284. }
  285. .ptxt{
  286. font-size: 28rpx;
  287. color: #333;
  288. font-weight: bold;
  289. margin: 10rpx 0;
  290. .pnums{
  291. color: #222;
  292. }
  293. }
  294. }
  295. }
  296. }
  297. }
  298. }
  299. </style>