<template>
	<view style="background: #fff; min-height: calc(100vh - 44px)">
    <view class="search-header">
      <scanlistener
	  v-if="showScanlistener"
	  suffixIcon="scan"
	  v-model="keyword"
	  :placeholder="$t('请扫描订单号')"
	  @iconClick="scanCode"
	  @confirm="searchOrder"
	  @submit="keyword=$event;searchOrder()"
	  ></scanlistener>
    </view>
    <view class="scroll">
      <view class="list-row list-header">
        <view class="">{{$t('订单号')}}</view>
        <view class="">{{$t('唛头')}}</view>
        <view class="">{{$t('目的地')}}</view>
        <view class="">{{$t('运输方式')}}</view>
        <view class="">{{$t('到达')}}/{{$t('总数')}}</view>
      </view>
      <view>
        <view v-for="(v, key) in listData" :class="{'list-row': true, 'row-bg' : key % 2 === 0}" :key="key" @tap="toDetail(v)">
          <view class="">
            {{ v.orderNo }}
          </view>
          <view class="">{{ v.marks }}</view>
          <view class="">{{ v.objectiveName }}</view>
          <view class=""><dict-tag :type="DICT_TYPE.ECW_TRANSPORT_TYPE" :value="v.transportId" /></view>
          <view class="">
            <text>{{ v.sumNum }}</text>
            /
            <text>{{ v.totalNum }}</text>
          </view>
        </view>
          <uni-load-more :status="status" :icon-size="16" :content-text="contentText" />
      </view>
    </view>
	</view>
</template>

<script>
	import util from '../../util/util.js';
  import { getAdjustWaitInList } from './api'

	export default {
		name: 'warehouseing-list',
		components: {
			// uniLoadMore,
      // uniSearchBar,
      // uniIcons
		},
		data() {
			return {
				listData: [],
				page: 1,
				keyword: '',
				// oldKeyword: '',
				status: 'more',
				contentText: {
					contentdown: this.$t('上拉加载更多'),
					contentrefresh: this.$t('加载中'),
					contentnomore: this.$t('没有更多')
				},
				returnLoadId: null,
				// 7(垫)，8(木)，9(纸)
				advanceTypeList:[
					{id:7,value:this.$t('垫')},
					{id:8,value:this.$t('木')},
					{id:9,value:this.$t('纸')},
				],
				modalShow:!1,
				modalId:'',
				modalData:{},
				onHideFlag:false
			};
		},
		methods: {
			scanCode() {
			uni.scanCode({
				success: (res) => {
				console.log('条码类型：' + res.scanType);
				console.log('条码内容：' + res.result);
				this.keyword = res.result
				this.searchOrder()
			  }
			})
		},
		searchOrder() {
			this.page = 1
			setTimeout(() => {
				this.getData(this.keyword)
			}, 100)
		},
		getData(orderNo) {
		  let that = this
          const params = {
          page: this.page,
          rows: 20,
          orderNo
        }
				getAdjustWaitInList(params).then(res => {
          const data = res.list
					if (that.page == 1) this.listData = [];

					if (data.length > 0) {

						that.listData = that.listData.concat(data);
						that.status = 'more';
					}
          if (res.total === that.listData.length) that.status = 'noMore';
					uni.stopPullDownRefresh();
				});
			},
			toDetail(data) {
        console.log(data);
				this.modalId = data.id;
				this.modalData = data;
        uni.navigateTo({
					url: './detail?orderId=' + data.orderId
				});
			},
		},
		onPullDownRefresh() {
			this.page = 1;
			this.getData();
		},
		onReachBottom() {
			if (this.status == 'more') {
				this.status = 'loading';
				this.page++;
				this.getData();
			}
		},
		onLoad: function(option) {
			uni.setNavigationBarTitle({
				title:this.$t('调仓待入仓列表')
			})
			this.getData();
		},
		onShow(){
			if(this.onHideFlag){
				this.page = 1;
				this.getData(this.keyword);
			}
		},
		onHide(){
			this.onHideFlag = true;
		},
		onBackPress(options) {
			uni.reLaunch({
				url: '../index/index'
			});
			return true;
		}
	};
</script>

<style lang="scss" scoped>
  .search-header{
    ::v-deep .uni-easyinput__content {
      border-radius: 20px;
      padding-right: 10px;
      background: rgba($color: #fff, $alpha: 0.5) !important;
      border: none;
      // opacity: 0.5;
    }
    ::v-deep .uni-input-placeholder {
      padding-left: 8px;
      color: #b2c9f3;
    }
    ::v-deep .uni-input-input {
      padding-left: 8px;
    }
  }
  .scroll {
    margin-top: -8px;
    border-top-left-radius: 8px;
    border-top-right-radius: 8px;
    padding: 8px;
    background: #fff;
    .list-row {
      display: flex;
      align-items: center;
      // line-height: 24px;
      padding: 8px 0;
      view {
        flex: 1;
        text-align: center;
      }
    }
    .list-header {
      font-weight: bold;
    }
    .row-bg {
      background: #ebebed;
    }
  }
</style>
