<template>
  <el-dialog :model-value="props.showes" width="70%" >
    <avue-crud ref="crudRef" :data="props.listData" :option="state.option"></avue-crud>
    <div class="btnList">
      <el-button type="primary" @click="emits('generateDocuments')">生成通知单</el-button>
    </div>
  </el-dialog>
</template>
<script setup lang="ts">
import {defineProps, reactive,defineEmits} from 'vue';
const emits = defineEmits(['generateDocuments'])
const props = defineProps({
  listData:{
    type: Array,
    default: () => []
  },
  showes:{
    type: Boolean,
    default: false
  }
});
const state = reactive({
  dialogVisible: true,
  option: {
    tip: false,
    selection: true,
    index: true,
    menu: false,
    menuWidth: 150,
    border: true,
    delBtn: false,
    editBtn: false,
    align: 'center',
    searchLabelWidth: 100,
    searchMenuSpan: 6,
    addBtn: false,
    column: [
      { label: '物料编码', prop: 'FMaterialId', width: 200, search: true },
      { label: '物料名称', prop: 'FMaterialName', width: 200, search: true },
      { label: '规格型号', prop: 'FModel', width: 200, search: true },
      { label: '采购单位', prop: 'FUnitId', width: 200, search: true },
      { label: '单价', prop: 'FPrice', width: 200 },
      { label: '含税单价', prop: 'FTaxPrice', width: 200 },
      { label: '金额', prop: 'FEntryAmount', width: 200 },
      { label: '价税合计', prop: 'FAllAmount', width: 200 },
      { label: '累计收料数量', prop: 'FReceiveQty', width: 200 },
      {
        label: '交货日期',
        prop: 'FDeliveryDate',
        width: 200,
        search: true,
        type: 'datetime',
        searchSpan: 12,
        searchRange: true,
        searchLabelWidth: 150,
      },
      { label: '税额', prop: 'TaxAmount', width: 200 },
      {
        label: '供应商承诺交期',
        prop: 'FSupDueDate',
        width: 200,
        search: true,
        type: 'datetime',
        searchSpan: 12,
        searchRange: true,
        searchLabelWidth: 150,
      },
      {
        label: '供应商承诺最新交期',
        prop: 'FSupDueNewDate',
        width: 200,
        search: true,
        type: 'datetime',
        searchSpan: 12,
        searchRange: true,
        searchLabelWidth: 150,
      },
      { label: '备注', prop: 'FNote', width: 200 },
    ],
  },
});
</script>
<style scoped lang="scss">
.btnList{
  margin-top: 26px;
  display: flex;
  justify-content: center;
}
</style>