gx

queenwuli

2021-01-11 7113b4f2dd47a313c6fbc85c21f4756da42b212a

 hive-app/pages/workbench/storeRecord.vue

@@ -1,56 +1,125 @@
<template>
   <!-- 出入库记录 -->
   <view>
      <view class="header font-14 flex align-center justify-center">
      <view class="header">
         <view class="header-time mr-20">
            <text class="blue">2019-08-25</text>
            <picker mode="date" @change="startDateChange">
               <text :class="startDate?'blue':'gray'">{{startDate?startDate:'请选择开始日期'}}</text>
            </picker>
         </view>
         <text class="iconfont iconjian"></text>
         <view class="header-time ml-20">
            <text class="blue">2020-08-25</text>
            <picker mode="date" @change="endDateChange">
               <text :class="endDate?'blue':'gray'">{{endDate?endDate:'请选择结束日期'}}</text>
            </picker>
         </view>
      </view>
      <view class="content">
         <view class="content-row mt-10">
            <view class="content-row-time">
               <text class="font-14">2020-12-11 11:15</text>
         <view class="content-row" v-for="item in list">
            <view class="content-row-header">
               <text>{{item.createTime}}</text>
            </view>
            <view class="content-row-record">
               <view class="font-16 flex align-center justify-between">
                  <text>采购入库</text>
                  <text>入库数量: 2</text>
            <view class="content-row-con">
               <view class="font-15 flex align-center justify-between mb-10">
                  <text>{{item.content}}</text>
                  <text :class="item.amount<0?'red':'green'">{{item.amount<0?item.amount:'+'+item.amount}}</text>
               </view>
               <view class="mt-10">
                  <text class="font-14 gray">订单编号: N1231242412412414</text>
               </view>
               <text class="gray">订单编号: {{item.orderNo}}</text>
            </view>
         </view>
         <view class="content-row mt-10">
            <view class="content-row-time">
               <text class="font-14">2020-12-11 11:15</text>
            </view>
            <view class="content-row-record">
               <view class="font-16 flex align-center justify-between">
                  <text>销售出库</text>
                  <text>出库数量: 2</text>
               </view>
               <view class="mt-10">
                  <text class="font-14 gray">订单编号: N1231242412412414</text>
               </view>
            </view>
         <view v-if="list.length">
            <uni-load-more :status="loadStatus" color="#a5abaf"></uni-load-more>
         </view>
      </view>
   </view>
</template>

<script>
   import uniLoadMore from '@/components/uni-load-more/uni-load-more.vue';
   export default{
      components:{
         uniLoadMore
      },
      data(){
         return {
            goodsCode: '',
            startDate: '',
            endDate: '',
            list: [],
            loadStatus: 'more',
            pageNum: 1
         }
      },
      onLoad(options) {
         this.goodsCode = options.goodsCode;
         this.loadList()
      },
      onPullDownRefresh(){
         this.reloadData();
         let timer = setTimeout(function () {
            uni.startPullDownRefresh();
            clearTimeout(timer);
            timer = null;
         }, 800);
      },
      onReachBottom(){
         this.loadList()
      },
      methods:{
         reloadData(){
            this.list = [];
            this.pageNum = 1;
            this.loadStatus = 'more';
            this.loadList();
         },
         startDateChange(e){
            this.startDate = e.detail.value;
            this.reloadData()
         },
         endDateChange(e){
            this.endDate = e.detail.value;
            this.reloadData()
         },
         loadList(){
            if(this.loadStatus!=='more'){
               return;
            }
            this.$httpUtils.request('/api/store/findGoodsInOutInfo', {
               code: this.goodsCode,
               pageNum: this.pageNum,
               pageSize: 10,
               startTime: this.startDate,
               endTime: this.endDate
            }, 'POST').then((res) => {
               if(res.status == 200){
                  let result = res.rows;
                  if(result.length < 10){
                     this.loadStatus = 'noMore';
                  } else {
                     this.pageNum ++ ;
                     this.loadStatus = 'more';
                  }
                  this.list = this.list.concat(result);
               }
            })
         }
      }
   }
</script>

<style>
   page{
      background: #F6F6F8;
      position: relative;
   }
   .header{
      display: flex;
      align-items: center;
      justify-content: center;
      position: fixed;
      left: 0;
      right: 0;
      margin-top: -10px;
      background: #FFFFFF;
      padding: 10px 0;
      box-shadow:0 6px 6px rgba(237,234,244,0.5);
@@ -60,23 +129,29 @@
   .header-time{
      border: 1px solid #EDEAF4;
      border-radius: 4px;
      padding: 5px 10px;
      padding: 5px 0;
      width: 120px;
      text-align: center;
      font-size: 14px;
   }
   .content{
      padding: 0 10px;
      padding: 44px 10px 10px;
   }
   .content-row{
      margin-top: 10px;
      background: #FFFFFF;
      border: 1px solid #EDEAF4;
      border-radius: 4px;
      padding: 0 10px;
      box-shadow:0 6px 6px rgba(237,234,244,0.5);
   }
   .content-row-time{
   .content-row .content-row-header{
      padding: 10px 0;
      border-bottom: 1px solid #EDEAF4;
      font-size: 13px;
   }
   .content-row-record{
   .content-row-con{
      padding: 10px 0;
      font-size: 13px;
   }
</style>