<!-- 标准零件选型-->
<template>
  <div>
    <vxe-toolbar>
      <template #buttons>
        <div class="ggdy-bts">
          <el-upload :action="data.upLoadUrl" :with-credentials="true" :on-success="handleSuccess" :show-file-list="false"
            name="file" :limit="1" accept=".xls,.xlsx" :before-upload="beforeAvatarUpload" ref="uploadwlbj">
            <div class="l-button">导入物料报价单</div>
          </el-upload>
        </div>
      </template>
    </vxe-toolbar>
    <vxe-table id='wlbjtable' @checkbox-change="selectionChange" @checkbox-all="selectAllChange" max-height="400"
      :custom-config="{ storage: true }" border show-overflow :data="wlbjTableData" :column-config="{ resizable: true }"
      :edit-config="{ trigger: 'click', mode: 'cell', showUpdateStatus: true, showInsertStatus: true }" class="ggdycss">
      <!-- <vxe-column type="checkbox" width="50" align="center"></vxe-column> -->
      <vxe-column field="code" title="物料编码" width="250" align="left"> </vxe-column>
      <vxe-column field="name" title="物料名称" width="250" align="left"></vxe-column>
      <vxe-column field="sku" title="物料规格型号" align="left"></vxe-column>
      <vxe-column field="price" title="单价（￥）" align="left"></vxe-column>
    </vxe-table>
  </div>
</template>
<script>
import { defineComponent, reactive, getCurrentInstance, onMounted, defineEmits } from 'vue';
import { ElMessage } from 'element-plus'
export default defineComponent({
  name: 'lcwlbjtable',
  props: {
    wlbjTableData: {
      type: Array,
      default: []
    },
    projectId: {
      type: Number,
      default: null
    }
  },
  emits: ["update:wlbjTableData"],
  setup (props, context) {
    const emit = defineEmits(['getPageInfo'])
    let { proxy } = getCurrentInstance()
    const apiVersion = process.env.VUE_APP_API_VERSION.replace(/\./g, '_')
    const baseUrl = process.env.VUE_APP_API_BASEURL + apiVersion + '/'
    const data = reactive({
      loading: null,
      loading: false,
      upLoadUrl: baseUrl + 'project/sku/material_price_doc',
    })
    onMounted(() => {
      // 标准零件的下拉交互还没
    })
    // 选中单行
    function selectionChange (value) {
    }
    // 选中全部
    function selectAllChange (value) {
    }
    // 显示隐藏选择
    function handleSelectionChange (arry) {
    }
    //导入wlbj
    function handleSuccess (res, file, file_list) {
      if (res.errno == 200) {
        props.wlbjTableData = res.data
        ElMessage.success(res.errmsg)
        context.emit('update:wlbjTableData', res.data)
      } else {
        ElMessage.error(res.errmsg)
      }
      proxy.$refs.uploadwlbj.clearFiles()
    }
    //文件校验方法
    function beforeAvatarUpload (file) {
      //不能导入大小超过20Mb的文件
      if (file.size > 20 * 1024 * 1024) {
        ElMessage({ type: 'error', message: '文件过大，请上传小于20MB的文件!' })
        return false
      }
      return true
    }
    function uploadWLBJ (file) {
    }
    return {
      data,
      selectionChange,
      selectAllChange,
      handleSelectionChange,
      handleSuccess,
      beforeAvatarUpload,
      uploadWLBJ
    };
  },
});
</script>

<style lang="scss" scoped>
@import '../../assets/style/lc.scss';
</style>
