<template>
    <div class="inbox">
      <table width="100%">
        <tr align="center" style="color: #54ad4c; line-height: 40px">
          <!-- <th width="8%">用车需求编号</th> -->
          <th width="10%">发货类型</th>
          <th width="12%">用车需求编号</th>
          <th width="9%">料号</th>
          <th width="9%">规格</th>
          <th width="10%">发货数量</th>
          <th width="10%">预估托盘数</th>
          <th width="10%">送货地点</th>
          <th width="10%">取货仓库</th>
          <th width="10%">发货日期</th>
          <th width="10%">当前状态</th>
        </tr>
      </table>
      <vue-seamless-scroll :data="dataSource" class="seamless-warps-scroll" :class-option="classOption">
        <table width="100%">
          <tbody style="color: rgba(0, 0, 0, 0.65); font-weight: 100 !important;">
            <tr v-for="(item, index) in dataSource" align="center" :key="index">
              <!-- <th width="8%">{{ item.vdNo }}</th>  -->
              <th width="10%">{{ item.shipType_dictText }}</th> 
              <th width="12%">{{ item.vdNo }}</th> 
              <th width="9%">{{ item.pn }}</th> 
              <th width="9%">{{ item.spec }}</th> 
              <th width="10%">{{ item.shipNumber }}</th> 
              <th width="10%">{{ item.palletsNum }}</th> 
              <th width="10%">{{ item.deliveryAddress }}</th> 
              <th width="10%">{{ item.pickUpHub }}</th> 
              <th width="10%">{{ item.shipDate }}</th>
              <th width="10%">{{ item.currentStatus_dictText }}</th>
            </tr>
          </tbody>
        </table>
      </vue-seamless-scroll>
    </div>
  </template>
  
  <script>
  import { getAction } from '@api/manage'
  import vueSeamlessScroll from 'vue-seamless-scroll'
  
    export default {
      name: 'Delivery',
      props: {
        height: Number,
        dataSource: Array
      },
      components: {
        vueSeamlessScroll
      },
      data() {
        return {
          timer: null,
        };
      },
      computed: {
        classOption() {
          return {
            step: 0.1, // 数值越大速度滚动越快
            limitMoveNum: this.dataSource.length, // 开始无缝滚动的数据量 this.dataList.length
            hoverStop: true, // 是否开启鼠标悬停stop
            direction: 1, // 0向下 1向上 2向左 3向右
            openWatch: true, // 开启数据实时监控刷新dom
            singleHeight: 0, // 单步运动停止的高度(默认值0是无缝不停止的滚动) direction => 0/1
            singleWidth: 0, // 单步运动停止的宽度(默认值0是无缝不停止的滚动) direction => 2/3
            waitTime: 1000, // 单步运动停止的时间(默认值1000ms)
          }
        },
      },
      methods: {
      },
      created(){
      },
      mounted(){
      }
    };
  </script>
  
  <style scoped>
    .inbox{
      padding:2px ;
      max-height: 200px;
      overflow: hidden;
    }
  
    .seamless-warps-scroll {
      overflow: hidden;
    }
  </style>