123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141142143144145146147148149150151152153154155156157158159160161162163164165166167168169170171172173174175176177178179180181182183184185186187188189190191192193194195196197198199200201202203204205206207208209210211212213214215216217218219220221222223224225226227228229230231232233234235236237238239240241242243244245246247248249250251252253254255256257258259260261262263264265266267268269270271 |
- <!DOCTYPE html>
- <html class="">
- <!--STATUS OK-->
- <head>
- <meta name="referrer" content="always" />
- <meta charset='utf-8' />
- <meta name="viewport" content="width=device-width,minimum-scale=1.0,maximum-scale=1.0,user-scalable=no" />
- <meta http-equiv="x-dns-prefetch-control" content="on">
- <meta name="description" content="">
- <meta name="format-detection" content="telephone=no" />
- <link rel="stylesheet" type="text/css" href="css/vant-ui.css" />
- <link rel="stylesheet" type="text/css" href="css/iconfont.css">
- <link rel="stylesheet" type="text/css" href="css/main.css" />
- <script src="js/vue.js"></script>
- <script src="js/vant-ui.js"></script>
- <script src="js/main.js"></script>
- <link rel="stylesheet" href="./mescroll/mescroll.min.css">
- <script type="text/javascript" src="./mescroll/mescroll.min.js"></script>
- <title></title>
- </head>
- <style>
- .chukujilu {
- background-color: #fff !important;
- }
- .chukujilu .chukuTimer {
- background-color: #00a0ea !important;
- color: #fff !important;
- }
- .chukujilu,
- #app {
- overflow-y: scroll !important;
- }
- .mescroll{
- position: relative;
- height: 73%;/*如设置bottom:50px,则需height:auto才能生效*/
- }
- </style>
- <body>
- <div id="app" v-cloak>
- <div class="pageView chukujilu flex col filterpage">
- <div class="leiji flex a-center j-center" style="background-color : #00a0ea !important;">
- 库存总量:
- <h4>{{total}} </h4>
- </div>
- <div class="searchSpec">
- <div class="search flex a-center">
- <div class="searchbox">
- <svg t="1589079341958" class="icon" viewBox="0 0 1024 1024" version="1.1" xmlns="http://www.w3.org/2000/svg" p-id="5394" width="22" height="22">
- <path d="M883.626667 823.04l-145.066667-144.64A337.92 337.92 0 0 0 810.666667 469.333333a341.333333 341.333333 0 1 0-341.333334 341.333334 337.92 337.92 0 0 0 209.066667-72.106667l144.64 145.066667a42.666667 42.666667 0 0 0 60.586667 0 42.666667 42.666667 0 0 0 0-60.586667zM213.333333 469.333333a256 256 0 1 1 256 256 256 256 0 0 1-256-256z" p-id="5395" fill="#bfbfbf"></path>
- </svg>
- <input type="search" placeholder="请输入轮胎胎号或规格" v-model="keyword">
- </div>
- </div>
- </div>
- <van-popup position="bottom" v-model="timeShow">
- <mycalendar @comfirm="comfirm" @close="timeShow = false"></mycalendar>
- </van-popup>
- <div class="zhuceTimer flex a-center jlr">
- <div class="flex a-center" v-on:click="getTimes">
- <h4>入库时间:</h4>
- <p v-on:click="getTimes(0)">{{ startTime }}</p> ~ <p v-on:click="getTimes(1)">{{ endTime }}</p>
- </div>
- </div>
- <!-- <div class="leiji flex a-center j-center">
- 累计(条):<h4>999</h4>
- </div> -->
- <!-- <div class="chukuTimer flex a-center jlr" @click="openTimer">
- <div class="flex a-center">
- <h4 class="flex a-center j-center">入库日期:</h4>
- <div class="flex a-center j-center" v-on:click="chooseTime">{{startCurrentDate}}</div>
- </div>
- <div class="iconfont icon-right"></div>
- </div> -->
- <div class="mescroll-touch-y mescroll" id="mescroll">
- <div class="boxs" v-show="list.length > 0">
- <ul>
- <li v-for="(item,index) in list">
- <div class="bottom flex jlr a-center">
- <p>入库码:{{ item.batchNumber }}</p>
- <span>1 条</span>
- </div>
- <div class="bottom flex jlr a-center">
- <p>物料描述:{{ item.maktx }}</p>
- </div>
- <div class="bottom flex jlr a-center">
- <p>胎号:{{ item.tireNumber }}</p>
- </div>
- <div class="bottom flex jlr a-center">
- <p>发货时间:{{ item.shippedDate | formatDate}}</p>
- </div>
- <div class="bottom flex jlr a-center">
- <p>创建时间:{{ item.createTime | formatDate}}</p>
- </div>
- </li>
- </ul>
- <!-- <div v-show="hasOther == false" style="width: 100%;height: 1rem;;text-align : center;margin-top : 1rem;font-size:0.3rem;background:#ccc;color:#fff;width:200px;margin:0.5rem auto;line-height:1rem" v-on:click="addMore">点击加载更多</div> -->
- <!-- <div v-show="hasOther && list.length > 0" style="width: 100%;height: 1rem;;text-align : center;margin-top : 1rem;font-size:0.3rem">暂无更多数据</div> -->
- </div>
- <div v-show="list.length == 0" style="overflow: auto;">
- <img src="./image/noData.png" style="margin:2rem auto" />
- </div>
- </div>
- </div>
- <!-- <van-popup v-model="startTimeShow" position="bottom">
- <van-datetime-picker v-model="startCurrentDate" type="date" title="选择开始时间" @confirm="startConfirm"/>
- </van-popup> -->
- </div>
- </body>
- <script type="text/javascript" src="../script/aui-scroll.js"></script>
- <script type="text/javascript" src="../script/api.js"></script>
- <script type="text/javascript" src="../script/httpRequest.js"></script>
- <script type="text/javascript" src="../script/vue_plugins.js"></script>
- <script type="text/javascript">
- apiready = function() {
- new Vue({
- el: '#app',
- data: {
- list: [],
- startTimeShow: false,
- startCurrentDate: '点击选择日期',
- size: 10,
- current: 1,
- totalPages: 1, // 总页数
- frist: 1,
- mescroll: '',
- hasOther: false,
- total:'',
- // 添加查询
- timeShow: false,
- keyword: '',
- startTime : '开始时间',
- endTime : '结束时间'
- },
- watch: {
- keyword: function(nw, od) {
- this.current = 1;
- this.getIntoList();
- }
- },
- methods: {
- // 查询数据
- // 选择筛选条件
- comfirm : function(v) {
- this.timeShow = false
- },
- //选择时间
- getTimes : function(type){
- var _this = this;
- this.getTime(function(time){
- if(type == 0){
- _this.startTime = time;
- }else{
- _this.endTime = time;
- }
- _this.getIntoList();
- })
- },
- init: function() {
- var _this = this;
- this.userid = $api.getStorage('userid');
- this.getIntoList();
- },
- configs: function() {
- var _this = this;
- this.frist = 2;
- this.configDownAndPull("mescroll", function(mescroll) {
- _this.current = 1;
- _this.mescroll = mescroll;
- _this.getIntoList(mescroll);
- }, function(mescroll) {
- if (_this.current < _this.totalPages) {
- _this.current = _this.current + 1;
- _this.getIntoList(mescroll, 1);
- } else {
- mescroll.endSuccess(_this.size, false);
- }
- });
- },
- addMore: function() {
- var _this = this;
- if (_this.current < _this.totalPages) {
- _this.current = _this.current + 1;
- _this.getIntoList();
- } else {
- _this.hasOther = true;
- }
- },
- chooseTime: function() {
- var _this = this;
- this.getTime(function(time) {
- _this.startCurrentDate = time;
- if (_this.mescroll != '') {
- _this.mescroll.resetUpScroll();
- }
- _this.getIntoList();
- })
- },
- openTimer: function() {
- this.startTimeShow = true
- },
- startConfirm: function(e) {
- this.startTimeShow = false
- },
- getIntoList: function(mescroll) {
- var _this = this,
- url = "getinOrOutU";
- var data = {
- "storeId": this.userid,
- "size": this.size,
- "current": this.current,
- "scanType": 1,
- "url": "json",
- "type": "body",
- "tireNumber": this.keyword,
- "startTime" : this.startTime == '开始时间' ? '' : this.startTime+' 00:00:00',
- "endTime" : this.endTime == '结束时间' ? '' : this.endTime+' 23:59:59'
- }
- // console.log(JSON.stringify(data));
- this.$post(url, data, function(ret) {
- // console.log(JSON.stringify(ret));
- if (ret.code == 0 || ret.code == '0') {
- _this.list = _this.current == 1 ? ret.Data.records : _this.list.concat(ret.Data.records);
- _this.total=ret.Data.total
- _this.totalPages = ret.Data.pages;
- if (mescroll) {
- mescroll.endSuccess(_this.size, true);
- }
- if (_this.frist == 1) {
- _this.$nextTick(function() {
- _this.configs();
- })
- }
- }
- })
- }
- },
- filters: {
- timer: function(v) {
- var v = new Date(v);
- if (v && v!='开始时间' && v!='') {
- var y = v.getFullYear()
- var m = v.getMonth() + 1
- var d = v.getDate()
- return y + '-' + m + '-' + d
- } else {
- return '请选择'
- }
- },
- formatDate: function(time) {
- return time.substring(0,10)
- }
- },
- mounted: function() {
- this.init();
- }
- })
- }
- </script>
- </html>
|