doors-windows-web/src/views/production/materialprocurement/materialProcurementList.vue

<template>
<div>
    <a-card :bordered="false" class="top" style="margin-bottom:1%">
  
      <!-- 查询区域 -->
      <div class="table-page-search-wrapper">
        <a-form layout="inline" @keyup.enter.native="searchQuery">
          <a-row :gutter="24">
            <a-col :md="4" :sm="24">
              <a-form-item label="生产组织">
                <a-input placeholder="请输入" v-model="queryParam.orgName" ></a-input>
              </a-form-item>
            </a-col>
            <a-col  :md="4" :sm="24">
              <a-form-item label="单据号">
                <a-input placeholder="请输入" v-model="queryParam.orderCode"></a-input>
              </a-form-item>
            </a-col>
            <a-col :md="4" :sm="24">
                <a-form-item label="项目编码">
                  <a-input-search placeholder="请输入" v-model="queryParam.projectCode" ></a-input-search>
                </a-form-item>
              </a-col>
            <a-col :md="4" :sm="24">
                <a-form-item label="单据日期">
                <a-range-picker v-model="orderDate"  style="width: 100%;" @change="changeStartDate" />
                  <!-- <a-date-picker showTime valueFormat="YYYY-MM-DD" format = "YYYY-MM-DD" v-model="queryParam.transferDate" style="width: 100%"/>            -->
                </a-form-item>
              </a-col>
              <a-col :md="4" :sm="24">
                <a-form-item label="单据状态">
                  <a-select v-model="queryParam.state"  style='width:100%' >
                    <a-select-option value='开立'> 开立</a-select-option>
                        <a-select-option value='审核'> 审核</a-select-option>
                        <a-select-option value='已运算'> 已运算</a-select-option>
                        <a-select-option value='关闭'> 关闭</a-select-option>
                   </a-select>
                </a-form-item>
              </a-col>
            <template v-if="toggleSearchStatus">
              
              <a-col :md="4" :sm="24">
                <a-form-item label="计划部门">
                <a-input placeholder="请输入" v-model="queryParam.planDept" ></a-input>
              </a-form-item>
              </a-col>
              <a-col :md="4" :sm="24">
                <a-form-item label="项目编码">
                  <a-input placeholder="请输入" v-model="queryParam.projectCode"></a-input>
                </a-form-item>
              </a-col>
              <a-col :md="4" :sm="24">
                <a-form-item label="工单号">
                  <a-input placeholder="请输入" v-model="queryParam.workNo"></a-input>
                </a-form-item>
              </a-col>
              <a-col :md="4" :sm="24">
                <a-form-item label="业务类型">
                  <a-select v-model="queryParam.type"  style='width:100%' >
                    <a-select-option value='1'> 1</a-select-option>
                   </a-select>
                </a-form-item>
              </a-col>
            </template>
            <a-col  :md="4" :sm="24">
              <span style="float: left;overflow: hidden;" class="table-page-search-submitButtons">
                <a-button type="primary" @click="searchQuery" icon="search">查询</a-button>
                <a-button type="primary" @click="searchReset" icon="reload" style="margin-left: 8px">重置</a-button>
                <a @click="handleToggleSearch" style="margin-left: 8px">
                  {{ toggleSearchStatus ? '收起' : '展开' }}
                  <a-icon :type="toggleSearchStatus ? 'up' : 'down'"/>
                </a>
              </span>
            </a-col>
  
          </a-row>
        </a-form>
      </div>
    </a-card>
    
    <a-card class="middle" style="margin-bottom:1%">
      <!-- 操作按钮区域 -->
      <div class="table-operator">
        <a-button type="danger" size="small" @click='addList'>新增</a-button>
        <a-button  size="small" @click='addEdit'>修改</a-button>
        <a-button size="small" @click="delecteList()">删除</a-button>
        <a-button  size="small" @click="detailList">详情</a-button>
        <a-button  size="small" @click="examineApprove">审批</a-button>
        <a-button  size="small" @click="abstainExamineApprove">弃审</a-button>
        <a-button size="small" @click="exportList('材料请购单')">导出</a-button>
        <a-upload name="file" :showUploadList="false" :multiple="false" :headers="tokenHeader" :action="importExcelUrl">
            <a-button  size="small">导入</a-button>
        </a-upload>
        <a-button  size="small" @click="entireClose">整单关闭</a-button>
        <a-button  size="small" @click="synchronizationData">同步请购单</a-button>
      </div>
  
      <!-- table区域-begin -->
      <div>  
        <a-table
          ref="table"
          size="middle"
          bordered
          rowKey="id"
          :columns="columns"
          :dataSource="dataSource"
          :pagination="ipagination"
          :scroll="{ x: 1500, y: 300 }"
          :rowSelection="{selectedRowKeys: selectedRowKeys, onChange: onSelectChange}"
          @change="handleTableChange"
          :customRow ="clickRow"
          >
  
        </a-table>
      </div>
      <!-- table区域-end -->
  
    </a-card>
    <materialProcurementAdd ref="materialProcurementAdd" @ok='getTableList'></materialProcurementAdd>
    <materialProcurementDetail ref="materialProcurementDetail" ></materialProcurementDetail>
</div>
</template>
  
  <script>
  
    import { JeecgListMixin } from '@/mixins/JeecgListMixin'
    import moment from 'dayjs'
    import { httpAction ,getAction,postAction,putAction,deleteAction,downFile} from '@/api/manage'
    import {queryDepartTreeList} from '@/api/api'
    import materialProcurementAdd from './modules/materialProcurementAdd'
    import materialProcurementDetail from './modules/materialProcurementDetail'
    import alertModal from '../../../plugins/modal'
    import { Message } from "element-ui";
    //---------workflow  by fhf end -------------
    export default {
      name: "materialProcurementList",
      mixins: [JeecgListMixin],
      components: {
        materialProcurementAdd,
        materialProcurementDetail,
      },
      data () {
        return {
          description: '材料请购单页面',
          queryParam:{},
          selectedRowKeys:[],
          selectedRows:[],
          documentData:[],
          orderDate:[],
          toggleSearchStatus:false,
          dataSource:[ ],
          ipagination:{
            current: 1,
            pageSize: 10,
            pageSizeOptions: ['10', '20', '30'],
            showTotal: (total, range) => {
                return range[0] + '-' + range[1] + ' 共' + total + '条'
            },
            showQuickJumper: true,
            showSizeChanger: true,
            total: 0
          },
          // 表头
          columns: [
            {
              title: '#',
              dataIndex: '',
              key: 'rowIndex',
              width: 60,
              align: "center",
              customRender:function (t, r, index) {
                return parseInt(index)+1;
              }
            },
            {
              title: '生产组织',
              align:"center",
              dataIndex: 'orgName',
              ellipsis: true,

            },
            {
              title: '单据号',
              align:"center",
              dataIndex: 'orderCode',
              ellipsis: true,

            },
            {
              title: '单据日期',
              align:"center",
              dataIndex: 'orderDate',
              ellipsis: true,

            },
            {
              title: '单据状态',
              align:"center",
              dataIndex: 'state',
              ellipsis: true,

            },
            {
              title: '业务员',
              align:"center",
              dataIndex: 'salesperson',
              ellipsis: true,

            },
            {
              title: '计划部门',
              align:"center",
              dataIndex: 'planDept',
              ellipsis: true,

            },
            {
              title: '项目编码',
              align:"center",
              dataIndex: 'projectCode',
              ellipsis: true,

            },
            {
              title: '备注',
              align:"center",
              dataIndex: 'remarks',
              ellipsis: true,

            },
            {
              title: '工单号',
              align:"center",
              dataIndex: 'workNo',
              ellipsis: true,

            },
            {
              title: '业务类型',
              align:"center",
              dataIndex: 'type',
              ellipsis: true,

            },
            {
              title: '制单人',
              align:"center",
              dataIndex: 'createBy',
              ellipsis: true,

            },
            {
              title: '审批人',
              align:"center",
              dataIndex: 'reviewer',
              ellipsis: true,
            },
          ],
          importExcelUrl:'/production/safetyStock/importExcel',
             // ---------workflow  by fhf start -------------
          serviceName: 'assetAllocationService',
          // ---------workflow  by fhf end -------------
          }
        },
        computed: {
          importExcelUrl: function(){
              return `${window._CONFIG['domianURL']}/${this.importExcelUrl}`;
          },
        },
  
      created () {
        this.getTableList()
       },
      methods: {
        //获取数据
        getTableList(){
          alertModal.loading("执行中，请稍后！")
          getAction('/materialRequisition/madeMaterialRequisition/list',this.queryParam).then(res=>{
                    alertModal.closeLoading();
                    if(res.success){
                       this.dataSource =res.result.records
                       this.ipagination = {
                            total: res.result.total,
                            current: res.result.current,
                            pageSize: res.result.size
                        }
                    }else{
                      this.$message.error(res.message);
                    }
                })
        },
        //查询
        searchQuery(){
          this.queryParam.pageNo=1
          this.getTableList()
        },
        //单据日期
        changeStartDate(data){
          this.orderDate = data
          this.queryParam.orderDate_begin = data.length==2?moment(data[0]).format('YYYY-MM-DD'):''
          this.queryParam.orderDate_end = data.length==2?moment(data[1]).format('YYYY-MM-DD'):''
        },
        onSearch(){
        },
        //重置
        searchReset(){
            this.queryParam={}
            this.orderDate = []
            this.getTableList()
        },
        //新增
        addList(){
            this.$refs.materialProcurementAdd.visible=true
            this.$refs.materialProcurementAdd.defaultMethod='add'
        },
        //编辑
        addEdit(){
          if(this.selectedRowKeys.length==0){
            this.$message.warning('请选择数据！')
          }else if(this.selectedRowKeys.length>1){
            this.$message.warning('请选择一条数据！')
          }else if(this.selectedRows[0].state!=='开立'){
            this.$message.warning('请选择状态为开立的数据 ！')
          }else{
            this.$refs.materialProcurementAdd.visible=true
            this.$refs.materialProcurementAdd.defaultMethod='edit'
            this.$refs.materialProcurementAdd.visible=true
            //获取主表信息
            this.$refs.materialProcurementAdd.getMainData(this.selectedRowKeys[0])
          }
        },
        //审批
        examineApprove(){
          if(this.selectedRowKeys.length==0){
            this.$message.warning('请选择数据！')
          }else{
            this.$confirm({
              title: '确认审批',
              content: '是否审批选中数据?',
              onOk:  ()=> {
                var ids =  this.selectedRowKeys.toString()
                alertModal.loading("执行中，请稍后！")
                getAction('/materialRequisition/madeMaterialRequisition/reviewerByIds',{ids:ids}).then(res=>{
                    alertModal.closeLoading();
                    if(res.success){
                      var arr = res.message.split(";");
                      var str = arr.join(' <br/> ');
                      this.getTableList()
                      Message({
                        dangerouslyUseHTMLString: true,
                        message: str,
                        type: 'info'
                      });
                    }else{
                      var arr = res.message.split(";");
                      var str = arr.join(' <br/> ');
                      Message({
                        dangerouslyUseHTMLString: true,
                        message: str,
                        type: 'error'
                      });
                    }
                })
              }
            })
          }
        },
        //弃审
        abstainExamineApprove(){
          if(this.selectedRowKeys.length==0){
            this.$message.warning('请选择数据！')
          }else{
            this.$confirm({
              title: '确认弃审',
              content: '是否弃审选中数据?',
              onOk:  ()=> {
                var ids =  this.selectedRowKeys.toString()
                alertModal.loading("执行中，请稍后！")
                getAction('/materialRequisition/madeMaterialRequisition/unReviewerByIds',{ids:ids}).then(res=>{
                    alertModal.closeLoading();
                    if(res.success){
                      var arr = res.message.split(";");
                      var str = arr.join(' <br/> ');
                      this.getTableList()
                      Message({
                        dangerouslyUseHTMLString: true,
                        message: str,
                        type: 'info'
                      });
                    }else{
                      var arr = res.message.split(";");
                      var str = arr.join(' <br/> ');
                      Message({
                        dangerouslyUseHTMLString: true,
                        message: str,
                        type: 'error'
                      });
                    }
                })
              }
            })
          }
        },
        //整单关闭
        entireClose(){
          if(this.selectedRowKeys.length==0){
            this.$message.warning('请选择数据！')
          }else{
            var arr = []
            this.selectedRows.map(item=>{
              arr.push(item.state)
            })
            if(arr.includes('已运算')){
              this.$message.warning("勾选数据里包含状态为已运算的数据，请重新选择！")
            }else if(arr.includes('已请购')){
              this.$message.warning("勾选数据里包含状态为已请购的数据，请重新选择！")
            }else{
                this.$confirm({
                  title: '确认整单关闭',
                  content: '是否整单关闭选中数据?',
                  onOk:  ()=> {
                    var ids =  this.selectedRowKeys.toString()
                    alertModal.loading("执行中，请稍后！")
                    getAction('/materialRequisition/madeMaterialRequisition/closeOrder',{ids:ids}).then(res=>{
                      alertModal.closeLoading();
                      if(res.success){
                        var arr = res.message.split(";");
                        var str = arr.join(' <br/> ');
                        this.getTableList()
                        Message({
                          dangerouslyUseHTMLString: true,
                          message: str,
                          type: 'info'
                        });
                      }else{
                        var arr = res.message.split(";");
                        var str = arr.join(' <br/> ');
                        Message({
                          dangerouslyUseHTMLString: true,
                          message: str,
                          type: 'error'
                        });
                      }
                    })
                  }
                })
            }
          }
        },
        //删除
        delecteList(){
          if(this.selectedRowKeys.length==0){
            this.$message.warning('请勾选数据！')
          }else if(this.selectedRowKeys.length==1){
            this.$confirm({
              title: '确认删除',
              content: '是否删除选中数据?',
              onOk:  ()=>{
                  alertModal.loading("执行中，请稍后！")
                  deleteAction('/materialRequisition/madeMaterialRequisition/delete', {id: this.selectedRowKeys[0]}).then((res) => {
                      alertModal.closeLoading();
                      if (res.success) {
                        this.$message.success('删除成功！');
                        this.getTableList()
                      } else {
                        this.$message.error(res.message);
                      }
                  });
              }
            })
          }else{
            this.$confirm({
              title: '确认删除',
              content: '是否删除选中数据?',
              onOk:  ()=> {
                var ids =  this.selectedRowKeys.toString()
                alertModal.loading("执行中，请稍后！")
                deleteAction('/materialRequisition/madeMaterialRequisition/deleteBatch', {ids: ids}).then((res) => {
                    alertModal.closeLoading();
                    if (res.success) {
                        this.$message.success('删除成功！');
                        this.getTableList()
                    } else {
                      this.$message.error(res.message);
                    }
                });
              }
            })
          }
        },
        //勾选
        onSelectChange(selectedRowKeys, selectionRows) {
          this.selectedRowKeys = selectedRowKeys;
          this.selectedRows = selectionRows;
        },
        handleTableChange(pagination, filters, sorter) {
            this.queryParam.pageNo = pagination.current
            this.queryParam.pageSize = pagination.pageSize
            this.getTableList()
        },
        detailList(){
              if(this.selectedRowKeys.length==0){
                this.$message.warning('请选择数据！')
              }else if(this.selectedRowKeys.length>1){
                this.$message.warning('请选择一条数据！')
              }else{
                this.$refs.materialProcurementDetail.visible=true
                  //获取主表信息
                this.$refs.materialProcurementDetail.getMainData(this.selectedRowKeys[0])
              }
            },
        //双击
        clickRow(record, index){
          return {
            on: {
              dblclick: () => {
                this.$refs.materialProcurementDetail.visible=true
                  //获取主表信息
                this.$refs.materialProcurementDetail.getMainData(record.id)
              },
            }
          }       
       },
       //导出
       exportList(fileName){
        this.$confirm({
          title: '确认导出',
          content: '是否导出数据?',
          onOk:  ()=> {
            alertModal.loading("执行中，请稍后！")
            downFile('/materialRequisition/madeMaterialRequisition/exportXls', this.queryParam).then(data => {
              alertModal.closeLoading();
              if (!data) {
                this.$message.warning('文件下载失败')
                return
              }
              if (typeof window.navigator.msSaveBlob !== 'undefined') {
                window.navigator.msSaveBlob(new Blob([data], { type: 'application/vnd.ms-excel' }), fileName + '.xlsx')
              } 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 + '.xlsx')
                document.body.appendChild(link)
                link.click()
                document.body.removeChild(link) // 下载完成移除元素
                window.URL.revokeObjectURL(url) // 释放掉blob对象
              }
           })   
         }
        })
      },
      //请购单
      synchronizationData(){
        var arrType = []
        this.selectedRows.map(item=>{
          arrType.push(item.type)
        })
        if(arrType.includes('工装')){
              this.$message.warning("勾选数据里包含工装数据，不允许同步请购单！")
        }else{
          this.$confirm({
            title: '确认同步请购单',
            content: '是否同步请购单?',
            onOk:  ()=> {
              var ids =  this.selectedRowKeys.toString()
                alertModal.loading("执行中，请稍后！")
                getAction('/materialRequisition/madeMaterialRequisition/syncRequisition',{ids:ids}).then(res=>{
                    alertModal.closeLoading();
                    if(res.success){
                      debugger
                      var arr = res.message.split(";");
                      debugger
                      var str = arr.join(' <br/> ');
                      this.getTableList()
                      Message({
                        dangerouslyUseHTMLString: true,
                        message: str,
                        type: 'info'
                      });
                    }else{
                      debugger
                      var arr = res.message.split(";");
                      var str = arr.join(' <br/> ');
                      Message({
                        dangerouslyUseHTMLString: true,
                        message: str,
                        type: 'error'
                      });
                    }
                })
             }
          })
        }
      }
    }
}
  </script>
  <style scoped lang="less">
    /* @import '~@assets/less/common.less' */
    /deep/.ant-input{
        height:29px;
    }
    /deep/.ant-select-selection--single {
        height: 29px;
        
    }
    /deep/.ant-select{
        font-size: 12px;
    }
    /deep/.ant-form label{
        font-size: 12px;
    }
    /deep/.table-page-search-wrapper .ant-form-inline .ant-form-item{
        margin-bottom:9px
    }
    /deep/.top>.ant-card-body{
        padding-bottom:0px;
        padding-top: 12px;
    }
    /deep/.ant-btn{
        height:28px
    }
    /deep/.ant-table-thead > tr > th{
        padding: 6px 8px !important;
    }
    /deep/ .ant-table-tbody > tr > td{
        padding: 6px 8px !important;
    }
    /deep/ .ant-table{
        font-size:12px
    }
    /deep/.ant-table-fixed-header .ant-table-scroll .ant-table-header{
        width: calc(100% + 9px);//减去滚动条的宽度
    }
    /deep/.middle>.ant-card-body{
        padding-bottom:2px;
        padding-top:14px;
    }
    /deep/.ant-select-sm .ant-select-selection__rendered{
        line-height: 27px;
    }
  </style>