kucunMy_body1.html 6.0 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141142143144145146147148149150151152153154155156157158159160161162163164165166167168169170171172173174175176177178179180181182183184185186187188189190191192193194195196197198199200201202203204205206207208209210211212213214215216217
  1. <!DOCTYPE html>
  2. <html class="">
  3. <!--STATUS OK-->
  4. <head>
  5. <meta name="referrer" content="always" />
  6. <meta charset='utf-8' />
  7. <meta name="viewport" content="width=device-width,minimum-scale=1.0,maximum-scale=1.0,user-scalable=no" />
  8. <meta http-equiv="x-dns-prefetch-control" content="on">
  9. <meta name="description" content="">
  10. <meta name="format-detection" content="telephone=no" />
  11. <link rel="stylesheet" type="text/css" href="css/vant-ui.css" />
  12. <link rel="stylesheet" type="text/css" href="css/iconfont.css">
  13. <link rel="stylesheet" type="text/css" href="css/main.css" />
  14. <script src="js/vue.js"></script>
  15. <script src="js/vant-ui.js"></script>
  16. <script src="js/main.js"></script>
  17. <link rel="stylesheet" href="./mescroll/mescroll.min.css">
  18. <script type="text/javascript" src="./mescroll/mescroll.min.js"></script>
  19. <title></title>
  20. </head>
  21. <style>
  22. .kucunxiangqing , #app {
  23. overflow-y: scroll;
  24. }
  25. .kucunxiangqing .kucunList .srcollBox {
  26. overflow-y: scroll !important;
  27. }
  28. .kucunxiangqing .kucunList .title {
  29. position: static;
  30. }
  31. .kucunxiangqing .kucunList {
  32. position: static;
  33. padding-top: 0rem;
  34. }
  35. .kucunxiangqing {
  36. background-color: #fff !important;
  37. }
  38. .kucunxiangqing .typeFooter , .kucunxiangqing .leiji {
  39. background-color: #00a0ea !important;
  40. }
  41. .j-center {
  42. font-size: 0.3rem;
  43. }
  44. .list {
  45. padding: 0.2rem;
  46. border-bottom: 1px solid#e2e0e0;
  47. width: 96%;
  48. margin-left: 2%;
  49. }
  50. .top-center {
  51. margin: 0.1rem 0;
  52. }
  53. </style>
  54. <body>
  55. <div id="app" v-cloak>
  56. <div class="pageView kucunxiangqing col" id="mescroll">
  57. <!-- <div class="header flex a-center j-center">
  58. <i class="iconfont icon-back" onclick="history.go(-1)"></i>
  59. 库存查询
  60. <div class="toobla flex a-center">
  61. <div class="icon1"></div>
  62. <div class="icon2"></div>
  63. </div>
  64. </div>-->
  65. <!-- <div class="leiji flex a-center j-center">
  66. 库存总量:
  67. <h4> {{ info.stock }} </h4>
  68. </div>
  69. <div class="typeFooter flex a-center j-center">
  70. <div class="item flex j-center a-center">
  71. 品牌
  72. </div><span></span>
  73. <div class="item flex j-center a-center">
  74. 花纹
  75. </div><span></span>
  76. <div class="item flex j-center a-center">
  77. 规格
  78. </div>
  79. </div> -->
  80. <div class="kucunList" v-show="stockList.length > 0">
  81. <!-- <div class="title flex a-center j-center">
  82. <div class="item flex a-center j-center">
  83. 物料描述
  84. </div>
  85. <div class="item flex a-center j-center">
  86. 月入库
  87. </div>
  88. <div class="item flex a-center j-center">
  89. 月出库
  90. </div>
  91. <div class="item flex a-center j-center">
  92. 库存
  93. </div>
  94. </div> -->
  95. <!-- -->
  96. <div class="srcollBox">
  97. <div class="ite a-center j-center list" v-for="(item,index) in stockList" :key="index" v-on:click="lookInfo">
  98. <div class="fx1 flex a-center">
  99. {{ item.tireSize }}
  100. </div>
  101. <div class="fx1 flex a-center top-center">
  102. <p style="flex:1">库存:{{ item.sheetsNumber }}</p>
  103. </div>
  104. <!-- <div class="fx1 flex a-center" >
  105. <p>{{ item.stock }}</p>
  106. </div> -->
  107. </div>
  108. </div>
  109. </div>
  110. <div v-show="stockList.length == 0" style="text-align:center">
  111. <img src="./image/noData.png" style="margin:2rem auto" />
  112. </div>
  113. </div>
  114. </div>
  115. </body>
  116. <script type="text/javascript" src="../script/api.js"></script>
  117. <script type="text/javascript" src="../script/httpRequest.js"></script>
  118. <script type="text/javascript" src="../script/vue_plugins.js"></script>
  119. <script type="text/javascript">
  120. apiready = function() {
  121. new Vue({
  122. el: '#app',
  123. data: {
  124. userId: '', // 绑定的经销商kunnr
  125. brand: '', // 品牌
  126. spec: '', // 规格
  127. pattern: '', // 花纹
  128. starttime: '', // 开始时间
  129. endtime: '', // 结束时间
  130. page: 1,
  131. pagesize: 10,
  132. totalPages : 1,
  133. info: {}, // 包含总库存,筛选品牌,规格,库存
  134. stockList: [], // 库存列表
  135. },
  136. methods: {
  137. init: function() {
  138. var _this = this;
  139. this.userId = $api.getStorage('userid');
  140. this.getStockList();
  141. // 配置上拉加载下拉刷新
  142. this.configDownAndPull("mescroll",function(mescroll){
  143. _this.page = 1;
  144. _this.getStockList(mescroll);
  145. },function(mescroll){
  146. if(_this.page < _this.totalPages){
  147. _this.page = _this.page + 1;
  148. _this.getStockList(mescroll,1);
  149. }else{
  150. mescroll.endSuccess(_this.pagesize,false);
  151. }
  152. })
  153. },
  154. // 获取库存列表
  155. getStockList: function(mescroll) {
  156. var data = {
  157. "storeId": '1164',
  158. "brand": this.brand,
  159. "spec": this.spec,
  160. "pattern": this.pattern,
  161. "starttime": this.starttime,
  162. "endtime": this.endtime,
  163. "page": this.page,
  164. "pagesize": this.pagesize,
  165. "url": "json",
  166. "type": "body"
  167. },
  168. _this = this,
  169. url = "searchKuCunU";
  170. this.$post(url, data, function(ret) {
  171. if (ret.code == 0 || ret.code == '0') {
  172. if(mescroll){
  173. mescroll.endSuccess(_this.pagesize,true);
  174. }
  175. _this.totalPages = ret.page.pages;
  176. var brand = new Array(),
  177. pattern = new Array(),
  178. spec = new Array();
  179. // ret.data.data.brandList.map(function(b, index) {
  180. // brand.push({
  181. // name: b
  182. // })
  183. // })
  184. // ret.data.data.patternList.map(function(p, index) {
  185. // pattern.push({
  186. // name: p
  187. // })
  188. // })
  189. // ret.data.data.specList.map(function(s, index) {
  190. // spec.push({
  191. // name: s
  192. // })
  193. // })
  194. // _this.info = {
  195. // stock: ret.data.data.stock,
  196. // brand: brand,
  197. // pattern: pattern,
  198. // spec: spec
  199. // }
  200. _this.stockList = _this.page == 1 ? ret.page.records : _this.stockList.concat(ret.page.records);
  201. }
  202. })
  203. },
  204. // 查看详情
  205. lookInfo: function() {
  206. this.goWin('kucunxiangqing_win', 'kucunxiangqing_win.html', '');
  207. }
  208. },
  209. mounted: function() {
  210. this.init();
  211. }
  212. })
  213. }
  214. </script>
  215. </html>