mts / MTS-UI · Files

<template>
  <a-card :bordered="false">
    <!-- 查询区域 -->
    <div class="table-page-search-wrapper">
      <a-form layout="inline"  >
        <a-row :gutter="12">
          <a-col :md="5" :sm="8">
            <a-form-item label="节点编码" :labelCol="{span: 6}" :wrapperCol="{span: 14, offset: 1}">
              <!--            <a-input placeholder="请输入节点编码" v-model="no" @keyup.enter="searchEnterFun($event)" ></a-input>-->
              <a-select
                show-search
                placeholder="请选择节点编码"
                option-filter-prop="children"
                :filter-option="filterOption"
                v-model="no" style="width: 200px"
              >
                <a-select-option v-for="item in bomIdList" :key="item" :value="item">{{ item }}</a-select-option>
              </a-select>
            </a-form-item>
          </a-col>

          <a-col :md="4" :sm="8">
            <a-form-item label="物料名称" :labelCol="{span: 6}" :wrapperCol="{span: 14, offset: 1}">
              <a-input placeholder="请输入物料名称" v-model="name" @keyup.enter="searchEnterFun($event)" ></a-input>
            </a-form-item>
          </a-col>

          <a-col :md="5" :sm="8">
            <a-form-item label="图号" :labelCol="{span: 3}" :wrapperCol="{span: 14, offset: 1}">
              <a-input placeholder="请输入图号" v-model="f08" @keyup.enter="searchEnterFun($event)" ></a-input>
            </a-form-item>
          </a-col>

          <a-col :md="6" :sm="8">
            <span style="float: left;overflow: hidden;" class="table-page-search-submitButtons">
              <a-button type="primary" @click="queryBom"   icon="search">查询</a-button>
              <a-button type="primary" @click="searchReset" icon="reload" style="margin-left: 8px">重置</a-button>
              <a-button type="primary" @click="bomExportXls('工序查询表')" icon="import" style="margin-left: 8px">导出excel</a-button>
            </span>
          </a-col>
        </a-row>
      </a-form>
    </div>
    <!-- 查询区域-END -->

    <!-- 操作按钮区域 -->


    <!-- table区域-begin -->
    <div>
      <div class="ant-alert ant-alert-info" style="margin-bottom: 16px;">
        <i class="anticon anticon-info-circle ant-alert-icon"></i> 已选择 <a style="font-weight: 600">{{ selectedRowKeys.length }}</a>项
        <a style="margin-left: 24px" @click="onClearSelected">清空</a>
      </div>

      <a-table
        ref="table"
        rowKey="id"
        size="middle"
        :columns="columns"
        :loading="loading"
        :rowSelection="{selectedRowKeys: selectedRowKeys, onChange: selectChanges}"
        :dataSource="dataSource"
        :pagination="false">
      <span slot="action" slot-scope="text, record">
        <a @click="handleBack(record.id)"><a-icon type="redo"/>查看</a>
      </span>
      </a-table>
    </div>

  </a-card>
</template>

<script>
import {queryBomProcess} from '@/api/api'
import { JeecgListMixin } from '@/mixins/JeecgListMixin'
import importBom from './modules/importBom'
import {getBomInfoId} from "../../api/api";
import {downFile} from '@/api/manage'
export default {
  name: "PBOMList",
  mixins:[JeecgListMixin],
  components: {
    importBom
  },
  data () {
    return {
      modalWidth: '90%',
      modalStyle: { 'top': '20px'},
      title: '操作',
      visible: false,
      pro_no:'',
      pno_no:'',
      js:'',
      uuid:'',
      no: '',
      cno:'',
      name:'',
      f08:'',
      loading: false,
      dataSource:[],
      bomIdList:[],
      labelCol: {
        xs: { span: 24 },
        sm: { span: 5 },
      },
      wrapperCol: {
        xs: { span: 24 },
        sm: { span: 16 },
      },
      columns:[
        {
          title: '#',
          dataIndex: '',
          key: 'rowIndex',
          width: 120,
          align: "center",
          customRender: function (t, r, index) {
            return parseInt(index) + 1;
          }
        },
        {
          title: '图号',
          dataIndex: 'f08',
          key: 'f08'
        },
        {
          title: '上级编码',
          dataIndex: 'pno',
          key: 'pno'
        },
        {
          title: '物料编码',
          dataIndex: 'cno',
          key: 'cno'
        },
        {
          title: '名称',
          dataIndex: 'name',
          key: 'name'
        }, {
          title: '物料单位',
          dataIndex: 'f02',
          key: 'f02'
        },
        {
          title: '制造方式',
          dataIndex: 'f04',
          key: 'f04'
        },{
          title: 'WIP属性',
          dataIndex: 'f05',
          key: 'f05'
        },{
          title: '工艺',
          dataIndex: 'processName',
          key: 'processName'
        },
        {
          title: '用量',
          dataIndex: 'bnum',
          key: 'bnum'
        },

        // ,
        // {
        //   title: '操作',
        //   dataIndex: 'action',
        //   align: "center",
        //   scopedSlots: {customRender: 'action'}
        // }
      ],
      url: {
        exportXlsUrl: "/pbom/pbom/exportPbomXls",

      },
    }
  },
  created () {
    this.loadFrom()
  },

  methods: {
    bomExportXls(fileName){
      if(!fileName || typeof fileName != "string"){
        fileName = "导出文件"
      }
      let param = this.getQueryParams();
      if(this.no==''){
        this.$message.warning("请先下拉框选择节点编码");
        return false;
      }
      fileName=this.no+fileName;
      this.loading = true
      param.no=this.no
      downFile(this.url.exportXlsUrl,param).then((data)=>{
        if (!data) {
          this.$message.warning("文件下载失败")
          return
        }
        if (typeof window.navigator.msSaveBlob !== 'undefined') {
          window.navigator.msSaveBlob(new Blob([data],{type: 'application/vnd.ms-excel'}), fileName+'.xls')
        }else{
          let url = window.URL.createObjectURL(new Blob([data],{type: 'application/vnd.ms-excel'}))
          let link = document.createElement('a')
          link.style.display = 'none'
          link.href = url
          link.setAttribute('download', fileName+'.xls')
          document.body.appendChild(link)
          link.click()
          document.body.removeChild(link); //下载完成移除元素
          window.URL.revokeObjectURL(url); //释放掉blob对象
          this.loading = false
        }
      })
    },


    loadFrom() {
      getBomInfoId().then((res) => {
        if (res.success) {
          this.bomIdList = res.result
        }
      })

    },
    filterOption(input, option) {
      return (
        option.componentOptions.children[0].text.toLowerCase().indexOf(input.toLowerCase()) >= 0
      );
    },

    handleCancel(){
      this.visible = false
    },


    selectChanges(selectedRowKeys, selectionRows) {
      this.selectedRowKeys = selectedRowKeys;
      this.selectionRows = selectionRows;
      var array='';
      var array2='';
      var array3='';
      this.selectionRows.forEach(function (row) {
        array += row.cno + ",";
        array2 += row.pno + ",";
        array3 += row.bnum + ",";
      });
      this.pro_no=array;
      this.pno_no=array2;
      this.js=array3;
    },

    show(){
      this.visible = true

    },

    searchEnterFun (e){
      var keyCode = window.event ? e.keyCode : e.which;
      if (keyCode == 13) {
        this.queryBom()
      }
    },

    loadData() {

    },
    queryBom(){
      this.onClearSelected()
      this.loading = true
      var params = this.getQueryParams()//查询条件
      params.pno=this.no
      params.name=this.name
      params.f08=this.f08
      this.uuid=this.no
      queryBomProcess(params).then((res) => {
        if (res.code==200) {
          this.dataSource=[];
          this.dataSource = res.result
          this.loading = false
          //this.pro_no=this.no;
        }else{
          this.loading = false
          this.dataSource=[];
          this.$message.error(res.message)
        }
      })
    },
    searchReset() {
      var that = this;
      that.no = "";
      that.name="";
      that.f08="";
    }


  }
}
</script>
<style scoped>
@import '~@assets/less/common.less';
</style>