<template>
  <vxe-grid
    id="grid"
    class="vxe-table"
    resizable
    keep-source
    :align="'center'"
    :height="options.height"
    :data="options.data"
    :columns="options.columns"
    :auto-resize="true"
    :custom-config="{ storage: true }"
    @cell-click="cellClick"
    show-overflow
  >
  </vxe-grid>
</template>

<script>
import eventBus from "@/utils/EventBus";
export default {
  name: 'HTable',
  data(){
    return {
      options:{
        align:'center',
        data:[
          {dcCh:'G175K-4',dcPl:'006',dcFd:'1132',tzbh:'B006N4PX006',gdh:'20240717001',gx:'切割',jsr:'张三',jssj:'2024/07/17 8:00',hbr:'张三',hbsj:'2024/07/17 8:30',zt:'已回报'},
        ],
        height:'500px',
        columns:[
          { type: 'checkbox', width: 50 ,},
          { type: 'seq', width: 60, title: '序号'},
          { field: 'dcCh', title: '船号', width: 100},
          { field: 'dcPl', title: '批量', width: 100},
          { field: 'dcFd', title: '分段', width: 100},
          { field: 'tzbh', title: '套料图号', width: 150},
          { field: 'gdh', title: '工单号', width: 150},
          { field: 'gx', title: '工序', width: 100},
          { field: 'jsr', title: '接收人', width: 100},
          { field: 'jssj', title: '接收时间', width: 150},
          { field: 'hbr', title: '回报人', width: 100},
          { field: 'hbsj', title: '回报时间', width: 150},
          { field: 'zt', title: '状态'},
        ]
      }
    }
  },
  mounted(){
    window.addEventListener('resize', this.getHeight)
    this.getHeight()
  },
  methods:{
    cellClick({row,column}){
      console.log(row)
      eventBus.$emit('share',row)
    },
    getHeight() {
      this.options.height = window.innerHeight*0.71
    },
  }
}
</script>

<style scoped>
.vxe-table /deep/ .vxe-table--header-wrapper
,.vxe-table /deep/ .vxe-table--body-wrapper .vxe-table--body{
  background: none;
  color: white;
}
</style>
